body {
  background-color: #0A0F1F;
  color: #A0A6B8;
  font-family: 'Inter', sans-serif;
}

/* карточки и сайдбар */

.card, .sidebar-card, .modal-content {
  background-color: #1E2433;
  border: 1px solid #2A3142;
}

/* заголовки */

h1, h2, h3, h4, h5, h6 {
  color: #FFFFFF;
}

/* акцентный цвет для кнопок */

.btn-primary {
  background-color: #2EE6D0;
  border-color: #2EE6D0;
  color: #0A0F1F;
  font-weight: 600;
}

.btn-primary:hover {
  background-color: #26c4b0;
  border-color: #26c4b0;
}

/* текст в сайдбаре */

.sidebar .nav-link {
  color: #A0A6B8;
}

.sidebar .nav-link.active {
  color: #2EE6D0;
  background-color: rgba(46, 230, 208, 0.1);
}

/* обычный текст в карточках (не заголовки) */

.card, .card-body, .card-header, .card-footer {
  color: #FFFFFF;
}

/* текст в сайдбаре (не только ссылки) */

.sidebar .card-body, .sidebar .mt-auto {
  color: #FFFFFF;
}

.sidebar .mt-auto span, .sidebar .mt-auto a {
  color: #A0A6B8;
}

.sidebar .mt-auto a:hover {
  color: #2EE6D0;
}

/* таблицы и их содержимое */

.table {
  color: #FFFFFF;
}

.table td, .table th {
  color: #FFFFFF;
  border-color: #2A3142;
}

.table a {
  color: #2EE6D0;
  text-decoration: none;
}

.table a:hover {
  text-decoration: underline;
}

/* моноширинный код (серийные номера, версии) */

code {
  color: #2EE6D0;
  background-color: transparent;
}

/* плейсхолдеры в полях ввода (чтобы были видны) */

::placeholder {
  color: #6c757d !important;
  opacity: 1;
}

/* эмодзи-иконки (чтобы не меняли цвет) */

.nav-link span, .nav-link i, .table a {
  color: inherit;
}

/* на мобильных сайдбар сверху */

@media (max-width: 767.98px) {
  .sidebar .card {
    height: auto !important;
    min-height: auto;
    margin-bottom: 1rem;
  }
}

/* без фиксированной высоты vh-100 */

@media (max-width: 767.98px) {
  .sidebar .vh-100 {
    height: auto !important;
  }
}

/* контентные карточки */

@media (max-width: 767.98px) {
  .card {
    margin-bottom: 1rem;
  }
}

/* мини отступы */

@media (max-width: 767.98px) {
  .p-4 {
    padding: 1rem !important;
  }
}

/* горизонтальный скролл таблиц */

.table-responsive {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* для строк таблиц */

.table-hover tbody tr:hover {
  background-color: #2A3142 !important;
}

.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
  color: #FFFFFF !important;
}

.table-hover tbody tr:hover a {
  color: #2EE6D0 !important;
}

.clickable-row {
  cursor: pointer;
}

/* стилизация кнопки выхода */

.logout-btn {
  color: #A0A6B8 !important;
  text-decoration: none;
  background: none;
  border: none;
  padding: 0;
  font: inherit;
  cursor: pointer;
}

.logout-btn:hover {
  color: #2EE6D0 !important;
}

/* стили для таблицы параметров */

.table-borderless th {
  color: #FFFFFF;
  font-weight: normal;
  width: 40%;
}

.table-borderless td {
  color: #A0A6B8;
}

/* стили для курсора и кнопки выхода */

.clickable-row {
  cursor: pointer;
}

.logout-btn {
  background: none;
  border: none;
  color: #A0A6B8;
  cursor: pointer;
  padding: 0;
  font: inherit;
}

.logout-btn:hover {
  color: #2EE6D0;
  text-decoration: underline;
}

.table-borderless th {
  color: #FFFFFF;
  font-weight: normal;
  width: 40%;
}

.table-borderless td {
  color: #A0A6B8;
}

/* контейнер для flash-сообщений (фиксированное положение вверху по центру) */

.flash-container {
  position: fixed;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9999;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  width: auto;
  max-width: 90%;
  pointer-events: none;
}

/* базовый стиль сообщения */

.flash-message {
  pointer-events: auto;
  padding: 15px 20px;
  border-radius: 8px;
  background-color: #1E2433;
  border-left: 4px solid transparent;
  color: #FFFFFF;
  font-size: 14px;
  font-weight: 500;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-width: 250px;
  max-width: 400px;
  animation: slideIn 0.3s ease forwards;
}

/* кнопка закрытия */

.flash-close {
  background: none;
  border: none;
  color: #A0A6B8;
  font-size: 18px;
  cursor: pointer;
  padding: 0 5px;
  transition: color 0.2s;
}

.flash-close:hover {
  color: #FFFFFF;
}

/* типы сообщений (цвет левой границы и фона с оттенком) */

.flash-success {
  background-color: #1E3A2F;
  border-left-color: #28a745;
}

.flash-danger {
  background-color: #3A2A2A;
  border-left-color: #dc3545;
}

.flash-warning {
  background-color: #3A3420;
  border-left-color: #ffc107;
}

.flash-info {
  background-color: #1A3A4A;
  border-left-color: #17a2b8;
}

/* анимация появления */

@keyframes slideIn {
  from {
    opacity: 0;
    transform: translateY(-20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* анимация исчезновения (для удаления через JS) */

.flash-message.fade-out {
  animation: fadeOut 0.5s ease forwards;
}

@keyframes fadeOut {
  to {
    opacity: 0;
    transform: translateY(-20px);
    max-height: 0;
    padding: 0 20px;
    margin: 0;
  }
}

/* Темная тема для tooltips */

.tooltip {
  --bs-tooltip-bg: #1E2433;
  --bs-tooltip-color: #FFFFFF;
  --bs-tooltip-arrow-color: #1E2433;
}

/* Стили для поисковой строки */

.search-wrapper {
  margin-bottom: 1rem;
  display: flex;
  justify-content: flex-end;
}

.search-input {
  max-width: 300px;
  width: 100%;
  background-color: #1E2433;
  border-color: #2A3142;
  color: #FFFFFF;
}

.search-input:focus {
  background-color: #1E2433;
  border-color: #2EE6D0;
  color: #FFFFFF;
  box-shadow: 0 0 0 0.25rem rgba(46, 230, 208, 0.25);
}

.search-input::placeholder {
  color: #6c757d;
}

/* Всплывающая подсказка при недопустимом символе */

.invalid-tooltip-custom {
  position: absolute;
  background-color: #dc3545;
  color: #fff;
  font-size: 0.75rem;
  padding: 0.25rem 0.5rem;
  border-radius: 0.25rem;
  z-index: 1050;
  white-space: nowrap;
  margin-top: 0.2rem;
  display: inline-block;
  animation: fadeOut 2s ease forwards;
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  70% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    visibility: hidden;
  }
}

