:root {
  --specto-woocommerce-snackbar-hidden-translate-y: 12px;
  --specto-woocommerce-snackbar-edge-x: var(--su-space-block-s, 16px);
  --specto-woocommerce-snackbar-edge-y: var(--su-space-block-s, 16px);
  --specto-woocommerce-snackbar-bottom-offset: var(--su-space-block-m, 24px);
  --specto-woocommerce-snackbar-max-width: 320px;
  --specto-woocommerce-snackbar-padding-block: var(--su-space-block-l, 32px);
  --specto-woocommerce-snackbar-padding-inline: var(--su-space-block-l, 32px);
  --specto-woocommerce-snackbar-content-gap: var(--su-space-unit-xl, 16px);
  --specto-woocommerce-snackbar-actions-gap: var(--su-space-block-xs, 12px);
  --specto-woocommerce-snackbar-transition-ms: 500;
  --specto-woocommerce-snackbar-dismiss-transition-ms: 500;
  --specto-woocommerce-snackbar-close-transition-ms: 140;
  --specto-woocommerce-snackbar-hover-reveal-opacity: 0.4;
  --specto-woocommerce-snackbar-radius: var(
    --specto-ui-shape-radius-surface,
    var(--specto-ui-shape-radius-unit, 12px)
  );
  --specto-woocommerce-snackbar-bg: var(--specto-woocommerce-snackbar-neutral-bg);
  --specto-woocommerce-snackbar-fg: var(--specto-woocommerce-snackbar-neutral-fg);
  --specto-woocommerce-snackbar-action-fg: var(--specto-woocommerce-snackbar-neutral-action-fg);
  --specto-woocommerce-snackbar-close-hover-bg: var(
    --specto-woocommerce-snackbar-neutral-close-hover-bg
  );
  --specto-woocommerce-snackbar-close-active-bg: var(
    --specto-woocommerce-snackbar-neutral-close-active-bg
  );
  --specto-woocommerce-snackbar-neutral-bg: var(--sc-fil-str-neu-def, #292e3b);
  --specto-woocommerce-snackbar-neutral-fg: var(--sc-tex-lab-on-neu-def, #ffffff);
  --specto-woocommerce-snackbar-neutral-action-fg: var(--sc-tex-lab-on-neu-def, #ffffff);
  --specto-woocommerce-snackbar-neutral-close-hover-bg: var(--sc-fil-ove-neu-hov, #25303814);
  --specto-woocommerce-snackbar-neutral-close-active-bg: var(--sc-fil-ove-neu-act, #2530381a);
  --specto-woocommerce-snackbar-primary-bg: var(--sc-fil-str-pri-def, #9625ff);
  --specto-woocommerce-snackbar-primary-fg: var(--sc-tex-lab-on-pri-def, #ffffff);
  --specto-woocommerce-snackbar-primary-action-fg: var(--sc-tex-lab-on-pri-def, #ffffff);
  --specto-woocommerce-snackbar-primary-close-hover-bg: var(--sc-fil-ove-pri-hov, #ffffff14);
  --specto-woocommerce-snackbar-primary-close-active-bg: var(--sc-fil-ove-pri-act, #ffffff1a);
  --specto-woocommerce-snackbar-shadow: var(--specto-ui-elevation-m);
  --specto-woocommerce-snackbar-z-index: calc(var(--specto-tooltip-z-index, 999999) - 1);
}

html[data-specto-woocommerce-snackbar-position='top'] {
  --specto-woocommerce-snackbar-hidden-translate-y: -12px;
}

.woocommerce-notices-wrapper.specto-woocommerce-snackbar-wrapper {
  margin-bottom: 0 !important;
}

html.specto-ui-woocommerce-snackbar-pending
  .woocommerce-notices-wrapper
  > .woocommerce-message:not(.specto-woocommerce-snackbar) {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.woocommerce-notices-wrapper > .woocommerce-message.specto-woocommerce-snackbar {
  position: fixed;
  inset-inline-start: 50%;
  inset-block-start: auto;
  inset-block-end: calc(
    var(--specto-woocommerce-snackbar-bottom-offset) + var(--specto-woocommerce-snackbar-edge-y)
  );
  z-index: var(--specto-woocommerce-snackbar-z-index);
  inline-size: min(
    var(--specto-woocommerce-snackbar-max-width),
    calc(100vw - (var(--specto-woocommerce-snackbar-edge-x) * 2))
  );
  box-sizing: border-box;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: auto auto;
  align-items: start;
  column-gap: var(--specto-woocommerce-snackbar-content-gap);
  row-gap: var(--specto-woocommerce-snackbar-actions-gap);
  margin: 0;
  padding: var(--specto-woocommerce-snackbar-padding-block)
    var(--specto-woocommerce-snackbar-padding-inline);
  border: 0;
  border-radius: var(--specto-woocommerce-snackbar-radius);
  background: var(--specto-woocommerce-snackbar-bg);
  color: var(--specto-woocommerce-snackbar-fg);
  box-shadow: var(--specto-woocommerce-snackbar-shadow);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate3d(-50%, var(--specto-woocommerce-snackbar-hidden-translate-y), 0);
  transition:
    opacity calc(var(--specto-woocommerce-snackbar-transition-ms) * 1ms) ease,
    transform calc(var(--specto-woocommerce-snackbar-transition-ms) * 1ms) ease,
    visibility 0s linear calc(var(--specto-woocommerce-snackbar-transition-ms) * 1ms);
}

html[data-specto-woocommerce-snackbar-position='top']
  .woocommerce-notices-wrapper
  > .woocommerce-message.specto-woocommerce-snackbar {
  inset-block-start: calc(
    var(--specto-woocommerce-snackbar-bottom-offset) + var(--specto-woocommerce-snackbar-edge-y)
  );
  inset-block-end: auto;
}

.woocommerce-notices-wrapper
  > .woocommerce-message.specto-woocommerce-snackbar[data-specto-snackbar-variant='primary'] {
  --specto-woocommerce-snackbar-bg: var(--specto-woocommerce-snackbar-primary-bg);
  --specto-woocommerce-snackbar-fg: var(--specto-woocommerce-snackbar-primary-fg);
  --specto-woocommerce-snackbar-action-fg: var(
    --specto-woocommerce-snackbar-primary-action-fg
  );
  --specto-woocommerce-snackbar-close-hover-bg: var(
    --specto-woocommerce-snackbar-primary-close-hover-bg
  );
  --specto-woocommerce-snackbar-close-active-bg: var(
    --specto-woocommerce-snackbar-primary-close-active-bg
  );
}

.woocommerce-notices-wrapper
  > .woocommerce-message.specto-woocommerce-snackbar[data-specto-snackbar-has-actions='false'] {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: var(--specto-woocommerce-snackbar-content-gap);
  row-gap: 0;
}

.woocommerce-notices-wrapper > .woocommerce-message.specto-woocommerce-snackbar[aria-hidden='false'],
.woocommerce-notices-wrapper
  > .woocommerce-message.specto-woocommerce-snackbar[data-specto-snackbar-state='visible'] {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate3d(-50%, 0, 0);
  transition:
    opacity calc(var(--specto-woocommerce-snackbar-transition-ms) * 1ms) ease,
    transform calc(var(--specto-woocommerce-snackbar-transition-ms) * 1ms) ease,
    visibility 0s linear 0s;
}

.woocommerce-notices-wrapper
  > .woocommerce-message.specto-woocommerce-snackbar[data-specto-snackbar-state='leaving'] {
  opacity: 0;
  visibility: visible;
  pointer-events: none;
  transform: translate3d(-50%, var(--specto-woocommerce-snackbar-hidden-translate-y), 0);
}

.woocommerce-notices-wrapper
  > .woocommerce-message.specto-woocommerce-snackbar[data-specto-snackbar-state='queued'] {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate3d(-50%, var(--specto-woocommerce-snackbar-hidden-translate-y), 0);
}

@media (hover: hover) and (pointer: fine) {
  .woocommerce-notices-wrapper
    > .woocommerce-message.specto-woocommerce-snackbar[data-specto-snackbar-state='visible']:hover {
    opacity: var(--specto-woocommerce-snackbar-hover-reveal-opacity);
  }

  .woocommerce-notices-wrapper
    > .woocommerce-message.specto-woocommerce-snackbar[data-specto-snackbar-state='visible']:has(
      a:hover,
      button:hover
    ),
  .woocommerce-notices-wrapper
    > .woocommerce-message.specto-woocommerce-snackbar[data-specto-snackbar-state='visible']:focus-within {
    opacity: 1;
  }
}

.woocommerce-notices-wrapper > .woocommerce-message.specto-woocommerce-snackbar .specto-woocommerce-snackbar__content {
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
  font-family: var(--su-font-family-body, inherit);
  font-size: var(--su-font-size-body-s, 14px);
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: 0;
  white-space: pre-wrap;
  word-break: break-word;
}

.woocommerce-notices-wrapper
  > .woocommerce-message.specto-woocommerce-snackbar
  .specto-woocommerce-snackbar__actions {
  grid-column: 1 / -1;
  grid-row: 2;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--specto-woocommerce-snackbar-actions-gap);
  min-width: 0;
  justify-self: end;
}

.woocommerce-notices-wrapper
  > .woocommerce-message.specto-woocommerce-snackbar
  .specto-woocommerce-snackbar__actions[hidden] {
  display: none !important;
}

.woocommerce-notices-wrapper > .woocommerce-message.specto-woocommerce-snackbar a {
  color: var(--specto-woocommerce-snackbar-action-fg);
  text-decoration: none;
}

.woocommerce-notices-wrapper > .woocommerce-message.specto-woocommerce-snackbar .specto-woocommerce-snackbar__action {
  --specto-btn-height: var(--su-size-unit-s, 32px);
  --specto-btn-padding-inline: var(--su-space-unit-m, 8px);
  --specto-btn-gap: var(--su-space-unit-s, 4px);
  --specto-btn-font-size: var(--su-font-size-label-s, 12px);
  --specto-btn-icon-size: var(--su-size-unit-3xs, 16px);
  --su-btn-radius-all: var(--su-shape-btn-default-s, var(--su-radius-full));
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--specto-btn-gap);
  min-height: var(--specto-btn-height);
  padding-inline: var(--specto-btn-padding-inline);
  border-radius: var(--su-btn-radius-all);
  background: var(--sc-fil-ton-neu-def, #dfe2eb);
  color: var(--sc-tex-lab-neu-def, #292e3b);
  font-size: var(--specto-btn-font-size);
  font-weight: 500;
  line-height: 1;
  text-decoration: none;
}

.woocommerce-notices-wrapper
  > .woocommerce-message.specto-woocommerce-snackbar .specto-woocommerce-snackbar__action:hover {
  background: var(--sc-fil-ton-neu-hov, #d6dbe6);
}

.woocommerce-notices-wrapper
  > .woocommerce-message.specto-woocommerce-snackbar .specto-woocommerce-snackbar__action:active {
  background: var(--sc-fil-ton-neu-act, #c8cfdd);
}

.woocommerce-notices-wrapper > .woocommerce-message.specto-woocommerce-snackbar .specto-woocommerce-snackbar__close {
  position: absolute;
  inset-block-start: 0;
  inset-inline-end: 0;
  inline-size: 32px;
  block-size: 32px;
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: inherit;
  cursor: pointer;
  line-height: 0;
}

.woocommerce-notices-wrapper > .woocommerce-message.specto-woocommerce-snackbar .specto-woocommerce-snackbar__close::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: transparent;
  opacity: 0;
  transition: opacity calc(var(--specto-woocommerce-snackbar-close-transition-ms) * 1ms) ease;
  pointer-events: none;
}

.woocommerce-notices-wrapper
  > .woocommerce-message.specto-woocommerce-snackbar[data-specto-snackbar-has-actions='false']
  .specto-woocommerce-snackbar__content {
  flex: 1 1 auto;
}

.woocommerce-notices-wrapper
  > .woocommerce-message.specto-woocommerce-snackbar
  .specto-woocommerce-snackbar__close:hover::before {
  background: var(--specto-woocommerce-snackbar-close-hover-bg);
  opacity: 1;
}

.woocommerce-notices-wrapper
  > .woocommerce-message.specto-woocommerce-snackbar
  .specto-woocommerce-snackbar__close:active::before {
  background: var(--specto-woocommerce-snackbar-close-active-bg);
  opacity: 1;
}

.woocommerce-notices-wrapper
  > .woocommerce-message.specto-woocommerce-snackbar
  .specto-woocommerce-snackbar__close:focus-visible {
  outline: 2px solid var(--sc-bor-reg-pri-def, #9625ff);
  outline-offset: 2px;
}

.woocommerce-notices-wrapper
  > .woocommerce-message.specto-woocommerce-snackbar
  .specto-woocommerce-snackbar__close-icon {
  position: relative;
  z-index: 3;
  display: block;
  inline-size: 16px;
  block-size: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

@media (prefers-reduced-motion: reduce) {
  .woocommerce-notices-wrapper > .woocommerce-message.specto-woocommerce-snackbar {
    transition: none;
  }

  .woocommerce-notices-wrapper
    > .woocommerce-message.specto-woocommerce-snackbar .specto-woocommerce-snackbar__close {
    transition: none;
  }
}