/* ============================================= Accessibility Widget – styles ============================================= */ /* ── Bar layout ── */ .aw-bar { display: inline-flex; align-items: center; gap: 4px; padding: 6px 14px; background-color: #f4f4f4; border-radius: 4px; font-family: inherit; font-size: 14px; color: #222; flex-wrap: wrap; } /* ── Labels ── */ .aw-label { font-size: 13px; color: inherit; margin-right: 2px; white-space: nowrap; font-weight: 500; } /* ── Buttons base ── */ .aw-btn { display: inline-flex; align-items: center; justify-content: center; background: transparent; border: 1px solid transparent; border-radius: 3px; cursor: pointer; padding: 3px 5px; color: inherit; transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease; line-height: 1; } .aw-btn:hover, .aw-btn:focus { border-color: #222; outline: none; } .aw-btn:focus-visible { outline: 2px solid #005fcc; outline-offset: 2px; } /* ── Font size letters ── */ .aw-a { font-weight: 700; font-family: serif; display: block; line-height: 1; } .aw-a--sm { font-size: 12px; } .aw-a--md { font-size: 16px; } .aw-a--lg { font-size: 20px; } /* ── Divider ── */ .aw-divider { width: 1px; height: 20px; background: #ccc; margin: 0 6px; flex-shrink: 0; } /* ── Contrast icon ── */ .aw-contrast-icon { width: 20px; height: 20px; display: block; pointer-events: none; } /* ── Active states ── */ .aw-font-btn[data-aw-active="true"], .aw-contrast-btn[aria-pressed="true"] { border-color: #222; background: #222; color: #fff; } /* ============================================= HIGH CONTRAST MODE (class on ) ============================================= */ html.aw-high-contrast, html.aw-high-contrast body { background-color: #000 !important; color: #fff !important; } html.aw-high-contrast * { background-color: inherit; color: inherit; border-color: #fff !important; } /* Keep images & SVGs visible */ html.aw-high-contrast img { filter: contrast(1.2) brightness(0.9); } /* Links */ html.aw-high-contrast a { color: #ffff00 !important; } html.aw-high-contrast a:visited { color: #ff9900 !important; } /* Buttons & inputs */ html.aw-high-contrast button, html.aw-high-contrast input, html.aw-high-contrast select, html.aw-high-contrast textarea { background-color: #000 !important; color: #fff !important; border: 1px solid #fff !important; } /* The widget bar itself in high-contrast */ html.aw-high-contrast .aw-bar { background-color: #000 !important; color: #fff !important; border: 1px solid #fff !important; } html.aw-high-contrast .aw-btn:hover, html.aw-high-contrast .aw-btn:focus { background-color: #fff !important; color: #000 !important; } html.aw-high-contrast .aw-divider { background: #fff !important; }