:root {
  /* Cores Primárias (mantidas com ajustes mínimos) */
  --color-primary: #54428E;
  /* Cor da marca */
  --color-primary-dark: #3f326b;
  /* Versão escura, contraste para hover */
  --color-primary-light: #7d62d4;
  /* Suavizada para fundo ou hover leve */

  /* Cores Secundárias (magenta original) */
  --color-secondary: #EF476F;
  /* Cor da marca */
  --color-secondary-dark: #bd3756;
  /* Mais escura para foco/hover */
  --color-secondary-light: #eb92a7;
  /* Suave para containers, backgrounds */

  /* Tons Neutros */
  --color-white: #ffffff;
  /* Fundo principal */
  --color-white-dark: #f8f9fa;
  /* Alternativo (cards, modais) */
  --color-gray: #424242;
  /* Texto base */
  --color-gray-dark: #212121;
  /* Títulos, texto forte */
  --color-gray-light: #e0e0e0;
  /* Bordas e divisores */
  /* Cores de Feedback */
  --color-success: #06D6A0;
  /* Verde forte */
  --color-success-dark: #059e75;
  --color-success-light: #09ffbd;
  --color-online: #06D6A0;

  --color-warning: #FFD166;
  /* Laranja forte */
  --color-warning-dark: #d4af59;
  --color-warning-light: #f3d48c;

  --color-danger: var(--color-warning);
  /* Vermelho forte */
  --color-danger-dark: var(--color-warning-dark);
  --color-danger-light: var(--color-warning-light);

  /* Links e interações */
  --color-link: var(--color-primary);
  /* Azul para navegação */
  --color-link-hover: var(--color-primary-dark);

  /* Inputs */
  --input-border-default: 1px solid var(--color-gray-light);
  --input-border-focus: 2px solid var(--color-primary);
  --input-border-error: 2px solid var(--color-danger);

  /* Nova Cor Extra (verde água) */
  --color-extra: #00bfae;
  --color-extra-dark: #008e7e;
  --color-extra-light: #9cf7ef;
}