/* ═══════════════════════════════════════════════════════════════
   Cheat-Sheet Aesthetic Override — scoped to body.cheatsheet-theme
   ---------------------------------------------------------------
   Dual-theme version: LIGHT is the default, DARK activates under
   html[data-theme="dark"]. All palette tokens live in CSS vars so
   the same selectors serve both modes.
═══════════════════════════════════════════════════════════════ */

/* ── Light palette (default) ─────────────────────────────── */
body.cheatsheet-theme {
  --cs-bg:         #ffffff;   /* pure white page background */
  --cs-bg-deep:    #ffffff;   /* deepest surfaces stay white */
  --cs-card:       #ffffff;   /* card background */
  --cs-card-hi:    #f5f5f7;   /* barely-there neutral grey for hover */
  --cs-border:     rgba(26, 26, 46, .12);
  --cs-border-hi:  rgba(37, 99, 235, .35);

  /* Accent (var name kept as --cs-gold to avoid touching every selector) */
  --cs-gold:       #2563EB;   /* brand blue */
  --cs-gold-lt:    #1d4ed8;   /* deeper blue for hover */
  --cs-gold-bg:    rgba(37, 99, 235, .1);

  --cs-text:       #1a1a2e;   /* dark navy for body */
  --cs-text-hi:    #0a0a1a;
  --cs-muted:      #5d6a7a;
  --cs-dim:        #8b96a5;

  /* Category pill colors — set-aside switched to purple so it stays
     distinct from solicitation (blue) now that the accent is blue. */
  --cs-blue:       #1d4ed8;
  --cs-blue-bg:    rgba(37, 99, 235, .1);
  --cs-green:      #047857;
  --cs-green-bg:   rgba(5, 150, 105, .1);
  --cs-purple:     #6d28d9;
  --cs-purple-bg:  rgba(124, 58, 237, .1);
  --cs-shadow:     0 1px 2px rgba(26, 26, 46, .04), 0 4px 12px rgba(26, 26, 46, .04);

  /* Navbar / footer always stay dark in both themes for contrast */
  --cs-nav-bg:     #0b1117;
  --cs-nav-border: rgba(255, 255, 255, .08);
  --cs-nav-text:   #e6edf3;
  --cs-nav-muted:  #8b949e;

  background: var(--cs-bg) !important;
  color: var(--cs-text);
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* ── Dark palette override ──────────────────────────────── */
html[data-theme="dark"] body.cheatsheet-theme {
  --cs-bg:         #0f1923;
  --cs-bg-deep:    #0b1117;
  --cs-card:       #161b22;
  --cs-card-hi:    #1c222b;
  --cs-border:     rgba(255, 255, 255, .08);
  --cs-border-hi:  rgba(96, 165, 250, .3);

  /* Accent: bright blue on dark */
  --cs-gold:       #60a5fa;
  --cs-gold-lt:    #93c5fd;
  --cs-gold-bg:    rgba(96, 165, 250, .12);

  --cs-text:       #e6edf3;
  --cs-text-hi:    #ffffff;
  --cs-muted:      #8b949e;
  --cs-dim:        #6e7681;

  --cs-blue:       #58a6ff;
  --cs-blue-bg:    rgba(56, 139, 253, .12);
  --cs-green:      #3fb950;
  --cs-green-bg:   rgba(46, 160, 67, .12);
  --cs-purple:     #a78bfa;
  --cs-purple-bg:  rgba(167, 139, 250, .12);
  --cs-shadow:     none;

  /* Override the global palette tokens that inline styles on tool
     pages reference. These flip dark text → light text in dark mode
     without touching any HTML. Backgrounds that use --navy still get
     it from the global :root, so this only affects color contexts. */
  --text-primary:   #e6edf3;
  --text-secondary: #c9d1d9;
}

body.cheatsheet-theme ::selection {
  background: var(--cs-gold-bg);
  color: var(--cs-text-hi);
}

/* ── Navbar — always dark in both themes ─────────────────── */
body.cheatsheet-theme .navbar {
  background: var(--cs-nav-bg) !important;
  border-bottom: 1px solid var(--cs-nav-border) !important;
  box-shadow: none !important;
}
body.cheatsheet-theme .navbar .nav-logo {
  color: var(--cs-nav-text) !important;
}
body.cheatsheet-theme .navbar .nav-logo span {
  color: #2563EB !important;
}
body.cheatsheet-theme .navbar .nav-links a {
  color: var(--cs-nav-muted) !important;
}
body.cheatsheet-theme .navbar .nav-links a:hover,
body.cheatsheet-theme .navbar .nav-links a.active {
  color: var(--cs-gold-lt) !important;
}
html[data-theme="dark"] body.cheatsheet-theme .navbar .nav-links a:hover,
html[data-theme="dark"] body.cheatsheet-theme .navbar .nav-links a.active {
  color: var(--cs-gold) !important;
}

/* Sign in / sign out / account buttons — visible on dark navbar */
body.cheatsheet-theme .navbar .btn--ghost,
body.cheatsheet-theme .navbar .nav-cta .btn--ghost {
  color: var(--cs-nav-text) !important;
  background: transparent !important;
  border: 1px solid rgba(255, 255, 255, .18) !important;
}
body.cheatsheet-theme .navbar .btn--ghost:hover {
  border-color: var(--cs-gold-lt) !important;
  color: var(--cs-gold-lt) !important;
}
body.cheatsheet-theme .navbar .btn--primary {
  background: var(--cs-gold-lt) !important;
  color: var(--cs-nav-bg) !important;
  border: none !important;
}
body.cheatsheet-theme .navbar .btn--primary:hover {
  background: var(--cs-gold) !important;
}

/* Welcome name + nav bell — inherit light text */
body.cheatsheet-theme .navbar .nav-cta > span {
  color: var(--cs-nav-muted) !important;
}
body.cheatsheet-theme .navbar #navBellIcon {
  stroke: var(--cs-nav-muted) !important;
}

/* Hamburger button bars — visible on dark navbar */
body.cheatsheet-theme .navbar .hamburger span {
  background: var(--cs-nav-text) !important;
}

/* Theme toggle (light/dark button added by dark-mode.js) */
body.cheatsheet-theme .theme-toggle {
  color: var(--cs-nav-muted) !important;
}
body.cheatsheet-theme .theme-toggle:hover {
  color: var(--cs-gold-lt) !important;
}

/* Tools row — the inline-styled div right after .opp-hero */
body.cheatsheet-theme .opp-hero + div {
  background: var(--cs-nav-bg) !important;
  border-bottom: 1px solid var(--cs-nav-border) !important;
}
/* Tool icon labels stay white — was muted slate, made unreadable */
body.cheatsheet-theme .opp-hero + div a span {
  color: #ffffff !important;
}

/* ── Hero ──────────────────────────────────────────────────── */
/* Background photo: documents being signed (Unsplash). Layered under
   a high-opacity bg overlay so the headline stays readable in both
   themes. */
body.cheatsheet-theme .opp-hero {
  background:
    linear-gradient(180deg, rgba(255,255,255,.76) 0%, rgba(255,255,255,.84) 100%),
    url('https://images.unsplash.com/photo-1450101499163-c8848c66ca85?w=1600&q=80&auto=format&fit=crop') center 40% / cover no-repeat !important;
  padding: calc(var(--nav-height) + 3rem) 0 3rem !important;
  text-align: center;
  border-bottom: 1px solid var(--cs-border);
}

html[data-theme="dark"] body.cheatsheet-theme .opp-hero {
  background:
    linear-gradient(180deg, rgba(11,17,23,.84) 0%, rgba(15,25,35,.92) 100%),
    url('https://images.unsplash.com/photo-1450101499163-c8848c66ca85?w=1600&q=80&auto=format&fit=crop') center 40% / cover no-repeat !important;
}

body.cheatsheet-theme .opp-hero .container {
  max-width: 1100px;
  text-align: center;
}

body.cheatsheet-theme .opp-hero-eyebrow {
  display: inline-flex;
  justify-content: center;
  font-family: 'Poppins', system-ui, sans-serif;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--cs-gold) !important;
  margin: 0 auto .75rem;
}

body.cheatsheet-theme .opp-hero-title {
  font-family: 'Poppins', system-ui, sans-serif !important;
  font-weight: 800;
  font-size: clamp(2rem, 5vw, 3.2rem) !important;
  color: var(--cs-text-hi) !important;
  line-height: 1.15;
  margin: 0 auto .75rem !important;
  max-width: 800px;
  letter-spacing: -0.01em;
}

body.cheatsheet-theme .opp-hero-sub {
  font-family: 'Poppins', system-ui, sans-serif;
  font-size: 1.1rem !important;
  color: var(--cs-muted) !important;
  max-width: 600px;
  margin: 0 auto 1.5rem !important;
  line-height: 1.5;
}

body.cheatsheet-theme .opp-hero-meta {
  justify-content: center;
  font-family: 'JetBrains Mono', monospace;
  font-size: .78rem !important;
  color: var(--cs-dim) !important;
  gap: .75rem;
}

body.cheatsheet-theme .opp-hero-meta-sep {
  color: var(--cs-border) !important;
}

/* ── Filter bar ────────────────────────────────────────────── */
body.cheatsheet-theme .opp-filter-bar {
  background: var(--cs-bg) !important;
  border-bottom: 1px solid var(--cs-border) !important;
  box-shadow: none !important;
}

body.cheatsheet-theme .opp-tabs {
  border-bottom: 1px solid var(--cs-border) !important;
}

body.cheatsheet-theme .opp-tab {
  font-family: 'Poppins', system-ui, sans-serif;
  font-size: .78rem !important;
  font-weight: 600;
  color: var(--cs-muted) !important;
  letter-spacing: .02em;
  background: transparent !important;
}

body.cheatsheet-theme .opp-tab:hover {
  color: var(--cs-gold-lt) !important;
}

body.cheatsheet-theme .opp-tab.active {
  color: var(--cs-gold) !important;
  border-bottom-color: var(--cs-gold) !important;
}

body.cheatsheet-theme .opp-tab--pro {
  color: var(--cs-dim) !important;
}

/* ── Date range bar ────────────────────────────────────────── */
body.cheatsheet-theme .opp-date-bar {
  border-top: 1px solid var(--cs-border) !important;
}

body.cheatsheet-theme .opp-date-label {
  font-family: 'Poppins', system-ui, sans-serif;
  font-size: .72rem !important;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--cs-dim) !important;
}

body.cheatsheet-theme .opp-date-pill {
  background: var(--cs-card) !important;
  border: 1px solid var(--cs-border) !important;
  color: var(--cs-muted) !important;
  font-family: 'JetBrains Mono', monospace;
  font-size: .74rem !important;
  font-weight: 500;
  letter-spacing: 0;
  transition: all .18s ease;
  box-shadow: var(--cs-shadow);
}

body.cheatsheet-theme .opp-date-pill:hover {
  border-color: var(--cs-border-hi) !important;
  color: var(--cs-gold) !important;
}

body.cheatsheet-theme .opp-date-pill.active {
  background: var(--cs-gold-bg) !important;
  border-color: var(--cs-gold) !important;
  color: var(--cs-gold) !important;
}

body.cheatsheet-theme .opp-date-note {
  font-family: 'JetBrains Mono', monospace;
  font-size: .7rem !important;
  color: var(--cs-dim) !important;
}

/* ── Search / select inputs ────────────────────────────────── */
body.cheatsheet-theme .opp-search-wrap {
  background: var(--cs-card) !important;
  border: 1px solid var(--cs-border) !important;
  box-shadow: var(--cs-shadow);
}
body.cheatsheet-theme .opp-search-wrap:focus-within {
  border-color: var(--cs-gold) !important;
  box-shadow: 0 0 0 3px var(--cs-gold-bg) !important;
}
body.cheatsheet-theme .opp-search-icon {
  color: var(--cs-dim) !important;
}
body.cheatsheet-theme .opp-search-input {
  background: transparent !important;
  color: var(--cs-text) !important;
  font-family: 'Poppins', system-ui, sans-serif;
}
body.cheatsheet-theme .opp-search-input::placeholder {
  color: var(--cs-dim) !important;
}

body.cheatsheet-theme .opp-select {
  background: var(--cs-card) !important;
  border: 1px solid var(--cs-border) !important;
  color: var(--cs-text) !important;
  font-family: 'Poppins', system-ui, sans-serif;
  box-shadow: var(--cs-shadow);
}
body.cheatsheet-theme .opp-select:focus {
  border-color: var(--cs-gold) !important;
  box-shadow: 0 0 0 3px var(--cs-gold-bg) !important;
}

body.cheatsheet-theme .opp-clear-btn {
  background: transparent !important;
  border: 1px solid var(--cs-border) !important;
  color: var(--cs-muted) !important;
  font-family: 'Poppins', system-ui, sans-serif;
}
body.cheatsheet-theme .opp-clear-btn:hover {
  border-color: var(--cs-gold) !important;
  color: var(--cs-gold) !important;
}

/* ── Main results area ────────────────────────────────────── */
body.cheatsheet-theme .opp-main {
  background: var(--cs-bg) !important;
}

/* Stats / toolbar bar */
body.cheatsheet-theme .opp-stats {
  background: var(--cs-card) !important;
  border: 1px solid var(--cs-border) !important;
  color: var(--cs-muted) !important;
  box-shadow: var(--cs-shadow);
}
body.cheatsheet-theme #oppStatsText {
  font-family: 'JetBrains Mono', monospace;
  font-size: .78rem !important;
  color: var(--cs-muted) !important;
}
body.cheatsheet-theme .opp-stats-badges .badge {
  background: var(--cs-gold-bg) !important;
  color: var(--cs-gold) !important;
  border: 1px solid var(--cs-border-hi) !important;
  font-family: 'JetBrains Mono', monospace;
  font-size: .65rem !important;
}

body.cheatsheet-theme .toolbar-btn {
  background: var(--cs-card) !important;
  border: 1px solid var(--cs-border) !important;
  color: var(--cs-muted) !important;
  font-family: 'Poppins', system-ui, sans-serif;
}
body.cheatsheet-theme .toolbar-btn:hover {
  border-color: var(--cs-gold) !important;
  color: var(--cs-gold) !important;
}
body.cheatsheet-theme .toolbar-btn-pro-badge {
  background: var(--cs-gold) !important;
  color: var(--cs-bg-deep) !important;
}

/* ── Results table ────────────────────────────────────────── */
body.cheatsheet-theme .opp-table-wrap {
  background: var(--cs-card) !important;
  border: 1px solid var(--cs-border) !important;
  border-radius: 10px;
  box-shadow: var(--cs-shadow);
}

body.cheatsheet-theme .opp-table {
  background: transparent !important;
  font-family: 'Poppins', system-ui, sans-serif;
}

body.cheatsheet-theme .opp-table thead tr {
  background: var(--cs-card-hi) !important;
  border-bottom: 1px solid var(--cs-border) !important;
}
body.cheatsheet-theme .opp-table th {
  font-family: 'Poppins', system-ui, sans-serif !important;
  font-weight: 700 !important;
  font-size: .72rem !important;
  text-transform: uppercase;
  letter-spacing: .12em !important;
  color: var(--cs-gold) !important;
  padding: .85rem 1rem !important;
  border-bottom: 1px solid var(--cs-border) !important;
}

body.cheatsheet-theme .opp-table tbody tr {
  background: var(--cs-card) !important;
  border-bottom: 1px solid var(--cs-border) !important;
  transition: background .15s ease;
}
body.cheatsheet-theme .opp-table tbody tr:hover {
  background: var(--cs-card-hi) !important;
}
body.cheatsheet-theme .opp-table td {
  color: var(--cs-text) !important;
  padding: .9rem 1rem !important;
  border-bottom: 1px solid var(--cs-border) !important;
  font-size: .86rem !important;
}
body.cheatsheet-theme .opp-table td a {
  color: var(--cs-text) !important;
  font-weight: 600;
}
body.cheatsheet-theme .opp-table td a:hover {
  color: var(--cs-gold-lt) !important;
}
body.cheatsheet-theme .opp-table .row-title,
body.cheatsheet-theme .opp-table .row-title a {
  color: var(--cs-text-hi) !important;
}
body.cheatsheet-theme .opp-table .row-sub,
body.cheatsheet-theme .opp-table .row-meta,
body.cheatsheet-theme .opp-table .row-agency-sub {
  color: var(--cs-muted) !important;
  font-family: 'JetBrains Mono', monospace;
  font-size: .72rem !important;
}
body.cheatsheet-theme .opp-table .col-posted,
body.cheatsheet-theme .opp-table .col-deadline {
  font-family: 'JetBrains Mono', monospace;
  font-size: .78rem !important;
}

/* Row category / set-aside pills */
body.cheatsheet-theme .opp-table .badge,
body.cheatsheet-theme .opp-table .type-pill,
body.cheatsheet-theme .opp-table .setaside-pill {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: .65rem !important;
  letter-spacing: .08em;
  text-transform: uppercase;
  border-radius: 4px;
  padding: .2rem .55rem;
  font-weight: 600;
}
body.cheatsheet-theme .opp-table .type-pill--solicitation,
body.cheatsheet-theme .opp-table .badge-solicitation {
  background: var(--cs-blue-bg) !important;
  color: var(--cs-blue) !important;
}
body.cheatsheet-theme .opp-table .type-pill--award,
body.cheatsheet-theme .opp-table .badge-award {
  background: var(--cs-green-bg) !important;
  color: var(--cs-green) !important;
}
body.cheatsheet-theme .opp-table .setaside-pill,
body.cheatsheet-theme .opp-table .badge-setaside {
  background: var(--cs-purple-bg) !important;
  color: var(--cs-purple) !important;
}

/* ── Live-recent strip ─────────────────────────────────────── */
body.cheatsheet-theme .live-recent {
  background: var(--cs-card) !important;
  border: 1px solid var(--cs-border) !important;
  border-radius: 10px;
  box-shadow: var(--cs-shadow);
}
body.cheatsheet-theme .live-recent-title {
  font-family: 'Poppins', system-ui, sans-serif;
  color: var(--cs-text-hi) !important;
  font-size: .82rem !important;
  letter-spacing: .02em;
}
body.cheatsheet-theme .live-recent-source {
  font-family: 'JetBrains Mono', monospace;
  font-size: .7rem !important;
  color: var(--cs-dim) !important;
}
body.cheatsheet-theme .live-recent-grid > * {
  background: var(--cs-bg) !important;
  border: 1px solid var(--cs-border) !important;
  color: var(--cs-muted) !important;
  font-family: 'Poppins', system-ui, sans-serif;
}
body.cheatsheet-theme .live-recent-grid > *:hover {
  border-color: var(--cs-border-hi) !important;
  color: var(--cs-text) !important;
}

/* ── Loading / error / empty states ────────────────────────── */
body.cheatsheet-theme .opp-loading,
body.cheatsheet-theme .opp-error,
body.cheatsheet-theme .opp-empty {
  color: var(--cs-muted) !important;
}
body.cheatsheet-theme .opp-loading h3,
body.cheatsheet-theme .opp-error h3,
body.cheatsheet-theme .opp-empty h3 {
  font-family: 'Poppins', system-ui, sans-serif !important;
  color: var(--cs-text-hi) !important;
}
body.cheatsheet-theme .opp-spinner {
  border-color: var(--cs-border) !important;
  border-top-color: var(--cs-gold) !important;
}
body.cheatsheet-theme .opp-error code {
  background: var(--cs-card) !important;
  color: var(--cs-gold) !important;
  font-family: 'JetBrains Mono', monospace;
  border: 1px solid var(--cs-border);
}

/* ── Load more button ─────────────────────────────────────── */
body.cheatsheet-theme .opp-load-more-wrap .btn {
  background: transparent !important;
  border: 1px solid var(--cs-gold) !important;
  color: var(--cs-gold) !important;
  font-family: 'Poppins', system-ui, sans-serif;
}
body.cheatsheet-theme .opp-load-more-wrap .btn:hover {
  background: var(--cs-gold-bg) !important;
  color: var(--cs-gold-lt) !important;
}

/* ── Update banner ─────────────────────────────────────── */
body.cheatsheet-theme #updateBanner {
  background: var(--cs-blue-bg) !important;
  border-bottom: 1px solid var(--cs-blue) !important;
  color: var(--cs-blue) !important;
  font-family: 'JetBrains Mono', monospace;
  font-size: .78rem !important;
}

/* ── Paywall overlay ──────────────────────────────────── */
body.cheatsheet-theme #oppPaywall > div:first-child {
  background: linear-gradient(transparent 0%, var(--cs-bg) 90%) !important;
}
body.cheatsheet-theme #oppPaywallCta {
  background: var(--cs-bg) !important;
}
body.cheatsheet-theme #oppPaywallCta > div {
  background: var(--cs-card) !important;
  border: 1px solid var(--cs-border-hi) !important;
}
body.cheatsheet-theme #oppPaywallCta h3 {
  font-family: 'Poppins', system-ui, sans-serif !important;
  color: var(--cs-text-hi) !important;
}
body.cheatsheet-theme #oppPaywallCta p {
  color: var(--cs-muted) !important;
}

/* ── Company intel panel ──────────────────────────────── */
body.cheatsheet-theme .company-intel-panel,
body.cheatsheet-theme .company-prompt,
body.cheatsheet-theme .company-profile-card,
body.cheatsheet-theme .company-no-results {
  background: var(--cs-card) !important;
  border: 1px solid var(--cs-border) !important;
  color: var(--cs-muted) !important;
  border-radius: 10px;
  box-shadow: var(--cs-shadow);
}
body.cheatsheet-theme .company-prompt h3,
body.cheatsheet-theme .company-section-header h3 {
  font-family: 'Poppins', system-ui, sans-serif !important;
  color: var(--cs-text-hi) !important;
}
body.cheatsheet-theme .company-section-note {
  font-family: 'JetBrains Mono', monospace;
  font-size: .7rem !important;
  color: var(--cs-dim) !important;
}
body.cheatsheet-theme #companyContractList > *,
body.cheatsheet-theme #companyIncumbents > * {
  background: var(--cs-bg) !important;
  border: 1px solid var(--cs-border) !important;
  color: var(--cs-text) !important;
}

/* ── Footer — always dark to match navbar ─────────────── */
body.cheatsheet-theme .footer {
  background: var(--cs-nav-bg) !important;
  border-top: 1px solid var(--cs-nav-border) !important;
  color: var(--cs-nav-muted);
}
body.cheatsheet-theme .footer h5 {
  color: var(--cs-gold-lt) !important;
  font-family: 'Poppins', system-ui, sans-serif;
  font-size: .72rem !important;
  letter-spacing: .15em;
  text-transform: uppercase;
}
body.cheatsheet-theme .footer a,
body.cheatsheet-theme .footer p {
  color: var(--cs-nav-muted) !important;
}
body.cheatsheet-theme .footer a:hover {
  color: var(--cs-gold-lt) !important;
}
body.cheatsheet-theme .footer .nav-logo {
  color: var(--cs-nav-text) !important;
}
body.cheatsheet-theme .footer .nav-logo span {
  color: #2563EB !important;
}

/* ── Chat widget toggle ──────────────────────────────── */
body.cheatsheet-theme .chat-widget-toggle {
  background: var(--cs-gold) !important;
  color: var(--cs-bg-deep) !important;
}
body.cheatsheet-theme .chat-widget-toggle:hover {
  background: var(--cs-gold-lt) !important;
}

/* ═══════════════════════════════════════════════════════════
   DARK-MODE SAFETY NET
   ---------------------------------------------------------------
   Catches inline / page-specific styles that hardcode dark text
   colors on any tool page, so dark mode renders correctly without
   touching every per-page stylesheet. Scoped to body.cheatsheet-theme.
═══════════════════════════════════════════════════════════ */

/* All headings in main content default to light text in dark mode */
html[data-theme="dark"] body.cheatsheet-theme h1,
html[data-theme="dark"] body.cheatsheet-theme h2,
html[data-theme="dark"] body.cheatsheet-theme h3,
html[data-theme="dark"] body.cheatsheet-theme h4,
html[data-theme="dark"] body.cheatsheet-theme h5,
html[data-theme="dark"] body.cheatsheet-theme h6 {
  color: #e6edf3 !important;
}
/* Preserve accent / em color inside hero headings */
html[data-theme="dark"] body.cheatsheet-theme h1 em,
html[data-theme="dark"] body.cheatsheet-theme h2 em {
  color: #60a5fa !important;
}

/* Body paragraphs and labels — but NOT inside buttons, badges,
   pill components, or the chat widget where colors are intentional */
html[data-theme="dark"] body.cheatsheet-theme p:not(.btn p):not(.badge p),
html[data-theme="dark"] body.cheatsheet-theme li,
html[data-theme="dark"] body.cheatsheet-theme label {
  color: #c9d1d9;
}

/* Hero h1/p/em/labels are handled in BOTH modes earlier in this
   file (search "Page-specific hero classes") so the rules apply
   in light mode too — not just dark. */

/* ═══════════════════════════════════════════════════════════
   Generic overrides — catch elements on tool pages that
   don't have opp-specific classes. These target common
   primitives so each tool page gets the theme for free.
═══════════════════════════════════════════════════════════ */

/* Typography — base
   No !important on color so page-specific hero sections (that set
   light text on dark backgrounds) still win. */
body.cheatsheet-theme h1,
body.cheatsheet-theme h2,
body.cheatsheet-theme h3 {
  font-family: 'Poppins', system-ui, sans-serif;
  color: var(--cs-text-hi);
}
body.cheatsheet-theme h4,
body.cheatsheet-theme h5,
body.cheatsheet-theme h6 {
  font-family: 'Poppins', system-ui, sans-serif;
  color: var(--cs-text-hi);
}
body.cheatsheet-theme p,
body.cheatsheet-theme li,
body.cheatsheet-theme label,
body.cheatsheet-theme span {
  color: inherit;
}

/* Page hero pattern — any .page-hero or .section-header takes
   the dark gradient hero look like opportunities */
body.cheatsheet-theme .page-hero,
body.cheatsheet-theme section.hero {
  background: linear-gradient(180deg, var(--cs-nav-bg) 0%, var(--cs-bg) 100%) !important;
  color: var(--cs-nav-text);
  padding: calc(var(--nav-height) + 3rem) 0 3rem !important;
  border-bottom: 1px solid var(--cs-border);
}
body.cheatsheet-theme .page-hero h1,
body.cheatsheet-theme section.hero h1 {
  color: var(--cs-nav-text) !important;
  text-align: center;
  max-width: 800px;
  margin: 0 auto .75rem !important;
}
body.cheatsheet-theme .page-hero p,
body.cheatsheet-theme section.hero p {
  color: var(--cs-nav-muted) !important;
  text-align: center;
  max-width: 600px;
  margin: 0 auto !important;
}
body.cheatsheet-theme .page-hero .section-label,
body.cheatsheet-theme section.hero .section-label {
  color: var(--cs-gold-lt) !important;
  font-family: 'Poppins', system-ui, sans-serif;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  display: inline-block;
  margin-bottom: .75rem;
}

/* Page-specific hero classes (.lib-hero, .agent-hero, .pipe-hero,
   .cap-hero, .td-hero, .inv-hero, .rc-hero) — these all use a dark
   navy gradient background, so their h1 / p / em / labels need to
   be light in BOTH light and dark mode. Without this override, the
   generic body.cheatsheet-theme h1 rule (specificity 0,1,2) wins
   over the page-specific .lib-hero-text h1 (0,1,1) and applies a
   dark text color in light mode → invisible white-on-dark hero. */
body.cheatsheet-theme .lib-hero h1,
body.cheatsheet-theme .lib-hero-text h1,
body.cheatsheet-theme .agent-hero h1,
body.cheatsheet-theme .pipe-hero h1,
body.cheatsheet-theme .cap-hero h1,
body.cheatsheet-theme .td-hero h1,
body.cheatsheet-theme .inv-hero h1,
body.cheatsheet-theme .rc-hero h1 {
  color: #ffffff !important;
}
body.cheatsheet-theme .lib-hero h1 em,
body.cheatsheet-theme .lib-hero-text h1 em,
body.cheatsheet-theme .agent-hero h1 em,
body.cheatsheet-theme .pipe-hero h1 em,
body.cheatsheet-theme .cap-hero h1 em,
body.cheatsheet-theme .td-hero h1 em,
body.cheatsheet-theme .inv-hero h1 em,
body.cheatsheet-theme .rc-hero h1 em {
  color: #60a5fa !important;
}
body.cheatsheet-theme .lib-hero p,
body.cheatsheet-theme .lib-hero-text p,
body.cheatsheet-theme .agent-hero p,
body.cheatsheet-theme .pipe-hero p,
body.cheatsheet-theme .cap-hero p,
body.cheatsheet-theme .td-hero p,
body.cheatsheet-theme .inv-hero p,
body.cheatsheet-theme .rc-hero p {
  color: rgba(255, 255, 255, .72) !important;
}
body.cheatsheet-theme .lib-hero .section-label,
body.cheatsheet-theme .lib-hero-text .section-label,
body.cheatsheet-theme .agent-hero .section-label,
body.cheatsheet-theme .pipe-hero .section-label,
body.cheatsheet-theme .cap-hero .section-label,
body.cheatsheet-theme .td-hero .section-label,
body.cheatsheet-theme .inv-hero .section-label,
body.cheatsheet-theme .rc-hero .section-label,
body.cheatsheet-theme .rc-hero-eyebrow {
  color: #60a5fa !important;
}

/* Library tier banner inside the hero */
body.cheatsheet-theme .lib-tier-item strong {
  color: #ffffff !important;
}
body.cheatsheet-theme .lib-tier-item span {
  color: rgba(255, 255, 255, .65) !important;
}
body.cheatsheet-theme .lib-tier-pro strong {
  color: #60a5fa !important;
}

/* Back button — reusable, placed anywhere in a dark hero */
body.cheatsheet-theme .cs-back-btn {
  position: absolute;
  top: calc(var(--nav-height) + 1.25rem);
  left: 1.5rem;
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .5rem .9rem;
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .15);
  border-radius: 8px;
  color: var(--cs-nav-muted);
  font-family: 'Poppins', system-ui, sans-serif;
  font-size: .78rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: all .2s ease;
  z-index: 5;
}
body.cheatsheet-theme .cs-back-btn:hover {
  background: rgba(255, 255, 255, .12);
  border-color: var(--cs-gold-lt);
  color: var(--cs-gold-lt) !important;
  transform: translateX(-2px);
}
@media (max-width: 640px) {
  body.cheatsheet-theme .cs-back-btn {
    top: calc(var(--nav-height) + .75rem);
    left: 1rem;
    padding: .4rem .7rem;
    font-size: .72rem;
  }
}

/* Generic sections */
body.cheatsheet-theme .section,
body.cheatsheet-theme main {
  background: var(--cs-bg) !important;
  color: var(--cs-text) !important;
}
body.cheatsheet-theme .section.bg-white,
body.cheatsheet-theme .section.bg-surface {
  background: var(--cs-bg) !important;
}

/* Generic card */
body.cheatsheet-theme .card,
body.cheatsheet-theme .feature-card,
body.cheatsheet-theme .feature-card-v2,
body.cheatsheet-theme .pricing-card,
body.cheatsheet-theme .library-item,
body.cheatsheet-theme .library-card,
body.cheatsheet-theme .teaming-card,
body.cheatsheet-theme .agent-section,
body.cheatsheet-theme .invoice-card {
  background: var(--cs-card) !important;
  border: 1px solid var(--cs-border) !important;
  color: var(--cs-text) !important;
  box-shadow: var(--cs-shadow);
}
body.cheatsheet-theme .card:hover,
body.cheatsheet-theme .feature-card:hover,
body.cheatsheet-theme .library-item:hover,
body.cheatsheet-theme .library-card:hover,
body.cheatsheet-theme .teaming-card:hover {
  border-color: var(--cs-border-hi) !important;
}

/* Inputs — style="width" forms */
body.cheatsheet-theme input[type="text"],
body.cheatsheet-theme input[type="email"],
body.cheatsheet-theme input[type="number"],
body.cheatsheet-theme input[type="search"],
body.cheatsheet-theme input[type="url"],
body.cheatsheet-theme input[type="tel"],
body.cheatsheet-theme input[type="password"],
body.cheatsheet-theme input[type="date"],
body.cheatsheet-theme select,
body.cheatsheet-theme textarea {
  background: var(--cs-card) !important;
  border: 1px solid var(--cs-border) !important;
  color: var(--cs-text) !important;
  font-family: 'Poppins', system-ui, sans-serif;
}
body.cheatsheet-theme input:focus,
body.cheatsheet-theme select:focus,
body.cheatsheet-theme textarea:focus {
  border-color: var(--cs-gold) !important;
  box-shadow: 0 0 0 3px var(--cs-gold-bg) !important;
  outline: none;
}
body.cheatsheet-theme input::placeholder,
body.cheatsheet-theme textarea::placeholder {
  color: var(--cs-dim) !important;
}

/* Generic tables */
body.cheatsheet-theme table:not(.opp-table) {
  background: var(--cs-card) !important;
  border: 1px solid var(--cs-border) !important;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: var(--cs-shadow);
}
body.cheatsheet-theme table:not(.opp-table) thead {
  background: var(--cs-card-hi) !important;
}
body.cheatsheet-theme table:not(.opp-table) th {
  color: var(--cs-gold) !important;
  font-family: 'Poppins', system-ui, sans-serif !important;
  font-weight: 700 !important;
  font-size: .72rem !important;
  letter-spacing: .12em !important;
  text-transform: uppercase;
  padding: .85rem 1rem !important;
  border-bottom: 1px solid var(--cs-border) !important;
  text-align: left;
}
body.cheatsheet-theme table:not(.opp-table) td {
  color: var(--cs-text) !important;
  padding: .8rem 1rem !important;
  border-bottom: 1px solid var(--cs-border) !important;
  font-size: .88rem;
}
body.cheatsheet-theme table:not(.opp-table) tbody tr:hover {
  background: var(--cs-card-hi) !important;
}

/* Generic buttons */
body.cheatsheet-theme .btn--primary:not(.navbar .btn--primary) {
  background: var(--cs-gold) !important;
  color: #ffffff !important;
  border: none !important;
}
body.cheatsheet-theme .btn--primary:not(.navbar .btn--primary):hover {
  background: var(--cs-gold-lt) !important;
}
body.cheatsheet-theme .btn--outline,
body.cheatsheet-theme .btn--outline-dark {
  background: transparent !important;
  border: 1px solid var(--cs-gold) !important;
  color: var(--cs-gold) !important;
}
body.cheatsheet-theme .btn--outline:hover,
body.cheatsheet-theme .btn--outline-dark:hover {
  background: var(--cs-gold-bg) !important;
  color: var(--cs-gold-lt) !important;
}
body.cheatsheet-theme .btn--secondary {
  background: var(--cs-card) !important;
  border: 1px solid var(--cs-border) !important;
  color: var(--cs-text) !important;
}
body.cheatsheet-theme .btn--secondary:hover {
  border-color: var(--cs-gold) !important;
  color: var(--cs-gold) !important;
}

/* Divider */
body.cheatsheet-theme hr,
body.cheatsheet-theme .divider-gold {
  border-color: var(--cs-border) !important;
  background: var(--cs-border);
}

/* Links in content (exclude tools-nav-item, tool-card, etc. which
   have their own dedicated label colors) */
body.cheatsheet-theme a:not(.btn):not(.nav-logo):not(.nav-links a):not(.footer a):not(.tools-nav-item):not(.tool-card):not(.tools-nav-back) {
  color: var(--cs-gold) !important;
}
body.cheatsheet-theme a:not(.btn):not(.nav-logo):not(.nav-links a):not(.footer a):not(.tools-nav-item):not(.tool-card):not(.tools-nav-back):hover {
  color: var(--cs-gold-lt) !important;
}

/* Section labels / eyebrows */
body.cheatsheet-theme .section-label,
body.cheatsheet-theme .eyebrow {
  color: var(--cs-gold) !important;
  font-family: 'Poppins', system-ui, sans-serif;
}

/* Tabs / filter tabs */
body.cheatsheet-theme .cat-tab,
body.cheatsheet-theme .filter-tab {
  background: var(--cs-card) !important;
  border: 1px solid var(--cs-border) !important;
  color: var(--cs-muted) !important;
  font-family: 'Poppins', system-ui, sans-serif;
}
body.cheatsheet-theme .cat-tab:hover,
body.cheatsheet-theme .filter-tab:hover {
  color: var(--cs-gold) !important;
  border-color: var(--cs-border-hi) !important;
}
body.cheatsheet-theme .cat-tab.active,
body.cheatsheet-theme .filter-tab.active {
  background: var(--cs-gold-bg) !important;
  border-color: var(--cs-gold) !important;
  color: var(--cs-gold) !important;
}

/* Modal dialogs */
body.cheatsheet-theme .pro-modal,
body.cheatsheet-theme .modal,
body.cheatsheet-theme .dialog {
  background: var(--cs-card) !important;
  color: var(--cs-text) !important;
  border: 1px solid var(--cs-border) !important;
}
body.cheatsheet-theme .pro-modal-title,
body.cheatsheet-theme .modal-title {
  color: var(--cs-text-hi) !important;
  font-family: 'Poppins', system-ui, sans-serif !important;
}
body.cheatsheet-theme .pro-modal-body,
body.cheatsheet-theme .modal-body {
  color: var(--cs-muted) !important;
}