.page-card,
.app-card,
.info-card,
.status-card,
.station-panel,
.metric,
.past-log-details,
.upload-card {
  background: var(--surface);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: none;
}

.page-card,
.app-card,
.info-card,
.status-card,
.upload-card {
  padding: 22px;
}

button,
.btn,
.primary-btn,
.secondary-btn,
.theme-btn,
.nav-btn,
.logout-btn,
.station-actions a,
.ops-actions a {
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 14px;
  font-weight: 700;
  border: 1px solid var(--border-strong);
  background: var(--surface);
  color: var(--text);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  text-decoration: none;
}

button:hover,
.btn:hover,
.secondary-btn:hover,
.theme-btn:hover,
.nav-btn:hover,
.logout-btn:hover,
.station-actions a:hover,
.ops-actions a:hover {
  background: var(--surface-hover);
  text-decoration: none;
}

.primary-btn,
button.primary-btn,
a.primary-btn,
.primary-action {
  background: var(--primary) !important;
  color: #fff !important;
  border-color: var(--primary) !important;
}

.primary-btn:hover,
.primary-action:hover {
  background: var(--primary-hover) !important;
}

.danger-btn {
  background: var(--danger-bg);
  color: var(--danger-text);
  border-color: transparent;
}

.pill,
.status-pill,
.status-big {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 12px;
  font-weight: 800;
  border: 1px solid transparent;
  background: var(--surface-muted);
  color: var(--text-soft);
}

.status-ready,
.status-pill.ready {
  background: var(--info-bg);
  color: var(--info-text);
}

.status-review,
.status-pill.review,
.pill-warn {
  background: var(--warning-bg);
  color: var(--warning-text);
}

.status-final,
.status-pill.final,
.pill-success {
  background: var(--success-bg);
  color: var(--success-text);
}

.status-error,
.status-pill.error {
  background: var(--danger-bg);
  color: var(--danger-text);
}

.alert {
  border-radius: var(--radius);
  padding: 12px 14px;
  border: 1px solid var(--border);
  background: var(--surface-muted);
}

.alert-success {
  background: var(--success-bg);
  color: var(--success-text);
}

.alert-warning {
  background: var(--warning-bg);
  color: var(--warning-text);
}

.alert-error {
  background: var(--danger-bg);
  color: var(--danger-text);
}

/* Better disabled/low-contrast controls */
button:disabled,
.btn:disabled,
.primary-btn:disabled,
.secondary-btn:disabled,
a.disabled,
[aria-disabled="true"],
.disabled {
  opacity: 0.62 !important;
  color: var(--muted) !important;
  background: var(--surface-muted) !important;
  border-color: var(--border-strong) !important;
  cursor: not-allowed !important;
  pointer-events: none;
}

html[data-theme="dark"] button:disabled,
html[data-theme="dark"] .btn:disabled,
html[data-theme="dark"] .primary-btn:disabled,
html[data-theme="dark"] .secondary-btn:disabled,
html[data-theme="dark"] a.disabled,
html[data-theme="dark"] [aria-disabled="true"],
html[data-theme="dark"] .disabled {
  color: #94a3b8 !important;
  background: #1e293b !important;
  border-color: #475569 !important;
  opacity: 1 !important;
}

/* Pill contrast fix */
html[data-theme="dark"] .status-ready,
html[data-theme="dark"] .status-pill.ready,
html[data-theme="dark"] .status-big.status-ready {
  background: #bae6fd !important;
  color: #083344 !important;
  border-color: #7dd3fc !important;
}

html[data-theme="dark"] .status-review,
html[data-theme="dark"] .status-pill.review,
html[data-theme="dark"] .status-big.status-review {
  background: #fde68a !important;
  color: #451a03 !important;
  border-color: #facc15 !important;
}

html[data-theme="dark"] .status-final,
html[data-theme="dark"] .status-pill.final,
html[data-theme="dark"] .status-big.status-final {
  background: #bbf7d0 !important;
  color: #052e16 !important;
  border-color: #86efac !important;
}

html[data-theme="dark"] .status-error,
html[data-theme="dark"] .status-pill.error,
html[data-theme="dark"] .status-big.status-error {
  background: #fecaca !important;
  color: #450a0a !important;
  border-color: #fca5a5 !important;
}

/* Final dark-mode contrast fixes */
html[data-theme="dark"] .status-big,
html[data-theme="dark"] .status-pill,
html[data-theme="dark"] .pill {
  color: #06283a !important;
  font-weight: 900 !important;
}

html[data-theme="dark"] .status-ready,
html[data-theme="dark"] .status-big.status-ready,
html[data-theme="dark"] .status-pill.ready {
  background: #bae6fd !important;
  color: #06283a !important;
  border-color: #7dd3fc !important;
}

html[data-theme="dark"] .secondary-btn,
html[data-theme="dark"] .station-actions a,
html[data-theme="dark"] .ops-actions a {
  color: #e5edf7 !important;
  border-color: #64748b !important;
}

html[data-theme="dark"] .secondary-btn:hover,
html[data-theme="dark"] .station-actions a:hover,
html[data-theme="dark"] .ops-actions a:hover {
  color: #ffffff !important;
  border-color: #93c5fd !important;
  background: #1e293b !important;
}

/* Make disabled buttons readable instead of nearly black */
html[data-theme="dark"] .secondary-btn.disabled,
html[data-theme="dark"] .station-actions a.disabled,
html[data-theme="dark"] a[aria-disabled="true"],
html[data-theme="dark"] button:disabled {
  color: #94a3b8 !important;
  background: transparent !important;
  border-color: #475569 !important;
  opacity: .85 !important;
}

/* Report/Traffic/Compliance pill contrast fixes */
html[data-theme="dark"] .pill,
html[data-theme="dark"] .status-pill,
html[data-theme="dark"] .badge,
html[data-theme="dark"] .summary-pill,
html[data-theme="dark"] .digest-pill,
html[data-theme="dark"] [class*="pill"] {
  color: #06283a !important;
  font-weight: 900 !important;
  opacity: 1 !important;
}

html[data-theme="dark"] .pill-success,
html[data-theme="dark"] .badge-success,
html[data-theme="dark"] [class*="success"] {
  background: #bbf7d0 !important;
  color: #052e16 !important;
  border-color: #86efac !important;
}

html[data-theme="dark"] .pill-warn,
html[data-theme="dark"] .badge-warn,
html[data-theme="dark"] .badge-warning,
html[data-theme="dark"] [class*="warn"] {
  background: #fde68a !important;
  color: #451a03 !important;
  border-color: #facc15 !important;
}

html[data-theme="dark"] .pill-danger,
html[data-theme="dark"] .badge-danger,
html[data-theme="dark"] .badge-error,
html[data-theme="dark"] [class*="danger"],
html[data-theme="dark"] [class*="error"] {
  background: #fecaca !important;
  color: #450a0a !important;
  border-color: #fca5a5 !important;
}

html[data-theme="dark"] .pill-info,
html[data-theme="dark"] .badge-info,
html[data-theme="dark"] [class*="info"] {
  background: #bae6fd !important;
  color: #06283a !important;
  border-color: #7dd3fc !important;
}

/* Default dark pill if no semantic class is present */
html[data-theme="dark"] .summary-pill,
html[data-theme="dark"] .digest-pill {
  background: #bae6fd !important;
  color: #06283a !important;
  border-color: #7dd3fc !important;
}

/* Dark mode: neutral/gray report pills need readable text */
html[data-theme="dark"] .pill:not(.pill-success):not(.pill-warn):not(.pill-danger):not(.pill-info),
html[data-theme="dark"] .status-pill:not(.ready):not(.review):not(.final):not(.error),
html[data-theme="dark"] .summary-pill:not(.pill-success):not(.pill-warn):not(.pill-danger):not(.pill-info),
html[data-theme="dark"] .digest-pill:not(.pill-success):not(.pill-warn):not(.pill-danger):not(.pill-info),
html[data-theme="dark"] .badge:not(.badge-success):not(.badge-warning):not(.badge-warn):not(.badge-danger):not(.badge-error):not(.badge-info) {
  background: #e5e7eb !important;
  color: #111827 !important;
  border-color: #cbd5e1 !important;
  opacity: 1 !important;
  font-weight: 900 !important;
}

/* Make sure text inside neutral pills also stays readable */
html[data-theme="dark"] .pill *,
html[data-theme="dark"] .summary-pill *,
html[data-theme="dark"] .digest-pill *,
html[data-theme="dark"] .badge * {
  color: inherit !important;
}