/* ============================================
   🌐 ESTILOS PARA SELECTOR DE IDIOMA
   ============================================

   Estilos para el selector de idioma y las
   animaciones del eslabón de cadena SVG

   Reemplaza estilos inline que se inyectaban
   desde JavaScript

   ============================================ */

/* Estados de las opciones de idioma */
.lang-option {
    transition: color 0.3s ease, font-weight 0.3s ease;
    cursor: pointer;
    text-decoration: none;
}

/* Idioma activo (seleccionado) */
.lang-option.lang-active {
    color: var(--gep-dark-blue);
    font-weight: 700;
}

/* Idioma inactivo (no seleccionado) */
.lang-option.lang-inactive {
    color: rgba(15, 83, 154, 0.6);
    font-weight: 600;
}

/* Hover en opciones de idioma */
.lang-option:hover {
    color: var(--gep-dark-blue);
    text-decoration: none;
}

/* ============================================
   ANIMACIONES DEL ESLABÓN DE CADENA
   ============================================ */

/* Nota: Las clases .show-chain-left y .show-chain-right
   deben estar definidas en gep-custom.css o el archivo
   donde se controla la animación del eslabón SVG */

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 768px) {
    .lang-option {
        font-size: 0.9rem;
    }
}