/* ============================================
   Polylang FSE Language Switcher — style.css
   Version 1.1.0
   ============================================ */

/* --- Variables CSS par défaut --- */
.pfs-language-switcher {
    --pfs-font:           inherit;
    --pfs-font-size:      1em;
    --pfs-font-weight:    normal;
    --pfs-text-transform: none;
    --pfs-color-text:     currentColor;
    --pfs-color-hover:    currentColor;
    --pfs-color-current:  currentColor;
    --pfs-color-bg:       transparent;
    --pfs-gap:            8px;
    --pfs-padding:        2px 6px;
    --pfs-radius:         4px;

    display:     inline-flex;
    align-items: center;
    font-family:    var( --pfs-font );
    font-size:      var( --pfs-font-size );
    font-weight:    var( --pfs-font-weight );
    text-transform: var( --pfs-text-transform );
    background:     var( --pfs-color-bg );
}

/* --- Liste --- */
.pfs-language-switcher ul {
    list-style:  none;
    margin:      0;
    padding:     0;
    display:     flex;
    align-items: center;
    gap:         var( --pfs-gap );
}

/* --- Disposition verticale --- */
.pfs-layout-vertical ul {
    flex-direction: column;
    align-items:    flex-start;
}

/* --- Items --- */
.pfs-language-switcher ul .lang-item {
    display:     inline-flex;
    align-items: center;
    position:    relative;
}

/* --- Liens et textes --- */
.pfs-language-switcher ul .lang-item a,
.pfs-language-switcher ul .lang-item span {
    display:         inline-flex;
    align-items:     center;
    gap:             4px;
    text-decoration: none;
    color:           var( --pfs-color-text );
    padding:         var( --pfs-padding );
    border-radius:   var( --pfs-radius );
    transition:      color 0.2s ease, opacity 0.2s ease;
    white-space:     nowrap;
}

.pfs-language-switcher ul .lang-item a:hover {
    color:           var( --pfs-color-hover );
    text-decoration: underline;
}

/* --- Drapeaux --- */
.pfs-language-switcher ul .lang-item img {
    width:          18px;
    height:         auto;
    vertical-align: middle;
    border-radius:  2px;
}

/* --- Langue active --- */
.pfs-language-switcher ul .current-lang-item > span,
.pfs-language-switcher ul .current-lang-item > a {
    color:       var( --pfs-color-current );
    font-weight: bold;
    cursor:      default;
    pointer-events: none;
}

/* --- Séparateur (horizontal, via data-attribute) --- */
.pfs-layout-horizontal ul .lang-item:not(:last-child)::after {
    content:     attr( data-sep );
    margin-left: 0;
    opacity:     0.35;
    font-weight: normal;
}

/* Injecter le séparateur depuis le data-attribute du nav parent */
.pfs-layout-horizontal[data-separator] ul .lang-item:not(:last-child)::after {
    content: attr( data-separator );
}

/* --- Éditeur FSE --- */
.pfs-language-switcher-editor {
    min-height: 40px;
}

.pfs-language-switcher-editor > div {
    transition: all 0.2s ease;
}