/* * contrast-fixes.css * תיקוני ניגודיות צבעים לאתר 720.co.il * קריטריון WCAG 2.0 1.4.3 — יחס ניגודיות מינימלי 4.5:1 * * יש להוסיף לתוך index.html בתוך : * */ /* ================================================ טקסטים עמומים/אפורים על רקע כהה — הבהרה ================================================ */ /* תגיות קטנות / meta text (sec-tag, sub-labels) */ .sec-tag, [class*="sec-tag"], .sec-sub, [class*="sec-sub"] { color: #d4b06a !important; opacity: 1 !important; } /* טקסט משני בכרטיסי קורסים ויעוץ */ .course-meta, .course-sub, .package-meta, .pkg-sub, .card-sub, [class*="course-meta"], [class*="pkg-meta"] { color: #c8c0b0 !important; opacity: 1 !important; } /* טקסט בתוך אזורי hero כהים */ .hero-sub, .hero p, section.hero p, .hero-desc { color: #d8d0c0 !important; } /* תאריכים, תגיות, מידע משני בכל האתר */ small, .small-text, .meta-text, .date-text, time { color: #c0b898 !important; } /* ================================================ כוכבי דירוג — הבהרה ================================================ */ .stars, [class*="stars"], .rating { color: #f0c040 !important; } /* ================================================ טקסט placeholder בטפסים ================================================ */ input::placeholder, textarea::placeholder, select::placeholder { color: #9a9080 !important; opacity: 1 !important; } /* ================================================ קישורים בפוטר — הבהרה ================================================ */ footer a, .footer a, [class*="footer"] a { color: #d4b06a !important; text-decoration: underline; } footer a:hover, .footer a:hover { color: #f0cc88 !important; } /* ================================================ טקסט על רקע כהה בסקציות כהות ================================================ */ .dark-section p, .dark-section span, .dark-bg p, .dark-bg span, section[style*="background"] p, section[style*="background"] span { color: #e8e0d0 !important; } /* ================================================ אפשרויות נגישות — כפתורי widget ================================================ */ #acc-menu button, .acc-btn, [class*="acc-menu"] button { color: #1a1a1a !important; background: #f5f0e8 !important; } #acc-menu button:hover { background: #e8e0d0 !important; } /* ================================================ תיקון ניגודיות לטקסט על רקע זהוב/כתום ================================================ */ [style*="color:var(--gold)"], [style*="color: var(--gold)"], .gold-text, .accent-text { color: #b8901a !important; } /* ================================================ High Contrast Mode — תמיכה מלאה ================================================ */ body.high-contrast { background: #000000 !important; color: #ffffff !important; } body.high-contrast a { color: #ffff00 !important; } body.high-contrast button, body.high-contrast .btn { background: #ffffff !important; color: #000000 !important; border: 2px solid #ffffff !important; } body.high-contrast input, body.high-contrast textarea, body.high-contrast select { background: #000000 !important; color: #ffffff !important; border: 2px solid #ffffff !important; } body.high-contrast img { filter: contrast(1.2); } /* ================================================ Highlight Links Mode ================================================ */ body.highlight-links a { text-decoration: underline !important; text-underline-offset: 3px !important; text-decoration-thickness: 2px !important; } /* ================================================ תיקון ניגודיות — טקסט בז'/קרם על רקע לבן צבע E8E0D0 על FFFFFF = 1.31:1 (נכשל) תיקון: הכהיית הטקסט ל-#5a5248 = 7.2:1 (עובר) ================================================ */ /* טקסט פסקאות בסקציית about/story על רקע לבן */ .sec-about p, .sec-story p, .about-text p, section#about p, [id="about"] p, .story p { color: #4a4540 !important; } /* כל טקסט בצבע E8E0D0 בכל האתר */ p, span, li, div { color: inherit; } /* טקסט אפרפר/בז' שמוגדר inline או ב-CSS */ [style*="color: #E8E0D0"], [style*="color:#E8E0D0"], [style*="color: rgb(232, 224, 208)"], [style*="color:rgb(232,224,208)"] { color: #4a4540 !important; } /* טקסט משני על רקע לבן — הכהיה */ .text-muted-light, .sub-text-light, .about p, .philosophy p, .about-section p { color: #4a4540 !important; } /* ================================================ תיקון כללי — כל טקסט בהיר על רקע לבן ================================================ */ @media screen { /* זיהוי רקע לבן וטקסט בהיר מדי */ .sec-white p, .bg-white p, .light-bg p, section.light p { color: #333333 !important; } } /* תגיות קטנות כתומות/זהובות על רקע בהיר */ .sec-tag, [class*="sec-tag"], [style*="color:var(--gold)"], [style*="color: var(--gold)"] { color: #7a5c0a !important; }