:root {
  /* Base colors */
  --primary-color: #3498db;
  --primary-color-light: rgb(from var(--primary-color) r g b / 60%);
  --secondary-color: #2ecc71;

  /* Text colors */
  --text-color: #2c3e50;
  --text-color-light: #7f8c8d;

  /* UI colors */
  --border-color: #555555;
  --modal-border-color: #e0e0e0;
  --modal-backdrop-color: rgba(0, 0, 0, 0.5);
  --icon-color: rgb(from var(--border-color) r g b / 80%);

  /* State colors */
  --error-color: #e74c3c;
  --error-color-light: rgba(231, 76, 60, 0.2);
  --success-color: #2ecc71;
  --success-color-light: rgba(46, 204, 113, 0.2);
  --warning-color: #f1c40f;
  --warning-color-light: rgba(241, 196, 15, 0.2);

  /* Background colors */
  --selected-bg-color: #3498db;
  --selected-bg-color-light: rgba(from var(--selected-bg-color) r g b / 80%);
  --selected-bg-color-dark: rgba(from var(--selected-bg-color) r g b / 100%);
  --selected-color: #ffffff;
  --selected-color-light: rgba(from var(--selected-color) r g b / 80%);
  --selected-color-dark: rgba(from var(--selected-color) r g b / 100%);
  --disabled-color: #bdc3c7;
  --disabled-background: #f5f7fa;
  --card-bg: #ffffff;
  --background-color: #f8f9fa;
  --tooltip-bg-color: #ffeba1;

  /* Input colors */
  --input-bg-color: rgba(255, 255, 255, 0.8);
  --input-bg-hover: rgba(0, 0, 0, 0.05);
  --input-bg-disabled: rgba(0, 0, 0, 0.05);

  /* Text Colors */
  --text-primary: #2c3e50;
  --text-muted: rgb(from var(--text-primary) r g b / 80%);

  /* Border Colors */
  --input-bg: #ffffff;
  --input-bg-disabled: #e9ecef;

  /* Status Colors */
  --danger-color: #dc3545;
  --success-color: #28a745;
  --warning-color: #ffc107;

  /* Shadow Colors */
  --shadow-color: rgba(74, 108, 247, 0.25);

  /* Typography */
  --line-height: 20px;

  /* File Upload Colors */
  --upload-border-color: var(--border-color);
  --upload-bg-color: var(--background-color);
  --upload-dragging-border-color: var(--primary-color);
  --upload-dragging-bg-color: var(--primary-color-light);
  --upload-has-files-border-color: var(--success-color);
  --upload-has-files-bg-color: var(--success-color-light);
  --upload-icon-color: var(--icon-color);
  --upload-text-color: var(--text-color-light);
  --progress-bg-color: var(--disabled-background);
  --progress-color: var(--primary-color);
  --success-bg-color: var(--success-color-light);
  --success-text-color: var(--success-color);
  --error-bg-color: var(--error-color-light);
  --error-text-color: var(--error-color);
}
