/* =====================================================
   Velvet Salon Management System — Design Tokens
   ===================================================== */

:root {
  /* Primary */
  --primary:        #6B4C8A;
  --primary-hover:  #5A3D76;
  --primary-light:  #E8DFF0;
  --primary-rgb:    107, 76, 138;

  /* Secondary (Gold) */
  --secondary:      #C9A96E;
  --secondary-hover:#B8944F;
  --secondary-light:#F5EEE0;

  /* Neutrals */
  --bg:             #FAF7F5;
  --surface:        #FFFFFF;
  --surface-hover:  #F5F2F0;
  --border:         #E8E4E1;
  --border-light:   #F0EDEB;

  /* Text */
  --text:           #2D2A32;
  --text-secondary: #6B6773;
  --text-muted:     #8C8893;
  --text-light:     #B5B0BC;
  --text-inverse:   #FFFFFF;

  /* Status */
  --success:        #4CAF7D;
  --success-light:  #E8F5EE;
  --warning:        #E5A84B;
  --warning-light:  #FFF4E0;
  --danger:         #D94F4F;
  --danger-light:   #FDECEC;
  --info:           #5B9BD5;
  --info-light:     #EBF3FA;

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

  /* Radius */
  --radius-sm:  6px;
  --radius-md:  10px;
  --radius-lg:  16px;
  --radius-xl:  20px;
  --radius-full:9999px;

  /* Shadows */
  --shadow-sm:  0 1px 3px rgba(0,0,0,0.06);
  --shadow-md:  0 4px 12px rgba(0,0,0,0.08);
  --shadow-lg:  0 8px 30px rgba(0,0,0,0.10);
  --shadow-xl:  0 16px 50px rgba(0,0,0,0.12);

  /* Sidebar */
  --sidebar-width:     260px;
  --sidebar-collapsed:  70px;
  --sidebar-bg:        #2D2A32;
  --sidebar-text:      #B5B0BC;
  --sidebar-active:    #6B4C8A;
  --sidebar-hover-bg:  rgba(107, 76, 138, 0.15);

  /* Header */
  --header-height: 64px;

  /* Fonts */
  --font-heading: 'Playfair Display', 'Georgia', serif;
  --font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-arabic:  'Cairo', 'Tahoma', sans-serif;
  --font-mono:    'JetBrains Mono', 'Fira Code', monospace;

  /* Transitions */
  --transition-fast: 150ms ease;
  --transition:      250ms ease;
  --transition-slow: 400ms ease;
}

/* Dark mode support (future) */
[data-theme="dark"] {
  --bg:           #1A1A2E;
  --surface:      #232340;
  --surface-hover:#2A2A48;
  --border:       #3A3A55;
  --text:         #E8E4E1;
  --text-secondary:#A0A0B0;
}