/* NexusOS — Segment 7: scrollbars, progress bars, level bars, spinners.
   Scrollbars are slim and overlay-ish; the slider thickens on hover.
   Progress fills use the lime brand color. Spinners are lime too. */

/* ── Scrollbars ──────────────────────────────────────────── */

scrollbar {
    background-color: transparent;
    border: none;
    transition: all 160ms ease;
}

scrollbar.horizontal {
    min-height: 12px;
}

scrollbar.vertical {
    min-width: 12px;
}

scrollbar trough {
    background-color: transparent;
    border: none;
    border-radius: 999px;
    margin: 0;
}

scrollbar:hover trough {
    background-color: alpha(@surface_bg, 0.55);
}

/* The draggable slider */
scrollbar slider {
    background-color: alpha(@text_primary, 0.25);
    border: 2px solid transparent;
    border-radius: 999px;
    background-clip: padding-box;
    min-width: 4px;
    min-height: 4px;
    transition: background-color 160ms ease,
                min-width        160ms ease,
                min-height       160ms ease;
}

scrollbar.horizontal slider {
    min-width: 32px;
    min-height: 4px;
}

scrollbar.vertical slider {
    min-width: 4px;
    min-height: 32px;
}

scrollbar:hover slider,
scrollbar.hovering slider {
    background-color: alpha(@brand_green, 0.55);
}

scrollbar.horizontal:hover slider,
scrollbar.horizontal.hovering slider {
    min-height: 8px;
}

scrollbar.vertical:hover slider,
scrollbar.vertical.hovering slider {
    min-width: 8px;
}

scrollbar slider:hover {
    background-color: @brand_green;
}

scrollbar slider:active,
scrollbar slider:hover:active {
    background-color: @brand_green_dark;
}

scrollbar slider:disabled {
    background-color: transparent;
}

/* Fine-tune mode (the user is scrolling slowly with Shift held) */
scrollbar.fine-tune slider {
    min-width: 4px;
    min-height: 4px;
}

/* Hide the legacy stepper buttons unless the app explicitly opts in */
scrollbar button {
    min-width: 0;
    min-height: 0;
    padding: 0;
    margin: 0;
    border: none;
    background: transparent;
    -GtkScrollbar-has-backward-stepper: 0;
    -GtkScrollbar-has-forward-stepper: 0;
}

/* Overlay vs always-shown — overlay variant fades in over content */
scrollbar.overlay-indicator {
    background-color: transparent;
}

scrollbar.overlay-indicator:not(.dragging):not(.hovering) {
    opacity: 0.45;
}

scrollbar.overlay-indicator.dragging,
scrollbar.overlay-indicator.hovering {
    opacity: 1.0;
}

/* Undershoot / overshoot hints in scrolled windows */
scrolledwindow undershoot.top,
scrolledwindow undershoot.bottom,
scrolledwindow undershoot.left,
scrolledwindow undershoot.right {
    background-image: none;
    background-color: transparent;
}

scrolledwindow overshoot.top {
    background-image: linear-gradient(to bottom,
                                      alpha(@brand_green, 0.25),
                                      transparent);
    background-repeat: no-repeat;
    background-size: 100% 24px;
    background-position: top;
}

scrolledwindow overshoot.bottom {
    background-image: linear-gradient(to top,
                                      alpha(@brand_green, 0.25),
                                      transparent);
    background-repeat: no-repeat;
    background-size: 100% 24px;
    background-position: bottom;
}

scrolledwindow overshoot.left {
    background-image: linear-gradient(to right,
                                      alpha(@brand_green, 0.25),
                                      transparent);
    background-repeat: no-repeat;
    background-size: 24px 100%;
    background-position: left;
}

scrolledwindow overshoot.right {
    background-image: linear-gradient(to left,
                                      alpha(@brand_green, 0.25),
                                      transparent);
    background-repeat: no-repeat;
    background-size: 24px 100%;
    background-position: right;
}

/* Junction (the small square where horizontal + vertical scrollbars meet) */
scrolledwindow junction {
    background-color: transparent;
    border: none;
}

/* ── Progress bars ───────────────────────────────────────── */

progressbar {
    color: @text_secondary;
    font-size: smaller;
}

progressbar trough {
    background-color: @surface_bg_alt;
    background-image: none;
    border: 1px solid @border;
    border-radius: 999px;
    min-height: 6px;
    min-width: 6px;
}

progressbar progress {
    background-color: @brand_green;
    background-image: none;
    border: none;
    border-radius: 999px;
    box-shadow: 0 0 6px alpha(@brand_green, 0.35);
}

progressbar.horizontal trough,
progressbar.horizontal progress {
    min-height: 6px;
}

progressbar.vertical trough,
progressbar.vertical progress {
    min-width: 6px;
}

progressbar:disabled trough {
    background-color: @surface_bg;
}

progressbar:disabled progress {
    background-color: @text_disabled;
    box-shadow: none;
}

/* OSD progressbar — used as an overlay on top of media etc. */
progressbar.osd {
    color: #ffffff;
}

progressbar.osd trough {
    background-color: alpha(#000000, 0.45);
    border-color: transparent;
}

progressbar.osd progress {
    background-color: @brand_green;
    box-shadow: 0 0 8px alpha(@brand_green, 0.55);
}

/* ── Level bars ──────────────────────────────────────────── */

levelbar {
    color: @text_secondary;
}

levelbar trough {
    background-color: @surface_bg_alt;
    border: 1px solid @border;
    border-radius: 4px;
    padding: 2px;
    min-height: 6px;
    min-width: 6px;
}

levelbar.horizontal trough,
levelbar.horizontal block {
    min-height: 6px;
}

levelbar.vertical trough,
levelbar.vertical block {
    min-width: 6px;
}

levelbar block {
    border-radius: 2px;
    margin: 0 1px;
    min-width: 32px;
    background-color: @brand_green;
    border: none;
}

levelbar block.empty {
    background-color: alpha(@text_primary, 0.10);
}

levelbar block.low {
    background-color: @warning_color;
}

levelbar block.high {
    background-color: @brand_green;
}

levelbar block.full {
    background-color: @brand_green_light;
}

levelbar.discrete block {
    min-width: 24px;
    margin: 0 1px;
}

levelbar:disabled block {
    background-color: @text_disabled;
}

/* ── Spinner ─────────────────────────────────────────────── */

spinner {
    background: none;
    opacity: 0;
    -gtk-icon-source: -gtk-icontheme("process-working-symbolic");
    color: @brand_green;
    min-width: 16px;
    min-height: 16px;
    transition: opacity 200ms ease;
}

spinner:checked {
    opacity: 1;
    animation: nexus_spinner 1s linear infinite;
}

spinner:disabled {
    opacity: 0.4;
    color: @text_disabled;
}

@keyframes nexus_spinner {
    to { -gtk-icon-transform: rotate(1turn); }
}
