/* ============================================
   КАСТОМНАЯ ТЕМА ДЛЯ BOOTSTRAP 3.4.1
   Тёмный фон, белый текст, красные бордюры
   Подключать ПОСЛЕ bootstrap.min.css
   ============================================ */

/* ---------- 1. ГЛОБАЛЬНЫЕ ПЕРЕМЕННЫЕ ---------- */
:root {
  /* Основные цвета */
  --brand-primary: #cc0000;      /* вместо #337ab7 */
  --brand-success: #cc0000;      /* вместо #5cb85c */
  --brand-info: #cc0000;         /* вместо #5bc0de */
  --brand-warning: #cc0000;      /* вместо #f0ad4e */
  --brand-danger: #cc0000;       /* вместо #d9534f */

  /* Цвета текста и фона */
  --body-bg: #222222;            /* ваш цвет фона */
  --text-color: #ffffff;         /* белый текст */
  --link-color: #ff3333;         /* красные ссылки */
  --link-hover-color: #ff6666;   /* светлее при наведении */
  
  /* Бордюры */
  --border-color: #ff0000;       /* красные бордюры */
}

/* ---------- 2. БАЗОВЫЕ ЭЛЕМЕНТЫ ---------- */
body {
  background-color: var(--body-bg);
  color: var(--text-color);
}

a {
  color: var(--link-color);
}
a:hover,
a:focus {
  color: var(--link-hover-color);
}

/* ---------- 3. КНОПКИ ---------- */
.btn {
  border-color: var(--border-color) !important;
}
.btn-primary {
  background-color: var(--brand-primary);
  border-color: var(--border-color) !important;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background-color: #990000;
  border-color: var(--border-color) !important;
}

.btn-success {
  background-color: var(--brand-success);
  border-color: var(--border-color) !important;
}
.btn-success:hover {
  background-color: #990000;
  border-color: var(--border-color) !important;
}

.btn-info {
  background-color: var(--brand-info);
  border-color: var(--border-color) !important;
}
.btn-info:hover {
  background-color: #990000;
  border-color: var(--border-color) !important;
}

.btn-warning {
  background-color: var(--brand-warning);
  border-color: var(--border-color) !important;
}
.btn-warning:hover {
  background-color: #990000;
  border-color: var(--border-color) !important;
}

.btn-danger {
  background-color: var(--brand-danger);
  border-color: var(--border-color) !important;
}
.btn-danger:hover {
  background-color: #990000;
  border-color: var(--border-color) !important;
}

/* ---------- 4. ПОЛЯ ВВОДА ---------- */
.form-control {
  background-color: #333333;
  color: #ffffff;
  border-color: var(--border-color) !important;
}
.form-control:focus {
  border-color: var(--border-color) !important;
  box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(255, 0, 0, 0.4);
}
.form-control::placeholder {
  color: #888888;
}

/* ---------- 5. НАВИГАЦИЯ (NAVBAR) ---------- */
.navbar {
  border-color: var(--border-color) !important;
}
.navbar-default {
  background-color: #1a1a1a;
  border-color: var(--border-color) !important;
}
.navbar-default .navbar-brand {
  color: #ffffff;
}
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus {
  color: #ff3333;
}
.navbar-default .navbar-nav > li > a {
  color: #cccccc;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  color: #ffffff;
  background-color: #330000;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
  color: #ffffff;
  background-color: #440000;
}
.navbar-default .navbar-toggle {
  border-color: var(--border-color);
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
  background-color: #330000;
}
.navbar-default .navbar-toggle .icon-bar {
  background-color: #ff0000;
}

/* ---------- 6. ПАНЕЛИ ---------- */
.panel {
  background-color: #2a2a2a;
  border-color: var(--border-color) !important;
}
.panel-heading {
  color: #ccc !important;
  background-color: #1a1a1a !important;
  border-color: var(--border-color) !important;
  color: #ffffff;
}
.panel-body {
  background-color: #2a2a2a;
  color: #ffffff;
}
.panel-footer {
  background-color: #1a1a1a;
  border-color: var(--border-color) !important;
}

.panel-primary > .panel-heading {
  background-color: #440000 !important;
  border-color: var(--border-color) !important;
}
.panel-primary {
  border-color: var(--border-color) !important;
}

.panel-success > .panel-heading {
  background-color: #440000 !important;
  border-color: var(--border-color) !important;
}
.panel-success {
  border-color: var(--border-color) !important;
}

/* ---------- 7. АЛАРМЫ ---------- */
.alert {
  background-color: #2a2a2a;
  border-color: var(--border-color) !important;
  color: #ffffff;
}
.alert-success {
  background-color: #2a2a2a;
  border-color: var(--border-color) !important;
  color: #ffffff;
}
.alert-info {
  background-color: #2a2a2a;
  border-color: var(--border-color) !important;
  color: #ffffff;
}
.alert-warning {
  background-color: #2a2a2a;
  border-color: var(--border-color) !important;
  color: #ffffff;
}
.alert-danger {
  background-color: #2a2a2a;
  border-color: var(--border-color) !important;
  color: #ffffff;
}

/* ---------- 8. ТАБЛИЦЫ ---------- */
.table {
  background-color: #2a2a2a;
  color: #ffffff;
}
.table > thead > tr > th {
  background-color: #1a1a1a;
  color: #ffffff;
  border-color: var(--border-color) !important;
}
.table > tbody > tr > td,
.table > tbody > tr > th {
  border-color: var(--border-color) !important;
}
.table-striped > tbody > tr:nth-child(odd) > td,
.table-striped > tbody > tr:nth-child(odd) > th {
  background-color: #333333;
}
.table > tbody > tr:hover > td,
.table > tbody > tr:hover > th {
  background-color: #3a3a3a;
}

/* ---------- 9. WELL ---------- */
.well {
  background-color: #1a1a1a;
  border-color: var(--border-color) !important;
  color: #ffffff;
}

/* ---------- 10. ХЛЕБНЫЕ КРОШКИ ---------- */
.breadcrumb {
  background-color: #1a1a1a;
  border-color: var(--border-color) !important;
}
.breadcrumb > li + li::before {
  color: #888888;
}
.breadcrumb > .active {
  color: #ffffff;
}

/* ---------- 11. ПАГИНАЦИЯ ---------- */
.pagination > li > a,
.pagination > li > span {
  background-color: #2a2a2a;
  border-color: var(--border-color) !important;
  color: #cccccc;
}
.pagination > li > a:hover,
.pagination > li > span:hover {
  background-color: #440000;
  color: #ffffff;
}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover {
  background-color: #cc0000;
  border-color: var(--border-color) !important;
  color: #ffffff;
}
.pagination > .disabled > span,
.pagination > .disabled > span:hover {
  background-color: #1a1a1a;
  border-color: var(--border-color) !important;
  color: #666666;
}

/* ---------- 12. ПРОГРЕСС-БАРЫ ---------- */
.progress {
  background-color: #1a1a1a;
  border-color: var(--border-color) !important;
}
.progress-bar {
  background-color: #cc0000;
}
.progress-bar-success {
  background-color: #cc0000;
}
.progress-bar-info {
  background-color: #cc0000;
}
.progress-bar-warning {
  background-color: #cc0000;
}
.progress-bar-danger {
  background-color: #cc0000;
}

/* ---------- 13. БЕЙДЖИ ---------- */
.badge {
  background-color: #cc0000;
  color: #ffffff;
}

/* ---------- 14. МОДАЛЬНЫЕ ОКНА ---------- */
.modal-content {
  background-color: #2a2a2a;
  border-color: var(--border-color) !important;
}
.modal-header {
  border-color: var(--border-color) !important;
  color: #ffffff;
}
.modal-footer {
  border-color: var(--border-color) !important;
}
.modal-title {
  color: #ffffff;
}
.close {
  color: #ffffff;
  opacity: 0.8;
}
.close:hover {
  color: #ff3333;
  opacity: 1;
}

/* ---------- 15. ВЫПАДАЮЩИЕ СПИСКИ ---------- */
.dropdown-menu {
  background-color: #2a2a2a;
  border-color: var(--border-color) !important;
}
.dropdown-menu > li > a {
  color: #cccccc;
}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
  background-color: #440000;
  color: #ffffff;
}
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
  background-color: #cc0000;
  color: #ffffff;
}
.dropdown-menu > .divider {
  background-color: #440000;
}

/* ---------- 16. ТУЛТИПЫ ---------- */
.tooltip-inner {
  background-color: #1a1a1a;
  border: 1px solid var(--border-color);
  color: #ffffff;
}
.tooltip-arrow {
  border-color: var(--border-color) !important;
}

/* ---------- 17. JUMBOTRON ---------- */
.jumbotron {
  background-color: #1a1a1a;
  border: 1px solid var(--border-color);
  color: #ffffff;
}
.jumbotron h1,
.jumbotron .h1 {
  color: #ffffff;
}

/* ---------- 18. СПИСКИ ГРУПП ---------- */
.list-group-item {
  background-color: #2a2a2a;
  border-color: var(--border-color) !important;
  color: #ffffff;
}
.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
  background-color: #cc0000;
  border-color: var(--border-color);
  color: #ffffff;
}
a.list-group-item:hover,
a.list-group-item:focus {
  background-color: #3a3a3a;
  color: #ffffff;
}

/* ---------- 19. ТАБЫ ---------- */
.nav-tabs > li > a {
  background-color: #1a1a1a;
  border-color: var(--border-color) !important;
  color: #cccccc;
}
.nav-tabs > li > a:hover {
  background-color: #440000;
  color: #ffffff;
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
  background-color: #2a2a2a;
  border-color: var(--border-color) !important;
  border-bottom-color: #2a2a2a !important;
  color: #ffffff;
}
.nav-tabs > li.disabled > a {
  color: #666666;
}
.tab-content {
  background-color: #2a2a2a;
  border: 1px solid var(--border-color);
  border-top: none;
  padding: 15px;
  color: #ffffff;
}

/* ---------- 20. LABELS ---------- */
.label {
  background-color: #cc0000;
  color: #ffffff;
}
.label-success {
  background-color: #cc0000;
}
.label-info {
  background-color: #cc0000;
}
.label-warning {
  background-color: #cc0000;
}
.label-danger {
  background-color: #cc0000;
}

/* ---------- 21. THUMBNAILS ---------- */
.thumbnail {
  background-color: #2a2a2a;
  border-color: var(--border-color) !important;
  color: #ffffff;
}
.thumbnail .caption {
  color: #ffffff;
}

.img-thumbnail {
 background-color: #222;
}

/* ---------- 22. MISC ---------- */
hr {
  border-color: var(--border-color);
}
blockquote {
  border-color: var(--border-color);
}
pre {
  background-color: #1a1a1a;
  border-color: var(--border-color) !important;
  color: #ffffff;
}
code {
  background-color: #1a1a1a;
  border: 1px solid var(--border-color);
  color: #ff6666;
}
.text-muted {
  color: #888888;
}
.page-header {
  border-color: var(--border-color);
}
legend {
  border-color: var(--border-color);
  color: #ffffff;
}
.help-block {
  color: #888888;
}