/* ynet Design System tokens — pulled from Figma file xC3dY1A0YK88g9pIbKQaqP on 2026-09-06.
   Provenance per value: ~/.claude/skills/ynet-design-system/reference/tokens.md
   Layers: 1) brand primitives  2) semantic (as named in Figma)  3) app semantic — edit only layer 3 per project. */

:root {
  /* ── 1. Brand primitives ─────────────────────────────────────── */
  --ynet-red-500: #de1a1a;        /* Color/Red Brand/Red 500 — primary brand red */
  --ynet-red-50: #f8d1d1;         /* Color/Red Brand/Red 50 — weak red bg */
  --ynet-red-hover: #df3232;      /* Buttons/Primary/red-btn-bg (hover/selected variant seen in Selectors) */
  --ynet-red-channels: #b4010b;   /* Section Headers/Header-bg-Channels */
  --ynet-blue: #1417ac;           /* Buttons/Primary+Secondary/blue, Borders/Divider - Blue, Section Headers/Header-bg-Blue */
  --ynet-blue-100: #bebffb;       /* Color/Blue Shades/Blue 100 — weak blue bg */
  --ynet-blue-success: #2162d0;   /* sampled from "Success - Blue" check icon (hardcoded fill) */
  --ynet-green-live: #1fda8c;     /* sampled from "Green Dot" (live indicator; ≈ Color/Accent/Green) */
  --ynet-black: #000000;          /* ynet Brand/black */
  --ynet-white: #ffffff;          /* Color/Greysacle/White */
  --ynet-900: #1e1e1e;            /* Section Headers/Header-bg-900, dark Screen surface */
  --ynet-black-75: #000000bf;     /* Buttons/Primary/black-btn-bg 75% */
  --ynet-black-30: #0000004d;     /* Color/Transparent/Black 30% */

  /* ── 2. Semantic tokens (Figma names) ────────────────────────── */
  --text-primary: #000000;        /* Text/Text-Primary */
  --text-caption: #78787b;        /* Text/Text-Caption */
  --text-disabled: #999999;       /* Text/Text-disabled */
  --text-error: #de1a1a;          /* Text/Text-error */

  --surface-screen: #ffffff;      /* Surfaces/Screen (white) — dark mode value: #1e1e1e */
  --surface-card: #f5f5f5;        /* Surfaces/Cards-Fields */
  --surface-tag: #efefef;         /* Surfaces/Tags */

  --divider: #efefef;             /* Borders/Divider-default */
  --divider-pale: #c5c5c5;        /* Borders/Divider-pale */
  --divider-red: #de1a1a;         /* Borders/Divider - Red (active tab underline) */
  --divider-blue: #1417ac;        /* Borders/Divider - Blue */
  --divider-black: #000000;       /* Borders/Divider - Black */

  --icon: #000000;                /* Icons/black (inverse on dark: #ffffff) */
  --icon-muted: #78787b;          /* Icons/colorless */
  --icon-red: #de1a1a;            /* Icons/red */

  --btn-primary-red-bg: #de1a1a;      --btn-primary-red-fg: #ffffff;
  --btn-primary-blue-bg: #1417ac;     --btn-primary-blue-fg: #ffffff;
  --btn-primary-black-bg: #000000;    --btn-primary-black-fg: #ffffff;
  --btn-secondary-red: #de1a1a;       /* border + text, transparent bg */
  --btn-secondary-blue: #1417ac;
  --btn-secondary-black: #000000;
  --btn-tertiary-red: #de1a1a;  --btn-tertiary-blue: #1417ac;  --btn-tertiary-black: #000000;
  --btn-disabled-bg: #d8d8d8;         --btn-disabled-fg: #78787b;   /* Buttons/Primary/Disabled-* */
  --btn-secondary-disabled: #999999;  /* Buttons/Secondary/disabled-* + Tertiary/disabled */

  --section-header-red: #de1a1a;  --section-header-blue: #1417ac;  --section-header-black: #000000;
  --section-header-fg: #ffffff;

  /* Typography — Font-family/Moses text = "Moses text 1.03"; text styles are "MosesText_Inter" */
  --font-ynet: "Moses text", "MosesText_Inter", Inter, Arial, sans-serif;
  --fs-caption: 12px; --lh-caption: 16px;   /* Desktop/Caption/12 Reg */
  --fs-body: 14px;    --lh-body: 23px;      /* Desktop/Body/14 Reg */
  --fs-body-lg: 16px; --lh-body-lg: 24px;   /* Desktop/Body/16 Reg, Desktop/Titles/16 Med (weight 500) */
  --fw-regular: 400; --fw-medium: 500; --fw-bold: 700;

  /* Spacing — Sizes/Spacing & Padding */
  --sp-0: 0; --sp-half: 2px; --sp-1: 5px; --sp-2: 10px; --sp-3: 15px; --sp-4: 20px;

  /* Radius — Sizes/Radius */
  --r-0: 0; --r-4: 4px; --r-round: 999px;

  /* ── 3. App semantic layer — my-city-knesset ─────────────────── */
  /* Political blocs. Red = DS token "red-btn-bg" (#df3232, the brief's red).
     The brief asked for blue #0361FC and gray #696C75, which are NOT ynet DS tokens;
     we use the DS blue and caption gray instead (docs/decisions.md #7). */
  --bloc-netanyahu: var(--ynet-red-hover);   /* #df3232 */
  --bloc-change:    var(--ynet-blue);        /* #1417ac */
  --bloc-other:     var(--text-caption);     /* #78787b */
  --bar-track:      var(--surface-tag);      /* #efefef */

  /* Display size for the widget title: the DS scale pulled so far tops out at 16px. */
  --fs-display: 26px; --lh-display: 32px;   /* UNVERIFIED: not a pulled DS text style */
  --fs-stat: 22px;    --lh-stat: 28px;      /* UNVERIFIED: not a pulled DS text style */
}