/* JN Woo Elements — Quantity Selector CSS v3.0.0 */
.jnw-qty-wrapper{display:inline-flex;align-items:center;gap:8px;background:#f5f5f5;border-radius:999px;padding:6px;user-select:none}
.single-product .quantity:not(.jnw-qty-wrapper){display:none!important}
.jnw-qty-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;min-width:40px;border-radius:50%;border:none;background:transparent;cursor:pointer;transition:background-color .2s ease,color .2s ease;padding:0;line-height:1;flex-shrink:0;position:relative;box-sizing:border-box}
.jnw-qty-btn:disabled{cursor:not-allowed;opacity:.4}
.jnw-qty-btn:hover:not(:disabled){background-color:#1a1a1a;color:#fff}
.jnw-qty-btn:hover:not(:disabled) i,.jnw-qty-btn:hover:not(:disabled) svg{color:#fff;fill:#fff}
/* FIX (Bug #4): Absolute-center the icon regardless of border-radius, border
   width, or font-glyph box quirks. This is the bulletproof approach — flexbox
   centering alone was being visually thrown off by Font Awesome icon
   line-height/vertical-align inconsistencies once a border-radius/border
   was applied. */
.jnw-qty-btn i,.jnw-qty-btn svg{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    margin:0;
    line-height:1;
    display:block;
}
.jnw-qty-display{min-width:40px;text-align:center;overflow:hidden;position:relative;height:1.6em;display:flex;align-items:center;justify-content:center}
.jnw-qty-number{font-size:16px;font-weight:500;color:#1a1a1a;display:block;line-height:1.5;position:relative}
/* Slide animation */
.jnw-anim-slide .jnw-qty-number.anim-out-up{animation:jnwSlideOutUp .15s ease forwards}
.jnw-anim-slide .jnw-qty-number.anim-out-down{animation:jnwSlideOutDown .15s ease forwards}
.jnw-anim-slide .jnw-qty-number.anim-in-up{animation:jnwSlideInUp .15s ease forwards}
.jnw-anim-slide .jnw-qty-number.anim-in-down{animation:jnwSlideInDown .15s ease forwards}
/* Fade animation */
.jnw-anim-fade .jnw-qty-number.anim-out-up,.jnw-anim-fade .jnw-qty-number.anim-out-down{animation:jnwFadeOut .12s ease forwards}
.jnw-anim-fade .jnw-qty-number.anim-in-up,.jnw-anim-fade .jnw-qty-number.anim-in-down{animation:jnwFadeIn .12s ease forwards}
@keyframes jnwSlideOutUp{to{transform:translateY(-100%);opacity:0}}
@keyframes jnwSlideOutDown{to{transform:translateY(100%);opacity:0}}
@keyframes jnwSlideInUp{from{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}
@keyframes jnwSlideInDown{from{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}
@keyframes jnwFadeOut{to{opacity:0}}
@keyframes jnwFadeIn{from{opacity:0}to{opacity:1}}
.jnw-qty-oos{font-size:13px;color:#999;padding:8px 16px}
@media(max-width:768px){.jnw-qty-btn{width:44px!important;height:44px!important;min-width:44px!important}}