/* CSS Variables for Solana Mobile inspired theme */
:root {
    /* Primary Colors - Dark Theme */
    --primary-dark: #0a0a0a;
    --primary-darker: #000000;
    --primary-light: #1a1a1a;
    --primary-lighter: #2a2a2a;
    
    /* Secondary Colors - Neon Accents */
    --secondary-neon: #00ff88;
    --secondary-purple: #9945ff;
    --secondary-blue: #14f195;
    --secondary-pink: #ff6b6b;
    --secondary-orange: #ff8c42;
    
    /* Text Colors */
    --text-primary: #ffffff;
    --text-secondary: #a0a0a0;
    --text-muted: #666666;
    --text-neon: #00ff88;
    
    /* Background Gradients */
    --bg-hero: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 50%, #2a2a2a 100%);
    --bg-section: linear-gradient(135deg, #1a1a1a 0%, #2a2a2a 100%);
    --bg-card: linear-gradient(135deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.02) 100%);
    --bg-glass: rgba(255, 255, 255, 0.1);
    
    /* Card Backgrounds */
    --card-bg: linear-gradient(135deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.02) 100%);
    --card-bg-hover: linear-gradient(135deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.04) 100%);
    
    /* Button Gradients */
    --btn-primary: linear-gradient(135deg, #00ff88 0%, #14f195 100%);
    --btn-secondary: linear-gradient(135deg, #9945ff 0%, #ff6b6b 100%);
    --btn-glow: 0 0 20px rgba(0, 255, 136, 0.3);
    
    /* Border Colors */
    --border-light: rgba(255, 255, 255, 0.1);
    --border-neon: rgba(0, 255, 136, 0.3);
    --border-purple: rgba(153, 69, 255, 0.3);
    
    /* Shadow Colors */
    --shadow-dark: rgba(0, 0, 0, 0.5);
    --shadow-neon: rgba(0, 255, 136, 0.2);
    --shadow-purple: rgba(153, 69, 255, 0.2);
    
    /* Success Colors */
    --success-light: #00ff88;
    --success-dark: #14f195;
    
    /* Animation Durations */
    --transition-fast: 0.3s;
    --transition-medium: 0.4s;
    --transition-slow: 0.6s;
    
    /* Border Radius */
    --radius-small: 8px;
    --radius-medium: 12px;
    --radius-large: 16px;
    --radius-xl: 24px;
    --radius-full: 50px;
}

/* Alternative Color Schemes - Uncomment to use */

/* Blue Theme */
/*
:root {
    --secondary-neon: #14f195;
    --secondary-purple: #00d4ff;
    --secondary-blue: #0099ff;
    --secondary-pink: #ff6b6b;
    --secondary-orange: #ff8c42;
}
*/

/* Purple Theme */
/*
:root {
    --secondary-neon: #9945ff;
    --secondary-purple: #ff6b6b;
    --secondary-blue: #00ff88;
    --secondary-pink: #ff8c42;
    --secondary-orange: #14f195;
}
*/

/* Usage Examples:
   background: var(--bg-hero);
   color: var(--text-primary);
   border: 1px solid var(--border-light);
   box-shadow: 0 4px 20px var(--shadow-dark);
   transition: all var(--transition-fast) ease;
   border-radius: var(--radius-medium);
*/ 