.bbgb-btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none !important;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
  font-family: var(--bbgb-font);
  font-size: var(--bbgb-fs, 24px);
  letter-spacing: var(--bbgb-ls, 0.4px);
  font-weight: 700;
  padding: var(--bbgb-py, 18px) var(--bbgb-px, 40px);
  border-radius: var(--bbgb-radius, 999px);
  color: var(--bbgb-t1);
  background: linear-gradient(135deg, var(--bbgb-c1), var(--bbgb-c2));
  transform: translateZ(0);
  transition: box-shadow .28s ease, filter .28s ease, color .2s ease;
  box-shadow: 0 10px 22px rgba(0,0,0,.18);
  overflow:hidden;
  isolation:isolate;
}

.bbgb-btn:hover,
.bbgb-btn:focus,
.bbgb-btn:active{
  text-decoration:none !important; /* no underline ever */
}

.bbgb-btn .bbgb-content{
  position:relative;
  z-index:4;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transform: translateZ(0);
}
.bbgb-btn .bbgb-inner{
  text-decoration:none !important;
  transition: transform .28s ease, color .2s ease, filter .28s ease;
}

/* Soft ambient shine (kept) */
.bbgb-btn .bbgb-shine{
  position:absolute;
  inset:-40% -60%;
  z-index:2;
  opacity: calc(var(--bbgb-shine) * 1);
  background: radial-gradient(circle at 20% 30%, rgba(255,255,255,.42), rgba(255,255,255,0) 55%);
  transform: rotate(12deg) translateX(-35%);
  transition: transform .45s ease, opacity .28s ease;
  pointer-events:none;
  mix-blend-mode: screen;
}

/* Sweep "glow line" (blur line that flies over the button on hover) */
.bbgb-btn .bbgb-sweep{
  position:absolute;
  top:-30%;
  left:-55%;
  width: 55%;
  height: 160%;
  z-index:3;
  opacity: 0;
  pointer-events:none;
  transform: skewX(-18deg) translateX(0);
  background: linear-gradient(90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,0.10) 30%,
    rgba(255,255,255,0.55) 50%,
    rgba(255,255,255,0.10) 70%,
    rgba(255,255,255,0) 100%);
  filter: blur(6px);
  mix-blend-mode: screen;
}

/* Continuous wobble loop (whole button) */
@keyframes bbgb_idle_wobble_btn {
  0%   { transform: rotate(0deg); }
  20%  { transform: rotate(calc(var(--bbgb-wobble) * 0.9)); }
  40%  { transform: rotate(calc(var(--bbgb-wobble) * -0.8)); }
  60%  { transform: rotate(calc(var(--bbgb-wobble) * 0.6)); }
  80%  { transform: rotate(calc(var(--bbgb-wobble) * -0.4)); }
  100% { transform: rotate(0deg); }
}
.bbgb-btn[data-wobble="1"]{
  animation: bbgb_idle_wobble_btn var(--bbgb-wobble-speed) ease-in-out infinite;
  transform-origin: 50% 55%;
}

/* Hover wobble (includes lift + scale + rotate) */
@keyframes bbgb_hover_wobble_btn {
  0%   { transform: translateY(calc(var(--bbgb-lift) * -1)) scale(var(--bbgb-hover-scale)) rotate(0deg); }
  20%  { transform: translateY(calc(var(--bbgb-lift) * -1)) scale(var(--bbgb-hover-scale)) rotate(calc(var(--bbgb-wobble) * 0.9)); }
  40%  { transform: translateY(calc(var(--bbgb-lift) * -1)) scale(var(--bbgb-hover-scale)) rotate(calc(var(--bbgb-wobble) * -0.8)); }
  60%  { transform: translateY(calc(var(--bbgb-lift) * -1)) scale(var(--bbgb-hover-scale)) rotate(calc(var(--bbgb-wobble) * 0.6)); }
  80%  { transform: translateY(calc(var(--bbgb-lift) * -1)) scale(var(--bbgb-hover-scale)) rotate(calc(var(--bbgb-wobble) * -0.4)); }
  100% { transform: translateY(calc(var(--bbgb-lift) * -1)) scale(var(--bbgb-hover-scale)) rotate(0deg); }
}
.bbgb-btn:hover[data-wobble="1"]{
  animation-name: bbgb_hover_wobble_btn;
  animation-duration: var(--bbgb-wobble-hover-speed);
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}

.bbgb-btn:hover{
  color: var(--bbgb-t2);
  box-shadow:
    0 var(--bbgb-shadow-y) var(--bbgb-shadow-spread) rgba(var(--bbgb-shadow-rgb), var(--bbgb-shadow-a)),
    0 10px 22px rgba(0,0,0,.16);
  filter: saturate(1.05);
}
.bbgb-btn:hover .bbgb-inner{
  transform: scale(var(--bbgb-inner-scale));
}
.bbgb-btn:hover .bbgb-shine{
  transform: rotate(12deg) translateX(12%);
  opacity: calc(var(--bbgb-shine) * 1);
}

/* Trigger sweep on hover, uses speed variable */
@keyframes bbgb_sweep {
  0%   { transform: skewX(-18deg) translateX(-10%); opacity: 0; }
  15%  { opacity: calc(var(--bbgb-shine) * 1); }
  100% { transform: skewX(-18deg) translateX(340%); opacity: 0; }
}
.bbgb-btn:hover .bbgb-sweep{
  animation: bbgb_sweep var(--bbgb-shine-speed) ease-out 1;
  opacity: calc(var(--bbgb-shine) * 1);
}

.bbgb-btn:active{
  transform: translateY(0) scale(calc(var(--bbgb-hover-scale) - 0.02));
  animation: none; /* pressed should feel stable */
}

/* Glow toggle via drop-shadow */
.bbgb-btn{
  filter: drop-shadow(0 0 0 rgba(0,0,0,0));
}
.bbgb-btn:hover{
  filter:
    drop-shadow(0 0 calc(var(--bbgb-glow) * 16px) rgba(var(--bbgb-shadow-rgb), calc(var(--bbgb-shadow-a) * .8)))
    saturate(1.05);
}

/* Accessibility: reduce motion */
@media (prefers-reduced-motion: reduce){
  .bbgb-btn, .bbgb-btn *{ transition:none !important; animation:none !important; }
}


/* Disable hover animations (zoom/shadow/sweep/shine/wobble-on-hover) */
.bbgb-btn[data-nohover="1"]:hover{
  animation: none !important;
  transform: none !important;
  filter: none !important;
}
.bbgb-btn[data-nohover="1"]:hover .bbgb-inner{
  transform: none !important;
}
.bbgb-btn[data-nohover="1"]:hover .bbgb-sweep,
.bbgb-btn[data-nohover="1"]:hover .bbgb-shine{
  animation: none !important;
  transform: none !important;
  opacity: 0 !important;
}



/* Disable shadow completely (overrides all hover/filters including drop-shadow) */
.bbgb-btn[data-noshadow="1"],
.bbgb-btn[data-noshadow="1"]:hover,
.bbgb-btn[data-noshadow="1"]:focus,
.bbgb-btn[data-noshadow="1"]:active{
  box-shadow: none !important;
  filter: none !important;
}