/* ============================================================
   Back Market-style product badge system (CustomLabel overlay)
   Loaded once; pure CSS (no layout shift, no JS required).
   ============================================================ */

.bmb-overlay{position:absolute;inset:0;pointer-events:none;z-index:4;}
.bmb-overlay--pdp{z-index:6;}
.bmb-anchor{pointer-events:auto;display:inline-flex;}
.bmb-anchor--cx{transform:translateX(-50%);}
.bmb-anchor--cy{transform:translateY(-50%);}
.bmb-anchor--cx.bmb-anchor--cy{transform:translate(-50%,-50%);}

/* ---- base badge ---- */
.bmb{display:inline-flex;align-items:center;gap:6px;font-weight:700;line-height:1.15;box-sizing:border-box;
     -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
.bmb .bmb-txt{white-space:nowrap;}
.bmb-ic-img{width:1.05em;height:1.05em;object-fit:contain;display:block;flex:0 0 auto;}

/* ---- pill (default / legacy look) ---- */
.bmb--pill{padding:5px 11px;border-radius:999px;font-size:11px;letter-spacing:.02em;}

/* ---- rounded ---- */
.bmb--rounded{padding:6px 12px;border-radius:9px;font-size:11.5px;}

/* ---- promotional ---- */
.bmb--promotional{padding:6px 14px;border-radius:6px;font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;}

/* ---- ribbon ---- */
.bmb--ribbon{padding:5px 16px 5px 12px;font-size:11px;border-radius:4px 0 0 4px;
     clip-path:polygon(0 0,100% 0,calc(100% - 9px) 50%,100% 100%,0 100%);}

/* ---- circular / trust / sticker ---- */
.bmb--circular,.bmb--trust,.bmb--sticker{flex-direction:column;justify-content:center;text-align:center;gap:3px;padding:8px;}
.bmb--circular,.bmb--trust{border-radius:50%;}
.bmb--sticker{border-radius:16px;}
.bmb--circular .bmb-txt,.bmb--trust .bmb-txt,.bmb--sticker .bmb-txt{
    font-size:9.5px;line-height:1.12;white-space:normal;letter-spacing:.01em;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.bmb--circular .bmb-ic,.bmb--trust .bmb-ic,.bmb--sticker .bmb-ic{font-size:19px;display:flex;align-items:center;justify-content:center;}
.bmb--circular .bmb-ic-img,.bmb--trust .bmb-ic-img,.bmb--sticker .bmb-ic-img{width:22px;height:22px;}
.bmb-sub{font-size:8px;opacity:.85;font-weight:600;}

/* ---- Premium Refurbished Seal (Back Market-style scalloped sticker) ---- */
.bmb--seal{position:relative;display:flex;align-items:center;justify-content:center;padding:0;
     background:transparent !important;box-shadow:none !important;border-radius:0 !important;overflow:visible;}
.bmb-seal-bg{position:absolute;inset:0;width:100%;height:100%;z-index:0;
     filter:drop-shadow(0 6px 16px rgba(0,0,0,.20));}
.bmb-seal-svg{position:absolute;inset:0;width:100%;height:100%;z-index:1;}
.bmb-seal-text{font-size:7px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;}
.bmb-seal-center{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;
     width:34px;height:34px;border:1.5px solid currentColor;border-radius:50%;font-size:16px;line-height:1;}
.bmb-seal-center .bmb-ic-img{width:20px;height:20px;}
@keyframes bmb-seal-rot{to{transform:rotate(360deg);}}

/* ---- animations (subtle, professional) ---- */
.bmb-anim-fade{animation:bmb-fade .55s ease both;}
.bmb-anim-scale{animation:bmb-scale .45s cubic-bezier(.2,.8,.3,1.15) both;}
.bmb-anim-float{animation:bmb-float 3.2s ease-in-out infinite;}
.bmb-anim-pulse{animation:bmb-pulse 2.6s ease-in-out infinite;}
.bmb-anim-bounce{animation:bmb-bounce 3s ease-in-out infinite;}
@keyframes bmb-fade{from{opacity:0}to{opacity:1}}
@keyframes bmb-scale{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}
@keyframes bmb-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes bmb-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}
@keyframes bmb-bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@media (prefers-reduced-motion: reduce){
    .bmb-seal-svg,.bmb-anim-float,.bmb-anim-pulse,.bmb-anim-bounce{animation:none !important;}
}

/* ---- PDP: badges sit larger over the main image ---- */
.bmb-overlay--pdp .bmb--circular,.bmb-overlay--pdp .bmb--trust,
.bmb-overlay--pdp .bmb--sticker,.bmb-overlay--pdp .bmb--seal{box-shadow:0 6px 22px rgba(0,0,0,.22);}

/* ---- mobile: scale down so badges never dominate the product ---- */
@media (max-width:575px){
    .bmb-anchor{transform:scale(.8);transform-origin:top left;}
    .bmb-anchor--cx{transform:translateX(-50%) scale(.8);transform-origin:top center;}
    .bmb-anchor--cy{transform:translateY(-50%) scale(.8);transform-origin:left center;}
    .bmb-anchor--cx.bmb-anchor--cy{transform:translate(-50%,-50%) scale(.8);transform-origin:center;}
    .bmb--pill,.bmb--rounded,.bmb--promotional,.bmb--ribbon{font-size:10px;}
}