/* Theme Variables - Centralized color and style definitions */

/* Default Theme: Finstock (Active by default) */
:root {
  /* Primary Colors */
  --primary-1: #002554;
  --primary-2: #6d6e71;
  --primary-3: #e75425;
  
  /* Secondary Colors */
  --secondary-1: #2e609d;
  --secondary-2: #50A684;
  
  /* Accent Colors */
  --accent-1: #ed8936;
  --accent-2: #3b82f6;
  
  /* Neutral Colors */
  --neutral-1: #ffffff; /* white */
  --neutral-2: #f8f9fa; /* background */
  --neutral-3: #e5e7eb; /* light grey */
  --neutral-4: #64748b; /* dark grey */
  --neutral-5: #1e293b; /* text/dark */
  
  /* Semantic Colors */
  --success: #50A684;
  --warning: #ed8936;
  --error: #ef4444;
  --info: #3b82f6;
  --danger: #ef4444;
  
  /* Utility Colors */
  --border: #e5e7eb;
  --text: #1e293b;
  --background: #f8f9fa;
  --white: #ffffff;
  
  /* Gradients */
  --gradient-primary: linear-gradient(135deg, var(--primary-1), var(--secondary-1));
  --gradient-secondary: linear-gradient(135deg, var(--primary-3), var(--accent-1));
  --gradient-accent: linear-gradient(135deg, var(--secondary-2), #10b981);
  
  /* Typography - Font Families */
  --font-primary: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  --font-secondary: 'Helvetica Neue', Helvetica, Arial, sans-serif;

  /* Typography - Font Sizes (Standardized Scale) */
  --font-size-xs: 0.6875rem;    /* 11px - smallest text, labels */
  --font-size-sm: 0.75rem;      /* 12px - table cells, captions */
  --font-size-base: 0.8125rem;  /* 13px - body text, inputs */
  --font-size-md: 0.875rem;     /* 14px - default text */
  --font-size-lg: 0.95rem;      /* 15.2px - emphasized text */
  --font-size-xl: 1.1rem;       /* 17.6px - section titles */
  --font-size-2xl: 1.25rem;     /* 20px - panel headers */
  --font-size-3xl: 1.5rem;      /* 24px - page titles */

  /* Typography - Font Weights */
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  
  /* Border Radius */
  --radius-small: 4px;
  --radius-medium: 8px;
  --radius-large: 16px;
  --radius-xl: 24px;
  
  /* Shadows */
  --shadow-small: 0 1px 3px rgba(0, 0, 0, 0.05);
  --shadow-medium: 0 4px 10px rgba(0, 0, 0, 0.08);
  --shadow-large: 0 10px 30px rgba(0, 0, 0, 0.12);
  
  /* Transitions */
  --transition: all 0.2s ease;
  
  /* Legacy compatibility variables (deprecated - will be removed in future) */
  --finstock-primary-dark-blue: var(--primary-1);
  --finstock-primary-grey: var(--primary-2);
  --finstock-primary-orange: var(--primary-3);
  --finstock-secondary-blue: var(--secondary-1);
  --finstock-secondary-green: var(--secondary-2);
  --finstock-primary: var(--primary-1);
  --finstock-secondary: var(--secondary-1);
  --finstock-tertiary: var(--secondary-2);
  --finstock-success: var(--success);
  --finstock-warning: var(--warning);
  --finstock-error: var(--error);
  --finstock-info: var(--info);
  --finstock-danger: var(--danger);
  --finstock-white: var(--neutral-1);
  --finstock-background: var(--neutral-2);
  --finstock-light-grey: var(--neutral-3);
  --finstock-dark-grey: var(--neutral-4);
  --finstock-text: var(--neutral-5);
  --finstock-dark: var(--neutral-5);
  --finstock-light: var(--neutral-2);
  --finstock-border: var(--border);
  --finstock-border-color: var(--border);
  --finstock-border-radius: var(--radius-medium);
  --finstock-transition: var(--transition);
  --finstock-gradient-primary: var(--gradient-primary);
  --finstock-gradient-secondary: var(--gradient-secondary);
  --finstock-gradient-success: var(--gradient-accent);
  --finstock-font-primary: var(--font-primary);
  --finstock-font-secondary: var(--font-secondary);
  --finstock-radius-small: var(--radius-small);
  --finstock-radius-medium: var(--radius-medium);
  --finstock-radius-large: var(--radius-large);
  --finstock-radius-xl: var(--radius-xl);
  --finstock-shadow-small: var(--shadow-small);
  --finstock-shadow-medium: var(--shadow-medium);
  --finstock-shadow-large: var(--shadow-large);
  
  /* Radzen compatibility variables */
  --rz-primary: var(--primary-1);
  --rz-border-color: var(--border);
  --rz-text-color: var(--text);
  --rz-text-secondary-color: var(--neutral-4);
  --rz-danger: var(--danger);
}

/* Thellas Theme */
[data-theme="thellas"], .theme-thellas {
  /* Primary Colors - Thellas uses indigo shades */
  --primary-1: #3F51B5;
  --primary-2: #6d6e71;
  --primary-3: #579D82;
  
  /* Secondary Colors */
  --secondary-1: #C5CAE9;
  --secondary-2: #579D82;
  
  /* Accent Colors */
  --accent-1: #7FB3A1;
  --accent-2: #8C9EFF;
  
  /* Neutral Colors (same across themes) */
  --neutral-1: #ffffff;
  --neutral-2: #f8f9fa;
  --neutral-3: #e5e7eb;
  --neutral-4: #64748b;
  --neutral-5: #1e293b;
  
  /* Semantic Colors */
  --success: #579D82;
  --warning: #ed8936;
  --error: #ef4444;
  --info: #3b82f6;
  --danger: #ef4444;
  
  /* Utility Colors */
  --border: #e5e7eb;
  --text: #1e293b;
  --background: #f8f9fa;
  --white: #ffffff;
  
  /* Gradients */
  --gradient-primary: linear-gradient(135deg, var(--primary-1), var(--secondary-1));
  --gradient-secondary: linear-gradient(135deg, var(--primary-3), var(--accent-1));
  --gradient-accent: linear-gradient(135deg, var(--secondary-2), #10b981);
  
  /* Legacy compatibility - maps to new system */
  --finstock-primary-dark-blue: var(--primary-1);
  --finstock-primary-grey: var(--primary-2);
  --finstock-primary-orange: var(--primary-3);
  --finstock-secondary-blue: var(--secondary-1);
  --finstock-secondary-green: var(--secondary-2);
}

/* Finstock Theme */
[data-theme="finstock"], .theme-finstock {
  /* Primary Colors - Finstock uses blue shades */
  --primary-1: #002554;
  --primary-2: #6d6e71;
  --primary-3: #e75425;
  
  /* Secondary Colors */
  --secondary-1: #2e609d;
  --secondary-2: #50A684;
  
  /* Accent Colors */
  --accent-1: #ed8936;
  --accent-2: #3b82f6;
  
  /* Neutral Colors (same across themes) */
  --neutral-1: #ffffff;
  --neutral-2: #f8f9fa;
  --neutral-3: #e5e7eb;
  --neutral-4: #64748b;
  --neutral-5: #1e293b;
  
  /* Semantic Colors */
  --success: #50A684;
  --warning: #ed8936;
  --error: #ef4444;
  --info: #3b82f6;
  --danger: #ef4444;
  
  /* Utility Colors */
  --border: #e5e7eb;
  --text: #1e293b;
  --background: #f8f9fa;
  --white: #ffffff;
  
  /* Gradients */
  --gradient-primary: linear-gradient(135deg, var(--primary-1), var(--secondary-1));
  --gradient-secondary: linear-gradient(135deg, var(--primary-3), var(--accent-1));
  --gradient-accent: linear-gradient(135deg, var(--secondary-2), #10b981);
  
  /* Legacy compatibility - maps to new system */
  --finstock-primary-dark-blue: var(--primary-1);
  --finstock-primary-grey: var(--primary-2);
  --finstock-primary-orange: var(--primary-3);
  --finstock-secondary-blue: var(--secondary-1);
  --finstock-secondary-green: var(--secondary-2);
}