/**
 * Vumi Theme System CSS Variables
 * 
 * This file defines CSS variables for the Vumi theme system.
 * It includes variables for both light and dark modes, as well as
 * app-specific theme overrides.
 */

:root {
  /* Light mode variables */
  --primary: #4B269F;
  --primary-foreground: #FFFFFF;
  --secondary: #F99926;
  --secondary-foreground: #000000;
  
  /* App-specific colors */
  --showcase-primary: #4B269F;
  --showcase-secondary: #F99926;
  --showcase-accent: #FFD700;
  
  --gigs-primary: #A13163;
  --gigs-secondary: #FB3D25;
  --gigs-accent: #FFA500;
  
  /* Other UI colors */
  --background: #FFFFFF;
  --foreground: #000000;
  --muted: #F1F5F9;
  --muted-foreground: #64748B;
  --card: #FFFFFF;
  --card-foreground: #000000;
  --border: #E2E8F0;
  --input: #E2E8F0;
  --ring: #94A3B8;
}

.dark {
  /* Dark mode variables */
  --primary: #6D41C3;
  --primary-foreground: #FFFFFF;
  --secondary: #FAB25C;
  --secondary-foreground: #000000;
  
  /* App-specific colors remain the same */
  
  /* Other UI colors */
  --background: #0F172A;
  --foreground: #FFFFFF;
  --muted: #1E293B;
  --muted-foreground: #94A3B8;
  --card: #1E293B;
  --card-foreground: #FFFFFF;
  --border: #334155;
  --input: #334155;
  --ring: #94A3B8;
}

/* App-specific theme overrides */
[data-app-theme="showcase"] {
  --primary: var(--showcase-primary);
  --secondary: var(--showcase-secondary);
  /* Accent color can be used for specific UI elements */
}

[data-app-theme="gigs"] {
  --primary: var(--gigs-primary);
  --secondary: var(--gigs-secondary);
  /* Accent color can be used for specific UI elements */
}