/* Header with repeating background image */
.site-header,
.container-header {
    background-image: url('/images/header-bg.png') !important;
    background-repeat: repeat !important;
    background-position: top left !important;
    background-size: auto !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.5) !important;
}

/* Optional: Add a subtle overlay for better contrast */
.site-header::before,
.container-header::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.1); /* Light dark overlay */
    pointer-events: none;
}

/* Resize logo and add text */
.navbar-brand {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    position: relative !important;
    z-index: 2 !important; /* Ensure logo stays above overlay */
}

.navbar-brand img {
    max-height: 105px !important;
    width: auto !important;
}

.navbar-brand::after {
    content: "Scouts de la 148e, Notre-Dame-des-Champs";
    font-size: 18px;
    font-weight: bold;
    color: #ffffff !important;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.5) !important; /* Stronger shadow for readability on textured background */
    white-space: pre-line !important; /* This makes the line break work */
}

/* Fond de page du site*/
body {
    background: 
        linear-gradient(rgba(245, 242, 232, 0.5), rgba(245, 242, 232, 0.5)),
        url('/images/site_assets/pine-cones-lying-on-the-green-mossy-floor-of-a-forest-in-a-low-angle-view-with-shallow-SBI-351008178.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    background-position: top right;
}

body.section-castors {
    background: 
        linear-gradient(rgba(245, 242, 232, 0.5), rgba(245, 242, 232, 0.5)),
        url('/images/site_assets/animals-at-the-biodome-pan-up-beaver-dam-SBI-351620455.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    background-position: top right;
}

body.section-louveteaux {
    background: 
        linear-gradient(rgba(245, 242, 232, 0.5), rgba(245, 242, 232, 0.5)),
        url('/images/site_assets/wolf-pack-ai_01.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    background-position: center left;
}

body.section-aventuriers {
    background: 
        linear-gradient(rgba(245, 242, 232, 0.5), rgba(245, 242, 232, 0.5)),
        url('/images/site_assets/milky-way-stars-with-moonlight-above-pine-trees-forest-SBI-349967623.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    background-position: top left;
}
/* Container principal */
.site-main,
.container-fluid,
.container {
    background-color: transparent !important;
}

/* LIMITER LA LARGEUR DE LA GRILLE PRINCIPALE */
/*
.site-grid {
    max-width: 1400px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
}
*/

/* Articles et contenus sur fond blanc avec ombrage */
.blog-item,
.item-page,
.article,
.card,
.mod-articles-news,
.mod-articles-latest,
.content-item,
.com-content-article {
    background-color: #ffffff !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
    margin-bottom: 20px !important;
    padding: 20px !important;
    border: 1px solid #e0ddd4 !important;
}

/* Modules et widgets sur fond blanc */
.moduletable,
.mod-menu,
.sidebar .module {
    background-color: #ffffff !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08) !important;
    margin-bottom: 15px !important;
    padding: 15px !important;
    border: 1px solid #e0ddd4 !important;
}

/* Titres des modules avec fond sombre comme dans l'image */
.moduletable h3,
.module-title,
.card-header {
    background-color: #2c3e50 !important;
    color: #ffffff !important;
    margin: -15px -15px 15px -15px !important;
    padding: 12px 15px !important;
    border-radius: 8px 8px 0 0 !important;
    font-weight: bold !important;
}

/* Contenu principal */
.container-main {
    background-color: transparent !important;
    padding: 20px 0 !important;
}

/* Liens et textes */
.blog-item h2 a,
.item-page h1,
.article-title a {
    color: #2c3e50 !important;
}

.blog-item h2 a:hover,
.article-title a:hover {
    color: #34495e !important;
}

/* Pagination et éléments de navigation */
.pagination,
.page-navigation {
    background-color: #ffffff !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08) !important;
    padding: 15px !important;
    border: 1px solid #e0ddd4 !important;
}

/* Footer */
.site-footer {
    background-color: #ffffff !important;
    border-radius: 8px 8px 0 0 !important;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
    margin-top: 30px !important;
    padding: 20px !important;
    border: 1px solid #e0ddd4 !important;
    border-bottom: none !important;
}

/* Responsive - ajustements pour mobile */
@media (max-width: 768px) {
    .blog-item,
    .item-page,
    .moduletable {
        margin: 10px 5px !important;
        padding: 15px !important;
    }
    
    .moduletable h3 {
        margin: -15px -15px 10px -15px !important;
    }
}

/* --- OVERRIDE COULEURS SCOUTS JEVENTS --- */

/* 1. Flèches de navigation (Mois précédent/Suivant) -> BLEU */
#jevents_body .jev_toprow div.previousmonth, 
#jevents_body .jev_toprow div.nextmonth {
    background-color: #13617f !important;
    border: 1px solid #13617f !important;
}

/* 2. Barre du mois courant (bordures haut/bas) -> BLEU */
#jevents_body .jev_toprow div.currentmonth {
    border-top: 1px solid #13617f !important;
    border-bottom: 1px solid #13617f !important;
    color: #13617f !important;
}

/* 3. Onglets de navigation "Mois/Semaine/Année" -> BLEU */
#jevents_body .nav-items div.active a, 
.jev_header2 .active a {
    background-color: #13617f !important;
    color: #FFF !important;
}
/* Bordures des onglets inactifs */
#jevents_body .nav-items > div {
    border: 1px solid #13617f !important;
    border-left: 0px;
}
#jevents_body .nav-items > div:first-child {
    border-left: 1px solid #13617f !important;
}

/* 4. Effet de survol sur les onglets -> GRIS CLAIR avec bordure BLEUE */
#jevents_body .nav-items > div a:hover, 
.jev_header2 .active a:hover {
    background-color: #FFF !important;
    border-left: 1px solid #13617f !important;
    color: #000 !important;
}

/* 5. CERCLE de la date d'aujourd'hui -> VERT */
#jevents_body .cal_today a.cal_daylink {
    background-color: #12974b !important;
    border: 1px solid #12974b !important;
    border-radius: 10px;
    color: #FFFFFF !important;
}

/* 6. Survol de la date d'aujourd'hui -> Inversion (Texte Vert, Fond Blanc) */
#jevents_body .cal_today a.cal_daylink:hover {
    background-color: #fff !important;
    border: 1px solid #12974b !important;
    color: #12974b !important;
}

/* 7. Liens du mini-calendrier (si affiché quelque part) */
#flatcal_minical .flatcal_todaycell a {
    border: 1px solid #12974b !important;
    background-color: #12974b !important;
}
#flatcal_minical .flatcal_todaycell a:hover {
    color: #555555 !important;
    border: 1px solid #12974b !important;
    background-color: #fff !important;
}

/* --- AVERTISSEMENT AGENDA (Version Conteneur Global) --- */

/* On cible le conteneur gris global (export_form) et on insère le texte au tout début */
#jevents_body div.export_form::before {
    /* Le texte à afficher */
    content: "⚠️ ATTENTION PARENTS :\A Pour avoir les mises à jour automatiques (camps, lieux), choisissez 'S\'abonner' ou 'Google'.\A L'option 'Télécharger' est une copie fixe qui ne se mettra JAMAIS à jour. Cette option est à utiliser seulement si les autres ne fonctionnent pas, mais vous ne recevrez pas automatiquement les changements";
    
    /* Style de la boîte */
    display: block;
    white-space: pre-wrap; /* Gère les sauts de ligne */
    background-color: #fff3cd; /* Fond jaune */
    color: #856404; /* Texte brun */
    border: 1px solid #ffeeba;
    padding: 15px;
    margin-bottom: 15px; /* Espace avant le titre ou les boutons */
    border-radius: 5px;
    font-weight: bold;
    font-size: 14px;
    line-height: 1.5;
    text-align: center;
    width: 100%;
}