/* USD/IQD — design tokens. Direction 2 (Fintech Dark), dark-first.
 * Never hardcode a value that exists here. */

:root {
  /* ---- colour · dark is the brand default ---- */
  --bg:     #0a0f0c;
  --bg2:    #0e1511;
  --card:   #121a15;
  --card2:  #16201a;
  --text:   #eaf4ee;
  --muted:  #8fa697;
  --line:   #223129;
  --accent: #3ddc97;
  --accent-dim:  #1f8f60;
  --accent-glow: rgba(61, 220, 151, .35);
  --accent-soft: rgba(61, 220, 151, .10);
  --on-accent: #06130c;
  --gold:      #e8c15a;
  --gold-glow: rgba(232, 193, 90, .35);
  --warn:      #e5b64d;
  --warn-soft: rgba(229, 182, 77, .12);
  --bad:       #e88276;
  --bad-soft:  rgba(232, 130, 118, .12);

  /* ---- type ---- */
  --font: "Noto Kufi Arabic", system-ui, "Segoe UI", Tahoma, sans-serif;

  /* ---- scale ---- */
  --step--1: 0.84rem;
  --step-0:  1rem;
  --step-1:  1.15rem;
  --step-2:  1.35rem;
  --step-3:  1.7rem;
  --step-4:  2.1rem;
  --step-hero: clamp(3.2rem, 14vw, 5.2rem);

  /* ---- space ---- */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 72px;

  /* ---- shape ---- */
  --r-card: 18px;
  --r-tile: 12px;
  --r-pill: 999px;

  /* ---- motion · confirmation, not decoration ---- */
  --dur:  180ms;
  --ease: cubic-bezier(0.25, 0.1, 0.25, 1);
}

/* Tuned light theme for users who ask for it. Marketing stays dark. */
@media (prefers-color-scheme: light) {
  :root {
    --bg:     #f4f6f3;
    --bg2:    #eef1ed;
    --card:   #ffffff;
    --card2:  #fbfcfb;
    --text:   #16211a;
    --muted:  #5f6d63;
    --line:   #e3e7e2;
    --accent: #0e7a4e;
    --accent-dim:  #0a5c3b;
    --accent-glow: rgba(14, 122, 78, .18);
    --accent-soft: rgba(14, 122, 78, .09);
    --on-accent: #ffffff;
    --gold:      #b8860b;
    --gold-glow: rgba(184, 134, 11, .20);
    --warn:      #9a6a00;
    --warn-soft: rgba(154, 106, 0, .10);
    --bad:       #a33025;
    --bad-soft:  rgba(163, 48, 37, .10);
  }
}

/* Rate figures must never change width when the number updates. */
.num, .rate, [data-rate] {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
  direction: ltr;
  unicode-bidi: embed;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}