/* ==========================================================================
   ★ ZUST TRIO ★ ОФИЦИАЛЬНЫЙ СТИЛЬ ДЛЯ GAMESTORES.APP
   ========================================================================== */

:root, :root[data-theme] {
    --accent-color-800: #00e5ff !important;
    --accent-color-900: #00b3cc !important;
    --bg-color-700: #0e1420 !important;
    --bg-color-800: #080c14 !important;
    --bg-color-900: #05080e !important;
    --font-color-700: #ffffff !important;
    --font-color-800: #e2e8f0 !important;
    --font-color-900: #8899aa !important;
    --product-items-trans-bg-color: rgba(8, 12, 20, 0.85) !important;
    --default-font-family: 'Roboto', sans-serif !important;
}

/* 1. ГЛАВНЫЙ ФОН */
body {
    background-color: #070a10 !important;
    background-image: 
        radial-gradient(circle at 50% 0%, rgba(0, 229, 255, 0.15) 0%, transparent 60%),
        radial-gradient(circle at 100% 100%, rgba(0, 100, 255, 0.08) 0%, transparent 40%),
        linear-gradient(rgba(255, 255, 255, 0.02) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.02) 1px, transparent 1px) !important;
    background-size: 100% 100%, 100% 100%, 35px 35px, 35px 35px !important;
    color: #e2e8f0 !important;
}

/* 2. ШАПКА САЙТА */
div[class*="Header-module__wrapper"] {
    background: rgba(14, 20, 32, 0.95) !important;
    backdrop-filter: blur(15px) !important;
    border-bottom: 2px solid #00e5ff !important;
    box-shadow: 0 4px 30px rgba(0, 229, 255, 0.2) !important;
}

div[class*="HeaderNav-module__link"]:hover {
    color: #00e5ff !important;
    text-shadow: 0 0 10px rgba(0, 229, 255, 0.8) !important;
}

/* 3. КАРТОЧКИ ТОВАРОВ */
div[class*="Product-module__wrapper"] {
    background: #0e1420 !important;
    border: 1px solid rgba(0, 229, 255, 0.2) !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.6) !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    overflow: hidden !important;
}

div[class*="Product-module__wrapper"]:hover {
    border-color: #00e5ff !important;
    transform: translateY(-5px) !important;
    box-shadow: 0 0 25px rgba(0, 229, 255, 0.35) !important;
}

/* Цена */
div[class*="Product-module__price"] {
    background: rgba(7, 10, 16, 0.9) !important;
    color: #ffd700 !important;
    font-weight: 800 !important;
    border-bottom-right-radius: 6px !important;
    border: 1px solid rgba(255, 215, 0, 0.3) !important;
    border-top: none !important;
    border-left: none !important;
}

/* Скидки */
div[class*="Product-module__discount"] {
    background: linear-gradient(135deg, #ff0055, #ff3366) !important;
    color: #ffffff !important;
    font-weight: 900 !important;
    border-bottom-left-radius: 6px !important;
    box-shadow: 0 0 15px rgba(255, 0, 85, 0.5) !important;
}

/* 4. КАТЕГОРИИ */
div[class*="Categories-module__category"] {
    background: #0e1420 !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 6px !important;
    font-weight: 700 !important;
    color: #8899aa !important;
    transition: all 0.2s ease !important;
}

div[class*="Categories-module__category"]:hover,
div[class*="Categories-module__category"][class*="active"] {
    background: #00e5ff !important;
    color: #000000 !important;
    border-color: #00e5ff !important;
    box-shadow: 0 0 20px rgba(0, 229, 255, 0.6) !important;
}

/* 5. КНОПКИ */
button[class*="Button-module__accent"], .Button-module__accent {
    background: linear-gradient(135deg, #00e5ff 0%, #0099cc 100%) !important;
    border: none !important;
    color: #000000 !important;
    font-weight: 800 !important;
    border-radius: 6px !important;
    box-shadow: 0 0 15px rgba(0, 229, 255, 0.4) !important;
    transition: all 0.2s ease !important;
}

button[class*="Button-module__accent"]:hover {
    box-shadow: 0 0 25px rgba(0, 229, 255, 0.8) !important;
    transform: scale(1.02) !important;
}

/* 6. МОДАЛЬНЫЕ ОКНА И МОНИТОРИНГ */
div[class*="boxHeader"] {
    background: #0e1420 !important;
    border-bottom: 2px solid #00e5ff !important;
    color: #00e5ff !important;
}
div[class*="boxBody"] { background: #080c14 !important; }
div[class*="MonitoringServer-module__progressBar"] {
    background: #00e5ff !important;
    box-shadow: 0 0 10px rgba(0, 229, 255, 0.5) !important;
}
div[class*="customModalContent"], div[class*="ModalLayout-module__modal"] {
    background: #0e1420 !important;
    border: 1px solid #00e5ff !important;
    box-shadow: 0 0 40px rgba(0, 229, 255, 0.3) !important;
}