Fix: Rediseñar toasts completamente para acoplarse al sistema de catación

PROBLEMA: Toasts usaban estilos por defecto de Nuxt UI que no se acoplaban al diseño outline/terminal

SOLUCIÓN:
- Cambiar app.config.ts para usar clases CSS personalizadas en lugar de sintaxis arbitraria de Tailwind
- Agregar estilos CSS completos en main.css usando variables del sistema (--cata-bg, --cata-fg, --cata-primary)
- Implementar todas las variantes (primary, success, error, warning, info, neutral)

ESTILOS APLICADOS:
- Fondo: var(--cata-bg) en claro, negro 95% opaco en oscuro
- Bordes: outline usando var(--cata-primary) con opacidades
- Texto: fuente monospace en modo oscuro con text-shadow
- Iconos: colores específicos por tipo con drop-shadow en oscuro
- Efectos glow: sombras sutiles en modo oscuro según tipo
- IMPORTANTE: Usar !important para sobrescribir estilos de Nuxt UI

nuxt4/app/assets/css/main.css

@@ -358,3 +358,191 @@
     font-weight: 400;
   }
 }
+
+/* -------------------------------------------------------------------------- */
+/* TOASTS / NOTIFICACIONES */
+/* -------------------------------------------------------------------------- */
+
+/* Root container del toast */
+.cata-toast-root {
+  background-color: var(--cata-bg) !important;
+  border: var(--cata-border-width) solid var(--cata-primary) !important;
+  border-radius: 0.375rem;
+  padding: 1rem;
+}
+
+.dark .cata-toast-root {
+  background-color: rgba(0, 0, 0, 0.95) !important;
+  border-color: var(--cata-primary) !important;
+}
+
+/* Wrapper del contenido */
+.cata-toast-wrapper {
+  display: flex;
+  gap: 0.75rem;
+  width: 100%;
+}
+
+/* Título del toast */
+.cata-toast-title {
+  color: var(--cata-fg) !important;
+  font-family: var(--cata-font-family);
+  font-size: 0.875rem;
+  font-weight: 600;
+}
+
+.dark .cata-toast-title {
+  font-family: 'Courier New', Courier, 'Lucida Console', Monaco, monospace;
+  font-weight: 300;
+  text-shadow: 0 0 2px currentColor;
+}
+
+/* Descripción del toast */
+.cata-toast-description {
+  color: var(--cata-fg) !important;
+  font-family: var(--cata-font-family);
+  font-size: 0.75rem;
+  opacity: 0.75;
+}
+
+.dark .cata-toast-description {
+  font-family: 'Courier New', Courier, 'Lucida Console', Monaco, monospace;
+  font-weight: 300;
+  text-shadow: 0 0 1px currentColor;
+}
+
+/* Icono del toast */
+.cata-toast-icon {
+  flex-shrink: 0;
+  width: 1.25rem;
+  height: 1.25rem;
+  color: var(--cata-fg);
+}
+
+.dark .cata-toast-icon {
+  filter: drop-shadow(0 0 2px currentColor);
+}
+
+/* Botones de acción */
+.cata-toast-actions {
+  display: flex;
+  gap: 0.375rem;
+  flex-shrink: 0;
+  margin-top: 0.5rem;
+}
+
+/* Botón de cerrar */
+.cata-toast-close {
+  flex-shrink: 0;
+  color: var(--cata-fg);
+}
+
+.cata-toast-close:hover {
+  opacity: 0.8;
+}
+
+/* Barra de progreso */
+.cata-toast-progress {
+  position: absolute;
+  inset-inline-start: 0;
+  inset-inline-end: 0;
+  bottom: 0;
+  height: 0.125rem;
+  background-color: var(--cata-primary);
+  opacity: 0.5;
+}
+
+/* Variantes de color */
+.cata-toast-primary {
+  border-color: color-mix(in srgb, var(--cata-primary) 50%, transparent) !important;
+}
+
+.dark .cata-toast-primary {
+  border-color: var(--cata-primary) !important;
+  box-shadow: 0 0 12px rgba(0, 255, 0, 0.2);
+}
+
+.cata-toast-success {
+  border-color: rgba(22, 163, 74, 0.5) !important;
+}
+
+.dark .cata-toast-success {
+  border-color: rgb(34, 197, 94) !important;
+  box-shadow: 0 0 12px rgba(0, 255, 0, 0.25);
+}
+
+.cata-toast-success .cata-toast-icon {
+  color: rgb(22, 163, 74);
+}
+
+.dark .cata-toast-success .cata-toast-icon {
+  color: rgb(34, 197, 94);
+}
+
+.cata-toast-error {
+  border-color: rgba(220, 38, 38, 0.5) !important;
+}
+
+.dark .cata-toast-error {
+  border-color: rgb(239, 68, 68) !important;
+  box-shadow: 0 0 12px rgba(255, 0, 0, 0.25);
+}
+
+.cata-toast-error .cata-toast-icon {
+  color: rgb(220, 38, 38);
+}
+
+.dark .cata-toast-error .cata-toast-icon {
+  color: rgb(239, 68, 68);
+}
+
+.cata-toast-warning {
+  border-color: rgba(202, 138, 4, 0.5) !important;
+}
+
+.dark .cata-toast-warning {
+  border-color: rgb(234, 179, 8) !important;
+  box-shadow: 0 0 12px rgba(255, 255, 0, 0.25);
+}
+
+.cata-toast-warning .cata-toast-icon {
+  color: rgb(202, 138, 4);
+}
+
+.dark .cata-toast-warning .cata-toast-icon {
+  color: rgb(234, 179, 8);
+}
+
+.cata-toast-info {
+  border-color: rgba(37, 99, 235, 0.5) !important;
+}
+
+.dark .cata-toast-info {
+  border-color: rgb(59, 130, 246) !important;
+  box-shadow: 0 0 12px rgba(70, 130, 180, 0.25);
+}
+
+.cata-toast-info .cata-toast-icon {
+  color: rgb(37, 99, 235);
+}
+
+.dark .cata-toast-info .cata-toast-icon {
+  color: rgb(59, 130, 246);
+}
+
+.cata-toast-neutral {
+  border-color: rgba(107, 114, 128, 0.5) !important;
+}
+
+.dark .cata-toast-neutral {
+  border-color: rgb(107, 114, 128) !important;
+  box-shadow: 0 0 12px rgba(128, 128, 128, 0.2);
+}
+
+.cata-toast-neutral .cata-toast-icon {
+  color: rgb(75, 85, 99);
+}
+
+.dark .cata-toast-neutral .cata-toast-icon {
+  color: rgb(156, 163, 175);
+}