/* ============================================================
   Mindset AI - Design Tokens (מערכת עיצוב משותפת)
   ============================================================
   קובץ מקור יחיד למשתני העיצוב של כל הפרויקטים.
   שינוי במשתנה כאן = משפיע על כל ה-22 הדפים והפורטל.
   ------------------------------------------------------------
   פלטת מותג: ערכת Mindset AI Systems הסופית (מאושרת 03/06/2026).
   אינדיגו/סגול/לבנדר על רקע כהה-חמים. פונטים: Heebo + Sora.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Heebo:wght@300;400;500;600;700;800&family=Sora:wght@300;400;500;600;700;800&display=swap');

:root {
  /* ----- 6 צבעי המותג הסופיים (פלטת Mindset AI) ----- */
  --ms-indigo:    #4A3B7A;  /* אינדיגו עמוק - אקצנט/כפתורים */
  --ms-purple:    #896EC0;  /* סגול לבנדר - ראשי */
  --ms-night:     #202239;  /* כחול לילה */
  --ms-dark:      #25232B;  /* כהה */
  --ms-dark-2:    #343043;  /* כהה-סגלגל */
  --ms-lavender:  #B4A8E4;  /* לבנדר בהיר */
  --ms-white:     #FFFFFF;
  --ms-bg-deep:   #24231F;  /* אפור-חום עמוק - רקע ראשי */

  /* ----- צבעי המותג (שמות תאימות - ממופים לפלטה החדשה) ----- */
  --color-night-blue:   #202239;  /* כחול לילה */
  --color-deep-blue:    #25232B;  /* כהה */
  --color-dark-blue:    #343043;  /* כהה-סגלגל */
  --color-gold:         #896EC0;  /* אקצנט ראשי - סגול לבנדר */
  --color-light-gold:   #B4A8E4;  /* אקצנט בהיר - לבנדר */
  --color-amber:        #B4A8E4;  /* הדגשה - לבנדר */

  /* ----- צבעי משטחים (Surface Tones) ----- */
  --surface-0: #1C1B25;  /* רקע עמוק ביותר */
  --surface-1: #24231F;  /* רקע ראשי */
  --surface-2: #25232B;  /* רקע שני */
  --surface-3: #343043;  /* רקע שלישי */
  --surface-elevated: #25232B;  /* כרטיסים */
  --surface-hover:    #343043;  /* רחיפה */

  /* ----- צבעי גבול (Borders) ----- */
  --border-subtle:   rgba(180, 168, 228, 0.16);
  --border-strong:   rgba(180, 168, 228, 0.34);
  --divider:         rgba(255, 255, 255, 0.08);

  /* ----- צבעי טקסט ----- */
  --text-primary:    #FFFFFF;  /* ראשי */
  --text-secondary:  #B4A8E4;  /* משני - לבנדר */
  --text-tertiary:   #8B82A8;  /* שלישוני - לבנדר עמום */
  --text-on-gold:    #FFFFFF;  /* על רקע אקצנט */

  /* ----- צבעי סטטוס ----- */
  --status-info:      #6E8BD0;
  --status-success:   #4FC18B;
  --status-warning:   #E0A93B;
  --status-error:     #E66B6B;
  --status-neutral:   #8B82A8;

  /* ----- גרדיאנט מותג ----- */
  --ms-gradient: linear-gradient(135deg, #4A3B7A 0%, #896EC0 55%, #B4A8E4 100%);

  /* ----- טיפוגרפיה ----- */
  --font-he:    'Heebo', 'Assistant', 'Segoe UI', system-ui, sans-serif;  /* עברית */
  --font-en:    'Sora', 'Raleway', 'Inter', sans-serif;                   /* אנגלית/לטיני */
  --font-ar:    'Cairo', 'Arial', sans-serif;                             /* ערבית */
  --font-ru:    'PT Sans', 'Arial', sans-serif;                           /* רוסית */
  --font-mono:  'JetBrains Mono', 'Consolas', monospace;                  /* קוד */

  /* ----- גדלי טקסט (Type Scale) ----- */
  --text-xs:   12px;
  --text-sm:   14px;
  --text-base: 16px;
  --text-lg:   18px;
  --text-xl:   20px;
  --text-2xl:  24px;
  --text-3xl:  30px;
  --text-4xl:  36px;
  --text-5xl:  48px;
  --text-6xl:  60px;
  --text-7xl:  72px;

  /* ----- משקלי גופן ----- */
  --weight-light:     300;
  --weight-regular:   400;
  --weight-medium:    500;
  --weight-semibold:  600;
  --weight-bold:      700;
  --weight-extrabold: 800;

  /* ----- ריווח (Spacing Scale - 4px base) ----- */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  24px;
  --space-6:  32px;
  --space-7:  48px;
  --space-8:  64px;
  --space-9:  96px;
  --space-10: 128px;

  /* ----- רדיוס פינות ----- */
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   16px;
  --radius-xl:   24px;
  --radius-full: 9999px;

  /* ----- צללים ----- */
  --shadow-sm:    0 1px 3px rgba(0, 0, 0, 0.4);
  --shadow-md:    0 4px 12px rgba(0, 0, 0, 0.45);
  --shadow-lg:    0 12px 32px rgba(0, 0, 0, 0.5);
  --shadow-xl:    0 24px 48px rgba(0, 0, 0, 0.55);
  --shadow-glow:  0 0 0 1px rgba(137, 110, 192, 0.4), 0 0 32px rgba(137, 110, 192, 0.14);

  /* ----- אנימציות ----- */
  --ease-out:   cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:    cubic-bezier(0.7, 0, 0.84, 0);
  --ease-inout: cubic-bezier(0.65, 0, 0.35, 1);

  --duration-fast:    150ms;
  --duration-base:    250ms;
  --duration-slow:    400ms;
  --duration-slower:  600ms;

  /* ----- שכבות (Z-index) ----- */
  --z-base:     1;
  --z-dropdown: 100;
  --z-sticky:   200;
  --z-overlay:  300;
  --z-modal:    400;
  --z-toast:    500;

  /* ----- רוחב עליון של תוכן ----- */
  --container-sm: 640px;
  --container-md: 768px;
  --container-lg: 1024px;
  --container-xl: 1280px;
  --container-2xl: 1536px;
}

/* ============================================================
   נורמליזציה גלובלית
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  padding: 0;
  background: var(--surface-1);
  color: var(--text-primary);
  font-family: var(--font-he);
  font-size: var(--text-base);
  line-height: 1.5;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ----- כיוון טקסט אוטומטי לפי שפה ----- */
html[lang="he"] { direction: rtl; font-family: var(--font-he); }
html[lang="ar"] { direction: rtl; font-family: var(--font-ar); }
html[lang="en"] { direction: ltr; font-family: var(--font-en); }
html[lang="ru"] { direction: ltr; font-family: var(--font-ru); }

/* ----- קישורים ----- */
a {
  color: var(--color-gold);
  text-decoration: none;
  transition: color var(--duration-fast) var(--ease-out);
}
a:hover { color: var(--color-light-gold); }

/* ----- כפתורים ----- */
button {
  font-family: inherit;
  cursor: pointer;
  border: none;
  background: none;
  color: inherit;
}

/* ----- פסי גלילה ----- */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--surface-1); }
::-webkit-scrollbar-thumb { background: var(--surface-3); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--color-gold); }
