.t4-megamenu .dropdown-menu {
    background-color: black !important;}
.t4-navbar, .t4-mainnav {
    background-color: blue !important;
    width:100%;}
.t4-navbar .nav-link {
    color: yellow !important;
}
.t4-navbar .nav-link:hover {
    color: #ff0000 !important;
}
.t4-megamenu .dropdown-menu .nav-link,
.t4-megamenu .dropdown-menu a {
    color: yellow !important;
}
.t4-section {background-color: #FAFAD2 !important;}
.t4-section-inner {background-color: #FAFAD2 !important;}
.t4.main-body {background-color: #FAFAD2 !important;}

.moduletable .navbar {padding:0px !important;
margin:0px !important;
 border-radius: 10px !important;
background-color:yellow !important;
border: solid 2px #D7E4F2 !important;
width:fit-content !important;
display:block !important;
/*width:auto !important;*/
height:auto !important;
}
/* Force l'affichage et le style des sous-menus de niveau 3 dans les modules de menu standard */
/*.moduletable .nav-item .nav-item .nav-item .level3 {
    position: relative;
}*/
.moduletable .nav-item .nav-item .dropdown-menu{
    display: block !important; /* Force l'affichage si le JS Bootstrap ne se déclenche pas */
    /*padding-left: 15px;*/ /* Crée un décalage visuel pour l'arborescence*/ 
}
/* Recréer le style nav-link manuellement si la classe manque */
/*.moduletable .level3 {
    display: block !important;
    padding: 0.5rem 1rem;
    color: var(--t4-body-color);
    text-decoration: none;
}*/
.moduletable .nav-item a { border-radius:10px !important ;
padding:0px !important;
margin:0px !important;
background-color:green !important;
border:solid 5px #D7E4F2 !important;
display:inline-block !important;
color: yellow !important;
 font-size:100% !important;
/* width:fit-content !important;*/
}
.moduletable .navbar 
{
padding:0px !important;
margin:0px !important;
/*background-color:green !important;*/
border:solid 5px #D7E4F2 !important;
color: yellow !important;
font-size:100% !important; }
.moduletable .nav .nav-item a { border-radius:10px !important ;
padding:0px !important;
margin:0px !important;
background-color:green !important;
border:solid 5px #D7E4F2 !important;
display:inline-block !important;*/
color: yellow !important;
 font-size:100% !important;
 width:100% !important;
}
.moduletable ul.dropdown-menu {
background-color: yellow !important;
}
.moduletable ul.dropdown-menu li:hover /*> ul.dropdown-menu*/ {
    display: block !important;}
.t4-topbar .row {
    justify-content: flex-start !important; /* Colle les modules au centre */
    gap: 5px !important;/* Ajoute un petit espace de sécurité de 15px entre les deux modules */
}
.logo-text {display:none !important;}

/* 1. Force la rangée principale de la topbar à rester strictement sur une seule ligne */
.t4-topbar .row {
    display: flex !important;
    flex-wrap: nowrap !important; /* Bloque impérativement le retour à la ligne */
    flex-direction: row !important; /* Force l'alignement horizontal */
    justify-content: space-between !important; /* Écarte les deux modules aux extrémités */
    align-items: center !important; /* Aligne le logo et le texte sur le même axe vertical */
}

/* 2. Réduit la boîte de gauche à la taille exacte de votre logo */
.t4-topbar .topbar-l {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
}

/* 3. Permet à la boîte de droite de s'étendre sans pousser celle de gauche */
.t4-topbar .topbar-r {
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: none !important;
    text-align: right; /* Aligne le contenu du module à droite */
}
 /*megamenu sur toute la largeur de la page*/
/*.t4-megamenu .dropdown-menu {
  width: 100vw !important;
  left: 0 !important;
  right: 0 !important;
  max-width: 100% !important;
  position: absolute !important;
}*/

/* ==========================================================================
   STRUCTURE INITIALE DU LOGO & DU MEGAMENU
   ========================================================================== */

/* ==========================================================================
   CONFIGURATIONS POUR ORDINATEURS ET TABLETTES (Écrans de plus de 991px)
   ========================================================================== */
@media (min-width: 992px) {

    /* --- FIXATION DU MEGAMENU --- */
    #t4-header.t4-header {
        position: -webkit-sticky !important;
        position: sticky !important;         
        top: 0 !important;                   
        z-index: 9999 !important;            
        background-color: #ffffff !important; /* Mettez votre couleur ici */
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05); 
    }

    .topbar {
        position: relative !important;
        z-index: 1010;
        display: block !important;
    }

    /* --- GESTION DU SCROLL DES SIDEBARS --- */
    .t4-sidebar, 
    .sidebar-l, 
    .sidebar-r {
        position: -webkit-sticky !important; 
        position: sticky !important;         
        top: 90px !important; /* S'aligne sous votre Megamenu */
        max-height: calc(100vh - 110px) !important; 
        overflow: hidden !important;         
    }

    /* Au survol : on réactive le scroll sur la colonne */
    .t4-sidebar:hover, 
    .sidebar-l:hover, 
    .sidebar-r:hover {
        overflow-y: auto !important;         
    }

    /* Style discret de la barre de défilement */
    .t4-sidebar::-webkit-scrollbar, .sidebar-l::-webkit-scrollbar, .sidebar-r::-webkit-scrollbar {
        width: 6px;
    }
    .t4-sidebar::-webkit-scrollbar-thumb, .sidebar-l::-webkit-scrollbar-thumb, .sidebar-r::-webkit-scrollbar-thumb {
        background-color: rgba(0, 0, 0, 0.2);
        border-radius: 4px;
    }
}

/* ==========================================================================
   CONFIGURATIONS SPÉCIFIQUES POUR MOBILES (Écrans de moins de 992px)
   ========================================================================== */
@media (max-width: 991.98px) {
    
    /* On annule la fixation du header sur mobile pour libérer l'espace visuel */
    #t4-header.t4-header {
        position: relative !important;
        top: auto !important;
        z-index: 1000 !important;
    }

    /* On annule totalement le comportement collant des colonnes pour éviter les chevauchements */
    .t4-sidebar, 
    .sidebar-l, 
    .sidebar-r {
        position: relative !important;
        top: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }
}
/*modifs 28-08-2026-11h31*/
/* ==========================================================================
   CORRECTIONS FINALES POUR MOBILE (Écrans de moins de 992px)
   ========================================================================== */
@media (max-width: 991.98px) {
    
    /* 1. Affichage forcé du bouton et configuration de sa taille */
    #t4-header .navbar-toggler,
    .t4-header .navbar-toggler {
        display: flex !important;
        align-items: center;
        justify-content: center;
        background-color: #0056b3 !important; /* Couleur bleue du bouton */
        border: 1px solid rgba(255, 255, 255, 0.2) !important;
        padding: 10px !important;
        border-radius: 4px;
        width: 44px;
        height: 38px;
    }

    /* 2. Remplacement de l'icône manquante par un vrai bouton "Burger" dessiné en CSS */
    #t4-header .navbar-toggler .toggle-bars,
    .t4-header .navbar-toggler .toggle-bars {
        display: block !important;
        position: relative;
        width: 20px;
        height: 2px;
        background-color: #ffffff !important; /* Ligne du milieu */
        color: transparent !important; /* Masque l'ancienne icône si elle bugge */
    }
    /* Ligne du haut et du bas du burger */
    #t4-header .navbar-toggler .toggle-bars::before,
    #t4-header .navbar-toggler .toggle-bars::after,
    .t4-header .navbar-toggler .toggle-bars::before,
    .t4-header .navbar-toggler .toggle-bars::after {
        content: "" !important;
        position: absolute;
        left: 0;
        width: 20px;
        height: 2px;
        background-color: #ffffff !important;
    }
    #t4-header .navbar-toggler .toggle-bars::before, .t4-header .navbar-toggler .toggle-bars::before { top: -6px; }
    #t4-header .navbar-toggler .toggle-bars::after, .t4-header .navbar-toggler .toggle-bars::after { top: 6px; }


    /* 3. Modification de la couleur d'arrière-plan du menu déployé */
    #t4-megamenu-mainmenu.navbar-collapse,
    .t4-megamenu.navbar-collapse {
        background-color: #0056b3 !important; /* /!\ METTEZ ICI LA COULEUR DE FOND DU MENU REQUIS (actuellement bleu) */
        padding: 15px !important;
        border-radius: 4px;
        margin-top: 10px;
    }

    /* 4. Ajustement de la couleur du texte des liens pour qu'ils soient lisibles sur le nouveau fond */
    #t4-megamenu-mainmenu .nav-link,
    #t4-megamenu-mainmenu .dropdown-item {
        color: #ffffff !important; /* Texte écrit en blanc */
    }
    
    /* Couleur au survol ou sur la page active dans le menu mobile */
    #t4-megamenu-mainmenu .nav-item.active > .nav-link,
    #t4-megamenu-mainmenu .nav-link:hover {
        color: #ffcc00 !important; /* Jaune ou autre couleur de survol */
    }
}

/*suite modifs 29-08-2026-11h24*/
/* ==========================================================================
   NETTOYAGE ET PURIFICATION DU BLOC PRINCIPAL (.t4-section)
   ========================================================================== */

/* 1. On force la couleur sur la section et on supprime TOUTES les ombres */
.t4-section, 
#t4-main-body.t4-main-body, 
.t4-section-inner {
    background-color: #FAFAD2 !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

/* 2. Suppression des bordures invisibles (souvent grises) en haut et en bas des sections */
.t4-section, 
#t4-main-body, 
.t4-row, 
.row {
    border: none !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
}

/* 3. On applique la transparence absolue sur les sous-éléments pour éviter l'effet de superposition */
.t4-section-inner, 
.t4-row, 
.t4-col, 
.col-md, 
.com-content-category-blog, 
.blog-items, 
.blog-item, 
.blog-item-content, 
.item-content {
    background-color: transparent !important;
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
}