/* ОБЩИЕ СТИЛИ ДЛЯ ВСЕЙ СТРАНИЦЫ */
/* Задает базовые настройки: отступы, шрифт, фон и цвет текста */
body {
    margin: 0; /* Убирает внешние отступы */
    font-family: 'Segoe UI', sans-serif; /* Основной шрифт */
    background-color: #121212; /* Темный фон страницы */
    color: #eee; /* Светлый цвет текста */
}

/* ШАПКА САЙТА */
/* Стили для верхней шапки с заголовком */
.header {
    background-color: #1f1f1f; /* Цвет фона */
    padding: 5px 5px; /* Внутренние отступы */
    text-align: center; /* Выравнивание текста по центру */
    border-bottom: 2px solid #333; /* Граница снизу */
}

/* НАВИГАЦИОННАЯ ПАНЕЛЬ */
/* Контейнер для кнопок навигации */
.nav-bar {
    display: flex; /* Гибкий контейнер */
    background-color: #1e1e1e; /* Цвет фона */
    padding: 10px; /* Внутренние отступы */
    gap: 10px; /* Расстояние между кнопками */
    justify-content: center; /* Выравнивание по центру */
    border-bottom: 1px solid #333; /* Граница снизу */
}

/* БАЗОВЫЕ СТИЛИ КНОПОК НАВИГАЦИИ */
.nav-btn {
    background-color: #2c2c2c; /* Цвет фона */
    color: #ccc; /* Цвет текста */
    padding: 10px 16px; /* Внутренние отступы */
    border: none; /* Убирает границу */
    border-radius: 8px; /* Закругленные углы */
    cursor: pointer; /* Курсор-указатель */
    font-size: 14px; /* Размер шрифта */
    transition: background 0.3s, color 0.3s; /* Плавные переходы */
}

/* Стили при наведении на кнопку */
.nav-btn:hover {
    background-color: #3d3d3d; /* Изменение фона */
    color: white; /* Изменение цвета текста */
}

/* Стили для активной кнопки */
.nav-btn.active {
    background-color: #4e4e4e; /* Фон активной кнопки */
    color: #fff; /* Цвет текста */
    font-weight: bold; /* Жирный шрифт */
    border: 1px solid #666; /* Граница */
}

/* ОСОБЫЕ СТИЛИ ДЛЯ КНОПКИ ВЫХОДА */
.logout-btn {
    margin-left: auto; /* Автоматический отступ слева (прижимает вправо) */
    background-color: #8b0000; /* Красный фон */
    color: #fff; /* Белый текст */
}

/* Стиль кнопки выхода при наведении */
.logout-btn:hover {
    background-color: #a00000; /* Темнее красный */
}

/* ОСНОВНОЙ КОНТЕНТ */
/* Контейнер для основного содержимого страницы */
.content-box {
    padding: 1px; /* Внутренние отступы */
    padding-left: 10px;
    margin: 0 auto; /* Центрирование по горизонтали */
    background-color: #1a1a1a; /* Цвет фона */
    border-radius: 12px; /* Закругленные углы */
    box-shadow: 0 0 10px #000; /* Тень */
    margin-top: 4px; /* Отступ сверху */
    margin-left: 4px;
    margin-right: 4px;
    /*max-width: 1000px;  Максимальная ширина (раскомментируйте при необходимости) */
}

/* ТАБЛИЦА DCP */
/* Контейнер для таблицы с прокруткой */
.table-container {
    overflow-x: auto; /* Горизонтальная прокрутка при переполнении */
    margin-top: 5px; /* Отступ сверху */
    background-color: #1e1e1e; /* Фон */
    border-radius: 8px; /* Закругленные углы */
    padding: 5px; /* Внутренние отступы */
    box-shadow: 0 2px 8px rgba(0,0,0,0.4); /* Тень */
}

/* Основные стили таблицы */
#dcp-table {
    width: 100%; /* Ширина на весь контейнер */
    border-collapse: collapse; /* Схлопывание границ */
    transition: color 0.4s, background-color 0.4s;
}

/* Стили ячеек таблицы */
#dcp-table th, #dcp-table td {
    padding: 4px 4px; /* Внутренние отступы */
    text-align: left; /* Выравнивание текста */
    border-bottom: 1px solid #333; /* Граница снизу */
}

/* Стили заголовков таблицы */
#dcp-table th {
    background-color: #2a2a2a; /* Фон заголовков */
    color: #ddd; /* Цвет текста */
    font-weight: 600; /* Жирность шрифта */
}

/* Эффект при наведении на строку */
#dcp-table tbody tr:hover {
    background-color: #252525; /* Изменение фона */
}

/* Специальные стили для колонок */
.status-cell {
    text-align: center; /* Выравнивание по центру */
    font-size: 18px; /* Размер иконок */
}

.uuid-cell {
    font-family: monospace; /* Моноширинный шрифт */
    font-size: 18px; /* Меньший размер */
    /* max-width: 200px; Максимальная ширина */
    overflow: hidden; /* Скрытие переполнения */
    text-overflow: ellipsis; /* Многоточие при обрезке */
    justify-content: center;
    align-items: center;
}

.path-cell {
    max-width: 250px; /* Максимальная ширина */
    overflow: hidden; /* Скрытие переполнения */
    text-overflow: ellipsis; /* Многоточие при обрезке */
}

.error-cell {
    color: #ff6b6b; /* Красный цвет текста */
    max-width: 200px; /* Максимальная ширина */
    overflow: hidden; /* Скрытие переполнения */
    text-overflow: ellipsis; /* Многоточие при обрезке */
}

/* ФОРМА АВТОРИЗАЦИИ */
/* Контейнер для формы входа */
.login-container {
    display: flex; /* Гибкий контейнер */
    justify-content: center; /* Центрирование по горизонтали */
    align-items: center; /* Центрирование по вертикали */
    height: 100vh; /* Высота на весь экран */
    background-color: #121212; /* Фон */
}

/* Стили для формы */
.login-box {
    background-color: #1a1a1a; /* Фон формы */
    padding: 30px; /* Внутренние отступы */
    border-radius: 12px; /* Закругленные углы */
    box-shadow: 0 0 20px rgba(0,0,0,0.5); /* Тень */
    width: 350px; /* Фиксированная ширина */
}

/* Заголовок формы */
.login-box h2 {
    text-align: center; /* Выравнивание по центру */
    margin-bottom: 20px; /* Отступ снизу */
    margin-left: 15px;
    color: #eee; /* Цвет текста */
}

/* Группа полей ввода */
.input-group {
    margin-bottom: 15px; /* Отступ снизу */
}

/* Стили для меток */
.input-group label {
    display: block; /* Блочный элемент */
    margin-bottom: 5px; /* Отступ снизу */
    color: #bbb; /* Цвет текста */
}

/* Стили для полей ввода */
.input-group input {
    width: 100%; /* Ширина на весь контейнер */
    padding: 10px; /* Внутренние отступы */
    background-color: #2c2c2c; /* Фон */
    border: 1px solid #333; /* Граница */
    border-radius: 4px; /* Закругленные углы */
    color: #eee; /* Цвет текста */
}

/* Кнопка входа */
.login-box button {
    width: 100%; /* Ширина на весь контейнер */
    padding: 10px; /* Внутренние отступы */
    background-color: #4e4e4e; /* Фон */
    color: white; /* Цвет текста */
    border: none; /* Без границы */
    border-radius: 4px; /* Закругленные углы */
    cursor: pointer; /* Курсор-указатель */
    font-weight: bold; /* Жирный шрифт */
}

/* Эффект при наведении на кнопку */
.login-box button:hover {
    background-color: #5e5e5e; /* Изменение фона */
}

/* ФАЙЛОВЫЙ БРАУЗЕР */
/* Основной контейнер файлового менеджера */
.file-browser {
    background-color: #1a1a1a; /* Фон */
    padding: 20px; /* Внутренние отступы */
    border-radius: 10px; /* Закругленные углы */
    margin-top: 20px; /* Отступ сверху */
    box-shadow: 0 0 10px rgba(0,0,0,0.3); /* Тень */
}

/* Хлебные крошки (навигационная цепочка) */
.breadcrumb {
    background-color: #2a2a2a; /* Фон */
    padding: 10px 15px; /* Внутренние отступы */
    border-radius: 8px; /* Закругленные углы */
    margin-bottom: 15px; /* Отступ снизу */
    font-size: 14px; /* Размер шрифта */
}

/* Стили ссылок в хлебных крошках */
.breadcrumb a {
    color: #4da6ff; /* Синий цвет */
    text-decoration: none; /* Без подчеркивания */
    margin: 0 5px; /* Внешние отступы */
}

/* Эффект при наведении на ссылку */
.breadcrumb a:hover {
    text-decoration: underline; /* Подчеркивание */
}

/* Панель действий с файлами */
.file-actions {
    display: flex; /* Гибкий контейнер */
    gap: 10px; /* Расстояние между элементами */
    margin-bottom: 15px; /* Отступ снизу */
}

/* Таблица файлов */
.file-table {
    width: 100%; /* Ширина на весь контейнер */
    border-collapse: collapse; /* Схлопывание границ */
    background-color: #1e1e1e; /* Фон */
    border-radius: 8px; /* Закругленные углы */
    overflow: hidden; /* Скрытие переполнения */
}

/* Стили ячеек таблицы файлов */
.file-table th, .file-table td {
    padding: 12px 15px; /* Внутренние отступы */
    text-align: left; /* Выравнивание текста */
    border-bottom: 1px solid #333; /* Граница снизу */
}

/* Стили заголовков таблицы файлов */
.file-table th {
    background-color: #2a2a2a; /* Фон заголовков */
    color: #ddd; /* Цвет текста */
    font-weight: 600; /* Жирность шрифта */
}

/* Эффект при наведении на строку */
.file-table tbody tr:hover {
    background-color: #252525; /* Изменение фона */
}

/* Стили для папок */
.dir-item {
    color: #4da6ff; /* Синий цвет */
    cursor: pointer; /* Курсор-указатель */
}

/* Стили для файлов */
.file-item {
    color: #ddd; /* Светлый цвет */
    cursor: pointer; /* Курсор-указатель */
}

/* Иконки перед элементами */
.icon {
    margin-right: 8px; /* Отступ справа */
    font-size: 16px; /* Размер иконки */
}

/* СТИЛИ ДЛЯ FTP-ССЫЛОК */
/* Внешний вид FTP-ссылок */
.ftp-link {
    display: inline-block; /* Строчно-блочный элемент */
    background-color: #4e4e4e; /* Фон */
    color: white; /* Цвет текста */
    padding: 8px 12px; /* Внутренние отступы */
    border-radius: 4px; /* Закругленные углы */
    text-decoration: none; /* Без подчеркивания */
    font-weight: bold; /* Жирный шрифт */
    transition: all 0.3s; /* Плавные переходы */
}

/* Эффект при наведении на FTP-ссылку */
.ftp-link:hover {
    background-color: #5e5e5e; /* Изменение фона */
    box-shadow: 0 0 5px rgba(77, 166, 255, 0.5); /* Свечение */
}

/* Модальное окно для полного текста */
.modal {
  display: none;
  position: fixed;
  z-index: 1000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
}

.modal-content {
  background-color: #1e1e1e;
  margin: 5% auto;
  padding: 20px;
  border: 1px solid #333;
  border-radius: 10px;
  width: 80%;
  max-width: 800px;
  max-height: 80vh;
  overflow: auto;
  position: relative;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
}

.modal-close {
  position: absolute;
  top: 10px;
  right: 15px;
  font-size: 28px;
  font-weight: bold;
  color: #aaa;
  cursor: pointer;
  transition: color 0.3s;
}

.modal-close:hover {
  color: #fff;
}

.modal-body {
  padding: 20px 10px;
  font-family: monospace;
  white-space: pre-wrap;
  word-break: break-all;
  line-height: 1.5;
  color: #eee;
  background-color: #2a2a2a;
  border-radius: 5px;
  max-height: 60vh;
  overflow: auto;
}

/* Курсор-указатель для ячеек с всплывающим текстом */
.error-cell, .uuid-cell, .path-cell {
  cursor: pointer;
  transition: background-color 0.2s;
}

.error-cell:hover, .uuid-cell:hover, .path-cell:hover {
  background-color: #2c2c2c;
}

.modal-content h3 {
    margin-top: 0;
    color: #4da6ff;
    padding-bottom: 10px;
    border-bottom: 1px solid #333;
    margin-bottom: 15px;
    font-size: 1.4em;
}

.modal-close {
    position: absolute;
    top: 10px;
    right: 15px;
    font-size: 28px;
    font-weight: bold;
    color: #aaa;
    cursor: pointer;
    transition: color 0.3s;
    z-index: 10; /* Важно: чтобы кнопка была поверх других элементов */
}

.modal-close:hover {
    color: #fff;
}

/* кнопка инициации перепроверки контента */
.reCheck-btn {
    background-color: #2c2c2c; /* Цвет фона */
    color: #ccc; /* Цвет текста */
    padding: 10px 16px; /* Внутренние отступы */
    border: none; /* Убирает границу */
    border-radius: 8px; /* Закругленные углы */
    cursor: pointer; /* Курсор-указатель */
    font-size: 14px; /* Размер шрифта */
    transition: background 0.3s, color 0.3s; /* Плавные переходы */
    position: relative;
    z-index: 10;
    transition: color 0.4s, background-color 0.4s;
}

/* Стили при наведении на кнопку */
.reCheck-btn:hover {
    background-color: #3d3d3d; /* Изменение фона */
    color: white; /* Изменение цвета текста */
}

/* Стили для активной кнопки */
.reCheck-btn.active {
    background-color: #4e4e4e; /* Фон активной кнопки */
    color: #fff; /* Цвет текста */
    font-weight: bold; /* Жирный шрифт */
    border: 1px solid #666; /* Граница */
}



/* кнопка инициации перепроверки контента */
.delete-btn {
    background-color: #2c2c2c; /* Цвет фона */
    color: #ccc; /* Цвет текста */
    padding: 10px 16px; /* Внутренние отступы */
    border: none; /* Убирает границу */
    border-radius: 8px; /* Закругленные углы */
    cursor: pointer; /* Курсор-указатель */
    font-size: 14px; /* Размер шрифта */
    transition: background 0.3s, color 0.3s; /* Плавные переходы */
    position: relative;
    z-index: 10;
    transition: color 0.4s, background-color 0.4s;
}

/* Стили при наведении на кнопку */
.delete-btn:hover {
    background-color: #3d3d3d; /* Изменение фона */
    color: white; /* Изменение цвета текста */
}

/* Стили для активной кнопки */
.delete-btn.active {
    background-color: #4e4e4e; /* Фон активной кнопки */
    color: #fff; /* Цвет текста */
    font-weight: bold; /* Жирный шрифт */
    border: 1px solid #666; /* Граница */
}





#ftp-users-table {
    width: 100%;
    border-collapse: collapse;
}

#ftp-users-table th, #ftp-users-table td {
    padding: 8px 10px;
    border-bottom: 1px solid #333;
    text-align: left;
    font-size: 14px;
}

#ftp-users-table th {
    background-color: #2a2a2a;
    color: #ddd;
    font-weight: 600;
}

#ftp-users-table tbody tr:hover {
    background-color: #252525;
}

#admin-users-table {
    width: 100%;
    border-collapse: collapse;
}

#admin-users-table th, #admin-users-table td {
    padding: 8px 10px;
    border-bottom: 1px solid #333;
    text-align: left;
    font-size: 14px;
}

#admin-users-table th {
    background-color: #2a2a2a;
    color: #ddd;
    font-weight: 600;
}

#admin-users-table tbody tr:hover {
    background-color: #252525;
}

/* Индикатор загрузки */
.loading-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.7);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.loader {
    border: 5px solid #f3f3f3;
    border-top: 5px solid #3498db;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Уведомления */
.alert {
    position: fixed;
    bottom: 20px;
    right: 20px;
    padding: 15px 20px;
    border-radius: 5px;
    color: white;
    z-index: 1000;
    animation: slideIn 0.3s ease-out;
}

.alert-success {
    background-color: #28a745;
}

.alert-error {
    background-color: #dc3545;
}

.alert-info {
    background-color: #17a2b8;
}

@keyframes slideIn {
    from { transform: translateX(100%); }
    to { transform: translateX(0); }
}



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

/* Контейнер для таблицы с прокруткой */
/* Контейнер таблицы */
.table-container-verifer {
    overflow-x: auto;
    margin-top: 1px;
    background-color: #1e1e1e;
    border-radius: 8px;
    padding: 1px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.4);
}

/* Основная таблица */
#verifer-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    color: #ddd;
}

/* Заголовки */
#verifer-table th {
    background-color: #2a2a2a;
    color: #ddd;
    font-weight: 600;
    padding: 4px 6px;
    text-align: center;
    line-height: 18px;
}

/* Ячейки */
#verifer-table td {
    padding: 2px 6px; /* минимальный отступ */
    line-height: 18px; /* плотнее текст */
    text-align: center;
    border-bottom: 1px solid #333;
    white-space: nowrap; /* чтобы не ломало строки */
}

/* Строки (фиксируем высоту) */
#verifer-table tr {
    height: 24px; /* компактная высота */
}

/* Иконка (точка или картинка) */
.serv-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 24px; /* совпадает с высотой строки */
}

.serv-icon img {
    width: 12px;
    height: 12px;
    display: block;
}

/* Остальные ячейки */
.serv-label,
.serv-sn,
.serv-valid {
    font-family: monospace;
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 180px;
}

/* Эффект при наведении */
#verifer-table tbody tr:hover {
    background-color: #252525;
}


.header img {
    max-height: 100px;
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto; /* Дублирующее центрирование */
}

@media (max-width: 768px) {
    .header img {
        max-height: 100px;
    }
}

/* Контейнер содержимого статуса */
.container-status {
    background: #1e1e2f; /* тёмно-синий/фиолетовый фон */
    color: #e0e0e0; /* светлый текст */
    font-family: "Segoe UI", Arial, sans-serif;
    font-size: 14px;
    border-radius: 10px;
    padding: 10px 14px;
    max-width: 600px;
    margin: 0 auto;
    box-shadow: 0 0 20px rgba(0,0,0,0.5);
}

/* Заголовок */
.container-status h2 {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 6px;
    text-align: center;
    color: #ffffff;
}

/* Таблица */
.container-status table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.container-status td {
    padding: 6px 4px;
    vertical-align: top;
    word-break: break-word;
}

/* Левая колонка — ключ */
.container-status td:first-child {
    font-weight: 600;
    color: #9ccaff; /* мягкий синий оттенок */
    text-align: right;
    width: 35%;
    padding-right: 10px;
}

/* Правая колонка — значение */
.container-status td:last-child {
    color: #f0f0f0;
}

/* Чередование строк */
.container-status tr:nth-child(odd) {
    background: rgba(255, 255, 255, 0.03);
}

.container-status tr:nth-child(even) {
    background: rgba(255, 255, 255, 0.06);
}

/* Скролл при длинном контенте */
.container-status {
    max-height: 70vh;
    overflow-y: auto;
}


/* NEW CONTENT */
.new-content {
    margin: 1px;
}
/* ===================== МОНИТОРИНГ СЕРВЕРА (indev) ===================== */

.monitor-page {
    padding: 10px;
}

.monitor-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 12px;
    margin-top: 10px;
}

.monitor-card {
    background-color: #1e1e1e;
    border-radius: 8px;
    padding: 12px 16px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.4);
}

.monitor-card-wide {
    grid-column: 1 / -1;
}

.monitor-card h3 {
    margin: 0 0 8px 0;
    color: #ddd;
    font-size: 16px;
    border-bottom: 1px solid #333;
    padding-bottom: 6px;
}

.monitor-value {
    font-size: 28px;
    font-weight: bold;
    color: #4e9af1;
    margin-bottom: 8px;
}

.monitor-sub {
    font-size: 13px;
    color: #aaa;
    margin-top: 4px;
}

.net-values {
    display: flex;
    gap: 24px;
    font-size: 16px;
    margin-bottom: 8px;
    color: #ddd;
}

/* Статусы сервисов */
.services-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 4px;
}

.service-row {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #ddd;
}

.service-name {
    flex: 1;
}

.service-status {
    font-size: 12px;
    color: #999;
}

.service-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
    box-shadow: 0 0 4px currentColor;
}

.service-dot-ok {
    background-color: #4caf50;
    color: #4caf50;
}

.service-dot-fail {
    background-color: #f44336;
    color: #f44336;
}

.service-dot-warn {
    background-color: #ffb74d;
    color: #ffb74d;
}

.service-dot-off {
    background-color: #666;
    color: #666;
}

/* Диски */
.disk-row {
    margin-bottom: 10px;
}

.disk-label {
    font-size: 13px;
    color: #ccc;
    margin-bottom: 4px;
}

.disk-bar {
    background-color: #2a2a2a;
    border-radius: 6px;
    height: 10px;
    overflow: hidden;
}

.disk-bar-fill {
    background-color: #4e9af1;
    height: 100%;
    border-radius: 6px;
    transition: width 0.5s ease;
}

/* Таблица активных FTP-сессий — переиспользует #dcp-table стили через общий класс */
#ftp-active-table {
    width: 100%;
    border-collapse: collapse;
}

#ftp-active-table th, #ftp-active-table td {
    padding: 6px 8px;
    text-align: left;
    border-bottom: 1px solid #333;
    font-size: 13px;
}

#ftp-active-table th {
    background-color: #2a2a2a;
    color: #ddd;
    font-weight: 600;
}

#ftp-active-table tbody tr:hover {
    background-color: #252525;
}

.uuid-cell-mono {
    font-family: monospace;
    font-size: 13px;
    color: #ccc;
}

.ftp-action-active {
    color: #4e9af1;
    font-weight: 600;
}

.ftp-action-idle {
    color: #888;
}

/* Группы пользователей в Active connections / downloads */
.ftp-group-row {
    cursor: pointer;
    user-select: none;
}

.ftp-group-row:hover {
    background-color: #252525;
}

.ftp-toggle-cell {
    width: 24px;
    text-align: center;
    color: #888;
    font-size: 11px;
}

.ftp-detail-row td {
    padding: 0 12px 10px 12px;
    border-bottom: 1px solid #2a2a2a;
}

.ftp-files-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 8px 0 4px 24px;
}

.ftp-file-row {
    display: grid;
    grid-template-columns: 1fr 160px 160px;
    align-items: center;
    gap: 10px;
}

.ftp-file-name {
    font-family: monospace;
    font-size: 12px;
    color: #ddd;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ftp-file-bar {
    height: 6px;
    border-radius: 3px;
    background-color: #2a2a2a;
    overflow: hidden;
}

.ftp-file-bar-fill {
    height: 100%;
    background-color: #4e9af1;
    border-radius: 3px;
    transition: width 0.3s ease;
}

.ftp-file-meta {
    font-size: 11px;
    color: #999;
    text-align: right;
    white-space: nowrap;
}

@media (max-width: 700px) {
    .ftp-file-row {
        grid-template-columns: 1fr;
        gap: 4px;
    }
    .ftp-file-meta {
        text-align: left;
    }
}

/* ===================== ГЛОБАЛЬНЫЙ ПОИСК ПО КОНТЕНТУ ===================== */

.content-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
}

.content-header h2 {
    margin: 0;
    color: #eee;
    font-size: 1.3em;
    white-space: nowrap;
}

.search-bar {
    position: relative;
    display: flex;
    align-items: center;
    flex: 1 1 280px;
    max-width: 420px;
    background-color: #1e1e1e;
    border: 1px solid #333;
    border-radius: 8px;
    padding: 0 10px;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.search-bar:focus-within {
    border-color: #4da6ff;
    box-shadow: 0 0 0 2px rgba(77, 166, 255, 0.15);
}

.search-icon {
    font-size: 14px;
    opacity: 0.6;
    margin-right: 8px;
    flex-shrink: 0;
}

.search-input {
    flex: 1;
    background: transparent;
    border: none;
    outline: none;
    color: #eee;
    font-size: 14px;
    padding: 9px 0;
    font-family: 'Segoe UI', sans-serif;
}

.search-input::placeholder {
    color: #777;
}

.search-clear {
    cursor: pointer;
    color: #888;
    font-size: 20px;
    line-height: 1;
    padding: 0 2px;
    visibility: hidden;
    transition: color 0.2s;
    flex-shrink: 0;
}

.search-clear:hover {
    color: #fff;
}

.search-stats {
    font-size: 12px;
    color: #888;
    white-space: nowrap;
    margin-left: auto;
}

/* Пустое состояние при отсутствии результатов поиска */
.empty-state {
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 50px 20px;
    text-align: center;
    color: #888;
}

.empty-state-icon {
    font-size: 40px;
    margin-bottom: 10px;
    opacity: 0.6;
}

.empty-state-text {
    font-size: 16px;
    font-weight: 600;
    color: #ccc;
    margin-bottom: 4px;
}

.empty-state-sub {
    font-size: 13px;
    color: #777;
}

@media (max-width: 600px) {
    .content-header {
        flex-direction: column;
        align-items: stretch;
    }
    .search-bar {
        max-width: none;
    }
    .search-stats {
        margin-left: 0;
        text-align: right;
    }
}

/* ===================== ГАРМОНИЗИРОВАННЫЕ МОДАЛЬНЫЕ ОКНА ===================== */

/* Унифицированный вид мини-модалки (showMinimalModal) */
#minimal-modal {
    border: 1px solid #333 !important;
    font-family: 'Segoe UI', sans-serif;
}

#minimal-modal h3 {
    letter-spacing: 0.3px;
}

/* Карточка статуса контента внутри модалки */
.container-status {
    background: #1a1a1a;
    box-shadow: none;
    max-width: 100%;
    padding: 4px 2px;
}

.container-status h2 {
    display: none; /* заголовок уже показывается в шапке мини-модалки */
}

.container-status table {
    border-spacing: 0;
}

.container-status td {
    border-bottom: 1px solid #2a2a2a;
}

.container-status tr:last-child td {
    border-bottom: none;
}

.container-status td:first-child {
    color: #8fb8e8;
    text-transform: capitalize;
}

/* Разделитель и кнопки действий в карточке статуса */
.container-status hr {
    border: none;
    border-top: 1px solid #333;
    margin: 12px 0;
}

.container-status .reCheck-btn,
.container-status .delete-btn {
    width: 100%;
    margin-top: 8px;
    text-align: center;
    box-sizing: border-box;
}

.container-status .delete-btn {
    background-color: #5a2222;
    color: #ffd0d0;
}

.container-status .delete-btn:hover {
    background-color: #7a2c2c;
    color: #fff;
}

.container-status .reCheck-btn:hover {
    background-color: #3d3d3d;
}

/* Полноэкранная модалка fulltext-modal — мягче и согласованнее с остальным UI */
.modal-content {
    border: 1px solid #2e2e2e;
}

.modal-body {
    border: 1px solid #303030;
}

/* Таблица серверов KDM внутри modal-body */
#verifer-table {
    background-color: transparent;
}

.table-container-verifer {
    box-shadow: none;
}

/* ===================== ОБЩИЕ ФОРМЫ И КНОПКИ (admin / users_ftp) ===================== */

.field-input {
    background-color: #1e1e1e;
    border: 1px solid #333;
    border-radius: 8px;
    color: #eee;
    font-size: 14px;
    padding: 10px 12px;
    font-family: 'Segoe UI', sans-serif;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.field-input::placeholder {
    color: #777;
}

.field-input:focus {
    border-color: #4da6ff;
    box-shadow: 0 0 0 2px rgba(77, 166, 255, 0.15);
}

/* Универсальные кнопки */
.btn {
    background-color: #2c2c2c;
    color: #ccc;
    border: none;
    border-radius: 8px;
    padding: 10px 16px;
    font-size: 14px;
    cursor: pointer;
    transition: background-color 0.2s, color 0.2s;
}

.btn:hover {
    background-color: #3d3d3d;
    color: #fff;
}

.btn-primary {
    background-color: #2f5fa8;
    color: #fff;
}

.btn-primary:hover {
    background-color: #3a72c4;
}

.btn-danger {
    background-color: #5a2222;
    color: #ffd0d0;
}

.btn-danger:hover {
    background-color: #7a2c2c;
    color: #fff;
}

.btn-ghost {
    background-color: transparent;
    color: #ccc;
    border: 1px solid #333;
}

.btn-ghost:hover {
    background-color: #2a2a2a;
    color: #fff;
}

/* Карточка формы (например, "Добавить пользователя") */
.form-card {
    background-color: #1e1e1e;
    border-radius: 8px;
    padding: 16px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.4);
    margin-bottom: 16px;
}

.form-card-title {
    margin: 0 0 12px 0;
    color: #ddd;
    font-size: 15px;
    font-weight: 600;
}

.form-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

.form-row .field-input {
    flex: 1 1 200px;
}

.form-result {
    margin: 10px 0 0 0;
    font-size: 13px;
    color: #999;
    min-height: 18px;
}

.form-result-ok {
    color: #7ed957;
}

.form-result-err {
    color: #ff6b6b;
}

.form-result-warn {
    color: #ffb74d;
}

/* Ячейка с действиями в таблицах пользователей */
.admin-actions-cell {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

@media (max-width: 600px) {
    .form-row {
        flex-direction: column;
        align-items: stretch;
    }
    .form-row .field-input {
        flex: 1 1 auto;
    }
}

.user-size-loading {
    color: #777;
    font-style: italic;
}

.user-size-error {
    color: #ff6b6b;
    cursor: help;
}

/* ===================== МОДАЛКА РЕЗУЛЬТАТА УДАЛЕНИЯ ПОЛЬЗОВАТЕЛЯ ===================== */

.deletion-modal-content {
    font-family: 'Segoe UI', sans-serif;
}

.deletion-modal-title {
    margin: 0 0 6px 0;
    font-size: 1.2em;
    color: #eee;
}

.deletion-modal-username {
    margin: 0 0 16px 0;
    color: #999;
    font-size: 14px;
}

.deletion-steps-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.deletion-step {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 8px;
    background-color: #232323;
}

.deletion-step-ok {
    border-left: 3px solid #4caf50;
}

.deletion-step-fail {
    border-left: 3px solid #f44336;
}

.deletion-step-icon {
    font-size: 16px;
    line-height: 1.4;
    flex-shrink: 0;
}

.deletion-step-text {
    flex: 1;
}

.deletion-step-label {
    font-weight: 600;
    color: #eee;
    font-size: 14px;
}

.deletion-step-detail {
    color: #aaa;
    font-size: 13px;
    margin-top: 2px;
    font-family: monospace;
    word-break: break-word;
}

.deletion-modal-hint {
    margin: 16px 0 0 0;
    font-size: 13px;
    color: #ffb74d;
}

.deletion-modal-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 18px;
}

.deletion-progress {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 4px;
    color: #ccc;
    font-size: 14px;
}

.deletion-spinner {
    width: 20px;
    height: 20px;
    border: 3px solid #333;
    border-top-color: #4da6ff;
    border-radius: 50%;
    flex-shrink: 0;
    animation: deletion-spin 0.8s linear infinite;
}

@keyframes deletion-spin {
    to { transform: rotate(360deg); }
}

/* ===================== LINKS TAB ===================== */
.links-subtitle {
    color: #888;
    margin: 0 0 16px 0;
    font-size: 13px;
}

.links-create-card {
    background: #1e1e1e;
    border-radius: 10px;
    padding: 18px 20px;
    margin: 12px 0 18px 0;
    border: 1px solid #2e2e2e;
}

.links-section-title {
    margin: 0 0 14px 0;
    font-size: 15px;
    color: #ccc;
    font-weight: 600;
}

.links-form {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
}

.links-form-col {
    flex: 1;
    min-width: 220px;
}

.links-label {
    display: block;
    font-size: 12px;
    color: #888;
    margin-bottom: 6px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.links-select {
    width: 100%;
    background: #2a2a2a;
    border: 1px solid #444;
    color: #eee;
    padding: 8px 10px;
    border-radius: 6px;
    font-size: 14px;
    cursor: pointer;
    margin-bottom: 8px;
}

.links-select:focus {
    outline: none;
    border-color: #4da6ff;
}

.links-arrow {
    font-size: 28px;
    color: #4da6ff;
    padding-top: 28px;
    user-select: none;
    flex-shrink: 0;
}

.links-dir-list {
    margin-top: 6px;
}

.links-dir-label {
    font-size: 12px;
    color: #666;
    margin-bottom: 6px;
}

.links-dir-items {
    max-height: 180px;
    overflow-y: auto;
    border: 1px solid #333;
    border-radius: 6px;
    background: #252525;
}

.links-dir-item {
    padding: 7px 12px;
    cursor: pointer;
    font-size: 13px;
    color: #bbb;
    border-bottom: 1px solid #2e2e2e;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: background 0.15s;
}

.links-dir-item:last-child { border-bottom: none; }

.links-dir-item:hover {
    background: #303040;
    color: #fff;
}

.links-dir-item.selected {
    background: #1a2a3a;
    color: #4da6ff;
    border-left: 3px solid #4da6ff;
}

.links-dir-item.links-dir-empty {
    color: #555;
    cursor: default;
    font-style: italic;
}

.links-dst-info {
    margin-top: 8px;
}

.links-path-preview {
    font-size: 12px;
    color: #666;
    word-break: break-all;
}

.links-preview-box {
    margin-top: 16px;
    background: #141420;
    border: 1px solid #2a3a4a;
    border-radius: 8px;
    padding: 14px 16px;
}

.links-preview-title {
    font-size: 12px;
    color: #4da6ff;
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.links-preview-row {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 4px;
}

.links-preview-label {
    font-size: 12px;
    color: #666;
    min-width: 60px;
    flex-shrink: 0;
}

.links-preview-path {
    font-size: 12px;
    color: #aaa;
    word-break: break-all;
    font-family: monospace;
}

.links-preview-arrow {
    font-size: 12px;
    color: #4da6ff;
    margin: 6px 0;
    margin-left: 70px;
}

.links-form-actions {
    margin-top: 16px;
    display: flex;
    align-items: center;
    gap: 14px;
}

.links-create-status {
    font-size: 13px;
    color: #888;
}

.links-create-status.ok { color: #4caf50; }
.links-create-status.err { color: #e57373; }

/* Table section */
.links-table-section {
    margin-top: 8px;
}

.links-table-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}

.links-table-header .links-section-title {
    margin: 0;
}

#links-table {
    width: 100%;
    border-collapse: collapse;
}

#links-table th {
    background: #1a1a2a;
    color: #888;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    padding: 9px 12px;
    text-align: left;
    border-bottom: 1px solid #333;
}

#links-table td {
    padding: 10px 12px;
    font-size: 13px;
    color: #ccc;
    border-bottom: 1px solid #252525;
    vertical-align: middle;
}

#links-table tr:hover td { background: #1e1e2e; }

.links-cell-user {
    font-weight: 600;
    color: #eee;
}

.links-cell-dir {
    font-family: monospace;
    font-size: 12px;
    color: #aaa;
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.links-cell-arrow {
    color: #4da6ff;
    font-size: 18px;
    text-align: center;
    padding: 0 6px;
}

.links-badge {
    display: inline-block;
    padding: 3px 9px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
}

.links-badge-ok      { background: #1a3a1a; color: #4caf50; }
.links-badge-stale   { background: #3a2a1a; color: #ff9800; }
.links-badge-nosrc   { background: #3a1a1a; color: #e57373; }
.links-badge-nodst   { background: #3a1a2a; color: #ef5350; }
.links-badge-unknown { background: #2a2a2a; color: #888; }

.links-loading {
    text-align: center;
    color: #555;
    padding: 24px;
    font-style: italic;
}

.links-date {
    font-size: 11px;
    color: #555;
}

/* Delete modal */
.links-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}

.links-modal {
    background: #1e1e2e;
    border-radius: 12px;
    padding: 28px 32px;
    max-width: 480px;
    width: 90%;
    text-align: center;
    box-shadow: 0 0 40px rgba(0,0,0,0.6);
}

.links-modal-icon { font-size: 36px; margin-bottom: 10px; }
.links-modal-title { font-size: 18px; font-weight: 700; margin-bottom: 12px; }

.links-modal-body {
    background: #141420;
    border-radius: 8px;
    padding: 12px;
    font-size: 12px;
    font-family: monospace;
    color: #aaa;
    margin-bottom: 14px;
    text-align: left;
    line-height: 1.6;
}

.links-modal-warn {
    font-size: 13px;
    color: #888;
    margin-bottom: 20px;
    line-height: 1.5;
}

.links-modal-actions {
    display: flex;
    gap: 12px;
    justify-content: center;
}

.btn-danger {
    background: #8b0000;
    color: #fff;
    border: none;
    padding: 10px 20px;
    border-radius: 8px;
    cursor: pointer;
    font-size: 14px;
    transition: background 0.2s;
}

.btn-danger:hover { background: #a00000; }

.links-delete-progress {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
    margin-top: 14px;
    color: #888;
    font-size: 13px;
}

/* ============ USER SETTINGS MODAL ============ */
.usm-body { text-align: left; margin: 16px 0; }

.usm-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 0;
    border-bottom: 1px solid #2a2a2a;
}

.usm-label-title { font-size: 14px; color: #eee; margin-bottom: 4px; }
.usm-label-sub { font-size: 12px; color: #666; }

.usm-toggle {
    position: relative;
    display: inline-block;
    width: 46px;
    height: 26px;
    flex-shrink: 0;
}

.usm-toggle input { opacity: 0; width: 0; height: 0; }

.usm-toggle-slider {
    position: absolute;
    inset: 0;
    background: #444;
    border-radius: 26px;
    cursor: pointer;
    transition: background 0.2s;
}

.usm-toggle-slider::before {
    content: '';
    position: absolute;
    width: 18px; height: 18px;
    left: 4px; bottom: 4px;
    background: white;
    border-radius: 50%;
    transition: transform 0.2s;
}

.usm-toggle input:checked + .usm-toggle-slider { background: #4caf50; }
.usm-toggle input:checked + .usm-toggle-slider::before { transform: translateX(20px); }

/* ============ CREATE USER MODAL ============ */
.cu-field { margin-bottom: 12px; }

.cu-preview {
    background: #141420;
    border: 1px solid #2a3a4a;
    border-radius: 8px;
    padding: 12px 14px;
    margin-top: 14px;
}

.cu-preview-row {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-bottom: 4px;
    font-size: 13px;
}

.cu-mono {
    font-family: monospace;
    color: #4da6ff;
    font-size: 13px;
    word-break: break-all;
}

/* ============ CONTENT STATUS MODAL ============ */
.cm-root { font-size: 13px; }

.cm-section {
    margin-bottom: 14px;
    padding-bottom: 14px;
    border-bottom: 1px solid #2a2a2a;
}

.cm-section:last-child { border-bottom: none; margin-bottom: 0; }

.cm-checks {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.cm-label {
    font-size: 12px;
    color: #e57373;
    margin-bottom: 6px;
    font-weight: 600;
}

.cm-ok {
    color: #4caf50;
    font-size: 13px;
    font-weight: 600;
}

.cm-errors {
    margin: 0;
    padding-left: 16px;
    color: #aaa;
    font-size: 11px;
    font-family: monospace;
    line-height: 1.7;
    max-height: 140px;
    overflow-y: auto;
}

.cm-meta { }

.cm-meta-row {
    display: flex;
    gap: 10px;
    margin-bottom: 5px;
    align-items: baseline;
}

.cm-meta-key {
    font-size: 11px;
    color: #555;
    min-width: 40px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    flex-shrink: 0;
}

.cm-meta-val {
    font-size: 12px;
    color: #888;
    font-family: monospace;
}

.cm-actions {
    display: flex;
    gap: 10px;
    margin-top: 4px;
}

/* ═══════════════════════════════════════════════════
   FEST TAB
═══════════════════════════════════════════════════ */
.fest-root {
    display: flex;
    height: calc(100vh - 120px);
    gap: 0;
    overflow: hidden;
    margin: -16px;   /* компенсируем padding content-box */
}

/* ── Сайдбар ── */
.fest-sidebar {
    width: 230px;
    flex-shrink: 0;
    background: #161620;
    border-right: 1px solid #252535;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.fest-sidebar-hdr {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 14px;
    font-size: 13px;
    font-weight: 600;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 1px solid #252535;
}

.fest-icon-btn {
    background: #2a2a3a;
    border: none;
    color: #aaa;
    width: 26px; height: 26px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
    display: flex; align-items: center; justify-content: center;
    transition: background 0.15s, color 0.15s;
}
.fest-icon-btn:hover { background: #3a3a50; color: #fff; }

.fest-list { flex: 1; overflow-y: auto; padding: 6px 0; }

.fest-group-label {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: #444;
    padding: 8px 14px 4px;
}

.fest-list-item {
    padding: 8px 14px;
    cursor: pointer;
    border-radius: 6px;
    margin: 1px 6px;
    transition: background 0.15s;
}
.fest-list-item:hover { background: #1e1e2e; }
.fest-list-item.active { background: #1a2a3a; border-left: 3px solid #4da6ff; padding-left: 11px; }

.fest-list-name { font-size: 13px; color: #ddd; font-weight: 500; }
.fest-list-meta { font-size: 11px; color: #555; margin-top: 2px; display: flex; align-items: center; gap: 6px; }

.fest-badge {
    background: #252535;
    color: #666;
    font-size: 10px;
    padding: 1px 6px;
    border-radius: 8px;
}

.fest-loading { padding: 16px 14px; color: #444; font-size: 13px; font-style: italic; }

/* ── Основная область ── */
.fest-main { flex: 1; overflow-y: auto; padding: 16px 20px; }

.fest-empty-hint {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 200px;
    color: #333;
    font-size: 15px;
}

/* ── Заголовок фестиваля ── */
.fest-detail-hdr {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 16px;
    flex-wrap: wrap;
    gap: 10px;
}

.fest-detail-name {
    font-size: 20px;
    font-weight: 700;
    color: #eee;
}

.fest-detail-dates { font-size: 13px; color: #666; margin-top: 3px; }

.fest-detail-btns { display: flex; gap: 8px; flex-wrap: wrap; }

/* ── Вкладки залов ── */
.fest-hall-tabs {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
    border-bottom: 1px solid #252535;
    padding-bottom: 8px;
    margin-bottom: 12px;
}

.fest-hall-tab {
    background: #1e1e2e;
    border: 1px solid #2a2a3a;
    color: #888;
    padding: 6px 16px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 13px;
    transition: all 0.15s;
}
.fest-hall-tab:hover { background: #2a2a3a; color: #ccc; }
.fest-hall-tab.active { background: #1a2a3a; border-color: #4da6ff; color: #4da6ff; font-weight: 600; }

.fest-no-halls { color: #444; font-size: 13px; padding: 4px 0; }

/* ── Серверная полоска ── */
.fest-server-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #141420;
    border: 1px solid #1e1e2e;
    border-radius: 8px;
    padding: 8px 14px;
    margin-bottom: 10px;
    font-size: 12px;
}

.fest-server-label { color: #666; }
.fest-server-empty { color: #333; font-style: italic; }
.fest-server-edit-btn { margin-left: auto; }

/* ── Навигация по дням ── */
.fest-days-nav {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}

.fest-days-list {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
    flex: 1;
}

.fest-day-btn {
    background: #1e1e2e;
    border: 1px solid #2a2a3a;
    color: #888;
    padding: 5px 12px;
    border-radius: 20px;
    cursor: pointer;
    font-size: 12px;
    transition: all 0.15s;
    display: flex;
    align-items: center;
    gap: 5px;
}
.fest-day-btn:hover { background: #2a2a3a; color: #ccc; }
.fest-day-btn.active { background: #1a2a3a; border-color: #4da6ff; color: #4da6ff; }

.fest-day-count {
    background: #4da6ff22;
    color: #4da6ff;
    font-size: 10px;
    padding: 1px 5px;
    border-radius: 8px;
}

/* ── Область сеансов ── */
.fest-sessions-area { min-height: 200px; }

.fest-hint { color: #333; font-size: 13px; font-style: italic; padding: 20px 0; }

.fest-sess-toolbar {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.fest-sess-day-title { font-size: 14px; color: #aaa; font-weight: 600; flex: 1; }

/* ── Drag list ── */
.fest-drag-list { display: flex; flex-direction: column; gap: 6px; min-height: 40px; }

.sess-card {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #1a1a2a;
    border: 1px solid #252535;
    border-radius: 10px;
    padding: 10px 12px;
    cursor: default;
    transition: background 0.15s, box-shadow 0.15s;
    user-select: none;
}
.sess-card:hover { background: #1e1e30; }
.sess-card.dragging { opacity: 0.4; box-shadow: 0 0 0 2px #4da6ff; }

.sess-drag-handle {
    color: #333;
    cursor: grab;
    font-size: 16px;
    flex-shrink: 0;
    padding: 0 2px;
}
.sess-drag-handle:active { cursor: grabbing; }

.sess-time {
    font-size: 18px;
    font-weight: 700;
    color: #4da6ff;
    min-width: 52px;
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}

.sess-body { flex: 1; min-width: 0; }
.sess-title { font-size: 14px; color: #ddd; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sess-meta  { font-size: 11px; color: #555; margin-top: 2px; }

.sess-stats { display: flex; gap: 8px; margin-top: 4px; }
.sess-stat  { font-size: 12px; }

.sess-actions {
    display: flex;
    gap: 4px;
    flex-shrink: 0;
}

.btn-icon-sm {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 15px;
    padding: 4px 5px;
    border-radius: 5px;
    transition: background 0.15s;
    line-height: 1;
}
.btn-icon-sm:hover { background: #2a2a3a; }

/* ── Модалки Fest ── */
.fest-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}

.fest-modal {
    background: #1a1a2a;
    border-radius: 12px;
    padding: 24px 28px;
    max-width: 440px;
    width: 92%;
    box-shadow: 0 0 40px rgba(0,0,0,0.5);
}

.fest-modal-title {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 16px;
    color: #eee;
}

.fest-modal-body { display: flex; flex-direction: column; gap: 10px; margin-bottom: 12px; }

.fest-modal-row {
    display: flex;
    gap: 10px;
}
.fest-modal-row > div { flex: 1; display: flex; flex-direction: column; }

.fest-modal-sep {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #444;
    padding-top: 4px;
    border-top: 1px solid #252535;
}

.fest-modal-err {
    font-size: 12px;
    color: #e57373;
    min-height: 16px;
    margin-bottom: 8px;
}

.fest-overlap-warn {
    background: #3a2a1a;
    border: 1px solid #ff980055;
    border-radius: 6px;
    padding: 8px 12px;
    font-size: 12px;
    color: #ff9800;
    line-height: 1.4;
}

/* ── Фиксы fest stage 2 ── */

/* #3 — Ровная раскладка полей в модалке сеанса */
.fm-field {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

.fm-field-row {
    display: flex;
    gap: 10px;
    align-items: flex-end;
}

.fm-field-row .fm-field { flex: 1; }

/* #4 — Кнопка "＋ День" нормального размера */
.fest-days-nav .fest-icon-btn {
    padding: 5px 12px;
    width: auto;
    font-size: 13px;
    white-space: nowrap;
    border-radius: 20px;
    height: 30px;
    line-height: 1;
}

/* #2 — Сетка выбора дней */
.fm-day-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    max-height: 280px;
    overflow-y: auto;
    padding: 4px 0;
}

.fest-day-pick {
    background: #1e1e2e;
    border: 1px solid #2a2a3a;
    color: #ccc;
    padding: 6px 12px;
    border-radius: 20px;
    cursor: pointer;
    font-size: 12px;
    transition: all 0.15s;
    white-space: nowrap;
}

.fest-day-pick:hover:not(:disabled) {
    background: #2a2a3a;
    color: #fff;
    border-color: #4da6ff;
}

.fest-day-pick.selected {
    background: #1a2a3a;
    border-color: #4da6ff;
    color: #4da6ff;
    font-weight: 600;
}

.fest-day-pick.taken {
    background: #141414;
    border-color: #1e1e1e;
    color: #333;
    cursor: not-allowed;
    text-decoration: line-through;
}

/* ═══ Этап 2: DCP статусы, пикер, сводка зала ═══ */

/* Сводка зала */
.fest-hall-summary {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    padding: 6px 12px;
    background: #0e0e1a;
    border-radius: 8px;
    margin-bottom: 10px;
    font-size: 12px;
}
.hsumm-bar  { font-family: monospace; color: #3a4a6a; letter-spacing: 1px; }
.hsumm-pct  { color: #4da6ff; font-weight: 700; }
.hsumm-sep  { color: #2a2a3a; }
.hsumm-total{ color: #555; }
.hsumm-ok   { color: #4caf50; }
.hsumm-sk   { color: #666; }
.hsumm-pend { color: #ff9800; }
.hsumm-err  { color: #e57373; }

/* Карточка сеанса — обновлённая */
.sess-card.has-dcp { border-left: 3px solid #1a3a5a; }

.sess-title-cpl {
    font-size: 10px;
    color: #444;
    margin-top: 1px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-family: monospace;
}

.sess-dcp-badges {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
    margin-top: 4px;
}

.sv-badge {
    font-size: 10px;
    padding: 2px 6px;
    border-radius: 8px;
    white-space: nowrap;
}
.sv-ok   { background: #1a3a1a; color: #4caf50; }
.sv-err  { background: #3a1a1a; color: #e57373; }
.sv-gray { background: #1e1e1e; color: #555; }
.sv-kdm  { background: #1a2a3a; color: #4da6ff; }
.sv-skel { background: #1e1e1e; color: #444; }

/* DCP бар в модалке сеанса */
.fm-dcp-bind-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #111120;
    border: 1px solid #2a2a3a;
    border-radius: 8px;
    padding: 8px 12px;
}
.fm-dcp-info    { flex: 1; font-size: 12px; min-width: 0; }
.fm-dcp-empty   { color: #444; font-style: italic; }
.fm-dcp-linked  { color: #4da6ff; word-break: break-all; }
.fm-dcp-btns    { display: flex; gap: 6px; flex-shrink: 0; }

/* DCP Picker Modal */
.dcp-picker-modal {
    max-width: 720px;
    width: 95%;
    max-height: 85vh;
    display: flex;
    flex-direction: column;
    padding: 0;
    overflow: hidden;
}

.dcp-picker-hdr {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 22px 12px;
    border-bottom: 1px solid #252535;
}

.dcp-picker-filters {
    display: flex;
    gap: 8px;
    padding: 12px 22px;
    flex-wrap: wrap;
    border-bottom: 1px solid #1e1e2e;
}
.dcp-picker-filters .links-select { flex: 1; min-width: 160px; }

.dcp-picker-loading {
    padding: 24px;
    text-align: center;
    color: #555;
    font-style: italic;
}

.dcp-picker-table-wrap {
    flex: 1;
    overflow-y: auto;
    margin: 0;
}

.dcp-picker-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.dcp-picker-table th {
    background: #111120;
    color: #666;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    padding: 8px 12px;
    text-align: left;
    position: sticky;
    top: 0;
    border-bottom: 1px solid #252535;
}
.dcp-picker-table td {
    padding: 9px 12px;
    border-bottom: 1px solid #1a1a2a;
    color: #bbb;
    vertical-align: middle;
}
.dcp-pick-row { cursor: pointer; transition: background 0.12s; }
.dcp-pick-row:hover   { background: #1a1a2e; }
.dcp-pick-row.selected{ background: #0a1a2a; border-left: 3px solid #4da6ff; }
.dcp-pick-name { color: #ddd; font-weight: 500; max-width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dcp-pick-user { color: #666; font-size: 12px; }
.dcp-pick-size { color: #555; font-size: 11px; font-family: monospace; }

#fm-dcp-parse-status {
    padding: 8px 22px 12px;
    font-size: 12px;
    min-height: 28px;
}

/* ═══ Этап 3: KDM статусы ═══ */
.sv-kdm-ok   { background: #0a2a1a; color: #4caf50; border: 1px solid #1a5a2a; }
.sv-kdm-err  { background: #3a1a1a; color: #e57373; border: 1px solid #5a2a2a; }
.sv-kdm-warn { background: #3a2a0a; color: #ff9800; border: 1px solid #5a4a1a; }

.hsumm-kdm { color: #ff9800; }

/* ═══ Content table redesign ═══ */

/* Компактные строки */
#dcp-table td, #dcp-table th {
    padding: 5px 10px;
    font-size: 12px;
}
#dcp-table tbody tr { height: 34px; }
#dcp-table tbody tr:hover td { background: #1a1a28; }

/* Name RU — ячейка с inline edit */
.editable-name-cell { min-width: 140px; max-width: 200px; }

.dcp-name-text {
    cursor: pointer;
    color: #ddd;
    font-weight: 500;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 190px;
    padding: 1px 4px;
    border-radius: 4px;
    transition: background 0.15s;
}
.dcp-name-text:hover { background: #252535; color: #fff; }

.dcp-inline-edit {
    display: flex;
    align-items: center;
    gap: 4px;
}
.dcp-name-input {
    flex: 1;
    background: #1a1a2e;
    border: 1px solid #4da6ff;
    color: #fff;
    padding: 3px 7px;
    border-radius: 5px;
    font-size: 12px;
    min-width: 0;
}
.dcp-name-input:focus { outline: none; }

.dcp-inline-ok, .dcp-inline-cancel {
    background: none;
    border: 1px solid #333;
    color: #888;
    width: 24px;
    height: 24px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: all 0.15s;
}
.dcp-inline-ok:hover     { border-color: #4caf50; color: #4caf50; background: #1a3a1a; }
.dcp-inline-cancel:hover { border-color: #e57373; color: #e57373; background: #3a1a1a; }

/* Title cell */
.dcp-title-cell {
    max-width: 240px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #666;
    font-size: 11px;
    font-family: monospace;
}

/* Username badge */
.dcp-user-badge {
    background: #1e1e2e;
    color: #888;
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 10px;
    white-space: nowrap;
}

/* KDM badges */
.kdm-badge {
    font-size: 11px;
    padding: 2px 7px;
    border-radius: 8px;
    white-space: nowrap;
}
.kdm-ok   { background: #1a3a1a; color: #4caf50; }
.kdm-has  { background: #1a2a3a; color: #4da6ff; }
.kdm-req  { background: #3a2a1a; color: #ff9800; }
.kdm-none { background: #1e1e1e; color: #555; }

/* Verification dots */
.dcp-status-cell { white-space: nowrap; cursor: pointer; }
.vdots { display: inline-flex; gap: 3px; margin-right: 5px; vertical-align: middle; }
.vdot  { font-size: 14px; line-height: 1; }
.vd-ok   { color: #4caf50; }
.vd-err  { color: #e57373; }
.vd-wait { color: #333; }

/* Path icon */
.path-icon-link { font-size: 16px; text-decoration: none; }
.path-icon-link:hover { opacity: 0.7; }

/* Size and date cells */
.dcp-size-cell { font-size: 11px; color: #666; font-family: monospace; white-space: nowrap; }
.dcp-date-cell { font-size: 11px; color: #555; white-space: nowrap; }

/* PKL comparison table in modal */
.pkl-compare-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 11px;
    margin-top: 6px;
}
.pkl-compare-table th {
    background: #111120;
    color: #555;
    padding: 5px 8px;
    text-align: left;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    border-bottom: 1px solid #252535;
}
.pkl-compare-table td {
    padding: 4px 8px;
    border-bottom: 1px solid #1a1a2a;
    vertical-align: middle;
}
.pkl-fn { color: #888; font-family: monospace; max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pkl-sz { color: #666; font-family: monospace; white-space: nowrap; }
.pkl-st { text-align: center; font-size: 13px; }
.pkl-mismatch td { background: #2a1010 !important; }
.pkl-warn-row td { background: rgba(255, 152, 0, 0.08) !important; }


/* ═══ Hash progress — единая ячейка на всю строку (colspan), без absolute-хаков ═══ */

/* Настоящие ячейки строки прячем на время хэширования — данные остаются в DOM
   (нужны другим функциям и для восстановления), просто не отображаются. */
#dcp-table tbody tr.hashing td[data-hash-hidden] {
    display: none;
}

.hash-progress-cell {
    padding: 0 !important;
    border-bottom: 1px solid #1a1a2a;
    background: linear-gradient(180deg, #10131f, #0c0e18);
}

.hash-ov-inner {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 9px 16px;
    opacity: 0;
    transform: translateY(-2px);
    transition: opacity 0.25s ease, transform 0.25s ease;
}
.hash-progress-cell.hash-ov-visible .hash-ov-inner {
    opacity: 1;
    transform: translateY(0);
}

.hash-ov-icon {
    font-size: 15px;
    flex-shrink: 0;
    animation: hashIconSpin 2.2s linear infinite;
    display: inline-block;
}
@keyframes hashIconSpin {
    0%, 85% { transform: rotate(0deg); }
    100%    { transform: rotate(360deg); }
}

.hash-ov-track {
    position: relative;
    flex: 1 1 auto;
    max-width: 420px;
    height: 8px;
    background: #161826;
    border: 1px solid #2a3a5a;
    border-radius: 5px;
    overflow: hidden;
}
.hash-ov-fill {
    height: 100%;
    width: 0%;
    background: linear-gradient(90deg, #2a7fff, #4da6ff);
    border-radius: 4px;
    transition: width 0.5s ease;
    box-shadow: 0 0 8px rgba(77,166,255,0.55);
}
/* Бегущий блик поверх залитой части — читается как "процесс идёт", а не застрял */
.hash-ov-shimmer {
    position: absolute;
    top: 0; left: 0; height: 100%; width: 40%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.35), transparent);
    animation: hashShimmer 1.6s ease-in-out infinite;
}
@keyframes hashShimmer {
    0%   { transform: translateX(-100%); }
    100% { transform: translateX(350%); }
}

.hash-ov-text {
    font-size: 11px;
    color: #8fc4ff;
    font-family: monospace;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 0 1 auto;
    min-width: 0;
}

/* Строка мягко "подсвечена" пока хэшируется, чтобы взгляд сам находил активную */
#dcp-table tbody tr.hashing {
    background: rgba(42, 127, 255, 0.04);
}

/* ═══ Sound QC badge — состояния + анимации ═══ */

.sound-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    padding: 2px 6px;
    border-radius: 8px;
    white-space: nowrap;
    cursor: pointer;
    transition: background 0.4s ease, color 0.4s ease, transform 0.15s ease;
}
.sound-badge:hover { transform: scale(1.12); }

.sound-ok      { background: #1a3a1a; color: #4caf50; }
.sound-warn    { background: #3a2a10; color: #ff9800; }
.sound-error   { background: #1e1e1e; color: #555; }
.sound-pending,
.sound-queued  { background: #1e1e1e; color: #444; opacity: 0.65; }

/* Ждёт очереди — лёгкое дыхание, без цвета, чтобы не путать с "идёт анализ" */
.sound-queued {
    animation: soundBreathe 2.4s ease-in-out infinite;
}
@keyframes soundBreathe {
    0%, 100% { opacity: 0.45; }
    50%      { opacity: 0.8; }
}

/* Анализ идёт прямо сейчас — плавное синее мигание, как просили */
.sound-processing {
    background: #142a4a;
    color: #4da6ff;
    animation: soundPulseBlue 1.8s ease-in-out infinite;
}
@keyframes soundPulseBlue {
    0%, 100% {
        box-shadow: 0 0 0px rgba(77,166,255,0.0);
        background: #142a4a;
    }
    50% {
        box-shadow: 0 0 10px rgba(77,166,255,0.75);
        background: #1c3f6e;
    }
}

/* Короткая вспышка в момент смены статуса (когда пришёл свежий результат) */
.sound-badge-changed {
    animation: soundStatusFlash 0.9s ease-out;
}
@keyframes soundStatusFlash {
    0%   { transform: scale(1.5); filter: brightness(1.8); }
    100% { transform: scale(1); filter: brightness(1); }
}

/* ═══ Унификация таблиц users_ftp и kdm_ftp под стиль content ═══ */

/* Компактные строки для обеих таблиц */
#ftp-users-table td, #ftp-users-table th,
#dcp-table.kdm-table td, #dcp-table.kdm-table th {
    padding: 5px 10px;
    font-size: 12px;
}
#ftp-users-table tbody tr { height: 34px; }
#ftp-users-table tbody tr:hover td { background: #1a1a28; }

#ftp-users-table thead th {
    background: #111120;
    color: #666;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

/* Messenger badges */
.msg-badge {
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 10px;
    white-space: nowrap;
    font-family: monospace;
}
.msg-max { background: #1a2a3a; color: #4da6ff; }
.msg-tg  { background: #1a3030; color: #4ac4c4; }
.msg-form { background: #2a1a3a; color: #b088e0; cursor: help; }

/* User status badge */
.ustatus-badge {
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 10px;
    background: #1a3a1a;
    color: #6ab06a;
    white-space: nowrap;
}

.utel-cell  { color: #888; font-family: monospace; font-size: 11px; white-space: nowrap; }
.ufilm-cell {
    color: #aaa;
    max-width: 260px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.admin-actions-cell { white-space: nowrap; text-align: right; }

/* ═══════════════════════════════════════════════════
   SERVER MANAGER (kdm_ftp)
═══════════════════════════════════════════════════ */
.srv-list { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.srv-loading, .srv-empty {
    padding: 24px; text-align: center; color: #555; font-style: italic; font-size: 13px;
}

/* Карточка сервера */
.srv-card {
    background: #16161f;
    border: 1px solid #232330;
    border-radius: 10px;
    overflow: hidden;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.srv-card:hover { border-color: #2e2e42; }
.srv-card.expanded {
    border-color: #2a4a6a;
    box-shadow: 0 0 0 1px rgba(77,166,255,0.1);
}

.srv-card-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    cursor: pointer;
    user-select: none;
}
.srv-card-head:hover { background: #1a1a26; }

.srv-chevron {
    color: #4da6ff;
    font-size: 11px;
    transition: transform 0.25s ease;
    flex-shrink: 0;
}

.srv-card-main { flex: 1; min-width: 0; }
.srv-card-label {
    font-size: 14px; color: #e8e8f0; font-weight: 600;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.srv-sn {
    font-size: 11px; color: #4da6ff; font-family: monospace;
    background: #142436; padding: 1px 7px; border-radius: 8px; margin-left: 6px;
}
.srv-card-sub {
    font-size: 11px; color: #5a5a6a; margin-top: 2px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.srv-card-stats { flex-shrink: 0; }
.srv-kdm-badge {
    font-size: 12px; color: #aaa;
    background: #1e1e2e; padding: 3px 10px; border-radius: 12px;
    white-space: nowrap;
}

.srv-card-actions { display: flex; gap: 2px; flex-shrink: 0; }

/* Тело карточки — KDM */
.srv-card-body {
    padding: 4px 14px 12px 38px;
    border-top: 1px solid #1e1e2a;
    animation: srv-expand 0.25s ease;
}
@keyframes srv-expand {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}

.srv-kdm-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 7px 0;
    border-bottom: 1px solid #1a1a24;
    font-size: 12px;
}
.srv-kdm-row:last-child { border-bottom: none; }
.srv-kdm-title {
    flex: 1; color: #ccc; min-width: 0;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    font-family: monospace; font-size: 11px;
}
.srv-kdm-dates { color: #666; font-size: 11px; white-space: nowrap; }
.srv-kdm-empty { color: #444; font-style: italic; font-size: 12px; padding: 8px 0; }

/* KDM статусы */
.kdm-stat {
    font-size: 11px; padding: 2px 8px; border-radius: 8px; white-space: nowrap; flex-shrink: 0;
}
.kdm-active  { background: #0e2a16; color: #5ac46f; }
.kdm-future  { background: #0e1e3a; color: #5a9ade; }
.kdm-expired { background: #1e1e1e; color: #555; }

/* Orphan секция */
.orphan-section {
    margin-top: 18px;
    background: #14141c;
    border: 1px solid #232330;
    border-radius: 10px;
    overflow: hidden;
}
.orphan-header {
    display: flex; align-items: center; gap: 10px;
    padding: 11px 14px; cursor: pointer; user-select: none;
}
.orphan-header:hover { background: #1a1a26; }
.orphan-chevron { color: #ff9800; font-size: 11px; transition: transform 0.25s ease; }
.orphan-title { flex: 1; font-size: 13px; color: #bbb; }
.orphan-count {
    background: #3a2a0a; color: #ff9800;
    font-size: 11px; padding: 2px 9px; border-radius: 10px;
}
.orphan-body { padding: 4px 14px 12px 38px; border-top: 1px solid #1e1e2a; }
.orphan-row { gap: 10px; }
.orphan-sn {
    font-family: monospace; font-size: 10px; color: #ff9800;
    background: #2a1f0a; padding: 1px 6px; border-radius: 6px; white-space: nowrap;
}

/* Dropzone */
.srv-dropzone {
    border: 2px dashed #2e2e42;
    border-radius: 10px;
    padding: 24px 16px;
    text-align: center;
    cursor: pointer;
    transition: all 0.2s;
    background: #14141c;
}
.srv-dropzone:hover { border-color: #4da6ff; background: #161a24; }
.srv-dropzone.dragover {
    border-color: #4da6ff;
    background: #142436;
    transform: scale(1.01);
}
.srv-dz-icon { font-size: 32px; margin-bottom: 8px; }
.srv-dz-text { color: #aaa; font-size: 13px; line-height: 1.5; }
.srv-dz-link { color: #4da6ff; text-decoration: underline; }
.srv-dz-hint { color: #555; font-size: 11px; margin-top: 8px; }
.srv-file-chosen {
    color: #5ac46f; font-size: 13px; padding: 12px;
    background: #0e2a16; border-radius: 8px;
}
.srv-fc-size { color: #4a7a55; font-size: 11px; }

/* Parsed preview */
.srv-parsed {
    margin-top: 12px; background: #142436; border-radius: 8px; padding: 12px;
    animation: srv-expand 0.2s ease;
}
.srv-parsed-row { display: flex; gap: 10px; margin-bottom: 5px; font-size: 12px; }
.srv-parsed-row:last-child { margin-bottom: 0; }
.srv-pk { color: #5a8ac0; min-width: 70px; font-size: 11px; text-transform: uppercase; }
.srv-pv { color: #cce; font-family: monospace; word-break: break-all; }

/* ═══ ADMIN — users table & groups/permissions ═══ */

.admin-group-select {
    background: #1e1e2e;
    color: #eee;
    border: 1px solid #333;
    border-radius: 6px;
    padding: 4px 8px;
    font-size: 12px;
    cursor: pointer;
}
.admin-group-select:focus { outline: none; border-color: #4da6ff; }

.group-card {
    background: #1e1e2e;
    border: 1px solid #2a2a3a;
    border-radius: 10px;
    padding: 16px 18px;
    margin-bottom: 14px;
}
.group-card.admin-locked { opacity: 0.7; }

.group-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
}
.group-card-name { display: flex; align-items: center; gap: 10px; }
.group-card-name input {
    background: #141420;
    color: #eee;
    border: 1px solid #2a3a4a;
    border-radius: 6px;
    padding: 6px 10px;
    font-size: 15px;
    font-weight: 600;
}
.group-card-name input:focus { outline: none; border-color: #4da6ff; }
.group-card-name input:disabled { border-color: transparent; }

.perm-matrix { border-collapse: collapse; width: 100%; }
.perm-matrix th {
    background: #111120;
    color: #666;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    padding: 6px 10px;
    text-align: center;
}
.perm-matrix th:first-child { text-align: left; }
.perm-matrix td {
    padding: 7px 10px;
    text-align: center;
    border-bottom: 1px solid #22222e;
    color: #ccc;
    font-size: 13px;
}
.perm-matrix td:first-child { text-align: left; }
.perm-matrix tbody tr:hover td { background: #1a1a28; }

.usm-toggle-sm { width: 34px; height: 20px; }
.usm-toggle-sm .usm-toggle-slider::before { width: 14px; height: 14px; left: 3px; bottom: 3px; }
.usm-toggle-sm input:checked + .usm-toggle-slider::before { transform: translateX(14px); }
.usm-toggle input:disabled + .usm-toggle-slider { opacity: 0.5; cursor: not-allowed; }

.srv-del-body { font-size: 13px; color: #aaa; line-height: 1.6; margin-bottom: 18px; }