/* design-tokens.css — single source of truth for the Bold Brand design system */
:root {
  /* Brand colours */
  --color-primary:        #0f172a;
  --color-primary-mid:    #1e293b;
  --color-primary-light:  #334155;
  --color-accent:         #cca43b;
  --color-accent-light:   #e8c56a;
  --color-accent-dark:    #b8922e;

  /* Canvas */
  --color-canvas:         #f5f4f2;
  --color-surface:        #ffffff;
  --color-border:         #e8e4de;
  --color-border-light:   #f1ede8;

  /* Semantic */
  --color-success:        #10b981;
  --color-success-light:  #dcfce7;
  --color-warning:        #f59e0b;
  --color-warning-light:  #fef3c7;
  --color-danger:         #ef4444;
  --color-danger-light:   #fee2e2;

  /* Text */
  --text-main:            #0f172a;
  --text-sub:             #64748b;
  --text-muted:           #94a3b8;
  --text-placeholder:     #cbd5e1;

  /* Sidebar */
  --sidebar-width:        220px;
  --sidebar-collapsed:    56px;
  --sidebar-bg:           linear-gradient(170deg, #0d1526 0%, #111e35 100%);
  --sidebar-border:       rgba(204, 164, 59, 0.12);

  /* Typography */
  --font-sans:            'Inter', system-ui, sans-serif;
  --font-serif:           'Playfair Display', Georgia, serif;

  /* Spacing */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;

  /* Radius */
  --radius-sm:  6px;
  --radius-md:  8px;
  --radius-lg:  12px;
  --radius-xl:  16px;
  --radius-pill: 50px;

  /* Shadows */
  --shadow-xs:   0 1px 2px rgba(0,0,0,0.04);
  --shadow-sm:   0 1px 3px rgba(0,0,0,0.04), 0 1px 2px rgba(0,0,0,0.04);
  --shadow-md:   0 4px 12px rgba(0,0,0,0.08);
  --shadow-lg:   0 8px 24px rgba(0,0,0,0.10);
  --shadow-gold: 0 2px 8px rgba(204,164,59,0.30);
  --shadow-topbar: 0 1px 0 rgba(0,0,0,0.04);
  --shadow-modal:  0 20px 60px rgba(0,0,0,0.15);
}