/* ==========================================================================
   OfficeGest — Mega Menu (v3 - cores corretas + layout estavel)
   ========================================================================== */

/* ---- Submenu container ---- */

.wp-block-navigation .wp-block-navigation__submenu-container {
    background-color: var(--wp--preset--color--surface) !important;
    color: var(--wp--preset--color--text) !important;
    border: 1px solid var(--wp--preset--color--border) !important;
    border-radius: var(--og-r-md, 10px) !important;
    box-shadow: var(--og-shadow-lg) !important;
    padding: 0.375rem !important;
    min-width: 220px !important;

    /* Sem gap entre item pai e submenu */
    margin-top: 0 !important;
    top: 100% !important;

    /* Animação */
    transition: opacity 180ms ease, transform 180ms ease;
}

/* Animação de saída */
.wp-block-navigation .has-child:not(:hover):not(:focus-within):not(:has(> a[aria-expanded="true"])):not(:has(> button[aria-expanded="true"])) > .wp-block-navigation__submenu-container {
    transform: translateY(-4px);
}

/* ---- Items do submenu — TEXTO CLARO ---- */

.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content,
.wp-block-navigation .wp-block-navigation__submenu-container a.wp-block-navigation-item__content {
    color: var(--wp--preset--color--text) !important;
    background: transparent !important;
    border-radius: var(--og-r-sm, 6px);
    padding: 0.625rem 0.875rem !important;
    font-size: 0.875rem !important;
    font-weight: 500;
    transition: background-color 120ms ease, color 120ms ease;
    display: block;
    text-decoration: none;
}

.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus {
    background-color: var(--wp--preset--color--elevated) !important;
    color: var(--wp--preset--color--brand-secondary) !important;
}

/* ---- Item pai: estado activo (so visivel quando submenu aberto, NAO permanente) ---- */

/*
   Removido o estilo permanente. Apenas hover e focus-within mostram destaque.
*/
.wp-block-navigation .has-child:hover > a.wp-block-navigation-item__content,
.wp-block-navigation .has-child:focus-within > a.wp-block-navigation-item__content {
    color: var(--wp--preset--color--brand-secondary) !important;
}

/* ---- Caret/seta no item pai ---- */

.wp-block-navigation .has-child > a.wp-block-navigation-item__content::after {
    content: "";
    display: inline-block;
    width: 0.5rem;
    height: 0.5rem;
    margin-left: 0.375rem;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
    transition: transform 180ms ease;
    opacity: 0.6;
    vertical-align: middle;
}

.wp-block-navigation .has-child:hover > a.wp-block-navigation-item__content::after,
.wp-block-navigation .has-child:focus-within > a.wp-block-navigation-item__content::after {
    transform: rotate(225deg) translateY(2px);
    opacity: 1;
}

/* ---- Esconder o button toggle nativo do WP (so visual; JS continua a usar) ---- */

.wp-block-navigation-submenu__toggle {
    display: none !important;
}

.wp-block-navigation-item .wp-block-navigation__submenu-icon {
    display: none !important;
}

/* ---- Acessibilidade: focus visible ---- */

.wp-block-navigation a:focus-visible {
    outline: 2px solid var(--wp--preset--color--brand-secondary);
    outline-offset: 2px;
    border-radius: 4px;
}

/* ---- Mobile: comportamento WP nativo ---- */

@media (max-width: 781px) {
    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
        position: static !important;
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        padding: 0 0 0 1rem !important;
        opacity: 1 !important;
        transform: none !important;
        min-width: auto !important;
    }

    /* Em mobile, mostrar button toggle (necessario para abrir) */
    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle {
        display: inline-flex !important;
    }

    /* Em mobile, esconder o caret CSS que adicionamos (button do WP ja tem icon) */
    .wp-block-navigation__responsive-container.is-menu-open .has-child > a::after {
        display: none;
    }
}