/* LYTL Immersive Builder MASTER 1.0 — floating-audio-button.css — consolidated canonical styles */

.elementor-widget-lytl_floating_audio_button:has(.lytl-floating-audio.is-overlay) {
  position: absolute;
  margin: 0 !important;
  width: auto !important;
  max-width: none !important;
}

.lytl-floating-audio {
  --fab-size: 92px;
  --fab-spin-speed: 7s;
  --fab-spin-direction: normal;
  --fab-float: 6px;
  --fab-float-speed: 3.2s;
  --fab-hover-scale: 1.08;
  --fab-art-opacity: 100%;
  --fab-icon: #b866e2;
  --fab-bg: transparent;
  --fab-border: transparent;
  --fab-border-width: 0px;
  --fab-radius: 50%;
  --fab-glow: #bd66f0;
  --fab-glow-size: 14px;
  position: relative;
  display: inline-grid;
  place-items: center;
  width: var(--fab-size);
  height: var(--fab-size);
  overflow: visible;
}

.lytl-floating-audio__button {
  position: relative;
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  padding: 0;
  border: var(--fab-border-width) solid var(--fab-border);
  border-radius: var(--fab-radius);
  background: var(--fab-bg);
  cursor: pointer;
  overflow: visible;
  filter: drop-shadow(0 0 var(--fab-glow-size) color-mix(in srgb,var(--fab-glow) 62%,transparent));
  transition: transform .18s ease,filter .2s ease;
}

.lytl-floating-audio__button:focus-visible {
  outline: 2px solid color-mix(in srgb,var(--fab-glow) 86%,white);
  outline-offset: 5px;
}

.lytl-floating-audio__button:hover,
.lytl-floating-audio__button:focus-visible {
  transform: scale(var(--fab-hover-scale));
}

.lytl-floating-audio__art {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  opacity: var(--fab-art-opacity);
  transform-style: preserve-3d;
  will-change: transform;
}

.lytl-floating-audio__art img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
}

.lytl-floating-audio__art i,
.lytl-floating-audio__art svg {
  width: 70%;
  height: 70%;
  color: var(--fab-icon);
  fill: currentColor;
}

.lytl-floating-audio__text {
  color: var(--fab-icon);
  font: 800 calc(var(--fab-size) * .58)/1 Inter,system-ui,sans-serif;
}

.lytl-floating-audio.spin-always .lytl-floating-audio__art {
  animation: lytlFabSpin var(--fab-spin-speed) linear infinite;
  animation-direction: var(--fab-spin-direction);
}

.lytl-floating-audio.spin-playing.is-playing .lytl-floating-audio__art {
  animation: lytlFabSpin var(--fab-spin-speed) linear infinite;
  animation-direction: var(--fab-spin-direction);
}

.lytl-floating-audio.spin-hover .lytl-floating-audio__button:hover .lytl-floating-audio__art,
.lytl-floating-audio.spin-hover .lytl-floating-audio__button:focus-visible .lytl-floating-audio__art {
  animation: lytlFabSpin var(--fab-spin-speed) linear infinite;
  animation-direction: var(--fab-spin-direction);
}

.lytl-floating-audio.has-float {
  animation: lytlFabFloat var(--fab-float-speed) ease-in-out infinite;
}

.lytl-floating-audio__state {
  position: absolute;
  inset: -7%;
  border-radius: 50%;
  border: 2px solid transparent;
  opacity: 0;
  pointer-events: none;
}

.lytl-floating-audio.has-play-state.is-playing .lytl-floating-audio__state {
  opacity: 1;
  border-color: color-mix(in srgb,var(--fab-glow) 72%,transparent);
  box-shadow: 0 0 18px color-mix(in srgb,var(--fab-glow) 65%,transparent);
  animation: lytlFabPulse 1.5s ease-in-out infinite;
}

.lytl-floating-audio.is-playing .lytl-floating-audio__button {
  filter: drop-shadow(0 0 calc(var(--fab-glow-size) * 1.35) color-mix(in srgb,var(--fab-glow) 82%,transparent));
}

@keyframes lytlFabSpin {from{transform:rotateY(0deg)}
  to{transform:rotateY(360deg)}}

@keyframes lytlFabFloat {0%,100%{translate:0 0}
  50%{translate:0 calc(var(--fab-float) * -1)}}

@keyframes lytlFabPulse {0%,100%{transform:scale(.96);opacity:.55}
  50%{transform:scale(1.06);opacity:1}}

@media (prefers-reduced-motion:reduce) {
.lytl-floating-audio,
  .lytl-floating-audio__art,
  .lytl-floating-audio__state {
  animation: none !important;
}
}
