/* ================================================================
   TrungNguyen Theme - CSS Custom Properties
   Dark theme with warm gold (#d4a04a) and crimson (#c0392b) accents
   Landing page layout (inspired by Silkroad VOZ)
   ================================================================ */

:root {
    /* === Background Colors === */
    --color-bg-primary: #0a0e1a;
    --color-bg-secondary: #111827;
    --color-bg-tertiary: #1a2236;
    --color-bg-card: #131a2e;
    --color-bg-card-hover: #1c2540;
    --color-bg-surface: #0d1220;
    --color-bg-overlay: rgba(10, 14, 26, 0.92);
    --color-bg-navbar: rgba(10, 14, 26, 0.96);

    /* === Gold Accent (warm, martial arts feel) === */
    --color-gold-primary: #d4a04a;
    --color-gold-bright: #e8b95a;
    --color-gold-light: #f0d08a;
    --color-gold-dark: #b8862e;
    --color-gold-muted: #7a6025;
    --color-text-gold: #d4a04a;
    --color-text-link: #d4a04a;
    --color-text-link-hover: #e8b95a;

    /* === Crimson Accent === */
    --color-crimson: #c0392b;
    --color-crimson-bright: #e74c3c;
    --color-crimson-dim: rgba(192, 57, 43, 0.3);
    --color-crimson-dark: #922b21;

    /* === Text Colors === */
    --color-text-primary: #e8e6e3;
    --color-text-secondary: #9a9a9a;
    --color-text-muted: #666666;
    --color-text-heading: #d4a04a;

    /* === Status Colors === */
    --color-status-online: #2ecc71;
    --color-status-offline: #e74c3c;
    --color-red: #ff4757;
    --color-green: #2ecc71;

    /* === Rate Colors === */
    --color-rate-high: #2ecc71;
    --color-rate-medium: #f39c12;
    --color-rate-low: #e74c3c;

    /* === Borders === */
    --border-gold: 1px solid rgba(212, 160, 74, 0.3);
    --border-gold-bright: 1px solid var(--color-gold-primary);
    --border-subtle: 1px solid rgba(255, 255, 255, 0.06);
    --color-border: rgba(255, 255, 255, 0.08);

    /* === Shadows === */
    --shadow-card: 0 4px 12px rgba(0, 0, 0, 0.4);
    --shadow-glow-gold: 0 0 20px rgba(212, 160, 74, 0.2);
    --shadow-glow-gold-strong: 0 0 30px rgba(212, 160, 74, 0.4);
    --shadow-glow-crimson: 0 0 15px rgba(192, 57, 43, 0.2);

    /* === 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;

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

    /* === Accent aliases (for reuse in News pages etc.) === */
    --color-accent-gold: #d4a04a;
    --color-accent-cyan: #c0392b;
}