/* =========================
   Скроллбар сайта
========================= */

::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  background: #f5f1ef;
}

::-webkit-scrollbar-thumb {
  background: #8b0f19;
  border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
  background: #6f0b13;
}

html {
  scrollbar-color: #8b0f19 #f5f1ef;
  scrollbar-width: thin;
}


/* =========================
   Круглая фиксированная кнопка
========================= */

.fixed-price-btn {
  position: fixed;
  right: 30px;
  bottom: 30px;
  z-index: 99999;

  width: 74px;
  height: 74px;

  display: flex;
  align-items: center;
  justify-content: center;

  background: #8b0f19;
  color: #ffffff !important;

  border-radius: 50%;
  text-decoration: none !important;

  box-shadow: 0 12px 34px rgba(139, 15, 25, 0.38);
  transition: all 0.25s ease;
}

/* Пульсирующий круг */
.fixed-price-btn::before {
  content: "";
  position: absolute;
  inset: -8px;

  border: 1px solid rgba(139, 15, 25, 0.45);
  border-radius: 50%;

  animation: pricePulse 1.8s infinite;
}

/* Внутренняя подсветка */
.fixed-price-btn::after {
  content: "";
  position: absolute;
  inset: 7px;

  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.22);

  pointer-events: none;
}

/* Иконка */
.fixed-price-btn__icon {
  position: relative;
  z-index: 2;

  width: 31px;
  height: 31px;

  display: flex;
  align-items: center;
  justify-content: center;
}

.fixed-price-btn__icon svg {
  width: 31px;
  height: 31px;
  display: block;
}

/* Подпись рядом с кнопкой */
.fixed-price-btn__text {
  position: absolute;
  right: 88px;
  top: 50%;
  transform: translateY(-50%) translateX(10px);

  min-width: 185px;
  padding: 12px 16px;

  background: #ffffff;
  color: #111111;

  border-radius: 14px;

  font-family: Manrope, Arial, sans-serif;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;

  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12);

  opacity: 0;
  visibility: hidden;
  transition: all 0.25s ease;
}

/* Маленький треугольник у подписи */
.fixed-price-btn__text::after {
  content: "";
  position: absolute;
  right: -7px;
  top: 50%;
  transform: translateY(-50%);

  width: 0;
  height: 0;

  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  border-left: 7px solid #ffffff;
}

/* Hover */
.fixed-price-btn:hover {
  background: #6f0b13;
  color: #ffffff !important;
  transform: translateY(-3px) scale(1.03);
  box-shadow: 0 16px 40px rgba(139, 15, 25, 0.45);
}

.fixed-price-btn:hover .fixed-price-btn__text {
  opacity: 1;
  visibility: visible;
  transform: translateY(-50%) translateX(0);
}

.fixed-price-btn:active {
  transform: translateY(0) scale(0.98);
}

/* Анимация пульсации */
@keyframes pricePulse {
  0% {
    transform: scale(0.92);
    opacity: 0.7;
  }

  70% {
    transform: scale(1.22);
    opacity: 0;
  }

  100% {
    transform: scale(1.22);
    opacity: 0;
  }
}


/* =========================
   Мобильная версия
========================= */

@media (max-width: 768px) {
  .fixed-price-btn {
    right: 18px;
    bottom: 18px;

    width: 64px;
    height: 64px;
  }

  .fixed-price-btn__icon {
    width: 27px;
    height: 27px;
  }

  .fixed-price-btn__icon svg {
    width: 27px;
    height: 27px;
  }

  .fixed-price-btn__text {
    display: none;
  }
}
</style>