:root {
  --app-surface-1: #1f2937;
  --app-surface-2: #0f172a;
  --app-border: #475569;
  --app-text: #e5e7eb;
  --app-muted: #cbd5e1;
  --app-input-bg: #111827;
  --app-input-focus: #0b1220;
  --app-focus: #60a5fa;
}

html,
body {
  height: 100%;
}

body.bg-body {
  background: linear-gradient(180deg, #0b1220 0%, #131a2b 100%);
  background-repeat: no-repeat;
  background-size: 100% 100vh;
  color: var(--app-text);
  min-height: 100vh;
}

.navbar {
  background-color: var(--app-surface-2) !important;
  border-bottom-color: #334155 !important;
}

.navbar .navbar-brand,
.navbar .nav-link,
.navbar .navbar-toggler {
  color: var(--app-text) !important;
}

.card {
  background-color: var(--app-surface-1);
  color: var(--app-text);
  border: 1px solid #334155;
}

.card .bg-secondary {
  background-color: var(--app-surface-2) !important;
  color: var(--app-text);
}

.text-secondary,
.small.text-secondary {
  color: var(--app-muted) !important;
}

.text-muted,
.small.text-muted {
  color: var(--app-muted) !important;
}

a,
a:visited {
  color: #72afff;
}

a:hover,
a:focus,
a:active {
  color: #c1d3eb;
}

.form-label {
  color: var(--app-muted);
  font-weight: 500;
}

.form-control,
.form-select,
.form-check-input,
textarea.form-control {
  background-color: var(--app-input-bg);
  border-color: var(--app-border);
  color: var(--app-text);
}

.form-control::placeholder,
textarea.form-control::placeholder {
  color: #94a3b8;
  opacity: 1;
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus,
textarea.form-control:focus {
  background-color: var(--app-input-focus);
  color: #f8fafc;
  border-color: var(--app-focus);
  box-shadow: 0 0 0 0.2rem rgba(96, 165, 250, 0.25);
}

.table {
  --bs-table-color: var(--app-text);
  --bs-table-bg: transparent;
  --bs-table-border-color: #334155;
  --bs-table-striped-color: var(--app-text);
  --bs-table-striped-bg: rgba(148, 163, 184, 0.08);
  --bs-table-hover-color: var(--app-text);
  --bs-table-hover-bg: rgba(148, 163, 184, 0.14);
}

.btn-outline-secondary {
  --bs-btn-color: var(--app-text);
  --bs-btn-border-color: var(--app-border);
  --bs-btn-hover-bg: #334155;
  --bs-btn-hover-border-color: #64748b;
  --bs-btn-hover-color: #f8fafc;
}
