<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    {% set seoTitle = (block('seo_title') is defined ? block('seo_title') : (block('title') is defined ? block('title') : school.name ~ ' | Qur’an et Mutun Talibil Ilm'))|striptags|trim %}
    {% set seoDescription = (block('seo_description') is defined ? block('seo_description') : school.description)|striptags|trim %}
    {% set seoCanonical = (block('seo_canonical') is defined ? block('seo_canonical') : school.route)|striptags|trim %}
    {% set seoImagePath = school.hasHeroImage ? school.heroImage : (school.hasLogo ? school.logo : 'assets/brand/logo-salmad-dark.png') %}
    {% set seoImage = (block('seo_image') is defined ? block('seo_image') : public_absolute_asset_url(ecole, seoImagePath))|striptags|trim %}
    {% set seoType = (block('seo_type') is defined ? block('seo_type') : 'website')|striptags|trim %}
    {% set seoRobots = (block('seo_robots') is defined ? block('seo_robots') : 'index,follow')|striptags|trim %}
    {% include 'public/_seo.html.twig' with {
        seo_title: seoTitle,
        seo_description: seoDescription,
        seo_canonical: seoCanonical,
        seo_image: seoImage,
        seo_type: seoType,
        seo_robots: seoRobots,
        seo_site_name: school.name
    } only %}
    {% block seo_extra %}{% endblock %}
    {% set schoolJsonLd = {
        '@context': 'https://schema.org',
        '@type': 'EducationalOrganization',
        'name': school.name,
        'url': school.route,
        'description': school.description
    } %}
    {% if school.hasLogo %}
        {% set schoolJsonLd = schoolJsonLd|merge({'logo': public_absolute_asset_url(ecole, school.logo)}) %}
    {% endif %}
    <script type="application/ld+json">{{ schoolJsonLd|json_encode|raw }}</script>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Alegreya:wght@600;700;800&family=Inter:wght@400;500;600;700;800;900&display=swap" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" rel="stylesheet">
    <link rel="icon" type="image/png" href="{{ asset(school.favicon) }}">
    <link href="{{ asset('assets/public/themes/sahaba/theme.css') }}" rel="stylesheet">
    <style>
        :root {
            --school-primary: {{ school.colors.primary }};
            --school-secondary: {{ school.colors.secondary }};
            --school-accent: {{ school.colors.accent }};
        }
    </style>
</head>
<body class="sahaba-body">
    <header class="sahaba-header">
        <div class="container sahaba-nav">
            <a class="sahaba-logo" href="{{ school.route }}" aria-label="Accueil {{ school.name }}">
                {% if school.hasLogo %}
                    <img class="sahaba-brand-logo school-logo" src="{{ asset(school.logo) }}" alt="{{ school.name }}">
                {% else %}
                    <span class="sahaba-logo-mark">{{ school.initials }}</span>
                    <span class="sahaba-logo-text">{{ school.name }}</span>
                {% endif %}
            </a>
            <nav class="sahaba-menu d-none d-lg-flex align-items-center" aria-label="Navigation principale">
                <a href="#presentation">Présentation</a>
                <a href="#niveaux">Niveaux</a>
                <a href="#frais">Frais</a>
                <a href="#calendrier">Calendrier</a>
                <a href="#contact">Contact</a>
            </nav>
            <a class="sahaba-cta sahaba-nav-cta" href="{{ school.registrationRoute }}">S’inscrire</a>
        </div>
    </header>

    <main>
        {% block body %}{% endblock %}
    </main>

    <footer class="sahaba-footer">
        <div class="container sahaba-footer-grid">
            <div class="sahaba-footer-main">
                {% if school.hasLogo %}
                    <img class="sahaba-footer-logo school-logo" src="{{ asset(school.footerLogo) }}" alt="{{ school.name }}">
                {% endif %}
                <div class="sahaba-footer-brand">{{ school.name }}</div>
                <p>{{ school.description }}</p>
            </div>
            <div>
                <div class="sahaba-footer-title">Parcours</div>
                <ul class="sahaba-footer-list">
                    <li><a href="#niveaux">Niveaux</a></li>
                    <li><a href="#classes">Classes</a></li>
                    <li><a href="#frais">Frais</a></li>
                    <li><a href="#calendrier">Calendrier</a></li>
                </ul>
            </div>
            <div>
                <div class="sahaba-footer-title">Contacts</div>
                <ul class="sahaba-footer-list">
                    <li>{{ school.phone }}</li>
                    {% if school.phone2 %}
                        <li>{{ school.phone2 }}</li>
                    {% endif %}
                    <li>WhatsApp : {{ school.whatsapp }}</li>
                    <li>{{ school.city }}</li>
                </ul>
            </div>
        </div>
        <div class="container sahaba-footer-bottom">
            <span>Propulsé par SALSABIL Madrassas.</span>
        </div>
    </footer>
</body>
</html>
