/* Simplified Gray Color Variables */
:root {
  /* Core colors - only 4 shades */
  --gray-light: #e9ecef;    /* Light gray for backgrounds */
  --gray-medium: #6c757d;   /* Medium gray for borders and muted text */
  --gray-dark: #212529;     /* Dark gray for text */
  --gray-black: #000000;    /* Pure black */
  
  /* RGB values for rgba() usage */
  --gray-medium-rgb: 108, 117, 125;
  --muted-color-rgb: 173, 181, 189;
  
  /* Transparent overlays */
  --overlay-light: rgba(0, 0, 0, 0.1);
  --overlay-dark: rgba(0, 0, 0, 0.5);
  --overlay-white: rgba(255, 255, 255, 0.05);
}

/* Light theme */
[data-bs-theme="light"] {
  --body-bg: #ffffff;
  --body-color: var(--gray-dark);
  --border-color: var(--gray-light);
  --sidebar-bg: #f8f9fa;
  --hover-bg: var(--gray-light);
  --muted-color: var(--gray-medium);
}

/* Dark theme */
[data-bs-theme="dark"] {
  --body-bg: #1a1d23;
  --body-color: var(--gray-light);
  --border-color: var(--gray-medium);
  --sidebar-bg: var(--gray-dark);
  --hover-bg: #2c2f35;
  --muted-color: #adb5bd;
}