html {
  scroll-behavior: smooth;
}

body {
  overflow-x: hidden;
  font-family: 'Manrope', sans-serif;
}

body.loading {
  overflow: hidden;
}

#preloader {
  z-index: 99999;
}

.fixed {
  position: fixed;
}

.inset-0 {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.flex {
  display: flex;
}

.items-center {
  align-items: center;
}

.justify-center {
  justify-content: center;
}

.bg-white {
  background-color: #ffffff;
}

.border-yellow-400 {
  border-color: #facc15;
}

.border-t-transparent {
  border-top-color: transparent;
  border-style: solid;
}

.border-4 {
  border-width: 4px;
}

.rounded-full {
  border-radius: 9999px;
}

.w-12 {
  width: 3rem;
}

.h-12 {
  height: 3rem;
}

.opacity-1 {
  opacity: 1;
}

.pointer-events-auto {
  pointer-events: auto;
}

.transition-opacity {
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.duration-300 {
  transition-duration: 300ms;
}

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

.animate-spin {
  animation: spin 1s linear infinite;
}

#orderProgressBarWrapper {
  z-index: 9998;
}

.base-timer__path-elapsed {
  fill: none;
  stroke: #fefce8;
  stroke-width: 7px;
}

.base-timer__path-remaining {
  fill: none;
  stroke: currentColor;
  stroke-width: 7px;
  stroke-linecap: butt;
  transform: rotate(90deg);
  transform-origin: center;
  transition: stroke-dasharray 1s linear;
}

.base-timer__label {
  font-family: monospace;
}

.transition-opacity {
  transition: opacity 0.3s ease;
}

.fade-in {
  opacity: 1;
  transition: opacity 0.3s ease-in;
}

.fade-out {
  opacity: 0;
  transition: opacity 0.3s ease-out;
}

.btn-loader {
  position: relative;
  color: transparent !important;
  pointer-events: none;
}

.btn-loader::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 20px;
  margin: -10px 0 0 -10px;
  border: 3px solid #232323;
  border-top-color: transparent;
  border-radius: 50%;
  animation: spin 0.6s linear infinite;
  z-index: 10;
}

#orderStatusCard {
  background-image: linear-gradient(to right, rgba(234, 179, 8, 0.3), transparent 40%);
}

#orderStatusCard.status-error {
  background-image: linear-gradient(to right, rgba(239, 68, 68, 0.3), transparent 40%);
}

#orderStatusCard.status-success {
  background-image: linear-gradient(to right, rgba(34, 197, 94, 0.4), transparent 40%);
}

@keyframes spin {
  0% { transform: rotate(0); }
  100% { transform: rotate(360deg); }
}

.copy-tooltip::after {
  content: "";
  position: absolute;
  top: 100%; /* снизу тултипа */
  left: 50%;
  transform: translateX(-50%);
  border-width: 6px;
  border-style: solid;
  border-color: black transparent transparent transparent;
}

/* Анимация */
.animate-scroll-rate {
  animation: scroll-rate 100s linear infinite;
}

@keyframes scroll-rate {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-50%);
  }
}

/* Обёртка */
.logo-marquee {
  overflow: hidden;
  width: 100%;
}

/* Трек */
.marquee-track {
  display: flex;
  width: max-content;
  animation: scroll-rate 60s linear infinite;
}

/* Контент с логотипами */
.marquee-content {
  display: flex;
  gap: 3rem;
  align-items: center;
}

.footer {
  background-color: rgba(253, 224, 71, 0.1);
}

#loadingSpinner {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.header {
  position: relative;
  z-index: 1;
}

@keyframes bee-buzz {
  0%   { transform: translateY(0) rotate(15deg); }
  20%  { transform: translateY(-2px) rotate(17deg); }
  40%  { transform: translateY(2px) rotate(13deg); }
  60%  { transform: translateY(-1px) rotate(16deg); }
  80%  { transform: translateY(1px) rotate(14deg); }
  100% { transform: translateY(0) rotate(15deg); }
}

.bee-hover-buzz {
  transition: transform 0.3s ease;
}

a:hover .bee-hover-buzz {
  animation: bee-buzz 0.6s ease-in-out;
}

.fade-in {
  opacity: 1;
  transform: translateY(0);
  transition: all 0.5s ease-in-out;
}

.fade-out {
  opacity: 0;
  transform: translateY(10px);
  transition: all 0.5s ease-in-out;
}

#ratesTable tr:not(.bg-yellow-50):hover {
  background-color: #f9fafb; /* gray-50 */
}