.r9-snackbar {
  z-index: 1060;
}
.r9-snackbar .r9-snackbar-component {
  position: fixed;
}
.r9-snackbar .r9-snackbar-component--top-center {
  top: 24px;
  left: 50%;
  right: auto;
  transform: translateX(-50%);
}
.r9-snackbar .r9-snackbar-component--top-left {
  top: 24px;
  left: 0;
  right: auto;
  margin: auto 24px;
}
.r9-snackbar .r9-snackbar-component--top-right {
  top: 24px;
  right: 0;
  left: auto;
  margin: auto 24px;
}
.r9-snackbar .r9-snackbar-component--bottom-center {
  bottom: 24px;
  left: 50%;
  right: auto;
  transform: translateX(-50%);
}
.r9-snackbar .r9-snackbar-component--bottom-left {
  bottom: 24px;
  left: 0;
  right: auto;
  margin: auto 24px;
}
.r9-snackbar .r9-snackbar-component--bottom-right {
  bottom: 24px;
  right: 0;
  left: auto;
  margin: auto 24px;
}
.r9-snackbar .r9-snackbar-component--wide {
  width: calc(100% - 48px);
}

.r9-snackbar-content {
  pointer-events: initial;
  position: relative;
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 12px;
  max-width: calc(100% - 48px);
  min-width: 320px;
  padding: 12px;
  padding-inline-end: 40px;
  background: white;
}

.r9-snackbar-content-action {
  margin-inline-start: auto;
}

.r9-snackbar-close {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  padding: 12px;
  cursor: pointer;
}
html[dir=rtl] .r9-snackbar-close {
  left: 0;
}
.r9-snackbar-close svg {
  width: 16px;
  height: 16px;
}
.r9-snackbar-close.disabled {
  opacity: 0.3;
  cursor: initial;
}