/* ============================================================
   ♿ Booni — כפתור הנגישות בדפים שהשרת מצייר (08/10/2026)

   🔑 שי: "שיהיה גם כפתור נכים קבוע בכל דף של האתר כולל הצעות מחיר".
   הדפים האלה (הצעת מחיר, טופס לידים, פורטל, תשלום, שירים, המלצות, הגשה, קביעת פגישה)
   לא טוענים את booni-ui.css — ולכן העיצוב של הכפתור, החלונית וההתאמות כאן, עם צבעים
   קבועים משלו: הדף יכול להיות בהיר או כהה, בצבעי העסק, והכפתור צריך להיקרא על שניהם.

   ⚠️ הכל תחת html[data-a11y-lite] — המאפיין נקבע ב-booni-a11y.js רק כשיש
   <meta name="booni-a11y" content="lite"> (ראו _lib/a11yhead.ts). כך גם בדף שכן טוען
   את booni-ui.css (הפורטל, דף השותפים) הכללים כאן גוברים בלי !important.
   ============================================================ */

html[data-a11y-lite] #booni-tools {
  position: fixed; inset-inline-end: 14px; z-index: 80;
  /* ⚠️ --tools-floor = גובה סרגל קבוע בתחתית (בהצעת מחיר: סרגל הסכום). נמדד ב-JS — ראו `fitFloor` */
  bottom: calc(var(--tools-floor, 0px) + 14px + env(safe-area-inset-bottom, 0px));
  display: flex; align-items: flex-end;
  font-family: "Segoe UI", Arial, sans-serif; direction: inherit;
}

/* 🔘 הכפתור — עיגול לבן עם סמל כהה וצל: נקרא על רקע בהיר וגם על כהה */
html[data-a11y-lite] .tool-btn {
  width: 44px; height: 44px; flex: none; padding: 0; margin: 0;
  display: grid; place-items: center;
  border: 1px solid rgba(0, 0, 0, .14); border-radius: 50%;
  background: #ffffff; color: #1b1b1f;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .22);
  cursor: pointer;
}
html[data-a11y-lite] .tool-btn svg { width: 38px; height: 38px; display: block; stroke-width: 1.35; }
html[data-a11y-lite] .tool-btn:hover { background: #f1f0ec; }
html[data-a11y-lite] .tool-btn:focus-visible { outline: 3px solid #1a5fb4; outline-offset: 2px; }
html[data-a11y-lite] .tool-btn[aria-expanded="true"] { background: #1b1b1f; color: #ffffff; border-color: #1b1b1f; }

/* 🗂️ החלונית — נפתחת מעל הכפתור, לא לצידו */
html[data-a11y-lite] #a11y-panel {
  position: absolute; bottom: 54px; inset-inline-end: 0;
  width: min(300px, calc(100vw - 28px));
  max-height: min(70dvh, 560px); overflow: auto;
  padding: 16px; box-sizing: border-box;
  border: 1px solid rgba(0, 0, 0, .12); border-radius: 16px;
  background: #ffffff; color: #1b1b1f;
  box-shadow: 0 18px 50px rgba(0, 0, 0, .28);
  font-size: 14px; line-height: 1.5; text-align: start;
}
html[data-a11y-lite] #a11y-panel[hidden] { display: none; }
html[data-a11y-lite] #a11y-panel h3 { font-size: 15px; margin: 0 0 10px; color: #1b1b1f; }
html[data-a11y-lite] #a11y-panel .a11y-row { display: flex; gap: 6px; margin-bottom: 8px; }
html[data-a11y-lite] #a11y-panel .a11y-row button {
  flex: 1; padding: 9px 6px; margin: 0;
  font: inherit; font-size: 13.5px; font-weight: 600;
  border: 1px solid #d6d3cd; border-radius: 10px;
  background: #ffffff; color: #1b1b1f; cursor: pointer;
  /* ☠️ "A+" בעמוד RTL יוצא "+A" — הכיוון נקבע לפי האות החזקה הראשונה בכל כפתור */
  unicode-bidi: plaintext;
}
html[data-a11y-lite] #a11y-panel .a11y-row button[aria-pressed="true"] { background: #1b1b1f; border-color: #1b1b1f; color: #ffffff; }
html[data-a11y-lite] #a11y-panel .a11y-row button:hover { border-color: #1b1b1f; }
html[data-a11y-lite] #a11y-panel .a11y-label { font-size: 12.5px; color: #5f5f66; margin: 12px 0 5px; font-weight: 600; }
html[data-a11y-lite] #a11y-panel a { color: #1a5fb4; }

/* ── ההתאמות עצמן ──────────────────────────────────────────── */

/* 🔠 גודל טקסט — `zoom` על body, כמו ב-booni-ui.css (שם ההסבר המלא: px לא גדל עם font-size) */
html[data-a11y-lite][data-a11y-size="1"] body { zoom: 1.125; }
html[data-a11y-lite][data-a11y-size="2"] body { zoom: 1.25; }
html[data-a11y-lite][data-a11y-size="3"] body { zoom: 1.4; }
/* ☠️ החלונית בתוך body — היא מוגדלת יחד איתו, ו-300px הופכים ל-375 ונחתכים בטלפון (נמדד 08/10, 375px, A++).
   הרוחב והגובה מחולקים בהגדלה כדי שאחריה הם עדיין ייכנסו למסך */
html[data-a11y-lite][data-a11y-size="1"] #a11y-panel { width: min(300px, calc((100vw - 28px) / 1.125)); max-height: calc(70dvh / 1.125); }
html[data-a11y-lite][data-a11y-size="2"] #a11y-panel { width: min(300px, calc((100vw - 28px) / 1.25)); max-height: calc(70dvh / 1.25); }
html[data-a11y-lite][data-a11y-size="3"] #a11y-panel { width: min(300px, calc((100vw - 28px) / 1.4)); max-height: calc(70dvh / 1.4); }

/* 🌗 ניגודיות גבוהה — מסנן על <html> עצמו.
   ☠️ לא על body: מסנן יוצר "בלוק מכיל" לאלמנטים קבועים, וסרגל הסכום והכפתור הזה היו נגללים עם הדף.
   ⚠️ השורש הוא החריג היחיד במפרט — מסנן עליו לא שובר position:fixed. לדף יש צבעים משלו (צבעי העסק),
   ולכן לא מחליפים משתנים כמו בסטודיו — מחזקים את מה שיש. */
html[data-a11y-lite][data-a11y-contrast="on"] { filter: contrast(1.35); }

html[data-a11y-lite][data-a11y-links="on"] body a { text-decoration: underline !important; font-weight: 700; }

/* 📖 גופן קריא — Arial רחב ומרווח, גם על כותרות שקיבלו גופן משלהן */
html[data-a11y-lite][data-a11y-readable="on"] body,
html[data-a11y-lite][data-a11y-readable="on"] body :is(h1, h2, h3, h4, p, li, span, div, a, button, input, textarea, select, label, b, i) {
  font-family: Arial, Verdana, sans-serif !important;
  letter-spacing: .02em; word-spacing: .12em;
}

html[data-a11y-lite][data-a11y-motion="off"] *,
html[data-a11y-lite][data-a11y-motion="off"] *::before,
html[data-a11y-lite][data-a11y-motion="off"] *::after {
  animation: none !important; transition: none !important; scroll-behavior: auto !important;
}

/* 🖨️ בהדפסה (למשל הצעת מחיר ל-PDF) — בלי הכפתור */
@media print { html[data-a11y-lite] #booni-tools { display: none !important; } }
