/* ============================================================
   Jasell Design Tokens
   Philosophy: Confident SaaS — clean, purposeful, with warmth
   RTL-first. No dark mode (structure ready, not implemented).
   ============================================================ */

:root {

  /* ── Brand ─────────────────────────────────────────────── */
  --color-brand:         #5e17eb;
  --color-brand-dark:    #4a0fd4;
  --color-brand-soft:    #ede8fd;
  --color-brand-muted:   #c4b8e0;
  --color-accent:        #ff66c4;
  --color-accent-soft:   #fff0f9;

  /* ── Neutrals (2026-07 v2: clean light SaaS — white chrome, gray canvas) ── */
  --color-bg:            #f9fafb;
  --color-surface:       #ffffff;
  --color-surface-raised:#f9fafb;
  --color-border:        #e5e7eb;
  --color-border-strong: #d1d5db;

  /* ── Text ───────────────────────────────────────────────── */
  --color-text:          #111827;
  --color-text-secondary:#4b5563;
  --color-text-disabled: #9ca3af;
  --color-text-on-brand: #ffffff;

  /* ── Status ─────────────────────────────────────────────── */
  --color-success:       #16a34a;
  --color-success-bg:    #e0fbef;
  --color-warning:       #c07000;
  --color-warning-bg:    #fff8e0;
  --color-danger:        #e0004d;
  --color-danger-bg:     #fff0f5;
  --color-danger-border: #ffd0e6;
  --color-info:          #0369a1;
  --color-info-bg:       #e0f2fe;

  /* ── Sidebar (white chrome; brand appears only on the active item) ── */
  --color-sidebar-bg:    #ffffff;
  --color-sidebar-bg-2:  #f9fafb;
  --color-sidebar-text:  #4b5563;
  --color-sidebar-active:#f3eefe;
  --color-sidebar-border:#e5e7eb;

  /* ── Spacing ─────────────────────────────────────────────── */
  --space-1:   4px;
  --space-2:   8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-7:  28px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;

  /* ── Radius ──────────────────────────────────────────────── */
  /* Tiered scale (2026-07 makeover): tighter radii read professional.
     full is reserved for tags/avatars/dots — never buttons or cards. */
  --radius-sm:   6px;
  --radius-md:   8px;
  --radius-lg:  10px;
  --radius-xl:  12px;
  --radius-full:999px;

  /* ── Shadows (neutral, subtle; cards rely on 1px borders instead) ── */
  --shadow-sm:  0 1px 2px rgba(0,0,0,.05);
  --shadow-md:  0 4px 6px -1px rgba(0,0,0,.08);
  --shadow-lg:  0 10px 15px -3px rgba(0,0,0,.10);
  --shadow-modal:0 20px 60px rgba(0,0,0,.18);

  /* ── Typography ──────────────────────────────────────────── */
  /* Poppins renders Latin; it has no Hebrew glyphs, so Hebrew falls to Heebo */
  --font-family: 'Poppins', 'Heebo', sans-serif;
  --font-size-xs:  .68rem;
  --font-size-sm:  .78rem;
  --font-size-md:  .88rem;
  --font-size-base: 1rem;
  --font-size-lg:  1.1rem;
  --font-size-xl:  1.4rem;
  --font-size-2xl: 1.9rem;
  --font-weight-regular: 400;
  --font-weight-medium:  600;
  --font-weight-bold:    700;
  --font-weight-black:   800;

  /* ── Icon ────────────────────────────────────────────────── */
  --icon-sm:  14px;
  --icon-md:  16px;
  --icon-lg:  20px;
  --icon-stroke: 1.75;

  /* ── Layout ──────────────────────────────────────────────── */
  --sidebar-width:   240px;
  --mobile-nav-h:     60px;
  --mobile-header-h:  56px;

  /* ── Transition ──────────────────────────────────────────── */
  --transition-fast: .15s ease;
  --transition-base: .2s ease;
}