/* Стили скролл-бара для браузеров на основе WebKit (Chrome, Safari) */
::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.9); /* Темный фон трека */
    border-radius: 10px; /* Закругление углов трека */
}

::-webkit-scrollbar-thumb {
    background-color: rgba(255, 255, 255, 0.6); /* Светлый полупрозрачный ползунок */
    border-radius: 10px; /* Закругление углов ползунка */
    border: 3px solid transparent; /* Пространство между ползунком и треком */
    background-clip: padding-box; /* Убирает края трека */
}

::-webkit-scrollbar-thumb:hover {
    background-color: rgba(255, 255, 255, 0.8); /* Более светлый ползунок при наведении */
}

/* Стили для стрелок скролл-бара */
::-webkit-scrollbar-button {
    background-color: rgba(255, 255, 255, 0.6); /* Светлые полупрозрачные стрелки */
    border-radius: 50%; /* Закругление стрелок */
    height: 12px;
    width: 12px;
}

::-webkit-scrollbar-button:increment,
::-webkit-scrollbar-button:decrement {
    display: block;
}

::-webkit-scrollbar-button:hover {
    background-color: rgba(255, 255, 255, 0.8); /* Более светлые стрелки при наведении */
}

/* Стилизация скролл-бара для Firefox (ограниченная поддержка) */
* {
    scrollbar-width: thin; /* Тонкий скролл-бар */
    scrollbar-color: rgba(255, 255, 255, 0.6) rgba(0, 0, 0, 0.9); /* Цвет ползунка и трека */
}