/* Approved October 2026 navy/blue workspace. Loaded after the legacy layers. */
:root {
  --bg:#f3f6fb; --surface:#fff; --surface-2:#edf2f8;
  --line:#dfe6ef; --line-strong:#bdcadb;
  --ink:#14243b; --ink-2:#30465f; --muted:#586a80;
  --accent:#204f83; --accent-hover:#173d68; --accent-soft:#e5effa;
  --accent-ink:#1c4b80; --on-accent:#fff;
  --side-bg:#112a44; --side-text:#c0cede; --side-active-text:#fff;
  --side-active-bg:#234e78; --side-line:#2c435d; --side-bar:#8cc5ff;
  --glass:rgba(243,246,251,.96); --scrim:rgba(13,32,53,.5);
  --pal-ink:var(--ink); --pal-muted:var(--muted); --pal-line:var(--line);
  --pal-sel:var(--accent-soft); --pal-accent:var(--accent);
}
html.dark:not(.crazy) {
  --bg:#0d1928; --surface:#142437; --surface-2:#1c3047;
  --line:#30445c; --line-strong:#536c88;
  --ink:#f2f6fd; --ink-2:#d7e2f0; --muted:#afc0d5;
  --accent:#9bcbff; --accent-hover:#bedfff; --accent-soft:#203d5d;
  --accent-ink:#b8d9ff; --on-accent:#102c49;
  --side-bg:#0e2034; --side-text:#bfcee1; --side-active-bg:#25496f;
  --side-line:#2b415a; --side-bar:#9bcbff;
  --glass:rgba(13,25,40,.96); --pal-bg:var(--surface);
  --pal-kbd:var(--surface-2);
}
html:root body {caret-color:var(--accent);}
::selection {background:#b9d9fb;color:#102b49;}
html.dark ::selection {background:#365d89;color:#fff;}
html:root .side {background:var(--side-bg);}
html:root .side .brand-mark,html:root .side .avatar {background:#2d629b;color:#fff;}
html:root .nav-item.active {background:var(--side-active-bg);color:#fff;}
html:root .side .brand {padding-block:6px 14px;}
html:root .side .user-card small {color:var(--side-text);}
html:root .side :is(.nav-item,.auth-trigger) {min-block-size:42px;}
/* Optional MFA labels wrap within the sidebar in both languages. */
html:root .side #crm-mfa-settings {min-inline-size:0;max-inline-size:100%;box-sizing:border-box;white-space:normal;overflow-wrap:anywhere;}
html:root .workspace-preferences {margin-block-start:14px;border-block-start:1px solid var(--side-line);padding-block-start:10px;}
.workspace-preferences>summary {display:flex;align-items:center;gap:10px;min-block-size:44px;padding:8px 12px;color:var(--side-text);font-size:14px;cursor:pointer;border-radius:8px;list-style:none;}
.workspace-preferences>summary::-webkit-details-marker {display:none;}
.workspace-preferences>summary::after {content:'+';margin-inline-start:auto;font-size:18px;}
.workspace-preferences[open]>summary::after {content:'−';}
.workspace-preferences>summary:hover {background:var(--side-active-bg);color:#fff;}
.workspace-preferences .theme-picker {margin-block:8px;}
html:root .workspace-preferences .nav-danger-zone {margin-block-start:12px;padding-block-start:12px;border-block-start:1px solid var(--side-line);}
html:root header {border-color:var(--line);}
html:root .global-search-wrap input {background:var(--surface);border-color:var(--line);}
html:root .search-results {background:var(--surface);}
html:root .search-result-item:hover {background:var(--accent-soft);}
html:root .card {box-shadow:none;}
html:root .global-fab {background:var(--accent);color:var(--on-accent);box-shadow:0 6px 18px rgba(18,48,80,.18);}
@media(min-width:961px) {
  html:root header {padding-block:20px;margin-block-end:22px;}
  html:root main:has(.home-command) header>div:first-child {display:none;}
  html:root main:has(.home-command) header .header-actions {width:100%;}
  html:root main:has(.home-command) header .global-search-wrap {margin-inline-end:auto;}
  html:root .global-search-wrap input {width:clamp(220px,26vw,430px);}
  html:root .global-search-wrap input:focus {width:clamp(220px,26vw,430px);}
}
@media(max-width:960px) {
  html:root .side :is(.nav-item,.auth-trigger) {min-block-size:44px;}
}
@media(prefers-reduced-motion:reduce) {
  html:root :is(.primary,.secondary,.nav-item,.card) {transition:none;}
}

/* Working pages share the approved workspace palette and compact toolbars. */
#view[data-view] {min-inline-size:0;}
.workspace-page-toolbar {gap:14px 24px;align-items:center;margin-block:0 16px;}
.workspace-page-toolbar>div:first-child {flex:1 1 320px;min-width:0;}
.workspace-page-toolbar>div:last-child {flex-wrap:wrap;}
.workspace-page-toolbar .sub {margin:0;max-inline-size:68ch;line-height:1.5;}
html:root #view[data-view] :is(input,select,textarea) {border-color:var(--line-strong);}
html:root #view[data-view] :is(button,a,input,select,textarea,summary):focus-visible {outline:2px solid var(--accent);outline-offset:3px;}
html:root #view[data-view] :is(.view-toggle,.contact-type-filters,.controls) {background:var(--surface-2);border-radius:10px;}
html:root #view[data-view] :is(.view-toggle,.contact-type-filters) button {min-block-size:44px;box-shadow:none;}
html:root #view[data-view] :is(.view-toggle .primary,.contact-type-filters .active,.controls .filter.active) {background:var(--accent);color:var(--on-accent);border-color:var(--accent);}
html:root #view[data-view] :is(.table,.lr-value,.pl-date,.count) {font-variant-numeric:tabular-nums;}
html:root #view[data-view] :is(.lead-board,.report-table-wrap,.settings-tabs,.report-jump) {scrollbar-color:var(--line-strong) transparent;}
.contact-results-head {display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 18px;background:var(--surface-2);border-block-end:1px solid var(--line);}
.contact-results-head p {margin:0;font-size:13px;}
.contact-results-head button {min-block-size:44px;flex:none;}
html:root .contacts-directory .contact-row {padding-block:14px;}
html:root .contacts-directory .contact-results-head+.contact-row {border-block-start:0;}
html:root .contacts-directory .stg>* {animation:none;}
html:root .contacts-directory .contact-open .av {background:var(--accent-soft);color:var(--accent-ink);}
html:root .contacts-directory .qa-btn {min-inline-size:44px;min-block-size:44px;}
html:root .contact-search input {box-shadow:none;}
html:root #view[data-view=leads] .lead-board>.stage {border-radius:14px;border:1px solid var(--line);background:var(--surface-2);}
html:root #view[data-view=leads] .lead-card {box-shadow:none;border-color:var(--line);border-radius:12px;}
html:root #view[data-view=leads] .stage-header {padding-block:2px 12px;color:var(--ink);}
html:root #view[data-view=leads] .stage-header .count {background:var(--surface);color:var(--ink-2);}
html:root .planner-actions>.my-day {margin:0;padding:16px 18px;border:0;border-radius:0;background:var(--accent-soft);border-block-end:1px solid var(--line);}
html:root .planner-actions>.my-day>div {display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 16px;}
html:root .planner-actions>.my-day .sub {margin:0;}
html:root .planner-actions .pg-head {background:var(--surface);padding-block:12px;}
html:root .planner-actions .pl-row {padding-block:14px;}
html:root .reports .report-toolbar {gap:10px;padding:16px;}
html:root .reports .report-today-hint {grid-column:1/-1;display:flex;align-items:center;flex-wrap:wrap;gap:4px 16px;margin:0;}
html:root .reports .report-saved-views {grid-column:1/-1;margin:0;padding-block-start:8px;border-block-start:1px solid var(--line);}
html:root .reports .report-saved-views>summary {min-block-size:36px;align-content:center;color:var(--ink-2);}
html:root .reports .report-jump-chip {border-radius:8px;}
html:root .reports .report-presets {border:0;background:var(--surface-2);border-radius:10px;}
html:root .reports .report-presets .active {background:var(--accent);border-color:var(--accent);color:var(--on-accent);box-shadow:none;}
html:root .settings>.row:first-child {display:none;}
html:root .settings-tabs-wrap {margin-block-end:16px;}
html:root .settings-tabs {padding:4px;gap:4px;border:0;border-radius:12px;background:var(--surface-2);}
html:root .settings-tab {min-block-size:44px;padding:10px 16px;border:0;border-radius:8px;color:var(--ink-2);}
html:root .settings-tab.active {background:var(--accent);color:var(--on-accent);box-shadow:none;}
html:root .settings .user-row {padding-block:16px;}
html:root .settings .user-self-note {max-inline-size:65ch;}
html:root .settings .user-actions {gap:8px;}
@media(min-width:1200px) {
  html:root #view[data-view=contacts] .contacts-top {grid-template-columns:minmax(240px,1fr) auto;align-items:center;gap:16px;}
  html:root .reports .report-more-body {grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin-block-start:4px;}
  html:root .settings .user-row {display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px 24px;align-items:center;}
  html:root .settings .user-actions {justify-content:flex-end;}
  html:root .settings .user-actions>.user-status-btn {margin-inline-start:16px;}
}
@media(max-width:760px) {
  .workspace-page-toolbar {gap:12px;margin-block-end:12px;}
  .workspace-page-toolbar>div:first-child {flex-basis:100%;}
  .workspace-page-toolbar>div:last-child {min-width:0;max-width:100%;}
  .contact-results-head {padding-inline:14px;}
  .contact-results-head p {font-size:12px;}
  html:root .settings-tab {padding-inline:12px;}
  html:root .reports .report-toolbar {padding:12px;}
}
@media print {
  html:root #view[data-view] :is(.workspace-page-toolbar,.report-toolbar,.settings-tabs-wrap) {break-inside:avoid;}
}

/* Carried-over work must not look like a new appointment in Today. */
html:root .week-item .wi-overdue {font-size:12px;font-weight:750;color:var(--danger-ink);}
html:root .week-item .wi-due {font-size:12px;line-height:1.4;overflow-wrap:anywhere;}

/* A narrow Planner row must keep the contact identity readable beside its actions. */
@media(max-width:480px) {
  html:root .planner-actions .pl-item {flex-wrap:wrap;gap:8px;padding-block-end:8px;}
  html:root .planner-actions .pl-item>.pl-row {flex:1 0 100%;inline-size:100%;box-sizing:border-box;}
  html:root .planner-actions .pl-row>.tag {grid-column:2 / -1;justify-self:start;white-space:normal;}
  html:root .planner-actions .pl-body>b,
  html:root .planner-actions .pl-body .ttl,
  html:root .planner-actions .pl-body .ttl bdi {display:block;white-space:normal;overflow:visible;text-overflow:clip;-webkit-line-clamp:unset;line-clamp:unset;max-block-size:none;overflow-wrap:anywhere;}
  html:root .planner-actions .pl-item>.pl-row+button {margin-inline-start:auto;}
  html:root .planner-actions .pl-item>:is(.pl-go,.pl-done) {min-inline-size:44px;min-block-size:44px;flex:0 0 44px;}
  html:root .planner-actions .pl-item>:is(.pl-go,.pl-done):last-child {margin-inline-end:12px;}
}

/* Touch targets: phones and tablets (<=1024px) get 44px minimum hit areas for
   primary controls. Logical properties keep Arabic/RTL layouts intact. */
@media (max-width:1024px) {
  html:root:root:root :is(button.primary,button.secondary,button.danger,button.filter,button.shift-pill,button.next,button.setup-preview-task,button.text-link,button.deal-title,summary) {min-block-size:44px;}
  html:root:root:root :is(button.language,button.bell) {min-inline-size:44px;min-block-size:44px;}
}

/* Rep work transfer dialog (131). Logical properties only. */
html:root .rt-group {border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-block:10px;}
html:root .rt-group legend {font-weight:700;padding-inline:6px;}
html:root .rt-cat {display:grid;gap:2px;padding-block:6px;}
html:root .rt-group label:has(> input[type=radio]) {display:flex;align-items:center;gap:8px;min-block-size:44px;}
html:root .rt-cat small {color:var(--muted);padding-inline-start:26px;}
html:root .rt-customers-list {max-block-size:220px;overflow:auto;margin-block-start:8px;}
html:root .rt-customer {display:flex;gap:8px;align-items:center;min-block-size:44px;}
html:root .rt-counts {border-collapse:collapse;margin-block:8px;}
html:root .rt-counts th {text-align:start;font-weight:600;padding-block:4px;padding-inline-end:24px;}
html:root .rt-counts td {text-align:end;font-variant-numeric:tabular-nums;}
html:root .rt-skipped {border-inline-start:3px solid var(--amber);padding-inline-start:10px;margin-block-start:8px;}
html:root .rt-recent {list-style:none;padding:0;margin:0;}
html:root .rt-recent li {display:flex;gap:8px;align-items:center;justify-content:space-between;min-block-size:44px;}
html:root .rt-deactivate {display:flex;gap:8px;align-items:center;margin-block:10px;min-block-size:44px;}

/* Clinic devices (132): per-device answers in the visit flow and the history card. Logical properties only. */
html:root .cd-device {border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-block:8px;}
html:root .cd-name {display:block;margin-block-end:6px;}
html:root .cd-chooser {display:grid;gap:8px;margin-block-start:8px;}
html:root .cd-history {list-style:none;padding:0;margin:0;}
html:root .cd-history li {padding-block:6px;display:grid;gap:2px;}

/* Email code dialog and trusted devices (133). Logical properties only. */
html:root .eotp-back {align-items:center;justify-content:center;}
html:root #eotp-code {font-size:22px;letter-spacing:6px;text-align:center;}
html:root .dev-list {list-style:none;padding:0;margin:0;}
html:root .dev-row {display:flex;gap:12px;align-items:center;justify-content:space-between;padding-block:8px;border-block-end:1px solid var(--line);min-block-size:44px;}
html:root .dev-row small {display:block;color:var(--muted);}

/* Settings > Import data (bulk import). Logical properties only; 44px targets. */
html:root .imp-group {border:1px solid var(--line);border-radius:10px;padding:10px 14px;margin-block:12px;}
html:root .imp-group legend {font-weight:700;padding-inline:6px;}
html:root .imp-kinds, html:root .imp-templates, html:root .imp-filters, html:root .imp-pager {display:flex;flex-wrap:wrap;gap:8px;align-items:center;}
html:root .imp-kind {display:flex;align-items:center;gap:8px;min-block-size:44px;padding-inline:12px;border:1px solid var(--line);border-radius:10px;}
html:root .imp-templates button, html:root .imp-filters .chip, html:root .imp-pager button, html:root .imp .modal-actions button {min-block-size:44px;}
html:root .imp select {min-block-size:44px;max-inline-size:100%;}
html:root .imp-file-btn {display:inline-flex;align-items:center;min-block-size:44px;padding-inline:16px;border:1px solid var(--line);border-radius:10px;cursor:pointer;}
html:root .sr-only-input {position:absolute;inline-size:1px;block-size:1px;opacity:0;overflow:hidden;}
html:root .sr-only-input:focus-visible + p, html:root .imp-file-btn:focus-within {outline:2px solid var(--blue,#2563eb);outline-offset:2px;}
html:root .imp-table-wrap {overflow:auto;max-block-size:60vh;border:1px solid var(--line);border-radius:10px;margin-block:10px;}
html:root .imp-table {border-collapse:collapse;inline-size:100%;min-inline-size:560px;}
html:root .imp-table th, html:root .imp-table td {text-align:start;padding:8px 10px;border-block-end:1px solid var(--line);vertical-align:top;}
html:root .imp-err td, html:root .imp-err th {background:color-mix(in srgb, var(--red,#dc2626) 8%, transparent);}
html:root .imp-warn td, html:root .imp-warn th {background:color-mix(in srgb, var(--amber,#d97706) 9%, transparent);}
html:root .imp-error {color:var(--red,#b91c1c);font-weight:600;}
html:root .imp-progress {display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-block:14px;}
html:root .imp-progress progress {flex:1 1 220px;block-size:16px;}
html:root .imp-summary {margin-block:10px;line-height:1.8;}
html:root .imp, html:root .imp-table-wrap {min-inline-size:0;max-inline-size:100%;}
html:root .imp-table-wrap {position:relative;}

/* Bulk approve on the Approvals page */
html:root .team-bulk {display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-block:10px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;}
html:root .team-bulk button {min-block-size:44px;}
html:root .team-bulk-all {display:inline-flex;align-items:center;gap:8px;min-block-size:44px;}
html:root .team-need-select {display:inline-flex;align-items:center;justify-content:center;min-inline-size:44px;min-block-size:44px;margin-inline-end:4px;}
html:root .team-bulk-list {padding-inline-start:18px;margin-block:8px;}
html:root .imp input:not([type=radio]):not([type=checkbox]):not([type=file]), html:root .imp select {min-block-size:44px;max-inline-size:100%;}
