<% page_title @page.page_title %>
<!-- Barcelona Theme Generic Page - Mediterranean Styling -->
<section class="bg-gradient-to-r from-med-800 to-med-700 py-6">
  <div class="container mx-auto px-4">
    <div class="flex flex-wrap items-center justify-between">
      <div>
        <h1 class="text-3xl font-display font-bold text-white mb-1">
          <%= @page.main_link.link_title %>
        </h1>
      </div>
      <nav class="hidden md:flex" aria-label="Breadcrumb">
        <ol class="inline-flex items-center space-x-1 md:space-x-3">
          <li class="inline-flex items-center">
            <a href="/" class="text-med-200 hover:text-white transition">
              <i class="fa-solid fa-house mr-1"></i>
              <%= I18n.t("webContentSections.home") %>
            </a>
          </li>
          <li>
            <div class="flex items-center">
              <i class="fa-solid fa-chevron-right text-med-400 mx-2 text-sm"></i>
              <span class="text-white font-medium">
                <%= @page.main_link.link_title %>
              </span>
            </div>
          </li>
        </ol>
      </nav>
    </div>
  </div>
</section>

<section class="bg-warm-50 py-12">
  <div class="container mx-auto px-4">
    <div class="max-w-4xl mx-auto">
      <% @page_contents_for_edit.each_with_index do |page_content, index| %>
        <div class="bg-white rounded-xl shadow-sm border border-warm-200 p-6 lg:p-8 mb-6"
             <%= "data-pwb-page-part=#{page_content.page_part_key}".html_safe if params[:edit_mode] == 'true' %>>
          <% if page_content.is_rails_part %>
            <%= render partial: "pwb/components/#{page_content.page_part_key}", locals: {} rescue nil %>
          <% else %>
            <div class="prose prose-lg max-w-none prose-headings:text-med-800 prose-a:text-med-600 hover:prose-a:text-med-700">
              <%== @content_to_show[index] %>
            </div>
          <% end %>
        </div>
      <% end %>
    </div>
  </div>
</section>
