/* ---------------------------------------------------------------------------
   Zebrastreping over de ZICHTBARE rijen — geldt voor elke Bootstrap-tabel.

   Bootstrap streept met `.table-striped > tbody > tr:nth-of-type(odd)`. Die
   selector telt ook de verborgen rijen mee, dus zodra een filter rijen wegzet
   krijgen twee zichtbare rijen naast elkaar dezelfde achtergrond.

   `:nth-child(An+B of S)` (Selectors Level 4) telt alleen de rijen die aan S
   voldoen. Daarmee is er geen JavaScript nodig — mits filters een rij verbergen
   met het `hidden`-attribuut (`row.hidden = true`) en niet met een inline
   `style.display`, want een selector kan niet op een berekende display matchen.
   Bootstrap's reboot zet `[hidden] { display: none !important }`.

   De @supports houdt browsers van vóór 2023 (Chrome < 111, Firefox < 113) op
   Bootstrap's eigen gedrag in plaats van op een tabel zonder streping.

   De custom properties zijn dezelfde als die Bootstrap gebruikt, zodat dark
   mode, .table-dark en de contextuele varianten vanzelf blijven kloppen.

   Specificiteit: Bootstrap's regel is (0,2,2). De reset hieronder komt op
   (0,2,3) door het `table`-element en `:nth-child(n)`, en wint daarmee ongeacht
   de volgorde van de stylesheets; de streep-regel erna is even specifiek en
   staat later, dus die wint van de reset.
   --------------------------------------------------------------------------- */
@supports selector(:nth-child(1 of :not([hidden]))) {

    table.table-striped > tbody > tr:nth-child(n) > * {
        --bs-table-color-type: initial;
        --bs-table-bg-type: initial;
    }

    table.table-striped > tbody > tr:nth-child(odd of :not([hidden])) > * {
        --bs-table-color-type: var(--bs-table-striped-color);
        --bs-table-bg-type: var(--bs-table-striped-bg);
    }
}