/*
 * Contrast van standaardonderdelen van Filament die WCAG 2.1 AA niet halen (docs/opmaak.md, Contrast;
 * docs/plan/OT-opmaak-toegankelijkheid.md).
 *
 * Naast sidebar.css het enige eigen stylesheet. Alleen de selectors en eigenschappen die tests/Architecture/OpmaakTest.php
 * toelaat, op de vaste fi-klassen van Filament, en geen kleurcode: alleen de variabelen van Filament (uit BrandColors).
 * tests/Unit/Opmaak/ContrastTest.php rekent het contrast na. Deze regels staan buiten de CSS-lagen van Filament en gaan
 * daarom voor.
 */

/*
 * De tekst onder de kop van een gekleurde Callout (OT-01). Filament zet hem in gray 700 met 75% dekking op een lichte
 * tint van de kleur: 3,5:1. Zonder de dekking haalt hij AA voor elke kleur, ook in donkere modus (gray 300).
 */
.fi-callout.fi-color .fi-callout-description {
    color: var(--gray-700);
}

.dark .fi-callout.fi-color .fi-callout-description {
    color: var(--gray-300);
}

/*
 * De focus op een tabblad (OT-02). Filament toont hem alleen met een lichtgrijze achtergrond, dezelfde als die van het
 * actieve tabblad; wie met Tab op het actieve tabblad komt, ziet niets. Een rand van 2 px in primary, alleen bij de focus
 * van het toetsenbord, 2 px buiten het tabblad (binnen de binnenrand van de tabbalk, dus niet afgeknipt). In donkere
 * modus een lichtere tint, zodat hij ook op het donkere vlak 3:1 haalt.
 */
.fi-tabs-item:focus-visible {
    outline: 2px solid var(--primary-600);
    outline-offset: 2px;
}

.dark .fi-tabs-item:focus-visible {
    outline-color: var(--primary-400);
}

/*
 * De focus op een link in een tabelcel (OT-07, F1c-10): Filament geeft zo'n link (`->url()` op een kolom) geen eigen
 * rand, dus de browser tekent zijn standaardrand, en die haalt op de donkere kaart 1,26:1. Dezelfde rand als bij een
 * tabblad, maar 2 px binnen de cel: de link vult de cel, en een rand erbuiten valt weg onder de tabelcontainer.
 */
.fi-ta-col-has-column-url:focus-visible {
    outline: 2px solid var(--primary-600);
    outline-offset: -2px;
}

.dark .fi-ta-col-has-column-url:focus-visible {
    outline-color: var(--primary-400);
}

/*
 * De badge 0 op de knop Filteren zonder actieve filters (OT-08). Filament zet het aantal actieve filters altijd op de
 * knop, ook 0; dan staat er een getal dat niet in de naam van de knop zit (axe label-content-name-mismatch), en een 0
 * zegt niets. AppServiceProvider::configureTables zet de klasse alleen bij 0 actieve filters; dan heet de knop gewoon
 * Filteren. Bij 1 of meer blijft de badge, met de naam Filteren, 2 actief (OT-05).
 */
.baecx-filters-geen-actief .fi-icon-btn-badge-ctn {
    display: none;
}