{#
/**
 * @file
 * Constructor Theme's implementation of page.html.twig.
 * Uses header and footer partials for consistency.
 */
#}

{% include directory ~ '/templates/partials/header.html.twig' %}

<main id="main-content" class="main-content min-h-screen bg-white dark:bg-slate-900 transition-colors" role="main">
  {% if page.hero %}
    <section class="hero">
      {{ page.hero }}
    </section>
  {% endif %}

  {% if page.highlighted %}
    <div class="highlighted">
      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
        {{ page.highlighted }}
      </div>
    </div>
  {% endif %}

  {% if page.breadcrumb %}
    <div class="breadcrumb-wrapper py-4">
      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
        {{ page.breadcrumb }}
      </div>
    </div>
  {% endif %}

  {% if page.help %}
    <div class="help py-4">
      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
        {{ page.help }}
      </div>
    </div>
  {% endif %}

  {# Main content area #}
  {{ page.content }}

  {% if page.featured_top %}
    <section class="featured-top">
      {{ page.featured_top }}
    </section>
  {% endif %}

  {% if page.featured_bottom %}
    <section class="featured-bottom">
      {{ page.featured_bottom }}
    </section>
  {% endif %}
</main>

{% include directory ~ '/templates/partials/footer.html.twig' %}
