/* Container for buttons in the header */
.header-buttons {
    display: flex;
    gap: 10px;
}

/* Blue style for the Add button */
.btn-settings {
    background: linear-gradient(180deg, #3a3a3a 0%, #2b2b2b 100%) !important;
    border: 1px solid #4c4c4c !important;
    border-radius: 10px !important;
}

/* hover/active для .btn-settings — в page1_main.css */
#settings-admin-table {
    table-layout: fixed;
    width: 100%;
}

#settings-admin-table th:nth-child(1),
#settings-admin-table td:nth-child(1) {
    width: 20%;
}

#settings-admin-table th:nth-child(2),
#settings-admin-table td:nth-child(2) {
    width: 42%;
}

#settings-admin-table th:nth-child(3),
#settings-admin-table td:nth-child(3) {
    width: 38%;
}

/* Поле имени — по центру ячейки (табличный и альбомный режимы) */
#settings-admin-table td:nth-child(2) {
    text-align: center;
    vertical-align: middle;
}

#settings-admin-table .admin-input {
    display: block;
    width: min(96%, 520px);
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    box-sizing: border-box;
    background: #111;
    border: 1px solid #303030;
    color: #ececec;
    padding: 8px 12px;
    border-radius: 10px;
    font-family: "Inter", "Segoe UI", sans-serif;
    font-size: 16px;
}

/* Длинный ID — одна строка с многоточием в таблице */
#settings-admin-table td:nth-child(1) .id-label {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    color: #aaa;
    font-family: monospace;
    font-weight: bold;
}

.btn-delete {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid #4a4a4a;
    color: #b8b8b8;
    font-size: 15px;
    padding: 5px 10px;
    border-radius: 10px;
    cursor: pointer;
    transition:
        transform var(--btn-transition-duration, 0.22s) cubic-bezier(0.33, 1, 0.68, 1),
        box-shadow var(--btn-transition-duration, 0.22s) ease,
        background var(--btn-transition-duration, 0.22s) ease,
        border-color var(--btn-transition-duration, 0.22s) ease,
        color var(--btn-transition-duration, 0.22s) ease,
        filter var(--btn-transition-duration, 0.22s) ease;
}

.btn-delete:hover {
    background: linear-gradient(180deg, #3a3a3a 0%, #2a2a2a 100%);
    color: #f4f4f4;
    border-color: #8c8c8c;
    transform: translateY(var(--btn-hover-lift, -2px));
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
    filter: brightness(1.06);
}

.btn-delete:active {
    transform: translateY(0) scale(var(--btn-press-scale, 0.97));
    box-shadow:
        inset 0 4px 12px rgba(0, 0, 0, 0.5),
        0 2px 6px rgba(0, 0, 0, 0.25);
    border-color: #2f2f2f;
    filter: brightness(0.92);
    transition-duration: var(--btn-transition-press, 0.09s);
}

/* Выравниваем содержимое всех ячеек по центру по вертикали (отдельный id — не #timing-table page1) */
#settings-admin-table td {
    vertical-align: middle;
    padding: 10px;
    height: 50px;
}

/* Контейнер для кнопок SET и DELETE */
.actions-container {
    display: flex;
    gap: 25px;
    justify-content: center;
    align-items: center;
    min-height: 36px; /* Фиксированная высота, чтобы строка не прыгала без кнопки */
}

/* Чтобы кнопки не меняли высоту строки при наведении или нажатии */
.btn-save, .btn-delete {
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 36px; /* Фиксированная высота кнопок */
}