/* Kobe Pools Custom Theme */
:root {
    /* Primary Colors based on Color Scheme */
    --primary-royal-violet: #7C3AED; /* Royal Violet */
    --secondary-bright-azure: #3B82F6; /* Bright Azure */
    --accent-gold-orange: #FFB800; /* Gold-orange */
    --base-dark: #0C101C; /* Base Dark */
    --text-light: #F9FAFB; /* Text/Light */
    
    /* Extended Palette */
    --royal-violet-dark: #5B21B6;
    --bright-azure-dark: #1E40AF;
    --gold-orange-dark: #D97706;
    --base-darker: #030712;
    --text-muted: #9CA3AF;
}

/* Background Themes */
.kobe-gradient-primary {
    background: linear-gradient(135deg, var(--primary-royal-violet) 0%, var(--secondary-bright-azure) 50%, var(--accent-gold-orange) 100%);
}

.kobe-gradient-dark {
    background: linear-gradient(145deg, var(--base-dark), #1F2937);
}

.kobe-card-gradient {
    background: linear-gradient(145deg, var(--base-dark), var(--base-darker));
}

/* Component Styles */
.kobe-nav {
    background: linear-gradient(135deg, var(--primary-royal-violet) 0%, var(--secondary-bright-azure) 50%, var(--accent-gold-orange) 100%);
}

.kobe-card {
    background: linear-gradient(145deg, var(--base-dark), #1F2937);
    border: 1px solid rgba(124, 58, 237, 0.2);
}

.kobe-button-primary {
    background: linear-gradient(135deg, var(--primary-royal-violet), var(--secondary-bright-azure));
    color: var(--text-light);
    transition: all 0.3s ease;
}

.kobe-button-primary:hover {
    background: linear-gradient(135deg, var(--royal-violet-dark), var(--bright-azure-dark));
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(124, 58, 237, 0.3);
}

.kobe-button-secondary {
    background: linear-gradient(135deg, var(--secondary-bright-azure), var(--accent-gold-orange));
    color: var(--text-light);
    transition: all 0.3s ease;
}

.kobe-button-secondary:hover {
    background: linear-gradient(135deg, var(--bright-azure-dark), var(--gold-orange-dark));
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(59, 130, 246, 0.3);
}

.kobe-text-primary {
    color: var(--primary-royal-violet);
}

.kobe-text-secondary {
    color: var(--secondary-bright-azure);
}

.kobe-text-accent {
    color: var(--accent-gold-orange);
}

.kobe-text-light {
    color: var(--text-light);
}

.kobe-text-muted {
    color: var(--text-muted);
}

/* Prize Ball Styles */
.kobe-first-prize {
    background: linear-gradient(145deg, var(--accent-gold-orange), var(--gold-orange-dark));
    box-shadow: 0 4px 15px rgba(255, 184, 0, 0.4);
}

.kobe-second-prize {
    background: linear-gradient(145deg, var(--secondary-bright-azure), var(--bright-azure-dark));
    box-shadow: 0 4px 15px rgba(59, 130, 246, 0.4);
}

.kobe-third-prize {
    background: linear-gradient(145deg, #FB923C, #EA580C);
    box-shadow: 0 4px 15px rgba(251, 146, 60, 0.4);
}

/* Logo Styles */
.kobe-logo {
    height: 40px;
    width: auto;
    filter: brightness(1.1);
    transition: all 0.3s ease;
}

.kobe-logo:hover {
    filter: brightness(1.3) drop-shadow(0 0 10px rgba(255, 255, 255, 0.3));
}

/* Responsive Logo */
@media (max-width: 768px) {
    .kobe-logo {
        height: 32px;
    }
}

/* Animation Effects */
.kobe-glow {
    box-shadow: 0 0 20px rgba(124, 58, 237, 0.5);
}

.kobe-hover-glow:hover {
    box-shadow: 0 0 30px rgba(124, 58, 237, 0.8);
    transform: scale(1.02);
}

/* Dark Theme Adjustments */
@media (prefers-color-scheme: dark) {
    body {
        background-color: var(--base-dark);
        color: var(--text-light);
    }
}