:root {
    --magenta: #E2007A;
    --vert: #8DC63F;
    --noir: #2d2d2d;
    --blanc: #ffffff;
    --gris-clair: #f8f9fa;
    --shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
}

/* --- RESET & BASE --- */
* { 
    box-sizing: border-box; 
    margin: 0; 
    padding: 0; 
}

body { 
    font-family: 'Montserrat', sans-serif; 
    color: var(--noir); 
    background: #ffffff; 
    line-height: 1.6; 
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3 { 
    font-family: 'Quicksand', sans-serif; 
    font-weight: 700; 
}

a { text-decoration: none; color: inherit; }

/* --- HEADER & NAVIGATION --- */
/* Ancres (ex. cgv.php#evenements) : le titre visé ne passe pas sous le menu fixe */
html { scroll-padding-top: 110px; }

header { 
    background: var(--blanc); 
    position: sticky; 
    top: 0; 
    z-index: 1000; 
    border-bottom: 5px solid var(--vert); 
    box-shadow: var(--shadow); 
}

nav { 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    padding: 0 5%; 
    height: 80px; 
    max-width: 1200px; 
    margin: 0 auto; 
}

.logo img { height: 60px; }

/* --- MENU BURGER --- */
.menu-toggle {
    display: none;
    flex-direction: column;
    cursor: pointer;
    gap: 5px;
    padding: 10px;
}

.bar {
    width: 25px;
    height: 3px;
    background-color: var(--magenta);
    transition: all 0.3s ease;
}

.nav-links { 
    list-style: none; 
    display: flex; 
    gap: 20px; 
    align-items: center; 
}

.nav-links a { 
    font-weight: 600; 
    font-size: 0.9rem; 
    transition: 0.3s; 
}

.nav-links a:hover { color: var(--magenta); }

.btn-adherent { 
    background: var(--magenta); 
    color: white !important; 
    padding: 10px 24px; 
    border-radius: 50px; 
    font-weight: 700;
    transition: 0.3s;
}

.btn-adherent:hover { opacity: 0.9; transform: scale(1.05); }

/* --- ACCUEIL (index.php) --- */
.home-main {
    min-height: 65vh; 
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle at center, #ffffff 0%, var(--gris-clair) 100%);
    text-align: center;
}

.intro-text {
    max-width: 800px;
    padding: 0 20px;
}

.intro-text h1 {
    color: var(--magenta);
    font-size: 2.2rem;
    margin-bottom: 20px;
}

.home-cta { margin-top: 40px; }

.btn-home-main {
    display: inline-block;
    background: var(--vert);
    color: white !important;
    padding: 20px 40px;
    border-radius: 50px;
    font-size: 1.3rem;
    font-weight: 700;
    font-family: 'Quicksand', sans-serif;
    transition: all 0.3s ease;
    box-shadow: 0 10px 20px rgba(141, 198, 63, 0.3);
}

.btn-home-main:hover {
    background: var(--magenta);
    transform: translateY(-5px);
    box-shadow: 0 15px 25px rgba(226, 0, 122, 0.3);
}

/* --- SECTION INFOS BAS DE PAGE --- */
.home-info { padding: 80px 5%; background: var(--blanc); }
.info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
    max-width: 1100px;
    margin: 0 auto;
}
.info-card {
    background: var(--gris-clair);
    padding: 40px 30px;
    border-radius: 20px;
    text-align: center;
    border-top: 5px solid var(--vert);
    transition: all 0.3s ease;
}
.info-card:hover { transform: translateY(-10px); background: #ffffff; box-shadow: var(--shadow); }
.info-icon { font-size: 2.5rem; margin-bottom: 20px; display: block; }

/* --- CARROUSEL --- */
.hero-slider { 
    background: var(--gris-clair); 
    padding: 30px 0; 
    display: flex; 
    justify-content: center; 
    width: 100%;
    overflow: hidden;
}

.swiper { 
    width: 95%; 
    max-width: 850px; 
    border-radius: 20px; 
    overflow: hidden; 
    background: white; 
    box-shadow: var(--shadow); 
}

.slide-wrapper { display: flex; flex-direction: column; align-items: center; background: white; }

/* Ajout pour centrer le titre vert et l'image */
.slide-main-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    width: 100%;
}

.slide-image-container { 
    height: 400px; 
    width: 100%; 
    display: flex; 
    justify-content: center; 
    align-items: center; 
    padding: 20px; 
}

.slide-image-container img { 
    max-height: 100%; 
    max-width: 100%; 
    object-fit: contain; 
}

.slide-text-footer { padding: 10px 20px 45px; text-align: center; width: 100%; }

.titre-vert { 
    color: var(--vert); 
    font-size: 1.5rem; 
    margin: 15px 0 5px; 
    display: block; 
    text-align: center; /* Centrage explicite */
}

/* Mise en forme des boutons carrousel */
.slide-actions { 
    display: flex; 
    justify-content: center; 
    gap: 15px; 
    margin-top: 15px; 
}

.btn-slide {
    padding: 10px 24px;
    border-radius: 50px; 
    font-size: 0.9rem;
    font-weight: 700;
    transition: all 0.3s ease;
    min-width: 140px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 2px solid transparent;
}

.btn-inscrire-mini { background: var(--magenta); color: white !important; }
.btn-inscrire-mini:hover { background: transparent; color: var(--magenta) !important; border-color: var(--magenta); }

.btn-aider-mini { background: var(--vert); color: white !important; }
.btn-aider-mini:hover { background: transparent; color: var(--vert) !important; border-color: var(--vert); }

/* --- �0�7V�0�7NEMENTS (evenements.php) --- */
.events-container { max-width: 900px; margin: 40px auto; padding: 0 15px; }
.page-title { color: var(--magenta); text-align: center; font-size: 2.2rem; margin-bottom: 40px; }

.event-card { 
    display: flex; 
    background: white; 
    border-radius: 15px; 
    box-shadow: var(--shadow); 
    margin-bottom: 30px; 
    border-left: 8px solid var(--vert); 
    overflow: hidden; 
}

.event-img-box { 
    width: 200px; 
    flex-shrink: 0; 
    background: #fafafa; 
    display: flex; 
    align-items: center; 
    justify-content: center;
    padding: 15px; 
    border-right: 1px solid #f0f0f0; 
    cursor: pointer;
}

.event-img-box img { max-width: 100%; max-height: 180px; object-fit: contain; }

.event-body { padding: 25px; flex-grow: 1; display: flex; flex-direction: column; }
.event-content-flex { display: flex; justify-content: space-between; gap: 20px; }
.event-text h2 { color: var(--magenta); font-size: 1.5rem; margin-bottom: 10px; }
.event-desc { color: #555; font-size: 0.95rem; margin-bottom: 15px; }

.event-footer-dates { margin-bottom: 15px; font-weight: 600; color: var(--vert); }

.event-actions { display: flex; flex-direction: column; gap: 10px; width: 220px; flex-shrink: 0; }

.btn-action-evt { 
    padding: 12px; 
    border-radius: 8px; 
    font-weight: 700; 
    font-size: 0.9rem; 
    transition: 0.3s;
    text-align: center;
}

.btn-inscrire { background: var(--magenta); color: white; border: 2px solid var(--magenta); }
.btn-aider { background: white; color: var(--vert); border: 2px solid var(--vert); }

/* --- BADGES --- */
.status-badge { display: inline-block; padding: 4px 12px; border-radius: 20px; font-size: 0.75rem; font-weight: 800; text-transform: uppercase; margin-bottom: 10px; }
.tag-avenir { background: #e8f5e9; color: #2e7d32; }
.tag-archive { background: #f5f5f5; color: #777; }

/* --- MODALE IMAGE --- */
#imgModal { display:none; position:fixed; z-index:9999; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.9); }
#fullImg { margin:auto; display:block; max-width:90%; max-height:90%; position:relative; top:50%; transform:translateY(-50%); border-radius:10px; }

/* --- FOOTER --- */
footer { background: var(--noir); color: white; padding: 60px 0 30px; text-align: center; margin-top: 60px; }
.footer-bottom { margin-top: 40px; font-size: 0.85rem; opacity: 0.6; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 20px; }
footer a { color: #fff; }
.footer-legal { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 22px; margin-top: 18px; font-size: 0.85rem; }
.footer-legal a { color: rgba(255,255,255,0.8); text-decoration: none; }
.footer-legal a:hover { color: #fff; text-decoration: underline; }

/* --- PAGES LÉGALES (mentions, confidentialité, CGV) --- */
.legal { max-width: 820px; margin: 50px auto; padding: 0 20px; line-height: 1.7; color: #333; }
.legal h1 { color: var(--magenta); font-size: 1.9rem; margin-bottom: 6px; }
.legal .maj { color: #888; font-size: 0.85rem; margin-bottom: 30px; }
.legal h2 { color: var(--noir); font-size: 1.2rem; margin: 36px 0 10px; padding-bottom: 6px; border-bottom: 2px solid var(--vert); }
.legal h3 { font-size: 1rem; margin: 22px 0 6px; }
.legal p { margin: 0 0 12px; }
.legal ul { padding-left: 22px; margin: 0 0 14px; }
.legal li { margin-bottom: 6px; }
.legal a { color: var(--magenta); }
.legal .sommaire { background: #f7f7f7; border-radius: 14px; padding: 16px 22px; font-size: 0.92rem; }
.legal .sommaire ol { margin: 6px 0 0; padding-left: 20px; }
.legal-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; margin: 12px 0; }
.legal-table th, .legal-table td { text-align: left; vertical-align: top; padding: 10px; border-bottom: 1px solid #eee; }
.legal-table th { background: #fafafa; font-weight: 700; }
.table-scroll { overflow-x: auto; }
mark.a-completer { background: #fff3a8; padding: 0 4px; border-radius: 4px; }
.info-rgpd { font-size: 0.78rem; color: #888; line-height: 1.5; margin-top: 12px; }
.info-rgpd a { color: inherit; text-decoration: underline; }

/* --- RESPONSIVE MOBILE --- */
@media (max-width: 768px) {
    .menu-toggle { display: flex; z-index: 1001; }
    .nav-links {
        position: fixed;
        right: -100%;
        top: 80px;
        flex-direction: column;
        background: var(--blanc);
        width: 100%;
        height: calc(100vh - 80px);
        transition: 0.3s;
        box-shadow: 0 10px 15px rgba(0,0,0,0.1);
        padding-top: 50px;
        gap: 30px;
        z-index: 1000;
    }
    .nav-links.active { right: 0; }
    .menu-toggle.is-active .bar:nth-child(2) { opacity: 0; }
    .menu-toggle.is-active .bar:nth-child(1) { transform: translateY(8px) rotate(45deg); }
    .menu-toggle.is-active .bar:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

    nav { height: 75px; }
    .logo img { height: 45px; }

    .hero-slider { padding: 15px 0; }
    .swiper { width: 92%; }
    .slide-image-container { height: 250px; }
    .titre-vert { font-size: 1.2rem; }
    .slide-actions { flex-direction: column; width: 100%; padding: 0 10px; gap: 8px; }
    .btn-slide { width: 100%; min-width: unset; }

    .event-card { flex-direction: column; border-left: none; border-top: 8px solid var(--vert); }
    .event-img-box { width: 100%; height: 200px; border-right: none; border-bottom: 1px solid #eee; }
    .event-body { padding: 20px; width: 100%; }
    .event-content-flex { flex-direction: column !important; gap: 10px; }
    .event-actions { width: 100% !important; flex-direction: column; margin-top: 5px; }
    .btn-action-evt { width: 100%; padding: 14px; }
}
/* Style pour l'onglet actif */
.nav-links a.active {
    color: var(--magenta) !important;
    font-weight: 700;
    border-bottom: 2px solid var(--magenta); /* Optionnel : souligne le lien */
    
    
    
}