/* Header interactive styles: minimal, non-invasive */
/* Sticky header */
#head.sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    background: var(--gobbo-header-bg, #ffffff);
    transition: transform 0.2s ease, background 0.2s ease;
}

/* Reduce header height when sticky */
#head.sticky #cabecera { transform: scale(0.98); }

/* Mobile menu toggle button */
.header-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 6px;
    background: transparent;
    border: 0;
    cursor: pointer;
}

.header-toggle:focus { outline: 3px solid #ffd54f; outline-offset: 2px; }

/* Mobile: ensure offcanvas / main menu content is visible inside the bootstrap offcanvas
   (some themes previously hid #main-menu which prevented offcanvas content from showing). */
@media (max-width: 991px) {
    /* Make sure the menu inside the offcanvas is visible on small screens. Use !important to override
       any other rule that was hiding it (non-destructive and scoped to small screens). */
    #main-menu { display: block !important; }
}

/* Mobile: ensure the collapse-menu (second-level lists) are displayed correctly inside the offcanvas.
   Bootstrap toggles the class 'collapse' and 'show' — avoid custom rules that hide them. */
@media (max-width: 991px) {
    .collapse-menu { display: block !important; height: auto !important; visibility: visible !important; }
    /* Small transition when expanding on mobile (respects reduced motion) */
    .collapse-menu { transition: max-height 220ms ease; overflow: visible; }
}

/* Desktop: no hover-open behavior. Menus will open via Bootstrap's native clicks/toggles.
   The hover-based reveal was removed to respect the original interaction model. */

/* Simple visible focus states */
#head a:focus, #head button:focus { outline: 3px solid rgba(0,123,255,0.25); }

/* Accessible hidden utility */
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; border: 0; }

/* (Reverted menu-specific collapsed-menu rules) */