/* ==========================================================================
   tokens.css — Sapir Sabag · Students Platform
   Design tokens: colors, typography, spacing, radii, shadows, transitions.
   Copied and adapted from the subscription platform (same brand).
   ========================================================================== */

/* --------------------------------------------------------------------------
   @font-face — Choco הוסר (בעיית זכויות יוצרים).
   v30: כותרות = Noto Sans Hebrew 600/700 (נטען מ-Google Fonts בכל layout).
   -------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------
   Root tokens
   -------------------------------------------------------------------------- */
:root {
  /* המוצר מעוצב במפורש בהיר (קרם חם). ההצהרה הזו מבטלת את "מצב כהה אוטומטי"
     של דפדפני אנדרואיד / Samsung Internet / Chrome WebView, שאחרת היו הופכים
     אלגוריתמית את הרקע לכהה - ולכן הלוגו (#303030) והטקסט נבלעו אצל לקוחה
     שנכנסה מהלינק באינסטגרם (אורי, 24.7.26). מקור-אמת יחיד לכל העמודים. */
  color-scheme: light;

  /* Typography — v30: Noto Sans Hebrew לכל המוצר. Choco הוסר. */
  --font-head: 'Noto Sans Hebrew', 'Assistant', system-ui, Arial, sans-serif;
  --font-body: 'Noto Sans Hebrew', 'Assistant', system-ui, Arial, sans-serif;

  /* Core brand */
  --accent:        #67482f;
  --accent-mid:    #7d5a3c;
  --accent-dark:   #4a3422;

  /* Surfaces */
  --cream:         #fbf7f7;
  --bg-warm:       #f3e8db;
  --paper:         #ffffff;
  --surface:       #faf7f5;
  --accent-pale:   #f3e8db;
  /* יחס תמונה אחיד לכל תמונות התוכן בפרונט (פוסט/הכשרה/כרטיס/תמונה ממוזערת) */
  --img-ratio:     16 / 9;
  --soft:          #e8dbdc;
  --mauve:         #c3aebe;

  /* Text */
  --ink:           #2c2420;
  --ink-head:      #4a3422;
  --muted:         #776b5f;
  --on-accent:     #fbf7f7;
  --on-dark:       #e9dccf;

  /* Lines */
  --line:          #ecdfe0;
  --border:        #e0d0d2;

  /* Decorative */
  --accent-gold:   #b08968;
  --accent-lavender: #80687A;
  --rare:          #d6ca30;

  /* Status */
  --status-work-bg:   #f0e9e5;
  --status-work-text: #8a7c70;
  --error-bg:      #fdf0ef;
  --error-border:  #d9877a;
  --error-text:    #7a2e26;

  /* Admin status */
  --status-working-bg:    #fef3e8;
  --status-working-text:  #a8643b;
  --status-working-dot:   #d4944a;
  --status-ready-bg:      #e8f0e6;
  --status-ready-text:    #4f7050;
  --status-ready-dot:     #6b8e5a;
  --status-error-bg:      #fceee9;
  --status-error-text:    #a64e3b;
  --status-error-dot:     #c46b56;

  /* Spacing */
  --sp-1:  4px;
  --sp-2:  8px;
  --sp-3:  12px;
  --sp-4:  16px;
  --sp-5:  24px;
  --sp-6:  32px;
  --sp-7:  48px;
  --sp-8:  64px;
  --sp-9:  96px;

  /* מרווח תחתית התוכן בעמודי app-shell (בית מחובר + עמודי סטודנטית).
     הנאבר התחתון הצף תופס 86px מהתחתית (bottom 14px + capsule 72px, נמדד חי),
     ועוד 32px מרווח נראה קבוע מעל הרכיב האחרון. משתנה אחד = מרווח אחיד
     ומדויק בכל המשטחים. */
  --shell-content-bottom: calc(86px + 32px + env(safe-area-inset-bottom, 0px));

  /* Radii */
  --radius-sm:  6px;
  --radius:    12px;
  --radius-lg: 18px;
  --radius-xl: 24px;
  /* כפתורים = גלולה מלאה (הוראת גיא 23.7.26) - שפה אחת עם הצ'יפים והגלולות */
  --radius-btn: 999px;

  /* Shadows */
  --shadow-sm:    0 1px 3px rgba(61,44,30,.08);
  --shadow-md:    0 4px 16px rgba(61,44,30,.10);
  --shadow-lg:    0 12px 40px rgba(61,44,30,.14);
  --shadow-modal: 0 20px 60px rgba(40,25,20,.22);

  /* Line heights */
  --lh-tight:   1.25;
  --lh-display: 1.35;
  --lh-base:    1.58;

  /* Transitions */
  --t-fast: 0.12s ease;
  --t-base: 0.22s ease;
  --t-slow: 0.38s ease;

  /* Type scale */
  --text-xs:   clamp(12px, 1vw, 12px);
  --text-sm:   clamp(13px, 1.2vw, 14px);
  --text-base: clamp(15px, 1.4vw, 16px);
  --text-md:   clamp(16px, 1.6vw, 17px);
  --text-lg:   clamp(18px, 1.9vw, 21px);
  --text-xl:   clamp(20px, 2.2vw, 24px);
  --h3:        clamp(19px, 2.1vw, 24px);
  --h2:        clamp(28px, 3.5vw, 42px);
  --h1:        clamp(36px, 5vw, 60px);

  /* --------------------------------------------------------------------------
     Semantic typography tokens — v34
     היררכיה אחידה בכל שלוש החוויות (ציבורי / סטודנטיות / אדמין).
     שינוי כאן = שינוי בכל המוצר. אל תשנה ערכים בודדים ב-CSS ספציפי.
     --------------------------------------------------------------------------
     Level 1 — ברכה אישית (הגדולה ביותר בעמוד)
       student: .welcome-compact .wc-greeting/.wc-name
       public:  .pub-greeting-text
       admin:   .dash-greeting h1
  */
  --fs-greeting:        var(--h2);
  --fw-greeting:        300;
  --c-greeting:         var(--ink-head);
  --lh-greeting:        var(--lh-tight);

  /* Level 2 — כותרת סקשן (מדרגה מתחת לברכה — עדינה, muted)
       student: .section-title
       public:  .pub-section-title (app context: /c/ cohort portal)
       admin:   .admin-section-title
     מקור אמת: --text-xl / 500 / muted
  */
  --fs-section-title:   var(--text-xl);
  --fw-section-title:   600;
  --c-section-title:    var(--ink-head);

  /* Level 3 — כותרת כרטיס / תת-סקשן
       student: .profile-card-title, .training-card-type
       admin:   כותרות פאנל
     מקור אמת: --text-lg / 400 / ink-head
  */
  --fs-card-title:      var(--text-lg);
  --fw-card-title:      400;
  --c-card-title:       var(--ink-head);

  /* Level 4 — כותרת כרטיס קטן (בלוג, כלים)
       student: .blog-card-title, .tool-card-title
     מקור אמת: --text-base / 600 / ink-head
  */
  --fs-card-title-sm:   var(--text-base);
  --fw-card-title-sm:   600;

  /* Level 5 — גוף רגיל: --text-base / 400 / ink (מוגדר ב-body) */
  /* Level 6 — מטא/תווית: --text-xs / 500 / muted */

  /* Layout */
  --wrap-max: 1180px;
  --wrap-pad: clamp(16px, 4vw, 48px);

  /* Admin sidebar width */
  --sidebar-w: 220px;
}