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

import SwiftUI
import Bedrock

// MARK: - Size Slider Overlay

struct SizeSliderOverlay: View {
    @Binding var selectedSize: CGFloat
    @Binding var isPresented: Bool

    private let minSize: CGFloat = SettingsViewModel.minRingSize
    private let maxSize: CGFloat = SettingsViewModel.maxRingSize

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

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

                // Current size display
                Text("\(Int(selectedSize))")
                    .font(.system(size: 24, weight: .bold))
                    .foregroundStyle(Color.white)
                    .frame(width: 60)

                // Slider
                Slider(value: $selectedSize, in: minSize...maxSize, step: 5)
                    .tint(Color.white)
                    .padding(.horizontal, Design.Spacing.medium)

                // Size range labels
                HStack {
                    Text("\(Int(minSize))")
                        .font(.system(size: 14))
                        .foregroundStyle(Color.white.opacity(0.7))
                    Spacer()
                    Text("\(Int(maxSize))")
                        .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)
        }
    }
}
