/* ============================================================
   TRÀNG AN · THEME — single source of truth (Restyle-style)
   ------------------------------------------------------------
   One theme object for the whole ecosystem. Apps differ only by
   documented VARIANT axes (density / touch scale), never by
   redefining colors, radii, spacing or shadows.

   Layers, in the order a consumer should reach for them:
     1. PALETTE   raw branded hex + shade scales (jade/gold/state/neutral)
     2. SEMANTIC  named roles → palette  (primary, surface, text, danger…)
     3. SCALES    t-shirt spacing + radius + shadow + motion + type
     4. LEGACY    back-compat aliases (--jade-600, --r-card, --s4 …)
                  so existing component CSS keeps resolving unchanged.

   Colors keep the project's exact jade brand — Restyle is applied to
   HOW tokens are named & used, not to replace the palette.
   ============================================================ */
:root{

  /* ─── 1 · PALETTE ─────────────────────────────────────────── */
  /* Brand — jade (full shade scale; 400/500/50 added to complete it) */
  --jade-900:#0E3B32;
  --jade-800:#11473B;
  --jade-700:#155E4C;
  --jade-600:#1C7A66;
  --jade-500:#388B78;
  --jade-400:#529C8A;
  --jade-300:#7FB8A8;
  --jade-100:#E6F2EE;
  --jade-50:#F3F9F6;

  /* Accent — gold */
  --gold-700:#8A6D2C;
  --gold-500:#C8A35B;
  --gold-300:#E0C68C;

  /* State — green / amber / coral / water */
  --green-700:#177A41;
  --green-600:#1F9D55;
  --amber-700:#9A6312;
  --amber-500:#E0962A;
  --amber-400:#E8B04B;
  --amber-100:#FBEFD8;
  --coral-600:#C9302C;
  --coral-500:#D9534F;
  --water-400:#4FA3C7;
  --water-700:#2C6E89;

  /* Neutral — warm ivory / ink / stone */
  --ivory-50:#FBF9F4;
  --paper:#FFFFFF;
  --ink-900:#1A1A17;
  --ink-700:#36362F;
  --ink-600:#4A4A45;
  --stone-500:#8A8A82;
  --stone-300:#C9C7BE;
  --stone-200:#E4E2DA;
  --stone-100:#EFEDE6;
  --glass:rgba(251,249,244,.92);

  /* ─── 2 · SEMANTIC ROLES (Restyle theme keys) ─────────────── */
  --color-bg:var(--ivory-50);
  --color-surface:var(--paper);
  --color-surface-alt:var(--jade-50);
  --color-surface-sunk:var(--stone-100);

  --color-text:var(--ink-900);
  --color-text-muted:var(--ink-600);
  --color-text-faint:var(--stone-500);
  --color-text-on-brand:#FFFFFF;

  --color-hairline:var(--stone-200);

  --color-primary:var(--jade-700);          /* primary action — AA on white */
  --color-primary-strong:var(--jade-900);
  --color-primary-tint:var(--jade-100);
  --color-on-primary:#FFFFFF;

  --color-accent:var(--gold-500);
  --color-accent-ink:var(--gold-700);

  --color-success:var(--green-600);
  --color-success-ink:var(--green-700);
  --color-warning:var(--amber-500);
  --color-danger:var(--coral-600);
  --color-info:var(--water-400);
  --color-info-ink:var(--water-700);

  /* ─── 3 · SCALES ──────────────────────────────────────────── */
  /* Spacing — base 4, t-shirt sizing */
  --space-xxs:2px;
  --space-xs:4px;
  --space-s:8px;
  --space-m:12px;
  --space-l:16px;
  --space-xl:20px;
  --space-2xl:24px;
  --space-3xl:32px;
  --space-4xl:48px;

  /* Radius — unified across every app; t-shirt sizing */
  --radius-xs:6px;
  --radius-s:8px;
  --radius-m:12px;
  --radius-l:14px;     /* buttons, inputs */
  --radius-xl:16px;    /* cards */
  --radius-2xl:20px;
  --radius-3xl:24px;   /* sheets, hero cards */
  --radius-pill:999px;

  /* Elevation — one shadow ramp, jade-tinted */
  --shadow-sm:0 2px 12px rgba(14,59,50,.08);
  --shadow-md:0 8px 28px rgba(14,59,50,.12);
  --shadow-lg:0 12px 40px rgba(14,59,50,.18);
  --shadow-btn:0 6px 18px rgba(21,94,76,.26);

  /* Motion */
  --water:cubic-bezier(.22,1,.36,1);

  /* Type family — single Vietnamese-first typeface for the whole system */
  --font-sans:'Be Vietnam Pro',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  --font-serif:var(--font-sans);
  --font-mono:ui-monospace,SFMono-Regular,Menlo,monospace;

  /* ─── 4 · LEGACY ALIASES (do not author against these) ────── */
  /* spacing */
  --s1:var(--space-xs); --s2:var(--space-s); --s3:var(--space-m);
  --s4:var(--space-l); --s5:var(--space-xl); --s6:var(--space-2xl);
  --s8:var(--space-3xl); --s12:var(--space-4xl);
  /* radius — unified values regardless of which base imported us */
  --r-card:var(--radius-xl); --r-btn:var(--radius-l);
  --r-input:var(--radius-l); --r-chip:var(--radius-pill);
  /* shadow */
  --sh-card:var(--shadow-sm); --sh-card-lg:var(--shadow-md);
  --sh-btn:var(--shadow-btn); --sh-pop:var(--shadow-lg);
  /* misc */
  --hairline:var(--color-hairline);
}