:root {
  /* Sombras base */
  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
  --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);
  --shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);
  --shadow-none: 0 0 #0000;

  /* Sombras coloridas */
  --shadow-purple-sm: 0 1px 2px 0 rgb(124 58 237 / 0.05);
  --shadow-purple: 0 1px 3px 0 rgb(124 58 237 / 0.1), 0 1px 2px -1px rgb(124 58 237 / 0.1);
  --shadow-purple-md: 0 4px 6px -1px rgb(124 58 237 / 0.1), 0 2px 4px -2px rgb(124 58 237 / 0.1);
  --shadow-purple-lg: 0 10px 15px -3px rgb(124 58 237 / 0.1), 0 4px 6px -4px rgb(124 58 237 / 0.1);
  --shadow-purple-xl: 0 20px 25px -5px rgb(124 58 237 / 0.1), 0 8px 10px -6px rgb(124 58 237 / 0.1);
  --shadow-purple-2xl: 0 25px 50px -12px rgb(124 58 237 / 0.25);

  /* Sombras para elementos interativos */
  --shadow-hover: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --shadow-focus: 0 0 0 3px rgb(66 153 225 / 0.5);

  /* Sombras para cards */
  --shadow-card: var(--shadow);
  --shadow-card-hover: var(--shadow-md);
}

/* Classes utilitárias para sombras */
.shadow-sm { box-shadow: var(--shadow-sm); }
.shadow { box-shadow: var(--shadow); }
.shadow-md { box-shadow: var(--shadow-md); }
.shadow-lg { box-shadow: var(--shadow-lg); }
.shadow-xl { box-shadow: var(--shadow-xl); }
.shadow-2xl { box-shadow: var(--shadow-2xl); }
.shadow-inner { box-shadow: var(--shadow-inner); }
.shadow-none { box-shadow: var(--shadow-none); }

/* Classes utilitárias para sombras coloridas */
.shadow-purple-sm { box-shadow: var(--shadow-purple-sm); }
.shadow-purple { box-shadow: var(--shadow-purple); }
.shadow-purple-md { box-shadow: var(--shadow-purple-md); }
.shadow-purple-lg { box-shadow: var(--shadow-purple-lg); }
.shadow-purple-xl { box-shadow: var(--shadow-purple-xl); }
.shadow-purple-2xl { box-shadow: var(--shadow-purple-2xl); }