/* ===== pagenav.css — תפריט התמצאות בעמוד: כרטיסיות + פס ניווט דביק ===== */
/* נבנה אוטומטית על ידי pagenav.js מתוך כותרות העמוד. אין צורך לתחזק ידנית. */

:root{--pn-nav:64px;--pn-bar:0px} /* ערכי פתיחה; נמדדים מחדש ב-pagenav.js */

/* ---------- פס הניווט הדביק (התפריט העליון של העמוד) ---------- */
.pn{
  position:sticky;top:var(--pn-nav);z-index:90;
  background:rgba(255,255,255,.94);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
  box-shadow:0 8px 20px -18px rgba(13,59,102,.75);
}
.pn-in{max-width:1140px;margin:0 auto;padding:7px var(--px);display:flex;align-items:center;gap:12px}
.pn-lbl{
  display:flex;align-items:center;gap:8px;flex:0 0 auto;
  font-size:.72rem;font-weight:800;letter-spacing:.14em;color:var(--accent);white-space:nowrap;
}
.pn-lbl::before{content:"";width:22px;height:5px;border-radius:3px;background:linear-gradient(90deg,var(--cyan),var(--blue))}
.pn-tabs{
  display:flex;align-items:center;gap:6px;flex:1;min-width:0;
  overflow-x:auto;overscroll-behavior-x:contain;scroll-behavior:smooth;
  scrollbar-width:none;-ms-overflow-style:none;padding:3px 0;
  --f-s:0px;--f-e:0px;
  -webkit-mask-image:linear-gradient(to left,transparent 0,#000 var(--f-s),#000 calc(100% - var(--f-e)),transparent 100%);
  mask-image:linear-gradient(to left,transparent 0,#000 var(--f-s),#000 calc(100% - var(--f-e)),transparent 100%);
}
.pn-tabs::-webkit-scrollbar{display:none}
.pn-tab{
  display:inline-flex;align-items:center;gap:7px;flex:0 0 auto;
  padding:6px 14px;border-radius:999px;border:1.5px solid var(--border);
  background:#fff;color:var(--text2);text-decoration:none;
  font-size:var(--fs-sm);font-weight:700;line-height:1.35;white-space:nowrap;
  transition:color .2s,border-color .2s,background .2s,box-shadow .2s;
}
.pn-tab .t{display:block;max-width:30ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pn-tab .n{
  font-size:.72rem;font-weight:800;font-variant-numeric:tabular-nums;
  color:var(--muted);transition:color .2s;
}
.pn-tab:hover{border-color:var(--cyan);background:var(--cyan-100);color:var(--navy)}
.pn-tab:hover .n{color:var(--accent)}
.pn-tab.on{
  background:var(--grad);border-color:transparent;color:#fff;box-shadow:var(--sh-sm);
}
.pn-tab.on .n{color:rgba(255,255,255,.72)}
.pn-up{
  flex:0 0 auto;width:34px;height:34px;border-radius:11px;cursor:pointer;
  border:1.5px solid var(--border);background:#fff;color:var(--navy);
  display:grid;place-content:center;transition:all .2s;
}
.pn-up:hover{border-color:var(--cyan);background:var(--cyan-100)}
.pn-up svg{width:15px;height:15px}
@media(max-width:860px){.pn-lbl{display:none}}
@media(max-width:640px){.pn-in{padding-inline:12px;gap:8px}.pn-tab{font-size:var(--fs-xs);padding:5px 12px}}

/* ---------- תפריט הצד (המבורגר) לעמודים עמוסים ----------
   נדלק אוטומטית ב-pagenav.js. הכפתור חי בתוך הפס הדביק, החלונית על ה-body.
   שכבות: הפס 90 · תפריט הניווט הראשי של האתר 100 · הרקע כאן 240 · החלונית 250
   (מתחת ל-.drawer/.scrim של תפריט האתר, 300/310, כדי שלא יתנגשו). */

.pnd-btn{
  flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;
  height:34px;padding:0 12px;border-radius:11px;cursor:pointer;
  border:1.5px solid var(--border);background:#fff;color:var(--navy);
  font:inherit;font-size:var(--fs-xs);font-weight:800;line-height:1;
  transition:border-color .2s,background .2s,color .2s,box-shadow .2s;
}
.pnd-btn svg{width:16px;height:16px;flex:0 0 auto}
.pnd-btn:hover{border-color:var(--cyan);background:var(--cyan-100)}
.pnd-btn[aria-expanded="true"]{background:var(--grad);border-color:transparent;color:#fff;box-shadow:var(--sh-sm)}

.pnd-scrim{
  position:fixed;inset:0;z-index:240;
  background:rgba(13,59,102,.34);backdrop-filter:blur(2px);
  opacity:0;pointer-events:none;transition:opacity .25s var(--ease);
}
body.pnd-open .pnd-scrim{opacity:1;pointer-events:auto}

/* נפתח מצד ההתחלה הלוגי — ב-RTL זהו הצד הימני */
.pnd{
  position:fixed;inset-block:0;inset-inline-start:0;z-index:250;
  width:min(360px,88vw);display:flex;flex-direction:column;
  background:#fff;border-inline-end:1px solid var(--border);box-shadow:var(--sh-float);
  visibility:hidden;transform:translateX(-100%);
  transition:transform .3s var(--ease),visibility .3s;
}
[dir="rtl"] .pnd{transform:translateX(100%)}
body.pnd-open .pnd{visibility:visible;transform:none;transition:transform .34s var(--ease)}
.pnd:focus{outline:none}

.pnd-head{
  display:flex;align-items:flex-start;justify-content:space-between;gap:12px;
  padding:16px 20px 14px;border-bottom:1px solid var(--border);
  background:linear-gradient(180deg,var(--soft-bg),#fff);
}
.pnd-head strong{display:block;color:var(--navy);font-size:var(--fs-base);font-weight:800;line-height:1.3}
.pnd-count{display:block;margin-top:3px;font-size:.76rem;font-weight:700;color:var(--muted)}
.pnd-x{
  flex:0 0 auto;width:32px;height:32px;border-radius:10px;cursor:pointer;
  border:1.5px solid var(--border);background:#fff;color:var(--navy);
  display:grid;place-content:center;transition:all .2s;
}
.pnd-x:hover{border-color:var(--cyan);background:var(--cyan-100)}
.pnd-x svg{width:14px;height:14px}

.pnd-body{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:10px 12px 22px}
.pnd-list{list-style:none;margin:0;padding:0}
.pnd-item{margin-bottom:2px}
.pnd-item.pn-off{display:none}

.pnd-sec{
  display:flex;align-items:baseline;gap:9px;padding:9px 10px;border-radius:11px;
  color:var(--text);text-decoration:none;font-weight:700;font-size:var(--fs-md);line-height:1.4;
  transition:background .15s,color .15s;
}
.pnd-sec .n{
  flex:0 0 auto;font-size:.72rem;font-weight:800;
  font-variant-numeric:tabular-nums;color:var(--muted);transition:color .15s;
}
.pnd-sec:hover{background:var(--soft-bg);color:var(--navy)}
.pnd-sec.on{background:var(--cyan-100);color:var(--navy)}
.pnd-sec.on .n{color:var(--accent)}

.pnd-subs{list-style:none;margin:0 0 8px;padding:0;padding-inline-start:19px;position:relative}
.pnd-subs::before{
  content:"";position:absolute;inset-block:4px;inset-inline-start:8px;
  width:1.5px;border-radius:2px;background:var(--border);
}
.pnd-sub{
  display:flex;align-items:center;gap:6px;padding:6px 10px;border-radius:9px;
  color:var(--text2);text-decoration:none;font-size:var(--fs-sm);font-weight:600;line-height:1.4;
  transition:background .15s,color .15s;
}
.pnd-sub svg{width:12px;height:12px;flex:0 0 auto;color:var(--muted)}
.pnd-sub:hover{background:var(--soft-bg);color:var(--navy)}
.pnd-sub:hover svg{color:var(--cyan-ink,#0C7095)}
.pnd-sub.on{color:var(--navy);font-weight:800;background:var(--soft-bg)}

.pnd a:focus-visible,.pnd button:focus-visible,.pnd-btn:focus-visible{
  outline:2px solid var(--blue);outline-offset:2px;
}

/* אנימציית פתיחה עדינה לרשימה עצמה */
@keyframes pndIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
body.pnd-open .pnd-list{animation:pndIn .4s var(--ease) .06s both}

@media(max-width:640px){
  .pnd-btn-t{display:none}
  .pnd-btn{width:34px;padding:0;justify-content:center}
}
@media (prefers-reduced-motion: reduce){
  .pnd,body.pnd-open .pnd,.pnd-scrim{transition:none}
  body.pnd-open .pnd-list{animation:none}
}
@media print{.pnd,.pnd-scrim,.pnd-btn{display:none !important}}

/* ---------- כרטיסיות המדורים (״מה יש בעמוד״) ---------- */
/* הוסרו ב-28.8.26: הרשת כבויה כברירת מחדל ב-pagenav.js (data-pn-cards="on" מדליק).
   כללי .pn-cards / .pn-cards-head / .pn-grid / .pn-card זמינים בהיסטוריית git
   ויש להחזירם יחד עם ההדלקה. */

@media print{.pn{display:none !important}}

/* מדור מוסתר (סינון מסלולים) — גם הכרטיסייה שלו בפס יורדת */
.pn-tab.pn-off{display:none}

/* גלילה רכה גם בעמודים שאינם עמודי מסמך */
@media (prefers-reduced-motion: no-preference){html{scroll-behavior:smooth}}

/* ===== כפתור "חזרה" — עמוד־בן חוזר תמיד להורה שלו ===== */
.pn-back{
  display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;
  padding:7px 12px 7px 14px;border-radius:999px;
  border:1px solid var(--border,#DCE6EF);background:var(--blue-bg,#F2F7FB);
  color:var(--navy,#0D3B66);font-size:var(--fs-xs);font-weight:700;
  text-decoration:none;white-space:nowrap;transition:.16s ease;
}
.pn-back svg{width:14px;height:14px;flex:0 0 auto}
.pn-back:hover{background:var(--cyan-100,#DFF3FA);border-color:var(--cyan,#39B7DB);color:var(--accent)}
.pn-back:focus-visible{outline:2px solid var(--cyan,#39B7DB);outline-offset:2px}
.pn-backonly .pn-in{justify-content:space-between}

/* כרטיסייה שמובילה לעמוד נפרד — לא עוגן בתוך העמוד */
.pn-tab.is-page .n{background:var(--teal-100,#D6F2EC);color:#087565}
.pn-tab.is-page.on{border-color:var(--cyan,#39B7DB);background:var(--cyan-100,#DFF3FA);color:var(--navy,#0D3B66)}
.pn-tab.is-page::after{
  content:"";width:0;height:0;margin-inline-start:2px;flex:0 0 auto;
  border-block:3px solid transparent;border-inline-end:4px solid currentColor;opacity:.45;
}

@media (max-width:640px){
  .pn-back span{display:none}
  .pn-back{padding:7px 10px}
}

/* ---------- חצי גלילה בפס הכרטיסיות ----------
   הפס גולל אופקית עם פס גלילה מוסתר. בנייד אפשר להחליק באצבע, אבל
   בעכבר לא הייתה שום דרך להגיע לכרטיסיות שמעבר לקצה. החצים נחשפים
   ב-pagenav.js רק כשבאמת יש עוד תוכן לכיוון הזה. */
.pn-arw{
  flex:0 0 auto;width:28px;height:28px;border-radius:9px;cursor:pointer;
  border:1.5px solid var(--border);background:#fff;color:var(--navy);
  display:grid;place-content:center;padding:0;transition:all .2s}
.pn-arw:hover{border-color:var(--cyan);background:var(--cyan-100)}
.pn-arw:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.pn-arw svg{width:14px;height:14px}
.pn-arw[hidden]{display:none}

/* כרטיסיות צרות יותר — התוויות התקצרו, ואין סיבה שאחת תבלע חצי פס */
.pn-tab .t{max-width:22ch}
@media(max-width:900px){.pn-tab .t{max-width:15ch}}
@media(max-width:640px){.pn-arw{width:26px;height:26px}}
@media print{.pn-arw{display:none}}

/* ---------- כיווץ הפס כדי שכל הכרטיסיות ייכנסו ----------
   לפני הכרטיסיות ישבו כ-380px של כרום: כפתור המדורים, כפתור החזרה
   והתווית "בעמוד". התוצאה — רק שלוש-ארבע כרטיסיות נכנסו, והשאר
   נחתכו בלי דרך להגיע אליהן. */
.pn-tab{padding:5px 11px;gap:6px}
.pn-tab .t{max-width:18ch}
.pn-tab .n{font-size:.68rem}
.pn-in{gap:8px}

@media(max-width:1500px){
  /* התווית "בעמוד" דקורטיבית — הפס הצבעוני לפניה כבר מסמן מה זה */
  .pn-lbl span,.pn-lbl{display:none}
  /* כפתור החזרה הופך לאייקון בלבד; הטקסט נשאר ב-title ובקורא מסך */
  .pn-back span{
    position:absolute;width:1px;height:1px;padding:0;margin:-1px;
    overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
  .pn-back{padding-inline:8px}
}
@media(max-width:1100px){
  .pn-tab .t{max-width:14ch}
  .pnd-btn-t{
    position:absolute;width:1px;height:1px;padding:0;margin:-1px;
    overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
}

/* שלבי הכיווץ האוטומטי — נדלקים ב-pagenav.js לפי מדידת רוחב אמיתית */
.pn-tabs.pn-compact .pn-tab .n{display:none}
.pn-tabs.pn-compact .pn-tab{padding-inline:12px}
.pn-tabs.pn-tight .pn-tab .t{max-width:12ch}

/* ===== הפס שמכיל רק את כפתור החזרה =====
   הכלל שמסתיר את כיתוב "חזרה" מ-1500px ומטה נכתב לפס עמוס, שבו
   הכרטיסיות מתחרות על המקום. בפס שאין בו כרטיסיות בכלל — עמוד שער
   קצר, למשל — הוא הותיר חץ בודד בלי שום הסבר מה הוא עושה.
   כאן הכיתוב מוחזר, כי אין על מה להתחרות. מתחת ל-640px הוא עדיין
   יורד, שם המקום באמת חסר. */
@media(min-width:641px){
  .pn-backonly .pn-back span{
    position:static;width:auto;height:auto;padding:0;margin:0;
    overflow:visible;clip:auto;white-space:nowrap;border:0}
  .pn-backonly .pn-back{padding:7px 12px 7px 14px}
}

/* ===== נייד: כל הכרטיסיות גלויות (11.10.26) =====
   כמו הצ'יפים של התפריט העליון בעמוד הפתיחה — הכרטיסיות עוטפות לכמה
   שורות במקום גלילה הצידה, השמות מלאים ובלי חיצים. */
@media(max-width:720px){
  /* לא דביק בנייד — כשהוא עוטף לכמה שורות, יחד עם התפריט העליון הוא בולע חצי מסך */
  .pn{position:relative;top:auto}
  .pn-in{align-items:flex-start}
  .pn-tabs{flex-wrap:wrap;overflow:visible;-webkit-mask-image:none;mask-image:none;gap:6px}
  .pn-tab,.pn-tabs.pn-compact .pn-tab{padding:5px 11px;min-height:32px;white-space:normal}
  .pn-tab .t,.pn-tabs.pn-tight .pn-tab .t{max-width:none;white-space:normal;overflow:visible}
  .pn-tab .n{display:none}
  .pn-arw{display:none !important}
}