//
//  BaseCard.swift
//  lichunWebsocket
//
//  Base card component with cozy layered shadows
//

import SwiftUI

struct BaseCard<Content: View>: View {
    let content: Content
    var backgroundColor: Color = AppColors.surfaceElevated
    var borderColor: Color? = nil
    var cornerRadius: CGFloat = AppSpacing.largeCornerRadius
    var showShadow: Bool = true
    var enableAnimation: Bool = false  // Enable lift animation on appear

    @State private var isVisible = false
    @State private var hoverScale: CGFloat = 1.0

    init(
        backgroundColor: Color = AppColors.surfaceElevated,
        borderColor: Color? = nil,
        cornerRadius: CGFloat = AppSpacing.largeCornerRadius,
        showShadow: Bool = true,
        enableAnimation: Bool = false,
        @ViewBuilder content: () -> Content
    ) {
        self.backgroundColor = backgroundColor
        self.borderColor = borderColor
        self.cornerRadius = cornerRadius
        self.showShadow = showShadow
        self.enableAnimation = enableAnimation
        self.content = content()
    }

    var body: some View {
        content
            .padding(AppSpacing.cardPadding)
            .background(backgroundColor)
            .cornerRadius(cornerRadius)
            .overlay(
                RoundedRectangle(cornerRadius: cornerRadius)
                    .strokeBorder(
                        borderColor ?? backgroundColor.lighter(by: 0.2),
                        lineWidth: 2
                    )
            )
            .if(showShadow) { view in
                view
                    .shadow(
                        color: Color.black.opacity(isVisible && enableAnimation ? 0.12 : 0.06),
                        radius: AppSpacing.Shadow.radiusMedium,
                        x: 0,
                        y: isVisible && enableAnimation ? 8 : 6
                    )
                    .shadow(
                        color: Color.black.opacity(isVisible && enableAnimation ? 0.06 : 0.03),
                        radius: 4,
                        x: 0,
                        y: isVisible && enableAnimation ? 4 : 2
                    )
            }
            .scaleEffect(enableAnimation ? hoverScale : 1.0)
            .offset(y: enableAnimation && isVisible ? -2 : 0)
            .onAppear {
                if enableAnimation {
                    withAnimation(.spring(response: 0.5, dampingFraction: 0.65).delay(0.1)) {
                        isVisible = true
                        hoverScale = 1.0
                    }

                    // Subtle breathing effect
                    withAnimation(
                        .easeInOut(duration: 3.0)
                        .repeatForever(autoreverses: true)
                    ) {
                        hoverScale = 1.01
                    }
                }
            }
    }
}

// MARK: - Preview
#if DEBUG
struct BaseCard_Previews: PreviewProvider {
    static var previews: some View {
        VStack(spacing: 20) {
            BaseCard {
                VStack(alignment: .leading, spacing: 12) {
                    Text("Card Title")
                        .font(.appHeadline)
                        .foregroundColor(AppColors.primaryText)

                    Text("This is a cozy card with soft shadows and warm colors.")
                        .font(.appBody)
                        .foregroundColor(AppColors.secondaryText)
                }
            }

            BaseCard(borderColor: AppColors.primary) {
                Text("Card with colored border")
                    .font(.appBody)
            }
        }
        .padding()
        .background(AppColors.background)
    }
}
#endif