/* ==========================================================================
   site-a11y.css · סרגל הנגישות והמצבים שלו · 5.11.2026 (TASK-accessibility)
   המצבים הם מחלקות על <html> (site-a11y.js מחיל אותן בראש הדף, לפני הציור).
   צבעים: מ-design-tokens.css. אין כאן צבע מותג חדש.
   ========================================================================== */

/* ---------- הכפתור הקבוע ---------- */
.a11y-root{position:fixed;z-index:2147483000;inset-inline-start:12px;bottom:12px;font-family:var(--rk-font-body);font-size:16px;line-height:1.4;color:var(--rk-text);direction:rtl}
.has-sticky .a11y-root{bottom:84px}
@media (min-width:760px){.has-sticky .a11y-root{bottom:12px}}
.a11y-fab{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;cursor:pointer;
  background:var(--rk-a11y-fab-bg);color:var(--rk-a11y-fab-fg);border:2px solid var(--rk-a11y-fab-ring);box-shadow:0 4px 14px rgba(11,16,64,.28)}
.a11y-fab:hover{background:var(--rk-color-ran-blue)}
.a11y-fab[aria-expanded="true"]{background:var(--rk-color-ran-blue)}
/* הכפתור לא מסתיר את סוף הדף: מקום בתחתית הפוטר */
body > footer{padding-bottom:76px}

/* ---------- החלון ---------- */
.a11y-panel{position:absolute;bottom:58px;inset-inline-start:0;width:min(360px,calc(100vw - 24px));max-height:min(78vh,640px);overflow:auto;
  background:var(--rk-bg);color:var(--rk-text);border:2px solid var(--rk-color-night);border-radius:var(--rk-radius-md);box-shadow:0 18px 50px rgba(11,16,64,.35);overscroll-behavior:contain}
.a11y-panel[hidden]{display:none}
.a11y-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px 10px 8px;background:var(--rk-color-night);color:#fff;position:sticky;top:0}
.a11y-head h2{font:800 20px/1.2 var(--rk-font-display);margin:0;color:#fff;letter-spacing:0}
.a11y-x{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;background:none;border:0;color:#fff;cursor:pointer}
.a11y-x:hover{background:rgba(255,255,255,.12)}
.a11y-body{padding:14px}
.a11y-size{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.a11y-size span{font-weight:700;flex:1}
.a11y-size button{min-width:52px;min-height:44px;border-radius:var(--rk-radius-sm);border:2px solid var(--rk-a11y-line);background:var(--rk-bg);color:var(--rk-text);font:800 17px var(--rk-font-body);cursor:pointer}
.a11y-size button:disabled{opacity:.45;cursor:not-allowed}
.a11y-size output{min-width:52px;text-align:center;font-weight:800}
.a11y-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.a11y-t{min-height:48px;padding:6px 10px;border-radius:var(--rk-radius-sm);border:2px solid var(--rk-a11y-line);background:var(--rk-bg);color:var(--rk-text);font:600 15px/1.25 var(--rk-font-body);text-align:start;cursor:pointer;position:relative}
.a11y-t[aria-pressed="true"]{background:var(--rk-color-night);border-color:var(--rk-color-night);color:#fff;padding-inline-start:28px}
.a11y-t[aria-pressed="true"]::before{content:"✓";position:absolute;inset-inline-start:9px;top:50%;transform:translateY(-50%);font-weight:800}
.a11y-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin-top:12px}
.a11y-reset{min-height:44px;padding:0 14px;border-radius:var(--rk-radius-sm);border:2px solid var(--rk-color-night);background:var(--rk-bg);color:var(--rk-text);font:700 15px var(--rk-font-body);cursor:pointer}
.a11y-foot a{display:inline-flex;align-items:center;min-height:44px;font-weight:700;color:var(--rk-accent);text-decoration:underline;text-underline-offset:4px}
.a11y-note{margin-top:10px;font-size:14px;color:var(--rk-text-muted)}
@media (max-width:759px){
  .a11y-panel{position:fixed;inset-inline:8px;bottom:8px;width:auto;max-height:82vh}
}
@media print{.a11y-root,.skip{display:none!important}}

/* ---------- שגיאות בטפסים (RK.a11y.fieldError) ---------- */
.f-err{display:block;margin-top:6px;color:var(--rk-error);font-weight:700;font-size:15px}
.f-err::before{content:"⚠ ";speak:never}
[aria-invalid="true"]{border-color:var(--rk-error)!important;box-shadow:0 0 0 2px var(--rk-error)}
.on-dark .f-err,footer .f-err,.news .f-err,.joinpop .f-err{color:var(--rk-error-on-dark)}

/* יעד הדילוג (main tabindex=-1) לא מקבל טבעת פוקוס */
main[tabindex="-1"]:focus,main[tabindex="-1"]:focus-visible{outline:none!important;box-shadow:none!important}

/* ---------- הגדלת טקסט (עד 200%). zoom שומר על פריסה רספונסיבית כמו זום של הדפדפן ---------- */
/* (הגדלת הטקסט נעשית ב-site-a11y.js: גודל הגופן של כל אלמנט × המקדם. zoom ב-CSS לא סידר את הפריסה מחדש) */

/* ---------- ניגודיות גבוהה: שחור על לבן, קווים ברורים, קישורים מודגשים ---------- */
html.a11y-contrast{--rk-text:#000;--rk-text-muted:#000;--rk-bg:#fff;--rk-bg-alt:#fff;--rk-color-line:#000;--rk-color-muted:#000;--rk-color-paper:#fff;--rk-accent:#000080;--rk-a11y-line:#000}
html.a11y-contrast body{background:#fff;color:#000}
/* צבע הטקסט נקבע לפי הרקע בפועל (site-a11y.js מסמן data-a11y-hc: l = רקע בהיר, d = רקע כהה) */
html.a11y-contrast [data-a11y-hc="l"]{color:#000!important;text-shadow:none!important}
html.a11y-contrast [data-a11y-hc="d"]{color:#fff!important;text-shadow:none!important}
html.a11y-contrast main :where(input,select,textarea,.chip,.card,.ccard,.tcard,.box,.fbtn){border-color:#000!important}
html.a11y-contrast a[href]:not(.btn):not(.icon-btn){text-decoration:underline!important}
html.a11y-contrast img{filter:contrast(1.1)}

/* ---------- ניגודיות הפוכה / כהה: היפוך צבעים, תמונות ווידאו נשארים בצבעים אמיתיים ---------- */
html.a11y-invert{filter:invert(1) hue-rotate(180deg);background:#fff}
html.a11y-invert :where(img,video,picture,iframe,svg image,[style*="background-image"]){filter:invert(1) hue-rotate(180deg)}
html.a11y-gray{filter:grayscale(1)}
html.a11y-invert.a11y-gray{filter:invert(1) hue-rotate(180deg) grayscale(1)}

/* ---------- הדגשת קישורים וכותרות ---------- */
html.a11y-links a[href]{text-decoration:underline!important;text-decoration-thickness:2px!important;text-underline-offset:3px!important;outline:2px solid #ffd400!important;outline-offset:1px}
html.a11y-links a[href]:not(.btn):not(.icon-btn):not(.card):not(.ccard){background:#fff6a8!important;color:#000!important}
html.a11y-headings :where(h1,h2,h3,h4,h5,h6){outline:3px dashed currentColor!important;outline-offset:4px}

/* ---------- גופן קריא: בלי עיטורים (בלי Karantina, Rubik מעובה) ---------- */
html.a11y-font body,html.a11y-font body *:not(svg):not(svg *){font-family:Arial,"Assistant",Helvetica,system-ui,sans-serif!important;font-style:normal!important}
html.a11y-font :where(h1,h2,h3){letter-spacing:0!important}

/* ---------- ריווח (ערכי WCAG 1.4.12) ---------- */
html.a11y-spacing body :where(p,li,dd,dt,td,th,blockquote,label,figcaption,a,span,small,summary,h1,h2,h3,h4,h5,h6){line-height:1.8!important;letter-spacing:.12em!important;word-spacing:.16em!important}
html.a11y-spacing body p{margin-bottom:1.2em}

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

/* ---------- סמן גדול ---------- */
html.a11y-cursor,html.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 3l30 28-13 1 8 15-6 3-8-15-11 9z' fill='%23000' stroke='%23fff' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") 6 3,auto!important}
html.a11y-cursor :where(a[href],button,summary,label,select,[role=button]),html.a11y-cursor :where(a[href],button,summary,label,select,[role=button]) *{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 4a4 4 0 0 1 4 4v14l2-.5a4 4 0 0 1 4 1.5l1 .2a4 4 0 0 1 4 1.8 4 4 0 0 1 5 3.5V38a8 8 0 0 1-8 8H22a8 8 0 0 1-6.5-3.4L8 32a3.5 3.5 0 0 1 5-4.8l1 .8V8a4 4 0 0 1 4-4z' fill='%23000' stroke='%23fff' stroke-width='2.5'/%3E%3C/svg%3E") 18 4,pointer!important}

/* ---------- הסתרת תמונות רקע (תמונות רקע ב-CSS ותמונות hero/אווירה המסומנות data-a11y-bg) ---------- */
html.a11y-nobg *:not(.a11y-root *){background-image:none!important}
html.a11y-nobg img[data-a11y-bg],html.a11y-nobg picture[data-a11y-bg],html.a11y-nobg video[data-a11y-bg]{opacity:0!important}   /* opacity ולא visibility: הטקסט החלופי נשאר לקוראי מסך */

/* ---------- מצב קריאה: עמודה אחת צרה, בלי קישוטים, טקסט גדול ---------- */
html.a11y-read body{background:#fff}
html.a11y-read main{font-size:20px;line-height:1.8}
html.a11y-read main :where(.wrap,.layout,.post-body,.prose){max-width:72ch!important}
html.a11y-read main :where(.layout){display:block!important}
html.a11y-read :where(.sticky,.sk-ribbon,.review,img[alt=""],img[data-a11y-bg],.chips){display:none!important}
html.a11y-read main :where(p,li){max-width:72ch}

/* ==========================================================================
   תיקוני נגישות לכל האתר (נטען אחרי site.css ולכן גובר עליו). לפי ביקורת axe + בדיקת מטרות מגע, 5.11.2026
   ========================================================================== */

/* ---------- פוקוס גלוי בכל רכיב: טבעת דו-צבעית שנראית על לבן ועל night (design-tokens.css) ---------- */
:focus-visible{outline:3px solid var(--rk-focus-ring)!important;outline-offset:2px!important;box-shadow:0 0 0 6px var(--rk-focus-halo)!important}
.stars-in input:focus-visible + label{outline:3px solid var(--rk-focus-ring)!important;box-shadow:0 0 0 6px var(--rk-focus-halo)!important;border-radius:4px}
.chips{padding-top:8px}   /* מקום לטבעת הפוקוס בשורת הצ'יפים הנגללת */

/* ---------- ניגודיות ---------- */
.opt.is-zero{color:var(--rk-text-subtle)}
.sample.inv{color:#fff;background:#3a4070;border-color:rgba(255,255,255,.55)}   /* הייתה שקופה, ועל רקע לבן יצאה 1.4:1 */
:where(.field input,.rv-form input[type=text],.rv-form textarea,.sortbox select,.finder-field input,input[type=email],input[type=search]:not(#siteq),select,textarea){border-color:var(--rk-color-line-strong)}
.opt input{accent-color:var(--rk-color-night)}

/* ---------- מטרות מגע: לפחות 44px (נבדק ברוחב 390 ב-tools/check-a11y.mjs) ---------- */
.icon-btn{width:44px;height:44px}
.acct-btn{min-width:44px}
body > footer li a,footer .brand{display:inline-flex;align-items:center;min-height:44px}
body > footer ul{gap:0}
.chip{min-height:44px}
.c-buy{min-height:44px}
.tagmode button{min-height:44px}
.achip{min-height:44px}
.opt{min-height:44px}
.crumbs a{display:inline-flex;align-items:center;min-height:44px}
.crumbs{align-items:center;gap:2px 6px}
.sk-ribbon{min-height:44px}
:where(.link,.tmore,.go):not(p .link):not(p .go){display:inline-flex;align-items:center;min-height:44px}
button.link{min-height:44px}
/* תגיות קטנות על כרטיסים: המראה נשאר 28px, אזור הלחיצה מורחב ל-44 בעזרת ::after (בלי לשנות את הפריסה) */
.taglinks a{position:relative}
.taglinks a::after{content:"";position:absolute;inset:-8px -3px}
.ccard .taglinks a::after{inset:-8px -3px}
.taglinks{row-gap:16px}

/* ---------- פוטר: קישור להצהרת הנגישות בכל הדפים ---------- */
footer h2.fh{letter-spacing:0}
.a11y-flink{margin-top:22px}
.a11y-flink a{display:inline-flex;align-items:center;min-height:44px;color:#fff;font-weight:700;text-decoration:underline;text-underline-offset:4px}
.form .f-err{flex-basis:100%}
html.a11y-nobg :where(.people img,.hero-media img){opacity:0!important}
/* סבב 2 של מטרות המגע */
body > footer li a,.crumbs a,:where(.link,.go):not(p .link):not(p .go){min-width:44px}
a.c-buy,a.c-enter{min-height:44px}
.review button{min-height:44px}
.audio .play-s{width:44px;height:44px}
.cal-h .nav-b{width:44px;height:44px}
.cal td{padding:1px}
.cal td button{min-height:44px;max-height:none}
body[data-page="sitemap"] main h2 a{display:inline-flex;align-items:center;min-height:44px}
#acts .link{display:inline-flex;align-items:center;min-height:44px}
/* הגדלת טקסט: טקסט שלא נשבר (nowrap) נשבר, כדי שלא תהיה גלילה אופקית */
html.a11y-zoom body :where(h1,h2,h3,h4,p,li,b,strong,span,a,small,time,bdi,.ltr,label,button){white-space:normal!important;overflow-wrap:anywhere}
html.a11y-zoom body :where(ul,ol,dl){min-width:0}
html.a11y-zoom body :where(.stats,.nums,.proof ul){flex-wrap:wrap!important}
/* כפתור הנגישות בצד השני (בחירת המשתמש, "הזזת הכפתור לצד השני") */
html.a11y-fab-end .a11y-root{inset-inline-start:auto;inset-inline-end:12px}
html.a11y-fab-end .a11y-panel{inset-inline-start:auto;inset-inline-end:0}
html.a11y-fab-end .sk-ribbon{inset-inline-end:auto;inset-inline-start:12px}