:root {
  /* Color system */
  --bs-primary: #bb86fc;
  --bs-primary-rgb: 187, 134, 252;
  --bs-secondary: #03dac6;
  --bs-secondary-rgb: 3, 218, 198;
  
  /* Additional theme colors */
  --bs-success: #00e676;
  --bs-success-rgb: 0, 230, 118;
  --bs-info: #2196f3;
  --bs-info-rgb: 33, 150, 243;
  --bs-warning: #ffab00;
  --bs-warning-rgb: 255, 171, 0;
  --bs-danger: #cf6679;
  --bs-danger-rgb: 207, 102, 121;
  --bs-light: #1f1f1f;
  --bs-light-rgb: 31, 31, 31;
  --bs-dark: #121212;
  --bs-dark-rgb: 18, 18, 18;
  
  /* Typography */
  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 400;
  --bs-body-line-height: 1.5;
  
  /* Body colors */
  --bs-body-color: #ffffff;
  --bs-body-color-rgb: 255, 255, 255;
  --bs-body-bg: var(--bs-dark);
  --bs-body-bg-rgb: var(--bs-dark-rgb);
  
  /* Custom component variables */
  --bs-navbar-bg: var(--bs-light);
  --bs-card-bg: var(--bs-light);
  --bs-footer-bg: #0a0a0a;
  --bs-footer-color: var(--bs-body-color);
  --bs-input-bg: #2c2c2c;
  --bs-input-color: var(--bs-body-color);
  --bs-input-border-color: #444;
  
  /* Button hover states */
  --bs-primary-hover: #9965f4;
}