{# LIBRARIES #}
{# Ajax loads template that requires this library #}
{{ attach_library('ui_patterns/chk_serv.chk_serv_lib') }}
{% set message %}
  {% include "@molecules/tm-message/alert/alert.twig" with {
    "content": "Enter your regular journey here and we will save it and always display the status for you.",
    "icon_set": "regular",
    "status": "info",
    "layout": "side_icon",
    "custom_colours": true,
    "alert_class": "mb-3",
  } only %}
{% endset %}

{# TEMPLATE #}
{% if form.vertical['#value'] %}
  <div class="">
    <div class="mb-0">
      {{ form|without('from_station', 'swap_stations', 'to_station', 'search', 'target') }}
    </div>
    <div class="mb-2">
      {{ form.from_station }}
    </div>
    <div class="mb-2">
      {{ form.to_station }}
    </div>
    <div class="">
      {{ form.search }}
    </div>
    <div class="">
      {{ form.target }}
    </div>
  </div>
{% elseif form.is_block['#value'] %}
  <div class="">
    <div class="mb-0">
      {{ form|without('from_station', 'swap_stations', 'to_station', 'search', 'target') }}
      {{ message }}
    </div>
    <div class="mb-3">
      {{ form.from_station }}
    </div>
    <div class="mb-3">
      {{ form.to_station }}
    </div>
    <div class="">
      {{ form.search }}
    </div>
  </div>
{% else %}
  <div class="row">
    <div class="col-md-12">
      {{ form|without('from_station', 'swap_stations', 'to_station', 'search', 'target') }}
    </div>
    <div class="col-md-5">
      {{ form.from_station }}
    </div>
    <div class="col-md-0-hlf p-md-0 my-sm-1 m-md-0 swap text-center">
      {{ form.swap_stations }}
    </div>
    <div class="col-md-5">
      {{ form.to_station }}
    </div>
    <div class="col-md-1-hlf p-md-0 mt-3 m-md-0">
      {{ form.search }}
    </div>
  </div>
  <div class="row">
    <div class="col-md-12">
      {{ form.target }}
    </div>
  </div>
{% endif %}
