/**
 * Advanced Custom Scrollbar with Smooth Scrolling
 * Version 2.0
 */

/* Определяем устройство - только для десктопов */
@media (min-width: 1024px) and (hover: hover) {

    /* Плавный скролл для всего сайта */
    html {
        scroll-behavior: smooth;
    }

    /* Кастомный скроллбар */
    ::-webkit-scrollbar {
        width: 14px;
        background: transparent;
    }

    ::-webkit-scrollbar-track {
        background: linear-gradient(180deg,
                rgba(15, 23, 42, 0.05) 0%,
                rgba(15, 23, 42, 0.1) 50%,
                rgba(15, 23, 42, 0.05) 100%);
        border-radius: 8px;
        margin: 4px 0;
        border: 1px solid rgba(255, 255, 255, 0.05);
    }

    ::-webkit-scrollbar-thumb {
        background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #667eea 100%);
        border-radius: 8px;
        border: 2px solid rgba(255, 255, 255, 0.1);
        background-size: 200% 200%;
        animation: scrollbarGradient 3s ease infinite;
        box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);
        transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    }

    ::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(135deg, #764ba2 0%, #667eea 50%, #764ba2 100%);
        transform: scaleX(1.1);
        box-shadow: 0 6px 20px rgba(102, 126, 234, 0.5);
    }

    ::-webkit-scrollbar-thumb:active {
        background: linear-gradient(135deg, #5a67d8 0%, #6b46c1 50%, #5a67d8 100%);
        transform: scaleX(1.05);
    }

    ::-webkit-scrollbar-corner {
        background: transparent;
    }

    /* Анимация градиента */
    @keyframes scrollbarGradient {

        0%,
        100% {
            background-position: 0% 50%;
        }

        50% {
            background-position: 100% 50%;
        }
    }

    /* Стиль для скроллбара в темной теме */
    .dark ::-webkit-scrollbar-track {
        background: linear-gradient(180deg,
                rgba(255, 255, 255, 0.05) 0%,
                rgba(255, 255, 255, 0.1) 50%,
                rgba(255, 255, 255, 0.05) 100%);
    }

    /* Стиль для скроллбара в светлой теме */
    .light ::-webkit-scrollbar-track {
        background: linear-gradient(180deg,
                rgba(0, 0, 0, 0.05) 0%,
                rgba(0, 0, 0, 0.1) 50%,
                rgba(0, 0, 0, 0.05) 100%);
    }
}

/* На мобильных - минимальный скроллбар */
@media (max-width: 1023px),
(hover: none) {
    ::-webkit-scrollbar {
        width: 4px;
    }

    ::-webkit-scrollbar-track {
        background: transparent;
    }

    ::-webkit-scrollbar-thumb {
        background: rgba(100, 100, 100, 0.2);
        border-radius: 2px;
    }

    ::-webkit-scrollbar-thumb:hover {
        background: rgba(100, 100, 100, 0.3);
    }
}

/* Для Firefox */
@media (min-width: 1024px) {
    * {
        scrollbar-width: thin;
        scrollbar-color: #667eea rgba(15, 23, 42, 0.1);
    }

    .dark * {
        scrollbar-color: #667eea rgba(255, 255, 255, 0.1);
    }

    .light * {
        scrollbar-color: #667eea rgba(0, 0, 0, 0.1);
    }
}

@media (max-width: 1023px) {
    * {
        scrollbar-width: none;
    }
}