/**
 * Meetgle Theme: Chatzly
 * Fresh teal/mint with deep navy-black base
 */

:root {
    /* Primary button colors */
    --theme-button-primary: #00D4AA;
    --theme-button-primary-hover: #1CE0B8;
    --theme-button-primary-active: #00B892;

    /* Primary gradient (used for buttons and small elements) */
    --theme-gradient-primary: linear-gradient(135deg, #00D4AA 0%, #0891B2 100%);

    /* Glow animation colors (for profile pill) */
    --theme-glow-color-1: rgba(0, 212, 170, 0.8);
    --theme-glow-color-1-transparent: rgba(0, 212, 170, 0);
    --theme-glow-color-2: rgba(8, 145, 178, 0.8);
    --theme-glow-color-2-transparent: rgba(8, 145, 178, 0);

    /* Gradient definitions */
    --theme-gradient-pink: linear-gradient(135deg, #1CE0B8 0%, #00D4AA 100%);
    --theme-gradient-pink-hover: linear-gradient(135deg, #40E8C8 0%, #1CE0B8 100%);
    --theme-gradient-pink-active: linear-gradient(135deg, #00D4AA 0%, #00B892 100%);

    --theme-gradient-purple: linear-gradient(135deg, #0891B2 0%, #066E8A 100%);
    --theme-gradient-purple-hover: linear-gradient(135deg, #0AA8CC 0%, #0891B2 100%);
    --theme-gradient-purple-active: linear-gradient(135deg, #0780A0 0%, #055E78 100%);

    /* Background gradients */
    --theme-gradient-dark: linear-gradient(135deg, #1A1A2E 0%, #16213E 100%);
    --theme-gradient-dark-alt: linear-gradient(135deg, #0F0F1A 0%, #1A1A2E 100%);

    /* Radial gradient overlays (for sparkle container) */
    --theme-radial-overlay-1: radial-gradient(circle at 30% 40%, rgba(0, 212, 170, 0.15) 0%, transparent 50%);
    --theme-radial-overlay-2: radial-gradient(circle at 70% 60%, rgba(8, 145, 178, 0.12) 0%, transparent 50%);

    /* Text gradient (for count number) */
    --theme-text-gradient: linear-gradient(135deg, #00D4AA, #0891B2);

    /* Modal/Leaderboard gradient */
    --theme-modal-gradient: linear-gradient(135deg, #1CE0B8 0%, #0891B2 100%);

    /* Modal header gradient (3-color gradient for notifications, transactions, etc) */
    --theme-modal-header-gradient: linear-gradient(135deg, #00D4AA 0%, #06A4B5 50%, #0891B2 100%);

    /* Store modal background (chatzly gradient) */
    --theme-store-modal-bg: linear-gradient(135deg, #00D4AA 0%, #0891B2 100%);

    /* Store price badge gradient */
    --theme-store-price-gradient: linear-gradient(135deg, #00D4AA 0%, #1CE0B8 100%);

    /* Modal shadow color */
    --theme-modal-shadow: rgba(0, 212, 170, 0.5);
}
