/*
|==============================================================================
| ⛔ WAS DER OPTIMIERER NICHT DURCHLAESST (ADR-098 NACHTRAG §2)
|==============================================================================
|
| ⚠️ **Diese Datei ist KEINE zweite Gestaltung.** Sie ist die eine Ausnahme:
| Regeln, die im Browser einwandfrei gelten, aber den Bauweg nicht ueberleben.
| ⛔ Wer hier etwas ablegt, das auch in `resources/css/app.css` stehen koennte,
| baut die zweite Stelle, gegen die dieses Projekt seit ADR-094 kaempft.
|
| ⭐ **GEMESSEN, nicht vermutet.** Drei Schreibweisen wurden gebaut und im
| Ergebnis nachgesehen:
|
| ```
| .probe-flach::-webkit-scrollbar                  → kommt an
| .probe-nest { &::-webkit-scrollbar }             → kommt an (flachgezogen)
| ::picker(select) { &::-webkit-scrollbar }        → FEHLT im Ergebnis
| ::picker(select)::-webkit-scrollbar              → FEHLT, mit „Invalid state"
| ```
|
| ⛔ Lightning CSS (der Optimierer hinter Tailwind 4) kennt `::picker()` noch
| nicht. Er zieht die Verschachtelung zuerst flach und verwirft das Ergebnis
| dann still — beim zweiten Weg **ohne jede Warnung**.
|
| ⭐ **Diese Datei geht an ihm vorbei.** `public/` wird unveraendert
| ausgeliefert; das Layout bindet sie NACH dem Bundle ein, damit sie in der
| Kaskade gewinnt.
|
| ⚠️ **Sobald der Optimierer `::picker()` kennt, gehoert der Inhalt zurueck
| nach `resources/css/app.css`** — und diese Datei verschwindet. Sie ist eine
| Kruecke mit Ablaufdatum, keine Einrichtung.
*/

/*
| ⭐ **DERSELBE SCROLLBALKEN WIE IN DER SEITENLEISTE** — ausdrueckliche
| Vorgabe des Benutzers, zum wiederholten Mal (ADR-080 §9, ADR-096 §4).
|
| ⛔ Drei Dinge machen ihn aus:
|   1. **10 px, fest** — die Breite aendert sich in keinem Zustand.
|   2. **Durchsichtig, nicht unsichtbar** — er ist da und laesst sich greifen.
|   3. **Blau NUR, wenn die Maus auf dem GRIFF ist** — nicht schon, wenn sie
|      irgendwo in der Liste steht.
|
| ⚠️ Punkt 3 ist der Grund, warum es diese Datei gibt: Ueber die
| Standardeigenschaft `scrollbar-color` laesst sich der Griff nicht eigens
| ansprechen, und in einer offenen Auswahlliste steht der Zeiger fast immer
| drin — der Balken waere dauerhaft blau.
*/
::picker(select)::-webkit-scrollbar {
    width: 10px;
}

::picker(select)::-webkit-scrollbar-track {
    background: transparent;
}

::picker(select)::-webkit-scrollbar-thumb {
    background-color: transparent;
    border-radius: 9999px;

    /* ⚠️ `background-clip: content-box` ist zwingend — sonst faerbte der
       Hintergrund den Rand mit, und der Griff waere 10 px breit statt 6. */
    border: 2px solid transparent;
    background-clip: content-box;
}

@media (hover: hover) and (pointer: fine) {
    ::picker(select)::-webkit-scrollbar-thumb:hover {
        background-color: var(--color-primary-bright);
    }
}