import SwiftUI

struct Hour: Identifiable { let id = UUID(); let t: String; let icon: String; let deg: Int }
struct Day: Identifiable { let id = UUID(); let name: String; let icon: String; let hi: Int; let lo: Int }

struct WeatherView: View {
    let hourly: [Hour] = [
        .init(t: "Now", icon: "sun.max.fill", deg: 24), .init(t: "1PM", icon: "cloud.sun.fill", deg: 25),
        .init(t: "2PM", icon: "cloud.sun.fill", deg: 25), .init(t: "3PM", icon: "cloud.fill", deg: 24),
        .init(t: "4PM", icon: "cloud.fill", deg: 23), .init(t: "5PM", icon: "cloud.rain.fill", deg: 21)
    ]
    let week: [Day] = [
        .init(name: "Mon", icon: "sun.max.fill", hi: 26, lo: 17),
        .init(name: "Tue", icon: "cloud.sun.fill", hi: 24, lo: 16),
        .init(name: "Wed", icon: "cloud.rain.fill", hi: 20, lo: 14),
        .init(name: "Thu", icon: "cloud.sun.fill", hi: 23, lo: 15),
        .init(name: "Fri", icon: "sun.max.fill", hi: 27, lo: 18)
    ]

    var body: some View {
        ZStack {
            Color(red: 0.04, green: 0.14, blue: 0.25).ignoresSafeArea()
            ScrollView {
                VStack(spacing: 24) {
                    VStack(spacing: 2) {
                        Text("Lisbon").font(.system(size: 30, weight: .regular)).foregroundColor(.white)
                        Text("24°").font(.system(size: 90, weight: .thin)).foregroundColor(.white)
                        Text("Sunny · feels like 26°").foregroundColor(Color(white: 0.7))
                        Text("H:27°  L:17°").foregroundColor(Color(white: 0.6))
                    }
                    HStack {
                        ForEach(hourly) { h in
                            VStack(spacing: 10) {
                                Text(h.t).font(.footnote).foregroundColor(Color(white: 0.7))
                                Image(systemName: h.icon).foregroundColor(.white).font(.title3)
                                Text("\(h.deg)°").bold().foregroundColor(.white)
                            }.frame(maxWidth: .infinity)
                        }
                    }
                    .padding(18).background(Color.white.opacity(0.08)).cornerRadius(22)

                    VStack(spacing: 0) {
                        ForEach(week) { d in
                            HStack {
                                Text(d.name).fontWeight(.medium).foregroundColor(.white).frame(width: 52, alignment: .leading)
                                Image(systemName: d.icon).foregroundColor(.white).frame(width: 40)
                                Spacer()
                                Text("\(d.hi)°").bold().foregroundColor(.white)
                            }.padding(.vertical, 12)
                        }
                    }
                    .padding(.horizontal, 18).background(Color.white.opacity(0.08)).cornerRadius(22)
                }
                .padding(22)
            }
        }
    }
}

#Preview { WeatherView() }