/*
 * MaiMusic Player - Design Tokens
 * Extends mai-variables.css with player-specific tokens
 */

:root {
    /* Player layout */
    --player-nav-height: 56px;
    --player-bar-height: 80px;
    --player-sidebar-width: 240px;

    /* Player colors - inherits from mai palette */
    --player-bg: #0a0a0a;
    --player-surface: #111111;
    --player-surface-hover: #1a1a1a;
    --player-surface-active: #222222;
    --player-border: rgba(255, 255, 255, 0.08);
    --player-border-strong: rgba(255, 255, 255, 0.15);

    --player-text: #e0e0e0;
    --player-text-secondary: #888888;
    --player-text-muted: #555555;

    --player-accent: var(--flavor-primary, #00ff88);
    --player-accent-hover: var(--flavor-secondary, #00d4ff);
    --player-accent-rgb: 0, 255, 136;

    /* Now playing bar accent - set dynamically per track */
    --np-accent: var(--player-accent);

    /* Player-specific spacing */
    --player-gap: 16px;
    --player-gap-sm: 8px;
    --player-gap-xs: 4px;
    --player-gap-lg: 24px;
    --player-gap-xl: 32px;

    /* Player radius */
    --player-radius: 8px;
    --player-radius-sm: 4px;
    --player-radius-lg: 12px;
    --player-radius-xl: 16px;
    --player-radius-full: 9999px;

    /* Player transitions */
    --player-transition: 200ms ease;
    --player-transition-slow: 400ms ease;

    /* Player typography */
    --player-font: var(--mai-font-body, 'Inter', sans-serif);
    --player-font-display: var(--mai-font-display, 'Space Grotesk', sans-serif);
    --player-font-mono: var(--mai-font-mono, 'JetBrains Mono', monospace);

    /* Player shadows */
    --player-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    --player-shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.5);
    --player-shadow-glow: 0 0 20px rgba(var(--player-accent-rgb), 0.15);

    /* Player z-index */
    --player-z-content: 1;
    --player-z-sticky: 10;
    --player-z-nav: 100;
    --player-z-bar: 100;
    --player-z-dropdown: 200;
    --player-z-modal: 300;
    --player-z-toast: 400;
    --player-z-menu: 500;
}