/* 
 Theme Name:     Prodafric
 Author:         Prodafric
 Author URI:     https://www.prodafric.com/
 Template:       Divi
 Version:        4.20.2
 Description:   A Child Theme built using the elegantmarketplace.com Child theme maker
Developed by Andrew Palmer for Elegant Marketplace www.elegantmarketplace.com Free to use and duplicate as many times as you like
 Wordpress Version: 6.1.1
*/ 


/* ----------- PUT YOUR CUSTOM CSS BELOW THIS LINE -- DO NOT EDIT ABOVE THIS LINE --------------------------- */ 
.et_non_fixed_nav.et_transparent_nav #main-header, .et_non_fixed_nav.et_transparent_nav #top-header
{
  position: relative !important;
  top: 0 !important;
}
#et-secondary-nav,#et-secondary-menu
{
	float:none !important;
	display:block;
	width:100%;
	text-align:center;
}
.et_non_fixed_nav.et_fullwidth_nav.et_header_style_left #main-header .container
{
	padding-left: 0;
	padding-right: 0 !important;
	padding-top: 0;
}
#et-secondary-nav li a
{
	padding:19px 6px !important;
	border-top:2px solid transparent;
}
#et-secondary-nav > li > a:hover
{
	border-top:2px solid #cc1130;
}
#et-secondary-nav > li
{
	margin: 0px 5px !important;
	padding: 0px 15px;
}
#top-header
{
	border-top: 1px solid #e5e6ea;
}
#et-top-navigation
{
	padding: 20px 0px !important;
}
#top-menu li {
	padding-right: 0px !important;
}
#top-menu li.cta_link_pp
{
	padding-right:15px !important;
}
#top-menu li.cta_link_pp a
{
	background: #cc1130 !important;
	color:#fff !important;
	border-radius: 60px;
}
#top-menu li.cta_link_pp i
{
	color:#fff !important;
}
#top-menu li.cta_link
{
	padding-right:15px !important;
}
#top-menu li.cta_link a
{
	background: #0087e2 !important;
	color:#fff !important;
	border-radius: 60px;
}
#top-menu li.Phone_cta
{
	margin-left:5px;
}
#top-menu li.Phone_cta i,
#top-menu li.Fair_cta i,
#top-menu li.Email_cta i
{
	color: #0087e2 !important;
}
#top-menu li.Hidden_Link
{
	display:none !important;
}

#top-menu li a{
	padding: 15px 15px !important;
}
#top-menu > li.Link_usage_pp
{

}
/*MENU ON MOBILE*/
#mobile_menu .Hidden_Link_Mobile
{
	display:none !important;
}

.submenu-toggle {
  background: #0087e2 !important;
  cursor: pointer;
  float: right;
  text-decoration: none;
  color: #fff !important;
  width: 52px;
  text-align: center !important;
  font-size: 17px !important;
  padding: 10px 0px !important;
  z-index: 99999999;
  position: relative;
}

/* État caché par défaut pour les sous-menus mobile */
#et-top-navigation #et_mobile_nav_menu #mobile_menu .sub-menu,
.et_mobile_menu li ul {
    display: none !important;
    visibility: hidden !important;
    opacity: 0;
    transition: opacity 0.3s ease;
}

/* Classe ajoutée par jQuery pour afficher */
#et-top-navigation #et_mobile_nav_menu #mobile_menu .sub-menu.submenu-visible,
.et_mobile_menu li ul.submenu-visible {
    display: block !important;
    visibility: visible !important;
    opacity: 1;
}

/*END STYLE MENU ON MOBILE*/
.et_header_style_left #et-top-navigation .mobile_menu_bar
{
	padding-top: 10px !important;
	padding-bottom: 10px !important;
}
#principal_description
{
	/* background:#0087e2; */
	/* background:#005a98; */
	background:#002057;
	padding:10px;
}
#principal_description p
{
	text-align:center;
	color:#fff;

}
#principal_description p span
{
	font-weight:bold;
}
#principal_description p a.contact_email
{
	float:right;
	color:#fff;
	padding-right:10px
}
#principal_description p a.title_pro
{
	float:left;
	color:#fff;
	padding-left:30px
}
#choice_sector.et_pb_row .et_pb_button_module_wrapper .et_pb_button.Active
{
    color: #FFFFFF !important;
    border-color: #0087e2 !important;
    background-image: initial;
    background-color: #0087e2 !important;
    /* Optionnel : Ajouter une transition fluide */
    transition: all 0.3s ease;
}


#et-secondary-nav .menu-item-has-children > a:first-child::after
{
	top: 40% !important;
	left: 100% !important;
}
#et-secondary-nav {
    overflow: visible !important;
}
#et-secondary-nav {
    /* display: flex; */
    flex-wrap: wrap;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
    position: relative;
    z-index: 9999;
	text-align:center;
	float:none !important;
}
#et-secondary-nav > li
{
	position:static;
	text-align: left !important;
}
#et-secondary-nav > li.Nb_Col_4 > ul.sub-menu
{
	width:85%;
	left: 10%;
	text-align: left;
    background: #fff;
	border-radius:40px;
	
}
#et-secondary-nav > li.Nb_Col_3 > ul.sub-menu
{
	width:65%;
	left: 20%;
	text-align: left;
    background: #fff;
	border-radius:40px;
	
}
#et-secondary-nav > li.Nb_Col_2 > ul.sub-menu
{
	width:45%;
	right: 10%;
	text-align: left;
    background: #fff;
	border-radius:40px;
	
}
#et-secondary-nav > li > ul.sub-menu > li > ul > li > a 
{
	padding:10px 5px !important;
}
#et-secondary-nav > li > ul.sub-menu > li > a
{
	color:#0087E2;
	font-weight:bold;
	border-radius:10px;
	display: inline-block;
	width: auto;
	padding: 10px 25px !important;
	margin-left: 8px;
	background:#E6F3FC !important;
}
#et-secondary-nav > li > ul.sub-menu > li.sub_title_col_full > a
{
	display:none;
}
#et-secondary-nav > li > ul.sub-menu > li.sub_title_col_full > ul > li
{
	display:inline-block;
}
/* Alignement de base pour tous les éléments du sous-menu */
#et-secondary-nav > li > ul.sub-menu li {
    text-align: left;
}

/* Configuration du conteneur pour colonnes */
#et-secondary-nav > li.Nb_Col_4 > ul.sub-menu,
#et-secondary-nav > li.Nb_Col_2 > ul.sub-menu,
#et-secondary-nav > li.Nb_Col_3 > ul.sub-menu
{
    display: flex !important;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding: 20px;
}

/* Style des colonnes (1 à 4) */
#et-secondary-nav > li.Nb_Col_4 > ul.sub-menu > li.sub_title_col {
    flex: 0 0 25%; /* Divise l'espace en 4 colonnes égales */
    list-style-type: none;
	margin: 0 !important;
}
/* Style des colonnes (1 à 4) */
#et-secondary-nav > li.Nb_Col_2 > ul.sub-menu > li.sub_title_col {
    flex: 0 0 50%; /* Divise l'espace en 4 colonnes égales */
    list-style-type: none;
	margin: 0 !important;
}
#et-secondary-nav > li.Nb_Col_3 > ul.sub-menu > li.sub_title_col {
    flex: 0 0 33%;
    list-style-type: none;
	margin: 0 !important;
}
#et-secondary-nav > li.Nb_Col_4 > ul.sub-menu > li.sub_title_col.sub_title_col_1
{
    flex: 0 0 20% !important;
}
#et-secondary-nav > li.Nb_Col_4 > ul.sub-menu > li.sub_title_col.sub_title_col_2
{
    flex: 0 0 20% !important;
}
#et-secondary-nav > li.Nb_Col_4 > ul.sub-menu > li.sub_title_col.sub_title_col_3
{
    flex: 0 0 20% !important;
}
#et-secondary-nav > li.Nb_Col_4 > ul.sub-menu > li.sub_title_col.sub_title_col_4
{
    flex: 0 0 40% !important;
}


#et-secondary-nav > li.Nb_Col_3 > ul.sub-menu > li.sub_title_col.sub_title_col_1
{
    flex: 0 0 25% !important;
}
#et-secondary-nav > li.Nb_Col_3 > ul.sub-menu > li.sub_title_col.sub_title_col_2
{
    flex: 0 0 25% !important;
}
#et-secondary-nav > li.Nb_Col_3 > ul.sub-menu > li.sub_title_col.sub_title_col_3
{
    flex: 0 0 50% !important;
}
/* Style des colonnes (1 à 4) */
#et-secondary-nav > li > ul.sub-menu > li.sub_title_col
{
	padding: 30px 10px 0px !important;
}

#et-secondary-nav > li > ul.sub-menu > li a:hover
{
	background-color: transparent !important;
	color:#0087E2 !important;
}

/* Masquage des puces WordPress par défaut */
#et-secondary-nav > li ul {
    list-style: none !important;
    padding: 0;
}
#et-secondary-nav li ul ul
{
	margin-top: 0 !important;
}
/* 1. On force l'affichage du premier niveau de sous-menu */
#et-secondary-nav > li:hover > ul.sub-menu
{
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* 2. On force l'affichage permanent des listes internes (Types, Services, Usages) */
/* Tant que le menu parent est survolé, les sous-listes ne doivent pas se cacher */
#et-secondary-nav > li:hover > ul.sub-menu > li > ul.sub-menu {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important; /* Pour qu'ils s'insèrent dans le flux de la colonne */
    left: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
	animation:none !important;
}

/* 3. On annule les animations de sortie par défaut du thème qui pourraient créer des clignotements */
#et-secondary-nav > li > ul.sub-menu {
    transition: all 0s !important; 
}
#et-secondary-nav > li > ul.sub-menu {
    background-color: transparent !important;
    padding-top: 25px !important;
	box-shadow :none !important;
}
#et-secondary-nav > li > ul.sub-menu::before {
    content: "";
    position: absolute;
    border-radius: 40px; /* Arrondi léger en bas pour plus de douceur */
    top: 25px; /* L'espace que tu voulais */
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    box-shadow: 0 15px 35px rgba(0,0,0,0.1);
    z-index: -1;
}
#et-secondary-nav li li {
	padding: 5px 10px;
	margin: 0;
}

#et-secondary-nav li a {
	position: relative !important;
}

/* Force le conteneur à prendre toute la largeur sous les 4 colonnes */
#et-secondary-nav > li > ul.sub-menu > li.footer_mega_full {
    flex: 0 0 100% !important;
    width: 100% !important;
    margin-top: 5px !important;
    padding: 15px 0 0 0 !important;
    border-top: 1px solid #f0f0f0 !important; /* Ligne de séparation discrète */
}

/* Cache le titre "footer_mega_full" qui ne sert que de conteneur */
#et-secondary-nav > li > ul.sub-menu > li.mega-menu-column-img-container > a,
#et-secondary-nav > li > ul.sub-menu > li.mega-menu-column-img-container > ul > li.mega-menu-column-img > a
{
    display: none !important;
}
#et-secondary-nav > li.Rideaux_grilles > ul.sub-menu > li.mega-menu-column-img-container > ul > li.mega-menu-column-img
{
	height:220px;
	background-image: url('https://www.profil-plus.com/wp-content/uploads/2026/02/Rideau-lames-pleines.png');
    background-size: cover;
    background-position: center;
	border-radius:40px !important;
}
#et-secondary-nav > li.Portes_industrielles > ul.sub-menu > li.mega-menu-column-img-container > ul > li.mega-menu-column-img
{
	height:200px;
	background-image: url('https://www.profil-plus.com/wp-content/uploads/2026/03/porte-sectionnel.png');
    background-size: cover;
    background-position: center;
	border-radius:40px !important;
}
#et-secondary-nav > li.Portes_residentielles > ul.sub-menu > li.mega-menu-column-img-container > ul > li.mega-menu-column-img
{
	height:160px;
	background-image: url('https://www.profil-plus.com/wp-content/uploads/2026/02/Volet-roulant.png');
    background-size: cover;
    background-position: center;
	border-radius:40px !important;
}
#et-secondary-nav > li.Portails > ul.sub-menu > li.mega-menu-column-img-container > ul > li.mega-menu-column-img
{
	height:150px;
	background-image: url('https://www.profil-plus.com/wp-content/uploads/2026/03/Portails.webp');
    background-size: cover;
    background-position: center;
	border-radius:40px !important;
}
#et-secondary-nav > li.Volets_roulants > ul.sub-menu > li.mega-menu-column-img-container > ul > li.mega-menu-column-img
{
	height:190px;
	background-image: url('https://www.profil-plus.com/wp-content/uploads/2026/02/Volet-transparent.png');
    background-size: cover;
    background-position: center;
	border-radius:40px !important;
}

#et-secondary-nav > li.Serrurerie > ul.sub-menu > li.mega-menu-column-img-container > ul > li.mega-menu-column-img
{
	height:190px;
	background-image: url('https://www.profil-plus.com/wp-content/uploads/2026/03/Serrure.jpeg');
    /* background-size: cover; */
    background-position: center;
	border-radius:40px !important;
}

#et-secondary-nav > li > ul.sub-menu > li.mega-menu-column-img-container > ul > li.mega-menu-column-img-cta 
{
	text-align:center !important;
}
#et-secondary-nav > li > ul.sub-menu > li.mega-menu-column-img-container > ul > li.mega-menu-column-img-cta > a
{
	background-color: #0087E2 !important;
	color: #fff !important;
	border-radius: 20px;
	width: auto !important;
	display: inline-block;
	padding: 10px 25px !important;
	margin: 15px auto;
	text-align: center;
}


#et-secondary-nav > li > ul.sub-menu > li.footer_mega_full > a {
    display: none !important;
}

/* Aligne les liens horizontalement */
#et-secondary-nav > li > ul.sub-menu > li.footer_mega_full > ul.sub-menu {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding: 20px;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
	width: 100%;
}

/* Style des liens du footer */
#et-secondary-nav > li > ul.sub-menu > li.footer_mega_full > ul.sub-menu > li
{
	flex: 0 0 25% !important;
}
/* Style des liens du footer */
#et-secondary-nav > li.Nb_Col_4 > ul.sub-menu > li.footer_mega_full > ul.sub-menu li a {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #333 !important;
    text-transform: uppercase;
    transition: color 0.3s ease;
}

#et-secondary-nav > li > ul.sub-menu > li.footer_mega_full > ul.sub-menu li a:hover {
    color: #0087E2 !important;
}

#et-secondary-nav li ul ul
{
  margin-top: 0;
  width: auto;
}