/* ==========================================================================
   נץ שליחויות — Header · רמה 2 (מפרט 1.3)
   var() בלבד. ערכים ב-tokens.css.
   נקודת שבירה: מתחת ל-1024px = פריסת מובייל (המבורגר + סרגל תחתון) —
   החלטת ניר 29/09 (המפרט: 768; 6 פריטים לא נכנסים בשורה אחת מתחת ל-1024).
   CSS לא מאפשר var() בתוך @media, לכן 1023px כתוב כמספר.
   ========================================================================== */

html {
  scroll-padding-top: var(--nz-scroll-padding-top);
}

/* ---------- 2.1 · מיכל דביק ---------- */
.nz-header {
  position: sticky;
  top: 0;
  z-index: var(--nz-z-header);
  background-color: var(--nz-header-bg-scrolled);
  box-shadow: var(--nz-shadow-header);
  padding-top: env(safe-area-inset-top); /* iOS במצב מסך בית (status bar שקוף) */
  font-family: var(--nz-font-body);
  transition:
    background-color var(--nz-dur-state) var(--nz-ease),
    box-shadow var(--nz-dur-state) var(--nz-ease),
    margin-bottom var(--nz-dur-state) var(--nz-ease);
}

/* מצב 1: גובה 74, אבל בזרימת העמוד ההדר תופס תמיד 62 (שוליים שליליים של 12).
   כך המעבר בין המצבים לא מזיז את התוכן — ולא נוצרת לולאת הבהוב סביב סף ה-24px
   (הכיווץ הזיז את התוכן, הדפדפן תיקן את הגלילה אל מתחת לסף, וחוזר חלילה). */
.nz-header[data-nz-state="rest"] {
  background-color: var(--nz-header-bg-rest);
  box-shadow: none;
  margin-bottom: calc(var(--nz-header-h-scrolled) - var(--nz-header-h-rest));
}

.nz-header__inner {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: calc(var(--nz-content-max) + 2 * var(--nz-gutter));
  height: var(--nz-header-h-scrolled);
  margin-inline: auto;
  padding-inline: var(--nz-gutter);
  transition: height var(--nz-dur-state) var(--nz-ease);
}

.nz-header[data-nz-state="rest"] .nz-header__inner {
  height: var(--nz-header-h-rest);
}

/* ---------- 2.3 · לוגו: סמל כתמונה + כיתוב חי ---------- */
.nz-brand {
  display: inline-flex;
  align-items: center;
  gap: var(--nz-header-logo-gap);
  flex-shrink: 0;
  min-height: var(--nz-tap-min);
  margin-inline-end: var(--nz-header-logo-clearspace);
  color: var(--nz-text-primary);
  text-decoration: none;
}

.nz-brand__mark {
  display: block;
  width: auto;
  max-width: none;
  height: var(--nz-header-mark-scrolled);
  transition: height var(--nz-dur-state) var(--nz-ease);
}

/* מפרט 5.3: אסור לשנות צבע לוגו בקוד. shared.css מחשיך תמונות PNG במצב כהה — לא את הלוגו.
   מוגבל למצב כהה ובלי מצב "היפוך צבעים" של רכיב הנגישות, שבו התמונות צריכות את ההיפוך-הנגדי שלהן */
@media (prefers-color-scheme: dark) {
  html:not(.a11y-contrast-invert) #nzHeader .nz-brand__mark {
    filter: none;
  }
}

.nz-header[data-nz-state="rest"] .nz-brand__mark {
  height: var(--nz-header-mark-rest);
}

.nz-brand__text {
  display: flex;
  flex-direction: column;
  line-height: var(--nz-header-caption-lh);
}

.nz-brand__name {
  font-family: var(--nz-font-heading);
  font-weight: var(--nz-weight-black);
  font-size: var(--nz-header-name-scrolled);
  letter-spacing: var(--nz-header-name-ls);
  color: var(--nz-text-primary);
  transition: font-size var(--nz-dur-state) var(--nz-ease);
}

.nz-brand__sub {
  margin-top: var(--nz-header-sub-mt);
  font-family: var(--nz-font-body);
  font-weight: var(--nz-weight-semibold);
  font-size: var(--nz-header-sub-scrolled);
  letter-spacing: var(--nz-header-sub-ls);
  color: var(--nz-text-secondary);
  transition: font-size var(--nz-dur-state) var(--nz-ease);
}

.nz-header[data-nz-state="rest"] .nz-brand__name { font-size: var(--nz-header-name-rest); }
.nz-header[data-nz-state="rest"] .nz-brand__sub  { font-size: var(--nz-header-sub-rest); }

/* ---------- 2.4 · תפריט הניווט ---------- */
.nz-nav__list {
  display: flex;
  align-items: center;
  gap: var(--nz-nav-gap);
  margin: 0;
  padding: 0;
  list-style: none;
}

.nz-nav__item {
  margin: 0;
  padding: 0;
}

.nz-nav__link {
  display: inline-flex;
  align-items: center;
  gap: var(--nz-caret-gap);
  justify-content: center;
  min-width: var(--nz-tap-min);
  min-height: var(--nz-tap-min);
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  font-family: var(--nz-font-body);
  font-weight: var(--nz-weight-semibold);
  font-size: var(--nz-nav-size);
  color: var(--nz-nav-color);
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: color var(--nz-dur-hover) var(--nz-ease);
}

.nz-nav__label {
  padding-block: var(--nz-nav-pad-block);
  border-bottom: var(--nz-nav-active-border) solid transparent;
}

.nz-nav__link:hover {
  color: var(--nz-nav-color-hover);
  text-decoration: none;
}

.nz-nav__link[aria-current] {
  color: var(--nz-nav-color-active);
}

.nz-nav__link[aria-current] .nz-nav__label {
  border-bottom-color: var(--nz-nav-color-active);
}

/* ---------- 2.5 · תפריט "מחירים" ---------- */
.nz-nav__item--dropdown {
  position: relative;
}

.nz-caret {
  display: inline-block;
  font-size: var(--nz-caret-size);
  opacity: var(--nz-caret-opacity);
  transition: transform var(--nz-dur-state) var(--nz-ease);
}

.nz-nav__trigger[aria-expanded="true"] .nz-caret {
  transform: rotate(var(--nz-caret-rotate));
}

.nz-dropdown {
  position: absolute;
  top: 100%;
  inset-inline-start: 0;
  z-index: var(--nz-z-menu);
  box-sizing: border-box;
  width: var(--nz-dropdown-w);
  padding: var(--nz-dropdown-pad);
  background: var(--nz-white);
  border: var(--nz-hairline) solid var(--nz-border);
  border-radius: var(--nz-dropdown-radius);
  box-shadow: var(--nz-dropdown-shadow);
  visibility: hidden;
  opacity: 0;
  transition:
    opacity var(--nz-dur-state) var(--nz-ease),
    visibility var(--nz-dur-state) var(--nz-ease);
}

.nz-dropdown.is-open {
  visibility: visible;
  opacity: 1;
  /* בפתיחה visibility מתחלף מיד — אחרת focus() על הפריט הראשון נכשל בתחילת המעבר */
  transition-property: opacity;
}

.nz-dropdown__item {
  display: block;
  padding: var(--nz-dropdown-item-pad-block) var(--nz-dropdown-item-pad-inline);
  border-radius: var(--nz-radius-sm);
  text-decoration: none;
  transition: background-color var(--nz-dur-hover) var(--nz-ease);
}

.nz-dropdown__item:hover,
.nz-dropdown__item:focus-visible {
  background-color: var(--nz-page-bg);
  text-decoration: none;
}

.nz-dropdown__title {
  display: block;
  font-family: var(--nz-font-heading);
  font-weight: var(--nz-weight-bold);
  font-size: var(--nz-dropdown-title-size);
  color: var(--nz-text-primary);
}

.nz-dropdown__desc {
  display: block;
  margin-top: var(--nz-dropdown-desc-mt);
  font-family: var(--nz-font-body);
  font-weight: var(--nz-weight-regular);
  font-size: var(--nz-dropdown-desc-size);
  line-height: var(--nz-dropdown-desc-lh);
  color: var(--nz-text-secondary);
}

.nz-dropdown__sep {
  height: var(--nz-hairline);
  margin: var(--nz-dropdown-sep-margin-block) var(--nz-dropdown-sep-margin-inline);
  background: var(--nz-border);
}

/* ---------- 2.6 · אזור ההתחברות ---------- */
.nz-actions {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  gap: var(--nz-login-to-btn);
}

.nz-login {
  display: inline-flex;
  align-items: center;
  gap: var(--nz-login-gap);
  min-height: var(--nz-tap-min);
  font-family: var(--nz-font-body);
  font-weight: var(--nz-weight-semibold);
  font-size: var(--nz-nav-size);
  color: var(--nz-text-secondary);
  text-decoration: none;
  white-space: nowrap;
  transition: color var(--nz-dur-hover) var(--nz-ease);
}

.nz-login:hover {
  color: var(--nz-text-primary);
  text-decoration: none;
}

.nz-login__circle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: var(--nz-login-circle);
  height: var(--nz-login-circle);
  border-radius: var(--nz-radius-pill);
  background: var(--nz-sky-bg);
  color: var(--nz-navy);
}

.nz-icon {
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.nz-login__icon {
  width: var(--nz-login-icon);
  height: var(--nz-login-icon);
  stroke-width: var(--nz-login-icon-stroke);
}

/* ---------- 2.7 · כפתורים ---------- */
.nz-btn {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: var(--nz-radius-btn);
  font-family: var(--nz-font-body);
  font-weight: var(--nz-weight-bold);
  font-size: var(--nz-btn-size);
  line-height: var(--nz-btn-lh);
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color var(--nz-dur-hover) var(--nz-ease);
}

.nz-btn:hover { text-decoration: none; }

.nz-btn--primary {
  background-color: var(--nz-orange-btn);
  color: var(--nz-text-primary);
}

.nz-btn--primary:hover {
  background-color: var(--nz-orange-btn-hover);
  color: var(--nz-text-primary);
}

.nz-btn--secondary {
  background-color: transparent;
  color: var(--nz-navy);
  border: var(--nz-btn-secondary-border) solid var(--nz-navy);
}

.nz-btn--secondary:hover {
  background-color: var(--nz-sky-bg);
  color: var(--nz-navy);
}

.nz-btn--header {
  position: relative;
  height: var(--nz-header-btn-h);
  padding: var(--nz-header-btn-pad-block) var(--nz-header-btn-pad-inline);
  font-size: var(--nz-btn-size-small);
  transition:
    background-color var(--nz-dur-hover) var(--nz-ease),
    opacity var(--nz-dur-state) var(--nz-ease);
}

/* הכפתור בגובה 40px; אזור הלחיצה מורחב ל-44px בלי לשנות את המראה */
.nz-btn--header::before {
  content: "";
  position: absolute;
  inset-inline: 0;
  inset-block: calc((var(--nz-tap-min) - var(--nz-header-btn-h)) / -2);
}

/* מצב 1 בדף הבית: הכפתור מוסתר (opacity 0 · pointer-events none · aria-hidden ב-JS) */
.nz-header__cta.is-hidden {
  opacity: 0;
  pointer-events: none;
}

/* ---------- המבורגר (מוסתר בדסקטופ) ---------- */
.nz-burger {
  display: none;
  align-items: center;
  justify-content: center;
  width: var(--nz-tap-min);
  height: var(--nz-tap-min);
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  color: var(--nz-text-primary);
  cursor: pointer;
}

.nz-burger .nz-icon {
  width: var(--nz-hamburger-size);
  height: var(--nz-hamburger-size);
  stroke-width: var(--nz-hamburger-stroke);
}

.nz-burger__close { display: none; }
.nz-burger[aria-expanded="true"] .nz-burger__open { display: none; }
.nz-burger[aria-expanded="true"] .nz-burger__close { display: block; }

/* ---------- סרגל תחתון (מובייל בלבד) ---------- */
.nz-mobile-bar {
  display: none;
}

/* ---------- 2.9 · פוקוס ----------
   ID + !important: shared.css מגדיר `body:not(.using-mouse) *:focus { outline: 3px … !important }`,
   שגובר על כל כלל רגיל. כאן אוכפים את ערכי המפרט (2px · offset 2px) רק בתוך ההדר והסרגל. */
#nzHeader :focus-visible,
#nzMobileBar :focus-visible {
  outline: var(--nz-focus-width) solid var(--nz-focus-color) !important;
  outline-offset: var(--nz-focus-offset) !important;
}

#nzHeader :focus:not(:focus-visible),
#nzMobileBar :focus:not(:focus-visible) {
  outline: none !important;
}

/* כללי פוקוס ישנים (a:focus-visible { border-radius: 6px }) משנים את פינות הכפתורים בפוקוס */
#nzHeader .nz-btn:focus-visible,
#nzMobileBar .nz-btn:focus-visible {
  border-radius: var(--nz-radius-btn);
}
#nzHeader .nz-dropdown__item:focus-visible {
  border-radius: var(--nz-radius-sm);
}

/* ==========================================================================
   2.8 · מובייל — מתחת ל-1024px
   ========================================================================== */
@media (max-width: 1023px) {
  .nz-header[data-nz-state="rest"] {
    margin-bottom: 0;
  }

  .nz-header__inner,
  .nz-header[data-nz-state="rest"] .nz-header__inner {
    height: var(--nz-header-h-mobile);
  }

  .nz-brand__mark,
  .nz-header[data-nz-state="rest"] .nz-brand__mark {
    height: var(--nz-header-mark-mobile);
  }

  .nz-brand__text,
  .nz-login__text,
  .nz-header__cta {
    display: none;
  }

  .nz-actions {
    gap: var(--nz-mobile-header-gap);
  }

  /* בלי הכיתוב הסמל (18.7px) והעיגול (32px) צרים מ-44 — מרחיבים את אזור הלחיצה, לא את המראה */
  .nz-brand,
  .nz-login {
    min-width: var(--nz-tap-min);
  }

  .nz-login {
    justify-content: center;
  }

  .nz-burger {
    display: inline-flex;
  }

  /* תפריט מסך מלא — נפתח מתחת לפס ההדר, כדי שה-X יישאר גלוי */
  .nz-nav {
    display: none;
    position: fixed;
    top: calc(var(--nz-header-h-mobile) + env(safe-area-inset-top));
    inset-inline: 0;
    bottom: 0;
    z-index: var(--nz-z-menu);
    box-sizing: border-box;
    padding: var(--nz-space-24) var(--nz-gutter);
    overflow-y: auto;
    background: var(--nz-white);
    border-top: var(--nz-hairline) solid var(--nz-border);
  }

  .nz-nav.is-open {
    display: block;
  }

  .nz-nav__list {
    flex-direction: column;
    align-items: stretch;
    gap: var(--nz-mobile-menu-gap);
  }

  .nz-nav__link {
    justify-content: flex-start;
    width: 100%;
    font-size: var(--nz-mobile-menu-item-size);
  }

  /* "מחירים" — אקורדיון שנפתח במקום ודוחף את הפריטים מתחתיו */
  .nz-dropdown {
    display: none;
    position: static;
    width: auto;
    padding: 0;
    padding-inline-start: var(--nz-mobile-accordion-indent);
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background: none;
    visibility: visible;
    opacity: 1;
    transition: none;
  }

  .nz-dropdown.is-open {
    display: block;
  }

  .nz-mobile-bar {
    display: flex;
    align-items: center;
    gap: var(--nz-btn-gap);
    position: fixed;
    inset-inline: 0;
    bottom: 0;
    z-index: var(--nz-z-mobile-bar);
    box-sizing: border-box;
    height: calc(var(--nz-mobile-bar-h) + env(safe-area-inset-bottom));
    padding: 0 var(--nz-gutter) env(safe-area-inset-bottom);
    background: var(--nz-white);
    border-top: var(--nz-hairline) solid var(--nz-border);
    transition:
      opacity var(--nz-dur-state) var(--nz-ease),
      visibility var(--nz-dur-state) var(--nz-ease);
  }

  .nz-mobile-bar.is-hidden {
    visibility: hidden;
    opacity: 0;
  }

  .nz-mobile-bar .nz-btn {
    flex: 1;
    min-height: var(--nz-btn-min-h);
    padding: var(--nz-btn-pad-block) var(--nz-btn-pad-inline);
    font-size: var(--nz-btn-size);
  }

  /* מקום לסרגל בתחתית העמוד, וכפתור הוואטסאפ הצף מעליו */
  body:has(.nz-mobile-bar) {
    padding-bottom: calc(var(--nz-mobile-bar-h) + env(safe-area-inset-bottom));
  }

  body:has(.nz-mobile-bar) .fab-wa {
    bottom: calc(var(--nz-mobile-bar-h) + var(--nz-space-24) + env(safe-area-inset-bottom));
  }

  /* כשהסרגל מוצג יש בו כבר וואטסאפ — בלי כפתור צף כפול. ניר 08/10/2026: כמו בדף הבית
     (glass-clay.css), בכל העמודים. אחרת הכפתור מכסה את "תנאי שימוש" בתחתית הפוטר */
  html body:has(.nz-mobile-bar:not(.is-hidden)) a.fab-wa {
    display: none;
  }

  /* נעילת גלילה על html ולא על body: mobile-fixes.css שם overflow-x:clip על html,
     ולכן overflow על body לא עובר ל-viewport — body הופך למיכל גלילה וההדר הדביק "בורח" */
  html.nz-menu-open {
    overflow: hidden;
  }

  /* כפתור הנגישות (z-index 9998) מכסה את התפריט הפתוח — מוסתר רק כל עוד התפריט פתוח */
  html.nz-menu-open #a11y-widget-trigger {
    visibility: hidden;
  }

  /* פוקוס במקלדת לא נחבא מתחת לסרגל הקבוע */
  html:has(.nz-mobile-bar) {
    scroll-padding-bottom: calc(var(--nz-mobile-bar-h) + env(safe-area-inset-bottom));
  }
}

/* 769–1023: כלל ה-152px של כפתור הנגישות הוסר (מפרט 2.2, 6.4) — מתחת ל-1024 הכפתור יושב
   78px מלמטה בכל הרוחבים, לפי a11y-widget.css */

/* כפתור "הבא" הדביק במחשבון כוון לסרגל הישן (69px) — עכשיו צמוד לסרגל החדש */
@media (max-width: 600px) {
  body:has(.nz-mobile-bar) .calc-card .calc-footer {
    bottom: calc(var(--nz-mobile-bar-h) + env(safe-area-inset-bottom));
  }
}

/* פס "המשך מהמחשבון" (tracking.js, z-index 200 בסגנון inline) כיסה את "מחירים" והתפריט —
   יורד לשכבה 90, מתחת להדר */
#netzCalcRestore {
  z-index: var(--nz-z-mobile-bar) !important;
}

/* ---------- prefers-reduced-motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .nz-header,
  .nz-header *,
  .nz-mobile-bar,
  .nz-mobile-bar * {
    transition-duration: var(--nz-dur-reduced) !important;
  }
}
