.elementor-2660 .elementor-element.elementor-element-ff10524{--display:flex;}/* Start custom CSS for shortcode, class: .elementor-element-9c40c9f *//* Conteneur principal */
.flag-lang-container {
    position: relative;
    display: inline-block;
    padding: 10px 0;
    cursor: pointer;
}

/* Zone du drapeau actif + flèche */
.current-flag-view {
    display: flex;
    align-items: center;
    gap: 6px; /* Espace entre drapeau et flèche */
}

/* Style commun des drapeaux */
.header-flag {
    width: 24px;       /* Un peu plus grand car c'est le seul élément */
    height: auto;
    border-radius: 2px;
    display: block;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1); /* Légère ombre pour le relief */
}

/* La petite flèche */
.current-flag-view::after {
    content: '';
    display: block;
    width: 5px;
    height: 5px;
    border-right: 2px solid #333; /* Couleur de la flèche */
    border-bottom: 2px solid #333;
    transform: rotate(45deg);
    margin-bottom: 2px;
}

/* La liste déroulante */
.flag-dropdown-list {
    display: none;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%); /* Centré par rapport au drapeau du haut */
    background: #fff;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    border-radius: 4px;
    padding: 8px 0;
    z-index: 100;
    min-width: 50px;
}

/* Affichage au survol */
.flag-lang-container:hover .flag-dropdown-list {
    display: block;
}

/* Les liens dans la liste */
.flag-dropdown-list a {
    display: flex;
    justify-content: center;
    padding: 6px 10px;
    transition: background 0.2s;
}

.flag-dropdown-list a:hover {
    background-color: #f0f0f0;
}/* End custom CSS */