/* Dark theme inspired by kline-trading-machine.html (the reference page):
   page #0b0b0b, card #131313, text #a3a3a3, strong #e6e6e6, muted #6e6e6e,
   accents red #ff6b6b / green #6be0a0 / blue #6b9bff, monospace for data. */
:root {
  --km-page: #0b0b0b;
  --km-card: #131313;
  --km-border: #232323;
  --km-text: #a3a3a3;
  --km-strong: #e6e6e6;
  --km-muted: #6e6e6e;
  --km-red: #ff6b6b;
  --km-green: #6be0a0;
  --km-blue: #6b9bff;
  --km-amber: #e0b36b;
}

body {
  background: var(--km-page);
  color: var(--km-text);
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}

h1, h2, .card-title, .stat-value {
  color: var(--km-strong);
}

.card {
  background: var(--km-card);
  border: 1px solid var(--km-border);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.02), 0 8px 24px rgba(0, 0, 0, 0.35);
}

.card-header {
  background: transparent;
  border-bottom: 1px solid var(--km-border);
  color: var(--km-strong);
}

.list-group-item {
  background: var(--km-card);
  color: var(--km-text);
  border-color: var(--km-border);
}

.table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--km-text);
  --bs-table-border-color: var(--km-border);
  --bs-table-hover-bg: rgba(255, 255, 255, 0.03);
}

.table thead th {
  color: var(--km-muted);
  font-weight: 600;
  white-space: nowrap;
}

.table td {
  vertical-align: middle;
}

.form-control {
  background: #0e0e0e;
  border-color: var(--km-border);
  color: var(--km-strong);
}

.form-control:focus {
  background: #0e0e0e;
  border-color: var(--km-blue);
  color: var(--km-strong);
  box-shadow: 0 0 0 0.25rem rgba(107, 155, 255, 0.15);
}

.btn-primary {
  background: var(--km-blue);
  border-color: var(--km-blue);
  color: #0b0b0b;
}

.btn-primary:hover {
  background: #8ab0ff;
  border-color: #8ab0ff;
  color: #0b0b0b;
}

.stat-label {
  color: var(--km-muted);
  font-size: 0.8rem;
}

.stat-value {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.2;
}

.badge-verified {
  background: rgba(107, 224, 160, 0.15);
  color: var(--km-green);
  border: 1px solid rgba(107, 224, 160, 0.35);
}

.badge-overdue {
  background: rgba(255, 107, 107, 0.15);
  color: var(--km-red);
  border: 1px solid rgba(255, 107, 107, 0.35);
}

.badge-nokey {
  background: rgba(224, 179, 107, 0.15);
  color: var(--km-amber);
  border: 1px solid rgba(224, 179, 107, 0.35);
}

.mono {
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}

.text-muted {
  color: var(--km-muted) !important;
}

.alert-warning {
  background: rgba(224, 179, 107, 0.12);
  border-color: rgba(224, 179, 107, 0.35);
  color: var(--km-amber);
}