/*
 * Global toast notifications (admin + storefront). No dependencies.
 * Colours use the admin theme tokens when present, with built-in fallbacks so the
 * storefront can include this file on its own.
 */
.ag-toasts {
  position: fixed; top: 16px; right: 16px; z-index: 2000;
  display: flex; flex-direction: column; gap: 10px;
  width: min(380px, calc(100vw - 32px));
  pointer-events: none;
}
.ag-toast {
  --toast-accent: var(--ag-info, #0b5f86);
  --toast-soft: var(--ag-info-soft, #e5f2f9);
  position: relative; overflow: hidden; pointer-events: auto;
  display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: start;
  padding: 14px 12px 16px 14px;
  background: var(--ag-surface, #fff); color: var(--ag-text, #333);
  border: 1px solid var(--ag-border, #dedede); border-left: 4px solid var(--toast-accent);
  border-radius: var(--ag-radius, 8px);
  box-shadow: 0 6px 24px rgba(0, 0, 0, .14);
  font: 500 14px/1.45 var(--ag-font, "Barlow", system-ui, -apple-system, "Segoe UI", Arial, sans-serif);
  animation: ag-toast-in .22s ease-out;
}
.ag-toast--success { --toast-accent: var(--ag-success, #1a6937); --toast-soft: var(--ag-success-soft, #e8f4ed); }
.ag-toast--error   { --toast-accent: var(--ag-danger, #b3261e);  --toast-soft: var(--ag-danger-soft, #fdecea); }
.ag-toast--warning { --toast-accent: #a86400;                    --toast-soft: var(--ag-warning-soft, #fff3d6); }
.ag-toast--info    { --toast-accent: var(--ag-info, #0b5f86);    --toast-soft: var(--ag-info-soft, #e5f2f9); }

.ag-toast__icon {
  display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%;
  background: var(--toast-soft); color: var(--toast-accent); font-size: 15px; font-weight: 700;
}
.ag-toast__body { min-width: 0; padding-top: 4px; overflow-wrap: anywhere; }
.ag-toast__title { display: block; font-weight: 700; margin-bottom: 2px; }
.ag-toast__close {
  display: grid; place-items: center; width: 32px; height: 32px; margin: -4px -2px 0 0;
  border: 0; border-radius: 6px; background: none; color: var(--ag-muted, #666); cursor: pointer; font-size: 18px; line-height: 1;
}
.ag-toast__close:hover { background: var(--ag-body-bg, #f4f4f4); color: var(--ag-text, #333); }
.ag-toast__close:focus-visible { outline: 3px solid var(--toast-soft); outline-offset: 1px; }
.ag-toast__bar {
  position: absolute; left: 0; bottom: 0; height: 3px; width: 100%;
  background: var(--toast-accent); opacity: .55; transform-origin: left;
}
.ag-toast.is-leaving { animation: ag-toast-out .2s ease-in forwards; }

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

@media (max-width: 480px) {
  .ag-toasts { top: 8px; right: 8px; left: 8px; width: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .ag-toast, .ag-toast.is-leaving { animation: none; }
  .ag-toast__bar { display: none; }
}