import { StyleSheet } from "@react-pdf/renderer";

export const C = {
  ink: "#111827",
  body: "#374151",
  muted: "#6b7280",
  caption: "#9ca3af",
  border: "#e5e7eb",
  accent: "#6366f1",
  accentDark: "#4338ca",
  accentLight: "#eef2ff",
  green: "#16a34a",
  greenLight: "#f0fdf4",
  amber: "#d97706",
  amberLight: "#fffbeb",
  red: "#dc2626",
  redLight: "#fef2f2",
  white: "#ffffff",
  surface: "#f9fafb",
  coverBg: "#0f172a",
} as const;

// US Letter: 612 × 792 pt, 0.75" margins (54pt)
export const PAGE_H_PAD = 54;
export const PAGE_V_PAD = 54;
export const HEADER_H = 36; // fixed header height (pt)
export const FOOTER_H = 28; // fixed footer height (pt)

export const S = StyleSheet.create({
  // ── Page shells ────────────────────────────────────────────────────────────
  coverPage: {
    fontFamily: "Helvetica",
    backgroundColor: C.coverBg,
    paddingHorizontal: 0,
    paddingVertical: 0,
  },
  contentPage: {
    fontFamily: "Helvetica",
    fontSize: 11,
    color: C.body,
    paddingHorizontal: PAGE_H_PAD,
    paddingTop: PAGE_V_PAD + HEADER_H + 8,
    paddingBottom: PAGE_V_PAD + FOOTER_H + 8,
    backgroundColor: C.white,
  },

  // ── Typography ──────────────────────────────────────────────────────────────
  display: { fontSize: 56, fontFamily: "Helvetica-Bold", color: C.white, lineHeight: 1 },
  h1: { fontSize: 26, fontFamily: "Helvetica-Bold", color: C.ink, lineHeight: 1.2 },
  h2: { fontSize: 18, fontFamily: "Helvetica-Bold", color: C.ink, lineHeight: 1.3 },
  h3: { fontSize: 13, fontFamily: "Helvetica-Bold", color: C.ink, lineHeight: 1.4 },
  body: { fontSize: 10.5, color: C.body, lineHeight: 1.65 },
  small: { fontSize: 9, color: C.muted, lineHeight: 1.5 },
  caption: { fontSize: 8, color: C.caption, lineHeight: 1.4, letterSpacing: 0.3 },
  label: {
    fontSize: 7.5,
    fontFamily: "Helvetica-Bold",
    color: C.muted,
    letterSpacing: 1.2,
    textTransform: "uppercase",
    marginBottom: 5,
  },

  // ── Layout ──────────────────────────────────────────────────────────────────
  row: { flexDirection: "row" },
  spaceBetween: { flexDirection: "row", justifyContent: "space-between", alignItems: "center" },
  sectionBreak: { marginTop: 20 },
  divider: { borderBottomWidth: 0.75, borderBottomColor: C.border, marginVertical: 12 },

  // ── Cards ───────────────────────────────────────────────────────────────────
  card: {
    borderWidth: 0.75,
    borderColor: C.border,
    borderRadius: 4,
    padding: 13,
    marginBottom: 9,
    backgroundColor: C.white,
  },
  surfaceCard: {
    backgroundColor: C.surface,
    borderRadius: 4,
    padding: 13,
    marginBottom: 9,
  },

  // ── Score chip ──────────────────────────────────────────────────────────────
  scoreChip: {
    borderRadius: 4,
    padding: 10,
    minWidth: 70,
    alignItems: "center",
  },
  scoreNumber: { fontSize: 28, fontFamily: "Helvetica-Bold", lineHeight: 1, textAlign: "center" },
  scoreLabel: { fontSize: 7, fontFamily: "Helvetica-Bold", letterSpacing: 1, textTransform: "uppercase", textAlign: "center", marginTop: 3 },
  scoreDescription: { fontSize: 8, color: C.muted, textAlign: "center", marginTop: 2, lineHeight: 1.4 },
});
