/* Secretus - תפריט הנגישות (a11y.js), בכל העמודים: index.html, privacy.html, accessibility.html, terms.html.
   כפתור עגול קבוע בפינה השמאלית התחתונה (לא מכסה את הכפתור הראשי, שבצד ימין או במרכז), ופאנל קטן שנפתח מעליו.
   בלי JS הכפתור לא קיים, והקישור להצהרת הנגישות בפוטר נשאר.
   ההגדרות הן מחלקות על html, ש-a11y.js מוסיף לפני שהדף מוצג:
     a11y-text-1, a11y-text-2  הגדלת טקסט (115% ו-130%): zoom על התוכן (main) ועל הפוטר, בלי הכותרת העליונה, שלא נכנסת
                               בטלפון בגודל גדול יותר. הפריסה נשארת לפי רוחב המסך, כמו בהגדלה של הדפדפן
     a11y-contrast             ניגודיות גבוהה: הטקסט כהה יותר, הקווים בולטים יותר והכפתור הראשי כהה עם טקסט לבן
     a11y-links                הדגשת קישורים: קו תחתון עבה ורקע כתום בהיר
     a11y-still                עצירת אנימציות: בלי מעברים ובלי אנימציות. a11y.js גם מוריד את motion מ-html ועוצר את הסרטונים
   רק המשתנים של styles.css (הצבעים בניגודיות גבוהה הם ערכים שכבר קיימים בפלטה), ותנועה רק ב-transform. */

/* ===== הכפתור ===== */
.a11y-btn { position: fixed; left: max(16px, env(safe-area-inset-left)); bottom: max(16px, env(safe-area-inset-bottom)); z-index: 60; display: grid; place-items: center; width: 52px; height: 52px; padding: 0; border: 0; border-radius: 50%; background: var(--ink); color: var(--white); box-shadow: 0 0 0 2px var(--white); cursor: pointer; }
.a11y-btn:hover { background: var(--ink-2); }
.a11y-btn[aria-expanded="true"] { background: var(--teal-ink); }
.a11y-btn svg { width: 30px; height: 30px; }
/* כשכפתור מהתוכן עובר מתחתיו בגלילה (a11y.js), הכפתור נעלם עד שהוא עובר, כדי שלא יכסה אותו */
.a11y-btn.is-tucked { opacity: 0; visibility: hidden; pointer-events: none; }
@media (prefers-reduced-motion: no-preference) {
  .a11y-btn { transition: opacity var(--dur-1) var(--ease), visibility 0s linear 0s; }
  .a11y-btn.is-tucked { transition: opacity var(--dur-1) var(--ease), visibility 0s linear var(--dur-1); }
}

/* ===== הפאנל: לבן, קו דק וצל קטן (כמו התפריט בטלפון), מעל הכפתור ===== */
.a11y-panel { position: fixed; left: max(16px, env(safe-area-inset-left)); bottom: calc(max(16px, env(safe-area-inset-bottom)) + 64px); z-index: 60; width: min(320px, calc(100vw - 32px)); max-height: calc(100vh - 112px); overflow: auto; overscroll-behavior: contain; padding: 14px 16px 16px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--white); color: var(--ink-2); box-shadow: 0 6px 20px -16px rgba(10, 37, 50, .4); font-size: var(--fs-small); line-height: 1.45; }
@supports (height: 100dvh) {
  .a11y-panel { max-height: calc(100dvh - 112px); }
}
.a11y-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.a11y-title { color: var(--ink); font-size: var(--fs-h3); line-height: 1.3; }
.a11y-close { display: grid; place-items: center; width: 40px; height: 40px; flex: none; margin-inline-end: -8px; padding: 0; border: 0; border-radius: 10px; background: transparent; color: var(--ink); cursor: pointer; }
.a11y-close:hover { background: var(--mint); }
.a11y-close svg { width: 22px; height: 22px; stroke-width: 2; }
.a11y-label { margin-bottom: 8px; color: var(--ink); font-weight: 700; }

/* גודל הטקסט: שלושה כפתורים בשורה, הנבחר כהה */
.a11y-seg { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.a11y-seg button { min-height: 44px; padding: 4px 6px; border: 1px solid var(--line-field); border-radius: var(--r-sm); background: var(--white); color: var(--ink); font-size: var(--fs-small); font-weight: 500; line-height: 1.2; cursor: pointer; }
.a11y-seg button:hover { background: var(--mint); }
.a11y-seg button[aria-pressed="true"] { border-color: var(--ink); background: var(--ink); color: var(--white); font-weight: 700; }

/* מתגים: כפתור לכל הרוחב עם השם, ומתג קטן בצד (מימין לשמאל: כבוי בצד ימין, דולק בצד שמאל) */
.a11y-opts { display: grid; gap: 6px; margin-top: 14px; }
.a11y-opt { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 48px; padding: 8px 12px; border: 1px solid var(--line); border-radius: var(--r); background: var(--white); color: var(--ink); font-size: var(--fs-small); font-weight: 500; line-height: 1.3; text-align: start; cursor: pointer; }
.a11y-opt:hover { border-color: var(--teal-soft); background: var(--mint); }
.a11y-opt[aria-pressed="true"] { border-color: var(--teal-ink); font-weight: 700; }
.a11y-sw { position: relative; flex: none; width: 38px; height: 22px; border: 1.5px solid var(--line-field); border-radius: var(--r-pill); background: var(--white); }
.a11y-sw::after { content: ''; position: absolute; top: 3px; right: 3px; width: 13px; height: 13px; border-radius: 50%; background: var(--line-field); }
.a11y-opt[aria-pressed="true"] .a11y-sw { border-color: var(--teal-ink); background: var(--teal-ink); }
.a11y-opt[aria-pressed="true"] .a11y-sw::after { background: var(--white); transform: translateX(-16px); }
@media (prefers-reduced-motion: no-preference) {
  .a11y-sw::after { transition: transform var(--dur-1) var(--ease); }
}

.a11y-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); }
.a11y-reset { min-height: 44px; padding: 0 16px; border: 1px solid var(--line-field); border-radius: 10px; background: var(--white); color: var(--ink); font-size: var(--fs-small); font-weight: 700; cursor: pointer; }
.a11y-reset:hover { background: var(--mint); }
.a11y-link { display: inline-flex; align-items: center; min-height: 44px; color: var(--teal-ink); font-weight: 700; text-decoration: underline; text-decoration-color: rgba(35, 114, 114, .35); text-underline-offset: 4px; }
.a11y-link:hover { text-decoration-color: currentColor; }
.a11y-status { min-height: 0; margin-top: 8px; color: var(--muted); font-size: var(--fs-micro); }
.a11y-status:empty { display: none; }

/* הכפתור לא מכסה את סוף העמוד: מקום בתחתית הפוטר, כשהתוכן מגיע עד הפינה (עד 1340px, אחר כך יש שוליים).
   ומה שמקבל פוקוס מהמקלדת נגלל מעל הכפתור */
.a11y-ready { scroll-padding-bottom: 80px; }
@media (max-width: 1339px) {
  .a11y-ready .site-footer { padding-bottom: 68px; }
}

/* בטלפון הסמל בפתיח ממורכז, והכפתור שעוצר אותו (.art-ctl, בפינה השמאלית העליונה של הסמל) נופל בדיוק בטור של כפתור
   הנגישות. כשיש תפריט, הוא עובר לפינה הימנית העליונה של הסמל, כדי ששני הכפתורים יישארו גלויים, גם בטעינה וגם בגלילה */
@media (max-width: 479px) {
  .a11y-ready .art-ctl { left: auto; right: 0; }
}

/* ===== הגדלת טקסט ===== */
.a11y-text-1 main, .a11y-text-1 .site-footer { zoom: 1.15; }
.a11y-text-2 main, .a11y-text-2 .site-footer { zoom: 1.3; }
/* בטלפון, בטקסט גדול: הפוטר בטור אחד, כדי שהמייל (בלי שבירה) ייכנס */
@media (max-width: 479px) {
  .a11y-text-1 .footer-inner, .a11y-text-2 .footer-inner { grid-template-columns: minmax(0, 1fr); }
}

/* ===== ניגודיות גבוהה: אותם משתנים, בגוונים הכהים של הפלטה ===== */
html.a11y-contrast {
  --ink-2: #0A2532;
  --muted: #24394A;
  --teal-ink: #0A2532;
  --teal: #237272;
  --line: #7D9199;
  --line-mint: #7D9199;
  --line-strong: #56707A;
  --line-field: #24394A;
}
.a11y-contrast .btn-primary { background: var(--ink); color: var(--white); }
.a11y-contrast .btn-primary:hover { background: #24394A; }
.a11y-contrast a { text-decoration-color: currentColor; }

/* ===== הדגשת קישורים ===== */
.a11y-links a:not(.skip-link) { text-decoration-line: underline !important; text-decoration-thickness: 2px !important; text-decoration-color: currentColor !important; text-underline-offset: 4px !important; }
.a11y-links a:not(.skip-link):not(.btn) { border-radius: 3px; background-color: var(--coral-tint); color: var(--ink) !important; -webkit-box-decoration-break: clone; box-decoration-break: clone; }

/* ===== עצירת אנימציות ===== */
.a11y-still, .a11y-still *, .a11y-still *::before, .a11y-still *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }

@media print {
  .a11y-btn, .a11y-panel { display: none !important; }
}