/* Oss.Menu.Blazor - Shared Theme Variables
   Include this file in your app to enable theming.
   Override any variable in your own CSS to customize. */

:root,
[data-bs-theme="light"] {
    /* Sidebar — DX Fluent light neutral surfaces */
    --tsd-menu-sidebar-width: 250px;
    --tsd-menu-sidebar-compressed-width: 64px;
    --tsd-menu-sidebar-bg: #F4F4F3;
    --tsd-menu-sidebar-nav-bg: #E9E9E8;
    --tsd-menu-sidebar-text: #161616;

    /* Header — white default surface */
    --tsd-menu-header-bg: #FFFFFE;
    --tsd-menu-header-text: #161616;
    --tsd-menu-header-border: #D3D3D2;
    --tsd-menu-header-btn-text: #3F3F3E;

    /* Nav items — Fluent neutral + primary accent */
    --tsd-menu-item-hover-bg: #F4F4F3;
    --tsd-menu-item-active-bg: var(--bs-primary-bg-subtle, #E7EFF9);
    --tsd-menu-item-active-text: var(--bs-primary-text-emphasis, #0B5699);
    --tsd-menu-item-text: #3F3F3E;
    --tsd-menu-item-icon-text: #767676;
    --tsd-menu-item-radius: 6px;
    --tsd-menu-item-show-bg: #E9E9E8;
    --tsd-menu-item-show-text: #161616;

    /* Dropdowns / submenus */
    --tsd-menu-dropdown-bg: #FFFFFE;
    --tsd-menu-dropdown-border: 1px solid #D3D3D2;
    --tsd-menu-dropdown-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    --tsd-menu-submenu-hover-bg: #F4F4F3;
    --tsd-menu-submenu-hover-text: #3F3F3E;
    --tsd-menu-submenu-active-bg: var(--bs-primary-bg-subtle, #E7EFF9);
    --tsd-menu-submenu-active-text: var(--bs-primary-text-emphasis, #0B5699);

    /* Navbar toggler */
    --tsd-menu-navbar-toggler-bg: #E9E9E8;

    /* Transitions */
    --tsd-menu-transition-duration: 0.25s;
    --tsd-menu-transition-easing: ease-in-out;

    /* Typography */
    --tsd-menu-font-size: 0.875rem;
    --tsd-menu-item-height: 2.75rem;
    --tsd-menu-item-gap: 0.25rem;

    /* Active indicator — Bootstrap primary */
    --tsd-menu-active-indicator-width: 3px;
    --tsd-menu-active-indicator-color: var(--bs-primary, #0F6CBD);

    /* Breadcrumb */
    --tsd-menu-breadcrumb-color: var(--bs-secondary, #6c757d);

    /* Glass support (no glass by default) */
    --tsd-menu-item-bg: transparent;
    --tsd-menu-item-border: none;
    --tsd-menu-item-backdrop: none;
    --tsd-menu-surface-backdrop: none;
    /* --tsd-menu-horizontal-bg: inherits --tsd-menu-sidebar-nav-bg when unset */
}

[data-bs-theme="dark"] {
    /* Sidebar — DX Fluent dark neutral surfaces */
    --tsd-menu-sidebar-bg: #282828;
    --tsd-menu-sidebar-nav-bg: #1D1E1D;
    --tsd-menu-sidebar-text: #C8C8C7;

    /* Header — deepest surface layer */
    --tsd-menu-header-bg: #161616;
    --tsd-menu-header-text: #FFFFFE;
    --tsd-menu-header-border: #767676;
    --tsd-menu-header-btn-text: #C8C8C7;

    /* Nav items — Fluent neutral + primary accent */
    --tsd-menu-item-hover-bg: #3F3F3E;
    --tsd-menu-item-active-bg: var(--bs-primary-bg-subtle, #064982);
    --tsd-menu-item-active-text: #FFFFFE;
    --tsd-menu-item-text: #C8C8C7;
    --tsd-menu-item-icon-text: #949493;
    --tsd-menu-item-show-bg: #2E2E2D;
    --tsd-menu-item-show-text: #FFFFFE;

    /* Dropdowns / submenus */
    --tsd-menu-dropdown-bg: #252525;
    --tsd-menu-dropdown-border: 1px solid #767676;
    --tsd-menu-dropdown-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
    --tsd-menu-submenu-hover-bg: #3F3F3E;
    --tsd-menu-submenu-hover-text: #FFFFFE;
    --tsd-menu-submenu-active-bg: var(--bs-primary-bg-subtle, #064982);
    --tsd-menu-submenu-active-text: #FFFFFE;

    /* Navbar toggler */
    --tsd-menu-navbar-toggler-bg: #3F3F3E;

    /* Active indicator — Bootstrap primary accent */
    --tsd-menu-active-indicator-color: var(--bs-primary, #3C92E9);
}