/* ═══════════════════════════════════════════════════════════════ תוסף נגישות — אלמוג כרמל מערב כפתור צף + חלונית. כל התאמה היא class על , נשמר ב-localStorage. ═══════════════════════════════════════════════════════════════ */ /* ---------- הכפתור ---------- */ .a11y-btn{ position:fixed; right:16px; bottom:16px; z-index:9000; width:50px; height:50px; padding:0; cursor:pointer; display:grid; place-items:center; background:#023844; color:#fff; border:2px solid #fff; border-radius:50%; box-shadow:0 8px 24px rgba(0,0,0,.4); transition:background .2s, color .2s, transform .2s; } .a11y-btn:hover{ background:#fff; color:#023844; transform:scale(1.06); } .a11y-btn:focus-visible{ outline:3px solid #fff; outline-offset:3px; } .a11y-btn svg{ width:28px; height:28px; } /* ---------- החלונית ---------- */ .a11y-panel{ position:fixed; right:16px; bottom:76px; z-index:9001; width:min(320px, calc(100vw - 32px)); background:#01262f; color:#fff; border:1px solid rgba(255,255,255,.22); border-radius:8px; box-shadow:0 20px 60px rgba(0,0,0,.5); font:400 16px/1.4 "Almoni", Arial, sans-serif; direction:rtl; text-align:right; opacity:0; visibility:hidden; transform:translateY(10px); transition:opacity .25s, transform .25s, visibility .25s; } .a11y-panel.open{ opacity:1; visibility:visible; transform:none; } .a11y-panel header{ display:flex; align-items:center; justify-content:space-between; padding:12px 16px; border-bottom:1px solid rgba(255,255,255,.18); } .a11y-panel h2{ margin:0; font-size:21px; font-weight:700; } .a11y-panel .a11y-close{ width:32px; height:32px; cursor:pointer; display:grid; place-items:center; background:transparent; border:1px solid rgba(255,255,255,.3); border-radius:5px; color:#fff; font-size:14px; } .a11y-panel .a11y-close:hover{ border-color:#fff; } .a11y-grid{ display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:14px 16px; } .a11y-grid button{ padding:10px 8px; cursor:pointer; text-align:center; border-radius:5px; background:rgba(255,255,255,.06); color:#fff; border:1px solid rgba(255,255,255,.22); font:400 16px/1.25 "Almoni", Arial, sans-serif; transition:border-color .2s, background .2s, color .2s; } .a11y-grid button:hover{ border-color:#fff; } .a11y-grid button[aria-pressed="true"]{ background:#fff; border-color:#fff; color:#023844; font-weight:700; } .a11y-panel button:focus-visible, .a11y-panel a:focus-visible{ outline:2px solid #fff; outline-offset:2px; } .a11y-panel footer{ padding:11px 16px; border-top:1px solid rgba(255,255,255,.18); display:flex; justify-content:space-between; align-items:center; gap:10px; font-size:15px; } .a11y-panel footer a{ color:#fff; text-decoration:underline; text-underline-offset:3px; } .a11y-panel footer .a11y-reset{ background:transparent; border:0; color:rgba(255,255,255,.75); cursor:pointer; font:inherit; text-decoration:underline; } .a11y-panel footer .a11y-reset:hover{ color:#fff; } /* סימון פוקוס ברור לניווט מקלדת בכל הדף */ a:focus-visible, button:focus-visible, input:focus-visible{ outline:3px solid #fff; outline-offset:2px; } /* ---------- ההתאמות ---------- */ /* גודל טקסט מטופל ב-a11y.js (הגדלה יחסית של כל טקסט בדף) */ /* ניגודיות גבוהה */ html.a11y-contrast body, html.a11y-contrast body *:not(img):not(svg):not(path):not(.a11y-panel):not(.a11y-panel *):not(.a11y-btn):not(.a11y-btn *):not(a):not(.btn):not(.btn *):not(input):not(.box){ background-color:#000 !important; background-image:none !important; color:#fff !important; border-color:#fff !important; text-shadow:none !important; box-shadow:none !important; } html.a11y-contrast .hero-side::before{ display:none !important; } html.a11y-contrast a:not(.btn){ color:#ff0 !important; background:none !important; text-decoration:underline !important; } html.a11y-contrast .btn{ background:#ff0 !important; color:#000 !important; border:2px solid #ff0 !important; } html.a11y-contrast .btn svg{ fill:#000 !important; } html.a11y-contrast input:not([type="checkbox"]){ background:#000 !important; color:#fff !important; border:2px solid #fff !important; } html.a11y-contrast input::placeholder{ color:#ccc !important; } html.a11y-contrast .consent .box{ background:#000 !important; border:2px solid #fff !important; } html.a11y-contrast .consent input:checked + .box{ background:#ff0 !important; border-color:#ff0 !important; } html.a11y-contrast .hero-img img{ filter:contrast(1.1); } /* גווני אפור — filter על ילדי body ולא על html, כדי לא לשבור את הכפתור הצף */ html.a11y-gray body > :not(.a11y-btn):not(.a11y-panel):not(.a11y-guide):not(script):not(noscript){ filter:grayscale(1); } /* הדגשת קישורים */ html.a11y-links a:not(.btn){ text-decoration:underline !important; text-underline-offset:3px; text-decoration-thickness:2px; } html.a11y-links a.btn{ outline:2px dashed #fff; outline-offset:3px; } /* גופן קריא */ html.a11y-readable body, html.a11y-readable body *:not(.a11y-panel):not(.a11y-panel *){ font-family:Arial, Helvetica, sans-serif !important; letter-spacing:0 !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 .a1, html.a11y-motion .a2, html.a11y-motion .a3, html.a11y-motion .a4, html.a11y-motion .a5, html.a11y-motion .a6{ opacity:1 !important; transform:none !important; } /* סמן גדול */ html.a11y-cursor, html.a11y-cursor *{ cursor:url("data:image/svg+xml;utf8,") 4 2, auto !important; } /* הדגשת כותרות */ html.a11y-headings h1, html.a11y-headings h2{ outline:2px dashed #fff; outline-offset:6px; } /* קו קריאה */ .a11y-guide{ position:fixed; inset-inline:0; height:0; z-index:8999; pointer-events:none; border-top:3px solid rgba(255,255,255,.9); display:none; } html.a11y-guide-on .a11y-guide{ display:block; }