/* UIUX-01/02 — WORK-TOUR-OPS design tokens (prototype only)
   Inspired by Legacy TOUR-UI-001; not a production binding. */
:root {
  --font: "Noto Sans Thai", "Noto Sans", "Segoe UI", Arial, sans-serif;
  --font-mono: ui-monospace, Consolas, monospace;

  --fs-meta: 0.75rem;
  --fs-label: 0.8125rem;
  --fs-body: 0.875rem;
  --fs-table: 0.8125rem;
  --fs-h1: 1.125rem;
  --fs-h2: 1rem;
  --lh-tight: 1.25;
  --lh-body: 1.45;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  --primary: #1a5fd4;
  --primary-hover: #1554bd;
  --primary-soft: #e8f1fe;
  --accent: #0d9488;

  --page-bg: #f3f5f8;
  --surface: #ffffff;
  --sidebar-bg: #0f1b2d;
  --sidebar-text: #c5ced9;
  --sidebar-active: #1a2b45;
  --header-bg: #ffffff;

  --text-primary: #1f2329;
  --text-secondary: #5c6570;
  --text-muted: #6b7380;
  --text-inverse: #f8fafc;

  --border: #e5e9ef;
  --border-strong: #d5dbe5;
  --focus-ring: #1a5fd4;

  --success: #157a4d;
  --success-bg: #e8f8f0;
  --warning: #b45309;
  --warning-bg: #fff6e8;
  --danger: #c0392b;
  --danger-bg: #fdecee;
  --info: #1d4ed8;
  --info-bg: #eef5ff;
  --neutral: #4b5563;
  --neutral-bg: #f3f4f6;

  /* Transfer type semantics (UIUX-02T.6) — compact badge/rail only */
  --xfer-in: var(--success);
  --xfer-in-soft: var(--success-bg);
  --xfer-tr: var(--warning);
  --xfer-tr-soft: var(--warning-bg);
  --xfer-out: var(--danger);
  --xfer-out-soft: var(--danger-bg);

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --content-pad: 12px 16px 20px;

  --radius-sm: 4px;
  --radius-md: 8px;
  --shadow-sm: 0 1px 2px rgba(31, 35, 41, 0.06);
  --shadow-md: 0 8px 28px rgba(31, 35, 41, 0.14);

  --sidebar-width: 228px;
  --sidebar-rail: 56px;
  --header-height: 48px;
  --control-height: 34px;
  --table-row-h: 34px;
  --actionbar-height: 52px;
  --touch-min: 44px;
  --mobile-bar: 52px;
  --bottom-nav-h: 56px;
  --context-bar-h: 36px;
  --bp-mobile: 767.98px;

  /* Appearance / Mood readiness (UIUX-01 system — not a full theme engine) */
  --appearance: light;
  --mood: ops-blue;
  --mood-accent: var(--accent);

  /* UIUX-02T.11 — Legacy visual familiarity (Booking workspace) */
  --legacy-teal: #0e9a9a;
  --legacy-teal-dark: #0b7878;
  --legacy-teal-soft: #e8f7f7;
  --legacy-teal-border: #9fd9d9;
  --legacy-teal-text: #0a5c5c;
  --legacy-utility-bg: #fff9e6;
  --legacy-utility-border: #e8d88a;
  --legacy-utility-text: #5c4a00;
  --legacy-utility-hover: #fff3c4;

  --z-topbar: 1030;
  --z-bottom-nav: 1040;
  --z-nav-drawer: 1050;
  --z-control-decoration: 1045; /* date/select chevrons — below page combobox */
  --z-backdrop: 1060;          /* data-entry modal backdrop */
  --z-drawer: 1070;
  --z-modal: 1080;             /* data-entry modal */
  --z-modal-chrome: 1085;      /* modal sticky footer / internal chrome */
  --z-combo-dropdown: 1055;    /* floating combobox — above page chrome, below modal */
  --z-modal-combo-dropdown: 1095; /* combobox list inside open modal */
  --z-confirm-backdrop: 1120;  /* dirty-confirm backdrop — above data-entry modal */
  --z-confirm: 1130;           /* dirty-confirm dialog */
  --z-toast: 1200;
}

/* Stub hooks only — preserve readiness; do not build full theme engine in UIUX-02 */
html[data-appearance="dark"] {
  --appearance: dark;
  --page-bg: #121820;
  --surface: #1a222d;
  --header-bg: #1a222d;
  --text-primary: #e8eef5;
  --text-secondary: #a8b3c2;
  --text-muted: #8b97a8;
  --border: #2a3442;
  --border-strong: #3a4656;
}
html[data-appearance="system"] {
  --appearance: system;
}
html[data-mood="ops-teal"] {
  --mood: ops-teal;
  --primary: #0f766e;
  --primary-hover: #0d9488;
  --primary-soft: #e6f7f5;
  --mood-accent: #0d9488;
  --focus-ring: #0f766e;
}
@media (prefers-color-scheme: dark) {
  html[data-appearance="system"] {
    --page-bg: #121820;
    --surface: #1a222d;
    --header-bg: #1a222d;
    --text-primary: #e8eef5;
    --text-secondary: #a8b3c2;
    --text-muted: #8b97a8;
    --border: #2a3442;
    --border-strong: #3a4656;
  }
}