/* Slim pill scrollbars — system-wide (dashboard, landing, onboarding) */

html {
    scroll-behavior: smooth;
}

*,
*::before,
*::after {
    scrollbar-width: thin;
    scrollbar-color: #086683 transparent;
}

*::-webkit-scrollbar {
    width: 3px;
    height: 3px;
}

*::-webkit-scrollbar-track {
    background: transparent;
}

*::-webkit-scrollbar-thumb {
    background-color: #086683;
    border-radius: 999px;
}

*::-webkit-scrollbar-thumb:hover {
    background-color: #3dd0f8;
}

*::-webkit-scrollbar-corner {
    background: transparent;
}

.es-sidebar-scroll,
.content-wrapper,
.layout-page,
.menu-inner,
.table-responsive,
.card-datatable,
.dropdown-notifications-list,
.scrollable-container,
.ps {
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    overscroll-behavior-y: auto;
}

@media (min-width: 1200px) {
    .es-sidebar-scroll,
    .content-wrapper,
    .layout-page,
    .menu-inner,
    .table-responsive,
    .card-datatable,
    .dropdown-notifications-list,
    .scrollable-container,
    .ps {
        overscroll-behavior: contain;
    }
}

/* Perfect Scrollbar (dashboard menu / nested panes) */
.ps__rail-y {
    width: 3px !important;
    background: transparent !important;
    opacity: 1 !important;
}

.ps__rail-x {
    height: 3px !important;
    background: transparent !important;
    opacity: 1 !important;
}

.ps__thumb-y {
    width: 3px !important;
    inset-inline-end: 0 !important;
    right: auto !important;
    left: auto !important;
    background-color: #086683 !important;
    border-radius: 999px !important;
}

.ps__thumb-x {
    height: 3px !important;
    bottom: 0 !important;
    background-color: #086683 !important;
    border-radius: 999px !important;
}

.ps__rail-y:hover > .ps__thumb-y,
.ps__rail-y.ps--clicking .ps__thumb-y,
.ps__rail-x:hover > .ps__thumb-x,
.ps__rail-x.ps--clicking .ps__thumb-x {
    background-color: #3dd0f8 !important;
}

@media (prefers-reduced-motion: reduce) {
    html,
    .es-sidebar-scroll,
    .content-wrapper,
    .layout-page,
    .menu-inner,
    .table-responsive,
    .card-datatable,
    .dropdown-notifications-list,
    .scrollable-container,
    .ps {
        scroll-behavior: auto;
    }
}