/* Selected workbench design: one navigation, actionable queue and contextual detail. */
:root { color-scheme:light; --text-primary:var(--text); }
/* Semantic colors are shared by the workbench, business views and dialogs. */
:root[data-theme="dark"] {
  color-scheme:dark;
  --bg:#0b1220; --surface:#111d30; --border:#33445f; --border-light:#26354c;
  --text:#e4ebf7; --text-secondary:#b3c1d8; --text-muted:#9aadc8; --text-light:#b3c1d8;
  --primary-light:#203d67; --primary-dark:#a8caff;
  --sidebar-bg:#111d30; --sidebar-hover:#1b304e; --sidebar-active:#203d67;
  --success-bg:#123b32; --success-text:#86efc2;
  --warning-bg:#44351b; --warning-text:#fbd78b;
  --danger-bg:#462332; --danger-text:#ffb3bc;
  --info-bg:#203d67; --info-text:#a8caff;
  --theme-surface:var(--surface); --theme-muted-bg:#17263c; --theme-soft-bg:#26364e;
  --theme-hover-bg:#1b304e; --theme-border:var(--border);
  --theme-text:var(--text); --theme-secondary:var(--text-secondary); --theme-muted:var(--text-muted);
  --theme-blue-bg:var(--info-bg); --theme-blue-text:var(--info-text);
  --theme-success-bg:var(--success-bg); --theme-success-text:var(--success-text);
  --theme-danger-bg:var(--danger-bg); --theme-danger-text:var(--danger-text);
  --theme-warning-bg:var(--warning-bg); --theme-warning-text:var(--warning-text);
  --theme-purple-bg:#302d57; --theme-purple-text:#c7b9ff;
  --shadow-md:0 4px 14px #0003; --shadow-lg:0 18px 48px #0006;
}
:root { --text:#17243e; --text-secondary:#5b6f91; --text-muted:#64748b; --sidebar-bg:#f1f5f9; --sidebar-hover:#e8effa; --sidebar-active:#dbeafe; --text-light:#425879; }
body { background:var(--theme-surface, #fff); font-size:14px; }
.topbar { height:60px; padding:0 24px; border:0; box-shadow:none; background:var(--theme-surface, #fff); }
.brand { width:216px; min-width:216px; }
.brand-logo { width:38px; height:38px; }
.top-tabs { display:none; }
.top-actions { margin-left:auto; }
.bigscreen-btn { background:var(--theme-hover-bg, #eff6ff); color:#2563eb; border:0; }
.shell-body { align-items:stretch; }
.sidebar { width:240px; flex:0 0 240px; padding:20px 12px 24px; background:var(--theme-muted-bg, #f1f5f9); min-height:calc(100vh - 60px); }
.sidebar-title { display:none; }
.nav-item { display:flex; width:100%; align-items:center; gap:16px; min-height:48px; margin:0 0 8px; padding:12px 16px; color:var(--theme-secondary, #536987); border:0; border-radius:7px; font:inherit; text-align:left; background:transparent; cursor:pointer; }
.nav-item.active { color:#2563eb; background:var(--theme-blue-bg, #dbeafe); font-weight:650; }
.sidebar .nav-item { justify-content:flex-start; }
.sidebar .nav-item span:not(.nav-icon) { display:inline; }
.sidebar .nav-item:hover { color:var(--theme-blue-text, #1e40af); background:var(--theme-hover-bg, #e8effa); }
.topbar .brand-title { display:block; }
.nav-item .nav-icon { width:20px; height:20px; opacity:.65; }
.nav-item.active .nav-icon { filter:invert(32%) sepia(97%) saturate(1941%) hue-rotate(212deg); opacity:1; }
.nav-group { margin-top:18px; padding-top:14px; border-top:1px solid var(--theme-border, #dbe3ef); }
.nav-group summary { cursor:pointer; color:var(--theme-secondary, #536987); padding:6px 16px 12px; font-size:13px; }
.nav-group .nav-item { min-height:40px; padding:9px 16px; margin-bottom:3px; font-size:13px; }
.main { min-width:0; padding:0 28px 36px; background:var(--theme-surface, #fff); flex:1; }
.page-header { position:relative; margin-bottom:24px; gap:16px; }
.page-title { font-size:27px; color:var(--theme-text, #12203a); }
.page-subtitle { font-size:14px; margin-top:6px; }
.wb-heading-actions { display:flex; align-items:center; gap:14px; align-self:flex-start; margin-top:6px; }
.wb-heading-actions time { font-size:13px; color:var(--theme-muted, #60728d); }
.wb-updated { position:absolute; right:0; bottom:0; font-size:12px; color:var(--theme-muted, #64748b); margin-top:4px; }
.wb-pagination { display:flex; gap:18px; align-items:center; justify-content:flex-end; margin-top:12px; font-size:12px; color:var(--theme-muted, #64748b); }
.wb-pagination button:disabled { color:#94a3b8; cursor:default; }
.operations-health { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; padding:24px 6px; margin-bottom:30px; background:var(--theme-muted-bg, #f7f9fc); border-radius:8px; }
.wb-metric { display:flex; align-items:flex-start; gap:15px; padding:0 24px; border-right:1px solid var(--theme-border, #e1e8f1); }
.wb-metric:last-child { border:0; }
.wb-metric span { display:block; color:var(--theme-secondary, #445a7c); font-size:14px; }
.wb-metric strong { display:block; margin-top:9px; font-size:30px; line-height:1.2; color:var(--theme-text, #152440); }
.wb-icon { width:20px; height:20px; flex:none; }
.wb-metric .wb-icon { width:25px; height:25px; margin-top:2px; }
.wb-metric.green .wb-icon { filter:invert(47%) sepia(90%) saturate(792%) hue-rotate(121deg); }
.wb-metric.red .wb-icon { filter:invert(39%) sepia(76%) saturate(2392%) hue-rotate(333deg); }
.wb-metric.amber .wb-icon { filter:invert(66%) sepia(80%) saturate(1989%) hue-rotate(357deg); }
.wb-layout { display:grid; grid-template-columns:minmax(0,1fr) 320px; align-items:start; gap:20px; }
.wb-primary { min-width:0; }
.wb-primary>section { position:relative; }
#wb-count { position:absolute; right:0; top:14px; max-width:65%; text-align:right; }
.wb-section-head { display:flex; align-items:baseline; justify-content:space-between; margin:8px 0 18px; gap:12px; }
.wb-section-head h3 { font-size:20px; color:var(--theme-text, #14213b); }
.wb-section-head a { color:var(--primary); }
.wb-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:12px; }
.wb-tabs { display:flex; gap:7px; }
.wb-tabs button { border:0; border-radius:5px; padding:9px 16px; font:inherit; color:var(--theme-secondary, #536987); background:var(--theme-muted-bg, #f1f5f9); cursor:pointer; }
.wb-tabs button.active { background:#2563eb; color:#fff; }
.wb-toolbar input,.wb-toolbar select { font:inherit; padding:9px 10px; border:1px solid var(--theme-border, #dce4ef); border-radius:5px; background:var(--theme-surface, #fff); min-width:0; color:var(--theme-secondary, #405577); }
.wb-toolbar input { flex:1; width:150px; }
.wb-toolbar select { width:112px; }
.wb-count { font-size:12px; color:var(--theme-muted, #64748b); margin:0 0 14px; }
.wb-table-wrap { overflow:auto; }
.wb-table { width:100%; border-collapse:collapse; text-align:left; font-size:15px; }
.wb-table th { padding:14px 10px; background:var(--theme-surface, #fff); color:var(--theme-muted, #637696); font-weight:500; border-bottom:1px solid var(--theme-border, #e5ebf3); white-space:nowrap; }
.wb-table td { padding:20px 10px; border-bottom:1px solid var(--theme-border, #e5ebf3); color:var(--theme-secondary, #405577); vertical-align:top; }
.wb-table tr.selected td { background:var(--theme-hover-bg, #eaf2ff); }
.wb-table td strong { display:block; font-weight:650; color:var(--theme-text, #17243e); }
.wb-table small { display:block; font-size:13px; color:var(--theme-muted, #627693); line-height:1.65; margin-top:6px; overflow-wrap:anywhere; }
.wb-table td:nth-child(2) { min-width:128px; }
.wb-table td:nth-child(3) { min-width:150px; }
.wb-table .wb-time { min-width:115px; font-size:12px; }
.wb-customer { font:inherit; text-align:left; border:0; background:none; color:var(--theme-text, #17243e); font-weight:650; cursor:pointer; }
.wb-customer:hover { color:#2563eb; }
.wb-severity { display:inline-block; padding:4px 9px; border-radius:5px; font-size:12px; white-space:nowrap; background:var(--theme-soft-bg, #eef2f7); color:var(--theme-secondary, #526580); }
.wb-severity.high,.wb-severity.critical { color:var(--theme-danger-text, #c3313a); background:var(--theme-danger-bg, #fee8eb); }
.wb-severity.medium { color:var(--theme-warning-text, #a46306); background:var(--theme-warning-bg, #fff1d6); }
.wb-severity.low { color:#2563eb; background:var(--theme-blue-bg, #e8f0ff); }
.wb-detail { border:1px solid var(--theme-border, #e1e8f1); border-radius:5px; padding:24px; background:var(--theme-surface, #fff); position:sticky; top:92px; min-width:0; }
.wb-detail-head { display:flex; justify-content:space-between; gap:12px; margin-bottom:14px; }
.wb-detail-head h3 { font-size:20px; overflow-wrap:anywhere; }
.wb-detail-head p { color:var(--theme-muted, #607493); margin-top:6px; }
.wb-icon-button { border:0; background:transparent; cursor:pointer; align-self:flex-start; padding:3px; opacity:.6; }
.wb-icon-button .wb-icon { width:15px; height:15px; }
.wb-detail-action { display:flex; align-items:center; gap:20px; margin:24px 0; }
.wb-detail-action .wb-icon { width:16px; filter:invert(1); }
.wb-detail-facts { display:grid; grid-template-columns:1fr 1fr; gap:14px; border-top:1px solid var(--theme-border, #e5ebf3); border-bottom:1px solid var(--theme-border, #e5ebf3); padding:20px 0; margin-bottom:24px; }
.wb-detail-facts dt { font-size:13px; color:var(--theme-muted, #637696); margin-bottom:8px; }
.wb-detail-facts dd { margin:0; font-size:13px; overflow-wrap:anywhere; }
.wb-detail h4 { font-size:15px; margin-bottom:16px; }
.wb-observation { font-size:13px; line-height:1.7; margin-bottom:24px; }
.wb-observation p,.wb-observation small { color:var(--theme-muted, #637696); display:block; margin-top:8px; }
.wb-timeline { margin:0 0 24px 14px; padding:0 0 0 12px; border-left:1px solid var(--theme-border, #dce5f2); font-size:13px; }
.wb-timeline li { margin-bottom:16px; padding-left:4px; }
.wb-timeline li::marker { color:#3b82f6; }
.wb-timeline time { color:var(--theme-muted, #637696); }
.wb-timeline p { margin-top:5px; }
.wb-detail-footer { font-size:12px; overflow-wrap:anywhere; color:var(--theme-muted, #637696); padding-top:16px; border-top:1px solid var(--theme-border, #e5ebf3); }
.wb-recent-section { margin-top:34px; border-top:1px solid var(--theme-border, #e5ebf3); padding-top:18px; }
.wb-reports { font-size:13px; }
.wb-reports td { padding:14px 10px; }
.wb-reports td:nth-child(2),.wb-reports td:nth-child(3) { min-width:100px; }
.wb-text-button { color:#2563eb; background:none; border:0; font:inherit; cursor:pointer; white-space:nowrap; }
.wb-empty { padding:28px 16px; text-align:center; color:var(--theme-muted, #607493); line-height:1.8; }
.wb-empty button { display:block; margin:12px auto 0; }
.operations-health>.wb-empty { grid-column:1/-1; }
.btn { box-shadow:none; font-family:inherit; }
.btn:disabled { opacity:.5; cursor:wait; }
.card { box-shadow:none; }
.backup-table-wrap { overflow:auto; }
.backup-row-actions { display:flex; flex-wrap:wrap; gap:6px; }
.backup-audit-row { display:flex; flex-wrap:wrap; gap:8px 16px; padding:10px 0; border-bottom:1px solid var(--border-light); color:var(--text-secondary); font-size:12px; }
#backup-policy-form small { display:block; margin-top:6px; color:var(--text-muted); }
#backup-policy-form [hidden] { display:none; }
#backup-message:empty { display:none; }
#backup-message { margin-bottom:16px; }
#backup-restore-form { margin-top:16px; }
.theme-toggle { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-width:76px; min-height:36px; padding:8px 12px; border:1px solid var(--border); border-radius:8px; background:var(--surface); color:var(--text-secondary); font:inherit; font-size:13px; cursor:pointer; white-space:nowrap; }
.theme-toggle:hover { background:var(--sidebar-hover); color:var(--text); border-color:var(--primary); }
.theme-toggle svg { width:17px; height:17px; flex:none; }
.theme-sun,.theme-to-light { display:none; }
[data-theme="dark"] .theme-moon,[data-theme="dark"] .theme-to-dark { display:none; }
[data-theme="dark"] .theme-sun,[data-theme="dark"] .theme-to-light { display:block; }
[data-theme="dark"] body,[data-theme="dark"] .main { background:var(--bg); }
[data-theme="dark"] .sidebar { background:var(--sidebar-bg); }
[data-theme="dark"] .topbar { border-bottom:1px solid var(--border-light); }
[data-theme="dark"] .nav-item .nav-icon,[data-theme="dark"] .wb-icon-button .wb-icon { filter:invert(85%); opacity:1; }
[data-theme="dark"] .nav-item.active .nav-icon { filter:invert(75%) sepia(27%) saturate(891%) hue-rotate(181deg); }
[data-theme="dark"] .nav-item.active,[data-theme="dark"] .bigscreen-btn,[data-theme="dark"] .wb-text-button,[data-theme="dark"] .wb-customer:hover,[data-theme="dark"] .wb-severity.low,[data-theme="dark"] .wizard-step.active,[data-theme="dark"] .workflow-steps span.active,[data-theme="dark"] .customer-report-tab.active,[data-theme="dark"] .customer-product-tab.active { color:var(--info-text); }
[data-theme="dark"] :is(.main,.modal-box,.confirm-box) a:not(.btn),[data-theme="dark"] .compact-guidance summary,[data-theme="dark"] .policy-revision-impact summary { color:var(--info-text); }
[data-theme="dark"] input,[data-theme="dark"] select,[data-theme="dark"] textarea { color:var(--text); background-color:var(--surface); border-color:var(--border); }
[data-theme="dark"] input::placeholder,[data-theme="dark"] textarea::placeholder { color:var(--text-muted); opacity:1; }
[data-theme="dark"] input[type="checkbox"],[data-theme="dark"] input[type="radio"] { accent-color:var(--primary); }
[data-theme="dark"] .customer-list-item { color:var(--text); }
[data-theme="dark"] #client-receipt-dialog { background:var(--surface); }
[data-theme="dark"] .modal-overlay,[data-theme="dark"] .confirm-overlay { background:rgba(3,7,18,.72); }
[data-theme="dark"] .modal-box,[data-theme="dark"] .confirm-box { border:1px solid var(--border); }
@media(max-width:680px) { .theme-toggle { min-width:36px; width:36px; padding:8px; } .theme-toggle .theme-to-light,.theme-toggle .theme-to-dark { display:none; } }
button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible { outline:3px solid #93b4fb; outline-offset:3px; }
@media(max-width:980px) { .wb-updated { position:static; } }
@media(min-width:1700px) { .wb-layout { grid-template-columns:minmax(0,1fr) 360px; gap:28px; } .main { padding:0 40px 40px; } }
@media(max-width:1200px) { .sidebar { width:205px; flex-basis:205px; } .brand { width:181px; min-width:181px; } .main { padding:0 20px 28px; } .wb-layout { grid-template-columns:minmax(0,1fr) 270px; gap:16px; } .wb-detail { padding:18px; } .wb-metric { padding:0 14px; } .wb-table { font-size:13px; } .wb-heading-actions time { display:none; } }
@media(max-width:980px) { .wb-layout { grid-template-columns:minmax(0,1fr); } .wb-detail { position:static; } .wb-toolbar input { min-width:170px; } .wb-metric { gap:10px; padding:0 12px; } .wb-metric .wb-icon { width:20px; } }
@media(max-width:680px) { .topbar { height:64px; padding:0 12px; } .brand { min-width:0; width:auto; } .brand-title { font-size:14px; } .brand-logo { width:28px; height:28px; } .user-info #userName,.bigscreen-btn { display:none; } .top-actions { gap:8px; } .shell-body { display:block; } .sidebar { width:100%; min-height:0; padding:10px 12px; } #sidebarMenu { display:flex; flex-wrap:wrap; gap:5px; } .nav-item { width:auto; margin:0; min-height:36px; padding:9px; gap:6px; font-size:12px; } .nav-icon { display:none; } .nav-group { margin:0; padding:0; border:0; } .nav-group summary { padding:9px; font-size:12px; } .main { padding:20px 14px; } .page-title { font-size:24px; } .operations-health { grid-template-columns:repeat(2,minmax(0,1fr)); row-gap:22px; padding:20px 6px; } .wb-metric:nth-child(2) { border:0; } .wb-metric strong { font-size:26px; } .page-header { align-items:flex-start; } .wb-table { min-width:620px; } .wb-toolbar select { flex:1; } }