/* ============================================================
   GreenLeaze design tokens  (ported from the claude.ai/design
   "greenleaze-design-system" project) + the Pixmania white-label
   accent layer.

   White-label model: everything brand-tintable is expressed through
   three CSS custom properties set on the app root — --accent,
   --accent-dark, --accent-mint — which the server injects per merchant
   (see src/shared/theme.ts). The neutral grays below are constant.
   ============================================================ */

/* ---------- Figtree (self-hosted variable font, GDPR-safe) ---------- */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-display: swap;
  font-weight: 300 900;
  src: url('/assets/fonts/figtree-variable.woff2') format('woff2-variations');
}

:root {
  /* ---------- Brand greens (GreenLeaze) ---------- */
  --green-50:  #EAF4EF;
  --green-100: #D2E6E0;
  --green-400: #2FA45A;
  --green-500: #0D5537;   /* GreenLeaze green — brand core */
  --green-600: #0A4A30;
  --green-700: #003E29;   /* deep evergreen */

  /* ---------- Neutrals (warm gray) — used across the payment UI ---------- */
  --white:     #FFFFFF;
  --ink:       #14181c;   /* near-black headings / body */
  --text-body: #191919;
  --text-muted:   #7a7d82;
  --text-subtle:  #9a9da2;
  --text-soft:    #6c6f74;
  --surface-page:   #ffffff;
  --surface-sunken: #f5f6f7;
  --surface-tile:   #f2f3f5;
  --border-hair:    #ececec;
  --border-field:   #e2e3e5;

  /* ---------- Type ---------- */
  --font-sans: 'Figtree', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;

  /* ---------- Radius ---------- */
  --radius-field: 14px;
  --radius-card: 16px;
  --radius-panel: 18px;
  --radius-pill: 999px;

  /* ---------- Shadow ---------- */
  --shadow-card: 0 1px 3px rgba(0, 0, 0, 0.09);
  --shadow-pop: 0 4px 14px -8px rgba(0, 0, 0, 0.25);

  /* ---------- Accent (white-label) — GreenLeaze green default.
       Overridden inline per merchant by the server. ---------- */
  --accent: #0D5537;
  --accent-dark: #003E29;
  --accent-mint: #E7F2F1;
}
