{# LIBRARIES #}
{{ attach_library('ui_patterns/tourism_hub_fares_block.tourism_hub_fares_block_lib') }}

{% if origins %}
  <div id="th-fares-section" class="mb-5">
    {% if bg_image %}
      <div class="th-fares-image-container">
        {{ bg_image }}
      </div>
    {% endif %}
    <h2>{{ header|raw }}</h2>

    <div class="th-origins">
      <div class="row gx-5 g-2">
      {% for origin in origins %}
        {% set button_attributes = create_attribute()
          .setAttribute("data-from-station", origin.crs)
          .setAttribute("data-to-station", destination_crs)
        %}
        <div class="col-md-6">
          <div class="th-origin mb-3 pb-3">
            <span class="origin-name">{{ origin.station }}</span>
            <div class="origin-fare pt-3">
              <span class="fs-lg">From</span><br>
              <span class="th-fare">£{{ origin.fare }}</span>
            </div>
            {% include '@atoms/form/button/button.twig' with {
              'text': 'Buy',
              'value': '',
              'class': 'buy-tickets-btn btn-transparent-light mt-3 m-0 px-4 py-2',
              'attributes': button_attributes
            } only %}
          </div>
        </div>
      {% endfor %}
      </div>
    </div>
  </div>
{% endif %}