/* Pasek przewijania — wspólny wygląd dla CAŁEJ witryny.
 *
 * Wydzielony do osobnego pliku, bo podstrony w /apps/ (edytor nakładki, licznik kar, parowanie
 * agenta) oraz /logowanie/ nie ładują assets/css/style.css — mają własne, samodzielne arkusze.
 * Zamiast kopiować te reguły w pięć miejsc, każda z nich dolinkowuje ten plik.
 * style.css importuje go na górze, więc główna część serwisu dostaje go razem ze stylami.
 *
 * Dwa zestawy właściwości, bo przeglądarki dzielą się tu na dwa obozy i żaden nie rozumie
 * drugiego: standardowe scrollbar-width/scrollbar-color (Firefox, nowsze Chromium) oraz
 * prefiksowane ::-webkit-scrollbar-* (Chrome, Edge, Safari — tam da się ostylować więcej,
 * m.in. zaokrąglenie i reakcję na najechanie).
 *
 * Celowo NIE ukrywamy paska ani nie zwężamy go do włoska: to jedyny wskaźnik, jak długa jest
 * strona i gdzie się na niej jesteśmy.
 */

* {
    scrollbar-width: thin;
    scrollbar-color: rgba(15,245,200,0.55) rgba(6,11,24,0.75);
}

::-webkit-scrollbar { width: 12px; height: 12px; }

::-webkit-scrollbar-track {
    background: rgba(6,11,24,0.85);
    border-left: 1px solid rgba(15,245,200,0.14);
}

/* Ten sam cyjan co przy saldzie kredytów, ale PRZYGASZONY — pasek ma być czytelny, a nie
   przyciągać wzrok mocniej niż treść obok. Pełną jasność (var(--cyan)) suwak osiąga dopiero
   przy przeciąganiu, czyli wtedy, gdy faktycznie jest w centrum uwagi.
   Wartości wpisane wprost, bo ten plik ładują też podstrony w /apps/, które nie mają zmiennych
   z :root w style.css.

   Suwak jest JEDNOLITY, bez gradientu — gradient rozjaśniał tylko górę i przy krótkim suwaku
   (długa strona) całość wychodziła nierówno. Ramka 1 px, więc z 12 px szerokości na sam kolor
   zostaje 10.

   Poświata jest delikatna i pojedyncza; wcześniejsze wewnętrzne rozjaśnienie (inset) zostało
   usunięte, bo rozmywało kolor i podbijało odbieraną jasność bardziej niż sama barwa. */
::-webkit-scrollbar-thumb {
    background: rgba(15,245,200,0.55);
    border: 1px solid transparent;
    background-clip: padding-box;
    border-radius: 8px;
    box-shadow: 0 0 6px rgba(15,245,200,0.28);
}
::-webkit-scrollbar-thumb:hover {
    background: rgba(15,245,200,0.80);
    background-clip: padding-box;
    box-shadow: 0 0 8px rgba(15,245,200,0.45);
}
::-webkit-scrollbar-thumb:active {
    background: #0ff5c8;
    background-clip: padding-box;
    box-shadow: 0 0 10px rgba(15,245,200,0.6);
}

/* Kwadracik w rogu, gdzie spotykają się pasek pionowy i poziomy — domyślnie bywa jasny
   i odcina się od ciemnego tła. */
::-webkit-scrollbar-corner { background: transparent; }

/* Na telefonie pasek i tak pojawia się tylko na chwilę w trakcie przewijania, a 10 px zabierałoby
   szerokość treści — zostawiamy cieńszy. */
@media (max-width: 700px) {
    ::-webkit-scrollbar { width: 8px; height: 8px; }
}