/* The rail is app navigation; Equipment owns the adjacent site explorer. */
.app-layout { --console-rail-width:76px; --console-topbar-height:64px; grid-template-columns:var(--console-rail-width) minmax(0,1fr); }
.app-sidebar { padding:8px 6px 12px; min-height:0; height:100vh; height:100dvh; overflow-y:auto; overflow-x:hidden; box-shadow:none; }
.sidebar-brand-row { justify-content:center; padding:0; min-height:48px; }
.rail-brand { border:0; padding:0; background:transparent; color:inherit; }
.rail-brand .brand-mark { width:34px; height:34px; border-radius:9px; }
.rail-brand-name { display:none; }
.primary-nav { display:grid; gap:6px; margin-top:12px; }
.app-sidebar .nav-item { display:flex; flex-direction:column; justify-content:center; gap:6px; min-height:57px; margin:0; padding:9px 2px; border-radius:7px; text-align:center; font-size:11px; line-height:1.2; font-weight:650; }
.app-sidebar .nav-item > svg { width:20px; height:20px; }
.app-sidebar .nav-count { display:none; }
.app-sidebar .nav-item.selected { box-shadow:inset 2px 0 0 #c084fc; }
.sidebar-footer { border:0; padding-top:18px; }
.app-topbar { position:sticky; top:0; z-index:24; min-height:64px; padding:12px 22px; gap:18px; background:var(--surface); }
.topbar-brand { width:142px; gap:0; }
.topbar-brand .deviceiq-wordmark { width:130px; }
.topbar-brand .deviceiq-company { font-size:10px; line-height:1.1; }
.rail-brand-name .deviceiq-company { margin-top:4px; color:#ddd6fe; font-size:10px; }
.app-topbar .workspace-scope { flex-shrink:1; }
.app-topbar .workspace-scope select { max-width:220px; height:36px; }
.app-topbar .workspace-scope .workspace-field { gap:8px; }
.app-topbar .workspace-scope .workspace-field > span { display:none; }
.app-topbar .workspace-scope > strong { display:block; max-width:210px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; }
.global-equipment-search { min-width:160px; }
.global-search-menu { max-width:calc(100vw - var(--console-rail-width) - 48px); }
.topbar-actions { flex-shrink:0; }
.topbar-notifications { position:relative; display:grid; place-items:center; width:38px; height:38px; min-height:38px; padding:0; margin:0; border:1px solid var(--line-strong, #d7dee8); border-radius:9px; color:var(--ink-secondary, #475569); }
.topbar-notifications:hover,.topbar-notifications.selected { background:var(--brand-soft); border-color:var(--brand-border, #c4b5fd); box-shadow:none; color:var(--brand-strong, var(--brand-dark)); }
.topbar-notifications .nav-count { position:absolute; top:-6px; right:-7px; min-width:17px; max-width:32px; overflow:hidden; padding:2px 4px; font-size:10px; text-overflow:ellipsis; background:var(--brand-dark); color:white; }
.app-navigation-menu { position:fixed; z-index:80; width:252px; max-width:calc(100vw - 16px); max-height:calc(100dvh - 16px); overflow:auto; padding:8px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--ink); box-shadow:0 14px 42px rgba(15,23,42,.2); }
.app-navigation-menu-title { padding:8px 10px; color:var(--muted); font-size:11px; font-weight:700; }
.app-navigation-menu .nav-item { grid-template-columns:20px minmax(0,1fr); min-height:42px; padding:9px 10px; color:var(--ink); font-size:13px; font-weight:600; border-radius:6px; }
.app-navigation-menu .nav-item:hover,.app-navigation-menu .nav-item.selected { background:var(--brand-soft); color:var(--brand-strong, var(--brand-dark)); border-color:transparent; box-shadow:none; }
.account-navigation-menu .signed-in-user { display:block; max-width:none; padding:10px; border-bottom:1px solid var(--line); }
.account-navigation-menu .signed-in-user strong { font-size:13px; }
.account-navigation-menu .signed-in-user span { font-size:11px; margin-top:5px; }
.account-navigation-menu .server-state-row { padding:12px 10px; font-size:11px; color:var(--muted); }
.account-navigation-menu .lock-button { min-height:42px; color:var(--brand-strong, var(--brand-dark)); padding:8px 10px; }
.account-navigation-menu .lock-button:hover { background:var(--brand-soft); color:var(--brand-strong, var(--brand-dark)); }
.account-navigation-menu .app-version-row { padding:10px; flex-wrap:wrap; color:var(--muted); gap:4px; }
.account-navigation-menu .app-version-row strong { color:var(--muted); font-size:11px; font-weight:500; }

.equipment-workspace-active .content-shell { padding:0; }
.equipment-explorer-layout { grid-template-columns:340px minmax(0,1fr); gap:0; align-items:stretch; min-height:calc(100dvh - var(--console-topbar-height)); background:var(--surface); }
.equipment-explorer-content { background:var(--surface); }
.site-explorer { position:sticky; top:var(--console-topbar-height); align-self:start; display:flex; flex-direction:column; height:calc(100dvh - var(--console-topbar-height)); min-height:0; padding-top:8px; border:0; border-right:1px solid var(--line); border-radius:0; background:var(--surface-subtle, #faf9fc); }

.site-explorer-heading { padding:20px 16px 18px; }
.site-explorer-heading h2 { font-size:15px; }
.site-explorer-heading .button { font-size:11px; }



.equipment-workspace-heading { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px 22px; padding:24px 24px 18px; }
.equipment-site-context { flex:1; min-width:220px; padding:0; margin:0; border:0; border-radius:0; gap:16px; }
.equipment-site-context h1 { margin:5px 0; font-size:24px; line-height:1.2; letter-spacing:-.025em; }
.equipment-site-context .eyebrow { font-size:10px; }
.equipment-workspace-heading .heading-actions { flex-shrink:0; }
.equipment-explorer-content #workspace-device-views { padding:0 24px; border-bottom:1px solid var(--line); }
.equipment-explorer-content .workspace-saved-views { min-height:48px; padding:0 0 12px; flex-wrap:wrap; }
.equipment-explorer-content .panel { border:0; border-radius:0; box-shadow:none; }
.equipment-explorer-content .equipment-table-toolbar { padding:16px 24px; }
.equipment-explorer-content .equipment-pagination { border-bottom:1px solid var(--line); }
.equipment-explorer-content .equipment-selection-bar { border-radius:0; }

@media(min-width:821px) and (max-width:1100px) {
  .equipment-explorer-layout { grid-template-columns:300px minmax(0,1fr); }
  .app-topbar { gap:12px; padding-inline:18px; }
  .app-topbar .workspace-scope > strong { max-width:145px; }
  .app-topbar .workspace-scope select { max-width:165px; }
}
@media(max-width:820px) {
  .app-layout { display:block; }
  .app-sidebar { width:244px; padding:14px; }
  .sidebar-brand-row { justify-content:space-between; }
  .rail-brand-name { display:block; font-size:14px; }
  .app-sidebar .nav-item { flex-direction:row; justify-content:flex-start; padding:12px; min-height:48px; gap:12px; font-size:13px; }
  .sidebar-footer { padding-top:12px; }
  .app-topbar { gap:12px; padding:12px 16px; }
  .topbar-brand { display:none; }
  .app-topbar .workspace-scope { flex:1; min-width:0; }
  .app-topbar .workspace-scope > strong { max-width:none; }
  .app-topbar .workspace-scope select { width:100%; max-width:none; }
  .app-topbar .workspace-scope .workspace-field { width:100%; }
  .global-search-menu { max-width:100%; }
  .equipment-explorer-layout { grid-template-columns:minmax(0,1fr); min-height:0; }
  .site-explorer { position:static; height:auto; border-right:0; border-bottom:1px solid var(--line); }
  
  .equipment-workspace-heading { padding:18px 16px; }
  .equipment-site-context h1 { font-size:22px; }
  .equipment-explorer-content #workspace-device-views { padding-inline:16px; }
  .equipment-explorer-content .equipment-table-toolbar { padding:14px 16px; }
}
@media(max-width:380px) {
  .app-topbar { padding:10px; gap:8px; }
  .topbar-actions { gap:4px; }
  .topbar-actions > button { width:32px; }
}
