/* Landing Page Color Palette - Ozzaka */
:root {
    /* Primary Colors */
    --primary: #1767CF;
    --primary-foreground: #FFFFFF;
    
    /* Secondary Colors */
    --secondary: #3763F4;
    --secondary-foreground: #0D1419;
    
    /* Accent Colors */
    --accent: #0C1622;
    --accent-foreground: #1767CF;
    
    /* Base Colors - Keep background as is */
    --background: #0a0a0a; /* Keep existing background */
    --foreground: #8796A2;
    
    /* Card Colors */
    --card-background: #17181C;
    --card-foreground: #B9B9B9;
    
    /* Popover Colors */
    --popover-background: #000000;
    --popover-foreground: #8796A2;
    
    /* Muted Colors */
    --muted: #181818;
    --muted-foreground: #727272;
    
    /* Destructive Colors */
    --destructive: #FF0000;
    --destructive-foreground: #000000;
    
    /* Chart Colors */
    --chart-1: #1767CF;
    --chart-2: #27C49F;
    --chart-3: #F2C94C;
    --chart-4: #2F80ED;
    --chart-5: #EB5757;
}

/* Override gradient backgrounds */
.gradient-bg-1 {
    background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%) !important;
}

.gradient-bg-2 {
    background: linear-gradient(135deg, var(--chart-5) 0%, var(--chart-3) 100%) !important;
}

.gradient-bg-3 {
    background: linear-gradient(135deg, var(--chart-4) 0%, var(--chart-2) 100%) !important;
}

/* Text gradients */
.text-gradient {
    background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

.text-gradient-gold {
    background: linear-gradient(135deg, var(--chart-3) 0%, var(--chart-2) 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* Button styles */
.btn-primary {
    background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%) !important;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.btn-primary:hover {
    background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 20px 40px rgba(23, 103, 207, 0.4) !important;
    filter: brightness(1.1);
}

/* Glass effects with new colors */
.glass-minimal {
    background: rgba(23, 24, 28, 0.5) !important;
    backdrop-filter: blur(20px) !important;
    border: 1px solid var(--sidebar-border) !important;
    border-radius: 24px !important;
}

/* Card styles */
.card-minimal {
    background: var(--card-background) !important;
    border: 1px solid var(--sidebar-border) !important;
    border-radius: 20px !important;
    backdrop-filter: blur(10px) !important;
    transition: all 0.4s ease !important;
}

.card-minimal:hover {
    background: var(--card-background) !important;
    border-color: var(--primary) !important;
    transform: translateY(-8px) !important;
    box-shadow: 0 20px 40px rgba(23, 103, 207, 0.2) !important;
}

/* Navigation */
.nav-minimal {
    background: rgba(0, 0, 0, 0.8) !important;
    backdrop-filter: blur(20px) !important;
    border-bottom: 1px solid var(--sidebar-border) !important;
}

/* Text colors */
.text-white { color: var(--primary-foreground) !important; }
.text-gray-100 { color: var(--card-foreground) !important; }
.text-gray-200 { color: var(--card-foreground) !important; opacity: 0.95; }
.text-gray-300 { color: var(--foreground) !important; }
.text-gray-400 { color: var(--muted-foreground) !important; }
.text-gray-500 { color: var(--muted-foreground) !important; opacity: 0.8; }
.text-gray-600 { color: var(--muted-foreground) !important; opacity: 0.6; }

/* Colored text - all blues and grays */
.text-blue-400 { color: var(--primary) !important; }
.text-blue-500 { color: var(--primary) !important; }
.text-blue-600 { color: var(--secondary) !important; }
.text-green-400 { color: var(--chart-2) !important; }
.text-green-500 { color: var(--chart-2) !important; }
.text-yellow-400 { color: var(--chart-3) !important; }
.text-yellow-500 { color: var(--chart-3) !important; }
.text-red-400 { color: var(--chart-5) !important; }
.text-red-500 { color: var(--destructive) !important; }
.text-purple-400 { color: var(--primary) !important; }
.text-purple-500 { color: var(--primary) !important; }
.text-pink-400 { color: var(--primary) !important; }
.text-pink-500 { color: var(--primary) !important; }
.text-orange-400 { color: var(--chart-3) !important; }

/* Background colors */
.bg-gray-800 { background-color: var(--card-background) !important; }
.bg-gray-900 { background-color: var(--background) !important; }
.bg-blue-500 { background-color: var(--primary) !important; }
.bg-blue-600 { background-color: var(--secondary) !important; }
.bg-green-500 { background-color: var(--chart-2) !important; }
.bg-yellow-500 { background-color: var(--chart-3) !important; }
.bg-red-500 { background-color: var(--destructive) !important; }
.bg-purple-500 { background-color: var(--primary) !important; }
.bg-purple-600 { background-color: var(--primary) !important; }
.bg-purple-700 { background-color: var(--secondary) !important; }
.bg-purple-800 { background-color: var(--secondary) !important; }
.bg-pink-500 { background-color: var(--primary) !important; }
.bg-pink-600 { background-color: var(--primary) !important; }
.bg-pink-700 { background-color: var(--secondary) !important; }

/* Purple/Pink borders */
.border-purple-500 { border-color: var(--primary) !important; }
.border-purple-600 { border-color: var(--primary) !important; }
.border-pink-500 { border-color: var(--primary) !important; }
.border-pink-600 { border-color: var(--primary) !important; }

/* Border colors */
.border-gray-700 { border-color: var(--sidebar-border) !important; }
.border-gray-600 { border-color: var(--sidebar-border) !important; }
.border-gray-800 { border-color: var(--card-background) !important; }
.border-blue-500 { border-color: var(--primary) !important; }
.border-green-500 { border-color: var(--chart-2) !important; }

/* Hover states */
.hover\:text-white:hover { color: var(--primary-foreground) !important; }
.hover\:text-blue-400:hover { color: var(--primary) !important; }
.hover\:text-gray-300:hover { color: var(--foreground) !important; }
.hover\:bg-gray-700:hover { background-color: var(--muted) !important; }
.hover\:bg-gray-800:hover { background-color: var(--card-background) !important; }
.hover\:border-blue-400:hover { border-color: var(--primary) !important; }

/* Scrollbar */
::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%) !important;
    border-radius: 4px !important;
}

/* Particles */
.particle {
    background: rgba(23, 103, 207, 0.3) !important;
}

/* Pricing card premium */
.pricing-card-premium {
    background: linear-gradient(135deg, rgba(23, 103, 207, 0.1) 0%, rgba(55, 99, 244, 0.1) 100%) !important;
}

.pricing-card-premium::before {
    background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%) !important;
}

/* Stats cards */
.stat-card {
    background: var(--card-background) !important;
    border: 1px solid var(--sidebar-border) !important;
}

/* Feature cards */
.feature-card {
    background: var(--card-background) !important;
    border: 1px solid var(--sidebar-border) !important;
}

/* Gradient overlays */
.gradient-overlay {
    background: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, 0.8) 100%) !important;
}

/* Icon backgrounds */
.icon-bg-blue { background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%) !important; }
.icon-bg-green { background: linear-gradient(135deg, var(--chart-2) 0%, #1a9f7a 100%) !important; }
.icon-bg-yellow { background: linear-gradient(135deg, var(--chart-3) 0%, #d4a017 100%) !important; }
.icon-bg-red { background: linear-gradient(135deg, var(--chart-5) 0%, var(--destructive) 100%) !important; }
.icon-bg-purple { background: linear-gradient(135deg, var(--chart-4) 0%, var(--secondary) 100%) !important; }

/* Badge colors */
.badge-new {
    background-color: var(--destructive) !important;
    color: var(--primary-foreground) !important;
}

/* Form elements */
input, textarea, select {
    background-color: var(--card-background) !important;
    border-color: var(--sidebar-border) !important;
    color: var(--card-foreground) !important;
}

input:focus, textarea:focus, select:focus {
    border-color: var(--primary) !important;
    outline-color: var(--primary) !important;
}

/* Mobile menu */
.mobile-menu {
    background-color: var(--card-background) !important;
    border-color: var(--sidebar-border) !important;
}

/* Footer */
footer {
    background-color: var(--card-background) !important;
    border-top-color: var(--sidebar-border) !important;
}

/* Animations with new colors */
@keyframes glow {
    0%, 100% {
        box-shadow: 0 0 20px rgba(23, 103, 207, 0.5);
    }
    50% {
        box-shadow: 0 0 40px rgba(23, 103, 207, 0.8), 0 0 60px rgba(55, 99, 244, 0.4);
    }
}

/* Chart colors for any charts on landing */
.chart-1 { color: var(--chart-1) !important; }
.chart-2 { color: var(--chart-2) !important; }
.chart-3 { color: var(--chart-3) !important; }
.chart-4 { color: var(--chart-4) !important; }
.chart-5 { color: var(--chart-5) !important; }

/* Keep the existing dark background */
body {
    background: #0a0a0a !important; /* Keep the existing background */
}

/* Download section specific styles */
.download-section {
    background: linear-gradient(135deg, #0C1622 0%, #17181C 100%) !important;
}

/* Remove purple and pink tones, use blue tones instead */
.from-blue-600.to-purple-600,
.from-purple-600.to-pink-600,
.from-blue-500.to-purple-600,
.from-purple-700.to-pink-700 {
    background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%) !important;
}

.from-blue-600\\/10.via-purple-600\\/10.to-pink-600\\/10 {
    background: linear-gradient(to right, rgba(23, 103, 207, 0.1), rgba(55, 99, 244, 0.1), rgba(47, 128, 237, 0.1)) !important;
}

.bg-purple-500\\/20 {
    background-color: rgba(23, 103, 207, 0.2) !important;
}

.bg-pink-600\\/10 {
    background-color: rgba(23, 103, 207, 0.1) !important;
}

/* Featured pack badge - make it blue */
.from-purple-600.to-pink-600 {
    background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%) !important;
}

/* Pricing buttons - Featured button */
a[href*="telegram"]:has(.fab.fa-telegram) {
    transition: all 0.3s ease !important;
}

/* Featured pack specific */
.pricing-card-premium .from-purple-600.to-pink-600 {
    background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%) !important;
}