/* Ora.med — Accessibility widget styles
 * Conforms to Israeli Standard 5568 (WCAG 2.0 AA) and Equal Rights for Persons
 * with Disabilities Regulations (תקנות נגישות 35356).
 * Self-contained — no external CSS deps. Loads on every public page.
 */

/* Skip link — must be first focusable element */
.a11y-skip{
  position:fixed;top:-100px;inset-inline-start:8px;
  background:#000;color:#fff;padding:14px 22px;border-radius:8px;
  font:600 16px/1 system-ui,sans-serif;z-index:99999;
  transition:top .2s ease;text-decoration:none;
}
.a11y-skip:focus{top:8px;outline:3px solid #FCE4D0;outline-offset:2px}

/* Floating accessibility button */
.a11y-fab{
  position:fixed;bottom:20px;inset-inline-start:20px;
  width:54px;height:54px;border-radius:50%;
  background:#1d3a8a;color:#fff;border:0;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 20px rgba(0,0,0,.25);
  z-index:9998;font-size:0;
  transition:transform .15s,box-shadow .15s;
}
.a11y-fab:hover{transform:scale(1.06);box-shadow:0 8px 28px rgba(0,0,0,.35)}
.a11y-fab:focus-visible{outline:3px solid #FCE4D0;outline-offset:3px}
.a11y-fab svg{width:30px;height:30px;fill:currentColor}

/* Modal panel — hidden by default with belt-and-suspenders (visibility +
 * pointer-events + transform). is-open turns all three on. Avoid overflow
 * conflicts with parent CSS that may strip transforms in some contexts. */
.a11y-panel{
  position:fixed;top:0;left:0;
  width:340px;max-width:92vw;height:100vh;
  background:#fff;color:#1d1b18;
  box-shadow:8px 0 32px rgba(0,0,0,.18);
  z-index:9999;
  transform:translateX(-110%);
  visibility:hidden;
  pointer-events:none;
  transition:transform .25s ease, visibility 0s linear .25s;
  overflow-y:auto;
  display:flex;flex-direction:column;
  font-family:'Assistant',system-ui,sans-serif;
}
[dir="rtl"] .a11y-panel{
  left:auto;right:0;
  box-shadow:-8px 0 32px rgba(0,0,0,.18);
  transform:translateX(110%);
}
.a11y-panel.is-open,
[dir="rtl"] .a11y-panel.is-open{
  transform:translateX(0);
  visibility:visible;
  pointer-events:auto;
  transition:transform .25s ease, visibility 0s linear 0s;
}

.a11y-panel-header{
  padding:18px 20px;border-bottom:1px solid #eee;
  display:flex;justify-content:space-between;align-items:center;
  background:#f8f5ef;
}
.a11y-panel-header h2{
  margin:0;font-size:18px;font-weight:700;color:#1d1b18;
}
.a11y-panel-close{
  background:none;border:0;width:36px;height:36px;border-radius:8px;
  cursor:pointer;font-size:24px;line-height:1;color:#1d1b18;
}
.a11y-panel-close:hover{background:#eee}
.a11y-panel-close:focus-visible{outline:2px solid #1d3a8a;outline-offset:2px}

.a11y-panel-body{padding:16px 20px;flex:1}
.a11y-section{margin-bottom:18px}
.a11y-section-title{
  font-size:13px;font-weight:600;color:#5c5650;
  text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px;
}
.a11y-controls{display:flex;flex-direction:column;gap:6px}
.a11y-btn{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:11px 14px;border-radius:10px;
  background:#f4f1eb;border:2px solid transparent;
  font:600 14px/1.2 inherit;color:#1d1b18;cursor:pointer;
  text-align:start;width:100%;
  transition:background .12s,border-color .12s;
}
.a11y-btn:hover{background:#eae5db}
.a11y-btn:focus-visible{outline:3px solid #1d3a8a;outline-offset:2px}
.a11y-btn[aria-pressed="true"]{background:#1d3a8a;color:#fff;border-color:#1d3a8a}
.a11y-btn[aria-pressed="true"] .a11y-btn-state{color:#FCE4D0}
.a11y-btn-state{font-size:12px;font-weight:400;color:#8a8178}

.a11y-stepper{display:flex;align-items:center;gap:6px}
.a11y-stepper-btn{
  width:38px;height:38px;border-radius:8px;background:#f4f1eb;
  border:2px solid transparent;font:700 18px/1 inherit;cursor:pointer;color:#1d1b18;
}
.a11y-stepper-btn:hover{background:#eae5db}
.a11y-stepper-btn:focus-visible{outline:3px solid #1d3a8a;outline-offset:2px}
.a11y-stepper-btn:disabled{opacity:.4;cursor:not-allowed}
.a11y-stepper-value{
  flex:1;text-align:center;font-weight:600;font-size:14px;
  background:#fff;padding:9px;border-radius:8px;border:1px solid #e0d9cc;
}

.a11y-reset{
  margin-top:14px;padding:11px;width:100%;
  background:#fff;border:1px solid #d0c8b8;border-radius:10px;
  font:600 14px/1 inherit;color:#1d1b18;cursor:pointer;
}
.a11y-reset:hover{background:#f4f1eb}
.a11y-reset:focus-visible{outline:3px solid #1d3a8a;outline-offset:2px}

.a11y-panel-footer{
  padding:14px 20px;border-top:1px solid #eee;
  font-size:12px;color:#5c5650;line-height:1.5;
  background:#f8f5ef;
}
.a11y-panel-footer a{color:#1d3a8a;font-weight:600;text-decoration:underline}

.a11y-backdrop{
  position:fixed;inset:0;background:rgba(0,0,0,.35);
  z-index:9997;opacity:0;pointer-events:none;
  transition:opacity .2s;
}
.a11y-backdrop.is-open{opacity:1;pointer-events:auto}

/* ─── Body modifiers (toggled by widget JS) ──────────── */

/* Font scaling — multiplies all text */
html.a11y-fs-1{font-size:106.25%}  /* +1: 17px */
html.a11y-fs-2{font-size:112.5%}   /* +2: 18px */
html.a11y-fs-3{font-size:125%}     /* +3: 20px */
html.a11y-fs-4{font-size:137.5%}   /* +4: 22px */

/* High contrast — black/yellow per Israeli standard */
html.a11y-contrast-high body,
html.a11y-contrast-high body * {
  background:#000 !important;color:#FFD600 !important;
  border-color:#FFD600 !important;
}
html.a11y-contrast-high a,
html.a11y-contrast-high a * {color:#fff !important;text-decoration:underline !important}
html.a11y-contrast-high img,
html.a11y-contrast-high video {filter:grayscale(100%) contrast(1.2)}
html.a11y-contrast-high .a11y-fab{background:#FFD600 !important;color:#000 !important}
html.a11y-contrast-high .a11y-panel,
html.a11y-contrast-high .a11y-panel-header,
html.a11y-contrast-high .a11y-panel-footer{
  background:#000 !important;border-color:#FFD600 !important;
}

/* Inverted contrast */
html.a11y-contrast-invert body,
html.a11y-contrast-invert body *{
  background:#fff !important;color:#000 !important;border-color:#000 !important;
}
html.a11y-contrast-invert img,
html.a11y-contrast-invert video{filter:invert(100%) hue-rotate(180deg)}

/* Bright (light-on-dark) */
html.a11y-contrast-bright body,
html.a11y-contrast-bright body *{background:#1a1a1a !important;color:#fff !important}

/* Highlight all links */
html.a11y-highlight-links a{
  text-decoration:underline !important;
  color:#0033cc !important;
  font-weight:700 !important;
  background:#FFFFE0 !important;
  outline:1px dashed #0033cc;outline-offset:2px;
}
html.a11y-contrast-high.a11y-highlight-links a{color:#FFD600 !important;background:#000 !important}

/* Highlight headings */
html.a11y-highlight-headings h1,
html.a11y-highlight-headings h2,
html.a11y-highlight-headings h3,
html.a11y-highlight-headings h4{
  outline:2px dashed #c19555;outline-offset:4px;
  background:rgba(252,228,208,.5) !important;padding:4px 8px !important;
}

/* Stop animations */
html.a11y-no-motion *,
html.a11y-no-motion *::before,
html.a11y-no-motion *::after{
  animation-duration:0s !important;
  animation-iteration-count:1 !important;
  transition-duration:0s !important;
  scroll-behavior:auto !important;
}
html.a11y-no-motion video,
html.a11y-no-motion audio[autoplay]{display:none !important}

/* Readable font (replace decorative with sans-serif) */
html.a11y-readable-font,
html.a11y-readable-font *{
  font-family:'Arial','Assistant',sans-serif !important;
  letter-spacing:.02em !important;
}

/* Increased line spacing */
html.a11y-line-spacing *{line-height:1.9 !important}

/* Larger cursor */
html.a11y-big-cursor,
html.a11y-big-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 fill='%23000' stroke='%23fff' stroke-width='2' d='M8 4l32 18-14 4-4 14z'/%3E%3C/svg%3E") 4 4, auto !important;
}

/* Improved focus visibility */
*:focus-visible{outline:3px solid #1d3a8a !important;outline-offset:3px !important}
html.a11y-contrast-high *:focus-visible{outline-color:#FFD600 !important}

/* Keyboard nav indicator — show when user is using keyboard */
body.a11y-keyboard-nav *:focus{outline:3px solid #1d3a8a !important;outline-offset:3px !important}

@media print{.a11y-fab,.a11y-panel,.a11y-backdrop,.a11y-skip{display:none !important}}
