/*
 * FONTNAUTIC · Hamburger Fix v1.1.0
 *
 * Desktop permanece bajo control del tema Fontnautic.
 * No se redefinen header, nav-main, logo, breakpoints ni display de menu-toggle.
 *
 * El JS activa .fn-compact-header-active solo cuando .menu-toggle
 * ya es visible según el breakpoint ORIGINAL del tema.
 */

/* HAMBURGUESA ----------------------------------------------------------- */

.menu-toggle > .fn-hamburger-stack {
    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;

    height: 16px !important;
    min-height: 16px !important;
    max-height: 16px !important;

    display: inline-flex !important;
    flex: 0 0 22px !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;

    box-sizing: border-box !important;
    position: relative !important;
    inset: auto !important;

    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;

    transform: none !important;
    opacity: 1 !important;
    overflow: visible !important;
}

.menu-toggle .fn-hamburger-stack > .fn-hamburger-line {
    display: block !important;
    position: static !important;
    inset: auto !important;

    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;

    height: 2px !important;
    min-height: 2px !important;
    max-height: 2px !important;

    flex: 0 0 2px !important;

    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;

    background: var(--fn-hamburger-color, currentColor) !important;
    box-shadow: none !important;

    transform-origin: 50% 50% !important;
    transition:
        transform 180ms ease,
        opacity 140ms ease !important;
}

.menu-toggle[aria-expanded="false"] .fn-hamburger-line,
.menu-toggle:not([aria-expanded="true"]) .fn-hamburger-line {
    transform: none !important;
    opacity: 1 !important;
}

.menu-toggle[aria-expanded="true"] .fn-hamburger-line-1 {
    transform: translateY(7px) rotate(45deg) !important;
}
.menu-toggle[aria-expanded="true"] .fn-hamburger-line-2 {
    opacity: 0 !important;
    transform: none !important;
}
.menu-toggle[aria-expanded="true"] .fn-hamburger-line-3 {
    transform: translateY(-7px) rotate(-45deg) !important;
}

/* SELECTOR DE IDIOMA COMPACTO ------------------------------------------ */

.fn-language-switcher-mobile {
    display: none !important;
}

.fn-compact-header-active .fn-language-switcher-mobile {
    display: block !important;
    flex: 0 0 auto !important;
    position: relative !important;
    z-index: 10030 !important;

    margin: 0 0 0 8px !important;
    padding: 0 !important;
}

/*
 * En compacto se oculta SOLO la instancia del selector que estaba dentro
 * de nav-main, porque la copia compacta ya está junto a Menú.
 */
.fn-compact-header-active .nav-main .fn-language-switcher-header {
    display: none !important;
}

.fn-compact-header-active .fn-language-switcher-mobile > summary {
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;

    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;

    box-sizing: border-box !important;
    display: grid !important;
    place-items: center !important;

    margin: 0 !important;
    padding: 0 !important;

    cursor: pointer !important;
    list-style: none !important;
    border-radius: 999px !important;
    color: inherit !important;
}

.fn-compact-header-active .fn-language-switcher-mobile > summary::-webkit-details-marker {
    display: none !important;
}

.fn-compact-header-active .fn-language-switcher-mobile > summary::marker {
    content: "" !important;
}

.fn-compact-header-active .fn-language-switcher-mobile > summary .fn-language-current-name,
.fn-compact-header-active .fn-language-switcher-mobile > summary .fn-language-current-short,
.fn-compact-header-active .fn-language-switcher-mobile > summary .fn-language-chevron {
    display: none !important;
}

.fn-compact-header-active .fn-language-switcher-mobile > summary .fn-language-flag {
    display: block !important;
    width: 23px !important;
    min-width: 23px !important;
    height: 16px !important;
    min-height: 16px !important;
    margin: 0 !important;
    overflow: hidden !important;
    line-height: 0 !important;
    border-radius: 2px !important;
}

.fn-compact-header-active .fn-language-switcher-mobile > summary .fn-language-flag svg,
.fn-compact-header-active .fn-language-switcher-mobile > summary .fn-language-flag img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

.fn-compact-header-active .fn-language-switcher-mobile > .fn-language-menu {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    right: 0 !important;
    left: auto !important;

    width: max-content !important;
    min-width: 220px !important;
    max-width: min(280px, calc(100vw - 24px)) !important;

    z-index: 10040 !important;
}

.fn-compact-header-active .fn-language-switcher-mobile:not([open]) > .fn-language-menu {
    display: none !important;
}

.fn-compact-header-active .fn-language-switcher-mobile[open] > .fn-language-menu {
    display: block !important;
}

.fn-compact-header-active .fn-language-switcher-mobile .fn-language-option {
    min-height: 44px !important;
}

@media (prefers-reduced-motion: reduce) {
    .menu-toggle .fn-hamburger-stack > .fn-hamburger-line {
        transition: none !important;
    }
}