/* ==========================================================================
   ST-WORLD ULTIMATE GRADIENT STYLE (FIXED BUTTONS & ONLINE TEXT)
   ========================================================================= */

:root {
    /* Фирменный огненный градиент ST-WORLD */
    --gradient-start: #FFCD75;
    --gradient-end: #EC6D3E;
    
    /* Приятно-белый цвет для текста */
    --text-light: #F5F5DC;
    
    /* Базовые темные тона */
    --bg-dark: #0b090f;
    --bg-card: #15121b;
    --border-color: rgba(255, 205, 117, 0.2);
}

/* 1. ГЛОБАЛЬНЫЙ ЦВЕТ ТЕКСТА (Приятно-белый) */
body, html, p, span, div, label, h1, h2, h3, h4, h5, h6, .text-muted {
    color: var(--text-light) !important;
}

/* Настройка цвета ссылок */
a {
    color: var(--text-light) !important;
    text-decoration: none !important;
}

/* 2. ЖЕСТКОЕ ВКЛЮЧЕНИЕ ГРАДИЕНТА ДЛЯ КНОПОК И ВЫДЕЛЕНИЙ */
/* Добавлены селекторы для кнопок из image_0be613.png */
.btn-primary, 
.btn-accent, 
[class*="btn-buy"], 
[class*="btn-pay"],
button[type="submit"], 
.btn,
.badge-primary,
[class*="badge"],
[class*="server-badge"],
.active {
    /* Фиксируем градиент через background-image */
    background-image: linear-gradient(135deg, var(--gradient-start) 0%, var(--gradient-end) 100%) !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: 0 4px 15px rgba(236, 109, 62, 0.4) !important;
    transition: all 0.25s ease-in-out !important;
    cursor: pointer !important;
}

/* ФИКС ДЛЯ КНОПОК (из image_0be613.png) И ПЛАШЕК ОНЛАЙНА */
/* Делаем текст на градиентных элементах темным, чтобы он не сливался */
.btn-primary, 
.btn-accent, 
[class*="btn-buy"], 
[class*="btn-pay"],
button[type="submit"], 
.btn,
.badge-primary, 
[class*="badge"], 
[class*="server-badge"], 
[class*="badge"] span, 
[class*="badge"] div,
[class*="server"] .text-warning,
[class*="server"] [class*="online"] {
    color: #110f14 !important; 
    font-weight: 800 !important; /* Жирный шрифт для сочности */
}

/* Фикс цвета иконок (тележки и стрелочки) внутри кнопки */
.btn-primary i, .btn-primary svg, [class*="btn-buy"] i, [class*="btn-buy"] svg, .btn i, .btn svg {
    color: #110f14 !important;
    fill: #110f14 !important;
}

/* Эффект при наведении на кнопки */
.btn-primary:hover, [class*="btn-buy"]:hover, [class*="btn-pay"]:hover, button[type="submit"]:hover, .btn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(255, 205, 117, 0.6) !important;
    filter: brightness(1.15) !important; /* Градиент становится ярче и "горит" при наведении */
}

/* 3. КАРТОЧКИ И ЭЛЕМЕНТЫ (Форма и свечение при наведении) */
.product-card, .server-card, .category-card, .card, [class*="card"], .shop-item {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 16px !important;
    transition: all 0.3s ease !important;
}

/* Огненное градиентное свечение рамок карточек при наведении */
.product-card:hover, .shop-item:hover, [class*="card"]:hover {
    border-color: var(--gradient-end) !important;
    box-shadow: 0 0 20px rgba(236, 109, 62, 0.3) !important;
    transform: translateY(-4px) !important;
}

/* Поля ввода (Никнейм, купоны) */
input, select, .form-control {
    background-color: rgba(15, 12, 21, 0.8) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-light) !important;
    border-radius: 10px !important;
}

input:focus, .form-control:focus {
    border-color: var(--gradient-start) !important;
    box-shadow: 0 0 10px rgba(255, 205, 117, 0.3) !important;
}

/* Фоновое пространство сайта */
body {
    background-color: var(--bg-dark) !important;
}


/* ==========================================================================
   ОБНОВЛЕНИЕ ШАПКИ: ЦЕНТРОВКА И ПЕРЕНОС ЛОГОТИПА НАВЕРХ (из image_173bba.jpg)
   ========================================================================== */

.header .container, 
[class*="header__content"], 
[class*="header-banner"] {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;   
    text-align: center !important;    
    justify-content: center !important;
}

.header img, 
[class*="header__logo"], 
[class*="banner__image"],
.header [class*="image"] {
    order: -1 !important;             
    width: 125px !important;          
    height: 125px !important;         
    object-fit: cover !important;
    border-radius: 20px !important;   
    margin-bottom: 15px !important;   
    margin-left: 0 !important;        
    margin-right: 0 !important;
}

.header h1, 
[class*="header__title"], 
[class*="banner__title"] {
    margin-bottom: 6px !important;
    width: 100% !important;
}

/* Уменьшенный аккуратный подзаголовок по центру */
.header p, 
[class*="header__subtitle"], 
[class*="banner__subtitle"],
.header h1 + p,
.header h1 + span {
    font-size: 0.95rem !important;    
    opacity: 0.8 !important;          
    width: 100% !important;
    margin-top: 0 !important;
}