/* ==========================================================================
   SESSION-SPECIFIC STYLES
   Styles for session editing, navigator sliders, stereo controls, etc.
   ========================================================================== */

/* Session loading indicator — fixed center of viewport */
.session-loading-indicator {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 14px;
    z-index: 10;
}

/* ===== iOS-style Slider Handle ===== */
#stereoDistanceSlider.ui-slider,
#heightCorrectionSlider.ui-slider,
#frameSlider.ui-slider,
#mbsLeftSlider.ui-slider,
#mbsRightSlider.ui-slider {
    height: 4px;
    border: none;
    border-radius: 2px;
    background: rgba(255, 255, 255, 0.3);
}
#stereoDistanceSlider .ui-slider-handle,
#heightCorrectionSlider .ui-slider-handle,
#frameSlider .ui-slider-handle,
#mbsLeftSlider .ui-slider-handle,
#mbsRightSlider .ui-slider-handle {
    width: 22px;
    height: 22px;
    top: -9px;
    margin-left: -11px;
    border-radius: 50%;
    border: none;
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4), 0 0 0 0.5px rgba(0, 0, 0, 0.08);
    cursor: grab;
    outline: none;
}
#stereoDistanceSlider .ui-slider-handle:active,
#heightCorrectionSlider .ui-slider-handle:active,
#frameSlider .ui-slider-handle:active,
#mbsLeftSlider .ui-slider-handle:active,
#mbsRightSlider .ui-slider-handle:active {
    cursor: grabbing;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5), 0 0 0 0.5px rgba(0, 0, 0, 0.12);
    transform: scale(1.1);
}
#stereoDistanceSlider .ui-slider-range,
#heightCorrectionSlider .ui-slider-range,
#frameSlider .ui-slider-range,
#mbsLeftSlider .ui-slider-range,
#mbsRightSlider .ui-slider-range {
    background: rgba(255, 255, 255, 0.6);
    border-radius: 2px;
}