/* 
 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 #34aee5;
}
#et-secondary-nav li
{
	margin: 0px 9px !important;
}
#top-header
{
	border-top: 1px solid #e5e6ea;
}
#et-top-navigation
{
	padding: 25px 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: #ffb703 !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;
	padding-left: 15px !important;
}
#top-menu li.cta_link a
{
	background: #34AEE5  !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: #34AEE5 !important;
}
#top-menu li.Hidden_Link
{
	display:none !important;
}
#top-menu .menu-item-has-children > a:first-child::after
{
  top: 40%;
}
#top-menu > li > a{
	padding: 20px 15px !important;
}
#top-menu > li.Link_usage_pp
{

}
#mobile_menu .Hidden_Link_Mobile
{
	display:none !important;
}
.et_header_style_left #et-top-navigation .mobile_menu_bar
{
	padding-top: 10px !important;
	padding-bottom: 10px !important;
}
.nav li ul {
  right: 0 !important;
}
#principal_description
{
	/* background:#34AEE5; */
	/* background:#005a98; */
	/* background:#002057; */
	background:#1d4e89;
	padding:10px;
	display: flex;             /* Active le mode Flexbox */
    align-items: center;       /* Aligne verticalement au centre tous les enfants */
    justify-content: space-between; /* Distribue l'espace entre les éléments (Optionnel) */
    gap: 20px;                 /* Ajoute un espace constant entre les éléments */
    padding: 10px 20px;
}
#principal_description,
#principal_description a,
#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
}
/* Style du conteneur principal */
#top_services {
    display: flex;
    align-items: center;
    font-weight: 600;
    font-size: 13px;
    text-transform: uppercase; /* Donne un aspect plus pro/institutionnel */
    letter-spacing: 0.5px;
    color: #fff; /* Gris foncé, moins agressif que le noir */
}

/* Style des mots (spans) */
#top_services span {
    padding: 0 10px;
    transition: color 0.3s ease;
    cursor: default;
}

/* Effet au survol des services */
#top_services span:hover {
    color: #fff; /* Bleu industriel de la charte */
}

/* Personnalisation des séparateurs (|) */
/* Ce sélecteur cible le texte entre les spans (les barres verticales) */
#top_services {
    color: #ffb703; /* Les barres seront en gris clair pour ne pas alourdir le regard */
}

/* On remet la couleur foncée pour le texte à l'intérieur des spans */
#top_services span {
    color: #fff;
}
#choice_sector.et_pb_row .et_pb_button_module_wrapper .et_pb_button.Active
{
    color: #FFFFFF !important;
    border-color: #34AEE5 !important;
    background-image: initial;
    background-color: #34AEE5 !important;
    /* Optionnel : Ajouter une transition fluide */
    transition: all 0.3s ease;
}

/* --- 1. CONTENEUR PRINCIPAL (Ciblage spécifique) --- */
/* On cible le sous-menu direct de l'élément qui a la classe Link_usage_pp */
#et-secondary-nav li.Link_usage_pp > ul.sub-menu {
    width: 500px !important; /* Largeur fixe */
    padding: 0 !important;
}

#et-secondary-nav li.Link_usage_pp > ul.sub-menu > li:not(:last-child) {
    width: 50%;
    float: left;
    clear: both;
    
    box-sizing: border-box; 
    position: relative;
    z-index: 10;
	padding: 0;
	margin: 00 !important;
}

#et-secondary-nav li.Link_usage_pp > ul.sub-menu > li:not(:last-child) a {
    display: block;
    padding: 15px 20px !important;
    color: #333;
    text-decoration: none;
	text-align:left;
    border-bottom: 1px solid #eee;
}


#et-secondary-nav li.Link_usage_pp > ul.sub-menu > li:last-child,
#et-secondary-nav li.Link_usage_pp > ul.sub-menu > li.usage_image_pp {
    width: 50%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    
    background-color: #f4f4f4;
    z-index: 1;
	margin: 0 !important;
	padding: 0 !important;
}

#et-secondary-nav li.Link_usage_pp > ul.sub-menu > li:last-child a,
#et-secondary-nav li.Link_usage_pp > ul.sub-menu > li.usage_image_pp a {
    display: block;
    width: 100%;
    height: 100%;
    text-indent: -9999px;
    font-size: 0;
    line-height: 0;
}

#et-secondary-nav li.Link_usage_pp > ul.sub-menu > li:not(:last-child):hover a {
    color: #005A98;
    background-color: #f9f9f9;
}

/* 1. Conteneur principal */
#site_lang {
    list-style: none;
    margin: 0;
    padding: 0;
    display: inline-block;
    position: relative; /* Important pour le positionnement du sous-menu */
    font-family: Arial, sans-serif;
    font-size: 14px;
    z-index: 9999;
	float:right;
}

/* 2. Style de l'élément parent (Langue actuelle) */
#site_lang li.current-lang {
    display: block;
    background: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    transition: all 0.3s ease;
}

/* 3. Style des liens (A) et alignement des drapeaux */
#site_lang li a {
    display: flex;
    align-items: center;
    padding: 8px 12px;
    text-decoration: none;
    color: #333;
    white-space: nowrap;
}

/* 4. Gestion du Dropdown (on cache les autres langues par défaut) */
#site_lang li:not(.current-lang) {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background: #ffffff;
    border: 1px solid #e0e0e0;
    border-top: none;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, transform 0.2s ease;
    transform: translateY(5px); /* Petit effet de glissement */
}

/* 5. Affichage au survol (Hover) */
#site_lang:hover li.current-lang {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    background-color: #f9f9f9;
}

#site_lang:hover li:not(.current-lang) {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* 6. Style au survol des éléments de la liste */
#site_lang li:hover {
    background-color: #f1f1f1;
}

/* 7. Ajustement des images (Drapeaux) */
#site_lang img {
    display: inline-block;
    vertical-align: middle;
    box-shadow: 0 1px 2px rgba(0,0,0,0.1);
}

/* Petit triangle indicateur (optionnel) */
#site_lang li.current-lang a::after {
    content: '▼';
    font-size: 9px;
    margin-left: 8px;
    color: #999;
}