/* VGLIA — mensajes del framework (django.contrib.messages). */

.messages {
  position: fixed;
  top: calc(var(--topbar-height) + var(--space-4));
  right: var(--page-padding-x);
  z-index: var(--z-toast);
  display: grid;
  gap: var(--space-2);
  width: min(380px, calc(100vw - var(--space-8)));
}

.message {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  border: var(--border-width) solid var(--vglia-border-default);
  background: var(--vglia-glass-bg-strong);
  backdrop-filter: blur(var(--blur-md));
  -webkit-backdrop-filter: blur(var(--blur-md));
  box-shadow: var(--shadow-lg);
  font-size: var(--text-sm);
  color: var(--vglia-text-secondary);
  animation: vg-toast-in var(--transition-normal) var(--ease-out);
}

@keyframes vg-toast-in {
  from { opacity: 0; transform: translateX(16px); }
  to { opacity: 1; transform: none; }
}

.message__icon { flex-shrink: 0; margin-top: 1px; }
.message__text { flex: 1; min-width: 0; line-height: var(--leading-snug); }

.message--success { border-color: rgb(var(--color-success-rgb) / 0.35); }
.message--success .message__icon { color: var(--color-success); }
.message--warning { border-color: rgb(var(--color-warning-rgb) / 0.35); }
.message--warning .message__icon { color: var(--color-warning); }
.message--danger { border-color: rgb(var(--color-danger-rgb) / 0.35); }
.message--danger .message__icon { color: var(--color-danger); }
.message--info .message__icon { color: var(--color-info); }