/* Лоадер (пончик-спинер) */
.service-panel__loader {
  position: fixed;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  display: grid;
  place-items: center;

  opacity: 0;
  filter: blur(6px);

  transition:
    opacity .24s cubic-bezier(.16, 1, .3, 1) .16s,
    filter .24s cubic-bezier(.16, 1, .3, 1) .16s;
}

.popup.service-panel.is-loading .service-panel__loader {
  opacity: 1;
  filter: blur(0);
}

.service-panel__spinner {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 4px solid rgba(221, 185, 111, .22);
  border-bottom-color: rgb(221, 185, 111);

  animation: sp-rotate .85s linear infinite;

  box-shadow:
    0 10px 24px rgba(0,0,0,.18),
    0 0 0 1px rgba(221,185,111,.10),
    0 0 22px rgba(221,185,111,.14);
}

@keyframes sp-rotate {
  to { transform: rotate(360deg); }
}