/* ============================================================
   Makook Storefront — Design Tokens
   Change these to rebrand the whole theme (per-store config).
   ============================================================ */
:root{
  /* color */
  --c-bg:#FFFFFF;
  --c-surface:#F4F5F7;
  --c-ink:#18181B;
  --c-muted:#71717A;
  --c-faint:#A1A1AA;
  --c-line:#E4E4E7;
  --c-accent:#0E7490;        /* deep teal */
  --c-accent-dark:#0C5F76;
  --c-accent-ink:#FFFFFF;
  --c-soft:#ECF7F9;          /* accent tint for icon chips / notices */
  --c-danger:#B91C1C;
  --c-success:#15803D;
  --c-whatsapp:#16A34A;

  /* type */
  --font-ui:"IBM Plex Sans Arabic","Segoe UI",system-ui,-apple-system,sans-serif;

  /* shape & rhythm */
  --radius:12px;
  --radius-s:8px;
  --radius-pill:999px;
  --container:1200px;
  --gap:16px;

  /* elevation (used sparingly) */
  --shadow-card:0 2px 10px rgba(24,24,27,.06);
  --shadow-pop:0 12px 32px -12px rgba(24,24,27,.25);
}