.ahab-wrap{display:flex;flex-direction:column;margin:0;clear:both;width:100%;flex:0 0 100%;box-sizing:border-box}
.ahab-row{display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch;column-gap:10px;row-gap:10px;width:100%;box-sizing:border-box}
.ahab-btn{
	display:inline-flex;align-items:center;justify-content:center;gap:10px;box-sizing:border-box;
	width:100%;max-width:100%;min-height:var(--h,46px);padding:0 18px;margin:0;
	background:var(--bg,#111);color:var(--fg,#fff)!important;
	font-size:var(--fs,16px);font-weight:var(--fw,600);line-height:1.2;
	border-radius:var(--r,6px);text-decoration:none!important;border:0;cursor:pointer;
	transition:transform .15s ease,box-shadow .15s ease,background .15s ease,color .15s ease;
}
.ahab-btn[data-w="50"]{width:calc(50% - 5px)}
.ahab-btn[data-w="33"]{width:calc(33.333% - 6.667px)}
.ahab-btn[data-w="25"]{width:calc(25% - 7.5px)}
.ahab-btn[data-w="auto"]{width:auto}
.ahab-btn[data-w="custom"]{width:var(--w,300px)}
.ahab-btn:hover,.ahab-btn:focus-visible{
	background:var(--hbg,var(--bg,#111));color:var(--hfg,var(--fg,#fff))!important;
	transform:translateY(-1px);box-shadow:0 6px 16px rgba(0,0,0,.18);
}
.ahab-btn:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.ahab-btn svg{width:var(--is,20px);height:var(--is,20px);fill:currentColor;flex:none}
.ahab-btn img{width:var(--is,20px);height:var(--is,20px);object-fit:contain;flex:none}
.ahab-btn span{min-width:0;overflow-wrap:anywhere}
@media (max-width:767px){.ahab-btn.ahab-only-desktop{display:none!important}}
@media (min-width:768px){.ahab-btn.ahab-only-mobile{display:none!important}}
@media (prefers-reduced-motion:reduce){.ahab-btn{transition:none}.ahab-btn:hover{transform:none}}

/* Quantity box on the same row as the first button.
   The quantity box itself is left exactly as the theme styles it (so its arrows, size and offsets stay intact);
   only the row it sits in and the button next to it are controlled here. */
body.ahab-qty-inline .ahab-flex.ahab-flex{display:flex!important;flex-flow:row wrap!important;align-items:stretch!important;justify-content:flex-start!important;column-gap:var(--ahab-gap,10px)!important;row-gap:var(--ahab-gap,10px)!important}
body.ahab-qty-inline .ahab-flex.ahab-flex>.quantity{flex:0 0 auto!important;float:none!important}
body.ahab-qty-inline .ahab-flex.ahab-flex>.quantity~*{flex:0 0 100%!important;width:100%!important;max-width:100%!important;margin:0!important;float:none!important}
body.ahab-qty-inline .ahab-flex.ahab-flex>.quantity~.ahab-first{flex:1 1 0!important;width:auto!important;min-width:0!important}
body.ahab-qty-inline .ahab-flex>.ahab-first.ahab-quickwrap .ahab-row{margin-top:0!important;margin-bottom:0!important;height:100%}
body.ahab-qty-inline .ahab-flex>.ahab-first.ahab-quickwrap .ahab-btn{height:100%}

/* Button animations (use the individual scale / rotate properties, so they never fight the layout's transform reset) */
.ahab-a-pulse,.ahab-a-heartbeat,.ahab-a-glow,.ahab-a-wobble,.ahab-a-ring,.ahab-a-jelly{animation-duration:var(--ahab-ad,2s);animation-iteration-count:infinite;animation-timing-function:ease-in-out}
.ahab-a-pulse{animation-name:ahab-pulse}
.ahab-a-heartbeat{animation-name:ahab-heartbeat}
.ahab-a-glow{animation-name:ahab-glow}
.ahab-a-wobble{animation-name:ahab-wobble}
.ahab-a-ring{animation-name:ahab-ring}
.ahab-a-jelly{animation-name:ahab-jelly}
.ahab-a-shine{position:relative;overflow:hidden}
.ahab-a-shine::after{content:"";position:absolute;top:0;left:-70%;width:40%;height:100%;pointer-events:none;background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-20deg);animation:ahab-shine var(--ahab-ad,2s) ease-in-out infinite}
@keyframes ahab-pulse{0%,100%{scale:1}50%{scale:1.05}}
@keyframes ahab-heartbeat{0%,70%,100%{scale:1}14%{scale:1.07}28%{scale:1}42%{scale:1.07}}
@keyframes ahab-glow{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--ahab-ac,#555) 60%,transparent)}70%,100%{box-shadow:0 0 0 14px transparent}}
@keyframes ahab-wobble{0%,80%,100%{rotate:0deg}10%{rotate:-2.5deg}25%{rotate:2deg}40%{rotate:-1.5deg}55%{rotate:1deg}70%{rotate:-.5deg}}
@keyframes ahab-ring{0%,55%,100%{rotate:0deg}6%{rotate:-7deg}12%{rotate:7deg}18%{rotate:-6deg}24%{rotate:6deg}30%{rotate:-3deg}36%{rotate:3deg}42%{rotate:0deg}}
@keyframes ahab-jelly{0%,100%{scale:1 1}25%{scale:.94 1.06}50%{scale:1.05 .95}75%{scale:.98 1.02}}
@keyframes ahab-shine{0%{left:-70%}55%,100%{left:140%}}
@media (prefers-reduced-motion:reduce){.ahab-a-pulse,.ahab-a-heartbeat,.ahab-a-glow,.ahab-a-wobble,.ahab-a-ring,.ahab-a-jelly{animation:none}.ahab-a-shine::after{animation:none;display:none}}
