/* ===========================================================================
   תפריט נגישות — inc/a11y-menu.php, assets/js/a11y-menu.js

   חלק א: הכפתור והלוח. מידות הלוח בפיקסלים ולא ב-rem, כדי שלא
   יגדל ויברח מהמסך כשהגולש מגדיל את הטקסט באתר.
   חלק ב: המצבים. כל מצב = מחלקה hac-a11y-<key> על <html>.
   =========================================================================== */

/* --- א. הכפתור --------------------------------------------------------- */

.hac-a11y__open {
  position: fixed;
  inset-block-end: 16px;
  inset-inline-start: 16px;
  z-index: 9990;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: 52px;
  block-size: 52px;
  padding: 0;
  border: 2px solid var(--wp--preset--color--surface);
  border-radius: 50%;
  background: #0B4F8A;
  color: #FFFFFF;
  fill: currentColor;
  box-shadow: 0 2px 10px rgba(0, 0, 0, .3);
  cursor: pointer;
}
.hac-a11y__open:hover { background: #083B68; }
.hac-a11y__open:focus-visible,
.hac-a11y button:focus-visible,
.hac-a11y a:focus-visible {
  outline: 3px solid #F0B92A;
  outline-offset: 3px;
}
.hac-a11y__open[hidden],
.hac-a11y__panel[hidden] { display: none; }

.hac-a11y__label {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

/* --- א. הלוח ----------------------------------------------------------- */

.hac-a11y__panel {
  position: fixed;
  inset-block-end: 80px;
  inset-inline-start: 16px;
  z-index: 9991;
  inline-size: min(340px, calc(100vw - 32px));
  max-block-size: calc(100vh - 100px);
  overflow-y: auto;
  padding: 16px;
  border: 2px solid #16150F;
  border-radius: 10px;
  background: #FFFFFF;
  color: #16150F;
  font: 16px/1.4 Arial, "Noto Sans Hebrew", sans-serif;
  letter-spacing: normal;
  word-spacing: normal;
  box-shadow: 0 6px 28px rgba(0, 0, 0, .35);
  filter: none;
}

.hac-a11y__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-block-end: 12px;
}
.hac-a11y__title {
  margin: 0;
  font: 700 19px/1.3 Arial, "Noto Sans Hebrew", sans-serif;
  color: inherit;
}
.hac-a11y__close {
  inline-size: 40px;
  block-size: 40px;
  border: 1px solid #57534A;
  border-radius: 6px;
  background: #FFFFFF;
  color: #16150F;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
}

.hac-a11y__size {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-block-end: 12px;
  padding: 8px 10px;
  border: 1px solid #C9C2B5;
  border-radius: 8px;
}
.hac-a11y__size > span { flex: 1; font-weight: 700; }
.hac-a11y__size-value { min-inline-size: 48px; text-align: center; }

.hac-a11y__list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.hac-a11y__list li { margin: 0; }

.hac-a11y__toggle,
.hac-a11y__step,
.hac-a11y__reset {
  min-block-size: 44px;
  border: 1px solid #57534A;
  border-radius: 8px;
  background: #F7F5F0;
  color: #16150F;
  font: inherit;
  cursor: pointer;
}
.hac-a11y__toggle {
  inline-size: 100%;
  padding: 8px;
  text-align: start;
}
.hac-a11y__step { min-inline-size: 44px; font-weight: 700; }
.hac-a11y__step:disabled { opacity: .45; cursor: default; }
.hac-a11y__toggle:hover,
.hac-a11y__step:hover:not(:disabled),
.hac-a11y__reset:hover { border-color: #0B4F8A; }

/* הלחוץ מסומן גם בצבע וגם בסימן ✓ — לא רק בצבע (WCAG 1.4.1). */
.hac-a11y__toggle[aria-pressed="true"] {
  border: 2px solid #0B4F8A;
  background: #0B4F8A;
  color: #FFFFFF;
  font-weight: 700;
}
.hac-a11y__toggle[aria-pressed="true"]::before { content: "✓ "; }

.hac-a11y__foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-block-start: 14px;
}
.hac-a11y__reset { padding: 8px 14px; }
.hac-a11y__foot a { color: #0B4F8A; text-decoration: underline; }

@media print {
  .hac-a11y { display: none; }
}

/* --- ב. גודל טקסט ---------------------------------------------------------
   כל גדלי הגופן בתמה ב-rem (theme.json), ולכן מספיק לשנות את השורש. */

html.hac-a11y-size-1 { font-size: 115%; }
html.hac-a11y-size-2 { font-size: 130%; }
html.hac-a11y-size-3 { font-size: 150%; }
html.hac-a11y-size-4 { font-size: 175%; }

/* --- ב. ניגודיות גבוהה: לבן וצהוב על שחור ------------------------------
   הכלל הכללי עטוף ב-:where() כדי שהספציפיות שלו תישאר נמוכה,
   וכלל הקישורים (צהוב / כחול) יגבר עליו. */

html.hac-a11y-contrast {
  --wp--preset--color--ground: #000000;
  --wp--preset--color--surface: #000000;
  --wp--preset--color--surface-2: #000000;
  --wp--preset--color--ink: #FFFFFF;
  --wp--preset--color--ink-soft: #FFFFFF;
  --wp--preset--color--ink-faint: #FFFFFF;
  --wp--preset--color--line: #FFFFFF;
  --wp--preset--color--line-strong: #FFFFFF;
  --wp--preset--color--steel: #FFFFFF;
  --hac-band-ink-soft: #FFFFFF;
}
html.hac-a11y-contrast body,
html.hac-a11y-contrast .wp-site-blocks,
html.hac-a11y-contrast .wp-site-blocks :where(*:not(img, video, svg, svg *)) {
  background-color: #000000 !important;
  color: #FFFFFF !important;
  border-color: #FFFFFF !important;
  text-shadow: none !important;
  box-shadow: none !important;
}
html.hac-a11y-contrast .wp-site-blocks a,
html.hac-a11y-contrast .wp-site-blocks a * {
  color: #FFEB3B !important;
  text-decoration: underline !important;
}
html.hac-a11y-contrast .wp-site-blocks svg { fill: currentColor; }
/* כפתורי ההנעה צבועים ב-background-image (מעבר צבע), שהכלל הכללי
   לא מכסה — בלעדי זה יוצא טקסט צהוב על כפתור צהוב. */
html.hac-a11y-contrast .wp-site-blocks :is(.wp-block-button__link, .wp-element-button, button) {
  background-image: none !important;
  border: 2px solid #FFEB3B !important;
}

/* --- ב. רקע בהיר: שחור על לבן ------------------------------------------- */

html.hac-a11y-light {
  --wp--preset--color--ground: #FFFFFF;
  --wp--preset--color--surface: #FFFFFF;
  --wp--preset--color--surface-2: #FFFFFF;
  --wp--preset--color--ink: #000000;
  --wp--preset--color--ink-soft: #000000;
  --wp--preset--color--ink-faint: #000000;
  --wp--preset--color--line: #000000;
  --wp--preset--color--line-strong: #000000;
  --wp--preset--color--steel: #000000;
  --hac-band-ink-soft: #000000;
  color-scheme: light;
}
html.hac-a11y-light body,
html.hac-a11y-light .wp-site-blocks,
html.hac-a11y-light .wp-site-blocks :where(*:not(img, video, svg, svg *)) {
  background-color: #FFFFFF !important;
  color: #000000 !important;
  border-color: #000000 !important;
  text-shadow: none !important;
}
html.hac-a11y-light .wp-site-blocks :is(.wp-block-button__link, .wp-element-button, button) {
  background-image: none !important;
  border: 2px solid #000000 !important;
}
html.hac-a11y-light .wp-site-blocks a,
html.hac-a11y-light .wp-site-blocks a * {
  color: #0000CC !important;
  text-decoration: underline !important;
}

/* --- ב. גווני אפור ------------------------------------------------------
   על התוכן בלבד ולא על <html>: filter על השורש היה הופך אותו
   ל-containing block ושובר את הכפתור הקבוע. */

html.hac-a11y-mono .wp-site-blocks { filter: grayscale(1); }

/* --- ב. הדגשת קישורים וכותרות ------------------------------------------ */

html.hac-a11y-links .wp-site-blocks a {
  text-decoration: underline !important;
  text-decoration-thickness: 2px !important;
  text-underline-offset: .2em;
  font-weight: 700 !important;
  outline: 2px dashed currentColor;
  outline-offset: 2px;
}

html.hac-a11y-headings .wp-site-blocks :is(h1, h2, h3, h4, h5, h6) {
  outline: 3px solid currentColor;
  outline-offset: 4px;
  text-decoration: underline;
  text-underline-offset: .2em;
}

/* --- ב. גופן קריא ------------------------------------------------------- */

html.hac-a11y-font .wp-site-blocks,
html.hac-a11y-font .wp-site-blocks *:not(svg):not(svg *) {
  font-family: Arial, "Noto Sans Hebrew", "Helvetica Neue", sans-serif !important;
}

/* --- ב. ריווח טקסט — הערכים של WCAG 1.4.12 ----------------------------- */

html.hac-a11y-spacing .wp-site-blocks * {
  line-height: 1.5 !important;
  letter-spacing: .12em !important;
  word-spacing: .16em !important;
}
html.hac-a11y-spacing .wp-site-blocks p { margin-block-end: 2em !important; }

/* --- ב. עצירת אנימציות ------------------------------------------------- */

html.hac-a11y-motion *,
html.hac-a11y-motion *::before,
html.hac-a11y-motion *::after {
  animation: none !important;
  transition: none !important;
  scroll-behavior: auto !important;
}

/* --- ב. סמן עכבר גדול ---------------------------------------------------- */

html.hac-a11y-cursor,
html.hac-a11y-cursor * {
  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='M6 4l0 36 10-9 7 15 7-3-7-15 13 0z' fill='%23000' stroke='%23fff' stroke-width='3' stroke-linejoin='round'/%3E%3C/svg%3E") 6 4, auto !important;
}
html.hac-a11y-cursor :is(a, button, [role="button"], label, select, summary),
html.hac-a11y-cursor :is(a, button, [role="button"], label, select, summary) * {
  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='M6 4l0 36 10-9 7 15 7-3-7-15 13 0z' fill='%230B4F8A' stroke='%23fff' stroke-width='3' stroke-linejoin='round'/%3E%3C/svg%3E") 6 4, pointer !important;
}

/* --- ב. הדגשת פוקוס ------------------------------------------------------ */

html.hac-a11y-focus :focus {
  outline: 4px solid #F0B92A !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 8px #000000 !important;
}
