/*
 * ══════════════════════════════════════════════════════
 *  HeroFit — Theme Variables
 *  Single source of truth. Edit ONLY this file to
 *  retheme the entire application.
 *  Loaded in every layout before all other CSS.
 * ══════════════════════════════════════════════════════
 */

:root {
  /* ── Brand Colors ─────────────────────────────────── */
  --brand-primary:       #e53935;       /* main accent (buttons, links, active nav) */
  --brand-primary-dark:  #c62828;       /* hover/pressed state */
  --brand-primary-light: #ef5350;       /* lighter variant, used in gradients */
  --brand-primary-rgb:   229, 57, 53;   /* raw RGB for rgba() usage */
  --brand-primary-tint:  #fecaca;       /* very light tint for borders/dividers */

  /* ── Sidebar Gradient ─────────────────────────────── */
  --sidebar-top:    #1a1a2e;
  --sidebar-mid:    #16213e;
  --sidebar-bottom: #0f3460;

  /* ── Typography ───────────────────────────────────── */
  --font-body: 'Inter', sans-serif;

  /* ── Text ─────────────────────────────────────────── */
  --text-dark:   #111827;
  --text-medium: #374151;
  --text-muted:  #6b7280;

  /* ── Borders ──────────────────────────────────────── */
  --border-default: #e5e7eb;
  --border-light:   #f0f0f0;
  --border-subtle:  #f3f4f6;

  /* ── Backgrounds ──────────────────────────────────── */
  --bg-page:   #f4f6f9;
  --bg-card:   #ffffff;
  --bg-input:  #f9fafb;
  --bg-section:#f3f4f6;
}