/* ============================================================
   Taqyeem (تقييم) / VendorTrue — Design Tokens
   Swiss-style, high-density enterprise trust network.
   ============================================================ */

:root {
  /* ---- Core surface palette (Deep Slate Dark) ---- */
  --bg-base:        #0B0F19;
  --bg-elevated:    #0F1525;
  --bg-card:        #0E1422;
  --bg-card-hover:  #131B2E;
  --bg-inset:       #080B12;

  /* ---- Geometric border lines ---- */
  --border:         #1E293B;
  --border-strong:  #2A3A52;
  --border-faint:   #161F30;

  /* ---- Trust state accents ---- */
  --emerald:        #10B981;   /* verified / trusted / on-time */
  --emerald-dim:    #0E7C5B;
  --emerald-soft:   rgba(16, 185, 129, 0.12);
  --amber:          #F59E0B;   /* slight delay / caution */
  --amber-dim:      #B97608;
  --amber-soft:     rgba(245, 158, 11, 0.12);
  --red:            #EF4444;   /* fraud intercept / critical */
  --red-soft:       rgba(239, 68, 68, 0.12);
  --blue:           #3B82F6;   /* informational / national ops */
  --blue-soft:      rgba(59, 130, 246, 0.12);

  /* ---- Typography colors ---- */
  --text-primary:   #F1F5F9;
  --text-strong:    #FFFFFF;
  --text-body:      #94A3B8;   /* crisp slate gray supporting text */
  --text-muted:     #64748B;
  --text-faint:     #475569;

  /* ---- Typography families ---- */
  --font-head: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-body: 'Lato', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-num:  'Lato', 'SF Mono', 'Roboto Mono', ui-monospace, monospace;
  --font-ar:   'Tajawal', 'Poppins', 'Segoe UI', sans-serif;

  /* ---- Type scale ---- */
  --fs-display: 30px;
  --fs-h1: 22px;
  --fs-h2: 17px;
  --fs-h3: 14px;
  --fs-body: 13px;
  --fs-sm: 12px;
  --fs-xs: 11px;
  --fs-micro: 10px;

  /* ---- Spacing (4px base grid) ---- */
  --s1: 4px;  --s2: 8px;  --s3: 12px; --s4: 16px;
  --s5: 20px; --s6: 24px; --s8: 32px; --s10: 40px; --s12: 48px;

  /* ---- Radii (geometric, restrained) ---- */
  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 12px;
  --r-pill: 999px;

  /* ---- Elevation (no soft glows, crisp only) ---- */
  --shadow-card: 0 1px 0 rgba(255,255,255,0.02), 0 0 0 1px var(--border);
  --shadow-pop:  0 12px 32px -8px rgba(0,0,0,0.7);

  /* ---- Motion ---- */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --dur: 180ms;

  /* ---- Layout ---- */
  --rail-w: 244px;
  --header-h: 64px;
  --phone-w: 390px;
  --phone-h: 820px;
}

/* RTL switches default font to an Arabic-optimized stack */
[dir="rtl"] {
  --font-head: 'Tajawal', 'Poppins', sans-serif;
  --font-body: 'Tajawal', 'Lato', sans-serif;
}