:root{--workspace-sidebar-width:272px}
.side { position:fixed;inset:0 auto 0 0;width:240px;background:var(--color-primary);color:white;display:flex;flex-direction:column;padding:28px 14px 16px;z-index:30 }
.brand { display:flex;gap:10px;align-items:center;padding:0 12px 30px;font-size:calc(26px * var(--ui-font-scale,1));font-weight:750;letter-spacing:-1px }
.brand-mark { background:white;color:var(--color-accent-text);width:33px;height:33px;border-radius:9px;display:grid;place-items:center;letter-spacing:-2px }
.brand small,.menu-legend,.sidebar-fixed-foot small,.nav-leaf i { display:none }
.menu-scroll { overflow:auto;min-height:0;flex:1;scrollbar-width:thin;scrollbar-color:#ffffff50 transparent }
.workspace-menu { display:grid;gap:5px }
.nav-group>summary { display:flex;align-items:center;gap:10px;padding:12px 10px;list-style:none;font-size:calc(13px * var(--ui-font-scale,1));font-weight:550;border-radius:7px }
.nav-group>summary>span { flex:1 }
.nav-group>summary>.ico:last-child { width:12px }
.nav-group[open]>summary { background:#ffffff20 }
.nav-group[open]>summary>.ico:last-child { transform:rotate(180deg) }
.nav-children { padding:6px;margin:5px 0 10px;background:#f0eafa;border-radius:7px;color:#506690 }
.nav-subgroup>summary { list-style:none;display:flex;justify-content:space-between;align-items:center;padding:10px 8px;font-size:calc(13px * var(--ui-font-scale,1)) }
.nav-subgroup>summary svg { width:12px }
.nav-leaves { margin:0 5px;padding-left:8px;border-left:1px solid #dcd3eb }
.nav-leaf { display:flex;align-items:center;width:100%;padding:10px 11px;border:0;background:transparent;font-size:calc(13px * var(--ui-font-scale,1));color:#506690;text-align:left;line-height:1.5;border-radius:5px }
.nav-leaf:hover,.nav-leaf[aria-current] { background:#fff;color:var(--color-accent-text) }
.nav-leaf[aria-current] { font-weight:600;box-shadow:0 2px 6px #283e5510 }
.sidebar-fixed-foot { margin-top:18px;padding:16px 6px 0;border-top:1px solid #ffffff30 }
.side-foot { display:flex;align-items:center;gap:10px;font-size:calc(12px * var(--ui-font-scale,1)) }
.side-foot .avatar { width:30px;height:30px;background:#ffffff22;border-radius:8px;display:grid;place-items:center }
.sidebar-shortcuts,.component-link { display:none }

/* Sidebar v2: shared by the workspace, dashboards and reports. Native checkbox + popovers. */
:is(body,.shell)>.side{width:var(--workspace-sidebar-width);padding:22px 14px 16px;background:var(--color-primary);color:white;box-shadow:1px 0 0 var(--color-primary-hover);transition:width .18s ease}
:is(body,.shell)>.side .brand{padding:0 12px 25px;font-size:calc(25px * var(--ui-font-scale,1));min-height:48px;gap:10px;white-space:nowrap}
.side .workspace-menu{gap:6px}.side .nav-group>summary{padding:12px 11px;font-size:calc(13px * var(--ui-font-scale,1));font-weight:550;border-radius:8px;color:#fff;gap:11px}.side .nav-group>summary:hover{background:#ffffff12}.side .nav-group[open]>summary{background:#ffffff17}
.side .nav-group:has(.nav-leaf[aria-current])>summary{background:#ffffff20}
.side .nav-children{background:transparent;color:#e1ecff;padding:4px 0 8px 14px;margin:4px 0 8px 8px;border-left:0;border-radius:0}
.side .nav-subgroup>summary{font-size:calc(12px * var(--ui-font-scale,1));color:#c7dcff;padding:10px 8px;letter-spacing:.1px}
.side .nav-leaves{margin:0 0 0 12px;padding:0;border:0}.side .nav-leaf{position:relative;font-size:calc(13px * var(--ui-font-scale,1));padding:10px 10px;border-left:2px solid transparent;line-height:1.5;color:#e6efff;border-radius:6px;background:transparent}
.side .nav-leaf:hover{background:transparent;color:var(--sidebar-current-text)}.side .nav-leaf[aria-current]{position:relative;background:transparent;color:var(--sidebar-current-text);border-radius:0;font-weight:700;box-shadow:none}
.side .nav-leaf::before{content:"";position:absolute;left:-2px;top:10px;bottom:10px;width:2px;border-radius:2px;background:var(--sidebar-current-text);opacity:0;pointer-events:none}
.side .nav-leaf:hover::before{opacity:.4}
.side .nav-leaf[aria-current]::before{opacity:1}
.side .sidebar-fixed-foot{padding:16px 8px 0;margin-top:14px;border-top:1px solid #ffffff26}.side .side-foot{gap:10px}.side .side-foot .avatar{background:#ffffff20;border-radius:9px}.side .side-foot strong{font-size:calc(12px * var(--ui-font-scale,1));font-weight:550}
.side .menu-scroll{scrollbar-width:thin;scrollbar-color:#ffffff40 transparent}
.page-shell,.main-shell{margin-left:var(--workspace-sidebar-width);transition:margin-left .18s ease}
.sidebar-state{position:fixed;width:1px;height:1px;opacity:0;top:26px;left:calc(var(--workspace-sidebar-width) + 18px);z-index:99}
.sidebar-toggle{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--blue,var(--color-primary));border-radius:7px;background:#fff;color:#60748f;cursor:pointer;flex:none;margin-right:16px}
.sidebar-toggle:hover{color:var(--color-accent-text);background:var(--color-accent-soft);border-color:var(--blue,var(--color-primary))}.sidebar-state:focus-visible~.page-shell .sidebar-toggle,.sidebar-state:focus-visible~.main-shell .sidebar-toggle{outline:2px solid var(--color-focus);outline-offset:3px}.sidebar-toggle-text{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden;white-space:nowrap}
.topbar .top-context{margin-right:auto}.topbar .top-left{margin-right:auto}.topbar:has(.sidebar-toggle){justify-content:flex-start}
.sidebar-rail{display:none}.sidebar-flyout{position:fixed;inset:80px auto auto 88px;margin:0;width:276px;max-width:calc(100vw - 104px);max-height:calc(100dvh - 100px);overflow:auto;padding:10px;border:1px solid #e0e7f1;border-radius:12px;background:white;color:#243b58;box-shadow:0 16px 48px #15355825}
.sidebar-flyout::backdrop{background:transparent}.sidebar-flyout>header{display:flex;align-items:center;justify-content:space-between;padding:4px 7px 12px;border-bottom:1px solid #e9eef5;margin-bottom:8px}.sidebar-flyout>header strong{font-size:calc(14px * var(--ui-font-scale,1))}.sidebar-flyout>header button{border:0;background:transparent;color:#6c7e97;font-size:calc(24px * var(--ui-font-scale,1));cursor:pointer;width:30px;height:30px}
.sidebar-flyout .nav-children{margin:0;padding:0;background:transparent;color:#526680;border:0}.sidebar-flyout .nav-leaves{margin:0 0 0 12px;padding:0;border:0}.sidebar-flyout .nav-subgroup>summary{list-style:none;padding:10px 8px;font-size:calc(12px * var(--ui-font-scale,1));color:#71829a;display:flex;justify-content:space-between}.sidebar-flyout .nav-subgroup>summary svg{width:12px}.sidebar-flyout .nav-leaf{display:flex;width:100%;border:0;text-align:left;font:inherit;font-size:calc(13px * var(--ui-font-scale,1));border-radius:6px;padding:10px;color:#395371;background:transparent}.sidebar-flyout .nav-leaf:hover,.sidebar-flyout .nav-leaf[aria-current]{background:var(--color-accent-soft);color:var(--color-accent-text)}.sidebar-flyout .nav-leaf i{display:none}
@media(min-width:901px){
:is(:root:not([data-sidebar-collapsed]) .sidebar-state:checked,:root[data-sidebar-collapsed="true"] .sidebar-state)~.side{width:76px;padding:22px 12px 16px}:is(:root:not([data-sidebar-collapsed]) .sidebar-state:checked,:root[data-sidebar-collapsed="true"] .sidebar-state)~.side>.brand{padding:0 9px 25px;justify-content:center}:is(:root:not([data-sidebar-collapsed]) .sidebar-state:checked,:root[data-sidebar-collapsed="true"] .sidebar-state)~.side>.brand>span:not(.brand-mark){display:none}:is(:root:not([data-sidebar-collapsed]) .sidebar-state:checked,:root[data-sidebar-collapsed="true"] .sidebar-state)~.side .menu-scroll{display:none}
:is(:root:not([data-sidebar-collapsed]) .sidebar-state:checked,:root[data-sidebar-collapsed="true"] .sidebar-state)~.side .sidebar-rail{display:flex;flex-direction:column;gap:7px;overflow:auto;min-height:0;flex:1;scrollbar-width:none}.rail-button{display:flex;align-items:center;justify-content:center;flex:none;width:48px;height:44px;border:0;border-radius:8px;background:transparent;color:#e5efff;cursor:pointer}.rail-button:hover,.rail-button:focus-visible{background:#ffffff20;color:#fff}.rail-button.rail-active{background:#fff;color:var(--color-accent-text)}.rail-button:popover-open{background:#fff}.rail-button .ico{width:20px;height:20px}
:is(:root:not([data-sidebar-collapsed]) .sidebar-state:checked,:root[data-sidebar-collapsed="true"] .sidebar-state)~.side .sidebar-fixed-foot{padding:16px 0 0}:is(:root:not([data-sidebar-collapsed]) .sidebar-state:checked,:root[data-sidebar-collapsed="true"] .sidebar-state)~.side .side-foot{justify-content:center}:is(:root:not([data-sidebar-collapsed]) .sidebar-state:checked,:root[data-sidebar-collapsed="true"] .sidebar-state)~.side .side-foot>div,:is(:root:not([data-sidebar-collapsed]) .sidebar-state:checked,:root[data-sidebar-collapsed="true"] .sidebar-state)~.side .menu-legend{display:none}
:is(:root:not([data-sidebar-collapsed]) .sidebar-state:checked,:root[data-sidebar-collapsed="true"] .sidebar-state)~.page-shell,:is(:root:not([data-sidebar-collapsed]) .sidebar-state:checked,:root[data-sidebar-collapsed="true"] .sidebar-state)~.main-shell{margin-left:76px}:is(:root:not([data-sidebar-collapsed]) .sidebar-state:checked,:root[data-sidebar-collapsed="true"] .sidebar-state)~.page-shell .sidebar-toggle svg,:is(:root:not([data-sidebar-collapsed]) .sidebar-state:checked,:root[data-sidebar-collapsed="true"] .sidebar-state)~.main-shell .sidebar-toggle svg{transform:rotate(180deg)}
}
@media(max-width:900px){.sidebar-state,.sidebar-toggle{display:none}.page-shell,.main-shell{margin-left:0}.mobile-nav .side{background:var(--color-primary)}.sidebar-flyout{display:none}}
@media(prefers-reduced-motion:reduce){:is(body,.shell)>.side,.page-shell,.main-shell{transition:none}}

/* Category headings stay distinct from individual menu links. */
.side .nav-subgroup>summary,.sidebar-flyout .nav-subgroup>summary{font-weight:700}
/* Soft category highlights with a thin edge to distinguish submenu headings. */
.sidebar-flyout .nav-subgroup>summary{color:#24559b;background:var(--color-accent-soft);border:0;border-left:1px solid #a8ceff;border-radius:0 6px 6px 0;padding:10px;margin:2px 0;font-weight:700}
.side .nav-subgroup>summary{color:#fff;background:#ffffff12;border:0;border-left:1px solid #a8ceff80;border-radius:0 6px 6px 0;padding:10px;margin:2px 0;font-weight:700}

/* Isolate navigation typography from each page's legacy body styles. */
.side,.sidebar-flyout{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:calc(14px * var(--ui-font-scale,1));line-height:1.5;font-weight:400}
.side .brand{color:white;letter-spacing:-1px}.side .brand-mark{padding:0;font-size:calc(25px * var(--ui-font-scale,1));font-weight:750;line-height:1.5;letter-spacing:-2px}
.side .menu-scroll{padding:0}.side .side-foot{padding:0;margin:0;border:0;font-size:calc(12px * var(--ui-font-scale,1));line-height:1.5}.side .side-foot .avatar{width:30px;height:30px;font-size:calc(12px * var(--ui-font-scale,1));font-weight:400;line-height:1.5;flex:none}
.side svg.ico,.sidebar-flyout svg.ico{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.side .nav-group>summary>.ico:last-child,.side .nav-subgroup>summary svg{width:12px}
.side .nav-leaf{font-family:inherit;gap:0;min-height:0}.side .nav-subgroup>summary{gap:0}
.side .sidebar-shortcuts,.side .component-link,.side .menu-legend,.side .sidebar-fixed-foot small{display:none}
.side .nav-group>summary,.side .nav-subgroup>summary{list-style:none}.side summary::-webkit-details-marker{display:none}
.side .nav-leaf:focus-visible,.side summary:focus-visible,.sidebar-flyout a:focus-visible{outline:2px solid #bcd8ff;outline-offset:2px}


/* Direct destinations shared by expanded, mobile, and compact navigation. */
.side .nav-shortcut{padding:12px 11px;gap:11px;font-weight:550;color:#fff;border-radius:8px}.side .nav-shortcut .ico{width:18px;height:18px;flex:none}.rail-button[aria-current="page"]{background:#fff;color:var(--color-accent-text)}

/* Compact header shared with legacy hash pages and standalone pages. */
.topbar{height:56px;min-height:56px;flex:0 0 56px;box-sizing:border-box}

.side .nav-subgroup>summary:hover,.side .nav-subgroup[open]>summary{background:#ffffff1c}
.sidebar-flyout .nav-subgroup>summary:hover,.sidebar-flyout .nav-subgroup[open]>summary{background:var(--color-accent-soft)}
.side .nav-group>summary,.side .nav-subgroup>summary{box-shadow:none}

/* Separate submenu categories without spreading individual menu items. */
.side .nav-subgroup + .nav-subgroup,.sidebar-flyout .nav-subgroup + .nav-subgroup{margin-top:10px}

/* Subtle depth while retaining the primary blue at the top. */
:is(body,.shell)>.side,.mobile-nav .side{background:linear-gradient(180deg,var(--color-primary) 0%,var(--color-primary) 55%,var(--color-primary-hover) 100%)}

/* Company branding: preserve image proportions; do not crop or recolor tenant logos.
   data-logo-layout: wide | square | image-text. For image-text, set company-name.
   A separate compact image can replace the initial in company-brand-fallback.
   data-logo-surface="light" provides contrast for logos intended for white backgrounds. */
.side .brand.company-brand{display:flex;align-items:center;gap:12px;min-height:66px;flex:0 0 auto;padding:0 12px 20px;letter-spacing:0}
.side .company-brand .company-logo{display:block;width:200px;max-width:100%;height:44px;object-fit:contain;object-position:left center;flex:0 1 auto;min-width:0}
.side .company-name,.side .company-brand-fallback{display:none}
.side .company-brand[data-logo-layout="square"] .company-logo{width:44px;height:44px;flex:none}
.side .company-brand[data-logo-layout="image-text"] .company-logo{width:44px;height:44px;flex:none}
.side .company-brand[data-logo-layout="image-text"] .company-name{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:calc(19px * var(--ui-font-scale,1));font-weight:650;letter-spacing:-.3px}
.side .company-brand[data-logo-surface="light"] .company-logo{background:#fff;border-radius:7px;padding:5px}
.side .company-brand .company-brand-fallback{font-size:calc(21px * var(--ui-font-scale,1));letter-spacing:0}
.side .nav-shortcut{justify-content:flex-start}
@media(min-width:901px){
:is(:root:not([data-sidebar-collapsed]) .sidebar-state:checked,:root[data-sidebar-collapsed="true"] .sidebar-state)~.side>.company-brand{padding:0 9px 20px;min-height:66px}
:is(:root:not([data-sidebar-collapsed]) .sidebar-state:checked,:root[data-sidebar-collapsed="true"] .sidebar-state)~.side .company-brand .company-logo,:is(:root:not([data-sidebar-collapsed]) .sidebar-state:checked,:root[data-sidebar-collapsed="true"] .sidebar-state)~.side .company-brand .company-name{display:none}
:is(:root:not([data-sidebar-collapsed]) .sidebar-state:checked,:root[data-sidebar-collapsed="true"] .sidebar-state)~.side .company-brand .company-brand-fallback{display:grid}
}

/* Tenant logo alignment follows its composition. */
.side .brand.company-brand[data-logo-layout="square"]{justify-content:center}
.side .brand.company-brand[data-logo-layout="image-text"]{width:100%;box-sizing:border-box}
.side .company-brand[data-logo-layout="image-text"] .company-name{flex:1;white-space:normal;overflow-wrap:anywhere;line-height:1.25}
