/* =========================================================
   NVK ENGINEERING — PREMIUM SCROLLBAR
   Light / Dark themes
   ========================================================= */

:root {
    --nvk-scrollbar-track: #e9edf1;
    --nvk-scrollbar-thumb: #b2bdc9;
    --nvk-scrollbar-thumb-hover: #008dd5;
}

html[data-theme="dark"] {
    --nvk-scrollbar-track: #07090c;
    --nvk-scrollbar-thumb: #343d49;
    --nvk-scrollbar-thumb-hover: #008dd5;
}

/* Firefox and browsers without WebKit scrollbar pseudos */
@supports not selector(::-webkit-scrollbar) {
    html,
    body,
    * {
        scrollbar-width: thin;
        scrollbar-color:
            var(--nvk-scrollbar-thumb)
            var(--nvk-scrollbar-track);
    }
}

/* Chrome, Edge, Safari and other WebKit/Blink-based browsers */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: var(--nvk-scrollbar-track);
}

::-webkit-scrollbar-thumb {
    background-color: var(--nvk-scrollbar-thumb);
    border: 3px solid var(--nvk-scrollbar-track);
    border-radius: 999px;
    background-clip: padding-box;
    transition: background-color 180ms ease;
}

::-webkit-scrollbar-thumb:hover {
    background-color: var(--nvk-scrollbar-thumb-hover);
}

::-webkit-scrollbar-thumb:active {
    background-color: #0078b8;
}

::-webkit-scrollbar-corner {
    background: var(--nvk-scrollbar-track);
}