/* ==========================================================================
   תפריט נגישות — כפתור צף + התאמות תצוגה. קוד מקומי בלבד (בלי תוסף חיצוני).
   ההתאמות פועלות דרך מחלקות על <html>, ונשמרות בדפדפן של הגולש.
   גרסה כללית של ערכת הנגישות (~/.claude/a11y-kit).

   צבעי המותג של הפרויקט: לשנות רק את המשתנים כאן — ואחר כך למדוד יחסי ניגודיות
   מחדש (לבן על --a11y-brand חייב ≥ 4.5:1; פוקוס מול הרקע ≥ 3:1). שרה דורשת מדידה,
   לא הערכה בעין, כי ההצהרה מתחייבת ל-AA.
   ========================================================================== */

:root {
  /* דוח נוכחות חודשי — נמדד ב-contrast.py (2026-11-02) */
  --a11y-brand: #1d5460;        /* לבן עליו — 8.44:1 (כמו --primary של האפליקציה) */
  --a11y-brand-dark: #16434d;   /* על לבן — 10.80:1 */
  --a11y-focus: #9a6600;        /* טבעת פוקוס — 4.91:1 מול לבן, 4.40:1 מול רקע הדף #f5f2ec (כמו --focus של האפליקציה) */
  --a11y-ink: #14262b;          /* טקסט החלונית על לבן — 15.65:1 */
  --a11y-z: 9999;               /* ב-Filament: 60, כדי להישאר מתחת למודאלים שלו */
  --a11y-offset: 16px;
}

.a11y-btn {
  position: fixed;
  bottom: var(--a11y-offset);
  z-index: var(--a11y-z);
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: 3px solid #ffffff;
  background: var(--a11y-brand);
  color: #ffffff;
  display: grid;
  place-items: center;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(3, 18, 30, .45);
  padding: 0;
}
/* צד פיזי (לא inset-inline): ב-RTL הצד הלוגי נוחת על סרגל הניווט */
.a11y-btn.a11y-side-left, .a11y-panel.a11y-side-left { left: var(--a11y-offset); }
.a11y-btn.a11y-side-right, .a11y-panel.a11y-side-right { right: var(--a11y-offset); }
.a11y-btn svg { width: 30px; height: 30px; }
.a11y-btn:hover { background: var(--a11y-brand-dark); }
.a11y-btn:focus-visible { outline: 4px solid var(--a11y-focus); outline-offset: 3px; }

.a11y-panel {
  position: fixed;
  bottom: calc(var(--a11y-offset) + 64px);
  z-index: var(--a11y-z);
  width: min(300px, calc(100vw - 32px));
  max-height: calc(100vh - 110px);
  overflow: auto;
  background: #ffffff;
  color: var(--a11y-ink);
  border: 2px solid var(--a11y-brand);
  border-radius: 14px;
  box-shadow: 0 10px 30px rgba(3, 18, 30, .45);
  padding: 1rem;
  direction: rtl;
  text-align: right;
  font-family: "Heebo", system-ui, "Segoe UI", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.5;
}
.a11y-panel[hidden] { display: none !important; }
.a11y-panel__title { margin: 0 0 .7rem; font-size: 1.1rem; font-weight: 800; color: var(--a11y-ink); }
.a11y-panel__group { margin: 0 0 .8rem; }
.a11y-panel__label { display: block; font-weight: 700; margin-block-end: .35rem; }
.a11y-panel__row { display: flex; gap: .4rem; }
.a11y-panel button {
  font: inherit;
  font-weight: 700;
  color: var(--a11y-brand-dark);
  background: #ffffff;
  border: 2px solid var(--a11y-brand);
  border-radius: 10px;
  padding: .45rem .6rem;
  cursor: pointer;
}
.a11y-panel button:disabled { opacity: .55; cursor: not-allowed; }
.a11y-panel__row button { flex: 1; }
.a11y-panel button[aria-pressed="true"] { background: var(--a11y-brand); color: #ffffff; }
.a11y-panel button:focus-visible { outline: 3px solid var(--a11y-focus); outline-offset: 2px; }
.a11y-toggles { display: grid; gap: .4rem; }
.a11y-toggles button { text-align: start; width: 100%; }
.a11y-panel__footer { display: flex; justify-content: space-between; align-items: center; gap: .5rem; margin-block-start: .6rem; padding-block-start: .6rem; border-block-start: 1px solid #d5dee7; }
.a11y-panel__footer a { color: var(--a11y-brand-dark); font-weight: 700; }
.a11y-panel__footer a:focus-visible { outline: 3px solid var(--a11y-focus); outline-offset: 2px; }

/* ---------- התאמות ---------- */

/* הגדלת טקסט: 3 דרגות דרך rem. אם האתר קובע font-size בפיקסלים על body —
   להוסיף כאן גם html.a11y-text-N body { font-size: … } (כמו באשדוד: 19/21/24px)
   ולוודא בדפדפן שהטקסט באמת גדל. */
html.a11y-text-1 { font-size: 112.5%; }
html.a11y-text-2 { font-size: 125%; }
html.a11y-text-3 { font-size: 140%; }

/* ניגודיות גבוהה: הרקעים מולבנים ב-JS (רק מה שכבר צובע רקע); כאן טקסט ומסגרות שחורים,
   קישורים כחולים עם קו תחתי. התפריט עצמו לא משתנה. */
html.a11y-contrast body { background: #ffffff !important; background-image: none !important; }
html.a11y-contrast body *:not(.a11y-btn):not(.a11y-btn *):not(.a11y-panel):not(.a11y-panel *) {
  color: #000000 !important;
  border-color: #000000 !important;
  text-shadow: none !important;
  box-shadow: none !important;
}
html.a11y-contrast body a:not(.a11y-panel a) { color: #0000ee !important; text-decoration: underline !important; }
html.a11y-contrast input, html.a11y-contrast select, html.a11y-contrast textarea { border: 2px solid #000000 !important; }
html.a11y-contrast svg:not(.a11y-btn svg) { color: #000000; }
html.a11y-contrast :focus-visible { outline: 4px solid #0000ee !important; outline-offset: 2px !important; }

/* גווני אפור — על <html>: filter על אלמנט השורש הוא היחיד שלא הופך לבלוק מכיל
   לאלמנטים fixed, כך שמודאלים, סרגלים דביקים והתפריט עצמו נשארים במקומם. */
html.a11y-grayscale { filter: grayscale(1); }

/* הדגשת קישורים */
html.a11y-links a { text-decoration: underline !important; text-underline-offset: 3px; outline: 2px dashed currentColor; outline-offset: 2px; font-weight: 700; }

/* גופן קריא: גופן מערכת פשוט, ריווח מוגדל */
/* Heebo כגיבוי אחרון: במערכות בלי Arial עברי (לינוקס מינימלי) העברית הופכת לריבועים */
html.a11y-font body, html.a11y-font body * { font-family: Arial, "Segoe UI", Tahoma, "Heebo", sans-serif !important; letter-spacing: .02em; word-spacing: .08em; }
html.a11y-font body p, html.a11y-font body li { line-height: 1.9 !important; }

/* עצירת אנימציות ומעברים */
html.a11y-motion *, html.a11y-motion *::before, html.a11y-motion *::after {
  animation: none !important; transition: none !important; scroll-behavior: auto !important;
}
html.a11y-motion video { animation-play-state: paused !important; }

/* סמן גדול */
html.a11y-cursor, html.a11y-cursor * {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'%3E%3Cpath d='M4 2l26 16-12 2 7 14-5 3-7-14-9 8z' fill='%23000' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E") 4 2, auto !important;
}

/* סימון מודגש למיקוד מקלדת */
html.a11y-focus :focus-visible, html.a11y-focus :focus { outline: 4px solid var(--a11y-focus) !important; outline-offset: 3px !important; box-shadow: 0 0 0 7px #000000 !important; }

@media (prefers-reduced-motion: reduce) { .a11y-btn, .a11y-panel { transition: none; } }
@media print { .a11y-btn, .a11y-panel { display: none !important; } }