.b-push-subscription-banner {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 10000;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  gap: 10px;
  padding: 10px 45px;
  font: normal normal 400 14px/16px Arial, sans-serif;
  color: #000;
  background: #fff;
  border: none;
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.25);
  transform: translateY(100%);
  transition: transform 0.6s;
  cursor: pointer;
  pointer-events: none;
}

.b-push-subscription-banner--active {
  transform: translateY(0);
  pointer-events: auto;
}

.b-push-subscription-banner__icon {
  display: flex;
  width: 24px;
  height: 24px;
  color: #ca0f09;
  transform-origin: 50% 4px;
  animation: ring 4s 0.7s ease-in-out infinite;
}

.b-push-subscription-banner__dismiss-btn {
  position: absolute;
  top: 50%;
  right: 15px;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  min-height: 30px;
  margin: 0 0 0 auto;
  padding: 0;
  font: inherit;
  color: #000;
  background: none;
  border: none;
  cursor: pointer;
}

.b-push-subscription-banner__dismiss-btn svg {
  display: block;
  width: 24px;
  height: 24px;
}

@media (max-width: 640px) {
}

@keyframes ring {
  0% {
    transform: rotate(0);
  }
  1% {
    transform: rotate(30deg);
  }
  3% {
    transform: rotate(-28deg);
  }
  5% {
    transform: rotate(34deg);
  }
  7% {
    transform: rotate(-32deg);
  }
  9% {
    transform: rotate(30deg);
  }
  11% {
    transform: rotate(-28deg);
  }
  13% {
    transform: rotate(26deg);
  }
  15% {
    transform: rotate(-24deg);
  }
  17% {
    transform: rotate(22deg);
  }
  19% {
    transform: rotate(-20deg);
  }
  21% {
    transform: rotate(18deg);
  }
  23% {
    transform: rotate(-16deg);
  }
  25% {
    transform: rotate(14deg);
  }
  27% {
    transform: rotate(-12deg);
  }
  29% {
    transform: rotate(10deg);
  }
  31% {
    transform: rotate(-8deg);
  }
  33% {
    transform: rotate(6deg);
  }
  35% {
    transform: rotate(-4deg);
  }
  37% {
    transform: rotate(2deg);
  }
  39% {
    transform: rotate(-1deg);
  }
  41% {
    transform: rotate(1deg);
  }

  43% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(0);
  }
}
