/* ═══ נגישות ═══════════════════════════════════════════════
   ארגז הכלים הצף, והמצבים שהוא מפעיל.
   מופרד מהדף כדי שאפשר יהיה לכלול אותו גם בדפים המשפטיים.
   ═══════════════════════════════════════════════════════ */

.a11y { position: fixed; inset-inline-start: 18px; bottom: 18px; z-index: 900; }

.a11y-open {
  width: 50px; height: 50px; border-radius: 50%;
  display: grid; place-items: center;
  background: #0E1A30; color: #fff; border: 2px solid #fff;
  box-shadow: 0 4px 16px rgba(12, 23, 36, .32);
  cursor: pointer;
}
.a11y-open svg { width: 26px; height: 26px; }
.a11y-open:hover { background: #1b2d4d; }

.a11y-panel {
  position: absolute; bottom: 62px; inset-inline-start: 0;
  width: 318px; max-height: 76vh; overflow-y: auto;
  padding: 14px;
  display: flex; flex-direction: column; gap: 10px;
  background: #fff; color: #0E1A30;
  border: 1px solid #d8e0ea; border-radius: 14px;
  box-shadow: 0 18px 46px rgba(12, 23, 36, .26);
}
.a11y-panel[hidden] { display: none; }

.a11y-head { display: flex; align-items: center; justify-content: space-between; }
.a11y-head b { font-size: 16px; font-weight: 800; }
.a11y-x {
  width: 34px; height: 34px; min-height: 0;
  display: grid; place-items: center;
  background: none; border: 0; border-radius: 8px;
  color: #5a6b85; cursor: pointer;
}
.a11y-x:hover { background: #eef3f9; color: #0E1A30; }
.a11y-x svg { width: 18px; height: 18px; }

/* ── גודל הטקסט ─────────────────────────────────────
   שני כפתורים נפרדים ולא מחזור אחד: מי שהגדיל צעד אחד
   יותר מדי צריך דרך לחזור, ולא סיבוב שלם ברשימה. */
.a11y-size {
  display: flex; align-items: center; gap: 8px;
  background: #f4f7fb; border-radius: 10px; padding: 7px 10px;
}
.a11y-size > span:first-child { flex: 1; font-size: 14px; font-weight: 700; }
.a11y-size button {
  width: 38px; height: 38px; min-height: 0; flex: none;
  display: grid; place-items: center;
  background: #fff; border: 1px solid #d8e0ea; border-radius: 9px;
  color: #0E1A30; cursor: pointer;
}
.a11y-size button:hover { background: #0E1A30; color: #fff; }
.a11y-size button svg { width: 17px; height: 17px; }
.a11y-pct {
  min-width: 46px; text-align: center;
  font-size: 13px; font-weight: 800; font-variant-numeric: tabular-nums;
}

/* ── הכלים ──────────────────────────────────────────── */
.a11y-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.a11y-grid button {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px; text-align: center;
  font: inherit; font-size: 12.5px; font-weight: 600; line-height: 1.25;
  padding: 11px 6px; border-radius: 10px;
  background: #f4f7fb; color: #0E1A30; border: 1px solid transparent;
  cursor: pointer;
}
.a11y-grid button svg { width: 21px; height: 21px; }
.a11y-grid button:hover { background: #e7eef7; }
.a11y-grid button[aria-pressed='true'] { background: #0E1A30; color: #fff; border-color: #0E1A30; }

.a11y-reset {
  font: inherit; font-size: 14px; font-weight: 700;
  padding: 10px; border-radius: 10px;
  background: #fff; color: #0E1A30; border: 1px solid #d8e0ea; cursor: pointer;
}
.a11y-reset:hover { background: #f4f7fb; }
.a11y-panel > a { color: #1668e3; text-align: center; font-size: 13px; padding: 8px; text-decoration: underline; }

/* מטרות מגע תקניות — 44px, גם במקלדת וגם באצבע */
.a11y-grid button, .a11y-reset, .a11y-panel > a, .a11y-open { min-height: 44px; }

/* ── מצבי הצבע ──────────────────────────────────────────
 *
 * ── הבאג שתיקן את הסלקטור הזה ──────────────────────
 *
 * filter הוחל קודם על body. כל ערך filter שאינו none הופך
 * את האלמנט ל-containing block של צאצאים ב-position:fixed —
 * ולכן ברגע שהופעלה ניגודיות, כפתור הנגישות עצמו ופס
 * העוגיות הפסיקו להימדד מול החלון והתחילו להימדד מול body.
 * body גבוה כגובה הדף, ו-bottom:18px הצניח אותם לתחתית
 * המסמך. הכלי שאמור לעזור ברח לפוטר בדיוק כשלחצו עליו.
 *
 * הסינון חל עכשיו על ילדי body פרט לשכבות הצפות עצמן.
 */
html.a11y-contrast body > :not(.a11y):not(.cookie):not(.a11y-ruler) { filter: contrast(1.4) saturate(1.25); }
html.a11y-gray     body > :not(.a11y):not(.cookie):not(.a11y-ruler) { filter: grayscale(1) contrast(1.12); }
html.a11y-invert   body > :not(.a11y):not(.cookie):not(.a11y-ruler) { filter: invert(1) hue-rotate(180deg); }
html.a11y-invert { background: #fff; }

/* הדגשת קישורים — קו תחתון ומסגרת, לא רק צבע */
html.a11y-links a {
  text-decoration: underline !important;
  text-underline-offset: 3px;
  outline: 1px dashed currentColor; outline-offset: 2px;
}

/* הדגשת כותרות — לניווט מהיר במבט, לא רק בקורא מסך */
html.a11y-titles :is(h1, h2, h3, h4) {
  outline: 2px dashed currentColor; outline-offset: 5px;
  border-radius: 3px;
}

/*
   גופן קריא.
   Arial ולא גופן "דיסלקטי" ייעודי: הוא קיים בכל מכשיר, ולכן
   הוא באמת נטען — בניגוד לגופן שצריך להוריד ושעד שהוא מגיע
   הטקסט קופץ.
*/
html.a11y-font, html.a11y-font * {
  font-family: Arial, "Helvetica Neue", "Segoe UI", sans-serif !important;
  letter-spacing: normal !important;
}

html.a11y-spacing p,
html.a11y-spacing li,
html.a11y-spacing span,
html.a11y-spacing a,
html.a11y-spacing td {
  line-height: 2 !important;
  letter-spacing: .055em !important;
  word-spacing: .14em !important;
}

/* סמן גדול — חץ בגודל כפול, בניגוד גבוה */
html.a11y-cursor, html.a11y-cursor * {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 24 24'%3E%3Cpath d='M5 2l14 10.5-6.2 1.1L16 21l-3 1.2-3.2-7.2L5 19z' fill='%23fff' stroke='%23000' stroke-width='1.4' stroke-linejoin='round'/%3E%3C/svg%3E") 4 2, auto !important;
}
html.a11y-cursor a, html.a11y-cursor button, html.a11y-cursor [role='button'] {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 24 24'%3E%3Cpath d='M9 11V5.5a1.5 1.5 0 0 1 3 0V11m0-1.5a1.5 1.5 0 0 1 3 0V12m0-1.5a1.5 1.5 0 0 1 3 0V13c0 4.5-2 8-5.5 8S7 18.5 6 15l-1.5-3a1.6 1.6 0 0 1 2.6-1.8L9 12.5' fill='%23fff' stroke='%23000' stroke-width='1.4' stroke-linejoin='round'/%3E%3C/svg%3E") 10 2, pointer !important;
}

/*
   מדריך קריאה.
   ילד ישיר של body ומחוץ לסלקטור הסינון, אחרת מצב "ניגודיות
   הפוכה" היה הופך גם אותו ומעלים אותו על רקע בהיר.
*/
.a11y-ruler {
  position: fixed; inset-inline: 0; top: 0; height: 44px;
  z-index: 880; pointer-events: none;
  border-top: 2px solid #F79009; border-bottom: 2px solid #F79009;
  background: rgba(247, 144, 9, .12);
}

/*
   עצירת תנועה.
   נדרש למי שסובל מרגישות לתנועה, והרקע שלנו נע כל הזמן.
*/
html.a11y-still *,
html.a11y-still *::before,
html.a11y-still *::after {
  animation: none !important;
  transition: none !important;
  offset-path: none !important;
  scroll-behavior: auto !important;
}

/* מכבד גם את הגדרת המערכת, בלי שהמשתמש יצטרך לבקש */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
    offset-path: none !important;
  }
}

/*
   סימון מיקוד ברור.
   בלעדיו ניווט במקלדת הוא ניחוש — והוא הדרך היחידה של חלק
   מהמשתמשים לעבור בדף.
*/
a:focus-visible, button:focus-visible, input:focus-visible, [tabindex]:focus-visible {
  outline: 3px solid #F79009; outline-offset: 2px; border-radius: 4px;
}

/* דילוג לתוכן — הדבר הראשון שמקלדת מגיעה אליו */
.skip {
  position: absolute; inset-inline-start: 12px; top: -60px; z-index: 1000;
  max-width: calc(100% - 24px);
  background: #0E1A30; color: #fff; padding: 11px 16px; border-radius: 0 0 8px 8px;
  text-decoration: none; font-weight: 700;
  transition: top .15s;
}
.skip:focus { top: 0; }

@media (max-width: 560px) {
  .a11y { inset-inline-start: 12px; inset-inline-end: 12px; bottom: 12px; }
  /* במסך צר הפאנל נפתח לכל הרוחב — ארגז של שתי עמודות
     ב-196 פיקסל הוא ארגז שאי אפשר ללחוץ בו */
  .a11y-panel { width: auto; inset-inline: 0; }
}

/* ═══ הודעת העוגיות ════════════════════════════════════ */

.cookie {
  position: fixed; inset-inline: 0; bottom: 0; z-index: 890;
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  justify-content: center;
  padding: 14px 20px;
  background: #0E1A30; color: #dbe5f2;
  border-top: 2px solid #F79009;
  font-size: 14px; line-height: 1.6;
}
.cookie p { margin: 0; max-width: 72ch; }
.cookie strong { color: #fff; }
.cookie a { color: #F79009; }
.cookie button {
  font: inherit; font-weight: 800; min-height: 44px;
  padding: 10px 26px; border: 0; border-radius: 9px;
  background: #F79009; color: #1A1206; cursor: pointer;
}
.cookie button:hover { background: #ffa726; }

/* הכפתור הצף יושב מעל הפס, לא מתחתיו */
.cookie ~ .a11y { bottom: 92px; }

@media (max-width: 700px) {
  .cookie { flex-direction: column; align-items: stretch; text-align: center; }
  .cookie button { width: 100%; }
}