/* Feedbaky status and contextual messages. */
.feedbaky-message {
  margin: 0;
  padding: 1rem;
  border: 1px solid light-dark(var(--neutral-200), color-mix(in oklch, var(--neutral-800) 65%, var(--neutral-600) 35%));
  background: light-dark(var(--neutral-50), color-mix(in oklch, var(--neutral-900) 85%, var(--neutral-800) 15%));
  color: light-dark(var(--neutral-700), var(--neutral-300));
}

.feedbaky-message-error {
  border-color: light-dark(var(--error-100), color-mix(in oklch, var(--neutral-800) 70%, var(--error-700) 30%));
  background: light-dark(var(--error-50), color-mix(in oklch, var(--neutral-900) 82%, var(--error-900) 18%));
  color: light-dark(var(--error-700), var(--error-300));
}

.feedbaky-message-info {
  border-color: light-dark(var(--secondary-100, var(--neutral-200)), color-mix(in oklch, var(--neutral-800) 70%, var(--secondary-700, var(--neutral-700)) 30%));
  background: light-dark(var(--secondary-50, var(--neutral-50)), color-mix(in oklch, var(--neutral-900) 82%, var(--secondary-900, var(--neutral-900)) 18%));
  color: light-dark(var(--secondary-700, var(--neutral-700)), var(--secondary-300, var(--neutral-300)));
}

.feedbaky-message-primary {
  margin: 0;
  border-color: light-dark(var(--primary-100), color-mix(in oklch, var(--neutral-800) 70%, var(--primary-700) 30%));
  background: light-dark(var(--primary-50), color-mix(in oklch, var(--neutral-900) 82%, var(--primary-900) 18%));
  color: light-dark(var(--primary-700), var(--primary-300));
}