/* =============================================================
   theme.css — Light mode overrides for CastingSpotlight
   Applied via html[data-theme="light"]
   Dark mode is the default (no selector needed).
   ============================================================= */

/* --- Smooth transition when switching --- */
html.theme-transitioning,
html.theme-transitioning *,
html.theme-transitioning *::before,
html.theme-transitioning *::after {
  transition:
    background-color 0.22s ease,
    border-color 0.22s ease,
    color 0.18s ease,
    box-shadow 0.22s ease !important;
}

/* =============================================================
   LIGHT MODE
   ============================================================= */
html[data-theme="light"] {
  /* ---- spotlight-ui.css vars ---- */
  --bg: #f0f4f8;
  --bg-alt: #e8ecf2;
  --bg-soft: #f5f7fa;
  --card: rgba(255, 255, 255, 0.96);
  --card-2: rgba(255, 255, 255, 0.88);

  --accent: #0284c7;
  --accent-strong: #0369a1;
  --accent-soft: rgba(2, 132, 199, 0.10);

  --text-main: #0f172a;
  --text-muted: #64748b;

  --border-soft: rgba(15, 23, 42, 0.10);
  --border-strong: rgba(15, 23, 42, 0.20);

  --danger: #dc2626;
  --warn: #d97706;
  --ok: #16a34a;

  --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.10);
  --shadow-md: 0 4px 20px rgba(0, 0, 0, 0.07);
  --ring: 0 0 0 3px rgba(2, 132, 199, 0.18);

  /* ---- app.css vars ---- */
  --panel: #ffffff;
  --border: rgba(0, 0, 0, 0.08);
  --text: #1e293b;
  --muted: #64748b;
  --brand: #2563eb;
  --card-border: #e2e8f0;

  /* ---- shell.css vars ---- */
  --panel-2: rgba(255, 255, 255, 0.94);
  --blue: #0284c7;
  --blue-2: #0369a1;

  /* ---- profile-edit.css vars ---- */
  --pe-accent: #0284c7;
  --pe-bg: #f0f4f8;
  --pe-surface: #f8fafc;
  --pe-card: #ffffff;
  --pe-border: rgba(15, 23, 42, 0.11);
  --pe-border-strong: rgba(15, 23, 42, 0.16);
  --pe-text: #1e293b;
  --pe-muted: #64748b;
  --pe-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

/* --- Page background --- */
html[data-theme="light"] body,
html[data-theme="light"] .ps-body {
  background: radial-gradient(circle at top, #dbeafe 0%, #f0f4f8 55%, #f8fafc 100%) !important;
  color: var(--text-main);
}

/* --- Cards --- */
html[data-theme="light"] .ps-card,
html[data-theme="light"] .listing-hero,
html[data-theme="light"] .listing-section {
  background:
    radial-gradient(circle at top, rgba(2, 132, 199, 0.05), transparent 55%),
    linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(240, 244, 248, 0.95)) !important;
  border-color: rgba(15, 23, 42, 0.09) !important;
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.06) !important;
}

html[data-theme="light"] .ps-card:hover {
  border-color: rgba(15, 23, 42, 0.16) !important;
}

/* --- Header --- */
html[data-theme="light"] .sh-header {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 250, 252, 0.80)) !important;
  border-bottom-color: rgba(15, 23, 42, 0.09) !important;
}

html[data-theme="light"] .sh-brand-mark {
  background: rgba(0, 0, 0, 0.05) !important;
  border-color: rgba(15, 23, 42, 0.10) !important;
}

html[data-theme="light"] .sh-pill {
  background: rgba(0, 0, 0, 0.04) !important;
  border-color: rgba(15, 23, 42, 0.10) !important;
  color: #64748b !important;
}

html[data-theme="light"] .sh-role-select {
  background: rgba(255, 255, 255, 0.85) !important;
  border-color: rgba(15, 23, 42, 0.12) !important;
  color: #1e293b !important;
}

html[data-theme="light"] .sh-btn {
  background: rgba(255, 255, 255, 0.7) !important;
  border-color: rgba(15, 23, 42, 0.12) !important;
  color: #1e293b !important;
}

html[data-theme="light"] .sh-btn:hover {
  background: rgba(255, 255, 255, 0.92) !important;
}

html[data-theme="light"] .sh-btn-primary {
  background: linear-gradient(180deg, #0284c7, #0369a1) !important;
  color: #fff !important;
}

html[data-theme="light"] .sh-avatar {
  background: rgba(2, 132, 199, 0.10) !important;
  border-color: rgba(2, 132, 199, 0.28) !important;
}

html[data-theme="light"] .sh-user:hover {
  background: rgba(0, 0, 0, 0.04) !important;
}

html[data-theme="light"] .sh-link { color: #475569; }
html[data-theme="light"] .sh-link:hover { color: #0f172a; }
html[data-theme="light"] .sh-link.brand { color: #0f172a; }
html[data-theme="light"] .sh-user-name { color: #0f172a; }

/* --- Footer --- */
html[data-theme="light"] .site-footer {
  background: rgba(240, 244, 248, 0.85) !important;
  border-top-color: rgba(15, 23, 42, 0.08) !important;
}

html[data-theme="light"] .footer-brand { color: #0f172a; }
html[data-theme="light"] .footer-copy { color: #64748b; }

html[data-theme="light"] .footer-link {
  color: #64748b;
}

html[data-theme="light"] .footer-link:hover {
  color: #0f172a !important;
  background: rgba(15, 23, 42, 0.06) !important;
  border-color: rgba(15, 23, 42, 0.12) !important;
}

/* --- Form inputs --- */
html[data-theme="light"] input[type="text"],
html[data-theme="light"] input[type="email"],
html[data-theme="light"] input[type="password"],
html[data-theme="light"] input[type="number"],
html[data-theme="light"] input[type="url"],
html[data-theme="light"] textarea,
html[data-theme="light"] select {
  background: #ffffff !important;
  border-color: rgba(15, 23, 42, 0.14) !important;
  color: #1e293b !important;
}

html[data-theme="light"] .ps-input,
html[data-theme="light"] .ps-select,
html[data-theme="light"] .ps-textarea {
  background: rgba(255, 255, 255, 0.92) !important;
  border-color: rgba(15, 23, 42, 0.14) !important;
  color: #1e293b !important;
}

html[data-theme="light"] .ps-input:focus,
html[data-theme="light"] .ps-select:focus,
html[data-theme="light"] .ps-textarea:focus {
  border-color: rgba(2, 132, 199, 0.5) !important;
  background: #ffffff !important;
}

/* --- Buttons --- */
html[data-theme="light"] .pe-btn {
  background: rgba(255, 255, 255, 0.80) !important;
  border-color: rgba(15, 23, 42, 0.16) !important;
  color: #1e293b !important;
}

html[data-theme="light"] .pe-btn:hover {
  background: rgba(255, 255, 255, 0.96) !important;
  border-color: rgba(15, 23, 42, 0.26) !important;
}

html[data-theme="light"] .btn-secondary {
  background: #e2e8f0 !important;
  color: #1e293b !important;
}

html[data-theme="light"] .btn-outline {
  border-color: rgba(15, 23, 42, 0.16) !important;
  color: #1e293b !important;
}

/* --- KPI boxes --- */
html[data-theme="light"] .ps-kpi {
  background: rgba(255, 255, 255, 0.88) !important;
  border-color: rgba(15, 23, 42, 0.09) !important;
}

/* --- Dividers & pills --- */
html[data-theme="light"] .ps-divider {
  background: rgba(15, 23, 42, 0.08) !important;
}

html[data-theme="light"] .ps-pill {
  border-color: rgba(15, 23, 42, 0.14);
  background: rgba(15, 23, 42, 0.05);
  color: #64748b;
}

html[data-theme="light"] .ps-pill-accent {
  border-color: rgba(2, 132, 199, 0.3);
  background: rgba(2, 132, 199, 0.08);
  color: #0369a1;
}

/* --- Modal (am-card) --- */
html[data-theme="light"] .am-card {
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(240, 244, 248, 0.97)) !important;
  border-color: rgba(2, 132, 199, 0.18) !important;
  color: #0f172a !important;
}

html[data-theme="light"] .am-card .modal-header,
html[data-theme="light"] .am-card .modal-footer {
  border-color: rgba(15, 23, 42, 0.08) !important;
}

/* --- Skills editor --- */
html[data-theme="light"] .skill-row {
  background: #f8fafc !important;
  border-color: #e2e8f0 !important;
}

html[data-theme="light"] .skill-row:has(.skill-check:checked) {
  border-color: #0284c7 !important;
  background: #eff6ff !important;
}

/* --- Profile edit page --- */
html[data-theme="light"] .pe-check-cell .pe-check-label {
  background: rgba(255, 255, 255, 0.8) !important;
  border-color: rgba(15, 23, 42, 0.12) !important;
  color: #1e293b !important;
}

html[data-theme="light"] .pe-subpanel {
  background: rgba(15, 23, 42, 0.03) !important;
  border-color: rgba(15, 23, 42, 0.08) !important;
}

/* --- Profile show page --- */
html[data-theme="light"] .ps-passport-badge {
  background: rgba(2, 132, 199, 0.07) !important;
  border-color: rgba(2, 132, 199, 0.18) !important;
  color: #0369a1 !important;
}

html[data-theme="light"] .ps-social-link {
  color: #2563eb !important;
}

/* --- Links --- */
html[data-theme="light"] a {
  text-decoration-color: rgba(2, 132, 199, 0.45);
}

html[data-theme="light"] a:hover {
  text-decoration-color: rgba(2, 132, 199, 0.85);
}

/* =============================================================
   PROFILE SHOW PAGE — light mode fixes
   ============================================================= */

html[data-theme="light"] {
  --ps-accent: #0284c7;
  --ps-bg: #f0f4f8;
  --ps-surface: #f8fafc;
  --ps-card: #ffffff;
  --ps-border: rgba(15, 23, 42, 0.09);
  --ps-text: #1e293b;
  --ps-muted: #64748b;
  --ps-shadow: 0 4px 20px rgba(0, 0, 0, 0.07);
}

html[data-theme="light"] body:has(#profileShow) {
  background:
    radial-gradient(1100px 520px at 18% -10%, rgba(2, 132, 199, 0.06), transparent 60%),
    radial-gradient(900px 520px at 110% 24%, rgba(2, 132, 199, 0.04), transparent 60%),
    radial-gradient(circle at top, #dbeafe 0%, #f0f4f8 55%, #f8fafc 100%) !important;
  color: var(--ps-text) !important;
}

/* Profile cards */
html[data-theme="light"] #profileShow .ps-card {
  background:
    linear-gradient(180deg, rgba(255,255,255,0.98), rgba(248,250,252,0.96)) !important;
  border-color: rgba(15, 23, 42, 0.09) !important;
  box-shadow: 0 2px 14px rgba(0,0,0,0.06) !important;
}

/* Card headings and text */
html[data-theme="light"] #profileShow .ps-card h3 { color: #0f172a !important; }
html[data-theme="light"] #profileShow .ps-card p  { color: #1e293b !important; }
html[data-theme="light"] #profileShow .ps-card strong { color: #0f172a !important; }

/* Size card items */
html[data-theme="light"] #psSizeCard .size-item {
  background: rgba(15, 23, 42, 0.03) !important;
  border-color: rgba(15, 23, 42, 0.08) !important;
}

html[data-theme="light"] #psSizeCard .size-item .k {
  color: #64748b !important;
}

html[data-theme="light"] #psSizeCard .size-item .v {
  color: #0f172a !important;
}

html[data-theme="light"] #psSizeCard .tattoo-thumb {
  border-color: rgba(15, 23, 42, 0.10) !important;
}

/* Headshot carousel nav buttons */
html[data-theme="light"] #profileShow .ps-headshots .hs-nav {
  background: rgba(15, 23, 42, 0.06) !important;
  border-color: rgba(15, 23, 42, 0.12) !important;
  color: #1e293b !important;
}

html[data-theme="light"] #profileShow .ps-headshots .hs-nav:hover {
  background: rgba(15, 23, 42, 0.10) !important;
}

/* Skill chips */
html[data-theme="light"] #profileShow .ps-chip {
  color: #1e293b !important;
  border-color: rgba(15, 23, 42, 0.14) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.9), rgba(240,244,248,0.9)),
    rgba(255,255,255,0.9) !important;
}

/* Subtitles / muted */
html[data-theme="light"] #profileShow .ps-subtitle,
html[data-theme="light"] #profileShow .muted,
html[data-theme="light"] #profileShow .pe-muted { color: #64748b !important; }

/* Resume preview mini */
html[data-theme="light"] #psResume .ps-resume-preview-dark {
  border-color: rgba(15, 23, 42, 0.12) !important;
  background: rgba(15, 23, 42, 0.04) !important;
}

html[data-theme="light"] #psResume .rp-sheet {
  color: #1e293b !important;
  background: #ffffff !important;
}

html[data-theme="light"] #psResume .rp-rule,
html[data-theme="light"] #psResume .rp-sec h4 {
  border-color: rgba(15, 23, 42, 0.14) !important;
}

html[data-theme="light"] #psResume .pe-actions[data-resume-style-root] .pe-label > span {
  color: #1e293b !important;
}

html[data-theme="light"] #psResume .pe-actions[data-resume-style-root] .pe-select {
  background: #ffffff !important;
  border-color: rgba(15, 23, 42, 0.14) !important;
  color: #1e293b !important;
}

/* =============================================================
   DASHBOARD — light mode fixes
   ============================================================= */

/* Tabs */
html[data-theme="light"] .db-tab {
  background: #ffffff !important;
  border-color: rgba(15, 23, 42, 0.12) !important;
  color: #1e293b !important;
}

html[data-theme="light"] .db-tab:hover {
  border-color: rgba(15, 23, 42, 0.22) !important;
}

html[data-theme="light"] .db-tab.active {
  outline-color: #0284c7 !important;
}

/* Cards */
html[data-theme="light"] .db-card {
  background: #ffffff !important;
  border-color: rgba(15, 23, 42, 0.10) !important;
}

html[data-theme="light"] .db-card-title { color: #0f172a !important; }

/* KPI labels */
html[data-theme="light"] .db-kpi-label { color: #64748b !important; }

/* Ghost button */
html[data-theme="light"] .db-ghost {
  color: #1e293b !important;
  border-color: rgba(15, 23, 42, 0.18) !important;
}

/* List items / text */
html[data-theme="light"] .db-list li { color: #1e293b !important; }
html[data-theme="light"] .db-list a  { color: #2563eb !important; }

/* Table */
html[data-theme="light"] .db-table th,
html[data-theme="light"] .db-table td {
  border-color: rgba(15, 23, 42, 0.08) !important;
  color: #1e293b !important;
}

html[data-theme="light"] .db-table thead th { color: #64748b !important; }
html[data-theme="light"] .db-table a { color: #2563eb !important; }

/* Panel overlays / drawers */
html[data-theme="light"] .db-panel,
html[data-theme="light"] #castAppsPanel {
  background: #ffffff !important;
  border-color: rgba(15, 23, 42, 0.10) !important;
}

/* Application detail overlay */
html[data-theme="light"] #castAppsDetailsOverlay > div,
html[data-theme="light"] [style*="background: #050b10"],
html[data-theme="light"] [style*="background:#050b10"] {
  background: #ffffff !important;
}

/* Analytics / coach panels */
html[data-theme="light"] #tab-analytics,
html[data-theme="light"] #tab-coaches {
  background: transparent !important;
}

/* Any remaining dark card-like elements in dashboard */
html[data-theme="light"] [class*="db-"] { color: #1e293b; }

/* text-muted Bootstrap class override */
html[data-theme="light"] .text-muted { color: #64748b !important; }
html[data-theme="light"] .small.text-muted { color: #64748b !important; }

/* =============================================================
   APP.CSS — hardcoded dark form/button overrides
   ============================================================= */

html[data-theme="light"] input,
html[data-theme="light"] textarea,
html[data-theme="light"] select {
  border-color: rgba(15, 23, 42, 0.14) !important;
  background: #ffffff !important;
  color: #1e293b !important;
}

html[data-theme="light"] .btn-secondary {
  background: #e2e8f0 !important;
  color: #1e293b !important;
}

html[data-theme="light"] .btn-outline {
  border-color: rgba(15, 23, 42, 0.2) !important;
  color: #1e293b !important;
}

/* =============================================================
   HOME / LANDING PAGE — light mode fixes
   ============================================================= */

html[data-theme="light"] body {
  color: #0f172a;
}

/* Header */
html[data-theme="light"] .site-header {
  background: linear-gradient(
    to bottom,
    rgba(240, 244, 248, 0.95),
    rgba(240, 244, 248, 0.80),
    transparent
  ) !important;
}

html[data-theme="light"] .brand { color: #0f172a !important; }
html[data-theme="light"] .brand-text-sub { color: #64748b !important; }

html[data-theme="light"] .nav-link { color: #475569 !important; }
html[data-theme="light"] .nav-link:hover {
  background: rgba(15, 23, 42, 0.07) !important;
  color: #0f172a !important;
}

/* Generic home .btn (not .pe-btn) */
html[data-theme="light"] .btn {
  background: rgba(255, 255, 255, 0.80) !important;
  border-color: rgba(15, 23, 42, 0.18) !important;
  color: #1e293b !important;
}

html[data-theme="light"] .btn:hover {
  background: rgba(255, 255, 255, 0.96) !important;
  border-color: rgba(15, 23, 42, 0.30) !important;
}

html[data-theme="light"] .btn.ghost {
  background: transparent !important;
  border-color: rgba(15, 23, 42, 0.20) !important;
  color: #1e293b !important;
}

/* Hero eyebrow pill */
html[data-theme="light"] .hero-copy-eyebrow {
  background: rgba(2, 132, 199, 0.08) !important;
  border-color: rgba(2, 132, 199, 0.30) !important;
  color: #0284c7 !important;
}

html[data-theme="light"] .hero-subtitle { color: #475569 !important; }
html[data-theme="light"] .hero-footnote { color: #64748b !important; }
html[data-theme="light"] .hero-footnote strong { color: #0f172a !important; }

/* AI / ethics banner */
html[data-theme="light"] .ai-banner {
  background:
    radial-gradient(circle at 0 0, rgba(16, 185, 129, 0.12), transparent 55%),
    rgba(240, 253, 244, 0.90) !important;
  border-color: rgba(15, 118, 110, 0.35) !important;
}

html[data-theme="light"] .ai-text { color: #065f46 !important; }

/* Section text */
html[data-theme="light"] .section-heading { color: #0f172a !important; }
html[data-theme="light"] .section-sub { color: #475569 !important; }

/* Feature cards */
html[data-theme="light"] .feature-card {
  background: rgba(255, 255, 255, 0.90) !important;
  border-color: rgba(15, 23, 42, 0.10) !important;
}

html[data-theme="light"] .feature-title { color: #0f172a !important; }
html[data-theme="light"] .feature-text { color: #475569 !important; }
html[data-theme="light"] .feature-list { color: #475569 !important; }

/* How it works cards */
html[data-theme="light"] .how-card {
  background: rgba(255, 255, 255, 0.85) !important;
  border-color: rgba(15, 23, 42, 0.12) !important;
}

html[data-theme="light"] .how-step { color: #64748b !important; }
html[data-theme="light"] .how-title { color: #0f172a !important; }
html[data-theme="light"] .how-text { color: #475569 !important; }

/* Upgrade card */
html[data-theme="light"] .upgrade-card {
  background:
    radial-gradient(circle at top left, rgba(251, 191, 36, 0.15), transparent 55%),
    rgba(255, 255, 255, 0.92) !important;
  border-color: rgba(251, 191, 36, 0.4) !important;
}

html[data-theme="light"] .upgrade-title { color: #0f172a !important; }
html[data-theme="light"] .upgrade-text { color: #475569 !important; }

/* CTA strip */
html[data-theme="light"] .cta-strip {
  background: linear-gradient(
    135deg,
    rgba(2, 132, 199, 0.12),
    rgba(224, 242, 254, 0.95)
  ) !important;
  border-color: rgba(2, 132, 199, 0.35) !important;
}

html[data-theme="light"] .cta-strip strong { color: #0f172a !important; }
html[data-theme="light"] .cta-strip { color: #1e293b !important; }

/* Pill mini */
html[data-theme="light"] .pill-mini {
  border-color: rgba(15, 23, 42, 0.20) !important;
  color: #475569 !important;
}

/* Footer */
html[data-theme="light"] footer {
  color: #64748b !important;
  border-top-color: rgba(15, 23, 42, 0.08) !important;
}

html[data-theme="light"] .footer-link { color: #64748b !important; }
html[data-theme="light"] .footer-link:hover { color: #0f172a !important; }

/* Pricing section */
html[data-theme="light"] .pricing-fineprint { color: #475569 !important; }
html[data-theme="light"] .section-miniheading { color: #0f172a !important; }

/* =============================================================
   LISTINGS INDEX PAGE — light mode fixes
   ============================================================= */

/* Search input */
html[data-theme="light"] .ls-search input[type="text"] {
  background: #ffffff !important;
  border-color: rgba(15, 23, 42, 0.18) !important;
  color: #1e293b !important;
}

html[data-theme="light"] .ls-search input[type="text"]::placeholder {
  color: #94a3b8 !important;
  opacity: 1 !important;
}

/* "Show only roles I match" toggle pill */
html[data-theme="light"] .match-toggle {
  background: rgba(255, 255, 255, 0.80) !important;
  border-color: rgba(15, 23, 42, 0.16) !important;
  color: #1e293b !important;
}

/* Listing cards */
html[data-theme="light"] .li-card {
  border-color: rgba(15, 23, 42, 0.11) !important;
}

html[data-theme="light"] .li-card:hover {
  border-color: rgba(15, 23, 42, 0.20) !important;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.08) !important;
}

/* Card meta row (date · type · location · union status) */
html[data-theme="light"] .li-meta {
  color: #475569 !important;
  opacity: 1 !important;
}

/* Dot separator between meta items */
html[data-theme="light"] .li-dot {
  background: rgba(15, 23, 42, 0.30) !important;
}

/* Card bottom divider */
html[data-theme="light"] .li-card-bottom {
  border-top-color: rgba(15, 23, 42, 0.08) !important;
}

/* Filter checkboxes in the expanded panel */
html[data-theme="light"] .li-checkbox {
  background: rgba(255, 255, 255, 0.70) !important;
  border-color: rgba(15, 23, 42, 0.12) !important;
  color: #1e293b !important;
}

html[data-theme="light"] .li-label { color: #475569 !important; }
html[data-theme="light"] .li-block h4 { color: #0f172a !important; }

/* Sort / Saved popovers */
html[data-theme="light"] .sort-popover,
html[data-theme="light"] .saved-popover {
  background: #ffffff !important;
  border-color: rgba(15, 23, 42, 0.12) !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12) !important;
}

html[data-theme="light"] .sort-item {
  color: #1e293b !important;
}

html[data-theme="light"] .sort-item:hover {
  background: rgba(15, 23, 42, 0.05) !important;
}

html[data-theme="light"] .sort-item.is-active {
  background: rgba(2, 132, 199, 0.08) !important;
  color: #0284c7 !important;
}

/* =============================================================
   HOME — Hero panel (intentionally dark "app preview" box)
   Keep interior text light so it's readable on the dark panel bg
   ============================================================= */

/* Panel wrapper: keep dark bg, just sharpen the glow slightly */
html[data-theme="light"] .hero-panel {
  background:
    radial-gradient(circle at top, rgba(56, 189, 248, 0.30), transparent 55%),
    linear-gradient(145deg, rgba(15, 23, 42, 0.97), #020617) !important;
  border-color: rgba(56, 189, 248, 0.45) !important;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.35) !important;
}

/* Panel header row ("Actor Dashboard" + "Live" pill) */
html[data-theme="light"] .hero-panel-header {
  color: rgba(245, 248, 255, 0.65) !important;
}

html[data-theme="light"] .hero-panel .pill-mini {
  color: rgba(245, 248, 255, 0.70) !important;
  border-color: rgba(148, 163, 184, 0.40) !important;
}

/* Individual metric cards inside the panel */
html[data-theme="light"] .hero-metric-card {
  background: rgba(15, 23, 42, 0.88) !important;
  border-color: rgba(31, 41, 55, 0.90) !important;
}

html[data-theme="light"] .hero-metric-label {
  color: rgba(245, 248, 255, 0.60) !important;
}

html[data-theme="light"] .hero-metric-value {
  color: #f9fafb !important;
}

html[data-theme="light"] .hero-metric-pill {
  background: rgba(56, 189, 248, 0.18) !important;
  color: #38bdf8 !important;
}

/* Tagline below the metric cards */
html[data-theme="light"] .mini-tagline {
  color: rgba(245, 248, 255, 0.55) !important;
}

/* =============================================================
   MESSAGES — light mode fixes
   ============================================================= */

/* Thread list: "X ago" timestamp on the far right */
html[data-theme="light"] .thread-meta {
  color: #64748b !important;
}

/* Thread list: hover state */
html[data-theme="light"] .thread-link:hover {
  background: rgba(15, 23, 42, 0.04) !important;
}

/* Thread list: item card */
html[data-theme="light"] .thread-item {
  background: rgba(255, 255, 255, 0.80) !important;
  border-color: rgba(15, 23, 42, 0.10) !important;
}

/* Message thread: date/time stamp inside chat bubbles */
html[data-theme="light"] .stamp {
  color: #64748b !important;
}