//
//  SidebarOfflineMeterCardView.swift
//  USB Meter
//

import SwiftUI

struct SidebarOfflineMeterCardView: View {
    let summary: AppData.MeterSummary

    var body: some View {
        HStack(spacing: 14) {
            Image(systemName: "sensor.tag.radiowaves.forward.fill")
                .font(.system(size: 18, weight: .semibold))
                .foregroundColor(.secondary)
                .frame(width: 42, height: 42)
                .background(
                    Circle()
                        .fill(Color.secondary.opacity(0.14))
                )
                .overlay(alignment: .bottomTrailing) {
                    Circle()
                        .fill(Color.secondary)
                        .frame(width: 12, height: 12)
                        .overlay(
                            Circle()
                                .stroke(Color(uiColor: .systemBackground), lineWidth: 2)
                        )
                }

            VStack(alignment: .leading, spacing: 4) {
                Text(summary.displayName)
                    .font(.headline)
                Text(summary.modelSummary.isEmpty ? "Unknown Model" : summary.modelSummary)
                    .font(.caption)
                    .foregroundColor(.secondary)
            }

            Spacer()

            VStack(alignment: .trailing, spacing: 4) {
                HStack(spacing: 6) {
                    Circle()
                        .fill(Color.secondary)
                        .frame(width: 8, height: 8)
                    Text("Offline")
                        .font(.caption.weight(.semibold))
                        .foregroundColor(.secondary)
                }
                .padding(.horizontal, 10)
                .padding(.vertical, 6)
                .background(
                    Capsule(style: .continuous)
                        .fill(Color.secondary.opacity(0.12))
                )
                .overlay(
                    Capsule(style: .continuous)
                        .stroke(Color.secondary.opacity(0.22), lineWidth: 1)
                )
            }
        }
        .padding(14)
        .meterCard(
            tint: .secondary,
            fillOpacity: 0.10,
            strokeOpacity: 0.16,
            cornerRadius: 18
        )
    }
}