/* ========================================
   ELEXBET GOLD & BLACK THEME 
   Modern • Elegant • Premium
   ======================================== */

:root {
    /* Primary Colors - ELEXBET Gold & Black Theme */
    --primary-gold: #FFD700;
    --primary-yellow: #FFC107;
    --accent-dark-gold: #B8860B;
    --accent-bright-gold: #FFEB3B;
    
    /* Background Colors - Deep Black */
    --bg-primary: #000000 !important;
    --bg-secondary: #1a1a1a !important;
    --bg-tertiary: #2d2d2d !important;
    --bg-card: rgba(26, 26, 26, 0.8) !important;
    
    /* Glass Effects */
    --glass-bg: rgba(45, 45, 45, 0.5) !important;
    --glass-border: rgba(255, 215, 0, 0.15) !important;
    --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.7) !important;
    
    /* Text Colors */
    --text-primary: #ffffff !important;
    --text-secondary: #e0e0e0 !important;
    --text-muted: #999999 !important;
    --text-gold: #FFD700 !important;
    
    /* Status Colors */
    --success: #4CAF50 !important;
    --warning: #FFC107 !important;
    --danger: #f44336 !important;
    
    /* Gradients - Gold & Black Theme */
    --gradient-primary: linear-gradient(135deg, #FFD700 0%, #FFC107 100%) !important;
    --gradient-gold: linear-gradient(135deg, #FFD700 0%, #B8860B 100%) !important;
    --gradient-dark-gold: linear-gradient(135deg, #FFC107 0%, #FF6F00 100%) !important;
    --gradient-black-gold: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%) !important;
    --gradient-gold-shine: linear-gradient(90deg, #FFD700, #FFC107, #FFEB3B, #FFC107, #FFD700) !important;
    
    /* Shadows */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.5) !important;
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.6) !important;
    --shadow-glow-gold: 0 0 30px rgba(255, 215, 0, 0.4) !important;
    --shadow-glow-yellow: 0 0 30px rgba(255, 193, 7, 0.3) !important;
}

/* Background Override - Pure Black */
body {
    background: #000000 !important;
    color: #ffffff !important;
}

body::before {
    background: 
        radial-gradient(circle at 20% 30%, rgba(255, 215, 0, 0.08) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(255, 193, 7, 0.08) 0%, transparent 50%),
        radial-gradient(circle at 50% 50%, rgba(184, 134, 11, 0.05) 0%, transparent 50%) !important;
}

/* Navbar - Black with Gold Accents */
.navbar {
    background: rgba(0, 0, 0, 0.95) !important;
    border-bottom: 1px solid rgba(255, 215, 0, 0.2) !important;
}

.navbar.scrolled {
    background: rgba(0, 0, 0, 0.98) !important;
    box-shadow: 0 10px 40px rgba(255, 215, 0, 0.15) !important;
}

/* Logo Glow Effect */
.logo-img {
    filter: drop-shadow(0 0 15px rgba(255, 215, 0, 0.6)) !important;
}

.brand-text {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #FFEB3B 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* Nav Links - Gold Hover */
.nav-link {
    color: #e0e0e0 !important;
}

.nav-link:hover,
.nav-link.active {
    color: #FFD700 !important;
    background: rgba(255, 215, 0, 0.1) !important;
}

.nav-link::before {
    background: linear-gradient(90deg, transparent, rgba(255, 215, 0, 0.3), transparent) !important;
}

/* Buttons - Gold Theme */
.btn-primary,
.btn-gold {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 100%) !important;
    color: #000000 !important;
    border: none !important;
    box-shadow: 0 4px 15px rgba(255, 215, 0, 0.3) !important;
}

.btn-primary:hover,
.btn-gold:hover {
    background: linear-gradient(135deg, #FFEB3B 0%, #FFD700 100%) !important;
    box-shadow: 0 6px 20px rgba(255, 215, 0, 0.5) !important;
    transform: translateY(-2px) !important;
}

/* Cards - Black with Gold Borders */
.glass-card,
.game-card,
.promo-card {
    background: rgba(26, 26, 26, 0.85) !important;
    border: 1px solid rgba(255, 215, 0, 0.2) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.6) !important;
}

.glass-card:hover,
.game-card:hover {
    border-color: rgba(255, 215, 0, 0.4) !important;
    box-shadow: 0 12px 40px rgba(255, 215, 0, 0.2) !important;
}

/* Section Headers - Gold Text */
.section-title,
.section-header-center .section-title {
    color: #FFD700 !important;
}

.section-subtitle {
    color: #e0e0e0 !important;
}

/* Form Inputs - Dark with Gold Focus */
input,
textarea,
select {
    background: rgba(26, 26, 26, 0.8) !important;
    border: 1px solid rgba(255, 215, 0, 0.2) !important;
    color: #ffffff !important;
}

input:focus,
textarea:focus,
select:focus {
    border-color: #FFD700 !important;
    box-shadow: 0 0 15px rgba(255, 215, 0, 0.3) !important;
}

/* Footer - Black Background */
footer {
    background: #000000 !important;
    border-top: 1px solid rgba(255, 215, 0, 0.2) !important;
}

/* Slider/Hero Section - Gold Accents */
.hero-section,
.slider-section {
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.9) 0%, rgba(26, 26, 26, 0.9) 100%) !important;
}

/* Game Categories - Gold Highlights */
.category-tab.active {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 100%) !important;
    color: #000000 !important;
}

.category-tab:hover {
    background: rgba(255, 215, 0, 0.1) !important;
    color: #FFD700 !important;
}

/* Badges & Tags - Gold */
.badge-vip,
.badge-new,
.badge-hot {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 100%) !important;
    color: #000000 !important;
}

/* Animations - Gold Glow */
@keyframes goldGlow {
    0%, 100% {
        box-shadow: 0 0 20px rgba(255, 215, 0, 0.4);
    }
    50% {
        box-shadow: 0 0 30px rgba(255, 215, 0, 0.6);
    }
}

.glow-gold {
    animation: goldGlow 2s ease-in-out infinite;
}

/* Scrollbar - Gold Theme */
::-webkit-scrollbar {
    width: 10px;
    background: #000000;
}

::-webkit-scrollbar-track {
    background: #1a1a1a;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 100%);
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(135deg, #FFEB3B 0%, #FFD700 100%);
}