/* ==========================================================
   Light-theme overrides — applied on top of page-level styles.
   Converts dark hero/decision/diagram sections to banker-grade light.
   Loaded AFTER styles.css on each mockup page.
   ========================================================== */

/* ---------- underwriting.html ---------- */
.deal-hero {
  background: #FFFFFF !important;
  color: #0B1530 !important;
  border: 1px solid #E5E9F2;
  box-shadow: 0 8px 24px rgba(13,28,69,.06) !important;
  border-top: 4px solid #C99A2E;
}
.deal-hero::before,
.deal-hero::after { display: none !important; }
.deal-hero .crumb { color: #8C6A1C !important; }
.deal-hero .crumb .pulse { background: #047857 !important; box-shadow: 0 0 0 3px rgba(4,120,87,.25) !important; }
.deal-hero h1 {
  color: #0A1530 !important;
  font-family: 'Playfair Display', Georgia, serif !important;
}
.deal-hero .sub { color: #475467 !important; }
.deal-hero .sla {
  background: #FBF6E9 !important;
  border: 1px solid #C99A2E !important;
}
.deal-hero .sla .lbl { color: #8C6A1C !important; }
.deal-hero .sla .v { color: #8C6A1C !important; font-family: 'JetBrains Mono', monospace !important; }
.deal-hero .sla .meta { color: #6B5413 !important; }
.deal-hero .metrics { border-top-color: #E5E9F2 !important; }
.deal-hero .metric .v { color: #0A1530 !important; font-family: 'Playfair Display', serif !important; }
.deal-hero .metric .l { color: #6B7280 !important; }

/* Decision card (was dark gradient) */
.decision-card {
  background: #FFFFFF !important;
  color: #0B1530 !important;
  border: 1px solid #E5E9F2 !important;
  border-top: 4px solid #047857 !important;
  box-shadow: 0 8px 24px rgba(13,28,69,.06) !important;
}
.decision-card::before { display: none !important; }
.decision-card .h > div > div:first-child,
.decision-card .sub { color: #475467 !important; }
.decision-card h2 {
  color: #0A1530 !important;
  font-family: 'Playfair Display', Georgia, serif !important;
}
.decision-card h2 .grad {
  background: linear-gradient(120deg, #047857, #0891B2) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
}
.decision-card .dg-item {
  background: #F7F6F1 !important;
  border: 1px solid #E2DED1 !important;
  color: #0B1530 !important;
}
.decision-card .dg-item.highlight {
  background: linear-gradient(135deg, #ECFDF5, #F7F6F1) !important;
  border-color: #047857 !important;
}
.decision-card .dg-item .lbl { color: #475467 !important; }
.decision-card .dg-item .v {
  color: #0A1530 !important;
  font-family: 'Playfair Display', serif !important;
}
.decision-card .dg-item.highlight .v { color: #047857 !important; }
.decision-card .dg-item .note { color: #475467 !important; }
.decision-card .decision-reasons { border-top-color: #E5E9F2 !important; }
.decision-card .reason {
  color: #0B1530 !important;
}
.decision-card .reason .ic {
  background: #ECFDF5 !important;
  color: #047857 !important;
}
.decision-card .reason.flag .ic {
  background: #FFFBEB !important;
  color: #B45309 !important;
}
.decision-card .reason b { color: #0A1530 !important; }

/* Buttons inside decision card */
.decision-card .btn-ghost {
  background: #FFFFFF !important;
  color: #0B1530 !important;
  border: 1px solid #E5E9F2 !important;
}

/* ---------- document-ai.html ---------- */
.hdr {
  background: #FFFFFF !important;
  color: #0B1530 !important;
  border: 1px solid #E5E9F2 !important;
  border-top: 4px solid #0F44B1 !important;
  box-shadow: 0 8px 24px rgba(13,28,69,.06) !important;
}
.hdr::before,
.hdr::after { display: none !important; }
.hdr .crumb { color: #0F44B1 !important; }
.hdr h1 {
  color: #0A1530 !important;
  font-family: 'Playfair Display', Georgia, serif !important;
}
.hdr p,
.hdr .sub { color: #475467 !important; }
.hdr p b { color: #0A1530 !important; }
.hdr .stats { border-top-color: #E5E9F2 !important; }
.hdr .s .v { color: #0A1530 !important; font-family: 'Playfair Display', serif !important; }
.hdr .s .v .u { color: #C99A2E !important; }
.hdr .s .l { color: #6B7280 !important; }

/* Security page specific shield badges — keep the colored icons but flip surround */
body:has(.shield) .hdr .shield .shield-badge {
  background: #F7F6F1 !important;
  border: 1px solid #E2DED1 !important;
}
body:has(.shield) .hdr .shield .shield-badge .nm { color: #0A1530 !important; }
body:has(.shield) .hdr .shield .shield-badge .sub { color: #6B7280 !important; }

/* Fallback for browsers without :has() — scoped via .hdr .shield */
.hdr .shield .shield-badge {
  background: #F7F6F1 !important;
  border: 1px solid #E2DED1 !important;
}
.hdr .shield .shield-badge .nm { color: #0A1530 !important; }
.hdr .shield .shield-badge .sub { color: #6B7280 !important; }

/* Apply Playfair Display display-font to sub-page h2/h3 where appropriate */
.timeline-head h2,
.audit-card .hdr h3,
.pipeline h3,
.flow-diagram h3,
.panel .hd-row h3,
.benchmark-card .bc-head h3 {
  font-family: 'Playfair Display', Georgia, serif !important;
  letter-spacing: -0.01em !important;
}
