.ri-floating-icons {
  --ri-fi-radius: 999px;
  --ri-fi-amplitude: 8px;
  --ri-fi-duration: 3.6s;
  display: inline-flex;
  gap: 16px;
}

.ri-floating-icons--vertical,
.ri-floating-icons--vertical .ri-floating-icons__children {
  flex-direction: column;
}

.ri-floating-icons--horizontal,
.ri-floating-icons--horizontal .ri-floating-icons__children {
  flex-direction: row;
  flex-wrap: wrap;
}

.ri-floating-icons--fixed {
  position: fixed;
  z-index: 40;
}

.ri-floating-icons--fixed.ri-floating-icons--side-left {
  left: var(--ri-fi-offset-x, 16px);
}

.ri-floating-icons--fixed.ri-floating-icons--side-right {
  right: var(--ri-fi-offset-x, 16px);
}

.ri-floating-icons--fixed.ri-floating-icons--v-top {
  top: var(--ri-fi-offset-y, 90px);
}

.ri-floating-icons--fixed.ri-floating-icons--v-middle {
  top: var(--ri-fi-offset-y, 50%);
  transform: translateY(-50%);
}

.ri-floating-icons--fixed.ri-floating-icons--v-bottom {
  bottom: var(--ri-fi-offset-y, 24px);
}

.ri-floating-icons__children {
  display: inline-flex;
  gap: inherit;
}

.ri-floating-icons__item {
  position: relative;
}

.ri-floating-icons__link,
.ri-floating-icons__trigger {
  --ri-fi-item-bg: #243c8f;
  --ri-fi-item-color: #ffffff;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  width: 58px;
  min-width: 58px;
  height: 58px;
  border: 0;
  border-radius: var(--ri-fi-radius);
  background: var(--ri-fi-item-bg);
  color: var(--ri-fi-item-color);
  transition: transform .25s ease, box-shadow .25s ease, background-color .25s ease, color .25s ease, opacity .25s ease;
  overflow: visible;
  cursor: pointer;
}

.ri-floating-icons__link:hover,
.ri-floating-icons__link:focus-visible,
.ri-floating-icons__trigger:hover,
.ri-floating-icons__trigger:focus-visible {
  transform: translateY(-3px) scale(1.04);
}

.ri-floating-icons__icon,
.ri-floating-icons__icon i,
.ri-floating-icons__icon svg,
.ri-floating-icons__trigger-icon,
.ri-floating-icons__trigger-icon i,
.ri-floating-icons__trigger-icon svg,
.ri-floating-icons__trigger-mini,
.ri-floating-icons__trigger-mini i,
.ri-floating-icons__trigger-mini svg {
  width: 24px;
  height: 24px;
  font-size: 24px;
  line-height: 1;
  color: inherit;
  fill: currentColor;
}

.ri-floating-icons__icon,
.ri-floating-icons__trigger-icon,
.ri-floating-icons__trigger-mini {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.ri-floating-icons__trigger-preview {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px 6px;
  width: 70%;
  max-width: 34px;
}

.ri-floating-icons__trigger-preview .ri-floating-icons__trigger-mini,
.ri-floating-icons__trigger-preview .ri-floating-icons__trigger-mini i,
.ri-floating-icons__trigger-preview .ri-floating-icons__trigger-mini svg {
  width: 14px;
  height: 14px;
  font-size: 14px;
}

.ri-floating-icons__label {
  position: absolute;
  left: calc(100% + 12px);
  top: 50%;
  transform: translateY(-50%);
  white-space: nowrap;
  background: #fff;
  color: #0f172a;
  padding: 10px 14px;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .12);
  opacity: 1;
  visibility: visible;
  transition: opacity .25s ease, visibility .25s ease, transform .25s ease;
}

.ri-floating-icons--side-right .ri-floating-icons__label {
  left: auto;
  right: calc(100% + 12px);
}

.ri-floating-icons--labels-hover .ri-floating-icons__label {
  opacity: 0;
  visibility: hidden;
  transform: translateY(-50%) translateX(-6px);
}

.ri-floating-icons--side-right.ri-floating-icons--labels-hover .ri-floating-icons__label {
  transform: translateY(-50%) translateX(6px);
}

.ri-floating-icons--labels-hover .ri-floating-icons__link:hover .ri-floating-icons__label,
.ri-floating-icons--labels-hover .ri-floating-icons__link:focus-visible .ri-floating-icons__label {
  opacity: 1;
  visibility: visible;
  transform: translateY(-50%) translateX(0);
}

.ri-floating-icons--no-labels .ri-floating-icons__label {
  display: none;
}

.ri-floating-icons--animated .ri-floating-icons__link,
.ri-floating-icons--animated .ri-floating-icons__trigger {
  animation: riFloatingIcon var(--ri-fi-duration) ease-in-out infinite;
}

.ri-floating-icons--animated.is-open .ri-floating-icons__trigger {
  animation-play-state: paused;
}

@keyframes riFloatingIcon {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(calc(var(--ri-fi-amplitude) * -1)); }
}

.ri-floating-icons--toggle .ri-floating-icons__children .ri-floating-icons__item {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: scale(.82) translateY(8px);
  transition: opacity .28s ease, transform .28s ease, visibility .28s ease;
}

.ri-floating-icons--toggle.is-open .ri-floating-icons__children .ri-floating-icons__item {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: scale(1) translateY(0);
}

.ri-floating-icons--toggle .ri-floating-icons__children .ri-floating-icons__item:nth-child(1) { transition-delay: .02s; }
.ri-floating-icons--toggle .ri-floating-icons__children .ri-floating-icons__item:nth-child(2) { transition-delay: .05s; }
.ri-floating-icons--toggle .ri-floating-icons__children .ri-floating-icons__item:nth-child(3) { transition-delay: .08s; }
.ri-floating-icons--toggle .ri-floating-icons__children .ri-floating-icons__item:nth-child(4) { transition-delay: .11s; }
.ri-floating-icons--toggle .ri-floating-icons__children .ri-floating-icons__item:nth-child(5) { transition-delay: .14s; }
.ri-floating-icons--toggle .ri-floating-icons__children .ri-floating-icons__item:nth-child(6) { transition-delay: .17s; }

.ri-floating-icons--toggle .ri-floating-icons__children {
  overflow: visible;
}

.ri-hide-desktop {
  display: none;
}

@media (max-width: 1024px) {
  .ri-hide-desktop { display: inline-flex; }
  .ri-hide-tablet { display: none; }
}

@media (max-width: 767px) {
  .ri-hide-mobile { display: none; }
  .ri-floating-icons__label {
    font-size: 12px;
    padding: 8px 10px;
  }
}
