/* a11y.css — עיצוב רכיב הנגישות (כפתור + פאנל) ומצבי הנגישות הגלובליים.
   קובץ עצמאי, נטען בכל עמוד (גם דף הבית עם site.css, גם דפי המידע
   המשפטיים עם css/legal.css). הווידג'ט עצמו (.a11y-root) חייב להישאר
   קריא ותקין תמיד, לכן צבעיו קבועים ולא תלויים במשתני הצבע של האתר. */

/* ============================================================
   ווידג'ט - כפתור פתיחה ופאנל
   ============================================================ */
.a11y-root{
  font-family: inherit;
  direction: rtl;
}

.a11y-toggle{
  position: fixed;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  z-index: 99999;
  width: 52px;
  height: 52px;
  min-width: 44px;
  min-height: 44px;
  border: none;
  border-radius: 0 14px 14px 0;
  background: #1e3a8a;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(0,0,0,.3);
}
.a11y-toggle:hover{ background: #152a63; }

.a11y-panel{
  position: fixed;
  left: 62px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 99999;
  width: min(320px, calc(100vw - 76px));
  max-height: calc(100vh - 32px);
  overflow-y: auto;
  background: #ffffff;
  color: #111827;
  border: 1px solid #d1d5db;
  border-radius: 16px;
  box-shadow: 0 20px 48px rgba(0,0,0,.32);
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.a11y-panel[hidden]{ display: none; }

.a11y-panel-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.a11y-panel-title{
  font-family: 'Heebo', Arial, sans-serif;
  font-size: 1.0625rem;
  font-weight: 700;
  color: #111827;
  margin: 0;
}

.a11y-close{
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  background: #f3f4f6;
  color: #111827;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.a11y-close:hover{ background: #e5e7eb; }

.a11y-list{
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.a11y-btn{
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 44px;
  font-family: inherit;
  font-size: 0.9375rem;
  font-weight: 500;
  color: #111827;
  background: #eef2fb;
  border: 1px solid transparent;
  border-radius: 10px;
  padding: 10px 12px;
  cursor: pointer;
  text-align: right;
}
.a11y-btn:hover{ filter: brightness(0.97); }
.a11y-btn[aria-pressed="true"]{
  background: #1e3a8a;
  color: #ffffff;
}
.a11y-btn-icon{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
}
.a11y-btn-label{ flex: 1; }
.a11y-text-pct{
  font-size: 0.8125rem;
  font-weight: 700;
  opacity: .85;
}

.a11y-reset{
  background: #f3f4f6;
  border: 1px solid #d1d5db;
  color: #111827;
}
.a11y-reset:hover{ background: #e5e7eb; }

.a11y-statement-link{
  font-size: 0.8125rem;
  text-align: center;
  color: #1e3a8a;
  text-decoration: underline;
  margin-top: 2px;
}

/* אזור הכרזות לקוראי מסך - מוסתר חזותית, נשמע */
.a11y-announcer{
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
  padding: 0;
  margin: -1px;
}

/* מיקוד ברור על כל רכיבי הווידג'ט עצמם, תמיד (גם בלי מצב "הדגשת פוקוס") */
.a11y-root button:focus-visible,
.a11y-root a:focus-visible{
  outline: 3px solid #ff8c00;
  outline-offset: 2px;
}

@media (max-width: 480px){
  .a11y-panel{
    left: 8px;
    width: calc(100vw - 16px);
  }
}

@media (prefers-reduced-motion: reduce){
  .a11y-panel{ transition: none; }
}

/* ============================================================
   מצבי נגישות גלובליים - מופעלים דרך מחלקות על html
   ============================================================ */

/* --- גודל טקסט --- */
html.a11y-text--2{ font-size: 85%; }
html.a11y-text--1{ font-size: 92%; }
html.a11y-text-1{ font-size: 112%; }
html.a11y-text-2{ font-size: 125%; }
html.a11y-text-3{ font-size: 140%; }
html.a11y-text-4{ font-size: 160%; }

/* --- גווני אפור / ניגודיות הפוכה ---
   הפילטר לא מופעל על html (זה שובר position:fixed של הווידג'ט), אלא
   על כל ילד ישיר של body חוץ מהווידג'ט עצמו. ה-header של האתר הוא
   position:sticky וילד ישיר של body - זה נשאר תקין תחת פילטר. */
html.a11y-grayscale body > :not(.a11y-root){
  filter: grayscale(1);
}

html.a11y-invert body > :not(.a11y-root){
  filter: invert(1) hue-rotate(180deg);
}
/* תמונות ווידאו הופכים פעמיים, כדי לחזור לצבעים הטבעיים שלהם */
html.a11y-invert body > :not(.a11y-root) img,
html.a11y-invert body > :not(.a11y-root) video{
  filter: invert(1) hue-rotate(180deg);
}
/* שני הפילטרים יחד: שני מאפייני filter נפרדים דורסים זה את זה, לכן כלל
   משולב כשגם גווני אפור וגם ניגודיות הפוכה פעילים */
html.a11y-grayscale.a11y-invert body > :not(.a11y-root){
  filter: grayscale(1) invert(1) hue-rotate(180deg);
}

/* --- ניגודיות גבוהה --- */
html.a11y-contrast{
  --bg: #ffffff;
  --navy: #000000;
  --blue: #001a75;
  --green: #0a6b2a;
  --green-dark: #0a6b2a;
  --text-1: #000000;
  --text-2: #1a1a1a;
  --text-3: #262626;
  --text-4: #333333;
  --border: #000000;
  --border-2: #000000;
  --badge-blue-bg: #dbe4ff;
}
html.a11y-contrast body{ background: #ffffff; }
html.a11y-contrast a{ text-decoration: underline; }
html.a11y-contrast .download-dark,
html.a11y-contrast .contact-card,
html.a11y-contrast .site-header{
  background: #000000;
  color: #ffffff;
}
html.a11y-contrast .download-dark > .download-main > p,
html.a11y-contrast .download-note,
html.a11y-contrast .contact-card p,
html.a11y-contrast .download-meta{ color: #ffffff; }
html.a11y-contrast .main-nav a,
html.a11y-contrast .brand-name{ color: #ffffff; }
html.a11y-contrast .soon-text{ color: #ffffff; }

/* --- רקע בהיר --- */
html.a11y-light-bg body,
html.a11y-light-bg body *:not(.a11y-root):not(.a11y-root *){
  background-color: #ffffff !important;
  background-image: none !important;
  color: #000000 !important;
  border-color: #4b5563 !important;
}
html.a11y-light-bg img,
html.a11y-light-bg video,
html.a11y-light-bg body *:not(.a11y-root) svg{
  background-color: transparent !important;
}
/* הבטחה מפורשת לאזורים הכהים הידועים באתר ובדפי המידע */
html.a11y-light-bg .download-dark,
html.a11y-light-bg .contact-card,
html.a11y-light-bg .site-header,
html.a11y-light-bg .wrap{
  background-color: #ffffff !important;
  background-image: none !important;
  color: #000000 !important;
  border-color: #4b5563 !important;
}
html.a11y-light-bg .download-dark *,
html.a11y-light-bg .contact-card *{
  color: #000000 !important;
}

/* --- הדגשת קישורים --- */
/* ספציפיות גבוהה מכללי "רקע בהיר" (שגם הם !important), כדי שההדגשה
   הצהובה תנצח כששני המצבים פעילים יחד */
html.a11y-links a,
html.a11y-links.a11y-light-bg body a:not(.a11y-root *){
  text-decoration: underline !important;
  outline: 2px solid #111827 !important;
  outline-offset: 1px;
  background: #fff3a8 !important;
  color: #000000 !important;
}

/* --- פונט קריא --- */
html.a11y-font,
html.a11y-font *{
  font-family: Arial, Helvetica, sans-serif !important;
  letter-spacing: 0.02em;
}

/* --- עצירת אנימציות --- */
html.a11y-no-motion *,
html.a11y-no-motion *::before,
html.a11y-no-motion *::after{
  animation-duration: 0.001ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: 0.001ms !important;
  scroll-behavior: auto !important;
}
html.a11y-no-motion .app-carousel img.shot{ opacity: 0; }
html.a11y-no-motion .app-carousel img.shot.first{ opacity: 1; }

/* --- הדגשת פוקוס מקלדת --- */
html.a11y-focus *:focus{
  outline: 4px solid #ff8c00 !important;
  outline-offset: 2px !important;
}

/* --- סמן גדול ---
   חץ שחור עם קו מתאר לבן, 48x48, נקודת העיגון בפינה השמאלית-עליונה */
html.a11y-cursor,
html.a11y-cursor *{
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48'%3E%3Cpath d='M4 2 L4 38 L14 29 L20 44 L26 42 L20 27 L34 27 Z' fill='black' stroke='white' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E") 4 4, auto !important;
}