/* WCAG-AA-Kontrast (DESIGN_SYSTEM.md Abschnitt 2), zentral statt in jedem Template.
 *
 * Tailwinds *-500-Toene erreichen als Textfarbe auf Weiss/Grau oft nur 2.5–4.4:1.
 * Hier werden sie im hellen Theme auf AA-taugliche Toene gezogen, im dunklen Theme
 * aufgehellt. :where() haelt die Spezifitaet bei 0,1,0 — hover:/focus:/dark:-Klassen
 * aus den Templates gewinnen weiterhin. Gemessen mit scripts/theme_contrast_audit.py.
 * Akzentfarbe: Variable --color-accent-rgb (frontend/src/tailwind.css), hell #e0294f, dunkel #ff4d6a.
 */

/* ── Helles Theme ─────────────────────────────────────────────── */
:where(html:not(.dark)) .text-gray-400,
:where(html:not(.dark)) .text-gray-500 { color: #5f6673; }          /* 5.3:1 auf gray-100 */
:where(html:not(.dark)) .text-red-500,
:where(html:not(.dark)) .text-red-600 { color: #b91c1c; }           /* red-700, 5.9:1 */
:where(html:not(.dark)) .text-blue-500,
:where(html:not(.dark)) .text-blue-600 { color: #1d4ed8; }          /* blue-700, 6.1:1 */
:where(html:not(.dark)) .text-amber-500,
:where(html:not(.dark)) .text-amber-600 { color: #b45309; }         /* amber-700, 4.6:1 */
:where(html:not(.dark)) .text-emerald-500,
:where(html:not(.dark)) .text-emerald-600,
:where(html:not(.dark)) .text-green-500 { color: #047857; }         /* emerald-700, 5.0:1 */
/* weisse Schrift auf farbigen Buttons */
:where(html:not(.dark)) .bg-emerald-500 { background-color: #047857; }  /* 5.5:1 */
:where(html:not(.dark)) .bg-blue-500 { background-color: #2563eb; }     /* 5.2:1 */

/* ── Dunkles Theme ────────────────────────────────────────────── */
:where(html.dark) .text-gray-500,
:where(html.dark) .text-gray-600 { color: #9ca3af; }                /* gray-400 auf #1e2530 */
:where(html.dark) .text-red-500 { color: #f87171; }                 /* red-400 */
:where(html.dark) .text-blue-500 { color: #93c5fd; }                /* blue-300 */
:where(html.dark) .bg-emerald-500 { background-color: #047857; }
:where(html.dark) .bg-blue-500 { background-color: #1d4ed8; }
