/* Explain: CSS classes for accessibility modes like high contrast and font size. */
/* מצבי הנגישות שתפריט הנגישות מפעיל (js/accessibility.js). כל מצב הוא מחלקה על תגית html, והבחירה נשמרת במכשיר.
   הכללים כתובים מחוץ לשכבות של Tailwind, ולכן גוברים על מחלקות העיצוב של העמודים בלי לשנות אותן.
   צבעי מצב הניגודיות הגבוהה ומסגרת המיקוד מוגדרים ב-css/theme.css (--a11y-*) */

/* ===== גודל טקסט: הגופן הבסיסי גדל, וכל מה שמוגדר ב-rem גדל איתו ===== */
html.a11y-text {
    font-size: calc(100% * var(--a11y-scale, 1));
}

/* טקסט בגודל קבוע בפיקסלים גדל לפי אותו יחס. במסך רחב – רק כשאין לו גודל אחר שמוגדר למסך רחב */
html.a11y-text .text-\[9px\]:not([class*="sm:text-"], [class*="md:text-"], [class*="lg:text-"]) { font-size: calc(9px * var(--a11y-scale, 1)) !important; }
html.a11y-text .text-\[10px\]:not([class*="sm:text-"], [class*="md:text-"], [class*="lg:text-"]) { font-size: calc(10px * var(--a11y-scale, 1)) !important; }
html.a11y-text .text-\[11px\]:not([class*="sm:text-"], [class*="md:text-"], [class*="lg:text-"]) { font-size: calc(11px * var(--a11y-scale, 1)) !important; }
html.a11y-text .text-\[12px\]:not([class*="sm:text-"], [class*="md:text-"], [class*="lg:text-"]) { font-size: calc(12px * var(--a11y-scale, 1)) !important; }
html.a11y-text .text-\[13px\]:not([class*="sm:text-"], [class*="md:text-"], [class*="lg:text-"]) { font-size: calc(13px * var(--a11y-scale, 1)) !important; }
html.a11y-text .text-\[14px\]:not([class*="sm:text-"], [class*="md:text-"], [class*="lg:text-"]) { font-size: calc(14px * var(--a11y-scale, 1)) !important; }
html.a11y-text .text-\[15px\]:not([class*="sm:text-"], [class*="md:text-"], [class*="lg:text-"]) { font-size: calc(15px * var(--a11y-scale, 1)) !important; }
html.a11y-text .text-\[17px\]:not([class*="sm:text-"], [class*="md:text-"], [class*="lg:text-"]) { font-size: calc(17px * var(--a11y-scale, 1)) !important; }

@media (max-width: 639.98px) {
    html.a11y-text .text-\[9px\] { font-size: calc(9px * var(--a11y-scale, 1)) !important; }
    html.a11y-text .text-\[10px\] { font-size: calc(10px * var(--a11y-scale, 1)) !important; }
    html.a11y-text .text-\[11px\] { font-size: calc(11px * var(--a11y-scale, 1)) !important; }
    html.a11y-text .text-\[12px\] { font-size: calc(12px * var(--a11y-scale, 1)) !important; }
    html.a11y-text .text-\[13px\] { font-size: calc(13px * var(--a11y-scale, 1)) !important; }
    html.a11y-text .text-\[14px\] { font-size: calc(14px * var(--a11y-scale, 1)) !important; }
    html.a11y-text .text-\[15px\] { font-size: calc(15px * var(--a11y-scale, 1)) !important; }
    html.a11y-text .text-\[17px\] { font-size: calc(17px * var(--a11y-scale, 1)) !important; }
}

@media (min-width: 640px) {
    html.a11y-text .sm\:text-\[12px\]:not([class*="md:text-"], [class*="lg:text-"]) { font-size: calc(12px * var(--a11y-scale, 1)) !important; }
    html.a11y-text .sm\:text-\[13px\]:not([class*="md:text-"], [class*="lg:text-"]) { font-size: calc(13px * var(--a11y-scale, 1)) !important; }
    html.a11y-text .sm\:text-\[14px\]:not([class*="md:text-"], [class*="lg:text-"]) { font-size: calc(14px * var(--a11y-scale, 1)) !important; }
    html.a11y-text .sm\:text-\[15px\]:not([class*="md:text-"], [class*="lg:text-"]) { font-size: calc(15px * var(--a11y-scale, 1)) !important; }
}

/* ===== ריווח שורות ומילים ===== */
html.a11y-spacing body :where(p, li, dd, dt, td, th, label, legend, summary, blockquote, h1, h2, h3, h4, h5, h6):not(.a11y-root *) {
    line-height: 1.9 !important;
    word-spacing: 0.16em !important;
}

/* ===== ניגודיות גבוהה: צבעי הטקסט, הגבולות והכפתורים מוכהים ===== */
html.a11y-contrast {
    --text-color: var(--a11y-strong-text);
    --text-muted: var(--a11y-strong-muted);
    --secondary-color: var(--a11y-strong-secondary);
    --primary-color: var(--a11y-strong-primary);
    --primary-hover: var(--a11y-strong-primary-hover);
    --accent-color: var(--a11y-strong-accent);
    --border-color: var(--a11y-strong-border);
    --background-color: var(--surface-color);
}

html.a11y-contrast body .text-slate-400,
html.a11y-contrast body .text-slate-500,
html.a11y-contrast body .text-slate-600 {
    color: var(--a11y-strong-muted) !important;
}

/* טקסט בהיר על רקע כהה (אזור הפתיחה והכותרת התחתונה) – לבן מלא */
html.a11y-contrast .text-blue-100,
html.a11y-contrast .text-blue-200,
html.a11y-contrast .text-blue-100\/75,
html.a11y-contrast .text-blue-100\/90,
html.a11y-contrast .text-blue-200\/80 {
    color: #ffffff !important;
}

html.a11y-contrast .border-slate-100,
html.a11y-contrast .border-slate-200,
html.a11y-contrast .border-slate-300,
html.a11y-contrast .input,
html.a11y-contrast .select,
html.a11y-contrast .textarea {
    border-color: var(--a11y-strong-border) !important;
}

html.a11y-contrast input::placeholder,
html.a11y-contrast textarea::placeholder {
    color: var(--a11y-strong-muted) !important;
}

html.a11y-contrast .btn-primary:not(.btn-outline),
html.a11y-contrast .btn-primary:not(.btn-outline):active,
html.a11y-contrast .btn-primary:not(.btn-outline):focus {
    background-image: none !important;
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}

html.a11y-contrast .btn-primary:not(.btn-outline):hover {
    background-image: none !important;
    background-color: var(--primary-hover) !important;
    border-color: var(--primary-hover) !important;
}

/* ===== ניגודיות הפוכה וגווני אפור. תמונות, סרטונים ומשטחי חתימה מוחזרים לצבעיהם, כדי שיוצגו כרגיל ===== */
html.a11y-grayscale {
    filter: grayscale(1);
}

html.a11y-invert {
    filter: invert(1) hue-rotate(180deg);
}

html.a11y-invert.a11y-grayscale {
    filter: invert(1) hue-rotate(180deg) grayscale(1);
}

html.a11y-invert img,
html.a11y-invert video,
html.a11y-invert canvas,
html.a11y-invert iframe {
    filter: invert(1) hue-rotate(180deg);
}

/* ===== הדגשת קישורים ===== */
html.a11y-links a:not(.a11y-root *) {
    text-decoration: underline !important;
    text-decoration-thickness: 2px !important;
    text-underline-offset: 4px !important;
}

/* ===== גופן קריא: גופן פשוט ונפוץ שתומך בעברית ובערבית. האייקונים נשארים כמו שהם ===== */
html.a11y-font {
    --font-heading: Arial, Helvetica, sans-serif;
    --font-body: Arial, Helvetica, sans-serif;
}

html.a11y-font body :where(h1, h2, h3, h4, h5, h6, p, a, li, span, label, legend, button, input, select, textarea, td, th, dd, dt, summary, strong, small):not([class*="fa-"]) {
    font-family: Arial, Helvetica, sans-serif !important;
}

/* ===== עצירת אנימציות ומעברים. סמלי הטעינה ממשיכים להסתובב כדי להראות שמשהו בתהליך ===== */
html.a11y-motion *:not(.loading):not(.fa-spin),
html.a11y-motion *:not(.loading):not(.fa-spin)::before,
html.a11y-motion *:not(.loading):not(.fa-spin)::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    animation-delay: 0s !important;
    transition-duration: 0.01ms !important;
    transition-delay: 0s !important;
}

html.a11y-motion {
    scroll-behavior: auto !important;
}

/* ===== סמן עכבר גדול ===== */
html.a11y-cursor,
html.a11y-cursor * {
    cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 24 24'%3E%3Cpath d='M5 2.5v16.8l4.3-4.2 2.8 6.4 3-1.3-2.8-6.3h6z' fill='%23000' stroke='%23fff' stroke-width='1.3' stroke-linejoin='round'/%3E%3C/svg%3E") 10 5, auto !important;
}

/* ===== הדגשת מיקוד: מסגרת בולטת סביב הרכיב שבו נמצא המיקוד ===== */
html.a11y-focus :focus-visible,
html.a11y-focus input:focus,
html.a11y-focus select:focus,
html.a11y-focus textarea:focus {
    outline: 3px solid var(--a11y-focus-ring) !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 6px color-mix(in srgb, var(--secondary-color) 55%, transparent) !important;
}

/* בהדפסה ובשמירה כ-PDF המסמך יוצא בצבעיו הרגילים */
@media print {
    html.a11y-grayscale,
    html.a11y-invert,
    html.a11y-invert img,
    html.a11y-invert video,
    html.a11y-invert canvas,
    html.a11y-invert iframe {
        filter: none !important;
    }
}