/* =====================================================================
   EXNESS REBATE INDONESIA — DESIGN TOKENS
   Single source of truth. Imported by app.css and dashboard.css.
   ===================================================================== */

:root {
  /* ── Color: Brand ─────────────────────────────────────────────────── */
  --c-navy:        #0B1F3A;
  --c-navy-2:      #17355F;
  --c-navy-light:  #1E4080;
  --c-gold:        #FFB800;
  --c-gold-2:      #FFC107;
  --c-gold-glow:   rgba(255, 184, 0, 0.22);

  /* ── Color: Neutral ───────────────────────────────────────────────── */
  --c-bg:          #F5F7FA;
  --c-surface:     #FFFFFF;
  --c-border:      #E2E8F0;
  --c-border-2:    rgba(15, 23, 42, 0.08);

  /* ── Color: Semantic ──────────────────────────────────────────────── */
  --c-success:     #16A34A;
  --c-success-bg:  rgba(22, 163, 74, 0.10);
  --c-warning:     #F59E0B;
  --c-warning-bg:  rgba(245, 158, 11, 0.12);
  --c-error:       #DC2626;
  --c-error-bg:    rgba(220, 38, 38, 0.10);
  --c-info:        #2563EB;
  --c-info-bg:     rgba(37, 99, 235, 0.10);

  /* ── Color: Text ──────────────────────────────────────────────────── */
  --c-text:        #0F172A;
  --c-text-2:      #64748B;
  --c-text-3:      #94A3B8;
  --c-text-inv:    #FFFFFF;

  /* ── Typography ───────────────────────────────────────────────────── */
  --font-sans:     'Poppins', 'Inter', system-ui, sans-serif;

  --fs-h1:         3rem;        /* 48px */
  --lh-h1:         1.15;
  --fw-h1:         700;

  --fs-h2:         2.25rem;     /* 36px */
  --lh-h2:         1.22;
  --fw-h2:         700;

  --fs-h3:         1.75rem;     /* 28px */
  --lh-h3:         1.28;
  --fw-h3:         600;

  --fs-h4:         1.375rem;    /* 22px */
  --lh-h4:         1.36;
  --fw-h4:         600;

  --fs-lg:         1.125rem;    /* 18px */
  --lh-lg:         1.65;
  --fw-lg:         400;

  --fs-body:       1rem;        /* 16px */
  --lh-body:       1.625;
  --fw-body:       400;

  --fs-sm:         0.875rem;    /* 14px */
  --lh-sm:         1.57;
  --fw-sm:         400;

  --fs-xs:         0.75rem;     /* 12px */
  --lh-xs:         1.5;
  --fw-xs:         400;

  --fw-btn:        600;

  /* ── Spacing (4px scale) ──────────────────────────────────────────── */
  --sp-1:   4px;
  --sp-2:   8px;
  --sp-3:   12px;
  --sp-4:   16px;
  --sp-5:   20px;
  --sp-6:   24px;
  --sp-7:   28px;
  --sp-8:   32px;
  --sp-10:  40px;
  --sp-12:  48px;
  --sp-16:  64px;
  --sp-18:  72px;
  --sp-24:  96px;

  /* ── Section Rhythm ───────────────────────────────────────────────── */
  --section-y:     88px;        /* desktop */
  --section-y-md:  64px;        /* tablet  */
  --section-y-sm:  48px;        /* mobile  */

  /* ── Card ─────────────────────────────────────────────────────────── */
  --card-pad:      24px;
  --card-pad-sm:   20px;
  --card-radius:   16px;
  --card-shadow:   0 1px 3px rgba(15,23,42,.06), 0 4px 16px rgba(15,23,42,.06);
  --card-shadow-h: 0 4px 8px rgba(15,23,42,.04), 0 12px 32px rgba(15,23,42,.08);

  /* ── Radius ───────────────────────────────────────────────────────── */
  --r-sm:   6px;
  --r-md:   8px;
  --r-lg:   12px;
  --r-xl:   16px;
  --r-2xl:  20px;
  --r-3xl:  24px;
  --r-pill: 999px;

  /* ── Shadow ───────────────────────────────────────────────────────── */
  --sh-xs:  0 1px 2px rgba(15,23,42,.05);
  --sh-sm:  0 1px 3px rgba(15,23,42,.06), 0 4px 12px rgba(15,23,42,.06);
  --sh-md:  0 4px 16px rgba(15,23,42,.08);
  --sh-lg:  0 8px 32px rgba(15,23,42,.10);
  --sh-xl:  0 20px 48px rgba(15,23,42,.12);

  /* ── Button ───────────────────────────────────────────────────────── */
  --btn-h:       44px;
  --btn-h-lg:    52px;
  --btn-px:      20px;
  --btn-px-lg:   28px;
  --btn-radius:  10px;
  --btn-fs:      var(--fs-sm);
  --btn-fw:      600;

  /* ── Form ─────────────────────────────────────────────────────────── */
  --input-h:       44px;
  --input-h-lg:    52px;
  --input-radius:  10px;
  --input-border:  var(--c-border);
  --input-focus:   0 0 0 3px rgba(255,184,0,.20);
  --input-focus-c: var(--c-gold);

  /* ── Layout ───────────────────────────────────────────────────────── */
  --max-w:    1220px;
  --dash-sidebar-w:  280px;

  /* ── Transition ───────────────────────────────────────────────────── */
  --t-fast:   0.15s ease;
  --t-base:   0.25s ease;
  --t-slow:   0.4s ease;
}