/* ============================================================================
   RMS Design System (D1) — Telegram Mini App token root + faces.
   Source of truth: projects/RMS/design/design-system.md (D1, authoritative);
   transcribed from src/AegaeonForge.Blazor/wwwroot/css/rms-design-system.css so
   the mobile surface renders through the SAME token contract as the web app.

   This file carries the DEFINITIONS only (the --rms-* root + the three self-
   hosted faces). Component styles live in styles.css and reference these tokens
   only (no hardcoded hex / font-family).

   D1 §2.1: the iOS / mobile surface uses the LIGHT neutral system (same as web).
   ========================================================================== */

/* -- §3 Faces (self-hosted, OFL) — actually loaded, never a system fallback -- */
@font-face { font-family: "Archivo";       font-style: normal; font-weight: 700; font-display: swap; src: url("/fonts/archivo-700.woff2")  format("woff2"); }
@font-face { font-family: "Archivo";       font-style: normal; font-weight: 800; font-display: swap; src: url("/fonts/archivo-800.woff2")  format("woff2"); }
@font-face { font-family: "IBM Plex Sans";  font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/plex-sans-400.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans";  font-style: normal; font-weight: 500; font-display: swap; src: url("/fonts/plex-sans-500.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans";  font-style: normal; font-weight: 600; font-display: swap; src: url("/fonts/plex-sans-600.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans";  font-style: normal; font-weight: 700; font-display: swap; src: url("/fonts/plex-sans-700.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Mono";  font-style: normal; font-weight: 500; font-display: swap; src: url("/fonts/plex-mono-500.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Mono";  font-style: normal; font-weight: 600; font-display: swap; src: url("/fonts/plex-mono-600.woff2") format("woff2"); }

:root {
  /* ---- §3 Font families ---- */
  --rms-font-display: "Archivo", system-ui, sans-serif;
  --rms-font-body: "IBM Plex Sans", system-ui, sans-serif;
  --rms-font-mono: "IBM Plex Mono", ui-monospace, monospace;

  /* ---- §2.1 Neutrals — Light system (iOS + Web) ---- */
  --rms-canvas: #F4F6F8;
  --rms-surface: #FFFFFF;
  --rms-surface-sunken: #EDF0F3;
  --rms-border: #E2E6EB;
  --rms-text: #1A2027;
  --rms-text-secondary: #5A6570;
  --rms-text-tertiary: #8A94A0;

  /* ---- §2.1 Neutrals — Dark system (Display, SCR-035) ---- */
  --rms-d-canvas: #0B0F14;
  --rms-d-tile: #141B22;
  --rms-d-tile-raised: #1C2530;
  --rms-d-grid: #2A343F;
  --rms-d-text: #F5F8FB;
  --rms-d-text-secondary: #AEBAC6;

  /* ---- §2.2 Role colors (Owner + Manager / Shift Lead / Staff) ---- */
  --rms-role-manager: #5B2E9D;
  --rms-role-manager-on: #FFFFFF;
  --rms-role-manager-tint: #EDE7F8;
  --rms-role-manager-on-tint: #4A2585;
  --rms-role-shiftlead: #0C6D76;
  --rms-role-shiftlead-on: #FFFFFF;
  --rms-role-shiftlead-tint: #DDF0F1;
  --rms-role-shiftlead-on-tint: #0A555C;
  --rms-role-staff: #2F6FB0;
  --rms-role-staff-on: #FFFFFF;
  --rms-role-staff-tint: #E4EEF8;
  --rms-role-staff-on-tint: #255A90;

  /* ---- §2.3 The 9-status urgency ramp (calm -> alarm; also sort priority) ---- */
  --rms-status-blocked: #C21B45;             --rms-status-blocked-on: #FFFFFF;
  --rms-status-overdue: #CC4B0A;             --rms-status-overdue-on: #FFFFFF;
  --rms-status-unassigned: #E0A400;          --rms-status-unassigned-on: #1A2027;
  --rms-status-pendingverification: #7E3F9E; --rms-status-pendingverification-on: #FFFFFF;
  --rms-status-inprogress: #0A73AB;          --rms-status-inprogress-on: #FFFFFF;
  --rms-status-pending: #586878;             --rms-status-pending-on: #FFFFFF;
  --rms-status-completed: #177A4B;           --rms-status-completed-on: #FFFFFF;
  --rms-status-skipped: #6E6C57;             --rms-status-skipped-on: #FFFFFF;
  --rms-status-canceled: #6B7682;            --rms-status-canceled-on: #6B7682;

  /* ---- §2.4 Escalation-level accents (0 = none, 1 = Shift Lead, 2 = Manager) ---- */
  --rms-esc-1: #E0A400;
  --rms-esc-2: #C21B45;

  /* ---- §2.5 Cash variance semantics (always sign + word, never color-alone) ---- */
  --rms-variance-over: #0E8F6E;
  --rms-variance-short: #C21B45;
  --rms-variance-balanced: #586878;

  /* ---- §2.6 Focus & interaction utility ---- */
  --rms-focus: #2563EB;
  --rms-link: #1F5FA8;
  --rms-disabled: #B7C0C9;

  /* ---- §6 Tenant accent — CHROME ONLY, quarantined from all semantics ---- */
  --rms-tenant-accent: #A63D2E;
  --rms-tenant-accent-on: #FFFFFF;

  /* ---- §4.1 Spacing scale (4px base) ---- */
  --rms-space-2: 2px;   --rms-space-4: 4px;   --rms-space-8: 8px;   --rms-space-12: 12px;
  --rms-space-16: 16px; --rms-space-24: 24px; --rms-space-32: 32px; --rms-space-48: 48px; --rms-space-64: 64px;

  /* ---- §4.2 Radius ---- */
  --rms-radius-ios: 12px;      /* iOS card / button — the mobile surface radius */
  --rms-radius-web: 8px;
  --rms-radius-chit: 6px;
  --rms-radius-tile: 4px;
  --rms-radius-avatar: 9999px;

  /* ---- structural line weights (D1 §2.3 / §2.4 / §4.3) ---- */
  --rms-border-hair: 1px;
  --rms-border-chit: 2px;
  --rms-edgebar-l1: 4px;
  --rms-edgebar-l2: 6px;

  /* ---- §4.3 Elevation ---- */
  --rms-elev-ios-card: 0 2px 8px rgba(16, 24, 32, 0.08);
  --rms-elev-web-panel: 0 1px 2px rgba(16, 24, 32, 0.05);
  --rms-elev-modal: 0 8px 24px rgba(16, 24, 32, 0.18);

  /* ---- §3.2 Web type scale (px / weight) ---- */
  --rms-web-display-size: 32px;    --rms-web-display-weight: 700;
  --rms-web-h1-size: 24px;         --rms-web-h1-weight: 700;
  --rms-web-h2-size: 20px;         --rms-web-h2-weight: 600;
  --rms-web-h3-size: 16px;         --rms-web-h3-weight: 600;
  --rms-web-body-size: 14px;       --rms-web-body-weight: 400;
  --rms-web-table-size: 13px;      --rms-web-table-weight: 400;
  --rms-web-small-size: 12px;      --rms-web-small-weight: 500;
  --rms-web-numeric-size: 14px;    --rms-web-numeric-weight: 500;
  --rms-web-numeric-lg-size: 28px; --rms-web-numeric-lg-weight: 600;

  /* ---- §3.3 Display type scale (distance) ---- */
  --rms-disp-hero-size: 72px;    --rms-disp-hero-weight: 800;
  --rms-disp-section-size: 48px; --rms-disp-section-weight: 700;
  --rms-disp-status-size: 44px;  --rms-disp-status-weight: 800;
  --rms-disp-task-size: 34px;    --rms-disp-task-weight: 700;
  --rms-disp-meta-size: 28px;    --rms-disp-meta-weight: 600;
  --rms-disp-count-size: 64px;   --rms-disp-count-weight: 700;
}