/* ==========================================================
   MgtsPayments — toasts & alerts (shared by every layout)
   ========================================================== */
.mg-toasts {
  position: fixed;
  top: calc(16px + env(safe-area-inset-top, 0px));
  right: 16px;
  z-index: 3000;
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: min(400px, calc(100vw - 32px));
  pointer-events: none;
}

.mg-toast {
  --tone: #16a34a;
  --tone-soft: #ecfdf3;
  position: relative;
  display: grid;
  grid-template-columns: 38px 1fr 28px;
  align-items: start;
  gap: 12px;
  padding: 14px 12px 16px 14px;
  border-radius: 18px;
  background: #fff;
  color: #0f172a;
  box-shadow: 0 18px 50px rgba(15, 23, 42, .16), 0 2px 6px rgba(15, 23, 42, .06);
  border: 1px solid rgba(15, 23, 42, .06);
  overflow: hidden;
  pointer-events: auto;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  transform: translateX(calc(100% + 24px));
  opacity: 0;
  transition: transform .45s cubic-bezier(.22, 1, .36, 1), opacity .3s ease;
}
.mg-toast.is-in { transform: none; opacity: 1; }
.mg-toast.is-leaving { transform: translateX(calc(100% + 24px)); opacity: 0; }

.mg-toast--success { --tone: #16a34a; --tone-soft: #ecfdf3; }
.mg-toast--error   { --tone: #dc2626; --tone-soft: #fef2f2; }
.mg-toast--warning { --tone: #d97706; --tone-soft: #fff7e6; }
.mg-toast--info    { --tone: #2966cb; --tone-soft: #eef4ff; }

.mg-toast__icon { width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; background: var(--tone-soft); color: var(--tone); animation: mg-toast-pop .5s cubic-bezier(.34, 1.56, .64, 1) .1s backwards; }
.mg-toast__icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.mg-toast--success .mg-toast__icon svg path { stroke-dasharray: 24; stroke-dashoffset: 24; animation: mg-toast-draw .45s ease .25s forwards; }
.mg-toast__body { min-width: 0; padding-top: 1px; }
.mg-toast__title { display: block; font-size: .92rem; font-weight: 700; line-height: 1.3; }
.mg-toast__msg { margin: 2px 0 0; font-size: .86rem; color: #475569; line-height: 1.45; word-wrap: break-word; }
.mg-toast__close { width: 28px; height: 28px; border: 0; border-radius: 8px; background: transparent; color: #94a3b8; font-size: 1.3rem; line-height: 1; display: grid; place-items: center; cursor: pointer; transition: background-color .2s, color .2s; }
.mg-toast__close:hover { background: #f1f5f9; color: #0f172a; }
.mg-toast__bar { position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; background: var(--tone); opacity: .35; transform-origin: left; animation-name: mg-toast-countdown; animation-timing-function: linear; animation-fill-mode: forwards; }
.mg-toast.is-paused .mg-toast__bar { animation-play-state: paused; }

@keyframes mg-toast-pop { from { transform: scale(.5); opacity: 0; } }
@keyframes mg-toast-draw { to { stroke-dashoffset: 0; } }
@keyframes mg-toast-countdown { from { transform: scaleX(1); } to { transform: scaleX(0); } }

@media (max-width: 575.98px) {
  .mg-toasts { left: 12px; right: 12px; width: auto; top: calc(10px + env(safe-area-inset-top, 0px)); }
  .mg-toast { transform: translateY(-120%); }
  .mg-toast.is-leaving { transform: translateY(-120%); }
}

@media (prefers-reduced-motion: reduce) {
  .mg-toast, .mg-toast.is-leaving { transition: opacity .2s; transform: none; }
}

/* ---------- Bootstrap alerts, restyled everywhere they remain ---------- */
.alert {
  display: flex; gap: 10px; align-items: flex-start;
  border: 1px solid transparent; border-radius: 12px;
  padding: 11px 14px; font-size: .88rem; line-height: 1.5; font-weight: 500;
  box-shadow: none;
  animation: mg-alert-in .3s ease-out;
}
.alert > i:first-child, .alert > .bi:first-child, .alert > .fas:first-child, .alert > .fa:first-child { margin-top: 2px; opacity: .85; flex: 0 0 auto; }
.alert .alert-link, .alert a { color: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.alert .btn-close { margin-left: auto; padding: .4rem; opacity: .45; }
.alert .btn-close:hover { opacity: .8; }
.alert-dismissible { padding-right: 14px; }
.alert-dismissible .btn-close { position: static; }
.alert-success { background: #f3fbf6; border-color: #cdeedb; color: #14532d; }
.alert-danger { background: #fdf4f4; border-color: #f6d4d4; color: #7f1d1d; }
.alert-warning { background: #fffaf0; border-color: #f7e2b8; color: #7c4a03; }
.alert-info, .alert-primary { background: #f4f7fe; border-color: #d6e2fb; color: #1e3a8a; }
.alert-secondary, .alert-light { background: #f7f8fa; border-color: #e5e7eb; color: #334155; }
@keyframes mg-alert-in { from { opacity: 0; transform: translateY(-6px); } }

/* Field validation messages */
.invalid-feedback { font-size: .8rem; font-weight: 500; }
.invalid-feedback.d-block::before, .field-error::before { content: "⚠ "; }
