/**
 * INATGI Theme Six — Articles & Issues dropdown visual fix v2
 * 2026-10-01
 *
 * Purpose:
 * - keep Articles & Issues as one dropdown panel;
 * - remove the legacy large shadow/decorative pseudo layers;
 * - remove the red rectangular focus outline around the trigger while the
 *   submenu is open, which visually looks like a second overlapping box;
 * - retain an accessible visible focus/open state using a bottom accent line.
 *
 * Scope: desktop journal navigation only; other dropdowns are untouched.
 */

@media (min-width: 1051px) {
    /* The issue submenu is one clean panel. */
    body.inatgi-journal-context
    .inatgi-journal-navigation-wrapper
    .pkp_navigation_primary ul:has(a[href*="/issue/current"]),

    body.inatgi-journal-context
    .inatgi-journal-navigation-wrapper
    .pkp_navigation_primary ul:has(a[href*="/issue/archive"]),

    body.inatgi-journal-context
    .inatgi-journal-navigation-wrapper
    .pkp_navigation_primary ul:has(a[href*="/issue/view"]) {
        top: 100% !important;
        left: 0 !important;
        right: auto !important;
        bottom: auto !important;
        margin: 0 !important;
        transform: none !important;
        box-shadow: none !important;
        -webkit-box-shadow: none !important;
        filter: none !important;
        -webkit-filter: none !important;
    }

    /* Remove any legacy decorative layer that can look like a second panel. */
    body.inatgi-journal-context
    .inatgi-journal-navigation-wrapper
    .pkp_navigation_primary li:has(> ul a[href*="/issue/current"]) > ul::before,

    body.inatgi-journal-context
    .inatgi-journal-navigation-wrapper
    .pkp_navigation_primary li:has(> ul a[href*="/issue/current"]) > ul::after,

    body.inatgi-journal-context
    .inatgi-journal-navigation-wrapper
    .pkp_navigation_primary li:has(> ul a[href*="/issue/archive"]) > ul::before,

    body.inatgi-journal-context
    .inatgi-journal-navigation-wrapper
    .pkp_navigation_primary li:has(> ul a[href*="/issue/archive"]) > ul::after {
        content: none !important;
        display: none !important;
        box-shadow: none !important;
        filter: none !important;
    }

    /*
     * OJS/theme focus styling draws a red rectangle around the top-level
     * Articles & Issues link. When the submenu is open that rectangle joins the
     * white panel and looks like a second overlapping dropdown. Replace it with
     * a restrained bottom accent line. This remains a visible keyboard-focus
     * indication rather than removing focus feedback entirely.
     */
    body.inatgi-journal-context
    .inatgi-journal-navigation-wrapper
    .pkp_navigation_primary li:has(> ul a[href*="/issue/current"]) > a:focus,

    body.inatgi-journal-context
    .inatgi-journal-navigation-wrapper
    .pkp_navigation_primary li:has(> ul a[href*="/issue/current"]) > a:focus-visible,

    body.inatgi-journal-context
    .inatgi-journal-navigation-wrapper
    .pkp_navigation_primary li:has(> ul a[href*="/issue/current"]):focus-within > a,

    body.inatgi-journal-context
    .inatgi-journal-navigation-wrapper
    .pkp_navigation_primary li:has(> ul a[href*="/issue/archive"]) > a:focus,

    body.inatgi-journal-context
    .inatgi-journal-navigation-wrapper
    .pkp_navigation_primary li:has(> ul a[href*="/issue/archive"]) > a:focus-visible,

    body.inatgi-journal-context
    .inatgi-journal-navigation-wrapper
    .pkp_navigation_primary li:has(> ul a[href*="/issue/archive"]):focus-within > a {
        outline: none !important;
        outline-offset: 0 !important;
        border: 0 !important;
        box-shadow: inset 0 -3px 0 var(--journal-accent, var(--inatgi-button, var(--inatgi-red, #b11226))) !important;
    }

    /* Open/hover state uses the same single-line treatment. */
    body.inatgi-journal-context
    .inatgi-journal-navigation-wrapper
    .pkp_navigation_primary li:has(> ul a[href*="/issue/current"]):hover > a,

    body.inatgi-journal-context
    .inatgi-journal-navigation-wrapper
    .pkp_navigation_primary li:has(> ul a[href*="/issue/archive"]):hover > a,

    body.inatgi-journal-context
    .inatgi-journal-navigation-wrapper
    .pkp_navigation_primary li:has(> ul a[href*="/issue/current"]) > a[aria-expanded="true"],

    body.inatgi-journal-context
    .inatgi-journal-navigation-wrapper
    .pkp_navigation_primary li:has(> ul a[href*="/issue/archive"]) > a[aria-expanded="true"] {
        outline: none !important;
        border: 0 !important;
        box-shadow: inset 0 -3px 0 var(--journal-accent, var(--inatgi-button, var(--inatgi-red, #b11226))) !important;
    }
}

/* ============================================================
   V3 — fallback Articles & Issues trigger cleanup
   The production header can use the JS-generated
   .inatgi-fallback-primary menu rather than the original OJS wrapper.
   In that mode the first item is Articles & Issues. Its focused/open
   anchor inherited the global red focus rectangle, which produced the
   remaining left/right red lines seen around the trigger.
   ============================================================ */
@media (min-width: 1051px) {
    body.inatgi-journal-context
    .inatgi-fallback-primary > li:first-child,
    body.inatgi-journal-context
    .inatgi-fallback-primary > li:first-child:hover,
    body.inatgi-journal-context
    .inatgi-fallback-primary > li:first-child:focus-within,
    body.inatgi-journal-context
    .inatgi-fallback-primary > li:first-child.is-open {
        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
    }

    body.inatgi-journal-context
    .inatgi-fallback-primary > li:first-child::before,
    body.inatgi-journal-context
    .inatgi-fallback-primary > li:first-child::after {
        content: none !important;
        display: none !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    body.inatgi-journal-context
    .inatgi-fallback-primary > li:first-child > a,
    body.inatgi-journal-context
    .inatgi-fallback-primary > li:first-child > a:hover,
    body.inatgi-journal-context
    .inatgi-fallback-primary > li:first-child > a:focus,
    body.inatgi-journal-context
    .inatgi-fallback-primary > li:first-child > a:focus-visible,
    body.inatgi-journal-context
    .inatgi-fallback-primary > li:first-child.is-open > a,
    body.inatgi-journal-context
    .inatgi-fallback-primary > li:first-child:focus-within > a {
        border: 0 !important;
        border-top: 0 !important;
        border-right: 0 !important;
        border-bottom: 0 !important;
        border-left: 0 !important;
        outline: 0 !important;
        outline-offset: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
    }

    /* Keep a visible but non-boxed focus/open indicator. */
    body.inatgi-journal-context
    .inatgi-fallback-primary > li:first-child > a:focus-visible,
    body.inatgi-journal-context
    .inatgi-fallback-primary > li:first-child.is-open > a,
    body.inatgi-journal-context
    .inatgi-fallback-primary > li:first-child:focus-within > a {
        color: var(--journal-accent, var(--inatgi-button, var(--inatgi-red, #b11226))) !important;
        text-decoration: underline !important;
        text-decoration-thickness: 2px !important;
        text-underline-offset: 6px !important;
    }

    /* The fallback submenu remains exactly one clean panel. */
    body.inatgi-journal-context
    .inatgi-fallback-primary > li:first-child > .inatgi-fallback-submenu {
        margin: 0 !important;
        box-shadow: none !important;
        filter: none !important;
    }
}
