/* pdVerse "Green" theme — modelled on the Hostinger GreenPatch template.
   Loaded LAST on every page (see scripts/site-chrome.js assetTags), so it only re-points
   colors, fonts, radii and button shapes. No markup, IDs or scripts depend on it:
   delete the <link> and the site is back to the previous look. */

/* ---- Palette (light) ------------------------------------------------------ */
:root, :root body, body[data-topic],
:root[data-theme="dark"] body[data-topic="academy"] /* no dark design: stays light, as before */ {
  --tg-green: #107a37; --tg-green-hover: #0c6630; /* template #13883e, darkened for AA text contrast */
  --tg-fill: #107a37; --tg-fill-hover: #0c6630; --tg-deep: #012f1f; --tg-sage: #f4f7f4; --tg-paper: #fcfcfc;

  /* storefront / library pages */
  --ink: #012f1f; --body: #33423b; --muted: #5f6f67; --hairline: #dfe7e0;
  --soft: #f4f7f4; --card: #ffffff; --canvas: #fcfcfc; --glass: rgba(252, 252, 252, 0.94);
  --dark: #012f1f; --dark-soft: #a9c2b4;
  --green: #107a37; --green-hover: #0c6630; --green-soft: #e8f3eb; --green-border: #c3e2cc;
  --teal: #107a37; --teal-hover: #0c6630; --teal-soft: #e8f3eb; --teal-border: #c3e2cc;
  --brown: #107a37; --brown-hover: #0c6630; --brown-soft: #e8f3eb; --brown-border: #c3e2cc;
  --purple: #107a37; --purple-hover: #0c6630; --purple-soft: #e8f3eb; --purple-border: #c3e2cc; --purple-glow: rgba(19, 136, 62, 0.22);
  --glow: rgba(19, 136, 62, 0.22);
  --radius-sm: 8px; --radius: 12px; --radius-lg: 16px;
  --shadow-sm: 0 1px 2px rgba(1, 47, 31, 0.05);
  --shadow-md: 0 10px 24px -8px rgba(1, 47, 31, 0.10);
  --shadow-lg: 0 24px 48px -16px rgba(1, 47, 31, 0.16);

  /* PrepSprint / generated pages (every topic gets the same green) */
  --ps-ink: #012f1f; --ps-body: #33423b; --ps-muted: #5f6f67; --ps-line: #dfe7e0;
  --ps-paper: #fcfcfc; --ps-card: #ffffff; --ps-soft: #f4f7f4; --ps-radius: 12px;
  --ps-primary: #107a37; --ps-primary-dark: #0c6630; --ps-primary-soft: #f4f7f4; --ps-primary-border: #c3e2cc;
  --ps-green: #107a37; --ps-green-dark: #0c6630; --ps-green-soft: #e8f3eb;
  --ps-glow: rgba(19, 136, 62, 0.20); --ps-shadow: 0 16px 40px rgba(1, 47, 31, .07);
  --ps-hero-panel-bg: #012f1f; --ps-hero-panel-border: rgba(19, 136, 62, 0.35);
  --ps-hero-panel-kicker: #7fd79b; --ps-hero-panel-chain: #3fbf6b;
  --ps-hero-gradient: radial-gradient(circle at 85% 15%, rgba(19, 136, 62, 0.14), transparent 32rem), #f4f7f4;
}

/* ---- Palette (dark: same greens, night version) --------------------------- */
:root[data-theme="dark"], html[data-theme="dark"] body, html[data-theme="dark"] body[data-topic], body[data-theme="dark"],
/* Complete Library and 404 are designed dark in every mode */
:root:has(.bundle-hero), :root:has(.bundle-hero) body, :root:has(.not-found-card), :root:has(.not-found-card) body {
  --ink: #eef6f0; --body: #cfdcd4; --muted: #93a89c; --hairline: #1c3a2c;
  --soft: #0b1f16; --card: #0f2a1e; --canvas: #06140e; --glass: rgba(6, 20, 14, 0.92);
  --dark: #01140d; --dark-soft: #7e988a;
  --green: #5bd083; --green-hover: #7fdc9e; --green-soft: rgba(63, 191, 107, 0.12); --green-border: rgba(63, 191, 107, 0.28);
  --teal: #5bd083; --teal-hover: #7fdc9e; --teal-soft: rgba(63, 191, 107, 0.12); --teal-border: rgba(63, 191, 107, 0.28);
  --brown: #5bd083; --brown-hover: #7fdc9e; --brown-soft: rgba(63, 191, 107, 0.12); --brown-border: rgba(63, 191, 107, 0.28);
  --purple: #5bd083; --purple-hover: #7fdc9e; --purple-soft: rgba(63, 191, 107, 0.12); --purple-border: rgba(63, 191, 107, 0.28); --purple-glow: rgba(63, 191, 107, 0.30);
  --card-bg: rgba(15, 42, 30, 0.72); --border: rgba(255, 255, 255, 0.10); --accent: #5bd083;
  --glow: rgba(63, 191, 107, 0.30);
  --ps-ink: #eef6f0; --ps-body: #cfdcd4; --ps-muted: #93a89c; --ps-line: rgba(255, 255, 255, 0.10);
  --ps-paper: #06140e; --ps-card: #0f2a1e; --ps-soft: #0b1f16;
  --ps-primary: #5bd083; --ps-primary-dark: #107a37; --ps-primary-soft: #0b1f16; --ps-primary-border: rgba(63, 191, 107, 0.28);
  --ps-hero-gradient: radial-gradient(circle at 85% 15%, rgba(63, 191, 107, 0.12), transparent 32rem), #0b1f16;
}

/* ---- Typography: DM Sans headings, Montserrat text ------------------------ */
body, button, input, select, textarea { font-family: Montserrat, system-ui, sans-serif; }
h1, h2, h3, h4, h5, h6, .auth-card h2,
.banner-text strong,
.book-body h3,
.brand,
.bundle-hero h1,
.bundle-item-card h3,
.card h3,
.card-box h2,
.category-icon,
.chapter-abstract h3,
.chapter-interview-answers h3,
.cluster-hero h1,
.cluster-section h2,
.complete-library-price strong,
.confirmation-card h2,
.dp-banner-pill,
.dp-card-body h3,
.dp-hub-title,
.dp-stat-item strong,
.dp-subcategory-header h2,
.footer-logo,
.legal-content h2,
.logo,
.lookup-card h2,
.lp-tool-card > span,
.lp-tool-footer strong,
.mockup-title,
.next-steps-title,
.not-found-card h1,
.not-found-code,
.pdf-expired-overlay h3,
.pdf-paywall-card h3,
.pdf-reader-title,
.pdv-logo,
.prepsprint-hub-card strong,
.price-row strong,
.price-tag,
.ps-brand,
.ps-chain,
.ps-product span,
.ps-sta-visual figcaption strong,
.ps-steps article > span,
.ps-topic-icon,
.ps-upgrade-banner h2,
.review-modal-header h3,
.scenario-card h3,
.section-title,
.stat-value,
.ticket-badge,
.ticket-title { font-family: "DM Sans", system-ui, sans-serif; }
h1, h2, h3 { font-weight: 500; letter-spacing: -0.015em; }
h1 { line-height: 1.12; }

/* ---- Buttons: pills ------------------------------------------------------- */
.btn, .ps-button, .dp-btn, .lp-download-button, .sa-bundle-button, .sa-cta,
.pdv-nav-prep, button[type="submit"], a[data-action="buy"], button[data-action="buy"] {
  border-radius: 999px !important;
}
.btn-primary, .ps-button-primary, .dp-btn-primary,
.btn-brown, .btn-lowpower, .btn-academy, .btn-purple {
  background: var(--tg-fill) !important; border-color: var(--tg-fill) !important; color: #fff !important;
  box-shadow: none;
}
.btn-primary:hover, .ps-button-primary:hover, .dp-btn-primary:hover,
.btn-brown:hover, .btn-lowpower:hover, .btn-academy:hover, .btn-purple:hover {
  background: var(--tg-fill-hover) !important; border-color: var(--tg-fill-hover) !important;
}

/* ---- Cards: sage, soft corners, no heavy shadow --------------------------- */
.card, .book-card, .ps-card, .dp-card, .bundle-item-card, .faq-item, .review-card, .prepsprint-hub-card {
  border-radius: var(--radius) !important;
}

/* ---- Header: light bar, deep-green links ---------------------------------- */
.pdv-site-header { background: var(--glass) !important; border-bottom-color: var(--hairline) !important; }
.pdv-nav-menu a, .pdv-nav-trigger { font-family: Montserrat, system-ui, sans-serif; }
.pdv-logo, .pdv-logo span:last-child { font-family: "DM Sans", system-ui, sans-serif; font-weight: 500; }
.pdv-logo-mark, .ps-brand-mark { background: var(--tg-fill) !important; color: #fff !important; box-shadow: none !important; }
.pdv-site-header .pdv-nav-menu .pdv-nav-prep { padding: 8px 18px; white-space: nowrap; background: var(--tg-fill) !important; color: #fff !important; }
.pdv-site-header .pdv-nav-menu .pdv-nav-prep:hover { background: var(--tg-fill-hover) !important; }

/* ---- Footers: deep green -------------------------------------------------- */
.footer, .ps-footer, .site-footer, .page-footer, .ce-footer {
  background: #012f1f !important; border-top-color: #0a4a31 !important;
}
.footer-bottom, .ps-footer-bottom { border-top-color: rgba(255, 255, 255, 0.12) !important; }
.footer p, .footer a:not(.logo):not(.btn), .ps-footer, .ps-footer a, .ps-footer p, .site-footer, .site-footer a { color: #b9cfc2 !important; }
.footer a:hover, .ps-footer a:hover, .site-footer a:hover { color: #ffffff !important; }
.ps-footer-support a { color: #7fd79b !important; }

/* ---- Homepage hero: the template's dark band with white text ------------- */
.hero:has(.hero-grid) {
  background: radial-gradient(circle at 80% 30%, rgba(19, 136, 62, 0.45), transparent 55%), #012f1f;
  color: #fcfcfc;
}
.hero:has(.hero-grid) h1, .hero:has(.hero-grid) h1 * { color: #fcfcfc !important; }
.hero:has(.hero-grid) :is(.hero-text, .hero-pack, .hero-quote, .hero-quote cite, p) { color: #d7e6dc !important; }
.hero:has(.hero-grid) .hero-pack a { color: #7fd79b !important; }
.hero:has(.hero-grid) :is(.btn-secondary, .btn-outline) { background: #fcfcfc !important; color: #107a37 !important; border-color: #fcfcfc !important; }
.hero:has(.hero-grid) .hero-mascot-glow { background: radial-gradient(circle at center, rgba(63, 191, 107, 0.35) 0%, transparent 70%); }
.hero:has(.hero-grid) :is([class*="badge"], [class*="eyebrow"], [class*="kicker"]) { color: #fcfcfc; background: rgba(255, 255, 255, 0.10); border-color: rgba(255, 255, 255, 0.22); }

/* ---- Sections: alternate paper / sage, like the template ------------------ */
.section.soft, .cta-section { background: var(--soft); }
.cta-card { background: var(--tg-fill) !important; border: 0 !important; color: #fcfcfc; }
.cta-card h2, .cta-card h3, .cta-card p { color: #fcfcfc !important; }
.cta-card .btn-primary { background: #fcfcfc !important; color: #107a37 !important; border-color: #fcfcfc !important; }

/* ---- Leftovers set inline or with hard-coded navy ------------------------- */
.ps-lead { color: var(--ps-body) !important; }
:not(text):not(tspan)[style*="Outfit"] { font-family: "DM Sans", system-ui, sans-serif !important; }
:not(text):not(tspan)[style*="Inter"] { font-family: Montserrat, system-ui, sans-serif !important; }
.complete-library-banner { background: radial-gradient(circle at 85% 20%, rgba(19, 136, 62, 0.55), transparent 60%), #012f1f !important; }
/* The checkout popup (checkout.js) keeps its own colours; only the shared button shape and font apply. */
.complete-library-banner .eyebrow, .complete-library-banner [class*="eyebrow"] { color: #7fd79b !important; background: rgba(255, 255, 255, 0.10) !important; border-color: rgba(255, 255, 255, 0.22) !important; }

/* ---- Dark mode: prepsprint.css hard-codes navy on these; night-green instead (diagrams and the always-light Signoff Academy excluded) */
html[data-theme="dark"] body:not([data-topic="academy"]) .ps-answer-card { background: #0f2a1e; }
html[data-theme="dark"] body:not([data-topic="academy"]) .ps-guide-takeaways { background: #0f2a1e; }
html[data-theme="dark"] body:not([data-topic="academy"]) .ps-related-topics a,
html[data-theme="dark"] body:not([data-topic="academy"]) .ps-related-questions a,
html[data-theme="dark"] body:not([data-topic="academy"]) .ps-prev-next a,
html[data-theme="dark"] body:not([data-topic="academy"]) .ps-guide-question,
html[data-theme="dark"] body:not([data-topic="academy"]) .ps-sticky-card { background: #0f2a1e; }
html[data-theme="dark"] body:not([data-topic="academy"]) .ps-level-nav a,
html[data-theme="dark"] body:not([data-topic="academy"]) .ps-copy,
html[data-theme="dark"] body:not([data-topic="academy"]) .ps-share a { background: #0f2a1e; }
html[data-theme="dark"] body:not([data-topic="academy"]) .ps-button-ghost { background: #0f2a1e; }
html[data-theme="dark"] body:not([data-topic="academy"]) .ps-topic-card,
html[data-theme="dark"] body:not([data-topic="academy"]) .ps-library-topic,
html[data-theme="dark"] body:not([data-topic="academy"]) .ps-steps article,
html[data-theme="dark"] body:not([data-topic="academy"]) .ps-level-card,
html[data-theme="dark"] body:not([data-topic="academy"]) .lp-chapter-card,
html[data-theme="dark"] body:not([data-topic="academy"]) .lp-track-card,
html[data-theme="dark"] body:not([data-topic="academy"]) .lp-tool-card { background: #0f2a1e; }
html[data-theme="dark"] body:not([data-topic="academy"]) .lp-simple-links a { background: #0f2a1e; }
html[data-theme="dark"] body:not([data-topic="academy"]) .lp-guide-coming-line span,
html[data-theme="dark"] body:not([data-topic="academy"]) .lp-coming-badge { background: #0f2a1e; }
html[data-theme="dark"] body:not([data-topic="academy"]) .ps-filter-buttons { background: #0b1f16; }
html[data-theme="dark"] body:not([data-topic="academy"]) .ps-subtopic-buttons button { background: #0f2a1e; }
html[data-theme="dark"] body:not([data-topic="academy"]) .ps-pillar-strip-links a { background: #0f2a1e; }
html[data-theme="dark"] body:not([data-topic="academy"]) .ps-guide-toolbar { background: #0f2a1e; }
/* ---- Complete Library / 404: their sky-blue accent and navy panels -> green */
:root:has(.bundle-hero) .bundle-pricing-card { background-image: linear-gradient(135deg, rgba(20, 52, 38, 0.8), rgba(15, 42, 30, 0.95)); }
:root:has(.not-found-card) .quick-nav-card { background-color: rgba(20, 52, 38, 0.6); }
:root:has(.not-found-card) .quick-nav-card:hover { background-color: rgba(20, 52, 38, 0.9); }
:root:has(.bundle-hero) .bundle-pricing-card { border: 2px solid rgba(91, 208, 131, 0.4); box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5), 0 0 40px rgba(91, 208, 131, 0.15); }
:root:has(.bundle-hero) .price-row strong { color: #5bd083; }
:root:has(.not-found-card) .not-found-code { background-image: linear-gradient(135deg, #5bd083, #a7e8bd); }
:root:has(.bundle-hero) [style*="#38bdf8"], :root:has(.not-found-card) [style*="#38bdf8"] { color: #5bd083 !important; }
:root:has(.bundle-hero) [style*="rgba(56, 189, 248"] { background: rgba(91, 208, 131, 0.15) !important; }
:root:has(.bundle-hero) [style*="rgba(56,189,248"] { background: radial-gradient(circle at 85% 15%, rgba(19, 136, 62, 0.35), transparent 60%), #0f2a1e !important; border-color: rgba(91, 208, 131, 0.3) !important; }
.pdv-site-header .pdv-nav-menu .pdv-nav-prep { display: inline-flex; align-items: center; align-self: center; }

/* ---- Phone-width fixes (these pages already overflowed before the theme) --- */
.price-row { flex-wrap: wrap; }
.ps-question-row a > span { min-width: 0; }
.ps-question-row a strong, .ps-question-row a small { overflow-wrap: anywhere; }
.sa-hero-visual { overflow-x: clip; }
@media (max-width: 1024px) {
  /* wide code and tables scroll inside their own box instead of widening the page */
  pre, .ps-guide-answer > code, .ps-answer-card > code, code[class*="block"] { max-width: 100%; overflow-x: auto; }
  /* button rows and long labels wrap */
  .dp-toolbar-actions, .ps-filter-buttons, .ps-subtopic-buttons { flex-wrap: wrap; }
  .ps-guide-question .ps-button, .sidebar .btn { white-space: normal; max-width: 100%; }
  .main-content, .sidebar, .ps-guide-question { min-width: 0; }
  .main-content li, .ps-guide-question { overflow-wrap: anywhere; }
  .dp-promo-actions { flex-wrap: wrap; }
  .dp-promo-actions .dp-btn { white-space: normal; max-width: 100%; }
  .dp-nav-grid { grid-template-columns: minmax(0, 1fr); }
  .dp-nav-card { box-sizing: border-box; min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
  .dp-reading-container p code, .dp-reading-container li code, .dp-reading-container .tldr { overflow-wrap: anywhere; }
  /* chapter data tables can be wider than a tablet: scroll inside their own box */
  .dp-reading-container table { display: block; max-width: 100%; overflow-x: auto; }
}
@media (max-width: 680px) {
  main table, article table, .cluster-table { display: block; max-width: 100%; overflow-x: auto; }
}
