/* Kommo Dialer v3 tokens. Locked 2026-09-15 (docs/v3-brief.md section 6, docs/DESIGN.md).
   The only file in the v3 layer allowed to contain literal colours.
   Names are prefixed (--c-, --fs-, --lh-, --fw-, --ls-, --radius-, --sp-, --t-, --ease-, --z-)
   so they never collide with the legacy variables app.css defines. */

/* ---------- Fonts (self-hosted, swap) ---------- */
@font-face { font-family: "Geist"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/Geist-Regular.woff2") format("woff2"); }
@font-face { font-family: "Geist"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/Geist-Medium.woff2") format("woff2"); }
@font-face { font-family: "Geist"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/Geist-SemiBold.woff2") format("woff2"); }
@font-face { font-family: "Geist"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/Geist-Bold.woff2") format("woff2"); }
@font-face { font-family: "Geist Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/GeistMono-Regular.woff2") format("woff2"); }
@font-face { font-family: "Geist Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/GeistMono-Medium.woff2") format("woff2"); }

:root {
  color-scheme: light;

  /* ---------- Colour ---------- */
  --c-canvas: #F6F6F4;
  --c-surface: #FFFFFF;
  --c-surface-2: #F0F0EC;

  --c-ink: #0C111D;
  --c-ink-2: #3D4553;
  --c-ink-3: #626B7A;

  --c-line: rgba(12, 17, 29, 0.08);
  --c-line-strong: rgba(12, 17, 29, 0.16);

  --c-signal: #1F4FE0;
  --c-signal-hover: #1A43BF;
  --c-signal-soft: #EBF0FD;
  --c-signal-ring: rgba(31, 79, 224, 0.35);

  --c-success: #0B6E4C;
  --c-success-soft: #E6F6EF;
  --c-success-mid: #3FA07A;   /* second step of the green ramp: a fill that must
                                 read against surface-2 without taking the full
                                 tone Gagné owns. Fills only, never text. */
  --c-warn: #B45309;            /* text only, never a button fill */
  --c-warn-soft: #FEF3E2;
  --c-danger: #B91C28;          /* hang-up, destructive, overdue */
  --c-danger-soft: #FDECEC;

  --c-on-signal: #FFFFFF;       /* text on signal / success / danger fills */
  --c-scrim: rgba(12, 17, 29, 0.48);

  /* ---------- Type ---------- */
  --font-sans: "Geist", -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: "Geist Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  --fs-display: 28px; --lh-display: 32px; --fw-display: 700; --ls-display: -0.03em;
  --fs-title: 20px;   --lh-title: 26px;   --fw-title: 700;   --ls-title: -0.02em;
  --fs-heading: 17px; --lh-heading: 22px; --fw-heading: 600; --ls-heading: 0;
  --fs-body: 16px;    --lh-body: 24px;    --fw-body: 400;    --ls-body: 0;
  --fs-caption: 13px; --lh-caption: 18px; --fw-caption: 500; --ls-caption: 0;
  --fs-micro: 11px;   --lh-micro: 14px;   --fw-micro: 600;   --ls-micro: 0.01em; /* tab labels + badges only */
  --fs-mono: 13px;    --lh-mono: 18px;    --fw-mono: 500;    --ls-mono: 0;

  /* ---------- Shape ---------- */
  --radius-chip: 10px;
  --radius-row: 14px;     /* rows, inputs, buttons */
  --radius-card: 18px;
  --radius-sheet: 24px;   /* sheet top corners */
  --radius-pill: 999px;

  /* ---------- Space (4 px base) ---------- */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px; --sp-5: 20px;
  --sp-6: 24px; --sp-8: 32px; --sp-10: 40px; --sp-12: 48px;
  --gutter: 20px;
  --section-gap: 24px;
  --row-h: 56px;
  --tap: 44px;
  --page-max: 28rem;
  --tabbar-h: 56px;

  /* ---------- Elevation (floating layers only) ---------- */
  --shadow-float: 0 12px 32px -12px rgba(12, 17, 29, 0.18);

  /* ---------- Motion ---------- */
  --ease-sheet: cubic-bezier(0.32, 0.72, 0, 1);
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-exit: cubic-bezier(0.4, 0, 1, 1);
  --t-press: 120ms;
  --t-fade: 120ms;
  --t-enter: 200ms;
  --t-sheet-in: 260ms;
  --t-sheet-out: 200ms;
  --t-stagger: 30ms;

  /* ---------- Layers ---------- */
  --z-sticky: 20;
  --z-tabbar: 30;
  --z-scrim: 90;
  --z-sheet: 91;
  --z-toast: 95;
  --z-overlay: 100;
}

/* ---------- Minimal reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  min-height: 100dvh;
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  font-weight: var(--fw-body);
  color: var(--c-ink);
  background: var(--c-canvas);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-tap-highlight-color: transparent;
}
button, input, select, textarea { font: inherit; color: inherit; letter-spacing: inherit; }
button { cursor: pointer; }
h1, h2, h3, h4, p { margin: 0; }
[x-cloak] { display: none !important; }

/* Tabular mono numerals: timers, counts, durations, phone numbers, pace. */
.num { font-family: var(--font-sans); font-variant-numeric: tabular-nums; letter-spacing: 0; }