/**
 * MEETANYWHERE.CA - Color Palette
 * Extracted from logo (Gold → Orange → Pink gradient)
 */

:root {
    /* Logo Colors - Gradient signature */
    --gold: #FFD700;
    --gold-light: #FDB827;
    --orange: #FF8C42;
    --orange-bright: #FF6B35;
    --pink: #FF1493;
    --magenta: #C71585;
    --rose: #E91E63;

    /* Gradient principale (signature du logo) */
    --gradient-primary: linear-gradient(135deg, #FFD700 0%, #FF8C42 50%, #FF1493 100%);
    --gradient-gold-pink: linear-gradient(135deg, #FDB827, #FF6B35, #E91E63);
    --gradient-glow: linear-gradient(135deg, #FFD700, #FF1493);

    /* Background colors */
    --bg-black: #000000;
    --bg-dark: #0a0a0f;
    --bg-darker: #05050a;
    --bg-card: rgba(20, 20, 30, 0.85);
    --bg-glass: rgba(255, 215, 0, 0.05);

    /* Glass effects */
    --glass-border: rgba(255, 215, 0, 0.15);
    --glass-hover: rgba(255, 140, 66, 0.1);
    --glass-active: rgba(255, 20, 147, 0.15);

    /* Text colors */
    --text-light: #ffffff;
    --text-primary: #f5f5f5;
    --text-secondary: #cccccc;
    --text-muted: #888888;
    --text-gold: #FFD700;

    /* Semantic colors */
    --success: #22c55e;
    --warning: #f59e0b;
    --error: #ef4444;
    --info: #3b82f6;

    /* Shadows & Glows */
    --shadow-gold: 0 0 30px rgba(255, 215, 0, 0.3);
    --shadow-pink: 0 0 30px rgba(255, 20, 147, 0.3);
    --shadow-glow: 0 0 60px rgba(255, 140, 66, 0.5);
    --shadow-card: 0 10px 50px rgba(0, 0, 0, 0.5);

    /* Button states */
    --btn-primary-bg: var(--gradient-primary);
    --btn-primary-hover: var(--gradient-gold-pink);
    --btn-secondary-bg: rgba(255, 215, 0, 0.1);
    --btn-secondary-border: var(--gold);
}

/* Dark theme (default) */
body {
    background: var(--bg-dark);
    color: var(--text-primary);
}

/* Utility classes */
.gradient-text {
    background: var(--gradient-primary);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.gradient-bg {
    background: var(--gradient-primary);
}

.glow-gold {
    box-shadow: var(--shadow-gold);
}

.glow-pink {
    box-shadow: var(--shadow-pink);
}

.glass-card {
    background: var(--bg-card);
    backdrop-filter: blur(20px);
    border: 1px solid var(--glass-border);
    box-shadow: var(--shadow-card);
}

/* Animations */
@keyframes gradient-shift {
    0%, 100% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
}

.animated-gradient {
    background: var(--gradient-primary);
    background-size: 200% 200%;
    animation: gradient-shift 8s ease infinite;
}