/* ================================================================
   VoSong Theme - CSS Custom Properties Override
   Inspired by sromobile.com — Dark fantasy, navy + amber gold + blue
   ================================================================ */

:root {
    /* === Background Colors === */
    --color-bg-primary: #0a0b1a;
    --color-bg-secondary: #0f1129;
    --color-bg-tertiary: #161938;
    --color-bg-card: #111430;
    --color-bg-card-hover: #1a1d45;
    --color-bg-surface: #0c0d1f;
    --color-bg-overlay: rgba(10, 11, 26, 0.92);
    --color-bg-navbar: rgba(10, 11, 26, 0.96);

    /* === Gold Accent (warm amber) === */
    --color-gold-primary: #d4a24c;
    --color-gold-bright: #e8b95a;
    --color-gold-light: #f0d08a;
    --color-gold-dark: #b8862e;
    --color-gold-muted: #8a6a20;
    --color-text-gold: #d4a24c;
    --color-text-link: #d4a24c;
    --color-text-link-hover: #e8b95a;

    /* === Blue Accent === */
    --color-blue: #3b82f6;
    --color-blue-light: #60a5fa;
    --color-blue-dim: rgba(59, 130, 246, 0.3);
    --color-blue-dark: #2563eb;

    /* === Text Colors === */
    --color-text-primary: #eaeaea;
    --color-text-secondary: #8b8fa3;
    --color-text-muted: #5a5e73;
    --color-text-heading: #d4a24c;

    /* === Status Colors === */
    --color-status-online: #22c55e;
    --color-status-offline: #ef4444;
    --color-red: #ef4444;
    --color-green: #22c55e;

    /* === Rate Colors === */
    --color-rate-high: #22c55e;
    --color-rate-medium: #f59e0b;
    --color-rate-low: #ef4444;

    /* === Borders === */
    --border-gold: 1px solid rgba(212, 162, 76, 0.25);
    --border-gold-bright: 1px solid var(--color-gold-primary);
    --border-blue: 1px solid rgba(59, 130, 246, 0.3);
    --border-subtle: 1px solid rgba(255, 255, 255, 0.06);

    /* === Shadows === */
    --shadow-card: 0 4px 16px rgba(0, 0, 0, 0.5);
    --shadow-glow-gold: 0 0 20px rgba(212, 162, 76, 0.15);
    --shadow-glow-gold-strong: 0 0 30px rgba(212, 162, 76, 0.35);
    --shadow-glow-blue: 0 0 20px rgba(59, 130, 246, 0.2);
    --shadow-glow-blue-strong: 0 0 30px rgba(59, 130, 246, 0.4);

    /* === Typography === */
    --font-body: 'Noto Sans', sans-serif;
    --font-heading: 'Noto Sans', sans-serif;

    /* === Spacing === */
    --space-xs: 0.25rem;
    --space-sm: 0.5rem;
    --space-md: 1rem;
    --space-lg: 1.5rem;
    --space-xl: 2rem;
    --space-2xl: 3rem;
    --space-3xl: 4rem;

    /* === Border Radius === */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;

    /* === Transitions === */
    --transition-fast: 0.15s ease;
    --transition-base: 0.3s ease;
    --transition-slow: 0.5s ease;
}
