/* Extracted from Shared/Header.razor (inline <style>) so the rules are cached
   once instead of shipping inside every Blazor render. */
    /* Global styles for MudMenu popovers (rendered outside component DOM, so scoped CSS won't reach them) */
    .header-nav__popover {
        z-index: var(--egk-z-nav-popover, 5008) !important;
        pointer-events: auto !important;
        overflow: visible !important;
        box-shadow: 0 12px 40px rgba(0,0,0,0.18) !important;
        border-radius: var(--egk-radius-lg, 12px) !important;
    }

    .header-nav__popover .mud-popover-paper {
        overflow: visible;
        border-radius: 12px;
        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
        max-height: calc(100dvh - 88px);
    }

    .header-nav__dropdown {
        border: 1px solid var(--mud-palette-divider);
        background: var(--mud-palette-surface);
        box-sizing: border-box;
        width: min(92vw, 520px);
        max-height: calc(100dvh - 96px);
        max-width: calc(100vw - 32px);
        overflow-y: auto;
        overflow-x: hidden;
        overscroll-behavior: contain;
        scrollbar-width: thin;
        scrollbar-color: rgba(var(--mud-palette-primary-rgb), 0.45) transparent;
    }

    .header-nav__dropdown::-webkit-scrollbar {
        width: 8px;
    }

    .header-nav__dropdown::-webkit-scrollbar-track {
        background: transparent;
    }

    .header-nav__dropdown::-webkit-scrollbar-thumb {
        background: rgba(var(--mud-palette-primary-rgb), 0.35);
        border-radius: 999px;
        border: 2px solid transparent;
        background-clip: content-box;
    }

    /* Wide multi-column mega-menu (Resources / Company) */
    .header-nav__dropdown--mega {
        width: min(94vw, 760px);
        max-width: calc(100vw - 32px);
        max-height: min(720px, calc(100dvh - 96px));
    }

    .header-nav__mega {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 4px 18px;
        align-items: start;
    }

    .header-nav__mega-col {
        min-width: 0;
    }

    .header-nav__mega-title {
        display: flex;
        align-items: center;
        gap: 4px;
        text-transform: uppercase;
        letter-spacing: 0.08em;
        font-size: 0.72rem;
        font-weight: 700;
        color: var(--mud-palette-text-secondary);
        padding: 10px 12px 6px;
    }

    .header-nav__mega-title:hover {
        color: var(--mud-palette-primary);
    }

    .header-nav__item--compact {
        margin: 2px 0;
        padding: 8px 12px;
    }

    @media (max-width: 820px) {
        .header-nav__mega {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }
    }

    /* Apps launcher dropdown (Platform) — full module catalog grouped by category */
    .header-nav__dropdown--apps {
        width: min(96vw, 940px);
        max-width: calc(100vw - 32px);
        max-height: min(760px, calc(100dvh - 96px));
    }

    .header-nav__apps-quicklinks {
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
    }

    .header-nav__quicklink {
        text-transform: none;
        border-radius: var(--egk-radius-sm, 8px);
    }

    .header-nav__apps {
        columns: 3;
        column-gap: 20px;
    }

    .header-nav__apps-col {
        break-inside: avoid;
        display: inline-block;
        width: 100%;
        margin-bottom: 10px;
    }

    .header-nav__app-item {
        min-width: 0;
        width: 100%;
    }

    .header-nav__app-name {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .header-nav__premium {
        color: var(--mud-palette-warning) !important;
        font-size: 1rem !important;
        flex-shrink: 0;
    }

    @media (max-width: 860px) {
        .header-nav__apps {
            columns: 2;
        }
    }

    .header-nav__dropdown-header {
        position: sticky;
        top: -16px;
        z-index: 1;
        padding-bottom: 12px;
        border-bottom: 1px solid var(--mud-palette-divider);
        background: var(--mud-palette-surface);
        padding-top: 4px;
    }

    .header-nav__dropdown-footer {
        position: sticky;
        bottom: -16px;
        z-index: 1;
        padding-top: 12px;
        background: var(--mud-palette-surface);
    }

    .header-nav__item {
        margin: 4px 0;
        padding: 12px 16px;
        border-radius: 8px;
        transition: all 0.2s ease;
    }

    .header-nav__item:hover {
        background-color: var(--mud-palette-action-hover);
        transform: translateX(4px);
    }

    .header-nav__item--demo:hover {
        background-color: rgba(var(--mud-palette-primary-rgb), 0.1);
    }

    /* Active state for desktop dropdown items */
    .header-nav__item--active {
        background-color: rgba(var(--mud-palette-primary-rgb), 0.08) !important;
        border-inline-start: 3px solid var(--mud-palette-primary);
        font-weight: 600;
    }

    .header-nav__item--active:hover {
        background-color: rgba(var(--mud-palette-primary-rgb), 0.14) !important;
    }

    /* Dark mode overrides for popover dropdowns */
    .mud-theme-dark .header-nav__dropdown {
        background: var(--mud-palette-dark-surface);
        border-color: var(--mud-palette-dark-divider);
    }

    .mud-theme-dark .header-nav__dropdown-header,
    .mud-theme-dark .header-nav__dropdown-footer {
        background: var(--mud-palette-dark-surface);
    }

    @supports not (height: 100dvh) {
        .header-nav__popover .mud-popover-paper,
        .header-nav__dropdown {
            max-height: calc(100vh - 88px);
        }
    }

    @media (max-height: 720px) {
        .header-nav__item {
            padding-top: 9px;
            padding-bottom: 9px;
        }

        .header-nav__dropdown {
            padding-top: 12px !important;
            padding-bottom: 12px !important;
        }
    }

    .mud-theme-dark .header-nav__item:hover {
        background-color: rgba(var(--mud-palette-primary-rgb), 0.1);
    }

    .mud-theme-dark .header-nav__item--active {
        background-color: rgba(var(--mud-palette-primary-rgb), 0.14) !important;
    }

    /* RTL support for popover items */
    [dir="rtl"] .header-nav__popover,
    [dir="rtl"] .header-nav__dropdown {
        direction: rtl;
    }

    [dir="rtl"] .header-nav__dropdown,
    [dir="rtl"] .header-nav__dropdown-header,
    [dir="rtl"] .header-nav__dropdown-footer,
    [dir="rtl"] .header-nav__mega-title,
    [dir="rtl"] .header-nav__item,
    [dir="rtl"] .header-nav__item .mud-typography {
        text-align: right;
    }

    [dir="rtl"] .header-nav__item .d-flex {
        flex-direction: row-reverse;
    }

    [dir="rtl"] .header-nav__dropdown .mud-list-item,
    [dir="rtl"] .header-nav__dropdown .mud-list-item-gutters,
    [dir="rtl"] .header-nav__dropdown .mud-menu-item {
        direction: rtl;
        text-align: right;
    }

    [dir="rtl"] .header-nav__dropdown .mud-list-item-icon {
        margin-left: 12px !important;
        margin-right: 0 !important;
        min-width: 24px;
    }

    [dir="rtl"] .header-nav__dropdown .mud-list-item-text {
        text-align: right;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    [dir="rtl"] .header-nav__item .mr-3 {
        margin-right: 0 !important;
        margin-left: 0.75rem !important;
    }

    [dir="rtl"] .header-nav__dropdown-footer {
        justify-content: flex-start;
    }

    [dir="rtl"] .header-nav__dropdown-footer .mud-button-root {
        direction: rtl;
    }

    [dir="rtl"] .header-nav__dropdown-footer .mud-button-start-icon,
    [dir="rtl"] .header-nav__item .mud-button-start-icon {
        margin-right: 0 !important;
        margin-left: 8px !important;
    }

    [dir="rtl"] .header-nav__item:hover,
    [dir="rtl"] .header-nav__item--active {
        transform: translateX(-4px);
    }

    /* Active state for mobile drawer nav items */
    .mobile-nav-items .mud-nav-link.active {
        background: rgba(var(--mud-palette-primary-rgb), 0.12) !important;
        color: var(--mud-palette-primary) !important;
        font-weight: 600;
        border-inline-start: 3px solid var(--mud-palette-primary);
    }

    .mud-theme-dark .mobile-nav-items .mud-nav-link.active {
        background: rgba(var(--mud-palette-primary-rgb), 0.18) !important;
    }

    /* Active parent group indicator in mobile drawer */
    .mobile-nav-items .mud-nav-group:has(.mud-nav-link.active) > .mud-nav-link {
        color: var(--mud-palette-primary) !important;
        font-weight: 600;
    }

    /* Nested sub-group indentation in mobile drawer */
    .mobile-nav-items .header-nav__subgroup .mud-nav-link {
        padding-inline-start: 28px;
    }

    /* The mobile slide-in drawer is a DOM descendant of the primary-colored
       MudAppBar, so its nav links/labels (which carry no explicit color) would
       otherwise inherit the appbar's white text and become invisible on the
       drawer's surface. Reset the panel to readable theme text colors. */
    .header-nav__action-btn {
        border-radius: 8px;
    }

    .header-nav__search-field {
        min-width: 220px;
        max-width: 320px;
        flex: 1;
    }

    .header-nav__search-compact {
        min-width: 160px;
        max-width: 200px;
    }

    .header-nav__search-input .mud-input-root {
        background: rgba(255, 255, 255, 0.12);
        border-radius: var(--egk-radius-md, 10px);
    }

    .header-nav__search-input .mud-input-outlined-border {
        border-color: rgba(255, 255, 255, 0.25) !important;
    }

    .header-nav__search-input .mud-input-control,
    .header-nav__search-input .mud-input-slot,
    .header-nav__search-input input,
    .header-nav__search-input textarea {
        color: var(--egk-on-brand) !important;
        -webkit-text-fill-color: var(--egk-on-brand) !important;
    }

    .header-nav__search-input input::placeholder,
    .header-nav__search-input textarea::placeholder {
        color: var(--egk-on-brand-subtle) !important;
        opacity: 1 !important;
        -webkit-text-fill-color: var(--egk-on-brand-subtle) !important;
    }

    .header-nav__search-input .mud-input-adornment .mud-icon-root {
        color: var(--egk-on-brand-muted) !important;
    }

    .header-nav__mobile-search {
        width: 100%;
        padding: 0 12px 10px;
        animation: headerSearchSlide 0.18s ease-out;
    }

    .header-nav__search-input--mobile .mud-input-root {
        width: 100%;
    }

    @keyframes headerSearchSlide {
        from { opacity: 0; transform: translateY(-4px); }
        to { opacity: 1; transform: translateY(0); }
    }

    @media (prefers-reduced-motion: reduce) {
        .header-nav__mobile-search { animation: none; }
    }

    .header-nav__panel {
        color: var(--mud-palette-text-primary);
        background: var(--mud-palette-surface);
    }

    .header-nav__panel .mud-nav-link,
    .header-nav__panel .mud-nav-group > .mud-nav-link {
        color: var(--mud-palette-text-primary);
    }

    .header-nav__panel .mud-nav-link .mud-nav-link-icon:not(.mud-nav-link-icon-default),
    .header-nav__panel .mud-nav-link .mud-icon-root {
        color: var(--mud-palette-text-secondary);
    }

    .header-nav__panel .mobile-nav-items .mud-nav-link.active,
    .header-nav__panel .mobile-nav-items .mud-nav-link.active .mud-icon-root {
        color: var(--mud-palette-primary) !important;
    }

    .mud-theme-dark .header-nav__panel {
        background: var(--mud-palette-dark-surface);
    }
