/* Copyright 2024-2026 Information Management Services, Inc. */

/* ~~~~~~~~~~ General Styling ~~~~~~~~~~ */

.scroller-wrapper {
    position: relative;
    padding: 0;
}

.scroller {
    overflow: scroll;
}

.scroller-wrapper.scroller-hide-top .scroller-btn[data-scroller-dir="top"] {
    visibility: hidden;
}

.scroller-wrapper.scroller-hide-bottom .scroller-btn[data-scroller-dir="bottom"] {
    visibility: hidden;
}

.scroller-wrapper.scroller-hide-start .scroller-btn[data-scroller-dir="start"] {
    visibility: hidden;
}

.scroller-wrapper.scroller-hide-end .scroller-btn[data-scroller-dir="end"] {
    visibility: hidden;
}

/* ~~~~~~~~~~ Gradient Option Styling ~~~~~~~~~~ */

.scroller-wrapper .scroller-btn.scroller-gradient {
    position: absolute;
    display: block;
    height: 100%;
    width: 100px;
    top: 0px;
    border: none;
    background-color: transparent;
}

.scroller-wrapper .scroller-btn.scroller-gradient::after {
    font-family: FontAwesome, sans-serif;
    position: sticky;
    top: 50%;
    bottom: 250px;
    font-size: 2em;
    z-index: 999;
    text-shadow: 0 0 28px #ffffff;
    color: #2c71ad;
}

.scroller-wrapper .scroller-btn.scroller-gradient[data-scroller-dir="start"] {
    left: 0px;
    background-image: linear-gradient(to right, rgba(158, 158, 158, 0.6), rgba(255, 255, 255, 0));
}

.scroller-wrapper .scroller-btn.scroller-gradient[data-scroller-dir="start"]::after {
    content: "\f137";
}

.scroller-wrapper .scroller-btn.scroller-gradient[data-scroller-dir="start"]:hover {
    background-image: linear-gradient(to right, rgba(128, 128, 128, 0.6), rgba(255, 255, 255, 0));
}

.scroller-wrapper .scroller-btn.scroller-gradient[data-scroller-dir="end"] {
    right: 0px;
    background-image: linear-gradient(to left, rgba(158, 158, 158, 0.6), rgba(255, 255, 255, 0));
}

.scroller-wrapper .scroller-btn.scroller-gradient[data-scroller-dir="end"]::after {
    content: "\f138";
}

.scroller-wrapper .scroller-btn.scroller-gradient[data-scroller-dir="end"]:hover {
    background-image: linear-gradient(to left, rgba(128, 128, 128, 0.6), rgba(255, 255, 255, 0));
}