/* Approved navigation preview, 2026-09-29. No business workspace styles. */
.app-shell { --nav-primary:#f1f4f9; --nav-secondary:#f8fafd; --nav-ink:#24334b; --nav-muted:#738098; --nav-line:#e2e7f0; --nav-accent:#4361ee; --nav-hover:#e8eef8; --nav-footer-height:72px; --nav-header-height:60px; }
html[data-ui-template="service-v1"] .app-shell .app-sidebar { background:var(--nav-primary)!important; border-right:1px solid var(--nav-line)!important; box-shadow:none!important; overflow:hidden!important; }
.app-shell .app-sidebar .ant-layout-sider-children { display:flex; flex-direction:column; min-height:0; height:100%; }
.app-shell .app-sidebar nav { flex:1; min-height:0; overflow:auto; padding:8px 0; scrollbar-width:thin; scrollbar-color:transparent transparent; }
.app-shell .app-sidebar nav:hover { scrollbar-color:#c4cddc transparent; }
html[data-ui-template="service-v1"] .app-shell .app-brand { height:var(--nav-header-height); min-height:var(--nav-header-height); flex:0 0 var(--nav-header-height); padding:10px 16px; gap:10px; border-bottom:1px solid var(--nav-line); }
html[data-ui-template="service-v1"] .app-shell .app-brand-mark { width:34px; height:34px; flex-basis:34px; background:var(--nav-accent); border-radius:8px; box-shadow:none; font-size:19px; }
html[data-ui-template="service-v1"] .app-shell .app-brand-copy strong { color:var(--nav-ink); font-size:15px; font-weight:700; letter-spacing:0; }
html[data-ui-template="service-v1"] .app-shell .app-brand-copy small { color:var(--nav-muted); font-size:11px; }
html[data-ui-template="service-v1"] .app-shell .app-sidebar .ant-menu { background:transparent!important; color:var(--nav-ink); margin-top:0!important; }
html[data-ui-template="service-v1"] .app-shell .app-sidebar :is(.ant-menu-item,.ant-menu-submenu-title) { color:var(--nav-ink)!important; height:42px; line-height:42px; margin:2px 10px!important; width:calc(100% - 20px)!important; border-radius:8px!important; font-size:14px; font-weight:500; }
.app-shell .app-sidebar :is(.ant-menu-item-icon,.ant-menu-submenu-arrow) { color:inherit!important; }
.app-shell .app-sidebar .ant-menu-item-icon { font-size:17px!important; }
html[data-ui-template="service-v1"] .app-shell .app-sidebar .ant-menu-item-selected { color:#fff!important; background:var(--nav-accent)!important; box-shadow:none!important; }
html[data-ui-template="service-v1"] .app-shell .app-sidebar :is(.ant-menu-item:not(.ant-menu-item-selected),.ant-menu-submenu-title):hover { background:var(--nav-hover)!important; color:var(--nav-ink)!important; }
.app-shell .app-sidebar .ant-menu-inline-collapsed > :is(.ant-menu-item,.ant-menu-submenu) > .ant-menu-submenu-title { padding-inline:12px!important; }
html[data-ui-template="service-v1"] .app-shell .app-header { height:var(--nav-header-height)!important; flex:0 0 var(--nav-header-height); padding-inline:18px; background:var(--nav-secondary)!important; border-bottom:1px solid var(--nav-line)!important; box-shadow:none!important; }
.app-shell .app-page-title { color:var(--nav-ink)!important; font-size:16px; font-weight:700; }
.app-shell .app-menu-toggle { color:var(--nav-ink)!important; }
.app-sidebar-footer { display:flex; flex:0 0 var(--nav-footer-height); min-height:var(--nav-footer-height); height:var(--nav-footer-height); align-items:center; padding:10px 16px; border-top:1px solid var(--nav-line); background:var(--nav-primary); }
.app-sidebar-footer .app-account { width:100%; height:42px; gap:10px; padding:4px 0; color:var(--nav-ink); text-align:left; }
.app-sidebar-footer .app-account .ant-avatar { flex:0 0 32px; background:#dbe2ee!important; color:#fff!important; }
.app-sidebar-footer .app-account-label { flex:1; font-size:14px; font-weight:500; }
.app-sidebar-footer .app-account-gear { flex:0 0 19px; color:#425774; }
.app-sidebar-footer .app-account:hover { color:var(--nav-accent); }
.app-sidebar-footer .app-account:focus-visible { outline:2px solid var(--nav-accent); outline-offset:3px; border-radius:6px; }
.app-sidebar.ant-layout-sider-collapsed .app-sidebar-footer { justify-content:center; padding:8px; }
.app-sidebar.ant-layout-sider-collapsed .app-sidebar-footer .app-account { justify-content:center; }
.app-sidebar.ant-layout-sider-collapsed .app-account :is(.app-account-label,.app-account-gear) { display:none; }
html[data-opc-navigation-theme="dark"] .app-shell[data-page="opc"] { --nav-primary:#172238; --nav-secondary:#1d2a40; --nav-ink:#e5edf9; --nav-muted:#9caec9; --nav-line:#2c3b53; --nav-hover:#293954; }
@media(max-width:767px) { .app-shell { --nav-header-height:56px; } .app-shell .app-sidebar-footer .app-account-label { display:block; } html[data-ui-template="service-v1"] .app-shell .app-header { padding-inline:10px; } }
@media(prefers-reduced-motion:reduce) { .app-sidebar * { transition:none!important; } }
