//
//  OpacitySliderOverlay.swift
//  SelfieCam
//
//  Created by Matt Bruce on 1/4/26.
//

import SwiftUI
import Bedrock

// MARK: - Opacity Slider Overlay

struct OpacitySliderOverlay: View {
    @Binding var selectedOpacity: Double
    @Binding var isPresented: Bool

    private let minOpacity: Double = 0.1
    private let maxOpacity: Double = 1.0

    var body: some View {
        ZStack {
            // Semi-transparent background
            Color.black.opacity(Design.Opacity.medium)
                .ignoresSafeArea()

            // Opacity slider content
            VStack(spacing: Design.Spacing.medium) {
                // Header
                Text("Ring Light Brightness")
                    .font(.system(size: 18, weight: .semibold))
                    .foregroundStyle(Color.white)

                // Current opacity display as percentage
                Text("\(Int(selectedOpacity * 100))%")
                    .font(.system(size: 24, weight: .bold))
                    .foregroundStyle(Color.white)
                    .frame(width: 80)

                // Slider
                Slider(value: $selectedOpacity, in: minOpacity...maxOpacity, step: 0.05)
                    .tint(Color.white)
                    .padding(.horizontal, Design.Spacing.medium)

                // Opacity range labels
                HStack {
                    Text("10%")
                        .font(.system(size: 14))
                        .foregroundStyle(Color.white.opacity(0.7))
                    Spacer()
                    Text("100%")
                        .font(.system(size: 14))
                        .foregroundStyle(Color.white.opacity(0.7))
                }
                .padding(.horizontal, Design.Spacing.medium)

                // Done button
                Button("Done") {
                    isPresented = false
                }
                .font(.system(size: 16, weight: .medium))
                .foregroundStyle(Color.white)
                .padding(.vertical, Design.Spacing.small)
            }
            .padding(Design.Spacing.large)
            .background(
                RoundedRectangle(cornerRadius: Design.CornerRadius.large)
                    .fill(Color.black.opacity(Design.Opacity.strong))
            )
            .padding(.horizontal, Design.Spacing.large)
        }
    }
}
