/* SaloCart V5.2.17 — Role-driven action toast
   A non-blocking next-best-action panel. It stays beneath modal layers and
   above the mobile navigation, so it helps without interrupting work. */
:root { --sc-layer-action-toast: 10500; }

.action-toast-root {
  position: fixed;
  z-index: var(--sc-layer-action-toast);
  right: max(18px, env(safe-area-inset-right));
  bottom: max(18px, env(safe-area-inset-bottom));
  width: min(410px, calc(100vw - 36px));
  pointer-events: none;
  opacity: 0;
  transform: translate3d(0, 14px, 0);
  transition: opacity .18s ease, transform .2s cubic-bezier(.2,.8,.2,1);
}

.action-toast-root.is-open { pointer-events: auto; }
.action-toast-root.is-visible { opacity: 1; transform: translate3d(0,0,0); }

.action-toast {
  --action-tone: var(--sc-green, #0f8318);
  --action-soft: rgba(15, 131, 24, .11);
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) 34px;
  gap: .72rem;
  padding: .85rem;
  border: 1px solid rgba(14, 58, 35, .12);
  border-radius: 21px;
  background: rgba(255,255,255,.97);
  color: var(--sc-ink, #17261d);
  box-shadow: 0 18px 46px rgba(12, 45, 30, .2), 0 3px 10px rgba(12, 45, 30, .08);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.action-toast--orange { --action-tone: #df7b10; --action-soft: rgba(223, 123, 16, .12); }
.action-toast--blue { --action-tone: #176cc4; --action-soft: rgba(23, 108, 196, .12); }
.action-toast--violet { --action-tone: #7655bf; --action-soft: rgba(118, 85, 191, .12); }

.action-toast__icon {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 15px;
  background: var(--action-soft);
  color: var(--action-tone);
  font-size: 1.18rem;
}

.action-toast__copy { min-width: 0; padding-top: .05rem; }
.action-toast__copy > span {
  display: block;
  margin-bottom: .16rem;
  color: var(--action-tone);
  font-size: .66rem;
  font-weight: 900;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.action-toast__copy strong {
  display: block;
  color: inherit;
  font-family: var(--font-display, Sora, ui-sans-serif, sans-serif);
  font-size: .96rem;
  font-weight: 900;
  line-height: 1.25;
  letter-spacing: -.025em;
}
.action-toast__copy p {
  margin: .3rem 0 0;
  color: var(--sc-muted, #617468);
  font-size: .76rem;
  line-height: 1.48;
}

.action-toast__close,
.action-toast__later {
  border: 0;
  background: transparent;
  color: var(--sc-muted, #617468);
}
.action-toast__close {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  justify-self: end;
  border-radius: 11px;
  font-size: .84rem;
}
.action-toast__close:hover,
.action-toast__close:focus-visible,
.action-toast__later:hover,
.action-toast__later:focus-visible { background: rgba(16, 42, 28, .07); color: var(--action-tone); }

.action-toast__actions {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: .55rem;
  margin-top: .05rem;
}
.action-toast__primary {
  flex: 1 1 auto;
  min-height: 42px;
  background: var(--action-tone);
  border-color: var(--action-tone);
  font-size: .78rem;
}
.action-toast__primary:hover,
.action-toast__primary:focus-visible { background: var(--action-tone); filter: brightness(.94); }
.action-toast__later {
  flex: 0 0 auto;
  min-height: 42px;
  padding: 0 .7rem;
  border-radius: 12px;
  font-size: .76rem;
  font-weight: 850;
}

html[data-theme="dark"] .action-toast {
  border-color: rgba(255,255,255,.11);
  background: rgba(18, 27, 24, .97);
  color: #f2f7f3;
  box-shadow: 0 18px 46px rgba(0,0,0,.42);
}
html[data-theme="dark"] .action-toast__copy p,
html[data-theme="dark"] .action-toast__close,
html[data-theme="dark"] .action-toast__later { color: rgba(235, 244, 238, .7); }
html[data-theme="dark"] .action-toast__close:hover,
html[data-theme="dark"] .action-toast__close:focus-visible,
html[data-theme="dark"] .action-toast__later:hover,
html[data-theme="dark"] .action-toast__later:focus-visible { background: rgba(255,255,255,.08); color: #fff; }

@media (max-width: 991.98px) {
  .action-toast-root {
    right: max(11px, env(safe-area-inset-right));
    left: max(11px, env(safe-area-inset-left));
    width: auto;
    bottom: calc(82px + env(safe-area-inset-bottom));
  }
}

@media (max-width: 420px) {
  .action-toast { grid-template-columns: 42px minmax(0,1fr) 32px; gap: .6rem; padding: .75rem; border-radius: 18px; }
  .action-toast__icon { width:42px; height:42px; border-radius:13px; font-size:1.05rem; }
  .action-toast__copy strong { font-size: .9rem; }
  .action-toast__copy p { font-size: .71rem; }
  .action-toast__primary { min-height: 40px; font-size:.73rem; }
  .action-toast__later { min-height: 40px; font-size:.72rem; padding:0 .58rem; }
}

@media (prefers-reduced-motion: reduce) {
  .action-toast-root { transition: none; }
}