/* ============================================================
   הבית הישראלי · Design System (kz-ds.css)
   ------------------------------------------------------------
   שכבה אחת שמאחדת את שפת העיצוב בין דף הבית לדפים הפנימיים.
   נטענת אחרונה בכל דף, ולכן גוברת על ה-<style> המקומי מבלי
   שצריך לשכתב 190 דפים.

   טוקנים אחידים + מיפוי למחלקות שכבר קיימות בדפים
   (.hero .container .card .btn .box .back .grid-2 ...).
   © 2026 Itzik Tahori — All Rights Reserved.
   ============================================================ */

:root{
  /* --- צבע --- */
  --kz-navy:      #0B1F3A;
  --kz-navy-2:    #16335A;
  --kz-navy-soft: #1A3A5C;
  --kz-gold:      #C9A14A;
  --kz-gold-lt:   #E6C878;
  --kz-gold-dk:   #8B6914;
  --kz-cream:     #FAF7F2;
  --kz-surface:   #FFFFFF;
  --kz-surface-2: #FFFCF6;
  --kz-ink:       #1D2433;
  --kz-ink-2:     #4A5163;
  --kz-ink-3:     #8A91A0;
  --kz-line:      rgba(11,31,58,.10);
  --kz-line-gold: rgba(201,161,74,.28);
  --kz-ok:        #2E9E6B;
  --kz-warn:      #C6851B;
  --kz-err:       #C0392B;

  /* --- מרווח --- */
  --kz-1: 4px;  --kz-2: 8px;  --kz-3: 12px; --kz-4: 16px;
  --kz-5: 24px; --kz-6: 32px; --kz-7: 48px; --kz-8: 64px;

  /* --- רדיוס וצל --- */
  --kz-r-sm: 10px; --kz-r: 14px; --kz-r-lg: 20px; --kz-r-pill: 999px;
  --kz-sh-1: 0 2px 10px rgba(11,31,58,.06);
  --kz-sh-2: 0 8px 24px rgba(11,31,58,.10);
  --kz-sh-3: 0 18px 44px rgba(11,31,58,.18);

  /* --- טיפוגרפיה --- */
  --kz-font: 'Heebo', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
  --kz-font-display: 'Frank Ruhl Libre', Georgia, serif;
  --kz-h1: clamp(26px, 4.6vw, 40px);
  --kz-h2: clamp(20px, 3vw, 27px);
  --kz-h3: clamp(17px, 2.2vw, 20px);
  --kz-body: 16px;
  --kz-small: 13.5px;

  /* --- פריסה --- */
  --kz-max: 1100px;
  --kz-header-h: 58px;
}

/* ---------- בסיס ---------- */
html{ -webkit-text-size-adjust:100%; }
body{
  font-family: var(--kz-font);
  background: var(--kz-cream);
  color: var(--kz-ink);
  font-size: var(--kz-body);
  line-height: 1.7;
}
h1,h2,h3,h4{ font-family: var(--kz-font); line-height:1.3; }
a{ color: var(--kz-navy); }
img{ max-width:100%; height:auto; }

/* פוקוס נראה — נגישות */
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible{
  outline: 3px solid var(--kz-gold);
  outline-offset: 2px;
  border-radius: 6px;
}

/* ---------- Hero אחיד ---------- */
.hero{
  background: linear-gradient(135deg, var(--kz-navy) 0%, var(--kz-navy-soft) 100%);
  color:#fff;
  padding: clamp(34px, 6vw, 54px) var(--kz-4);
  text-align:center;
}
.hero h1{
  font-size: var(--kz-h1);
  color: var(--kz-gold);
  font-weight:900;
  margin:0 0 var(--kz-3);
  letter-spacing:-.01em;
}
.hero p{
  font-size: clamp(14px, 2.2vw, 17px);
  opacity:.92;
  max-width: 720px;
  margin:0 auto;
}

/* ---------- מכל ---------- */
.container, .wrap, .page{
  max-width: var(--kz-max);
  margin-inline:auto;
  padding: var(--kz-5) var(--kz-4);
}

/* ---------- כרטיס ---------- */
.card{
  background: var(--kz-surface);
  border: 1px solid var(--kz-line);
  border-radius: var(--kz-r-lg);
  padding: var(--kz-5);
  margin-bottom: var(--kz-5);
  box-shadow: var(--kz-sh-1);
}
.card h2{
  color: var(--kz-navy);
  font-size: var(--kz-h2);
  font-weight:800;
  margin:0 0 var(--kz-3);
  padding-bottom: var(--kz-2);
  border-bottom: 2px solid var(--kz-gold);
}
.card h3{ color: var(--kz-gold-dk); font-size: var(--kz-h3); margin: var(--kz-4) 0 var(--kz-2); }
.card p{ color: var(--kz-ink-2); margin-bottom: var(--kz-3); }

/* ---------- כפתורים ---------- */
.btn, .button, button.primary{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  background: linear-gradient(135deg, var(--kz-gold), var(--kz-gold-dk));
  color:#fff; border:0;
  padding: 13px 26px;
  border-radius: var(--kz-r);
  font-family: inherit; font-weight:700; font-size:16px;
  cursor:pointer;
  min-height:46px;
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.btn:hover, .button:hover{ transform: translateY(-1px); box-shadow: var(--kz-sh-2); filter:brightness(1.04); }
.btn:active, .button:active{ transform:none; }
.btn[disabled], .button[disabled]{ opacity:.55; cursor:not-allowed; transform:none; }
.btn-ghost, .btn.secondary{
  background:transparent; color: var(--kz-navy);
  border:1.5px solid var(--kz-line-gold);
}

/* ---------- טפסים ---------- */
input, select, textarea{
  width:100%;
  padding: 13px var(--kz-3);
  border: 1.5px solid var(--kz-line);
  border-radius: var(--kz-r-sm);
  font-family: inherit; font-size:15px;
  margin-bottom: var(--kz-3);
  background: var(--kz-surface);
  color: var(--kz-ink);
  min-height:46px;
}
input:focus, select:focus, textarea:focus{ border-color: var(--kz-gold); }

/* ---------- אלמנטים נפוצים בדפים פנימיים ---------- */
.result-box{
  background: linear-gradient(135deg,#FFF8E7,#FAF3DC);
  padding: var(--kz-5);
  border-radius: var(--kz-r);
  border-inline-start: 5px solid var(--kz-gold);
  margin: var(--kz-3) 0;
  line-height:1.9;
}
.box{ background: var(--kz-surface-2); border:1px solid var(--kz-line); padding: var(--kz-4); border-radius: var(--kz-r-sm); }
.box-num{ font-size:28px; font-weight:900; color: var(--kz-gold); }
.box-label{ font-size: var(--kz-small); color: var(--kz-ink-3); }
.grid-2{ display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap: var(--kz-3); }
ul{ padding-inline-start:22px; line-height:1.9; }
li{ margin-bottom:6px; color: var(--kz-ink-2); }

/* כפתור "חזור" מקומי — מוסתר, ה-shell מספק אחד קבוע */
.back{
  display:inline-flex; align-items:center; gap:6px;
  margin: var(--kz-4) 0;
  color: var(--kz-navy); text-decoration:none; font-weight:700;
}
body.kz-has-shell .back{ display:none; }

/* ---------- ה-shell האחיד ----------
   רק ה-<header> — לא <main class="kz-shell"> של עמודי התוכן (kz.css),
   שאחרת הופך לשורת flex בגובה 56px וכל העמוד נמעך לעמודות. */
header.kz-shell{
  box-sizing:border-box; width:100%; max-width:100%; overflow:hidden; flex:0 0 auto;
  position:sticky; top:0; z-index:1000;
  display:flex; align-items:center; gap:var(--kz-2);
  height: var(--kz-header-h);
  padding: 0 var(--kz-3);
  padding-top: env(safe-area-inset-top);
  background: rgba(11,31,58,.94);
  backdrop-filter: saturate(180%) blur(12px);
  -webkit-backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid rgba(230,200,120,.22);
  color:#fff;
}
header.kz-shell a, header.kz-shell button{ color:#fff; }
.kz-shell-back{
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; flex:0 0 auto;
  background: rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.14);
  border-radius: var(--kz-r-pill);
  font-size:18px; cursor:pointer;
}
.kz-shell-back:hover{ background: rgba(255,255,255,.18); }
.kz-shell-brand{
  display:flex; align-items:center; gap:8px;
  font-weight:800; font-size:15px; text-decoration:none;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.kz-shell-brand .kz-shell-mark{ color: var(--kz-gold-lt); font-size:18px; }
.kz-shell-title{
  min-width:0; flex:1 1 auto;
  flex:1 1 auto; min-width:0;
  font-size:14px; font-weight:600; opacity:.85;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  text-align:center;
}
.kz-shell-spacer{ margin-inline-start:auto; }
@media (max-width:520px){
  .kz-shell-title{ display:none; }
  .kz-shell-brand{ font-size:14px; }
}

/* ---------- פוטר אחיד ---------- */
.kz-shell-footer{
  margin-top: var(--kz-7);
  padding: var(--kz-5) var(--kz-4);
  background: var(--kz-navy);
  color: rgba(255,255,255,.7);
  text-align:center;
  font-size: var(--kz-small);
}
.kz-shell-footer a{ color: var(--kz-gold-lt); text-decoration:none; margin:0 8px; }
.kz-shell-footer a:hover{ text-decoration:underline; }

/* ---------- העדפות מערכת ---------- */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration:.001ms !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
}
@media print{
  header.kz-shell, .kz-shell-footer, #kzp-pill, .kz-user-pill{ display:none !important; }
  body{ background:#fff; }
}

/* ============================================================
   מדף האלמנטים הצפים (Float Stack)
   ------------------------------------------------------------
   לפני: 4 משגרים צפים (בוט חכם, AI צ'אט, מדריך) ישבו כמעט
   באותה נקודה בפינה התחתונה, וגלולת המשתמש הפכה במובייל לפס
   ברוחב מלא שכיסה את כולם ואת כפתורי הפעולה בדף.
   אחרי: כל אחד מקבל מדף קבוע משלו בעמודה אחת, ותוכן הדף
   מקבל ריפוד תחתון כך ששום כפתור לא נחבא מאחורי פס צף.
   ============================================================ */
:root{
  --kz-dock:      24px;   /* גובה הבסיס של העמודה הצפה */
  --kz-dock-gap:  62px;   /* מרווח בין מדף למדף */
  --kz-dock-safe: 0px;    /* מקום שמור לפס התחתון במובייל */
}

/* עמודה אחת, מדף לכל משגר — אין יותר חפיפה */
/* הבוט הישן (kz-bot-fab) הוסתר — מירב מקבלת את המקום הראשי הנגיש ביותר */
.kz-aic-fab,
#kzAiLauncher          { bottom: calc(var(--kz-dock) + var(--kz-dock-safe)) !important; }
#kzGuideLauncher,
#kzrFab                { bottom: calc(var(--kz-dock) + var(--kz-dock-safe) + var(--kz-dock-gap) + 10px) !important; left: 16px !important; }
#kzrPanel              { bottom: calc(var(--kz-dock) + var(--kz-dock-safe) + var(--kz-dock-gap) + 72px) !important; }
#kzGuideRoot .kz-guide-dock { bottom: calc(var(--kz-dock) + var(--kz-dock-safe) + var(--kz-dock-gap)*2) !important; }

/* חלונות שנפתחים מהמשגרים — מעל המדף שלהם */
.kz-bot-window         { bottom: calc(var(--kz-dock) + var(--kz-dock-safe) + 76px) !important; }
.kz-aic-panel          { bottom: calc(var(--kz-dock) + var(--kz-dock-safe) + 76px) !important; }

/* חיווי הפעילות — פינה נגדית, לא מתחרה במשגרים */
#kzp-pill              { bottom: calc(var(--kz-dock) + var(--kz-dock-safe)) !important; }

@media (max-width:640px){
  :root{
    --kz-dock: 16px;
    --kz-dock-gap: 56px;
    --kz-dock-safe: 66px;   /* מפנה מקום לפס המשתמש התחתון */
  }
  /* ===== המזח הצף בטלפון (v5.14.8) — כל כפתור צף במקום קבוע, שום דבר לא מכסה שום דבר =====
     ימין למטה, מלמטה למעלה: מפה (18) → משתמש (72) → התקנת אפליקציה (126)
     שמאל למטה, מלמטה למעלה: סיור 🎬 (18, רק בדף הבית) → מירב (82) → רדיו (148)             */
  .kz-global-map-link{ right:12px !important; left:auto !important; inset-inline-start:auto !important; bottom:calc(18px + env(safe-area-inset-bottom)) !important; }
  .kz-user-pill{
    padding:6px 10px !important; min-height:40px;
    bottom: calc(72px + env(safe-area-inset-bottom)) !important;
    left: auto !important; right: 12px !important; max-width: min(56vw, 240px) !important; font-size:12.5px !important;
  }
  .kz-inst-pill{ bottom: calc(126px + env(safe-area-inset-bottom)) !important; left: auto !important; right: 12px !important; transform: none !important; max-width: min(58vw, 270px); }
  .kz-inst-x{ bottom: calc(160px + env(safe-area-inset-bottom)) !important; left: auto !important; right: 6px !important; }
  .kzsim-replay{ inset-inline-start:auto !important; left:14px !important; right:auto !important; bottom:calc(18px + env(safe-area-inset-bottom)) !important; padding:8px 13px !important; font-size:12.5px !important; }
  body:not(.kz-is-home) .kzsim-replay{ display:none !important; }
  /* הצעת ההתקנה בטלפון — רק בדף הבית, לא מעל כל עמוד */
  body:not(.kz-is-home) .kz-inst-pill, body:not(.kz-is-home) .kz-inst-x{ display:none !important; }
  .kz-phone-fab{ right:12px !important; bottom:calc(18px + env(safe-area-inset-bottom)) !important; }
  .kz-user-pill .kz-user-sub{ display:none !important; }
  /* התוכן מפסיק להסתתר מתחת לפס הצף */
  body{ padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
  /* בועת הסיור לא נוחתת על כפתורים */
  .kz-tour-bubble{ bottom: calc(var(--kz-dock) + var(--kz-dock-safe) + 8px) !important; }
}
}

/* כשהמשתמש סגר את חיווי הפעילות — לא שומרים לו מקום */
body.kz-pulse-closed{ --kz-dock-safe: 0px; }
