//
//  DesignSystem.swift
//  EzTimer
//
//  Created by Jared Evans on 12/17/25.
//

import SwiftUI

// MARK: - Colors & Gradients
extension Color {
    static let liquidBackground = Color(red: 0.1, green: 0.1, blue: 0.2) // Deep dark base
    static let glassBorder = LinearGradient(
        colors: [.white.opacity(0.5), .white.opacity(0.1)],
        startPoint: .topLeading,
        endPoint: .bottomTrailing
    )
    static let neonBlue = Color(red: 0.0, green: 0.8, blue: 1.0)
    static let neonOrange = Color(red: 1.0, green: 0.6, blue: 0.2)
    static let neonRed = Color(red: 1.0, green: 0.2, blue: 0.3)
}

// MARK: - Mesh Background
struct MeshBackground: View {
    @State private var animate = false
    
    var body: some View {
        ZStack {
            Color.liquidBackground.ignoresSafeArea()
            
            // blob 1
            Circle()
                .fill(Color.blue.opacity(0.4))
                .frame(width: 300, height: 300)
                .blur(radius: 80)
                .offset(x: animate ? -100 : 100, y: animate ? -100 : 50)
            
            // blob 2
            Circle()
                .fill(Color.purple.opacity(0.4))
                .frame(width: 300, height: 300)
                .blur(radius: 80)
                .offset(x: animate ? 100 : -100, y: animate ? 100 : -50)
            
            // blob 3
            Circle()
                .fill(Color.cyan.opacity(0.3))
                .frame(width: 250, height: 250)
                .blur(radius: 70)
                .offset(y: animate ? 150 : -150)
        }
        .onAppear {
            withAnimation(.easeInOut(duration: 10).repeatForever(autoreverses: true)) {
                animate.toggle()
            }
        }
        .ignoresSafeArea()
    }
}

// MARK: - Liquid Glass Modifier
struct LiquidGlass: ViewModifier {
    var cornerRadius: CGFloat
    
    func body(content: Content) -> some View {
        content
            .background(.ultraThinMaterial)
            .cornerRadius(cornerRadius)
            .shadow(color: Color.black.opacity(0.2), radius: 10, x: 0, y: 5)
            .overlay(
                RoundedRectangle(cornerRadius: cornerRadius)
                    .stroke(Color.glassBorder, lineWidth: 1)
            )
    }
}

extension View {
    func liquidGlass(cornerRadius: CGFloat = 20) -> some View {
        self.modifier(LiquidGlass(cornerRadius: cornerRadius))
    }
}

// MARK: - Glow Effect
struct GlowEffect: ViewModifier {
    var color: Color
    var radius: CGFloat
    var isActive: Bool
    
    func body(content: Content) -> some View {
        content
            .shadow(color: isActive ? color.opacity(0.6) : .clear, radius: radius, x: 0, y: 0)
            .shadow(color: isActive ? color.opacity(0.4) : .clear, radius: radius * 1.5, x: 0, y: 0)
    }
}

extension View {
    func glow(color: Color = .blue, radius: CGFloat = 10, isActive: Bool = true) -> some View {
        self.modifier(GlowEffect(color: color, radius: radius, isActive: isActive))
    }
}

// MARK: - Typography
extension Font {
    static var timerDisplay: Font {
        .system(size: 80, weight: .thin, design: .rounded)
    }
    
    static var displayLabel: Font {
        .system(size: 16, weight: .medium, design: .rounded)
    }
}
