/* ==========================================================================
   שלום עליכם | פאנל נגישות v2 (12.10.2026). נבנה אצלנו, בלי ספק חיצוני.
   מחליף את כל כללי .a11y / .a11y-toggle / .a11y-tools ב-style.css
   (שורות 304-307, 451-452, 575-576, 603-611, 633, 659-665, 721-725, וההפניה
   ב-@media print שורה 329 וב-.stickybar שורה 359). השמות החדשים (.a11y-widget,
   .a11y-fab, .a11y-panel) נבחרו כדי לא להתנגש בכללים הישנים אם נשאר שריד.

   הפאנל שולט בהעדפות אמיתיות של המשתמש. הוא לא מבטיח לתקן את הדף במקומו.

   צבעים: משתני הפלטה הסופית של style.css (הבלוק האחרון בקובץ):
   --ink #0F3B4C · --gold #F4A742 · --gold2 #A8452A · --paper #FFFCF5 · --cream #FDF7EE
   --night #0F3B4C. במצב body.contrast המשתנים מתחלפים (--gold #8a5a00, --night #05222e,
   --paper #FFFFFF, --ink #000), והפאנל נבדק גם במצב הזה: טקסט שחור על לבן,
   קישור בצבע --ink עם קו תחתון, כפתור פעיל --night על --paper.
   ========================================================================== */

/* ---------- העוגן: aside קבוע בפינה התחתונה בצד ההתחלה (ימין ב-RTL) ---------- */
.a11y-widget{
  position:fixed;
  inset-inline-start:calc(.9rem + env(safe-area-inset-right,0px));
  bottom:calc(.9rem + env(safe-area-inset-bottom,0px));
  z-index:120;
  display:flex;flex-direction:column;align-items:flex-start;gap:.5rem;
  font-family:var(--body);
}
/* בדפים עם פס קנייה צף בנייד (booklet, box, malketa) הכפתור עולה מעל הפס, לא מסתיר אותו */
body.has-stickybar .a11y-widget{bottom:calc(5.2rem + env(safe-area-inset-bottom,0px))}
@media print{.a11y-widget{display:none}}

/* ---------- הכפתור הצף: עיגול 52px, אייקון נגישות ---------- */
.a11y-fab{
  width:52px;height:52px;border-radius:50%;
  display:inline-grid;place-items:center;
  background:var(--night);color:var(--paper);
  border:2px solid var(--gold);
  box-shadow:0 10px 28px rgba(15,59,76,.28);
  cursor:pointer;padding:0;
  transition:transform .18s var(--ease),box-shadow .18s var(--ease);
}
.a11y-fab svg{width:30px;height:30px;display:block;fill:none;stroke:currentColor}
.a11y-fab:hover{transform:translateY(-1px);box-shadow:0 14px 32px rgba(15,59,76,.34)}
.a11y-fab:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
/* העדפה פעילה: נקודת זהב קטנה על הכפתור, גם כשהפאנל סגור */
.a11y-fab::after{
  content:"";position:absolute;top:2px;inset-inline-end:2px;width:11px;height:11px;border-radius:50%;
  background:var(--gold);border:2px solid var(--night);opacity:0;transform:scale(.6);
  transition:opacity .18s,transform .18s;
}
.a11y-fab{position:relative}
.a11y-widget.on .a11y-fab::after{opacity:1;transform:none}
.a11y-widget.open .a11y-fab{background:var(--gold);color:var(--night);border-color:var(--night)}

/* ---------- הפאנל: דיאלוג לא-מודאלי מעל הכפתור ---------- */
.a11y-panel{
  width:min(340px,calc(100vw - 1.8rem - env(safe-area-inset-right,0px)));
  background:var(--paper);color:var(--ink);
  border:1px solid var(--line);border-radius:14px;
  box-shadow:0 24px 60px rgba(15,59,76,.22);
  padding:1rem 1rem 1.1rem;
  order:-1; /* הפאנל מעל הכפתור, הכפתור נשאר במקומו */
}
.a11y-panel[hidden]{display:none}
.a11y-panel-head{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-bottom:.4rem}
.a11y-panel-head h2{
  font-family:var(--display);font-weight:700;font-size:1.25rem;line-height:1.1;color:var(--ink);margin:0;
}
.a11y-close{
  width:44px;height:44px;border-radius:50%;display:inline-grid;place-items:center;
  background:transparent;border:1px solid transparent;color:var(--ink);cursor:pointer;font-size:1.3rem;line-height:1;
}
.a11y-close:hover{background:var(--cream2)}
.a11y-close:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.a11y-panel-sub{font-size:.86rem;color:var(--muted);margin:0 0 .8rem;line-height:1.45}

/* קבוצות: תווית עליונה ושורת כפתורים */
.a11y-group{margin-top:.75rem}
.a11y-group > span{display:block;font-size:.8rem;font-weight:700;color:var(--ink2);margin-bottom:.4rem;letter-spacing:.01em}
.a11y-row{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem}
.a11y-row.two{grid-template-columns:1fr 1fr}

/* אפשרות: יעד מגע 44px לפחות, מצב לחוץ ברור גם בלי צבע (מסגרת כפולה + סימן) */
.a11y-opt{
  min-height:44px;padding:.45rem .35rem;
  border:1.5px solid var(--line);border-radius:10px;
  background:var(--cream);color:var(--ink);
  font:inherit;font-size:.9rem;font-weight:700;line-height:1.2;
  display:inline-flex;align-items:center;justify-content:center;gap:.35rem;
  cursor:pointer;text-align:center;
  transition:background .15s,border-color .15s,color .15s;
}
.a11y-opt:hover{border-color:var(--ink)}
.a11y-opt:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.a11y-opt[aria-pressed="true"]{
  background:var(--night);color:var(--paper);border-color:var(--night);
  box-shadow:inset 0 0 0 2px var(--gold);
}
/* סימן ה-✓ ויזואלי בלבד: טקסט חלופי ריק כדי שקורא מסך לא יקריא "✓ רגיל" (נתפס בעץ הנגישות 12.10) */
.a11y-opt[aria-pressed="true"]::before{content:"✓" / "";font-size:.85em}
/* שלוש דרגות גודל: הדוגמית עצמה מראה את הגודל */
.a11y-opt[data-fs="1"]{font-size:1rem}
.a11y-opt[data-fs="2"]{font-size:1.06rem}

/* שורת סיום: איפוס + הצהרה */
.a11y-foot{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-top:1rem;padding-top:.8rem;border-top:1px solid var(--line)}
.a11y-reset{
  min-height:44px;padding:0 .9rem;border-radius:999px;
  border:1px solid var(--line);background:transparent;color:var(--ink);
  font:inherit;font-size:.86rem;font-weight:700;cursor:pointer;
}
.a11y-reset:hover{border-color:var(--ink);background:var(--cream2)}
.a11y-reset:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
/* קישור ההצהרה: בצבע הדיו עם קו תחתון, כדי שיהיה קריא גם במצב ניגודיות גבוהה (לא כחול ברירת מחדל) */
.a11y-link{
  display:inline-flex;align-items:center;min-height:44px;padding:0 .3rem;
  color:var(--ink);font-size:.86rem;font-weight:700;
  text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--gold);text-decoration-thickness:2px;
}
.a11y-link:hover{text-decoration-color:var(--ink)}
.a11y-link:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:4px}

/* ---------- מצבי העדפה שהפאנל מפעיל ---------- */
/* גודל טקסט: html{font-size:var(--fs)} כבר קיים ב-style.css שורה 17. המחלקות מאפשרות
   להחיל את הדרגה לפני הציור הראשון, בלי לחכות לסקריפט הראשי. */
html.a11y-fs1{--fs:1.125rem}
html.a11y-fs2{--fs:1.25rem}

/* הדגשת קישורים: כל קישור בגוף הדף מקבל קו תחתון עבה. לא בתוך הפאנל עצמו (שם כבר יש). */
html.a11y-links body a:not(.a11y-link):not(.btn){
  text-decoration:underline!important;text-decoration-thickness:2px!important;text-underline-offset:.18em!important;
}
html.a11y-links body a.btn{outline:2px solid currentColor;outline-offset:2px}

/* גופן קריא: Heebo בלבד, גם במקום שבו הכותרות ב-Frank Ruhl Libre.
   כל השימושים בכותרות עוברים דרך var(--display), ולכן די להחליף את המשתנה. */
html.a11y-font{--display:"Heebo","Assistant","Segoe UI",Arial,sans-serif}
html.a11y-font body,html.a11y-font body *{font-family:"Heebo","Assistant","Segoe UI",Arial,sans-serif!important}

/* ניגודיות גבוהה ועצירת תנועה: המחלקות body.contrast ו-body.nomotion נשארות כמו שהן
   (style.css שורות 20, 315, 431, 469, 762, 843-852, 872, 1051-1053). לא מוגדרת כאן
   פלטה שנייה, כדי לא ליצור שתי הגדרות לאותו דבר. */

/* ניגודיות גבוהה, הפוטר: body.contrast מחליף את --gold לגוון כהה (#8a5a00) שמתאים לטקסט על לבן,
   אבל הפוטר נשאר על רקע כהה (--night #05222e) והכותרות והחתימה בו ירדו ל-2.78:1 (ממצא F3 ב-06-a11y-axe.md).
   זו ההגדרה היחידה לתיקון הזה (לא לשכפל ב-style.css). #FFD27A על #05222e: 11.57:1. */
body.contrast .site-footer h3,
body.contrast .site-footer h4,
body.contrast .site-footer .brand .sig{color:#FFD27A}

/* הפאנל במצב ניגודיות גבוהה: הדגשה של גבולות, כי --line הופך ל-rgba(0,0,0,.45) */
body.contrast .a11y-panel{border-color:#000}
body.contrast .a11y-opt{border-color:#000}
body.contrast .a11y-fab{border-color:#fff;box-shadow:0 0 0 2px #000}

/* תנועה: כיבוד העדפת המערכת וכפתור העצירה */
@media (prefers-reduced-motion:reduce){.a11y-fab,.a11y-fab::after,.a11y-opt{transition:none}}
body.nomotion .a11y-fab,body.nomotion .a11y-fab::after,body.nomotion .a11y-opt{transition:none}

/* נייד צר: שתי עמודות לגודל טקסט כדי שהמילה "גדול מאוד" לא תישבר */
@media (max-width:360px){.a11y-row{grid-template-columns:1fr 1fr}}

/* 13.10 מובייל: הכפתור הצף עובר לצד שבו שורות עבריות נגמרות, קטן ל-44, ולא עולה מעל סרגל שעדיין מוסתר */
@media (max-width:800px){
  .a11y-widget{inset-inline-start:auto;inset-inline-end:calc(.9rem + env(safe-area-inset-left,0px));align-items:flex-end}
  .a11y-fab{width:44px;height:44px}
  body.has-stickybar.sb-hidden .a11y-widget{bottom:calc(.9rem + env(safe-area-inset-bottom,0px))}
}
/* 13.10: במסכים צרים (360) הכפתור הצף נגע ב-5px בקצה כפתור ההירו */
@media (max-width:380px){.a11y-fab{width:40px;height:40px}.a11y-widget{bottom:calc(.5rem + env(safe-area-inset-bottom,0px))}body.has-stickybar.sb-hidden .a11y-widget{bottom:calc(.5rem + env(safe-area-inset-bottom,0px))}}