/* ============================================
   LYCÉE ELIE VINET - CSS MODULAIRE
   Structure moderne et maintenable
   ============================================ */

/* === 1. VARIABLES === */
@import url("modules/_variables-I-FXA22.css");

/* === 2. BASE ET RESET === */
@import url("modules/_base-1LHjkQ_.css");

/* === 3. NAVIGATION === */
@import url("modules/_navigation-Vfyp05m.css");

/* === 4. BANNIÈRE === */
@import url("modules/_banner-XZmuPVI.css");

/* === 5. PAGE D'ACCUEIL === */
@import url("modules/_homepage-ocatvsR.css");

/* === 6. COMPOSANTS === */
@import url("modules/_components-fY6SOVZ.css");

/* === 7. FOOTER === */
@import url("modules/_footer-x7Ekns5.css");

/* ============================================
   STYLES SPÉCIFIQUES SUPPLÉMENTAIRES
   ============================================ */

/* === CONTAINER PRINCIPAL === */
.container-fluid {
    width: 100%;
    margin: 0 auto;
    padding: 0 15px;
    box-sizing: border-box;
}

.row {
    gap: 0.2rem;
    flex-wrap: wrap;
}

/* === CORRECTIONS GLOBALES === */
* {
    box-sizing: border-box;
}

/* Suppression des marges par défaut sur les éléments principaux */
body, main, section, article, aside, nav, header, footer {
    margin: 0;
    padding: 0;
}

/* === RESPONSIVE GLOBAL === */
@media (max-width: 576px) {
    .container-fluid {
        padding: 0 10px;
    }
}

@media (max-width: 768px) {
    body {
        font-size: 0.8rem;
    }
    
.fo-aside__title {
        font-size: 20px;
    }
}

/* === PRINT STYLES === */
@media print {
    .navbar,
    .carousel-logos,
footer {
        display: none !important;
    }
    
    body {
        font-size: 12pt;
        color: black !important;
        background: white !important;
    }
}

/* === RESPONSIVE TUILES ARTICLES MOBILE === */
@media (max-width: 991.98px) {
    /* === TUILES D'ARTICLES PLUS GRANDES SUR MOBILE === */
    .card {
        margin-bottom: 1.5rem !important;
        border-radius: 12px !important;
        box-shadow: 0 4px 8px rgba(0,0,0,0.1) !important;
    }
    
    .card-img-top {
        height: 250px !important; /* ENCORE plus grand pour la visibilité */
        object-fit: cover !important;
        border-radius: 12px 12px 0 0 !important;
    }
    
    .card-body {
        padding: 2rem !important; /* ENCORE plus d'espace */
    }
    
    .card-title {
        font-size: 2.2rem !important; /* Titre ÉNORME pour mobile */
        font-weight: 700 !important; /* Plus gras */
        line-height: 1.2 !important;
        margin-bottom: 1.5rem !important;
        color: #222 !important; /* Plus foncé */
    }
    
    .card-text {
        font-size: 1.6rem !important; /* Texte d'accroche ÉNORME */
        line-height: 1.5 !important;
        color: #333 !important; /* Encore plus foncé pour lisibilité */
        margin-bottom: 1.5rem !important;
        font-weight: 400 !important;
    }
    
    /* === ARTICLES PAGE D'ACCUEIL (vraies classes utilisées) === */
    .list-group-item {
        padding: 3rem !important; /* ENCORE plus d'espace */
        margin-bottom: 2rem !important;
        border-radius: 15px !important;
    }
    
    .list-group-item .media img {
        width: 120px !important; /* Images réduites pour mobile */
        height: 90px !important; /* Proportionnel */
        object-fit: cover !important;
        border-radius: 8px !important;
        flex-shrink: 0 !important; /* L'image ne rétrécit pas */
    }
    
    .list-group-item .media > div {
        flex: 1 !important; /* Le div texte prend l'espace restant */
        display: flex !important;
        flex-direction: column !important;
        justify-content: flex-start !important;
    }
    
    .list-group-item .titre {
        font-size: 4.8rem !important; /* Titres DOUBLÉS (2.4rem * 2) */
        font-weight: 700 !important;
        line-height: 1.1 !important;
        margin-bottom: 1.5rem !important;
        color: #111 !important; /* Plus foncé */
    }
    
    /* === TITRES H6 SPÉCIFIQUES (dans les articles) === */
    .list-group-item h6.titre,
    .list-group-item h6.font-weight-bold.titre {
        font-size: 4.8rem !important; /* MÊME taille que .titre */
        font-weight: 700 !important;
        line-height: 1.1 !important;
        margin-bottom: 1.5rem !important;
        color: #111 !important;
    }
    
    /* === SPÉCIFICITÉ MAXIMALE POUR ÉCRASER BOOTSTRAP === */
    .list-group-item h6.font-weight-bold.titre.mb-1,
    .list-group-item .media h6.font-weight-bold.titre.mb-1,
    .list-group-item .media div h6.font-weight-bold.titre.mb-1,
    li.list-group-item .media div h6.font-weight-bold.titre.mb-1 {
        font-size: 4.8rem !important; /* FORCER la taille */
        margin-bottom: 1.5rem !important; /* ÉCRASER mb-1 */
        font-weight: 700 !important;
        line-height: 1.1 !important;
        color: #111 !important;
        display: block !important;
    }
    
    .list-group-item .text {
        font-size: 3.6rem !important; /* Textes DOUBLÉS (1.8rem * 2) */
        line-height: 1.3 !important;
        color: #222 !important; /* Plus foncé */
        font-weight: 500 !important; /* Un peu plus gras */
    }
    
    /* === TITRES H5 COMME LARAVEL === */
    .list-group-item h5.font-weight-bold.titre {
        font-size: 1.4rem !important; /* Taille raisonnable mobile */
        font-weight: 700 !important;
        line-height: 1.2 !important;
        color: #333 !important;
        margin-bottom: 0.5rem !important;
    }
    
    /* === ACCROCHES H6 COMME LARAVEL === */
    .list-group-item h6.font-italic.text {
        font-size: 1.1rem !important; /* Taille raisonnable mobile */
        font-style: italic !important;
        color: #666 !important;
        line-height: 1.4 !important;
        margin-bottom: 0 !important;
    }
    
    .list-group-item .media {
        display: flex !important;
        flex-direction: row !important; /* IMAGE À GAUCHE, TEXTE À DROITE */
        align-items: flex-start !important; /* Alignement en haut */
        gap: 2rem !important; /* Espace entre image et texte */
        padding: 1rem !important;
    }
    
    /* === MINIATURES "À LA UNE" (2 par ligne sur mobile) === */
    .miniatures-bloc {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important; /* 2 colonnes */
        gap: 2rem !important; /* Espace entre les miniatures */
        margin: 2rem 0 !important;
    }
    
    .miniatures-bloc a {
        display: block !important;
        text-align: center !important;
    }
    
    .miniatures-bloc .miniature-img {
        width: 100% !important; /* Prendre toute la largeur de la cellule */
        max-width: 300px !important; /* Largeur maximale */
        height: auto !important;
        margin: 0 !important; /* Supprimer les marges par défaut */
        border-radius: 12px !important;
        box-shadow: 0 4px 8px rgba(0,0,0,0.1) !important;
    }
    
    /* === PDF MENU CANTINE SPÉCIFIQUE - SPÉCIFICITÉ MAXIMALE === */
    div[style*="position: fixed"] embed[src*="menu"],
    embed[src*="/menu/"],
    embed[src*="menu/"],
    embed[type="application/pdf"][src*="menu"] {
        width: 100vw !important; /* Pleine largeur de l'écran */
        height: 100vh !important; /* Pleine hauteur de l'écran */
        max-width: none !important; /* Pas de limite */
        min-width: none !important; /* Pas de largeur minimale */
        overflow: visible !important; /* Permettre le scroll */
        transform: none !important; /* Pas de transformation */
        border: none !important;
        margin: 0 !important;
        padding: 0 !important;
        object-fit: contain !important; /* Garder les proportions */
        zoom: 1 !important; /* Pas de zoom */
    }
    
                    /* === PDF PAGES ET ARTICLES === */
                .pdf-container embed,
                embed[src*="/uploads/pages/pdfs/"],
                iframe[src*=".pdf"]:not([src*="/menu/"]) {
                    width: 100% !important; /* S'adapte au conteneur */
                    min-width: 600px !important; /* Largeur minimale lisible */
                    height: 800px !important; /* Hauteur fixe raisonnable */
                    overflow-x: auto !important; /* Scroll horizontal si nécessaire */
                    border: none !important;
                }
                
                /* === SOLUTION LARAVEL POUR IFRAME PDF === */
                iframe[src*="/menu/"] {
                    width: 100% !important;
                    height: 600px !important; /* Mobile */
                    border: none !important;
                    display: block !important;
                    margin: 0 auto !important;
                }
                
                /* === DESKTOP: Plus grand === */
                @media (min-width: 768px) {
                    iframe[src*="/menu/"] {
                        height: 900px !important; /* Desktop comme Laravel */
                    }
                }
    
    /* === CONTENEUR PDF === */
    .pdf-container, 
    .menu-container {
        width: 100vw !important;
        height: 100vh !important;
        overflow: auto !important; /* Scroll dans toutes les directions */
        position: relative !important;
        -webkit-overflow-scrolling: touch !important; /* Scroll fluide sur iOS */
    }
    
    /* === BOUTONS DANS LES TUILES === */
    .card .btn {
        font-size: 1.25rem !important; /* Boutons plus gros */
        padding: 1rem 2rem !important; /* Plus de padding pour le tactile */
        border-radius: 10px !important;
        font-weight: 500 !important;
        min-height: 50px !important; /* Hauteur minimale pour le tactile */
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    /* === LISTE D'ARTICLES RESPONSIVE === */
    .row .col-md-4,
    .row .col-lg-4,
    .row .col-sm-6 {
        margin-bottom: 1.5rem !important;
    }
    
    /* === SECTIONS AVEC TITRES === */
    .section-title,
    h2.section-title,
    .h2 {
        font-size: 1.8rem !important;
        margin-bottom: 1.5rem !important;
        text-align: center !important;
        font-weight: 600 !important;
    }
    
    /* === ACTUALITÉS ET INFOS PRATIQUES === */
    .actualites .card,
    .infos-pratiques .card {
        margin-bottom: 1.5rem !important;
    }
    
    .actualites .card-title,
    .infos-pratiques .card-title {
        font-size: 1.3rem !important;
        line-height: 1.4 !important;
    }
    
    .actualites .card-text,
    .infos-pratiques .card-text {
        font-size: 1rem !important;
        line-height: 1.5 !important;
    }
}
