/* ============================================================
   EMMA Aesthetic Clinic — שכבת נגישות
   ת"י 5568 / WCAG 2.1 AA
   נטען אחרי style.css ודורס אותו במקומות הנדרשים.
   ============================================================ */

/* ---------- 1. דילוג לתוכן (WCAG 2.4.1) ---------- */
.skip-link{
  position:absolute;
  inset-inline-start:0;
  top:-100px;
  z-index:99999;
  background:#2A2520;
  color:#FFFDF9;
  padding:14px 26px;
  font-family:'Noto Sans Hebrew',sans-serif;
  font-size:16px;
  font-weight:500;
  text-decoration:underline;
  border-radius:0 0 6px 0;
  transition:top .15s ease;
}
.skip-link:focus{top:0}

/* ---------- 2. חיווי פוקוס גלוי בכל רכיב אינטראקטיבי (WCAG 2.4.7) ---------- */
/* משתמשים ב-:focus ולא רק ב-:focus-visible כדי להבטיח חיווי בכל דפדפן ובכל
   דרך מיקוד, לרבות מיקוד תוכנתי של טכנולוגיה מסייעת. */
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus,
summary:focus,
[tabindex]:focus{
  outline:3px solid #7A5C2E !important;
  outline-offset:3px !important;
  border-radius:2px;
}

/* דריסת ה-outline:none שהיה מוגדר בטופס הלידים */
.lead-form input:focus,
.lead-form select:focus,
.lead-form textarea:focus{
  outline:3px solid #7A5C2E !important;
  outline-offset:2px !important;
  border-color:#7A5C2E !important;
  box-shadow:0 0 0 1px #7A5C2E !important;
}

/* על רקע כהה נדרש חיווי בהיר */
.site-footer a:focus,
.topbar a:focus,
.wa-float:focus,
.quote-band a:focus,
html.a11y-contrast a:focus,
html.a11y-contrast button:focus,
html.a11y-contrast input:focus,
html.a11y-contrast select:focus{
  outline:3px solid #F0EAE0 !important;
  outline-offset:3px !important;
}

/* אזור התוכן הראשי לא יציג מסגרת מיותרת אחרי דילוג לתוכן */
main:focus{outline:none !important}

/* ---------- 3. תיקוני ניגודיות (WCAG 1.4.3) ---------- */
/* הצבעים המקוריים נשמרים לשימוש דקורטיבי בלבד. */
.about-side .lic,
.results-note,
.testi .loc,
.area .sub,
.svc .sub{color:#6E6252 !important}

.kicker,
.trust-list .n,
.sec-head .kicker,
.page-hero .kicker{color:#7A5C2E !important}

/* טקסט זהב על רקע בהיר */
section .gold-text,
.mat .label{color:#7A5C2E !important}

/* ---------- 4. כיבוד העדפת מערכת: הפחתת תנועה (WCAG 2.3.3) ---------- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
  .reveal{opacity:1 !important;transform:none !important}
}

/* ---------- 5. אזור לקוראי מסך בלבד ---------- */
.sr-only{
  position:absolute !important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}

/* ============================================================
   6. תפריט הנגישות
   ============================================================ */
#a11y-btn{
  position:fixed;
  inset-inline-start:18px;
  bottom:18px;
  z-index:99990;
  width:56px;height:56px;
  border-radius:50%;
  border:2px solid #FFFDF9;
  background:#2A2520;
  color:#FFFDF9;
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 26px -8px rgba(42,37,32,.6);
  transition:transform .2s ease, background .2s ease;
  padding:0;
}
#a11y-btn:hover{background:#7A5C2E;transform:scale(1.06)}
#a11y-btn svg{width:30px;height:30px;fill:currentColor;display:block}

#a11y-panel{
  position:fixed;
  inset-inline-start:18px;
  bottom:86px;
  z-index:99991;
  width:310px;
  max-width:calc(100vw - 36px);
  max-height:calc(100vh - 120px);
  overflow-y:auto;
  background:#FFFDF9;
  color:#2A2520;
  border:1px solid rgba(42,37,32,.2);
  border-radius:12px;
  box-shadow:0 30px 70px -24px rgba(42,37,32,.5);
  font-family:'Noto Sans Hebrew',Arial,sans-serif;
  font-size:15px;
  line-height:1.6;
  padding:0;
  display:none;
}
#a11y-panel[data-open="true"]{display:block}

#a11y-panel .a11y-head{
  display:flex;align-items:center;justify-content:space-between;
  gap:10px;
  padding:14px 16px;
  border-bottom:1px solid rgba(42,37,32,.14);
  background:#F0EAE0;
  border-radius:12px 12px 0 0;
}
#a11y-panel .a11y-head h2{
  font-family:'Noto Sans Hebrew',Arial,sans-serif;
  font-size:17px;font-weight:700;margin:0;letter-spacing:0;color:#2A2520;
}
#a11y-close{
  background:none;border:1px solid rgba(42,37,32,.3);
  border-radius:6px;
  width:32px;height:32px;
  font-size:19px;line-height:1;
  cursor:pointer;color:#2A2520;
  display:flex;align-items:center;justify-content:center;
  padding:0;
}
#a11y-close:hover{background:#2A2520;color:#FFFDF9}

#a11y-panel .a11y-body{padding:12px 14px 16px}
#a11y-panel .a11y-group{margin-bottom:14px}
#a11y-panel .a11y-group > h3{
  font-family:'Noto Sans Hebrew',Arial,sans-serif;
  font-size:12px;font-weight:700;
  letter-spacing:.06em;
  color:#6E6252;
  margin:0 0 7px;
  text-transform:none;
}
#a11y-panel .a11y-row{display:flex;gap:7px;flex-wrap:wrap}

.a11y-opt{
  flex:1 1 auto;
  min-height:44px;
  display:flex;align-items:center;justify-content:center;
  gap:7px;
  text-align:center;
  background:#F8F4ED;
  border:1px solid rgba(42,37,32,.22);
  border-radius:8px;
  padding:9px 11px;
  font-family:'Noto Sans Hebrew',Arial,sans-serif;
  font-size:14px;
  font-weight:500;
  color:#2A2520;
  cursor:pointer;
  transition:background .15s ease,border-color .15s ease;
}
.a11y-opt:hover{background:#F0EAE0;border-color:#7A5C2E}
.a11y-opt[aria-pressed="true"]{
  background:#2A2520;color:#FFFDF9;border-color:#2A2520;font-weight:600;
}
.a11y-opt[aria-pressed="true"]::after{content:"✓";font-size:13px}

#a11y-reset{
  width:100%;min-height:44px;
  background:#7A5C2E;color:#FFFDF9;
  border:none;border-radius:8px;
  font-family:'Noto Sans Hebrew',Arial,sans-serif;
  font-size:15px;font-weight:600;
  cursor:pointer;margin-top:2px;
}
#a11y-reset:hover{background:#2A2520}

#a11y-panel .a11y-foot{
  margin-top:13px;padding-top:11px;
  border-top:1px solid rgba(42,37,32,.14);
  font-size:13px;line-height:1.55;color:#6E6252;
}
#a11y-panel .a11y-foot a{color:#7A5C2E;text-decoration:underline;font-weight:500}

/* ============================================================
   7. מצבי התאמה שהמשתמשת מפעילה
   ============================================================ */

/* --- ניגודיות גבוהה --- */
html.a11y-contrast body,
html.a11y-contrast section,
html.a11y-contrast div,
html.a11y-contrast header,
html.a11y-contrast footer,
html.a11y-contrast article,
html.a11y-contrast aside,
html.a11y-contrast nav,
html.a11y-contrast main{
  background-color:#000 !important;
  background-image:none !important;
  color:#fff !important;
}
html.a11y-contrast h1,html.a11y-contrast h2,html.a11y-contrast h3,
html.a11y-contrast h4,html.a11y-contrast h5,html.a11y-contrast h6,
html.a11y-contrast p,html.a11y-contrast span,html.a11y-contrast li,
html.a11y-contrast em,html.a11y-contrast strong,html.a11y-contrast blockquote,
html.a11y-contrast label,html.a11y-contrast td,html.a11y-contrast th{
  color:#fff !important;background-color:transparent !important;
}
html.a11y-contrast a{color:#FFE27A !important;text-decoration:underline !important}
html.a11y-contrast button,html.a11y-contrast .btn,
html.a11y-contrast input,html.a11y-contrast select,html.a11y-contrast textarea{
  background:#000 !important;color:#FFE27A !important;
  border:2px solid #FFE27A !important;
}
html.a11y-contrast img,html.a11y-contrast video{
  filter:grayscale(30%) contrast(115%);
}

/* --- ניגודיות בהירה (רקע לבן, טקסט שחור) --- */
html.a11y-light body,html.a11y-light section,html.a11y-light div,
html.a11y-light header,html.a11y-light footer,html.a11y-light nav,
html.a11y-light main,html.a11y-light article{
  background-color:#fff !important;background-image:none !important;color:#000 !important;
}
html.a11y-light h1,html.a11y-light h2,html.a11y-light h3,html.a11y-light h4,
html.a11y-light p,html.a11y-light span,html.a11y-light li,html.a11y-light em,
html.a11y-light strong,html.a11y-light label,html.a11y-light blockquote{
  color:#000 !important;
}
html.a11y-light a{color:#00309E !important;text-decoration:underline !important}

/* --- גווני אפור --- */
html.a11y-gray{filter:grayscale(100%)}

/* --- הדגשת קישורים --- */
html.a11y-links a{
  text-decoration:underline !important;
  text-underline-offset:3px !important;
  text-decoration-thickness:2px !important;
  font-weight:600 !important;
}
html.a11y-links a:not(.btn):not(.brand):not(.wa-float):not(.skip-link){
  outline:1px dashed currentColor;outline-offset:2px;
}

/* --- הדגשת כותרות --- */
html.a11y-heads h1,html.a11y-heads h2,html.a11y-heads h3,
html.a11y-heads h4,html.a11y-heads h5,html.a11y-heads h6{
  background:#FFF3C4 !important;
  color:#2A2520 !important;
  outline:2px solid #7A5C2E;
  outline-offset:2px;
  padding:2px 6px;
}

/* --- פונט קריא --- */
html.a11y-font body,
html.a11y-font h1,html.a11y-font h2,html.a11y-font h3,html.a11y-font h4,
html.a11y-font h5,html.a11y-font h6,html.a11y-font p,html.a11y-font a,
html.a11y-font span,html.a11y-font li,html.a11y-font em,html.a11y-font strong,
html.a11y-font button,html.a11y-font input,html.a11y-font select,
html.a11y-font label,html.a11y-font blockquote,html.a11y-font div{
  font-family:Arial,'Noto Sans Hebrew','Helvetica Neue',sans-serif !important;
  font-style:normal !important;
  letter-spacing:normal !important;
}
html.a11y-font body{font-weight:400 !important}

/* --- ריווח טקסט (WCAG 1.4.12) --- */
html.a11y-spacing p,html.a11y-spacing li,html.a11y-spacing blockquote,
html.a11y-spacing span,html.a11y-spacing div,html.a11y-spacing a{
  line-height:2 !important;
  letter-spacing:.09em !important;
  word-spacing:.16em !important;
}
html.a11y-spacing p,html.a11y-spacing li{margin-bottom:1.6em !important}

/* --- עצירת אנימציות --- */
html.a11y-still *,html.a11y-still *::before,html.a11y-still *::after{
  animation:none !important;
  transition:none !important;
  scroll-behavior:auto !important;
}
html.a11y-still .reveal{opacity:1 !important;transform:none !important}
html.a11y-still video{display:none !important}

/* --- סמן עכבר גדול --- */
html.a11y-cursor,html.a11y-cursor *{
  cursor:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'><path d='M6 2 L6 38 L15 30 L21 44 L28 41 L22 27 L34 27 Z' fill='%23000' stroke='%23fff' stroke-width='2.5'/></svg>") 6 2, auto !important;
}

/* --- שינוי גודל טקסט --- */
html.a11y-t1{font-size:112.5%}
html.a11y-t2{font-size:125%}
html.a11y-t3{font-size:140%}
html.a11y-t4{font-size:155%}
html.a11y-tm1{font-size:92%}

/* התפריט עצמו לא מושפע משינוי גודל הטקסט או מהפונט */
html.a11y-t1 #a11y-panel,html.a11y-t2 #a11y-panel,
html.a11y-t3 #a11y-panel,html.a11y-t4 #a11y-panel,
html.a11y-tm1 #a11y-panel{font-size:15px}

/* התפריט תמיד קריא, גם במצבי ניגודיות */
html.a11y-contrast #a11y-panel,html.a11y-light #a11y-panel,
html.a11y-contrast #a11y-panel div,html.a11y-light #a11y-panel div{
  background-color:#FFFDF9 !important;color:#2A2520 !important;
}
html.a11y-contrast #a11y-panel .a11y-head,
html.a11y-light #a11y-panel .a11y-head{background-color:#F0EAE0 !important}
html.a11y-contrast .a11y-opt,html.a11y-light .a11y-opt{
  background:#F8F4ED !important;color:#2A2520 !important;
  border:1px solid rgba(42,37,32,.22) !important;
}
html.a11y-contrast .a11y-opt[aria-pressed="true"],
html.a11y-light .a11y-opt[aria-pressed="true"]{
  background:#2A2520 !important;color:#FFFDF9 !important;
}
html.a11y-contrast #a11y-panel h2,html.a11y-light #a11y-panel h2,
html.a11y-contrast #a11y-panel h3,html.a11y-light #a11y-panel h3{
  color:#2A2520 !important;background:transparent !important;outline:none !important;
}
html.a11y-contrast #a11y-panel a,html.a11y-light #a11y-panel a{color:#7A5C2E !important}
html.a11y-contrast #a11y-btn{background:#000 !important;color:#FFE27A !important;border-color:#FFE27A !important}

/* לא מסתירים את כפתור הנגישות בשום מצב */
html.a11y-still #a11y-btn,html.a11y-still #a11y-panel{display:revert}
html.a11y-still #a11y-panel:not([data-open="true"]){display:none}

/* מובייל */
@media (max-width:640px){
  #a11y-btn{width:50px;height:50px;bottom:14px;inset-inline-start:14px}
  #a11y-btn svg{width:27px;height:27px}
  #a11y-panel{bottom:74px;inset-inline-start:14px;width:calc(100vw - 28px)}
}

/* הכפתור הצף של וואטסאפ לא יסתיר את כפתור הנגישות */
.wa-float{z-index:99980}