/* Theme: creative-purple-01 - Generated from JSON */
/* Creative and innovative violet theme with premium and artistic appeal */

:root {
  /* PRIMARY COLORS */
  --tc-primary-50: #f5f3ff;
  --tc-primary-100: #efe8ff;
  --tc-primary-300: #d3ccff;
  --tc-primary-500: #5825f5;
  --tc-primary-700: #7a36de;

  /* NEUTRAL COLORS */
  --tc-neutral-50: #f8fafc;
  --tc-neutral-100: #f1f5f9;
  --tc-neutral-300: #c1c8d2;
  --tc-neutral-500: #556272;
  --tc-neutral-700: #465c6d;
  --tc-neutral-900: #313134;

  /* SURFACE SYSTEM */
  --tc-surface-primary: var(--tc-neutral-50);
  --tc-surface-secondary: var(--tc-neutral-100);
  --tc-surface-accent: var(--tc-primary-50);

  /* TEXT SYSTEM */
  --tc-text-primary: var(--tc-neutral-900);
  --tc-text-secondary: var(--tc-neutral-700);
  --tc-text-accent: var(--tc-primary-500);

  /* INTERACTIVE ELEMENTS */
  --tc-button-primary-bg: var(--tc-primary-500);
  --tc-button-primary-text: #ffffff;
  --tc-button-secondary-bg: var(--tc-neutral-100);
  --tc-button-secondary-text: var(--tc-neutral-900);

  /* BORDERS SHADOWS */
  --tc-border-light: var(--tc-neutral-300);
  --tc-border-medium: var(--tc-neutral-500);
  --tc-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --tc-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --tc-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);

  /* UTILITY VARIABLES */
  --tc-theme-name: "creative-purple-01";
  --tc-theme-category: "creative";

}

/* Base theme styles for creative-purple-01 */
body {
  background-color: var(--tc-bg-primary, var(--tc-surface-primary, #ffffff));
  color: var(--tc-text-primary, #000000);
}

.btn-primary {
  background-color: var(--tc-primary, var(--tc-button-primary-bg, #16acff));
  color: var(--tc-button-primary-text, #ffffff);
  border-color: var(--tc-primary, var(--tc-button-primary-bg, #0067e8));
}

.btn-secondary {
  background-color: var(--tc-secondary, var(--tc-button-secondary-bg, #f8f9fa));
  color: var(--tc-text-primary, var(--tc-button-secondary-text, #2c3237));
  border-color: var(--tc-borders-light, var(--tc-border-light, #e4e5e6));
}
