import SwiftUI

struct EmptySlotView: View {
    let mealType: MealType
    let isDropTarget: Bool
    let isValidDrop: Bool?

    init(mealType: MealType, isDropTarget: Bool = false, isValidDrop: Bool? = nil) {
        self.mealType = mealType
        self.isDropTarget = isDropTarget
        self.isValidDrop = isValidDrop
    }

    var body: some View {
        VStack(spacing: 6) {
            Image(systemName: mealType.icon)
                .font(.system(size: 20))
                .foregroundColor(Color(hex: "#C4C4C4"))

            Text(LocalizedStringKey(mealType.rawValue))
                .font(.mealMoodCaption)
                .foregroundColor(.mealMoodTextSecondary)
        }
        .frame(maxWidth: .infinity, minHeight: 80)
        .background(
            RoundedRectangle(cornerRadius: 12)
                .fill(Color(hex: "#F9F9F9"))
                .overlay(
                    RoundedRectangle(cornerRadius: 12)
                        .strokeBorder(
                            style: StrokeStyle(lineWidth: 2, dash: [5])
                        )
                        .foregroundColor(borderColor)
                )
        )
        .animation(.easeInOut(duration: 0.2), value: isDropTarget)
    }

    private var borderColor: Color {
        guard isDropTarget, let valid = isValidDrop else {
            return Color(hex: "#E0E0E0")
        }
        return valid ? .mealMoodSuccess : .mealMoodError
    }
}

struct EatingOutSlotView: View {
    let mealType: MealType

    var body: some View {
        VStack(spacing: 6) {
            Image(systemName: "fork.knife.circle")
                .font(.system(size: 20))
                .foregroundColor(Color(hex: "#A0C4B8"))

            Text("slot_eating_out")
                .font(.mealMoodCaption)
                .foregroundColor(Color(hex: "#6B9E90"))
        }
        .frame(maxWidth: .infinity, minHeight: 80)
        .background(
            RoundedRectangle(cornerRadius: 12)
                .fill(Color(hex: "#EEF8F5"))
                .overlay(
                    RoundedRectangle(cornerRadius: 12)
                        .strokeBorder(
                            style: StrokeStyle(lineWidth: 2, dash: [5])
                        )
                        .foregroundColor(Color(hex: "#A0C4B8"))
                )
        )
    }
}