/* Scalico A11y — geteilt, auf allen Seiten im nach i18n.js verlinkt. * Konsistente Tastatur-Fokus-Sichtbarkeit + Reduced-Motion + SR-Utility. * Fokus-Ringe erscheinen nur bei Tastatur-Fokus (:focus-visible), nicht bei Maus/Touch. */ /* Keine Ringe bei Maus/Touch-Fokus */ :focus:not(:focus-visible){ outline: none; } /* Deutlicher, einheitlicher Tastatur-Fokus-Ring auf allen interaktiven Elementen. * !important, damit A11y nicht von Seiten-CSS überschrieben wird (Ladereihenfolge egal). */ a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible, [tabindex]:focus-visible, [contenteditable="true"]:focus-visible, [role="button"]:focus-visible, [role="tab"]:focus-visible, [role="menuitem"]:focus-visible, [role="link"]:focus-visible{ outline: 2px solid var(--primary, #0e7c86) !important; outline-offset: 2px !important; } /* Ungültige Felder deutlich markieren (zusammen mit aria-invalid im Markup) */ [aria-invalid="true"]{ border-color: var(--red, #c0392b) !important; } [aria-invalid="true"]:focus-visible{ outline-color: var(--red, #c0392b) !important; } /* Screen-Reader-only-Utility (visuell versteckt, für SR lesbar) */ .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; } /* Bewegungsreduktion respektieren */ @media (prefers-reduced-motion: reduce){ *, *::before, *::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; } }