:root {
  --card-background: var(--color-black);

  --modal-overlay: var(--color-gray-500);

  --text-color: var(--color-white);
  --text-color-inverted: var(--color-black);
  --text-color-inverted-disabled: var(--color-gray-400);

  --button-text-color: var(--color-white);

  --color-surface-enabled: var(--color-primary-500);
  --color-surface-disabled: var(--color-gray-500);
  --color-surface-hover: var(--color-primary-700);

  --color-border-enabled: var(--color-primary-400);
  --color-border-disabled: var(--color-gray-500);
  --color-border-hover: var(--color-primary-700);

  --color-shadow-enabled: var(--color-gray-800);
  --color-shadow-disabled: var(--color-primary-400);
  --color-shadow-hover: var(--color-gray-700);

  --color-toggle-off: var(--color-gray-500);
  --color-toggle-on: var(--color-primary-200);
  
  --color-indicator: var(--color-black);
}