:root {
    --zilom-blue: #1363DF;
    --zilom-dark: #082A5E;
    --zilom-donation: #FF5A5F;

    /* Ajout de l'image de fond ici */
    --footer-bg-image: url('https://images.unsplash.com/photo-1524178232363-1fb2b075b655?auto=format&fit=crop&w=1400');

    /* Tu peux aussi stocker l'opacité du voile ici (0.92 = 92% sombre) */
    --footer-overlay: rgba(8, 42, 94, 0.92);

}

body { font-family: 'Jost', sans-serif; margin: 0; overflow-x: hidden; }

.fixed-header { position: fixed; top: 0; width: 100%; z-index: 2000; transition: 0.4s; }

/* --- TOP BAR --- */
.top-bar { background-color: var(--zilom-dark); color: white; padding: 10px 0; font-size: 14px; min-height: 48px; }
.top-bar a { color: white; text-decoration: none; }

.top-marquee-pc { flex: 1; overflow: hidden; margin: 0 20px; white-space: nowrap; }
.top-marquee-pc .marquee-inner { display: inline-block; animation: scroll-pc 15s linear infinite; }
@keyframes scroll-pc { 0% { transform: translateX(100%); } 100% { transform: translateX(-100%); } }

/* --- NAVBAR --- */
.navbar { background: white; border-bottom: 1px solid #eee; padding: 15px 0; transition: 0.3s; }
.header-scrolled .navbar { padding: 5px 0; box-shadow: 0 4px 15px rgba(0,0,0,0.1); }
.nav-link { color: var(--zilom-dark) !important; font-weight: 600; }

/* --- CONFIG PC --- */
@media (min-width: 992px) {
    .navbar-nav { margin-left: auto !important; }
    .nav-item.dropdown { padding-bottom: 15px; margin-bottom: -15px; }
    .dropdown-menu { display: none; border: none; box-shadow: 0 10px 30px rgba(0,0,0,0.1); border-radius: 8px; margin-top: 0; }
    .nav-item.dropdown:hover > .dropdown-menu { display: block; }

    /* GESTION DU 3ème NIVEAU SUR PC */
    .dropdown-submenu { position: relative; }
    .dropdown-submenu > .dropdown-menu {
        top: 0;
        left: 100%; /* S'ouvre à droite */
        margin-top: -5px;
        border-radius: 8px;
    }
    .dropdown-submenu:hover > .dropdown-menu { display: block; }

    .login-link { color: var(--zilom-dark) !important; text-decoration: none; font-weight: 600; display: flex; align-items: center; gap: 8px; }
    .login-link:hover { color: var(--zilom-blue) !important; }
}

/* --- RECHERCHE --- */
.top-search-box { position: relative; display: flex; align-items: center; }
.top-search-box input { background: rgba(255,255,255,0.15); border: none; border-radius: 20px; color: white; padding: 4px 10px 4px 35px; width: 140px; outline: none; }
@media (max-width: 991px) {
    .top-search-box input { width: 0; opacity: 0; padding: 0; pointer-events: none; transition: 0.3s; }
    .top-search-box.active input { width: 150px; opacity: 1; padding: 5px 10px 5px 35px; background: white; color: black; pointer-events: auto; }
    .top-search-box i { position: absolute; left: 0; cursor: pointer; z-index: 10; }
}

/* --- CONFIG MOBILE --- */
@media (max-width: 991px) {
    .navbar-marquee-mobile { flex: 1; margin: 0 10px; background: #f0f5ff; border-radius: 20px; padding: 6px 0; overflow: hidden; white-space: nowrap; }
    .navbar-marquee-mobile .marquee-inner { display: inline-block; padding-left: 100%; animation: scroll-mobile 12s linear infinite; font-size: 18px !important; font-weight: 700; color: var(--zilom-blue); }
    @keyframes scroll-mobile { 0% { transform: translateX(0); } 100% { transform: translateX(-100%); } }

    .navbar-collapse { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background-color: white; z-index: 2500; padding: 100px 40px; transform: translateX(-100%); transition: transform 0.4s ease; display: block !important; overflow-y: auto; }
    .navbar-collapse.show { transform: translateX(0); }
    .nav-link { font-size: 24px !important; padding: 15px 0 !important; border-bottom: 1px solid #f8f9fa; }
    .close-menu-btn { position: absolute; top: 25px; left: 25px; font-size: 30px; z-index: 2600; cursor: pointer; }

    /* GESTION DU 3ème NIVEAU SUR MOBILE */
    .dropdown-menu { border: none; padding-left: 15px; background: transparent; }
    .dropdown-submenu > .dropdown-menu {
        display: none;
        padding-left: 25px; /* Décalage pour montrer la hiérarchie */
        border-left: 2px solid var(--zilom-blue);
        margin: 10px 0;
    }
    .dropdown-submenu.active > .dropdown-menu { display: block; }
    .dropdown-item { font-size: 18px !important; padding: 10px 0; }

    .login-link-mobile { font-size: 24px !important; font-weight: 700; padding: 15px 0; border-bottom: 1px solid #f8f9fa; display: flex; align-items: center; gap: 10px; color: var(--zilom-dark) !important; text-decoration: none; }
    .btn-donation-mobile { width: 100%; text-align: center; margin-top: 25px; padding: 18px; font-size: 20px; display: block; }
}


/* Taille des icônes de contact (email/tel) */
.top-bar i {
    font-size: 14px; /* Augmentez à 16px ou 18px si besoin */
}

/* Taille des icônes réseaux sociaux */
.social-icons i {
    font-size: 16px;
    transition: 0.3s;
}

/* Effet au survol (optionnel) */
.social-icons a:hover i {
    transform: scale(1.2); /* L'icône grossit légèrement au survol */
    color: var(--zilom-blue);
}

/* Dans la partie @media (max-width: 991px) */
.bi-person-circle {
    font-size: 20px !important; /* Taille de l'icône profil mobile */
}

.top-search-box i {
    font-size: 15px;
    color: rgba(255,255,255,0.7);
}
.btn-donation { font-weight: 700; padding: 10px 20px; border-radius: 5px; text-decoration: none; transition: 0.3s; }