/*
 * PhoneAuth 1.0.8 — isolated styles for kupibuket74.ru.
 * This file intentionally uses plain CSS syntax so it is valid SCSS too.
 * Critical form/checkbox rules are scoped by #phoneauth-root to win over
 * legacy global styles without changing anything outside the popup.
 */

#phoneauth-root.phoneauth {
  --pa-accent: #e39aa7;
  --pa-accent-hover: #d88998;
  --pa-accent-contrast: #ffffff;
  --pa-title: #123445;
  --pa-text: #282426;
  --pa-muted: #756d70;
  --pa-border: #ecdde0;
  --pa-surface: #ffffff;
  --pa-soft: #fff6f7;
  --pa-error: #b42335;
  --pa-shadow: 0 24px 70px rgba(42, 27, 31, .22);
  --pa-radius: 18px;
  --pa-control-radius: 12px;

  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483000 !important;
  display: block;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--pa-text) !important;
  font-family: inherit !important;
  font-size: 16px !important;
  line-height: 1.4 !important;
  text-align: left !important;
}

#phoneauth-root.phoneauth[hidden],
#phoneauth-root.phoneauth [hidden] {
  display: none !important;
}

#phoneauth-root.phoneauth,
#phoneauth-root.phoneauth *,
#phoneauth-root.phoneauth *::before,
#phoneauth-root.phoneauth *::after {
  box-sizing: border-box;
}

#phoneauth-root .phoneauth__backdrop {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: rgba(25, 18, 20, .48) !important;
  backdrop-filter: blur(3px);
}

#phoneauth-root .phoneauth__dialog {
  position: absolute !important;
  top: 50% !important;
  right: auto !important;
  bottom: auto !important;
  left: 50% !important;
  float: none !important;
  display: block !important;
  transform: translate(-50%, -50%) !important;
  width: min(440px, calc(100vw - 32px)) !important;
  min-width: 0 !important;
  max-width: 440px !important;
  height: auto !important;
  max-height: calc(100vh - 32px) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  margin: 0 !important;
  padding: 34px 34px 30px !important;
  border: 0 !important;
  border-radius: var(--pa-radius) !important;
  background: var(--pa-surface) !important;
  box-shadow: var(--pa-shadow) !important;
  color: var(--pa-text) !important;
  font-family: inherit !important;
  text-align: left !important;
  outline: 0 !important;
}

#phoneauth-root .phoneauth__view {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  position: static !important;
  float: none !important;
}

#phoneauth-root .phoneauth__close {
  appearance: none !important;
  -webkit-appearance: none !important;
  position: absolute !important;
  top: 12px !important;
  right: 14px !important;
  bottom: auto !important;
  left: auto !important;
  z-index: 2 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  float: none !important;
  width: 36px !important;
  min-width: 36px !important;
  max-width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--pa-muted) !important;
  font-family: inherit !important;
  font-size: 30px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

#phoneauth-root .phoneauth__close::before,
#phoneauth-root .phoneauth__close::after {
  content: none !important;
  display: none !important;
}

#phoneauth-root .phoneauth__eyebrow {
  display: block !important;
  width: auto !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  color: var(--pa-accent-hover) !important;
  font-family: inherit !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
}

#phoneauth-root .phoneauth__title {
  display: block !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 34px 10px 0 !important;
  padding: 0 !important;
  color: var(--pa-title) !important;
  font-family: inherit !important;
  font-size: 27px !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: 1.16 !important;
  letter-spacing: normal !important;
  text-align: left !important;
  text-transform: none !important;
}

#phoneauth-root .phoneauth__lead {
  display: block !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 0 24px !important;
  padding: 0 !important;
  color: var(--pa-muted) !important;
  font-family: inherit !important;
  font-size: 15px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  letter-spacing: normal !important;
  text-align: left !important;
  text-transform: none !important;
}

#phoneauth-root .phoneauth__lead strong {
  color: inherit !important;
  font: inherit !important;
  font-weight: 700 !important;
}

#phoneauth-root .phoneauth__form,
#phoneauth-root .phoneauth__registration-fields {
  position: static !important;
  float: none !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 12px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#phoneauth-root .phoneauth__label {
  position: static !important;
  float: none !important;
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 0 -5px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--pa-text) !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-style: normal !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  letter-spacing: normal !important;
  text-align: left !important;
  text-transform: none !important;
  white-space: normal !important;
}

#phoneauth-root .phoneauth__label::before,
#phoneauth-root .phoneauth__label::after {
  content: none !important;
  display: none !important;
}

#phoneauth-root .phoneauth__optional {
  position: static !important;
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--pa-muted) !important;
  font: inherit !important;
  font-weight: 400 !important;
}

#phoneauth-root input.phoneauth__input {
  appearance: none !important;
  -webkit-appearance: none !important;
  position: static !important;
  inset: auto !important;
  float: none !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  transform: none !important;
  clip: auto !important;
  clip-path: none !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  min-height: 48px !important;
  margin: 0 !important;
  padding: 11px 14px !important;
  border: 1px solid var(--pa-border) !important;
  border-radius: var(--pa-control-radius) !important;
  background: var(--pa-surface) !important;
  box-shadow: none !important;
  color: var(--pa-text) !important;
  font-family: inherit !important;
  font-size: 16px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
  letter-spacing: normal !important;
  text-align: left !important;
  text-transform: none !important;
  transition: border-color .15s ease, box-shadow .15s ease !important;
  outline: 0 !important;
}

#phoneauth-root input.phoneauth__input::placeholder {
  color: #9b9295 !important;
  opacity: 1 !important;
}

#phoneauth-root input.phoneauth__input:focus {
  border-color: var(--pa-accent) !important;
  box-shadow: 0 0 0 3px rgba(227, 154, 167, .22) !important;
  outline: 0 !important;
}

#phoneauth-root input.phoneauth__input--code {
  font-size: 22px !important;
  font-weight: 700 !important;
  letter-spacing: .15em !important;
  text-align: center !important;
}

/* Consent row is deliberately not a wrapping <label> to avoid legacy checkbox CSS. */
#phoneauth-root .phoneauth__consent {
  position: static !important;
  float: none !important;
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) !important;
  align-items: start !important;
  column-gap: 10px !important;
  row-gap: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  margin: 2px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--pa-muted) !important;
}

#phoneauth-root .phoneauth__consent-control {
  position: relative !important;
  inset: auto !important;
  float: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  margin: -3px 0 0 -4px !important;
  padding: 4px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  z-index: 3 !important;
  -webkit-tap-highlight-color: transparent !important;
  touch-action: manipulation !important;
}

#phoneauth-root .phoneauth__consent-control::before,
#phoneauth-root .phoneauth__consent-control::after {
  content: none !important;
  display: none !important;
}

#phoneauth-root input.phoneauth__consent-input[type="checkbox"] {
  appearance: none !important;
  -webkit-appearance: none !important;
  position: absolute !important;
  inset: 0 !important;
  float: none !important;
  display: block !important;
  visibility: visible !important;
  opacity: 0 !important;
  transform: none !important;
  clip: auto !important;
  clip-path: none !important;
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  z-index: 2 !important;
}

#phoneauth-root .phoneauth__checkbox-visual {
  position: relative !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 18px !important;
  min-width: 18px !important;
  height: 18px !important;
  min-height: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1.5px solid #c8bfc1 !important;
  border-radius: 4px !important;
  background: #fff !important;
  box-shadow: none !important;
  pointer-events: none !important;
  transition: background-color .14s ease, border-color .14s ease, box-shadow .14s ease !important;
}

#phoneauth-root input.phoneauth__consent-input[type="checkbox"]:checked + .phoneauth__checkbox-visual {
  border-color: var(--pa-accent-hover) !important;
  background: var(--pa-accent-hover) !important;
}

#phoneauth-root input.phoneauth__consent-input[type="checkbox"]:checked + .phoneauth__checkbox-visual::after {
  content: "" !important;
  position: absolute !important;
  display: block !important;
  left: 5px !important;
  top: 2px !important;
  width: 5px !important;
  height: 9px !important;
  border: solid #fff !important;
  border-width: 0 2px 2px 0 !important;
  transform: rotate(45deg) !important;
}

#phoneauth-root input.phoneauth__consent-input[type="checkbox"]:focus-visible + .phoneauth__checkbox-visual {
  outline: 2px solid var(--pa-accent-hover) !important;
  outline-offset: 2px !important;
}

#phoneauth-root .phoneauth__consent-label {
  position: static !important;
  inset: auto !important;
  float: none !important;
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--pa-muted) !important;
  font-family: inherit !important;
  font-size: 12px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
  letter-spacing: normal !important;
  text-align: left !important;
  text-indent: 0 !important;
  text-transform: none !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
  cursor: pointer !important;
}

#phoneauth-root input.phoneauth__consent-input + .phoneauth__consent-label::before,
#phoneauth-root input.phoneauth__consent-input + .phoneauth__consent-label::after,
#phoneauth-root .phoneauth__consent-label::before,
#phoneauth-root .phoneauth__consent-label::after {
  content: none !important;
  display: none !important;
  position: static !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
}

#phoneauth-root .phoneauth__consent-label a {
  display: inline !important;
  position: static !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  font: inherit !important;
  line-height: inherit !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 2px !important;
  cursor: pointer !important;
}

#phoneauth-root .phoneauth__error {
  position: static !important;
  display: block !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--pa-error) !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
  text-align: left !important;
}

#phoneauth-root .phoneauth__error:empty {
  display: none !important;
}

#phoneauth-root button.phoneauth__button {
  appearance: none !important;
  -webkit-appearance: none !important;
  position: static !important;
  float: none !important;
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  min-height: 50px !important;
  margin: 3px 0 0 !important;
  padding: 12px 18px !important;
  border: 0 !important;
  border-radius: var(--pa-control-radius) !important;
  background: var(--pa-accent) !important;
  box-shadow: none !important;
  color: var(--pa-accent-contrast) !important;
  font-family: inherit !important;
  font-size: 15px !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: normal !important;
  text-align: center !important;
  text-decoration: none !important;
  text-transform: none !important;
  cursor: pointer !important;
  transition: background .15s ease, opacity .15s ease !important;
}

#phoneauth-root button.phoneauth__button::before,
#phoneauth-root button.phoneauth__button::after {
  content: none !important;
  display: none !important;
}

#phoneauth-root button.phoneauth__button:hover {
  background: var(--pa-accent-hover) !important;
}

#phoneauth-root button.phoneauth__button:disabled {
  opacity: .58 !important;
  cursor: default !important;
}

#phoneauth-root button.phoneauth__link-button {
  appearance: none !important;
  -webkit-appearance: none !important;
  position: static !important;
  float: none !important;
  display: inline-block !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 5px 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--pa-muted) !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
  text-align: left !important;
  text-decoration: underline !important;
  text-transform: none !important;
  cursor: pointer !important;
}

#phoneauth-root button.phoneauth__link-button::before,
#phoneauth-root button.phoneauth__link-button::after {
  content: none !important;
  display: none !important;
}

#phoneauth-root button.phoneauth__link-button:disabled {
  opacity: .55 !important;
  cursor: default !important;
  text-decoration: none !important;
}

#phoneauth-root .phoneauth__fineprint {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--pa-muted) !important;
  font-family: inherit !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
  letter-spacing: normal !important;
  text-align: left !important;
  text-transform: none !important;
}

html.phoneauth-open,
body.phoneauth-open {
  overflow: hidden !important;
}

@media (max-width: 560px) {
  #phoneauth-root .phoneauth__dialog {
    top: auto !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    transform: none !important;
    width: 100% !important;
    max-width: none !important;
    max-height: 92vh !important;
    padding: 30px 20px calc(24px + env(safe-area-inset-bottom)) !important;
    border-radius: 20px 20px 0 0 !important;
  }

  #phoneauth-root .phoneauth__title {
    font-size: 24px !important;
  }

  #phoneauth-root .phoneauth__consent-label {
    font-size: 12px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #phoneauth-root.phoneauth *,
  #phoneauth-root.phoneauth *::before,
  #phoneauth-root.phoneauth *::after {
    transition: none !important;
    scroll-behavior: auto !important;
  }
}

/* Reverse Flash Call */
#phoneauth-root .phoneauth__reverse-box {
  display: grid !important;
  gap: 16px !important;
  width: 100% !important;
  margin: 20px 0 12px !important;
  padding: 20px !important;
  border: 1px solid rgba(49, 101, 97, .18) !important;
  border-radius: 20px !important;
  background: linear-gradient(180deg, #fbfefd 0%, #f4faf8 100%) !important;
  box-shadow: 0 10px 28px rgba(31, 76, 72, .06) !important;
  text-align: left !important;
}

#phoneauth-root .phoneauth__reverse-step {
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: start !important;
}

#phoneauth-root .phoneauth__reverse-step-index {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 50% !important;
  background: var(--pa-accent) !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

#phoneauth-root .phoneauth__reverse-step-index--status {
  background: rgba(49, 101, 97, .11) !important;
  position: relative !important;
}

#phoneauth-root .phoneauth__reverse-step-index--status > span {
  width: 9px !important;
  height: 9px !important;
  border-radius: 50% !important;
  background: var(--pa-accent) !important;
  box-shadow: 0 0 0 0 rgba(49, 101, 97, .28) !important;
  animation: phoneauth-reverse-pulse 1.7s ease-out infinite !important;
}

#phoneauth-root .phoneauth__reverse-step-title {
  margin: 1px 0 3px !important;
  color: var(--pa-title) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

#phoneauth-root .phoneauth__reverse-step-text {
  color: var(--pa-muted) !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
}

#phoneauth-root .phoneauth__reverse-number {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 17px 14px !important;
  border: 1px solid var(--pa-border) !important;
  border-radius: 15px !important;
  background: #fff !important;
  color: var(--pa-title) !important;
  font-family: inherit !important;
  font-size: clamp(25px, 6vw, 34px) !important;
  font-weight: 750 !important;
  line-height: 1.15 !important;
  letter-spacing: .01em !important;
  text-align: center !important;
  text-decoration: none !important;
  overflow-wrap: anywhere !important;
  cursor: default !important;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease !important;
}

#phoneauth-root a.phoneauth__reverse-number.is-ready {
  color: var(--pa-accent) !important;
  border-color: rgba(49, 101, 97, .34) !important;
  cursor: pointer !important;
}

#phoneauth-root a.phoneauth__reverse-number.is-ready:hover {
  border-color: var(--pa-accent) !important;
  box-shadow: 0 0 0 3px rgba(49, 101, 97, .08) !important;
  text-decoration: none !important;
}

#phoneauth-root a.phoneauth__button--call {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;
  width: 100% !important;
  min-height: 52px !important;
  margin: 0 !important;
  padding: 0 20px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: var(--pa-accent) !important;
  color: #fff !important;
  font-family: inherit !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  text-decoration: none !important;
  cursor: pointer !important;
  box-shadow: 0 8px 18px rgba(49, 101, 97, .16) !important;
}

#phoneauth-root a.phoneauth__button--call:hover {
  background: var(--pa-accent-hover) !important;
  color: #fff !important;
  text-decoration: none !important;
}

#phoneauth-root .phoneauth__call-icon {
  font-size: 18px !important;
  line-height: 1 !important;
}

#phoneauth-root .phoneauth__reverse-divider {
  height: 1px !important;
  background: rgba(49, 101, 97, .12) !important;
  margin: 1px 0 !important;
}

#phoneauth-root .phoneauth__reverse-status {
  color: var(--pa-muted) !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
}

#phoneauth-root .phoneauth__reverse-countdown {
  min-height: 17px !important;
  margin-top: 4px !important;
  color: var(--pa-accent) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.4 !important;
}

#phoneauth-root .phoneauth__reverse-countdown.is-expired {
  color: #a13b44 !important;
}

#phoneauth-root .phoneauth__reverse-note {
  margin: 0 0 10px !important;
  padding: 11px 13px !important;
  border-radius: 12px !important;
  background: #f6f4ef !important;
  color: var(--pa-muted) !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
}

#phoneauth-root .phoneauth__reverse-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px 16px !important;
  flex-wrap: wrap !important;
}

@keyframes phoneauth-reverse-pulse {
  0% { box-shadow: 0 0 0 0 rgba(49, 101, 97, .28); }
  70% { box-shadow: 0 0 0 8px rgba(49, 101, 97, 0); }
  100% { box-shadow: 0 0 0 0 rgba(49, 101, 97, 0); }
}

@media (max-width: 520px) {
  #phoneauth-root .phoneauth__reverse-box {
    padding: 16px !important;
    border-radius: 17px !important;
  }

  #phoneauth-root .phoneauth__reverse-number {
    font-size: 25px !important;
    padding: 15px 10px !important;
  }
}
