/* NetVault operational UI. Theme names and account preferences remain stable. */
:root {
  --font-ui: system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: ui-monospace, "Cascadia Code", Consolas, monospace;
  --text-xs: 12px;
  --text-sm: 13px;
  --text-base: 14px;
  --text-title: 20px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --control-height: 36px;
  --target-touch: 44px;
  --radius-small: 6px;
  --radius-control: 10px;
  --radius-surface: 16px;
  --radius-dialog: 20px;
  --radius-pill: 9999px;
  --workspace-max-width: 1900px;
  --shadow-surface: 0 1px 2px rgba(17,24,39,.06);
  --shadow-menu: 0 4px 12px rgba(17,24,39,.12);
  --shadow-dialog: 0 8px 24px rgba(17,24,39,.16);
  --reference-bg: #0e1117;
  --reference-surface: #191f29;
  --reference-raised: #222b39;
  --reference-border: #333e50;
  --light-bg: #f3f4f6;
  --light-surface: #ffffff;
  --light-raised: #f9fafb;
  --glass: var(--surface);
  --nv-border: var(--line);
  --nv-surface: var(--surface);
  --nv-ink: var(--text);
  --nv-muted: var(--muted);
  --nv-accent: var(--primary);
  --nv-shadow: var(--shadow-surface);
  --nv-soft: var(--raised);
  --nv-surface-soft: var(--raised);
  --nv-secondary: var(--muted);
  --nv-gold: var(--amber);
  --terminal-bg: #0e1117;
  --terminal-surface: #191f29;
  --terminal-text: #edf2fa;
  --terminal-muted: #aebbd0;
  --terminal-line: #3a465a;
  --terminal-accent: #9fc5ff;
  --terminal-success: #86dcb1;
  --terminal-danger: #ff9ca8;
  --terminal-warning: #f2cc81;
}
:root, :root[data-theme="dark"] {
  color-scheme: dark;
  --bg: var(--reference-bg);
  --navy: #121720;
  --surface: var(--reference-surface);
  --raised: var(--reference-raised);
  --hover: #2a3546;
  --text: #edf2fa;
  --muted: #b5c0d1;
  --line: var(--reference-border);
  --control-line: #7b8ba3;
  --primary: #8fb9ff;
  --teal: var(--primary);
  --link: #9fc5ff;
  --on-accent: #101622;
  --accent-soft: #1f304c;
  --danger: #ff9ca8;
  --danger-soft: #33222c;
  --amber: #f2cc81;
  --warning-soft: #332d20;
  --success: #86dcb1;
  --success-indicator: #86dcb1;
  --success-soft: #1b302b;
  --focus: #a9ceff;
  --chrome: #121720;
  --inset: #121720;
  --accent-border: #506b96;
  --selection-hover: #263c5b;
  --workspace-glass-shadow: var(--shadow-surface);
}
:root[data-theme="dark"] {
  --shadow-surface: 0 1px 0 rgba(255,255,255,.025), 0 4px 16px rgba(0,0,0,.12);
  --shadow-menu: 0 12px 32px rgba(0,0,0,.38);
  --shadow-dialog: 0 24px 72px rgba(0,0,0,.5);
}
:root[data-theme="light-red"] {
  color-scheme: light;
  --bg: var(--light-bg);
  --navy: var(--light-surface);
  --surface: var(--light-surface);
  --raised: var(--light-raised);
  --hover: var(--raised);
  --text: #111827;
  --muted: #4b5563;
  --line: #e5e7eb;
  --control-line: #6b7280;
  --primary: #b33912;
  --teal: var(--primary);
  --link: var(--primary);
  --on-accent: #ffffff;
  --accent-soft: #fff5ef;
  --danger: #dc2626;
  --danger-soft: var(--surface);
  --amber: #92400e;
  --warning-soft: var(--surface);
  --success: #166534;
  --success-indicator: #16a34a;
  --success-soft: var(--surface);
  --focus: var(--primary);
  --chrome: var(--surface);
  --workspace-glass-shadow: var(--shadow-surface);
}
:root[data-theme="light"] {
  color-scheme: light;
  --bg: var(--light-bg);
  --navy: var(--light-surface);
  --surface: var(--light-surface);
  --raised: var(--light-raised);
  --hover: var(--raised);
  --text: #111827;
  --muted: #4b5563;
  --line: #e5e7eb;
  --control-line: #6b7280;
  --primary: #2563eb;
  --teal: var(--primary);
  --link: var(--primary);
  --on-accent: #ffffff;
  --accent-soft: #eff6ff;
  --danger: #dc2626;
  --danger-soft: var(--surface);
  --amber: #92400e;
  --warning-soft: var(--surface);
  --success: #166534;
  --success-indicator: #16a34a;
  --success-soft: var(--surface);
  --focus: var(--primary);
  --chrome: var(--surface);
  --workspace-glass-shadow: var(--shadow-surface);
}

/* Shared controls and surfaces use one radius scale in both layout modes. */
:is(button, input:not([type="checkbox"]):not([type="radio"]), select, textarea, summary) {
  border-radius: var(--radius-control) !important;
}
:is(.panel,.card,.status-card,.asset-health-card,.asset-mobile-card,.asset-detail-card,
  .asset-page-card,.asset-page-panel,.asset-page-section,.asset-page-hero,.asset-command-center,
  .asset-table-panel,.asset-filter-panel,.asset-filter-sidebar,.assets-toolbar,.selection-bar,
  .dashboard-priorities,.dashboard-priority,.dashboard-metrics,.dashboard-progress,
  .dashboard-recurring-panel,.dashboard-activity,.dashboard-inventory,.dashboard-job,
  .backup-summary-grid>*,.backup-empty-state,.backup-scope,.list-workspace,
  .operational-round-summary,.operational-round-card,.operational-round-asset,
  .operational-round-page-status,.operational-round-page-history,.operational-round-page-config,
  .operational-round-finding,.operational-round-priority,.operational-round-settings,
  .routine-card,.routine-empty,.round-card,.round-summary-card,.campaign-plan,.campaign-warning,
  .campaign-review-grid article,.software-stat,.software-progress-card,.software-item,
  .software-campaign,.software-fleet-panel,.clients-hero,.client-card,.client-metrics article,.user-row,
  .permission-box,.permission-client,.analyst-chat-shell,.analyst-widget,.analyst-message,
  .view-error,.view-loading,.workspace-access-notice,.auth-card,.confirmation-object,
  .confirmation-card,.terminal-command-object,.asset-discovery-fields,.global-search-results,.global-search-item,
  .global-search-icon,.global-search-detail,.global-search-detail>div,
  .asset-context-menu,.version-update-banner,.appearance-option,dialog,#toast) {
  border-radius: var(--radius-surface) !important;
}
:is(.tag,.client-pill,.vendor-pill,.role-pill,.job-state,.activity-kind,.activity-client,
  .analyst-readonly,.user-state,.asset-page-tabs [role="tab"],.auth-tabs button) {
  border-radius: var(--radius-pill) !important;
}
kbd { border-radius: var(--radius-small); }
:root[data-theme] :is(dialog,#modal,.confirmation-dialog,.ssh-window) { border-radius: var(--radius-dialog) !important; }
:root[data-theme] :is(.search-box,.asset-list-search,.list-search) input,
:root[data-theme] #global-search-input { border-radius: var(--radius-pill) !important; }
:root[data-theme] #modal :is(.role-help,.permission-head span) { color: var(--muted); }
:root[data-theme] #modal .permission-client span { color: var(--text); }
:root[data-theme] #modal .import-drop { background: var(--raised); border-color: var(--control-line); border-radius: var(--radius-surface); }
:root[data-theme] #modal .import-drop .link-button { color: var(--link); }
:root[data-theme] #content .asset-filter-summary b { color: var(--text); }
:root[data-theme] #content .asset-page-timeline-bar>span { color: var(--muted); }
:root[data-theme] #content .operational-round-run-summary { background: var(--raised); color: var(--muted); }
:root[data-theme] #content :is(.operational-round-observations,.operational-round-finding) summary { color: var(--text); }
:root[data-theme] #content .asset-assessment-check summary small { color: var(--muted); }
:root[data-theme] #content :is(.operational-round-network,.operational-round-readings-empty,.operational-round-network-coverage,.operational-round-network-mode-note) {
  background: var(--raised); color: var(--muted); border-color: var(--line);
}
:root[data-theme] #content .operational-round-data-section>summary { color: var(--text); }
:root[data-theme] #content .operational-round-network :is(article,table,th:first-child) { background: var(--surface); border-color: var(--line); }
:root[data-theme] #content .operational-round-network :is(h4,b,strong,td) { color: var(--text); }
:root[data-theme] #content .operational-round-network :is(p,small,th,td:before) { color: var(--muted); }
:root[data-theme] #content .operational-round-network-status { background: var(--success-soft); color: var(--success); }
:root[data-theme] #content .operational-round-network-status.attention { background: var(--warning-soft); color: var(--amber); }
:root[data-theme] #content .operational-round-network-status:is(.incomplete,.baseline) { background: var(--raised); color: var(--muted); }

:root[data-theme] :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea),
:root[data-theme] #modal :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea) {
  border-color: var(--control-line);
}
:root[data-theme] :is(input[type="checkbox"],input[type="radio"]) { accent-color: var(--link); }
:root[data-theme] :is(input,textarea)::placeholder,
:root[data-theme] #modal :is(input,textarea)::placeholder,
:root[data-theme] #content :is(input,textarea)::placeholder { color: var(--muted); opacity: 1; }
:root[data-theme] :where(button,a[href],input,select,textarea,summary,[tabindex]:not([tabindex="-1"])):focus-visible {
  outline: 3px solid var(--focus) !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 2px var(--bg) !important;
}
:root[data-theme] .skip-link { background: var(--teal); color: var(--on-accent); }
:root[data-theme] #sidebar>small { color: var(--muted); }
:root[data-theme] #content[data-workspace] :is(.healthy,.success,.backup-health.healthy,.asset-operational-beacon.success) {
  color: var(--success);
}
:root[data-theme] #content[data-workspace] .asset-operational-beacon.success { border-color: var(--line); }
:root[data-theme] #content[data-workspace] .asset-operational-beacon.success :is(i,span) { color: var(--success); }
:root[data-theme] #content[data-workspace] .backup-change.initial { background: var(--raised); color: var(--muted); }
:root[data-theme] #content[data-workspace] .host-cell:hover :is(span,small) { color: var(--link); }
:root[data-theme] #content[data-workspace] .routine-empty { background: var(--surface); border-color: var(--line); color: var(--muted); }
:root[data-theme] #content[data-workspace] .routine-empty b { color: var(--text); }
:root[data-theme] #content[data-workspace] .routine-empty button { background: var(--teal); color: var(--on-accent); }
:root[data-theme] #content :is(.view-error,.view-loading) b { color: var(--text); }
:root[data-theme] #content .view-error button { background: var(--teal); color: var(--on-accent); }
:root[data-theme] #global-search-results { backdrop-filter: none; }
:root[data-theme] main>header:has(#global-search-results:not([hidden])) {
  backdrop-filter: none; -webkit-backdrop-filter: none; background: var(--navy);
}
:root[data-theme] #global-search-results h2 { color: var(--muted); }
:root[data-theme] #global-search-results .global-search-copy b { color: var(--text); }
:root[data-theme] #global-search-results .global-search-copy :is(span,small) { color: var(--muted); }
:root[data-theme] #global-search-results .global-search-state b { color: var(--text); }
:root[data-theme] #global-search-results .global-search-state span { color: var(--muted); }
:root[data-theme] #global-search-results .asset-operational-beacon.success { background: var(--success-soft); border-color: var(--line); }
:root[data-theme] #global-search-results :is(.global-search-operational.success,.asset-operational-beacon.success,.asset-operational-beacon.success i,.asset-operational-beacon.success span) { color: var(--success); }
:root[data-theme] #global-search-results .global-search-operational.warning { color: var(--amber); }
:root[data-theme] #global-search-results .global-search-operational.danger { color: var(--danger); }
:root[data-theme] #global-search-results .global-search-item.active { background: var(--accent-soft); border-color: var(--line); }
:root[data-theme] #global-search-results .global-search-item:hover:not(.active) { background: var(--hover); border-color: var(--control-line); }
:root[data-theme] #global-search-results .global-search-actions button { background: var(--raised); color: var(--text); border-color: var(--control-line); }
:root[data-theme] #global-search-results .global-search-actions button:hover { background: var(--hover); }
:root[data-theme] #global-search-results .global-search-actions :is(.access-action,.primary) { background: var(--teal); color: var(--on-accent); }
:root[data-theme] #global-search-results .global-search-actions :is(.access-action,.primary):hover { background: var(--teal); filter: brightness(1.05); }
:root[data-theme] #global-search-results .global-search-actions button.danger { color: var(--danger); }
:root[data-theme] #modal .asset-discovery-fields { background: var(--raised); background-image: none; border-color: var(--line); }
:root[data-theme] #modal .asset-discovery-fields b { color: var(--text); }
:root[data-theme] #modal .asset-discovery-fields :is(span,small,p) { color: var(--muted); }
:root[data-theme] #content .clients-hero { background: var(--surface); background-image: none; border-color: var(--line); color: var(--text); }
:root[data-theme] #content .clients-hero :is(p,.dashboard-kicker) { color: var(--muted); }
:root[data-theme] .confirmation-actions :is(button,[data-testid="confirmation-cancel"]):not(:disabled) {
  background: var(--raised); color: var(--text); border-color: var(--control-line); box-shadow: none;
}
:root[data-theme] .confirmation-actions [data-testid="confirmation-submit"]:not(:disabled) {
  background: var(--teal); color: var(--on-accent); border-color: var(--line);
}
:root[data-theme] .confirmation-dialog[data-variant="danger"] [data-testid="confirmation-submit"]:not(:disabled) {
  background: var(--raised); color: var(--danger); border-color: var(--line);
}
:root[data-theme] .confirmation-actions button:hover:not(:disabled) { filter: brightness(1.08); }
:root[data-theme] .confirmation-icon { background: var(--accent-soft); color: var(--link); }
:root[data-theme] .confirmation-object strong { color: var(--text); }
:root[data-theme] .confirmation-error { background: var(--danger-soft); color: var(--danger); }
:root[data-theme] .confirmation-progress { background: var(--raised); color: var(--text); }
.appearance-preview.dark { background: var(--reference-bg); }
.appearance-preview.dark i { background: var(--reference-raised); }
.appearance-preview.dark b { background: var(--reference-surface); }
.appearance-preview.light-red { background: var(--light-bg); }
.appearance-preview.light-red i { background: var(--light-raised); }
.appearance-preview.light-red b { background: var(--light-surface); }
.appearance-preview.light { background: var(--light-bg); }
.appearance-preview.light i { background: var(--light-raised); }
.appearance-preview.light b { background: #fff; }
.appearance-preview.system { background: var(--raised); }
/* Routine wizard was still using fixed green/grey colors and 7–10px copy. */
:root[data-theme] #modal .routine-wizard { color: var(--text); }
:root[data-theme] #modal .routine-wizard :is(b,h3,strong) { color: var(--text); }
:root[data-theme] #modal .routine-wizard :is(p,small,label,span) { color: var(--muted); }
:root[data-theme] #modal .routine-wizard :is(p,small,label,span,b) { font-size: 12px; }
:root[data-theme] #modal .routine-wizard-copy h3 { font-size: 19px; }
:root[data-theme] #modal .routine-wizard-copy>span { color: var(--link); }
:root[data-theme] #modal .routine-wizard :is(.routine-schedule-fields,.routine-filter-group,.routine-review-grid article,.routine-active-switch,.routine-preview-assets header) {
  background: var(--raised); border-color: var(--line); border-radius: var(--radius-surface);
}
:root[data-theme] #modal .routine-wizard :is(.routine-template-grid button,.routine-scope-grid button,.routine-check-grid label,.routine-days label span,.routine-preview-assets>div>span,.routine-preview-assets>div>p) {
  background: var(--surface); color: var(--text); border-color: var(--control-line);
}
:root[data-theme] #modal .routine-wizard :is(.routine-template-grid button,.routine-scope-grid button):hover { background: var(--hover); }
:root[data-theme] #modal .routine-wizard :is(.routine-template-grid button,.routine-scope-grid button).active,
:root[data-theme] #modal .routine-wizard .routine-days input:checked+span { background: var(--accent-soft); color: var(--link); border-color: var(--line); box-shadow: none; }
:root[data-theme] #modal .routine-wizard .routine-days input:focus-visible+span { outline: 3px solid var(--focus); outline-offset: 3px; }
:root[data-theme] #modal .routine-wizard :is(.routine-scope-note,.routine-exclusions) { background: var(--raised); color: var(--muted); border-color: var(--line); }
:root[data-theme] #modal .routine-wizard :is(.routine-preview-assets,.routine-wizard-steps,footer) { border-color: var(--line); }
:root[data-theme] #modal .routine-wizard .routine-preview-assets>div { background: var(--line); }
:root[data-theme] #modal .routine-wizard-steps i { background: var(--raised); color: var(--muted); }
:root[data-theme] #modal .routine-wizard-steps :is(.active,.done) i { background: var(--accent-soft); color: var(--link); box-shadow: none; }
:root[data-theme] #modal .routine-wizard>footer button { background: var(--teal); color: var(--on-accent); font-size: 13px; min-height: 44px; }
:root[data-theme] #modal .routine-wizard>footer button.secondary { background: var(--surface); color: var(--text); border-color: var(--control-line); }
:root[data-theme] #modal .routine-days { flex-wrap: wrap; }
@media(max-width:650px) {
  :root[data-theme] #modal .routine-wizard :is(.routine-template-grid,.routine-scope-grid,.routine-review-grid,.routine-preview-assets>div,.routine-check-grid,.routine-schedule-fields) { grid-template-columns: minmax(0,1fr); }
  :root[data-theme] #modal .routine-wizard>footer { flex-wrap: wrap; }
  :root[data-theme] #modal .routine-wizard>footer>div { flex-wrap: wrap; }
}
:root:is([data-theme="light"],[data-theme="light-red"]) #content .asset-page-quick-actions button:first-child {
  background: var(--teal); border-color: var(--line); color: var(--on-accent);
}
/* The five-column pager cannot fit alongside the tablet sidebar. Keep every action reachable. */
@media(min-width:601px) and (max-width:1200px) {
  :root[data-theme] #content #assets-pagination.assets-list-pager {
    grid-template-columns: minmax(0,1fr) minmax(0,1fr);
    grid-template-areas: "search search" "status size" "prev next";
  }
  #assets-pagination .asset-list-search { grid-area: search; }
  #assets-pagination .list-pager-status { grid-area: status; min-width: 0; }
  #assets-pagination .list-page-size { grid-area: size; min-width: 0; justify-content: flex-end; }
  #assets-pagination [data-page-action="previous"] { grid-area: prev; }
  #assets-pagination [data-page-action="next"] { grid-area: next; }
}
@media(forced-colors:active) {
  :root[data-theme] :where(button,a[href],input,select,textarea,summary,[tabindex]):focus-visible {
    outline-color: Highlight !important; box-shadow: none !important;
  }
}