/* 
 * ЕДИНЫЙ СТИЛЬ ДЛЯ ШАПОК И КНОПОК 
 * Используется в JSON LIVE, TABLES, FOR USER
 */

/* Шапка - единый стиль */
.demo-info-label {
    background: #1a1a1a !important;
    color: #fff !important;
    padding: 10px 16px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 12px !important;
}

/* Текст заголовка */
.demo-info-label span {
    font-weight: 700 !important;
    font-size: 16px !important;
}

/* Кнопки и контролы внутри шапки */
.demo-info-label button,
.demo-info-label select {
    padding: 4px 8px !important;
    background: #fff !important;
    border: 1px solid #fff !important;
    border-radius: 3px !important;
    cursor: pointer !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    color: #1a1a1a !important;
    transition: all 0.2s ease !important;
}

/* Исключение для кнопки настроек (шестеренка) */
.demo-info-label button.settings-toggle {
    background: #fff !important;
    border: 1px solid #fff !important;
    padding: 0 !important;
    color: #1a1a1a !important;
    width: 32px !important;
    height: 32px !important;
    border-radius: 3px !important;
    font-size: 0 !important; /* Скрываем текст из HTML */
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: none !important;
}

.demo-info-label button.settings-toggle:hover {
    background: #fff !important;
    transform: none !important;
}

/* Вращается только содержимое кнопки */
.demo-info-label button.settings-toggle::before {
    content: '⚙';
    display: inline-block;
    font-size: 20px !important;
    transition: transform 0.3s ease;
}

.demo-info-label button.settings-toggle:hover::before {
    transform: rotate(90deg);
}

.demo-info-label button:hover,
.demo-info-label select:hover {
    background: #f0f0f0 !important;
}

/* Шестеренка не меняет фон при наведении */
.demo-info-label button.settings-toggle:hover {
    background: #fff !important;
}

.demo-info-label button:disabled {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}

/* Контейнер с кнопками навигации */
.demo-info-label > div {
    display: flex !important;
    gap: 8px !important;
    align-items: center !important;
}