/* ============================================================
   IC-UNDERLINE - Inner Condor | Efecto de línea inferior en enlaces internos
   Se aplica únicamente sobre la clase .ic-underline añadida por
   TypeScript (no modifica ningún otro estilo existente).
   ============================================================ */

.ic-underline {
    position: relative;
    display: inline;
    text-decoration: none;
}

.ic-underline::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -1px;
    height: 1px;
    width: 100%;
    background-color: var(--color-acento, #d4af37);
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.35s cubic-bezier(0.25, 0.1, 0.25, 1);
    pointer-events: none;
}

/* Hover del puntero */
.ic-underline.ic-hover::after {
    transform: scaleX(1);
    transform-origin: left;
}

/* Navegación por teclado (independiente de :focus-visible) */
.ic-underline.ic-focus::after {
    transform: scaleX(1);
    transform-origin: left;
}

/* :focus-visible nativo — indicador de accesibilidad adicional, no
   reemplaza el :focus-outline del navegador. */
.ic-underline:focus-visible {
    outline: 2px solid var(--color-acento, #d4af37);
    outline-offset: 3px;
    border-radius: 2px;
}

/* Estados de transición: muestra la línea suavemente también durante
   navegación con TAB (sin depender de eventos de mouse). */
.ic-underline:focus:not(.ic-focus)::after {
    transform: scaleX(1);
    transform-origin: left;
}

/* Prefers-reduced-motion: líneas instantáneas, sin transición */
@media (prefers-reduced-motion: reduce) {
    .ic-underline::after {
        transition: none;
    }
}

/* Impedir que el pseudo-elemento interfiera con selects, inputs, etc.
   Solo aplicar sobre enlaces que sean textos clickeables. */
a.ic-underline:active::after {
    transform: scaleX(1);
    transform-origin: left;
    transition-duration: 0.1s;
}