/* desktop-lightmode-1342842.css — Task #1342842
   P0: Fix desktop (1440px) dark sections, contrast failures, font sizes.
   Loaded LAST in layout-head to override all prior CSS + inline styles.

   Acceptance criteria:
   - Zero dark sections at 1440px (nav/footer exempt)
   - All text contrast WCAG AA (4.5:1 body, 3:1 large)
   - No font below 14px, body text minimum 16px
*/

/* ═══════════════════════════════════════════════════════════════════════
   1. NAV CTA — .nav-cta-check-elig
   Was: blue text #2563eb at 0.78rem (~12.5px) — low contrast / too small
   Fix: Blue pill button with white text, 14px min
   ═══════════════════════════════════════════════════════════════════════ */
.nav-cta-check-elig {
  background: #2563eb !important;
  color: #ffffff !important;
  font-size: 0.875rem !important;
  padding: 0.45rem 1rem !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em !important;
}
.nav-cta-check-elig:hover {
  background: #1d4ed8 !important;
  color: #ffffff !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   2. #how-were-different — /about competitor comparison
   Was: background #0A1628 (dark navy) with light text
   Fix: White background with dark text
   ═══════════════════════════════════════════════════════════════════════ */
#how-were-different {
  background: #ffffff !important;
  border-top: 1px solid #e2e8f0;
  border-bottom: 1px solid #e2e8f0;
}

/* Remove dark decorative glows */
#how-were-different > div[style*="radial-gradient"] {
  display: none !important;
}

/* Badge */
#how-were-different span[style*="text-transform:uppercase"][style*="letter-spacing:0.12em"] {
  color: #92400e !important;
  background: rgba(245, 166, 35, 0.12) !important;
  border-color: rgba(245, 166, 35, 0.35) !important;
}

/* Main heading */
#how-were-different h2 {
  color: #0f172a !important;
}
#how-were-different h2 span {
  color: #b45309 !important;
}

/* Subtitle */
#how-were-different p[style*="color:#94a3b8"] {
  color: #475569 !important;
}

/* Competitor card (left) — keep subtle gray bg */
#how-were-different .sr-diff-grid > div:first-child {
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
}

/* Competitor labels */
#how-were-different .sr-diff-grid > div:first-child div[style*="color:#6b7280"] {
  color: #6b7280 !important;
}
#how-were-different .sr-diff-grid > div:first-child div[style*="color:#94a3b8"] {
  color: #475569 !important;
}

/* Competitor list items — already gray, ensure readable */
#how-were-different .sr-diff-grid > div:first-child li span:last-child {
  color: #475569 !important;
}

/* SR card (right) — warm gold tint */
#how-were-different .sr-diff-grid > div:last-child {
  background: #fffbf0 !important;
  border: 2px solid #d97706 !important;
}

/* SR "The Better Way" badge */
#how-were-different .sr-diff-grid > div:last-child > div[style*="background:#F5A623"] {
  background: #d97706 !important;
  color: #ffffff !important;
}

/* SR card header label */
#how-were-different .sr-diff-grid > div:last-child div[style*="color:#F5A623"][style*="text-transform:uppercase"] {
  color: #b45309 !important;
}
#how-were-different .sr-diff-grid > div:last-child div[style*="color:#ffffff"][style*="font-weight:700"] {
  color: #0f172a !important;
}

/* SR list items */
#how-were-different .sr-diff-grid > div:last-child li {
  color: #334155 !important;
}
#how-were-different .sr-diff-grid > div:last-child li strong {
  color: #0f172a !important;
}

/* SR bottom CTA row */
#how-were-different a[style*="background:#F5A623"] {
  background: #d97706 !important;
  color: #ffffff !important;
}
#how-were-different a[style*="color:#F5A623"] {
  color: #b45309 !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   3. .igp-home-preview — /settlements "I Got Paid" wins section
   Was: background #0d1f0f (dark green) with light text
   Fix: Light green-tinted background with dark text
   ═══════════════════════════════════════════════════════════════════════ */
.igp-home-preview {
  background: #f0fdf4 !important;
}
.igp-home-preview::before {
  background: radial-gradient(ellipse 80% 60% at 50% 0%, rgba(0, 113, 60, 0.06) 0%, transparent 70%) !important;
}
.igp-home-preview::after {
  background: linear-gradient(90deg, transparent, #bbf7d0, transparent) !important;
}
.igp-hp-eyebrow {
  color: #059669 !important;
  border-color: rgba(5, 150, 105, 0.25) !important;
  background: rgba(5, 150, 105, 0.08) !important;
}
.igp-dot {
  background: #059669 !important;
}
.igp-hp-title {
  color: #0f172a !important;
}
.igp-hp-title em {
  color: #059669 !important;
}
.igp-hp-sub {
  color: #475569 !important;
}
.igp-hp-stats {
  background: rgba(5, 150, 105, 0.06) !important;
  border: 1px solid rgba(5, 150, 105, 0.15) !important;
}
.igp-hp-stat-num {
  color: #059669 !important;
}
.igp-hp-stat-lbl {
  color: #64748b !important;
  font-size: 0.875rem !important;
}
.igp-hp-stat-div {
  background: rgba(5, 150, 105, 0.15) !important;
}

/* IGP cards — light treatment */
.igp-hp-card {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  color: #334155 !important;
}
.igp-hp-card-name {
  color: #0f172a !important;
}
.igp-hp-card-amt {
  color: #059669 !important;
}
.igp-hp-card-settlement {
  color: #475569 !important;
}

/* Skeleton cards — light */
.igp-hp-skel-card {
  background: #e2e8f0 !important;
}

/* CTA buttons */
.igp-hp-cta-btn {
  background: #059669 !important;
  color: #ffffff !important;
  border-color: #059669 !important;
}
.igp-hp-cta-btn:hover {
  background: #047857 !important;
}
.igp-hp-cta-ghost {
  color: #059669 !important;
  border-color: #059669 !important;
}
.igp-hp-cta-ghost:hover {
  background: rgba(5, 150, 105, 0.08) !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   4. #fomo-ticker — /login, /signup activity bar
   Was: background #0f172a (dark navy) with light text
   Fix: Light warm background with dark text
   ═══════════════════════════════════════════════════════════════════════ */
#fomo-ticker {
  background: #fefce8 !important;
  border-bottom: 1px solid #e5e7eb !important;
  color: #1e293b !important;
  font-size: 14px !important;
}
.fomo-ticker-msg {
  color: #475569 !important;
  font-size: 14px !important;
}
.fomo-ticker-msg a {
  color: #b45309 !important;
}
.fomo-ticker-msg a:hover {
  color: #92400e !important;
}
.fomo-ticker-num {
  color: #b45309 !important;
}
.fomo-ticker-sep {
  color: #cbd5e1 !important;
  font-size: 14px !important;
}
.fomo-ticker-icon {
  font-size: 14px !important;
}
.fomo-live-dot {
  color: #059669 !important;
  font-size: 14px !important;
}
.fomo-live-dot::before {
  background: #059669 !important;
}
.fomo-plus-one {
  background: #059669 !important;
  color: #ffffff !important;
  font-size: 14px !important;
}
.fomo-countdown {
  font-size: 14px !important;
}
.fomo-capacity-label {
  font-size: 14px !important;
  color: #64748b !important;
}
.fomo-urgency-badge {
  font-size: 14px !important;
}

/* Badge variants — light mode */
.fomo-badge-closing-soon {
  background: rgba(245, 158, 11, 0.1) !important;
  color: #92400e !important;
  border-color: rgba(245, 158, 11, 0.3) !important;
}
.fomo-badge-final-call {
  background: rgba(220, 38, 38, 0.08) !important;
  color: #dc2626 !important;
  border-color: rgba(220, 38, 38, 0.25) !important;
}
.fomo-badge-closes-today {
  font-size: 14px !important;
}
.fomo-badge-closed {
  color: #64748b !important;
}

/* Capacity bar — light mode */
.fomo-capacity-track {
  background: #e2e8f0 !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   5. PRICING COMPARE TABLE — .th-auto column header
   Was: dark gradient bg with gold text
   Fix: Light blue-tinted header with dark text
   ═══════════════════════════════════════════════════════════════════════ */
.pr-compare-table {
  font-size: 1rem !important;
}
.pr-compare-table th {
  font-size: 0.875rem !important;
}
.pr-compare-table th:first-child {
  font-size: 0.875rem !important;
}
.pr-compare-table th.th-auto {
  background: #eef2ff !important;
  color: #1e40af !important;
}
.pr-compare-table td.td-auto {
  background: rgba(238, 242, 255, 0.4) !important;
}
.pr-compare-table tbody tr:nth-child(even) td.td-auto {
  background: rgba(238, 242, 255, 0.6) !important;
}
.pr-compare-table tbody tr:hover td.td-auto {
  background: rgba(238, 242, 255, 0.8) !important;
}
.pr-compare-table tr.row-highlight td.td-auto {
  background: rgba(191, 135, 0, 0.08) !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   6. .aup-sp-panel — Auth page social proof sidebar
   Was: dark gradient (0f172a → 1e3a5f → 1a4080) with light text
   Fix: Light background with dark text
   ═══════════════════════════════════════════════════════════════════════ */
.aup-sp-panel {
  background: #f8fafc !important;
  color: #0f172a !important;
  border-right: 1px solid #e2e8f0;
}
.aup-sp-panel::before {
  background: radial-gradient(circle, rgba(37, 99, 235, 0.06) 0%, transparent 70%) !important;
}
.aup-sp-panel::after {
  background: radial-gradient(circle, rgba(16, 185, 129, 0.04) 0%, transparent 70%) !important;
}
.aup-sp-title {
  color: #0f172a !important;
}
.aup-sp-stat {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
}
.aup-sp-stat-num {
  color: #1e40af !important;
}
.aup-sp-stat-lbl {
  color: #64748b !important;
}
.aup-sp-signal-text strong {
  color: #0f172a !important;
}
.aup-sp-signal-text {
  color: #475569 !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   7. FONT SIZE MINIMUMS — No font below 14px, body text min 16px
   ═══════════════════════════════════════════════════════════════════════ */

/* Logo tagline — was 10px desktop, 9px mobile */
.sr-logo__tagline {
  font-size: 14px !important;
}

/* Nav elements with small fonts */
.nav-signin-link {
  font-size: 0.875rem !important;
}

/* Nav mega menu small elements */
.mega-col-header {
  font-size: 0.875rem !important;
}
.mega-price {
  font-size: 0.875rem !important;
}
.mega-cs-badge {
  font-size: 0.875rem !important;
}
.mobile-pro-tag {
  font-size: 0.875rem !important;
}

/* Nav new badge */
header[role="banner"] span[style*="font-size: 0.7rem"],
header[role="banner"] span[style*="font-size:0.7rem"] {
  font-size: 0.875rem !important;
}

/* About page small fonts */
#how-were-different span[style*="font-size:0.7rem"] {
  font-size: 0.875rem !important;
}
#how-were-different span[style*="font-size:0.68rem"],
#how-were-different div[style*="font-size:0.68rem"] {
  font-size: 0.875rem !important;
}
#how-were-different span[style*="font-size:0.65rem"],
#how-were-different div[style*="font-size:0.65rem"] {
  font-size: 0.875rem !important;
}
#how-were-different li[style*="font-size:0.88rem"] {
  font-size: 1rem !important;
}

/* IGP section small fonts */
.igp-hp-eyebrow {
  font-size: 0.875rem !important;
}
.igp-hp-sub {
  font-size: 1rem !important;
}

/* Pricing page small fonts */
.pr-product-desc {
  font-size: 1rem !important;
}
.pr-product-cta {
  font-size: 0.875rem !important;
}

/* Auth page small fonts */
.aup-sp-stat-lbl {
  font-size: 0.875rem !important;
}

/* Generic list items should be at least 16px */
.igp-home-preview li,
.igp-home-preview p,
#how-were-different li,
#how-were-different p {
  font-size: 1rem !important;
}

/* Fomo ticker mobile overrides — keep 14px floor */
@media (max-width: 600px) {
  #fomo-ticker {
    font-size: 14px !important;
  }
  .fomo-ticker-msg {
    font-size: 14px !important;
  }
  .fomo-live-dot {
    font-size: 14px !important;
  }
  .fomo-urgency-badge {
    font-size: 14px !important;
  }
}

@media (max-width: 375px) {
  #fomo-ticker {
    font-size: 14px !important;
  }
  .fomo-ticker-msg {
    font-size: 14px !important;
  }
  .fomo-urgency-badge {
    font-size: 14px !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   ABOUT PAGE — Responsive grid fix for competitor comparison
   ═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  #how-were-different .sr-diff-grid {
    grid-template-columns: 1fr !important;
  }
}
