/* Accessibility menu (♿) and the settings it applies */

/* ---------- the button and panel ---------- */
.a11y-btn {
  position: fixed; z-index: 90; bottom: 20px; inset-inline-end: 20px;
  width: 52px; height: 52px; border-radius: 50%; border: 2px solid #fff; cursor: pointer;
  display: grid; place-items: center; background: #1f5fae; color: #fff;
  box-shadow: 0 10px 24px -8px rgba(0, 0, 0, .7);
}
.a11y-btn:hover { background: #17498a; }
.a11y-btn:focus-visible { outline: 3px solid #ffd27f; outline-offset: 3px; }
.a11y-btn svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.a11y-btn svg circle { fill: currentColor; stroke: none; }
/* Pages with the "להרשמה" bar at the bottom of phones: sit above it */
@media (max-width: 640px) { body:has(.mobile-cta) .a11y-btn { bottom: 96px; } }

.a11y-panel {
  position: fixed; z-index: 91; bottom: 84px; inset-inline-end: 20px;
  width: min(340px, calc(100vw - 32px)); max-height: calc(100vh - 110px); overflow-y: auto;
  background: #fff; color: #111; border-radius: 16px; padding: 16px;
  box-shadow: 0 24px 60px -12px rgba(0, 0, 0, .6);
  font: 400 16px/1.4 Arial, "Heebo", sans-serif; letter-spacing: 0 !important;
}
@media (max-width: 640px) { body:has(.mobile-cta) .a11y-panel { bottom: 160px; max-height: calc(100vh - 180px); } }
.a11y-panel[hidden] { display: none; }
.a11y-panel * { letter-spacing: 0 !important; font-style: normal !important; }
.a11y-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.a11y-head h2 { margin: 0; font: 700 1.15rem Arial, sans-serif; color: #111; }
.a11y-panel button { font: inherit; cursor: pointer; }
.a11y-panel button:focus-visible, .a11y-link:focus-visible { outline: 3px solid #1f5fae; outline-offset: 2px; }
.a11y-x { width: 36px; height: 36px; border-radius: 50%; border: 1px solid #ccc; background: #fff; color: #111; }

.a11y-size { display: flex; align-items: center; gap: 8px; padding: 10px; border-radius: 10px; background: #f1f4f9; margin-bottom: 10px; }
.a11y-size-label { flex: 1; font-weight: 700; }
.a11y-step { width: 44px; height: 40px; border-radius: 8px; border: 1px solid #b9c3d3; background: #fff; color: #111; font-weight: 700 !important; }
.a11y-step:disabled { opacity: .4; cursor: default; }
.a11y-size-val { min-width: 48px; text-align: center; font-weight: 700; }

.a11y-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.a11y-opt {
  display: grid; justify-items: center; gap: 6px; padding: 12px 8px; min-height: 76px;
  border-radius: 10px; border: 2px solid #d5dbe5; background: #fff; color: #111; text-align: center;
}
.a11y-opt[aria-pressed="true"] { border-color: #1f5fae; background: #e7f0fc; font-weight: 700; }
.a11y-ico { width: 24px; height: 24px; border-radius: 6px; display: block; position: relative; }
.a11y-ico-contrast { background: linear-gradient(90deg, #000 50%, #fff 50%); border: 2px solid #000; border-radius: 50%; }
.a11y-ico-gray { background: linear-gradient(135deg, #222, #ddd); border-radius: 50%; }
.a11y-ico-links { border-bottom: 3px solid #1f5fae; border-radius: 0; height: 18px; }
.a11y-ico-links::after { content: "קישור"; position: absolute; inset: -2px -8px auto; font-size: 11px; color: #1f5fae; text-align: center; }
.a11y-ico-font::after { content: "א"; position: absolute; inset: 0; font: 700 20px/24px Arial, sans-serif; text-align: center; }
.a11y-ico-still::before, .a11y-ico-still::after { content: ""; position: absolute; top: 3px; bottom: 3px; width: 6px; background: #111; border-radius: 2px; }
.a11y-ico-still::before { left: 5px; } .a11y-ico-still::after { right: 5px; }
.a11y-ico-cursor { background: #111; clip-path: polygon(10% 0, 10% 85%, 35% 65%, 55% 100%, 68% 93%, 48% 58%, 80% 58%); }

.a11y-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.a11y-reset { border: 1px solid #b9c3d3; background: #fff; color: #111; border-radius: 8px; padding: 8px 14px; }
.a11y-link { color: #1f5fae; text-decoration: underline; font-weight: 700; }

/* ---------- what the settings do ---------- */
html.a11y-t1 { font-size: 115%; }
html.a11y-t2 { font-size: 130%; }
html.a11y-t3 { font-size: 150%; }

/* High contrast: black background, white text, yellow highlights; no decorative textures */
html.a11y-contrast {
  --espresso: #000; --cocoa: #000; --cocoa-2: #0d0d0d;
  --champagne: #fff; --mink: #f2f2f2; --rose: #ffd200; --rose-glow: #ffe566; --rose-deep: #ffd200;
  --line: rgba(255, 255, 255, .55); --line-strong: #fff; --ok: #7dff9a; --no: #ff8a80;
}
html.a11y-contrast body { background: #000 !important; }
html.a11y-contrast body::before, html.a11y-contrast body::after { display: none; }
html.a11y-contrast :is(.hero-title, .wordmark-name) { background: none !important; -webkit-text-fill-color: currentColor; color: #fff !important; }
html.a11y-contrast :is(.site-header, .benefits, .register, .apply, .success-panel, .me-box, .cand-manage, .status-card, .city-list, .mobile-cta, .check, .chip span, .field input, .field select, .field textarea) { background: #000 !important; }
html.a11y-contrast :is(.btn-solid, .chip input:checked + span, .city-tag) { background: #ffd200 !important; color: #000 !important; border-color: #ffd200 !important; }
html.a11y-contrast .hero-art::before { opacity: .35; }
html.a11y-contrast ::placeholder { color: #cfcfcf !important; }

/* Grayscale (applied to the page parts, not to the menu itself) */
html.a11y-gray :is(.site-header, main, .site-footer, .mobile-cta, .hero-art) { filter: grayscale(1); }

/* Highlighted links */
html.a11y-links a:not(.btn) { text-decoration: underline !important; text-underline-offset: 3px; text-decoration-thickness: 2px; }
html.a11y-links a, html.a11y-links button { outline: 2px dashed var(--rose-glow); outline-offset: 2px; }
html.a11y-links .a11y-panel :is(a, button) { outline: none; }

/* Readable font */
html.a11y-font { --serif: Arial, "Helvetica Neue", sans-serif; --sans: Arial, "Helvetica Neue", sans-serif; }
html.a11y-font body, html.a11y-font body * { letter-spacing: 0 !important; font-style: normal !important; }
html.a11y-font :is(h1, h2, h3, legend, .title) { font-weight: 700 !important; }

/* Stop animations */
html.a11y-still *, html.a11y-still *::before, html.a11y-still *::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='40' height='40' viewBox='0 0 40 40'%3E%3Cpath d='M4 2v32l9-8 6 13 6-3-6-12h12z' fill='%23000' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E") 4 2, auto !important;
}

/* Bigger text needs more room in the header: fold the menu into ☰ on wider screens too */
@media (max-width: 1350px) {
  html.a11y-t1 .nav-toggle { display: block; }
  html.a11y-t1 .site-nav { position: absolute; top: 72px; inset-inline: 0; flex-direction: column; align-items: stretch; gap: 0; background: var(--espresso); border-bottom: 1px solid var(--line); padding: 8px var(--gutter) 20px; display: none; max-height: calc(100vh - 72px); overflow-y: auto; }
  html.a11y-t1 .site-nav.is-open { display: flex; }
  html.a11y-t1 .site-nav a:not(.btn) { padding: 14px 0; border-bottom: 1px solid var(--line); }
  html.a11y-t1 .site-nav .lang-toggle, html.a11y-t1 .site-nav .btn { margin-top: 16px; align-self: flex-start; }
}
@media (max-width: 1700px) {
  html.a11y-t2 .nav-toggle { display: block; }
  html.a11y-t2 .site-nav { position: absolute; top: 72px; inset-inline: 0; flex-direction: column; align-items: stretch; gap: 0; background: var(--espresso); border-bottom: 1px solid var(--line); padding: 8px var(--gutter) 20px; display: none; max-height: calc(100vh - 72px); overflow-y: auto; }
  html.a11y-t2 .site-nav.is-open { display: flex; }
  html.a11y-t2 .site-nav a:not(.btn) { padding: 14px 0; border-bottom: 1px solid var(--line); }
  html.a11y-t2 .site-nav .lang-toggle, html.a11y-t2 .site-nav .btn { margin-top: 16px; align-self: flex-start; }
}
@media (max-width: 2100px) {
  html.a11y-t3 .nav-toggle { display: block; }
  html.a11y-t3 .site-nav { position: absolute; top: 72px; inset-inline: 0; flex-direction: column; align-items: stretch; gap: 0; background: var(--espresso); border-bottom: 1px solid var(--line); padding: 8px var(--gutter) 20px; display: none; max-height: calc(100vh - 72px); overflow-y: auto; }
  html.a11y-t3 .site-nav.is-open { display: flex; }
  html.a11y-t3 .site-nav a:not(.btn) { padding: 14px 0; border-bottom: 1px solid var(--line); }
  html.a11y-t3 .site-nav .lang-toggle, html.a11y-t3 .site-nav .btn { margin-top: 16px; align-self: flex-start; }
}
/* Headers with buttons (login, personal area, manager): let them wrap instead of overlapping */
html:is(.a11y-t2, .a11y-t3) .header-inner { height: auto; min-height: 72px; flex-wrap: wrap; gap: 10px; padding-block: 10px; }
