.dsp-catalogue-loader {
  display: grid;
  justify-items: center;
  gap: 5px;
  min-height: 168px;
  padding: 24px 16px;
  color: #527066;
  text-align: center;
}

.dsp-catalogue-loader > strong {
  color: #174b3a;
  font-size: 13px;
  font-weight: 650;
}

.dsp-catalogue-loader > small {
  color: #7a9087;
  font-size: 9px;
}

.dsp-loader-phone {
  position: relative;
  display: block;
  width: 48px;
  height: 66px;
  margin-bottom: 3px;
  border: 3px solid #11835e;
  border-radius: 12px;
  background: linear-gradient(155deg, #edfff5 0%, #c9f4dc 100%);
  box-shadow: 0 10px 24px rgba(17, 131, 94, .16);
  animation: dspLoaderPhoneBob 1.25s ease-in-out infinite;
}

.dsp-loader-phone::before,
.dsp-loader-phone::after {
  content: "";
  position: absolute;
  top: 25px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #11835e;
}

.dsp-loader-phone::before { left: 11px; }
.dsp-loader-phone::after { right: 11px; }

.dsp-loader-phone > i {
  position: absolute;
  left: 50%;
  top: 39px;
  width: 15px;
  height: 7px;
  border-bottom: 2px solid #11835e;
  border-radius: 0 0 12px 12px;
  transform: translateX(-50%);
}

.dsp-loader-phone > b {
  position: absolute;
  left: 50%;
  bottom: 5px;
  width: 12px;
  height: 3px;
  border-radius: 999px;
  background: rgba(17, 131, 94, .45);
  transform: translateX(-50%);
}

.dsp-catalogue-loader > em {
  display: flex;
  gap: 5px;
  margin-top: 2px;
}

.dsp-catalogue-loader > em i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #78c900;
  animation: dspLoaderDot 1s ease-in-out infinite;
}

.dsp-catalogue-loader > em i:nth-child(2) { animation-delay: .14s; }
.dsp-catalogue-loader > em i:nth-child(3) { animation-delay: .28s; }

.dsp-handset-price-status:has(.dsp-catalogue-loader) {
  margin: 0 !important;
}

.dsp-sellout-status.is-delivered {
  background: #eaf2ff !important;
  color: #3266a8 !important;
}

.dsp-sellout-deliver-form {
  grid-template-columns: minmax(0, 1fr) auto !important;
}

.dsp-sellout-deliver-form button {
  background: #3266a8 !important;
}

@keyframes dspLoaderPhoneBob {
  0%, 100% { transform: translateY(0) rotate(-1deg); }
  50% { transform: translateY(-7px) rotate(1deg); }
}

@keyframes dspLoaderDot {
  0%, 70%, 100% { opacity: .28; transform: translateY(0); }
  35% { opacity: 1; transform: translateY(-3px); }
}

@media (max-width: 760px) {
  .dsp-catalogue-loader {
    min-height: 190px;
    padding-top: 34px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dsp-loader-phone,
  .dsp-catalogue-loader > em i {
    animation: none;
  }
}