/* ===================== ACCESSIBILITY WIDGET + COOKIE BANNER ===================== */
/* Sizes in px so the widgets stay stable while page text scales. */
:root{
  --a11y-teal:#2AB7CA;   /* medical blue accent */
  --a11y-dark:#061522;   /* brand navy base */
  --a11y-mint:#061522;   /* dark text on accent */
  --a11y-cyan:#EAF6FA;   /* light blue tint */
  --a11y-rust:#2AB7CA;   /* medical blue */
}

/* --- Page filter hook (contrast / grayscale / invert) --- */
.site-header, main, .site-footer{ filter:var(--a11y-filter, none); }
/* Re-invert media so photos stay natural in dark/invert mode */
html.a11y-invert :is(.site-header,main,.site-footer) :is(img,video){
  filter:invert(1) hue-rotate(180deg);
}

/* --- Highlight links --- */
html.a11y-links a{
  text-decoration:underline !important;
  outline:2px solid var(--a11y-rust) !important;
  outline-offset:2px;border-radius:3px;
}

/* --- Readable font --- */
html.a11y-readable, html.a11y-readable *{
  font-family:Arial, "Segoe UI", Tahoma, sans-serif !important;
  letter-spacing:.01em !important;
}

/* --- Text spacing --- */
html.a11y-spacing p, html.a11y-spacing li, html.a11y-spacing span,
html.a11y-spacing a, html.a11y-spacing h1, html.a11y-spacing h2,
html.a11y-spacing h3, html.a11y-spacing h4{
  line-height:2 !important; letter-spacing:.04em !important; word-spacing:.12em !important;
}

/* --- Stop animations --- */
html.a11y-noanim *, html.a11y-noanim *::before, html.a11y-noanim *::after{
  animation:none !important; transition:none !important; scroll-behavior:auto !important;
}

/* --- Big cursor --- */
html.a11y-cursor, html.a11y-cursor *{
  cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='46' viewBox='0 0 24 24'%3E%3Cpath d='M4 2l5.5 17 2.4-6.6L18.5 10z' fill='%23061522' stroke='%23ffffff' stroke-width='1.2' stroke-linejoin='round'/%3E%3C/svg%3E") 4 3, auto !important;
}

/* ===================== SIDE TAB BUTTON ===================== */
.a11y-fab{
  position:fixed;top:25%;left:0;right:auto;bottom:auto;z-index:9998;
  width:44px;height:52px;border:none;cursor:pointer;
  border-radius:0 10px 10px 0;
  background:var(--a11y-teal);color:#fff;
  display:grid;place-items:center;
  box-shadow:2px 4px 14px rgba(6,21,34,.20);
  transition:transform .25s ease, background .25s ease, width .25s ease;
}
.a11y-fab:hover{background:var(--a11y-dark);width:50px}
.a11y-fab:focus-visible{outline:3px solid var(--a11y-rust);outline-offset:3px}
.a11y-fab svg{width:24px;height:24px}

/* ===================== PANEL ===================== */
.a11y-panel{
  position:fixed;top:25%;left:52px;right:auto;bottom:auto;z-index:9999;
  width:340px;max-width:calc(100vw - 64px);max-height:80vh;overflow:auto;
  background:#fff;border-radius:0 20px 20px 0;
  box-shadow:0 24px 60px rgba(6,21,34,.25);
  border:1px solid var(--a11y-cyan);
  font-family:"Assistant","Segoe UI",Arial,sans-serif;direction:rtl;
  transform:translateX(-16px) scale(.98);opacity:0;visibility:hidden;pointer-events:none;
  transition:transform .28s cubic-bezier(.16,1,.3,1), opacity .28s ease, visibility .28s;
}
.a11y-panel.open{transform:translateX(0) scale(1);opacity:1;visibility:visible;pointer-events:auto}

.a11y-head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:18px 20px;background:var(--a11y-teal);color:#fff;
  border-radius:20px 20px 0 0;position:sticky;top:0;
}
.a11y-head h2{font-family:"Heebo","Assistant",sans-serif;font-size:1.15rem;font-weight:800;margin:0;color:#fff}
.a11y-head .a11y-sub{display:block;font-size:.72rem;font-weight:600;color:#fff;opacity:.9;margin-top:2px}
.a11y-close{background:rgba(255,255,255,.15);border:none;color:#fff;width:34px;height:34px;border-radius:50%;
  cursor:pointer;font-size:20px;line-height:1;display:grid;place-items:center;transition:.2s;flex-shrink:0}
.a11y-close:hover{background:rgba(255,255,255,.3)}

/* Font size stepper */
.a11y-fontrow{display:flex;align-items:center;gap:10px;padding:16px 20px 6px}
.a11y-fontrow .lbl{font-weight:700;font-size:.9rem;color:var(--a11y-teal);flex:1}
.a11y-step{width:40px;height:40px;border-radius:12px;border:1.5px solid #DDE7EC;background:#F7FAFC;
  cursor:pointer;font-weight:800;color:var(--a11y-teal);font-size:1rem;transition:.2s}
.a11y-step:hover{background:var(--a11y-cyan);border-color:var(--a11y-teal)}
.a11y-level{min-width:44px;text-align:center;font-weight:800;color:var(--a11y-teal);font-size:.85rem}

/* Toggle grid */
.a11y-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px 20px 4px}
.a11y-toggle{
  display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;
  background:#F7FAFC;border:1.5px solid #DDE7EC;border-radius:14px;
  padding:14px 8px;cursor:pointer;color:var(--a11y-teal);
  font-family:inherit;font-size:.82rem;font-weight:700;transition:.2s;
}
.a11y-toggle svg{width:24px;height:24px}
.a11y-toggle:hover{background:var(--a11y-cyan);border-color:#DDE7EC}
.a11y-toggle:focus-visible{outline:2px solid var(--a11y-rust);outline-offset:2px}
.a11y-toggle.active{background:var(--a11y-teal);border-color:var(--a11y-teal);color:#fff}

.a11y-reset{
  margin:14px 20px 18px;width:calc(100% - 40px);
  background:#fff;border:1.5px solid var(--a11y-rust);color:var(--a11y-rust);
  padding:12px;border-radius:12px;font-family:inherit;font-weight:800;font-size:.9rem;cursor:pointer;transition:.2s;
}
.a11y-reset:hover{background:var(--a11y-rust);color:#fff}

.a11y-note{padding:0 20px 18px;font-size:.7rem;color:#64748B;line-height:1.5;text-align:center}

/* ===================== COOKIE BANNER ===================== */
.cookie-banner{
  position:fixed;bottom:22px;inset-inline-end:22px;z-index:9997;
  width:400px;max-width:calc(100vw - 44px);
  background:#fff;border-radius:20px;border:1px solid #DDE7EC;
  box-shadow:0 24px 60px rgba(6,21,34,.20);
  padding:24px;direction:rtl;font-family:"Assistant","Segoe UI",Arial,sans-serif;
  transform:translateY(24px);opacity:0;visibility:hidden;
  transition:transform .4s cubic-bezier(.16,1,.3,1), opacity .4s ease, visibility .4s;
}
.cookie-banner.show{transform:translateY(0);opacity:1;visibility:visible}
.cookie-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.cookie-head svg{width:26px;height:26px;color:var(--a11y-teal);flex-shrink:0}
.cookie-head h3{font-family:"Heebo","Assistant",sans-serif;font-size:1.1rem;font-weight:800;color:var(--a11y-teal);margin:0}
.cookie-banner p{font-size:.9rem;color:#64748B;line-height:1.6;margin:0 0 18px}
.cookie-banner p a{color:var(--a11y-teal);font-weight:700;text-decoration:underline}
.cookie-actions{display:flex;gap:10px;flex-wrap:wrap}
.cookie-btn{
  flex:1;min-width:120px;padding:12px 16px;border-radius:999px;cursor:pointer;
  font-family:inherit;font-weight:800;font-size:.85rem;transition:.2s;border:none;
}
.cookie-accept{background:var(--a11y-teal);color:#fff}
.cookie-accept:hover{background:var(--a11y-dark)}
.cookie-decline{background:transparent;color:var(--a11y-teal);border:1.5px solid #DDE7EC}
.cookie-decline:hover{background:var(--a11y-cyan)}

@media (max-width:520px){
  /* full-width banner sits above the side tab so they never overlap */
  .cookie-banner{inset-inline-end:12px;inset-inline-start:12px;width:auto;bottom:16px}
  .a11y-fab{top:auto;bottom:16px;left:0;width:40px;height:48px}
  .a11y-fab svg{width:22px;height:22px}
  .a11y-panel{top:auto;bottom:72px;left:48px;max-width:calc(100vw - 60px)}
}

/* ===================== BRAND DARK THEME (widgets) ===================== */
.a11y-panel{background:#061522;border-color:rgba(255,255,255,.1)}
.a11y-head{background:#061522}
.a11y-head h2{color:#fff}
.a11y-head .a11y-sub{color:#2AB7CA}
.a11y-fab{background:#061522;color:#2AB7CA;border:1px solid rgba(42,183,202,.5)}
.a11y-fab:hover{background:#2AB7CA;color:#061522}
.a11y-fontrow .lbl{color:#fff}
.a11y-step{background:#0f2434;border-color:rgba(255,255,255,.1);color:#2AB7CA}
.a11y-step:hover{background:#16324a;border-color:#2AB7CA}
.a11y-level{color:#2AB7CA}
.a11y-toggle{background:#0f2434;border-color:rgba(255,255,255,.08);color:#fff}
.a11y-toggle:hover{background:#16324a;border-color:rgba(42,183,202,.4)}
.a11y-toggle.active{background:#2AB7CA;border-color:#2AB7CA;color:#061522}
.a11y-reset{background:transparent;color:#2AB7CA;border-color:#2AB7CA}
.a11y-reset:hover{background:#2AB7CA;color:#061522}
.a11y-note{color:#8a9aa2}

.cookie-banner{background:#061522;border-color:rgba(255,255,255,.1)}
.cookie-head h3{color:#fff}
.cookie-banner p{color:#9fb0b8}
.cookie-accept:hover{background:#2AB7CA;color:#fff}
.cookie-decline{color:#fff;border-color:rgba(255,255,255,.2)}
.cookie-decline:hover{background:#0f2434}