/* Khối tổng thể Slider Tempo - Đồng bộ theo cấu trúc vuông vức, góc cạnh của hệ thống */
.shared-slider-overlay {
    position: absolute !important;
    top: 360px !important; 
    right: 32px !important; /* Vị trí bám sát mép trong đĩa nhạc */
    width: 42px !important; 
    height: 180px !important; 
    background-color: var(--theme-app-bg) !important; /* Chuẩn hóa nền trắng hệ thống */
    border: 1px solid var(--border-action-row) !important; /* Chuẩn hóa viền xám mỏng nhẹ nhàng giống khối Action */
    border-radius: 4px !important; /* Bo góc nhẹ 4px chuẩn phong cách ứng dụng */
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column-reverse !important; 
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateY(10px) !important; 
    transition: opacity 0.2s ease, transform 0.2s ease !important;
    z-index: 99999 !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08) !important; /* Đổ bóng mờ nhẹ tinh tế */
    touch-action: none !important; 
}

/* Kích hoạt hiển thị khối */
.shared-slider-overlay.active {
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: translateY(0) !important;
}

/* Điểm nhấn khi người dùng chạm giữ kéo vuốt */
.shared-slider-overlay.holding {
    border-color: var(--progress-current) !important; /* Đồng bộ viền sang màu chủ đạo chính khi tương tác */
}

/* Phần thanh màu đỏ dâng lên hiển thị giá trị tốc độ bên trong khối trắng */
.slider-fill-bar {
    width: 100% !important;
    height: 0%; 
    background-color: #8b0000 !important; /* Giữ nguyên màu đỏ đậm đặc trưng để dễ quan sát mức độ tăng giảm */
    transition: height 0.05s linear !important;
}

/* Khung chứa chữ số hiển thị */
.slider-text-indicator {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important; /* Đẩy nội dung lên sát phía trên đỉnh */
    align-items: center !important;
    padding-top: 8px !important; /* Khoảng cách từ đỉnh trên xuống chữ số */
    box-sizing: border-box !important;
    color: var(--text-primary) !important; /* Chuẩn hóa màu chữ tối chính của hệ thống */
    font-weight: bold !important;
    font-family: sans-serif !important;
    pointer-events: none !important;
    z-index: 2 !important;
}


.slider-text-indicator .tempo-num {
    font-size: 13px !important;
    text-shadow: 
        -1px -1px 0 var(--theme-app-bg), 
         1px -1px 0 var(--theme-app-bg), 
        -1px  1px 0 var(--theme-app-bg), 
         1px  1px 0 var(--theme-app-bg) !important;
}