/**
 * Theme: Whoop
 * Inspired by: Whoop, Apple Fitness+, Oura
 * Vibe: Minimal, sophisticated, premium data visualization
 */

[data-theme="whoop"] {
    /* Brand Colors - Teal/Mint focus */
    --theme-primary: #00d4aa;
    --theme-primary-light: #4eedc4;
    --theme-secondary: #00b4d8;
    --theme-accent: #7b61ff;
    --theme-gradient: linear-gradient(135deg, #00d4aa 0%, #00b4d8 50%, #7b61ff 100%);
    
    /* Backgrounds - Cleaner, more minimal */
    --theme-bg-dark: #0d0d0d;
    --theme-bg-medium: #1a1a1a;
    --theme-bg-glow-1: rgba(0, 212, 170, 0.08);
    --theme-bg-glow-2: rgba(0, 180, 216, 0.06);
    --theme-bg-glow-3: rgba(123, 97, 255, 0.04);
    
    /* Cards - Subtle, clean */
    --theme-card-bg: linear-gradient(135deg, rgba(26, 26, 26, 0.95) 0%, rgba(32, 32, 32, 0.95) 100%);
    --theme-card-border: rgba(0, 212, 170, 0.2);
    --theme-card-border-hover: rgba(0, 212, 170, 0.4);
    --theme-card-glow: rgba(0, 212, 170, 0.15);
    
    /* Buttons - Minimal, refined */
    --theme-btn-bg: linear-gradient(135deg, rgba(0, 212, 170, 0.1) 0%, rgba(0, 180, 216, 0.1) 100%);
    --theme-btn-border: rgba(0, 212, 170, 0.3);
    --theme-btn-hover-bg: linear-gradient(135deg, rgba(0, 212, 170, 0.25) 0%, rgba(0, 180, 216, 0.25) 100%);
    --theme-btn-glow: 0 4px 20px rgba(0, 212, 170, 0.2);
    --theme-btn-glow-hover: 0 8px 30px rgba(0, 212, 170, 0.35);
    
    /* Connected state */
    --theme-connected-bg: linear-gradient(135deg, rgba(0, 212, 170, 0.2) 0%, rgba(78, 237, 196, 0.2) 100%);
    --theme-connected-border: rgba(0, 212, 170, 0.5);
    --theme-connected-glow: 0 4px 25px rgba(0, 212, 170, 0.3);
    
    /* Text */
    --theme-text-accent: #00d4aa;
    --theme-text-secondary-accent: #00b4d8;
    
    /* Shadows - Softer */
    --theme-shadow-glow: 0 0 40px rgba(0, 212, 170, 0.3);
    --theme-shadow-card: 0 8px 40px rgba(0, 0, 0, 0.5);
    
    /* Progress bar */
    --theme-progress-bg: linear-gradient(90deg, #00d4aa 0%, #00b4d8 50%, #7b61ff 100%);
    --theme-progress-glow: 0 0 20px rgba(0, 212, 170, 0.6);
    
    /* Zone colors - More refined palette */
    --color-zone-1: #90e0ef;
    --color-zone-2: #00d4aa;
    --color-zone-3: #ffd60a;
    --color-zone-4: #ff9f1c;
    --color-zone-5: #ef476f;
}

/* Whoop-specific overrides */
[data-theme="whoop"] .header__title {
    background: linear-gradient(135deg, #00d4aa 0%, #00b4d8 100%);
    -webkit-background-clip: text;
    background-clip: text;
    letter-spacing: 4px;
    font-weight: 700;
}

[data-theme="whoop"] .metric-card {
    border-radius: 16px;
    border-width: 1px;
}

[data-theme="whoop"] .workout-section {
    border-radius: 16px;
    border-width: 1px;
}

[data-theme="whoop"] .btn {
    border-radius: 8px;
    font-weight: 600;
    letter-spacing: 0.5px;
    border-width: 1px;
}

[data-theme="whoop"] .phase-timer {
    background: linear-gradient(135deg, #00d4aa 0%, #00b4d8 100%);
    -webkit-background-clip: text;
    background-clip: text;
}

[data-theme="whoop"] .zone-box {
    border-radius: 8px;
}

/* Subtle grid pattern */
[data-theme="whoop"] body::before {
    background-image: 
        repeating-linear-gradient(0deg, rgba(0, 212, 170, 0.02) 0px, transparent 1px, transparent 40px),
        repeating-linear-gradient(90deg, rgba(0, 212, 170, 0.02) 0px, transparent 1px, transparent 40px);
}