/* ===== Fixed Flash Alerts (Glassmorphism, 20px Radius) ===== */
:root{
  --flash-ok:   #27c93f;
  --flash-warn: #ffbd2e;
  --flash-err:  #ff5f56;
  --flash-info: #0099ff;

  /* Fallbacks, falls oben ned definiert */
  --text: #e9eef5;
  --glass: rgba(255,255,255,.075);
  --glass-border: rgba(255,255,255,.18);
}

/* Container oben mittig, stapelnd */
.fixed-alerts{
  position: fixed;
  
  top: 16px;
  left: 50%;
  transform: translateX(-50%);
  width: min(720px, calc(100% - 32px));
  display: grid;
  gap: 12px;
  z-index: 950;           /* unter Modals, über Content */
  pointer-events: none;   /* klickt ned blockieren */
}

/* Basis-Card: Bootstrap .alert verglasen */
.fixed-alerts .alert{
  pointer-events: auto;   /* Buttons klickbar */
  margin: 0;              /* Bootstrap-Margin weg */
  --alert-fg: var(--text);
  color: var(--alert-fg) !important;
  background: var(--glass);
  border: 1px solid var(--glass-border);
  border-radius: 20px;    /* <-- gewünschter Radius */
  backdrop-filter: blur(14px) saturate(140%);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  box-shadow:
    0 10px 30px rgba(0,0,0,.45),
    inset 0 1px 1px rgba(255,255,255,.06);
  border-left: 6px solid transparent;   /* Akzentleiste */
}

.fixed-alerts .alert a{
  color: inherit;
  text-decoration: underline;
}

/* Status-Akzente */
.fixed-alerts .alert-success{ border-left-color: rgba(39,201,63,.85); }
.fixed-alerts .alert-warning{ border-left-color: rgba(255,189,46,.9); }
.fixed-alerts .alert-danger,
.fixed-alerts .alert-error{  border-left-color: rgba(255,95,86,.9); }
.fixed-alerts .alert-info{   border-left-color: rgba(0,153,255,.9); }
.fixed-alerts .alert-primary{ border-left-color: rgba(0,153,255,.9); }

/* --- Farbige Glass-Alerts (grün/gelb/rot) ------------------------------ */
/* Basis: belass ma dein .fixed-alerts & .alert – hier nur die Varianten  */
/* Wichtig: steht dieser Block NACH evtl. "Neutralisieren"-Regeln.        */

/* success = GRÜN */
.fixed-alerts .alert-success{
  /* Akzent + Rand */
  border-left-color: rgba(39,201,63,.9) !important;
  border-color: rgba(39,201,63,.35) !important;
  /* Farbige Tönung über dem Glas */
  background-image: linear-gradient(
    to bottom,
    rgba(39,201,63,.18),
    rgba(39,201,63,.10)
  ) !important;
  /* Grundfarbe bleibt dein Glas-Hintergrund */
  background-color: var(--glass) !important;
}

/* warning = GELB */
.fixed-alerts .alert-warning{
  border-left-color: rgba(255,189,46,.9) !important;
  border-color: rgba(255,189,46,.35) !important;
  background-image: linear-gradient(
    to bottom,
    rgba(255,189,46,.20),
    rgba(255,189,46,.12)
  ) !important;
  background-color: var(--glass) !important;
}

/* danger/error = ROT */
.fixed-alerts .alert-danger,
.fixed-alerts .alert-error{
  border-left-color: rgba(255,95,86,.9) !important;
  border-color: rgba(255,95,86,.35) !important;
  background-image: linear-gradient(
    to bottom,
    rgba(255,95,86,.20),
    rgba(255,95,86,.12)
  ) !important;
  background-color: var(--glass) !important;
}

/* optional: info/primary = BLAU */
.fixed-alerts .alert-info,
.fixed-alerts .alert-primary{
  border-left-color: rgba(0,153,255,.9) !important;
  border-color: rgba(0,153,255,.35) !important;
  background-image: linear-gradient(
    to bottom,
    rgba(0,153,255,.20),
    rgba(0,153,255,.12)
  ) !important;
  background-color: var(--glass) !important;
}

/* Close-Button bleibt lesbar */
.fixed-alerts .btn-close{
  filter: invert(1) brightness(1.2);
  opacity: .9;
}


/* Close-Button im Dark/Glass gut sichtbar */
.fixed-alerts .btn-close{
  filter: invert(1) brightness(1.2);
  opacity: .9;
}
.fixed-alerts .btn-close:focus{
  box-shadow: 0 0 0 3px rgba(0,153,255,.25);
  border-radius: 10px;
}

/* Ein-/Ausblend-Feeling zusätzlich zu .fade.show */
.fixed-alerts .alert.show{ animation: flash-in .22s ease-out both; }
@keyframes flash-in{
  from{ opacity: 0; transform: translateY(-6px); }
  to  { opacity: 1; transform: translateY(0); }
}

/* Optional: Dark-Mode-Finetuning, falls Body-Klasse vorhanden */
body.dark-mode .fixed-alerts .alert{
  background: rgba(17,17,17,.50);
  border-color: rgba(255,255,255,.14);
}

/* Vom Script gesetzt */
.fixed-alerts .alert.alert--dark  { --alert-fg:#fff; }  /* dunkler BG → weiße Schrift */
.fixed-alerts .alert.alert--light { --alert-fg:#000; }  /* heller BG → schwarze Schrift */

/* Heuristische Fälle ohne Script (optional): helle Varianten → schwarz */
.fixed-alerts .alert-warning,
.fixed-alerts .alert-light,
.fixed-alerts .alert.bg-white,
.fixed-alerts .alert.bg-light { --alert-fg:#000 !important; }

/* Close-Button passend einfärben */
.fixed-alerts .alert.alert--dark  .btn-close { filter: invert(1) brightness(1.2); opacity:.9; }
.fixed-alerts .alert.alert--light .btn-close { filter: none; opacity:.8; }