/* Bricks-Formulare: Rueckmeldung als Hinweis oben (Daniel 26.10.2026: ohne Radius, Werte aus Tokens). */
:root{
  --form-toasty-offset: var(--space-s);
  --form-toasty-gap: var(--global-gutter-small);
  --form-toasty-shadow: var(--shadow-l);
  --form-toasty-z: 99999;
  --form-toasty-toast-max: var(--width-medium);

  /* Bricks-ähnliche Farben */
  --form-toasty-success-bg: var(--success-surface);
  --form-toasty-success-fg: var(--success-surface-fg);
  --form-toasty-success-bd: var(--success);

  --form-toasty-error-bg: var(--error-surface);
  --form-toasty-error-fg: var(--error-surface-fg);
  --form-toasty-error-bd: var(--error);
}

/* ROOT: oben zentriert */
#brx-toast-root{
  position: fixed;
  top: var(--form-toasty-offset);
  left: 50%;
  transform: translateX(-50%);
  display: grid;
  gap: var(--form-toasty-gap);
  z-index: var(--form-toasty-z);
  pointer-events: none;         /* nur Toasts sind klickbar */
}

/* TOAST: begrenzte Breite, zentriert durch Root */
.brx-toast{
  position: relative;
  pointer-events: auto;
  inline-size: min(var(--form-toasty-toast-max), 92vw);
  background: var(--bg-surface);
  color: var(--text-body);
  font-size: var(--text-m);
  box-shadow: var(--form-toasty-shadow);
  border-inline-start: var(--space-4xs) solid transparent;
  padding: var(--space-xs) var(--space-l) var(--space-xs) var(--space-s);
  display: block;
  transform: translateY(-8px);
  opacity: 0;
  transition: transform .2s ease, opacity .2s ease, border-color .2s ease, background-color .2s ease;
  overflow-wrap: anywhere;
  white-space: normal;
}

.brx-toast.in{ opacity: 1; transform: translateY(0); }

/* Varianten */
.brx-toast.is-success{
  background: var(--form-toasty-success-bg);
  color: var(--form-toasty-success-fg);
  border-inline-start-color: var(--form-toasty-success-bd);
}
.brx-toast.is-error{
  background: var(--form-toasty-error-bg);
  color: var(--form-toasty-error-fg);
  border-inline-start-color: var(--form-toasty-error-bd);
}

/* Links im Toast */
.brx-toast a{ color: inherit; text-decoration: underline; }

/* Close */
.brx-toast__close{
  position: absolute; inset-block-start: var(--space-3xs); inset-inline-end: var(--space-2xs);
  color: inherit; font-size: var(--text-l); line-height: 1;
  border: 0; background: transparent; cursor: pointer; opacity: .7;
}
.brx-toast__close:hover{ opacity: 1; }

.brxe-form .message{ display:none !important; } /* doppelte Inline-Messages aus */
@media (prefers-reduced-motion: reduce){ .brx-toast, .brx-toast.in{ transition:none; } }