/* ═══════════════════════════════════════════════════════════════════════════
   תפריט הנגישות · האפקטים עצמם.

   כל מצב נתלה על מאפיין ב-<html>, כך שאפשר לכבות הכול במחיקת מאפיין אחד.
   הלוח עצמו (.a11y-panel, .a11y-fab) מוחרג מכל אפקט שעלול להפוך אותו ללא
   שמיש · אחרת מי שהדליק ניגודיות גבוהה לא יכול לכבות אותה.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── גודל טקסט · zoom ולא transform, כי transform שובר פריסה ───────────── */
html[data-a11y-zoom="1"]  { zoom: 1.1;  --a11y-z: 1.1; }
html[data-a11y-zoom="2"]  { zoom: 1.25; --a11y-z: 1.25; }
html[data-a11y-zoom="3"]  { zoom: 1.4;  --a11y-z: 1.4; }
html[data-a11y-zoom="-1"] { zoom: .9;   --a11y-z: .9; }
/* ‎--a11y-z‎: יחידות המסך (vh, dvh, vw) לא מתכווצות עם ה-zoom, אז פאנל בגובה ‎100dvh‎ יוצא מתחת למסך.
   מי שמודד לפי המסך מחלק בו: ‎calc(100dvh / var(--a11y-z, 1) - …)‎ */

/* ── ניגודיות גבוהה ───────────────────────────────────────────────────── */
/* החרגת הלוח נעשית בתוך :where() · הוא תורם אפס לספציפיות, ולכן כלל-הכול
   נשאר נמוך וכללי הקישור, הכפתור והשדה שאחריו גוברים עליו כמו שצריך.
   בלי זה הקישורים יצאו לבנים במקום צהובים, וזה מה שקרה בבדיקה הראשונה. */
html[data-a11y-contrast] body,
html[data-a11y-contrast] body *:not(:where(.a11y-panel, .a11y-panel *, .a11y-fab, .a11y-fab *)) {
  background-color: #000 !important;
  background-image: none !important;
  color: #fff !important;
  border-color: #fff !important;
  text-shadow: none !important;
  box-shadow: none !important;
}
html[data-a11y-contrast] body a:not(:where(.a11y-panel, .a11y-panel *, .a11y-fab, .a11y-fab *)) {
  color: #ffe600 !important;
  text-decoration: underline !important;
}
html[data-a11y-contrast] body button:not(:where(.a11y-panel, .a11y-panel *, .a11y-fab, .a11y-fab *)),
html[data-a11y-contrast] body input:not(:where(.a11y-panel *)),
html[data-a11y-contrast] body textarea:not(:where(.a11y-panel *)),
html[data-a11y-contrast] body select:not(:where(.a11y-panel *)) {
  background-color: #000 !important; color: #fff !important; border: 1px solid #fff !important;
}
/* תמונות ו-SVG נשארים גלויים · הפיכתם לשחור מוחקת מידע */
html[data-a11y-contrast] body img,
html[data-a11y-contrast] body video { background: transparent !important; }
html[data-a11y-contrast] body svg:not(:where(.a11y-panel *, .a11y-fab *)) { color: #fff !important; }
html[data-a11y-contrast] body ::placeholder { color: #d0d0d0 !important; }
html[data-a11y-contrast] body :focus-visible { outline: 3px solid #ffe600 !important; outline-offset: 2px; }

/* ── גווני אפור ───────────────────────────────────────────────────────── */
/* הפילטר על body ולא על html · על html הוא יוצר מיכל חדש ל-position:fixed
   וכל הרכיבים הצפים קופצים ממקומם. */
html[data-a11y-mono] body { filter: grayscale(1); }

/* ── הדגשת קישורים ────────────────────────────────────────────────────── */
html[data-a11y-links] a:not(.a11y-panel a) {
  text-decoration: underline !important;
  text-underline-offset: 3px;
  text-decoration-thickness: 2px !important;
  outline: 1px dashed currentColor; outline-offset: 2px;
}

/* ── עצירת אנימציות ───────────────────────────────────────────────────── */
/* ה-CSS עוצר אנימציות ומעברים. טיימרים ב-JS אינם נעצרים מ-CSS, ולכן
   a11y-menu.js מדליק גם את window.scaylaReduce ומרענן · אותו מתג שכבר
   מכבה את הבמה בדף הבית. */
html[data-a11y-still] *,
html[data-a11y-still] *::before,
html[data-a11y-still] *::after {
  animation-duration: .001ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: .001ms !important;
  scroll-behavior: auto !important;
}

/* ── גופן קריא ────────────────────────────────────────────────────────── */
html[data-a11y-font] body,
html[data-a11y-font] body *:not(.a11y-panel):not(.a11y-panel *) {
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif !important;
  letter-spacing: normal !important;
  font-variant-ligatures: none !important;
}

/* ── ריווח שורות ──────────────────────────────────────────────────────── */
html[data-a11y-space] body p,
html[data-a11y-space] body li,
html[data-a11y-space] body dd,
html[data-a11y-space] body td,
html[data-a11y-space] body th,
html[data-a11y-space] body blockquote {
  line-height: 1.9 !important;
  letter-spacing: .04em !important;
  word-spacing: .12em !important;
}

/* ── סמן גדול ─────────────────────────────────────────────────────────── */
html[data-a11y-cursor] body,
html[data-a11y-cursor] body * {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cpath d='M10 4 38 24 25 26 32 41 26 44 19 29 10 36Z' fill='%23fff' stroke='%23000' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") 6 4, auto !important;
}
html[data-a11y-cursor] body a,
html[data-a11y-cursor] body button,
html[data-a11y-cursor] body [role="button"],
html[data-a11y-cursor] body summary,
html[data-a11y-cursor] body label {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cpath d='M18 4c-2 0-3 1.4-3 3v17l-4-4c-1.6-1.6-4-1.6-5.4 0-1.5 1.5-1.5 3.9 0 5.4l11 13c1.4 1.7 3 2.6 5 2.6h10c3.9 0 7-3.1 7-7V20c0-1.7-1.3-3-3-3s-3 1.3-3 3v-2c0-1.7-1.3-3-3-3s-3 1.3-3 3v-2c0-1.7-1.3-3-3-3s-3 1.3-3 3V7c0-1.6-1.3-3-3-3Z' fill='%23fff' stroke='%23000' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") 14 4, pointer !important;
}