/* Live navigation only. Isolated from the horizontal page-toolbar layout. */
body.hasAppNavigation{--navigation-width:200px;padding-left:var(--navigation-width);transition:padding-left 180ms ease}
body.appNavigationCompact{--navigation-width:60px}
body.hasAppNavigation>.topHeader,body.hasAppNavigation>.appShell,body.hasAppNavigation>.appFooter{width:100%;max-width:100%;min-width:0;margin-left:0;margin-right:0}
body.hasAppNavigation>.appShell>.wrap>.previewPanel{padding:0;border-radius:0;box-shadow:none}
.appNavigation{position:fixed;inset:0 auto 0 0;width:var(--navigation-width);height:100dvh;z-index:16;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;background:#9b9b9b;border-right:2px solid #000;padding:12px 6px;padding-left:10px;font-family:var(--app-font);color:#111;transition:width 180ms ease}
.appNavigationHead{display:flex;align-items:center;gap:8px;min-height:52px;flex:0 0 auto;margin-bottom:12px;padding:0 4px}
.appNavigationBrand{display:flex;align-items:center;min-width:0;flex:1}
.appNavigationBrand img{display:block;width:180px;max-width:100%;height:48px;object-fit:contain}.appNavigationBrand>span{display:none;font-weight:800;font-size:16px}
.appNavigationToggle,.appNavigationMobileToggle{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border:1px solid transparent;border-radius:6px;background:transparent;color:#475467;width:32px;height:32px;padding:6px;cursor:pointer}
.appNavigationToggle:hover,.appNavigationMobileToggle:hover{background:#e4e7ec;color:#111}.appNavigationMobileToggle{display:none}
.appNavigation svg{display:block;width:20px;height:20px;flex-shrink:0;pointer-events:none}
.appNavigationMobileToggle svg{width:20px;height:20px}
.appNavigation .appNavigationContent{display:block;width:100%;max-width:100%;min-width:0;min-height:0;margin:0;padding:0 0 8px;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;flex:1 1 0;scrollbar-width:thin;scrollbar-color:#f5f5f5 transparent}
.appNavigation .sheetTabs{display:flex;flex-direction:column;flex-wrap:nowrap;align-items:stretch;justify-content:flex-start;gap:4px;width:100%;height:max-content;align-content:start;padding:0;margin:0;border:0;background:none}
.appNavigation .sheetTabMenuHost{display:grid;grid-template-columns:minmax(0,1fr) 32px;align-items:center;align-content:start;position:relative;flex:0 0 auto;width:100%;height:max-content;min-height:0;grid-template-rows:44px max-content;grid-auto-rows:max-content;align-self:start;gap:0;border-radius:7px}
.appNavigation .sheetTab{display:flex;align-items:center;gap:12px;min-width:0;width:100%;min-height:44px;text-align:left;border:0;border-radius:7px;background:transparent;color:#ffffff;padding:10px 12px;font:14px/20px var(--app-font);white-space:nowrap;transition:background-color 140ms ease,color 140ms ease}
.appNavigation .sheetTabMenuHost:has(>.sheetTab:hover){background:#858585}
.appNavigation .sheetTab.active{background:#0060ff;color:#fff}
.appNavigation .sheetTabMenuHost:has(>.sheetTab.active){background:linear-gradient(#0060ff 44px,transparent 44px)}
.appNavigationIcon{display:flex;flex:0 0 20px;align-items:center;justify-content:center}.appNavigationLabel{overflow:hidden;text-overflow:ellipsis}
.appNavigationDisclosure{grid-column:2;grid-row:1;display:flex;align-items:center;justify-content:center;align-self:start;border:0;border-radius:6px;background:transparent;cursor:pointer;color:#000000;height:44px;padding:6px;width:32px}
.appNavigationDisclosure svg{width:16px;height:16px;transition:transform 160ms ease}.appNavigationDisclosure[aria-expanded="true"] svg{transform:rotate(180deg)}
.appNavigationDisclosure:hover{background:#0000000c}
.appNavigation .sheetSubMenu,.appNavigation .sheetTabMenuHost.menuDismissed .sheetSubMenu{position:static;display:grid!important;grid-column:1 / -1;grid-row:2;height:max-content;min-height:0;align-self:start;align-content:start;grid-template-rows:none;grid-auto-rows:max-content;gap:2px;width:100%;min-width:0;max-width:100%;max-height:none;overflow:visible;padding:6px 4px 6px 32px;border:0;box-shadow:none;background:#9b9b9b}
.appNavigation .sheetSubMenu[hidden],.appNavigation .sheetTabMenuHost.menuDismissed .sheetSubMenu[hidden]{display:none!important}
.appNavigation .sheetSubMenu button{height:auto;align-self:start;width:100%;min-width:0;min-height:34px;text-align:left;font:500 13px/18px var(--app-font);color:#ffffff;background:transparent;padding:8px 12px;border:0;border-radius:0 5px 5px 0;white-space:normal;transition:background-color 140ms ease,color 140ms ease}
.appNavigation .sheetSubMenu button:hover{background:#e4e7ec;color:#111}
.appNavigation button:focus-visible,.appNavigationMobileToggle:focus-visible{outline:2px solid #0060ff;outline-offset:2px}
.appNavigation .sheetTab.active:focus-visible{outline-color:#111}
.appNavigationCompact .appNavigationHead{padding:0;justify-content:center;min-height:52px}
.appNavigationCompact .appNavigationBrand{display:none}.appNavigationCompact .appNavigationLabel{display:none}
.appNavigationCompact .appNavigation .sheetTabMenuHost{grid-template-columns:1fr}.appNavigationCompact .appNavigation .sheetTab{padding:12px;justify-content:center}
.appNavigationCompact .appNavigationDisclosure{display:none}.appNavigationCompact .appNavigationToggle svg{transform:rotate(180deg)}
.appNavigationBackdrop{position:fixed;inset:0;background:#10182855;z-index:89}.appNavigationBackdrop[hidden]{display:none}
@media(max-width:767px){body.hasAppNavigation{padding-left:0;--navigation-width:min(200px,85vw)}.appNavigation{z-index:90;transform:translateX(-100%);transition:transform 180ms ease;box-shadow:8px 0 24px #10182818}.appNavigationOpen .appNavigation{transform:none}.appNavigationMobileToggle{display:inline-flex;margin-bottom:8px}.appNavigationOpen{overflow:hidden}}
@media(prefers-reduced-motion:reduce){body.hasAppNavigation,.appNavigation,.appNavigation .sheetTab,.appNavigationDisclosure svg,.appNavigation .sheetSubMenu button{transition:none}}
@media print{body.hasAppNavigation{padding-left:0!important}.appNavigation,.appNavigationBackdrop,.appNavigationMobileToggle{display:none!important}body.hasAppNavigation>.topHeader,body.hasAppNavigation>.appShell,body.hasAppNavigation>.appFooter{width:100%!important;max-width:100%!important}}

.appNavigationFlyout{position:fixed;z-index:80;width:240px;max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px);overflow-y:auto;overscroll-behavior:contain;padding:6px;background:#fff;border:1px solid #d0d5dd;border-radius:9px;box-shadow:0 8px 24px #10182824;font-family:var(--app-font)}
.appNavigationFlyout[hidden]{display:none}
.appNavigationFlyout button{display:block;width:100%;border:0;border-radius:5px;padding:9px 12px;text-align:left;background:transparent;color:#344054;font:500 14px/20px var(--app-font);cursor:pointer;overflow-wrap:anywhere}
.appNavigationFlyout button.appNavigationFlyoutTitle{font-weight:800;color:#111}
.appNavigationFlyout button:hover{background:#eef2f6}.appNavigationFlyout button:focus-visible{outline:2px solid #0060ff;outline-offset:-2px;background:#eef2f6}
@media print{.appNavigationFlyout{display:none!important}}

@media screen{
 body.hasAppNavigation>.topHeader,body.hasAppNavigation>.appShell{padding-left:10px;padding-right:10px}
 body.hasAppNavigation>.appFooter{margin-left:10px;width:98%;max-width:calc(100% - 10px)}
}

@media screen{
 body.hasAppNavigation,body.hasAppNavigation>.topHeader,body.hasAppNavigation>.appShell,body.hasAppNavigation>.appFooter,
 body.hasAppNavigation>.appShell .wrap,body.hasAppNavigation>.appShell .previewPanel,body.hasAppNavigation>.appShell .sheetWrap,body.hasAppNavigation #sheet,
 body.hasAppNavigation #sheet>:is(.homeView,.fixturePatchView,.powerSheetView,.fanOutView,.controlNetworkView,.networkDeviceConfigView,.deviceConfigView,.ipAddressView,.universeDetailView,.positionsView,.rackLayoutView,.loomsView,.projectErrorsPage,.projectSettingsView,.tableView){background:#fff}
}

.appNavigationFooter{position:relative;flex:0 0 auto;margin-top:auto;padding-top:8px;border-top:1px solid #0003}
.appNavigationFooter>:is(.menuButton,.appNavigationHelp){position:static;display:flex;align-items:center;gap:12px;width:100%;height:44px;margin:0;padding:10px 12px;border:0;border-radius:7px;background:transparent;box-shadow:none;color:#f2f2f2;font:600 14px/20px var(--app-font)}
.appNavigationFooter>:is(.menuButton,.appNavigationHelp):hover{background:#858585}
.appNavigationFooter>.actionSidebar{position:absolute;inset:auto auto calc(100% + 8px) 0;width:min(260px,calc(100vw - 32px));max-height:calc(100dvh - 100px);overflow:auto;overscroll-behavior:contain;transform:none;transition:none}
.appNavigationCompact .appNavigationFooter>:is(.menuButton,.appNavigationHelp){justify-content:center;padding:10px 8px}
.headerLogoHome{display:inline-flex;align-items:center;justify-content:center;min-width:0;max-width:100%;padding:0;border:0;background:transparent;cursor:pointer}
.headerLogoHome:focus-visible{outline:2px solid #0060ff;outline-offset:2px}
#tourLogoSlot>.headerLogoHome{width:100%;height:100%}
#tourLogoSlot>.headerLogoHome>.tourLogo{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;object-position:center}
#projectSaveWarning{position:fixed;bottom:8px;right:8px;z-index:9999;padding:6px 10px;border:1px solid #b00020;background:#fff;border-radius:6px;font:12px Arial;max-width:90vw}
@media print{#projectSaveStatus,#projectSaveWarning{display:none!important}}
body.hasAppNavigation>.topHeader>.top{padding-right:10px}

.appNavigation .sheetSubMenu button,.appNavigationFlyout button{display:flex;align-items:center;gap:8px}
.appNavigationSubIcon{display:flex;flex:0 0 16px;align-items:center;justify-content:center}
.appNavigationSubIcon svg{width:16px;height:16px}
.appNavigationSubLabel{min-width:0;overflow-wrap:anywhere}

.appNavigationCompact .appNavigation .sheetTab.active{background:rgb(0,96,255);color:rgb(255,255,255);border-bottom:1px solid white}
.appNavigationCompact .appNavigation .sheetTabMenuHost:has(>.sheetTab.active){background:linear-gradient(rgb(0,96,255) 44px,transparent 44px);border:1px solid white}
.appNavigationCompact .appNavigation .sheetSubMenu,.appNavigationCompact .appNavigation .sheetTabMenuHost.menuDismissed .sheetSubMenu{position:static;grid-column-start:1;grid-column-end:-1;grid-row-start:2;grid-row-end:auto;gap:2px;width:100%;min-width:0;max-width:100%;max-height:none;overflow:visible;padding:4px;border:0;box-shadow:none;background:rgb(155,155,155);display:grid!important}
.appNavigationCompact .appNavigation .sheetSubMenu[hidden],.appNavigationCompact .appNavigation .sheetTabMenuHost.menuDismissed .sheetSubMenu[hidden]{display:none!important}
.appNavigationCompact .appNavigation .sheetSubMenu button{justify-content:center;min-height:34px;padding:8px 0;border-radius:6px}
.appNavigationCompact .appNavigation .appNavigationSubLabel{display:none}
.appNavigationCompact .appNavigation .sheetSubMenu .appNavigationSubIcon{flex-basis:18px}
.appNavigationCompact .appNavigation .sheetSubMenu svg{width:18px;height:18px}
.actionSidebar a.btn{display:block;color:#111;text-decoration:none;font-family:var(--app-font)}

#projectHeaderLogoSlot .topVendorLogo{border-right:2px solid #9b9b9b;padding:0 12px}
#projectErrorsButton.projectErrorsAttention{background:#d00000;color:#fff;border-color:#d00000;animation:projectErrorsPulse 1.2s ease-in-out infinite}
@keyframes projectErrorsPulse{0%,100%{background:#d00000;box-shadow:0 0 0 0 #d0000066}50%{background:#820000;box-shadow:0 0 0 5px #d0000033}}
@media(prefers-reduced-motion:reduce){#projectErrorsButton.projectErrorsAttention{animation:none;box-shadow:0 0 0 3px #d0000033}}
@media print{#projectErrorsButton.projectErrorsAttention{animation:none;box-shadow:none}}

/* Active destinations remain distinct from their parent group. */
.appNavigation .sheetSubMenu button[aria-current="page"]{background:#0060ff;color:#fff;box-shadow:inset 0 0 0 1px #fff}
.appNavigationCompact .appNavigation .sheetSubMenu button.appNavigationDuplicate{display:none}
.appNavigationHelp svg{width:24px;height:24px;flex:0 0 24px}
.appNavigationHelp:focus-visible{outline:2px solid #fff;outline-offset:-2px}

.appNavigation .projectSettingsNavGroup{display:grid;grid-template-columns:minmax(0,1fr) 32px;grid-column:1/-1;min-width:0;align-items:center}
.appNavigation .projectSettingsNavGroup>button:not(.appNavigationDisclosure){grid-row:1;grid-column:1}
.appNavigation .projectSettingsNavChildren{grid-column:1/-1;display:grid;padding-left:8px;gap:2px}
.appNavigation .projectSettingsNavChildren[hidden]{display:none}
.appNavigationCompact .projectSettingsNavGroup{grid-template-columns:1fr}
.appNavigationCompact .projectSettingsDisclosure{display:none}
.appNavigationCompact .projectSettingsNavChildren,.appNavigationCompact .projectSettingsNavChildren[hidden]{display:grid;padding-left:0}

.appNavigation .sheetSubMenu .projectSettingsDisclosure{color:#000;justify-content:center;padding:6px;height:44px;width:32px}
.appNavigationCompact .appNavigation .sheetSubMenu .projectSettingsDisclosure{display:none}

.appNavigationCompact .appNavigation .projectSettingsNavGroup[data-settings-active="false"] .projectSettingsNavChildren{display:none}
