/* ---------- Основные цвета ---------- */
:root {
  --bg-dark: #121212;
  --bg-card: #1e1e1e;
  --bg-hover: #2a2a2a;
  --border-color: #2f2f2f;
  --text-light: #f1f1f1;
  --text-muted: #9a9a9a;
  --primary: #4e8cff;
  --primary-hover: #5e9cff;
  --success: #4caf50;
  --danger: #ff5252;
  --warning: #ffc107;
}

/* ---------- Общий стиль ---------- */
body {
  background-color: var(--bg-dark);
  color: var(--text-light);
  font-family: "Inter", "Segoe UI", Roboto, sans-serif;
  line-height: 1.6;
}

a { color: var(--primary); text-decoration: none; }
a:hover { color: var(--primary-hover); }

/* ---------- Навигация ---------- */
.navbar {
  background-color: var(--bg-card) !important;
  border-bottom: 1px solid var(--border-color);
}
.navbar-brand { font-weight: 600; color: var(--primary) !important; }
.nav-link { color: var(--text-muted) !important; transition: color 0.2s; }
.nav-link:hover, .nav-link.active { color: var(--primary-hover) !important; }

/* ---------- Контент и карточки ---------- */
.container { max-width: 1200px; }
.card {
  background-color: var(--bg-card);
  border: 1px solid var(--border-color);
  color: var(--text-light);
  border-radius: 10px;
  transition: background 0.2s, transform 0.2s;
}
.card:hover { background-color: var(--bg-hover); transform: translateY(-2px); }

/* ---------- Таблицы (починка Bootstrap переменных) ---------- */
.table {
  /* ВАЖНО: переопределяем переменные Bootstrap */
  --bs-table-color: #f2f2f2;
  --bs-table-bg: #1f1f1f;                 /* фон всей таблицы */
  --bs-table-border-color: #2f2f2f;
  --bs-table-striped-bg: #232323;         /* фон «зебры» */
  --bs-table-striped-color: #f2f2f2;
  --bs-table-hover-bg: rgba(78, 140, 255, 0.15); /* фон наведения */
  --bs-table-hover-color: #ffffff;
  --bs-table-active-bg: #2a2a2a;
  --bs-table-active-color: #ffffff;

  color: var(--bs-table-color);
  background-color: var(--bs-table-bg) !important;
  border-color: var(--bs-table-border-color) !important;

  font-size: 15.5px;
  line-height: 1.55;
  border-radius: 10px;
  overflow: hidden;
}

.table th, .table td {
  padding: 0.9rem 1rem;
  border-color: var(--bs-table-border-color) !important;
}

.table thead th {
  background: linear-gradient(90deg, #262626, #202020);
  color: #e6e6e6;
  font-weight: 600;
  font-size: 0.95rem;
  letter-spacing: 0.02em;
  border-bottom: 1px solid var(--border-color);
}

/* реальный "glow" при наведении */
.table-hover tbody tr {
  transition: background 0.2s ease, box-shadow 0.25s ease;
}
.table-hover tbody tr:hover {
  box-shadow: inset 0 0 10px rgba(78, 140, 255, 0.28);
}

/* Контейнер для скролла таблиц */
.table-responsive {
  background-color: #1c1c1c;
  border: 1px solid var(--border-color);
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.35);
  overflow: hidden;
}

/* Больше НЕ делаем прозрачным фон потомков .table — это ломало цвета
   (раньше здесь было: .table * { background-color: transparent !important; }) */

/* ---------- Кнопки ---------- */
.btn { border-radius: 8px; transition: all 0.15s ease; }
.btn-primary { background-color: var(--primary); border-color: var(--primary); }
.btn-primary:hover { background-color: var(--primary-hover); }
.btn-secondary { background-color: var(--bg-hover); border-color: var(--border-color); color: var(--text-light); }
.btn-secondary:hover { background-color: var(--border-color); }
.btn-outline-secondary { color: var(--text-muted); border-color: var(--border-color); }
.btn-outline-secondary:hover { color: var(--text-light); background-color: var(--border-color); }
.btn-danger { background-color: var(--danger); border-color: var(--danger); }
.btn-success { background-color: var(--success); border-color: var(--success); }

/* ---------- Формы ---------- */
.form-control, .form-select {
  background-color: var(--bg-card);
  border: 1px solid var(--border-color);
  color: var(--text-light);
  transition: background 0.2s, border 0.2s;
}
.form-control::placeholder { color: #8f8f8f; }
.form-control:focus, .form-select:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 0.2rem rgba(78, 140, 255, 0.25);
  background-color: var(--bg-card);
  color: var(--text-light);
}
.form-label { color: var(--text-muted); }

/* ---------- Модальные окна ---------- */
.modal-content {
  background-color: var(--bg-card);
  color: var(--text-light);
  border: 1px solid var(--border-color);
  border-radius: 10px;
}
.modal-header { border-bottom: 1px solid var(--border-color); }
.modal-footer { border-top: 1px solid var(--border-color); }

/* ---------- Прочее ---------- */
.badge { font-weight: 500; }
.text-muted { color: var(--text-muted) !important; }
hr { border-color: var(--border-color); }
.shadow-sm { box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3) !important; }