/* ═══════════════════════════════════════════════════════════════════════════
   SBR Air — shared/ui/sbr-air.legacy-skin.css  (V9, Nov 6 2026)
   Converts the remaining legacy office screens (modals, popups, full job record, dispatch, scheduling,
   timesheets, reports, settings, messages …) from the dark navy look to the SBR Air light palette
   (docs/design/SBR_Air_Visual_Design_System_v1.1.md tokens — values copied from sbr-air.tokens.css).
   HOW: tools/ui/legacy_skin_codemod.pl wrapped every hard-coded legacy colour / small font / uppercase label in
   a variable with the ORIGINAL value as fallback (e.g. var(--lxc-7a90a8,#7a90a8)). The variables, and the
   legacy :root variables (--navy, --text …), are redefined ONLY under body.mode-admin, so the Worker App
   (body.mode-worker) keeps its exact current look. Visual only: no markup, data or behaviour changes.
   ═══════════════════════════════════════════════════════════════════════════ */
body.mode-admin {
  /* ── legacy :root variables → SBR Air ── */
  --navy: #F6F5F2;            /* canvas */
  --navy-mid: #FFFFFF;
  --navy-card: #FFFFFF;
  --navy-hover: #F7F8FA;
  --green: #15803D;  --green-dark: #166534;  --green-dim: #ECFDF3;  --green-border: #ABEFC6;
  --blue: #2563EB;   --blue-dim: #EFF4FF;
  --amber: #B45309;  --amber-dim: #FFF7E6;
  --red: #DC2626;    --red-dim: #FEF2F2;
  --purple: #6D28D9; --purple-dim: #F5F3FF;
  --text: #1F2328;   --text-muted: #57606A;  --text-dim: #636A73;
  --border: #E4E6EA; --border-md: #D5D9DF;   --border-active: #2563EB;
  --radius: 12px;    --radius-sm: 8px;

  /* ── legacy literal colours → SBR Air (generated: perl tools/ui/legacy_skin_codemod.pl --css) ── */
  --lxc-00a07a: #166534;
  --lxb-00a07a: #1D4ED8;
  --lxl-00a07a: #1D4ED8;
  --lxc-00c896: #166534;
  --lxb-00c896: #2563EB;
  --lxl-00c896: #2563EB;
  --lxc-0a1628: #FFFFFF;
  --lxb-0a1628: #FFFFFF;
  --lxl-0a1628: #E4E6EA;
  --lxc-0d1e30: #1F2328;
  --lxb-0d1e30: #FAFAF8;
  --lxl-0d1e30: #E4E6EA;
  --lxc-0f1724: #1F2328;
  --lxb-0f1724: #F6F5F2;
  --lxl-0f1724: #E4E6EA;
  --lxc-0f1e2e: #1F2328;
  --lxb-0f1e2e: #FAFAF8;
  --lxl-0f1e2e: #E4E6EA;
  --lxc-0f3460: #1F2328;
  --lxb-0f3460: #FFFFFF;
  --lxl-0f3460: #E4E6EA;
  --lxc-112233: #1F2328;
  --lxb-112233: #FAFAF8;
  --lxl-112233: #E4E6EA;
  --lxc-152030: #1F2328;
  --lxb-152030: #FFFFFF;
  --lxl-152030: #E4E6EA;
  --lxc-16213e: #1F2328;
  --lxb-16213e: #FAFAF8;
  --lxl-16213e: #E4E6EA;
  --lxc-1a1a2e: #1F2328;
  --lxb-1a1a2e: #F6F5F2;
  --lxl-1a1a2e: #E4E6EA;
  --lxc-1a2a3e: #1F2328;
  --lxb-1a2a3e: #FFFFFF;
  --lxl-1a2a3e: #E4E6EA;
  --lxc-1e3248: #1F2328;
  --lxb-1e3248: #FAFAF8;
  --lxl-1e3248: #E4E6EA;
  --lxc-34d399: #166534;
  --lxb-34d399: #2563EB;
  --lxl-34d399: #2563EB;
  --lxc-378add: #1D4ED8;
  --lxb-378add: #2563EB;
  --lxl-378add: #BFD3FE;
  --lxc-3b82f6: #1D4ED8;
  --lxb-3b82f6: #2563EB;
  --lxl-3b82f6: #BFD3FE;
  --lxc-4a5a6e: #636A73;
  --lxb-4a5a6e: #D5D9DF;
  --lxl-4a5a6e: #D5D9DF;
  --lxc-60a5fa: #1D4ED8;
  --lxb-60a5fa: #2563EB;
  --lxl-60a5fa: #BFD3FE;
  --lxc-6a8090: #636A73;
  --lxb-6a8090: #D5D9DF;
  --lxl-6a8090: #D5D9DF;
  --lxc-7a90a8: #57606A;
  --lxb-7a90a8: #D5D9DF;
  --lxl-7a90a8: #D5D9DF;
  --lxc-888: #636A73;
  --lxb-888: #D5D9DF;
  --lxl-888: #D5D9DF;
  --lxc-888888: #636A73;
  --lxb-888888: #D5D9DF;
  --lxl-888888: #D5D9DF;
  --lxc-8a9ab8: #57606A;
  --lxb-8a9ab8: #D5D9DF;
  --lxl-8a9ab8: #D5D9DF;
  --lxc-8a9bb0: #57606A;
  --lxb-8a9bb0: #D5D9DF;
  --lxl-8a9bb0: #D5D9DF;
  --lxc-8b5cf6: #5B21B6;
  --lxb-8b5cf6: #6D28D9;
  --lxl-8b5cf6: #DDD6FE;
  --lxc-94a3b8: #57606A;
  --lxb-94a3b8: #D5D9DF;
  --lxl-94a3b8: #D5D9DF;
  --lxc-a78bfa: #5B21B6;
  --lxb-a78bfa: #6D28D9;
  --lxl-a78bfa: #DDD6FE;
  --lxc-b0c4d8: #57606A;
  --lxb-b0c4d8: #D5D9DF;
  --lxl-b0c4d8: #D5D9DF;
  --lxc-e05454: #B91C1C;
  --lxb-e05454: #DC2626;
  --lxl-e05454: #FECACA;
  --lxc-e8f0f8: #1F2328;
  --lxb-e8f0f8: #F0EFEB;
  --lxl-e8f0f8: #D5D9DF;
  --lxc-ef4444: #B91C1C;
  --lxb-ef4444: #DC2626;
  --lxl-ef4444: #FECACA;
  --lxc-f0f4f8: #1F2328;
  --lxb-f0f4f8: #F0EFEB;
  --lxl-f0f4f8: #D5D9DF;
  --lxc-f59e0b: #92400E;
  --lxb-f59e0b: #D97706;
  --lxl-f59e0b: #FCD9A0;
  --lxc-f5a623: #92400E;
  --lxb-f5a623: #D97706;
  --lxl-f5a623: #FCD9A0;
  --lxc-f87171: #B91C1C;
  --lxb-f87171: #DC2626;
  --lxl-f87171: #FECACA;
  --lxc-fbbf24: #92400E;
  --lxb-fbbf24: #D97706;
  --lxl-fbbf24: #FCD9A0;
  --lxb-00a07a-dot: #15803D;
  --lxb-00c896-dot: #15803D;
  --lxb-34d399-dot: #15803D;
  --lxc-at: #92400E;
  --lxb-at: #FFF7E6;
  --lxl-at: #FCD9A0;
  --lxc-bt: #1D4ED8;
  --lxb-bt: #EFF4FF;
  --lxl-bt: #BFD3FE;
  --lxc-gt: #166534;
  --lxb-gt: #ECFDF3;
  --lxl-gt: #ABEFC6;
  --lxc-rt: #B91C1C;
  --lxb-rt: #FEF2F2;
  --lxl-rt: #FECACA;
  --lxc-vt: #5B21B6;
  --lxb-vt: #F5F3FF;
  --lxl-vt: #DDD6FE;
  --lxc-whi: #636A73;
  --lxb-whi: #F0EFEB;
  --lxl-whi: #D5D9DF;
  --lxc-wlo: #636A73;
  --lxb-wlo: #FAFAF8;
  --lxl-wlo: #E4E6EA;
  --lxb-scrim: rgba(28, 31, 36, .32);
  --lxb-kt: #FAFAF8;
  --lxl-shadow: rgba(16, 24, 40, .16);

  /* ── typography: SBR Air minimum 12 px, sentence-case labels ── */
  --lxf-8: 11px;  --lxf-9: 11px;  --lxf-10: 12px;  --lxf-11: 12px;  --lxf-12: 13px;  --lxf-13: 14px;
  --lx-upper: none;  --lx-ls: normal;

  font-family: "SBR Air Inter", Inter, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* Form controls rendered by legacy markup: SBR Air control height, border and focus ring. */
body.mode-admin input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),
body.mode-admin select, body.mode-admin textarea { font-family: inherit; }
body.mode-admin input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):focus-visible,
body.mode-admin select:focus-visible, body.mode-admin textarea:focus-visible,
body.mode-admin button:focus-visible { outline: 2px solid #2563EB !important; outline-offset: 1px; }
body.mode-admin input[type=checkbox], body.mode-admin input[type=radio] { accent-color: #2563EB; }
body.mode-admin ::placeholder { color: #636A73; opacity: 1; }
body.mode-admin ::-webkit-scrollbar-thumb { background: #C9CED6; }
body.mode-admin input[type=date]::-webkit-calendar-picker-indicator,
body.mode-admin input[type=time]::-webkit-calendar-picker-indicator { filter: none; }

/* Properties → Import buildings: the overlay element itself carries .sa-scope.sa-scrim, which the shared
   descendant rule (.sa-scope .sa-scrim) never matches → it rendered inline. (Visual audit defect 07-03.) */
.sa-scope.sa-scrim { position: fixed; inset: 0; z-index: 10600; background: var(--sa-scrim); align-items: center; justify-content: center; padding: var(--sa-space-5); }
.sa-scope.sa-scrim[hidden] { display: none; }

/* ═══ Group 2 — structure (tools/ui/legacy_skin_structure.pl) ═══════════════════════════════════════════ */
body.mode-admin {
  --lxr-10: 8px; --lxr-12: 8px; --lxr-14: 12px; --lxr-16: 12px; --lxr-18: 12px;   /* v1.1 §7: panels 8, modals 12 */
  --lxw-7: 600;                                                                    /* v1.1 §5: semibold emphasis */
  --lxl-card: #E4E6EA;                                                             /* hairline outline on cards */
}
/* Legacy form controls (inline-styled) → SBR Air control look (v1.1 §18). SBR Air components (.sa-scope) are
   excluded; compact controls inside tables keep their size. Colours already come from the palette layer. */
body.mode-admin :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color]):not([type=hidden]), select, textarea):not(.sa-scope *):not(.sa-input) {
  border-color: #8C959F !important; border-radius: 6px !important; font-family: inherit !important;
}
body.mode-admin :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color]):not([type=hidden]), select):not(.sa-scope *):not(.sa-input):not(td *) { min-height: 36px; }
body.mode-admin :is(input, select, textarea):not(.sa-scope *):not(.sa-input):disabled { background: #F0EFEB !important; color: #A0A7B0 !important; }
body.mode-admin :is(input, select, textarea):not(.sa-scope *):not(.sa-input):focus { border-color: #2563EB !important; }
/* Legacy buttons: SBR Air radius and type (sizes and colours unchanged by this rule). */
body.mode-admin button:not(.sa-scope *):not(#sa-nav *) { border-radius: 6px; font-family: inherit; }
/* Legacy data tables: SBR Air header row (v1.1 §14). */
body.mode-admin table:not(.sa-scope *) thead th { background: #FAFAF8 !important; color: #57606A !important; font-weight: 600 !important; font-size: 12px !important; border-bottom: 1px solid #E4E6EA !important; }
body.mode-admin table:not(.sa-scope *) tbody tr:hover td { background: #F7F8FA; }

/* ═══ Group 2 — component normalization for inline-styled legacy markup ════════════════════════════════
   Attribute selectors match the legacy inline patterns (which carry the codemod variables), so one rule
   converts every occurrence. Office app only; SBR Air components (.sa-scope) are never matched. */
/* Form labels (were 10 px uppercase eyebrows) → v1.1 §18 label: 13 px medium, primary text, sentence case. */
body.mode-admin label[style*="--lx-upper"]:not(.sa-scope *) { font-size: 13px !important; line-height: 18px; font-weight: 500 !important; color: #1F2328 !important; margin-bottom: 6px !important; }
/* Section eyebrows / group headers inside forms and panels → 12 px semibold secondary. */
body.mode-admin div[style*="--lx-upper"]:not(.sa-scope *):not(td *):not(th *) { font-size: 12px !important; font-weight: 600 !important; color: #57606A !important; }
/* Form controls: SBR Air size and type. */
body.mode-admin :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color]):not([type=hidden]), select, textarea):not(.sa-scope *):not(.sa-input):not(td *) { font-size: 14px !important; }
body.mode-admin :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color]):not([type=hidden]), select):not(.sa-scope *):not(.sa-input):not(td *) { padding-top: 0 !important; padding-bottom: 0 !important; height: 36px; }
body.mode-admin input[type=date], body.mode-admin input[type=time] { color-scheme: light !important; }
/* Primary buttons (legacy green solid → SBR Air primary). */
body.mode-admin button[style*="--lxb-00c896,"]:not(.sa-scope *) { min-height: 36px; border-radius: 6px !important; font-size: 14px !important; font-weight: 600 !important; border: 1px solid #2563EB !important; }
body.mode-admin button[style*="--lxb-00c896,"]:not(.sa-scope *):hover { background: #1D4ED8 !important; }
/* Secondary buttons (transparent with a hairline border) → SBR Air secondary. */
body.mode-admin button[style*="background:transparent"][style*="border:1px solid"]:not(.sa-scope *):not(td *):not([style*="padding:2px"]):not([style*="padding:3px"]):not([style*="padding:1px"]) { min-height: 32px; border-color: #8C959F !important; color: #1F2328 !important; border-radius: 6px !important; }
body.mode-admin button[style*="background:transparent"][style*="border:1px solid"]:not(.sa-scope *):not(td *):hover { background: #F7F8FA !important; }
/* Modal boxes created by legacy code (box.style.cssText = background #1a2a3e …) → SBR Air modal (v1.1 §19). */
body.mode-admin div[style*="--lxb-1a2a3e,"][style*="max-height"]:not(.sa-scope *) { border-radius: 12px !important; border-color: transparent !important; box-shadow: 0 12px 32px rgba(16, 24, 40, .16) !important; }
/* Modal / panel titles (15–16 px bold) → 16 px semibold (v1.1 §5 section title). */
body.mode-admin div[style*="font-size:15px"][style*="--lxw-7"]:not(.sa-scope *), body.mode-admin div[style*="font-size:16px"][style*="--lxw-7"]:not(.sa-scope *) { font-size: 16px !important; font-weight: 600 !important; }
/* Close "×" circles → SBR Air icon button. */
body.mode-admin button[style*="border-radius:50%"][style*="width:26px"]:not(.sa-scope *) { border: 0 !important; width: 32px !important; height: 32px !important; border-radius: 6px !important; font-size: 18px !important; color: #57606A !important; }
body.mode-admin button[style*="border-radius:50%"][style*="width:26px"]:not(.sa-scope *):hover { background: #F7F8FA !important; color: #1F2328 !important; }
/* Initials avatars → SBR Air neutral avatar. */
body.mode-admin div[style*="height:26px;border-radius:50%"]:not(.sa-scope *), body.mode-admin div[style*="height:22px;border-radius:50%"]:not(.sa-scope *) { background: #F0EFEB !important; color: #57606A !important; font-size: 11px !important; font-weight: 600 !important; }
/* Panel headers (legacy "14px bold" titles) → 14 px semibold (v1.1 §8 block title). */
body.mode-admin div[style*="font-size:14px"][style*="--lxw-7"]:not(.sa-scope *) { font-weight: 600 !important; }
/* Small pill tags (division / status labels) → SBR Air tag shape. */
body.mode-admin span[style*="padding:3px 10px"][style*="--lxr-10"]:not(.sa-scope *) { border-radius: 4px !important; font-size: 12px !important; font-weight: 500 !important; padding: 2px 7px !important; }
/* G3: legacy primary actions written as background:var(--green) in markup → SBR Air primary (v1.1 §11).
   (JS-set active segments serialize as "background: var(--green)" with a space and are not matched.) */
body.mode-admin button[style*="background:var(--green)"]:not(.sa-scope *) { background: #2563EB !important; color: #FFFFFF !important; border-color: #2563EB !important; font-weight: 600 !important; border-radius: 6px !important; }
body.mode-admin button[style*="background:var(--green)"]:not(.sa-scope *):hover { background: #1D4ED8 !important; }