/* DGbot design tokens — shared across all billing pages */

:root {
  /* Surfaces — dark-first */
  --bg:          #08080c;
  --bg-elev:     #0f0f16;
  --bg-elev-2:   #141420;
  --surface:     #1b1b2a;
  --surface-hi:  #22223a;
  --paper:       #f5f1ea;
  --paper-soft:  #faf9f5;

  /* Foreground */
  --fg:          #ffffff;
  --fg-soft:     #e8e6f0;
  --fg-muted:    #9a95ab;
  --fg-subtle:   #6b6780;
  --ink:         #19192a;

  /* Accents */
  --violet-100:  #ede9ff;
  --violet-200:  #c8bcff;
  --violet-300:  #a78bfa;
  --violet-400:  #8b6dff;
  --violet-500:  #7357ff;
  --violet-600:  #5c42e6;
  --violet-700:  #4a35bf;

  --warm-300:    #ffb199;
  --warm-400:    #ff8a65;
  --warm-500:    #ff7a1a;

  --mint-300:    #99f6e4;
  --mint-400:    #5eead4;
  --mint-500:    #2dd4bf;

  --rose-400:    #f472b6;
  --danger:      #ef4444;
  --danger-soft: #fca5a5;

  /* Borders */
  --border:      rgba(255,255,255,0.08);
  --border-hi:   rgba(255,255,255,0.14);
  --border-lo:   rgba(255,255,255,0.04);

  /* Gradients */
  --grad-primary:   linear-gradient(135deg, #7357ff 0%, #5c42e6 100%);
  --grad-warm:      linear-gradient(135deg, #8b6dff 0%, #ff7a1a 100%);
  --grad-mint:      linear-gradient(135deg, #5eead4 0%, #7357ff 100%);
  --grad-rose:      linear-gradient(135deg, #ff8a65 0%, #8b6dff 100%);
  --grad-hero-text: linear-gradient(135deg, #ffffff 0%, #c8bcff 50%, #ffb199 100%);

  /* Type */
  --f-display: 'Fraunces', 'Newsreader', Georgia, serif;
  --f-body:    'Geist', 'Inter', system-ui, -apple-system, sans-serif;
  --f-mono:    'Geist Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Radii */
  --r-xs:   4px;
  --r-sm:   8px;
  --r-md:   12px;
  --r-lg:   16px;
  --r-xl:   24px;
  --r-full: 9999px;

  /* Shadow */
  --sh-sm:   0 1px 2px rgba(0,0,0,0.3);
  --sh-md:   0 8px 24px rgba(0,0,0,0.3);
  --sh-lg:   0 24px 64px rgba(0,0,0,0.45);
  --sh-glow: 0 0 0 1px rgba(139,109,255,0.3), 0 12px 40px rgba(115,87,255,0.35);

  /* Light surface (admin billing uses white bg) */
  --light-bg:     #f8fafc;
  --light-card:   #ffffff;
  --light-border: #e2e8f0;
  --light-muted:  #64748b;
  --light-subtle: #94a3b8;
  --light-ink:    #0f172a;
  --light-ink-2:  #334155;
  --light-ink-3:  #475569;
}