/* Shared presentation layer for legacy and React screens. */
:root,:root[data-theme="light"]{--bg:#f5f7fb;--surface:#fff;--surface2:#f8fafc;--surface3:#eef2f7;--border:#e5eaf1;--border2:#d5deea;--text:#182338;--text2:#58677e;--text3:#718198;--text-dim:#58677e;--text-muted:#58677e;--accent:#4f46e5;--accent2:#4338ca;--blue:#4f46e5;--purple:#7c3aed;--green:#059669;--red:#dc3545;--container-bg:#fff;--radius:14px;--radius-sm:8px;--shadow:0 3px 16px rgb(25 42 70 / 4%);--input-bg:#fff;--input-border:#d5deea;--btn-bg:#4f46e5;--btn-hover:#4338ca;--workspace-sidebar:248px;--workspace-header:76px;color-scheme:light}
:root[data-theme="dark"]{--bg:#0e1523;--surface:#151f30;--surface2:#192538;--surface3:#223047;--border:#28364c;--border2:#384963;--text:#e7eef9;--text2:#b0bfd4;--text3:#91a3bc;--text-dim:#b0bfd4;--text-muted:#b0bfd4;--accent:#a5a0ff;--accent2:#c4bfff;--blue:#a5a0ff;--purple:#c4a1ff;--green:#34d399;--red:#fb7185;--container-bg:#151f30;--input-bg:#192538;--input-border:#384963;--btn-bg:#6366f1;--btn-hover:#818cf8;--shadow:0 4px 20px rgb(0 0 0 / 12%);color-scheme:dark}
body{font-family:Inter,'Segoe UI',sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}
button,input,select,textarea{font-family:inherit}
:where(button,a,input,select,textarea):focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.topbar{min-height:var(--workspace-header);padding:0 26px;gap:20px;box-shadow:0 1px 8px rgb(25 42 70 / 3%)}
.topbar-brand{gap:10px}.topbar-brand>img{height:48px!important;width:48px;object-fit:contain;margin-right:0!important}
.topbar-brand-title{font-family:inherit;font-size:22px;letter-spacing:-.7px;text-transform:none;font-weight:800}
.topbar-brand-subtitle{font-size:10px;letter-spacing:.04em;text-transform:none}.topbar-brand-copy{gap:3px}
.topbar-brand-copy>:last-child{font-size:9px!important;letter-spacing:.02em!important}
.topbar-right{gap:16px}.topbar-user{border-radius:10px!important;padding:7px 10px!important}
#user-avatar{background:#e5e3ff!important;color:#4338ca!important}
.status-dot{background:var(--green);box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 10%,transparent);width:6px;height:6px}
.sidebar{top:var(--workspace-header);width:var(--workspace-sidebar);padding:14px 12px 28px;gap:3px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--border2) transparent}
.nav-section{padding:19px 12px 7px;font-size:9px;letter-spacing:.12em;font-weight:700;color:var(--text3)}
.nav-item{padding:10px 12px;min-height:38px;font-size:12px;font-weight:500;border-radius:8px;gap:10px;flex-shrink:0;position:relative}
.nav-item::before{content:none}.nav-item:hover{background:var(--surface3);color:var(--text)}
.nav-item.active,[data-theme="dark"] .nav-item.active{background:color-mix(in srgb,var(--accent) 10%,var(--surface));color:var(--accent);font-weight:650}
.nav-item.active::after{content:'';position:absolute;left:-12px;top:9px;bottom:9px;width:3px;background:var(--accent);border-radius:0 3px 3px 0}
.workspace-nav-icon{width:17px;height:17px;flex:0 0 17px;opacity:.85}
.sidebar-toggle{position:static;transform:none;align-self:flex-end;min-height:28px;width:28px;height:28px;border-radius:7px;margin-bottom:6px}
.workspace-nav-search{padding:10px 11px;width:100%;background:var(--surface2);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:12px}
.workspace-nav-empty{font-size:12px;color:var(--text2);padding:16px 10px}[data-nav-filtered="true"]{display:none!important}
.main-content{margin-left:var(--workspace-sidebar);min-width:0}
.monitor-bar{margin-left:var(--workspace-sidebar);width:calc(100% - var(--workspace-sidebar));background:var(--surface);padding:10px 28px;font-size:11px}
.page.active,#page-calls.active{padding:30px}.page-header{margin-bottom:26px;gap:16px;flex-wrap:wrap}
.page-header h1{font-family:inherit;font-size:27px;line-height:1.25;letter-spacing:-.85px;font-weight:750}
.page-header p{font-size:12px;line-height:1.7;color:var(--text2);margin-top:7px}
.filters-bar{padding:14px 16px;border:1px solid var(--border);border-radius:12px;background:var(--surface);gap:12px;margin-bottom:22px}
.filter-label{font-size:10px;letter-spacing:.04em;color:var(--text2)}
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),select,textarea{border-radius:8px;border-color:var(--border2);background-color:var(--input-bg);color:var(--text)}
input::placeholder,textarea::placeholder{color:var(--text3)}
.btn-primary{background:#4f46e5;color:#fff;border:1px solid #4f46e5;font-weight:600;border-radius:8px;box-shadow:0 2px 3px rgb(79 70 229 / 12%)}
.btn-primary:hover{background:#4338ca;border-color:#4338ca}.btn-secondary{background:var(--surface);border-color:var(--border2);font-weight:500;border-radius:8px}.btn-secondary:hover{background:var(--surface3);border-color:var(--text3)}
.stat-grid{gap:16px}.stat-card,.slot-insight-card{padding:20px;border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow);background:var(--surface)}
.stat-card::before,.slot-insight-card::before{height:3px;opacity:.75}.stat-label,.slot-insight-label{font-size:10px;font-weight:650;letter-spacing:.06em}
.stat-value,.slot-insight-value{font-family:inherit;letter-spacing:-1px;font-weight:750}.stat-value{font-size:30px}.stat-sub{line-height:1.6;font-size:11px}
.chart-card,.table-wrap{border:1px solid var(--border);border-radius:12px;background:var(--surface);box-shadow:var(--shadow)}.chart-card{padding:22px}.chart-title{font-family:inherit;letter-spacing:-.2px;font-size:14px;font-weight:650}.table-wrap{overflow-x:auto}
thead th{background:var(--surface2);color:var(--text2);font-size:10px;letter-spacing:.045em;font-weight:650;padding-top:14px;padding-bottom:14px;border-bottom:1px solid var(--border)}
tbody td{border-bottom-color:var(--border);font-size:12px;padding-top:14px;padding-bottom:14px}tbody tr:hover{background:color-mix(in srgb,var(--accent) 3%,var(--surface))}
.period-tabs{background:var(--surface3);border:1px solid var(--border);padding:4px;border-radius:9px;gap:3px}.period-tab{border-radius:6px;font-weight:550;font-size:11px}.period-tab.active{background:var(--surface);color:var(--accent);box-shadow:0 1px 4px rgb(25 42 70 / 10%)}
.kanban-stack{background:var(--surface3);border-radius:12px}.kanban-card,.booking-card-v3{border-color:var(--border);box-shadow:0 2px 5px rgb(25 42 70 / 4%);border-radius:11px}.booking-card-avatar{background:color-mix(in srgb,var(--accent) 12%,var(--surface));color:var(--accent)}
.modal,.token-card,.wake-refresh-card{border-radius:16px;border-color:var(--border);box-shadow:0 20px 80px rgb(0 0 0 / 18%)}.modal h2,.modal-title{font-family:inherit;letter-spacing:-.5px}.empty-state{padding:48px 24px;color:var(--text2)}
.nexus-footer{margin-left:var(--workspace-sidebar);background:transparent;border-top:1px solid var(--border)}
#app.sidebar-collapsed .sidebar{width:74px}#app.sidebar-collapsed .workspace-nav-search,#app.sidebar-collapsed .workspace-nav-empty{display:none}#app.sidebar-collapsed .nav-item{font-size:0;gap:0}#app.sidebar-collapsed .sidebar-toggle{font-size:18px}#app.sidebar-collapsed .nexus-footer{margin-left:74px}
#loading-screen{grid-template-columns:var(--workspace-sidebar) 1fr;grid-template-rows:var(--workspace-header) 1fr}
.workspace-auth{min-height:100svh;height:auto;padding:48px 24px;background:radial-gradient(ellipse at 10% 0%,color-mix(in srgb,var(--accent) 9%,transparent),transparent 60%),var(--bg)}
.workspace-auth .login-container,.workspace-auth .reset-card{width:440px;max-width:100%;background:var(--surface);border:1px solid var(--border);border-radius:20px;padding:40px;box-shadow:0 16px 60px rgb(25 42 70 / 7%)}
.workspace-auth .login-container::before{content:'NEXUS / WORKSPACE';display:block;color:var(--accent);font-size:10px;font-weight:700;letter-spacing:.16em;margin-bottom:24px}
.workspace-auth h1,.workspace-auth h2{letter-spacing:-.8px}.workspace-auth .login-btn,.workspace-auth .submit-btn{background:#4f46e5;color:white;border:0;border-radius:9px;min-height:44px;font-weight:600}.workspace-auth .login-btn:hover,.workspace-auth .submit-btn:hover{background:#4338ca}.workspace-auth input{min-height:44px}.workspace-auth .forgot-password,.workspace-auth .back-link{color:var(--accent)}
@media(min-width:1800px){.page.active,#page-calls.active{padding:36px 44px}}
@media(max-width:1100px) and (min-width:769px){:root{--workspace-sidebar:220px}.topbar-right{gap:10px}.theme-label{display:none}.page.active,#page-calls.active{padding:22px}}
@media(max-width:768px){:root{--workspace-header:72px}.topbar{padding:12px 16px;min-height:72px;flex-wrap:wrap;gap:12px}.topbar-brand>img{height:36px!important;width:36px}.topbar-brand-title{font-size:20px}.topbar-right{gap:8px;flex:1}.topbar-user{margin-left:0!important}.theme-label{display:none}.sidebar{position:sticky;top:0;bottom:auto;width:100%;flex-direction:row;overflow-x:auto;overflow-y:hidden;gap:6px;padding:10px 14px;border-right:0;border-bottom:1px solid var(--border);background:var(--surface);z-index:90}.sidebar .nav-item{width:auto;flex-shrink:0;min-height:36px;padding:8px 12px;white-space:nowrap;font-size:12px}.sidebar .nav-section,.sidebar .sidebar-toggle,.workspace-nav-search{display:none!important}.nav-item.active::after{display:none}.workspace-nav-icon{width:15px;height:15px;flex-basis:15px}.main-content,#app.sidebar-collapsed .main-content{margin-left:0}.monitor-bar,#app.sidebar-collapsed .monitor-bar{margin-left:0;width:100%;padding:9px 16px}#app.sidebar-collapsed .sidebar{width:100%}#app.sidebar-collapsed .nav-item{font-size:12px;gap:8px}.page.active,#page-calls.active{padding:20px 16px}.page-header h1{font-size:24px}.filters-bar{padding:12px;gap:10px}.stat-grid{gap:10px}.stat-card{padding:16px}.stat-value{font-size:25px}.chart-card{padding:16px}.nexus-footer,#app.sidebar-collapsed .nexus-footer{margin-left:0}#loading-screen{grid-template-columns:1fr}.page-skeleton-sidebar{display:none}.workspace-auth .login-container,.workspace-auth .reset-card{padding:28px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}
.workspace-auth .login-container{min-height:0}
.workspace-auth .logo-container{margin-bottom:28px}
.workspace-auth .logo{max-height:100px}
.workspace-auth .input-group{text-align:left}
.workspace-auth .input-group>label{display:block;font-size:12px;font-weight:600;color:var(--text2);margin-bottom:8px}
.admin-navbar{background:var(--surface);min-height:76px;gap:20px;flex-wrap:wrap}
.admin-navbar .brand-logo.topbar{min-height:0;padding:0;box-shadow:none;border:0}
.admin-container,.users-container,.confirm-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow)}
.admin-body{padding-top:32px}.admin-body h1{letter-spacing:-.8px}.admin-body .submit-btn{background:#4f46e5;color:#fff;border-radius:8px}.admin-body .submit-btn:hover{background:#4338ca}
.guest-modal-card{border:1px solid var(--border);border-radius:16px;box-shadow:0 20px 80px rgb(0 0 0 / 18%)}
.nexus-react-modal{background:rgb(10 18 35 / 55%);backdrop-filter:blur(4px)}
@media(max-width:768px){.admin-navbar{padding:16px}.admin-navbar .nav-actions{flex-wrap:wrap;gap:8px}}
@media print{.sidebar,.topbar,.monitor-bar{display:none!important}.main-content{margin:0!important}.page.active{padding:0}body{background:white}}