/* Page-specific overrides — loaded after theme.css */

/* Financial data tables (server-rendered HTML from views.py) */
.financial-data-table {
  width: 100%;
  font-family: var(--font-mono);
}

.financial-data-table table {
  width: 100%;
  border-collapse: collapse;
}

.financial-data-table th,
.financial-data-table td {
  text-align: right;
  padding: 0.375rem 0.5rem;
  font-family: var(--font-mono);
  font-size: 0.9375rem;
  border-bottom: 1px solid var(--border-color);
  color: var(--text-primary);
}

.financial-data-table th:first-child,
.financial-data-table td:first-child {
  text-align: left;
  font-weight: 600;
}

.financial-data-table tr:nth-child(even) {
  background-color: var(--bg-surface-2);
}

/* Color utility classes used in server-rendered table HTML */
.green-text { color: var(--success); }
.red-text { color: var(--danger); }
.violet-text { color: #7c3aed; }
[data-bs-theme="dark"] .violet-text { color: #a78bfa; }
.blue-text { color: var(--brand-primary); }

/* Report-specific: inline heading labels for claim reports */
.inline-heading h6 {
  display: inline;
  font-size: 0.875rem;
}

/* Report-specific: mktgsales data table */
.mktgsales-data-table {
  width: 100%;
  font-family: var(--font-mono);
}
.mktgsales-data-table table { width: 100%; border-collapse: collapse; }
.mktgsales-data-table th,
.mktgsales-data-table td {
  text-align: right;
  padding: 0.375rem 0.5rem;
  font-family: var(--font-mono);
  font-size: 0.9375rem;
  border-bottom: 1px solid var(--border-color);
  color: var(--text-primary);
}
.mktgsales-data-table th:first-child,
.mktgsales-data-table td:first-child { text-align: left; font-weight: 600; }
.mktgsales-data-table tr:nth-child(even) { background-color: var(--bg-surface-2); }

/* Report-specific: industry data table */
.industry-data-table {
  width: 100%;
  font-family: var(--font-mono);
}
.industry-data-table table { width: 100%; border-collapse: collapse; }
.industry-data-table th,
.industry-data-table td {
  text-align: right;
  padding: 0.375rem 0.5rem;
  font-family: var(--font-mono);
  font-size: 0.9375rem;
  border-bottom: 1px solid var(--border-color);
  color: var(--text-primary);
}
.industry-data-table th:first-child,
.industry-data-table td:first-child { text-align: left; font-weight: 600; }
.industry-data-table tr:nth-child(even) { background-color: var(--bg-surface-2); }

/* Coverage/metric toggle buttons */
.coverage-btn { min-width: 90px; }
.metric-btn { min-width: 75px; }

/* ----------------------------------------------------------------
 * Dark mode enhancements (issues #98, #101, #103)
 * ---------------------------------------------------------------- */

/* #98: ApexCharts legend text is rendered as SVG and doesn't inherit
   CSS custom properties — set it explicitly in dark mode. */
[data-bs-theme="dark"] .apexcharts-legend-text {
  color: var(--text-primary) !important;
}
/* Also ensure axis labels and title text use the light foreground */
[data-bs-theme="dark"] .apexcharts-xaxis-label,
[data-bs-theme="dark"] .apexcharts-yaxis-label,
[data-bs-theme="dark"] .apexcharts-title-text,
[data-bs-theme="dark"] .apexcharts-subtitle-text {
  fill: var(--text-primary) !important;
}

/* #519: Valuation stacked-bar total labels render as low-contrast SVG text in
   dark mode. Scope the override to the valuation chart so other chart label
   treatments keep their intended colors/backgrounds.
   apexcharts-datalabels (plural) is the group containing stacked-bar total
   labels; apexcharts-datalabel (singular) covers per-segment labels. */
[data-bs-theme="dark"] #valuationChart .apexcharts-datalabel,
[data-bs-theme="dark"] #valuationChart .apexcharts-datalabel-label,
[data-bs-theme="dark"] #valuationChart .apexcharts-datalabel-value,
[data-bs-theme="dark"] #valuationChart .apexcharts-datalabels text,
[data-bs-theme="dark"] #valuationChart .apexcharts-data-labels text {
  fill: var(--text-primary) !important;
}

/* #101: Stronger alternating-row contrast in dark mode.
   Light mode: surface (#fff) vs surface-2 (#f1f5f9) is clearly visible.
   Dark mode: surface (#0f1b2d) vs surface-2 (#13243b) is too subtle —
   use surface-3 (#1a2e4a) for even rows to increase contrast. */
[data-bs-theme="dark"] .financial-data-table tr:nth-child(even),
[data-bs-theme="dark"] .mktgsales-data-table tr:nth-child(even),
[data-bs-theme="dark"] .industry-data-table tr:nth-child(even) {
  background-color: var(--bg-surface-3);
}
/* Visually distinct header row in dark mode */
[data-bs-theme="dark"] .financial-data-table th,
[data-bs-theme="dark"] .mktgsales-data-table th,
[data-bs-theme="dark"] .industry-data-table th {
  background-color: var(--bg-surface-3);
  border-bottom: 2px solid var(--border-strong);
}

/* #103: "Review decisions." (chat-row--special) needs stronger emphasis
   in dark mode — add a subtle background highlight and left border. */
[data-bs-theme="dark"] .chat-row--special {
  background: rgba(255, 90, 106, 0.12);
  margin: 0.1rem 0;
  padding: 0.2rem 0.5rem;
  border-radius: 3px;
  border-left: 2px solid var(--chat-special);
}
