/* =============================================
   YAALINI PRODUCT LABELS — FRONTEND STYLES
   ============================================= */
.yl-labels-wrapper { position:absolute;inset:0;pointer-events:none;z-index:9;overflow:hidden; }
.yl-product-label { position:absolute;display:flex;align-items:center;justify-content:center;font-weight:700;line-height:1.1;z-index:10;pointer-events:none;text-align:center; }
.yl-label-top-left     { top:0;   left:0;  }
.yl-label-top-right    { top:0;   right:0; }
.yl-label-bottom-left  { bottom:0;left:0;  }
.yl-label-bottom-right { bottom:0;right:0; }

/* RIBBON */
.yl-shape-ribbon { width:calc(var(--yl-size,80px)*1.6);height:calc(var(--yl-size,80px)*1.6);overflow:hidden; }
.yl-shape-ribbon .yl-label-text { position:absolute;top:calc(var(--yl-size,80px)*.28);left:calc(var(--yl-size,80px)*-.38);width:calc(var(--yl-size,80px)*1.9);transform:rotate(-45deg);background:var(--yl-bg,#b5451b);color:var(--yl-txt,#fff);text-align:center;padding:5px 0;font-size:var(--yl-fs,12px);font-weight:700;white-space:nowrap;box-shadow:0 2px 6px rgba(0,0,0,.2); }
.yl-label-top-right.yl-shape-ribbon .yl-label-text { transform:rotate(45deg);left:auto;right:calc(var(--yl-size,80px)*-.38); }
.yl-label-bottom-left.yl-shape-ribbon .yl-label-text { transform:rotate(45deg);top:auto;bottom:calc(var(--yl-size,80px)*.28); }
.yl-label-bottom-right.yl-shape-ribbon .yl-label-text { transform:rotate(-45deg);top:auto;left:auto;bottom:calc(var(--yl-size,80px)*.28);right:calc(var(--yl-size,80px)*-.38); }

/* CIRCLE */
.yl-shape-circle { width:var(--yl-size,64px);height:var(--yl-size,64px);border-radius:50%;background:var(--yl-bg,#b5451b);color:var(--yl-txt,#fff);font-size:var(--yl-fs,12px);box-shadow:0 3px 10px rgba(0,0,0,.2);margin:8px;padding:4px; }

/* SQUARE */
.yl-shape-square { width:var(--yl-size,60px);height:var(--yl-size,60px);background:var(--yl-bg,#b5451b);color:var(--yl-txt,#fff);font-size:var(--yl-fs,11px);border-radius:4px;margin:8px; }

/* RECTANGLE */
.yl-shape-rectangle { background:var(--yl-bg,#b5451b);color:var(--yl-txt,#fff);padding:5px 14px;font-size:var(--yl-fs,12px);white-space:nowrap;box-shadow:0 2px 8px rgba(0,0,0,.15); }
.yl-label-top-left.yl-shape-rectangle,.yl-label-bottom-left.yl-shape-rectangle { border-radius:0 4px 4px 0;margin-top:10px; }
.yl-label-top-right.yl-shape-rectangle,.yl-label-bottom-right.yl-shape-rectangle { border-radius:4px 0 0 4px;margin-top:10px; }

/* CORNER SHAPES */
.yl-shape-corner_tl { width:var(--yl-size,80px);height:var(--yl-size,80px);background:var(--yl-bg,#b5451b);color:var(--yl-txt,#fff);font-size:var(--yl-fs,11px);border-radius:0 0 100% 0;padding:10px 24px 24px 10px;align-items:flex-start;justify-content:flex-start; }
.yl-shape-corner_tr { width:var(--yl-size,80px);height:var(--yl-size,80px);background:var(--yl-bg,#b5451b);color:var(--yl-txt,#fff);font-size:var(--yl-fs,11px);border-radius:0 0 0 100%;padding:10px 10px 24px 24px;align-items:flex-start;justify-content:flex-end; }
.yl-shape-corner_bl { width:var(--yl-size,80px);height:var(--yl-size,80px);background:var(--yl-bg,#b5451b);color:var(--yl-txt,#fff);font-size:var(--yl-fs,11px);border-radius:0 100% 0 0;padding:24px 24px 10px 10px;align-items:flex-end;justify-content:flex-start; }
.yl-shape-corner_br { width:var(--yl-size,80px);height:var(--yl-size,80px);background:var(--yl-bg,#b5451b);color:var(--yl-txt,#fff);font-size:var(--yl-fs,11px);border-radius:100% 0 0 0;padding:24px 10px 10px 24px;align-items:flex-end;justify-content:flex-end; }

/* LEAF */
.yl-shape-leaf { width:var(--yl-size,68px);height:var(--yl-size,68px);background:var(--yl-bg,#b5451b);color:var(--yl-txt,#fff);font-size:var(--yl-fs,11px);border-radius:0 50% 50% 50%;transform:rotate(-45deg);margin:10px; }
.yl-shape-leaf .yl-label-text { transform:rotate(45deg); }

/* SPEECH BUBBLE */
.yl-shape-speech { background:var(--yl-bg,#b5451b);color:var(--yl-txt,#fff);font-size:var(--yl-fs,12px);padding:6px 14px;border-radius:6px;white-space:nowrap;margin:8px;position:relative; }
.yl-label-top-left.yl-shape-speech::after,.yl-label-top-right.yl-shape-speech::after { content:'';position:absolute;bottom:-8px;left:12px;border:8px solid transparent;border-top-color:var(--yl-bg,#b5451b);border-bottom:0; }

/* ARROW RIGHT */
.yl-shape-arrow_right { background:var(--yl-bg,#b5451b);color:var(--yl-txt,#fff);font-size:var(--yl-fs,12px);padding:6px 24px 6px 14px;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 50%,calc(100% - 12px) 100%,0 100%);white-space:nowrap; }

/* ARROW LEFT */
.yl-shape-arrow_left { background:var(--yl-bg,#b5451b);color:var(--yl-txt,#fff);font-size:var(--yl-fs,12px);padding:6px 14px 6px 24px;clip-path:polygon(12px 0,100% 0,100% 100%,12px 100%,0 50%);white-space:nowrap; }

/* BANNER (both ends notched) */
.yl-shape-banner { background:var(--yl-bg,#b5451b);color:var(--yl-txt,#fff);font-size:var(--yl-fs,12px);padding:6px 16px;clip-path:polygon(10px 0%,calc(100% - 10px) 0%,100% 50%,calc(100% - 10px) 100%,10px 100%,0% 50%);white-space:nowrap;margin:8px 12px; }

/* BADGE (shield) */
.yl-shape-badge { width:var(--yl-size,58px);height:calc(var(--yl-size,58px)*1.2);background:var(--yl-bg,#b5451b);color:var(--yl-txt,#fff);font-size:var(--yl-fs,11px);clip-path:polygon(0 0,100% 0,100% 75%,50% 100%,0 75%);padding-top:6px;margin:0 8px; }

/* BOOKMARK */
.yl-shape-bookmark { width:var(--yl-size,54px);height:calc(var(--yl-size,54px)*1.35);background:var(--yl-bg,#b5451b);color:var(--yl-txt,#fff);font-size:var(--yl-fs,11px);clip-path:polygon(0 0,100% 0,100% 100%,50% 82%,0 100%);padding-top:8px;margin:0 8px; }

/* HEXAGON */
.yl-shape-hexagon { width:var(--yl-size,64px);height:calc(var(--yl-size,64px)*.87);background:var(--yl-bg,#b5451b);color:var(--yl-txt,#fff);font-size:var(--yl-fs,11px);clip-path:polygon(25% 0%,75% 0%,100% 50%,75% 100%,25% 100%,0% 50%);margin:8px; }

/* STAR */
.yl-shape-star { width:var(--yl-size,68px);height:var(--yl-size,68px);background:var(--yl-bg,#b5451b);color:var(--yl-txt,#fff);font-size:var(--yl-fs,11px);clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);margin:8px; }

/* DIAMOND */
.yl-shape-diamond { width:var(--yl-size,64px);height:var(--yl-size,64px);background:var(--yl-bg,#b5451b);color:var(--yl-txt,#fff);font-size:var(--yl-fs,11px);clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%);margin:8px; }

/* BLOB */
.yl-shape-blob { width:var(--yl-size,66px);height:var(--yl-size,66px);background:var(--yl-bg,#b5451b);color:var(--yl-txt,#fff);font-size:var(--yl-fs,11px);border-radius:62% 38% 46% 54% / 60% 44% 56% 40%;margin:8px; }

/* SEAL */
.yl-shape-seal { width:var(--yl-size,66px);height:var(--yl-size,66px);background:var(--yl-bg,#b5451b);color:var(--yl-txt,#fff);font-size:var(--yl-fs,10px);clip-path:polygon(50% 0%,56% 4%,63% 2%,68% 7%,75% 6%,79% 12%,86% 12%,89% 19%,96% 20%,98% 27%,100% 30%,97% 37%,100% 44%,97% 50%,100% 56%,97% 63%,100% 70%,97% 73%,94% 80%,89% 81%,86% 88%,79% 88%,75% 94%,68% 93%,63% 98%,56% 96%,50% 100%,44% 96%,37% 98%,32% 93%,25% 94%,21% 88%,14% 88%,11% 81%,6% 80%,3% 73%,0% 70%,3% 63%,0% 56%,3% 50%,0% 44%,3% 37%,0% 30%,2% 27%,4% 20%,11% 19%,14% 12%,21% 12%,25% 6%,32% 7%,37% 2%,44% 4%);margin:6px; }

/* CUSTOM IMAGE */
/* CUSTOM IMAGE — flush to corners, no margin */
.yl-shape-image {
    background: transparent;
    margin: 0 !important;
    padding: 0 !important;
}
.yl-shape-image img {
    display: block;
    height: auto;
    object-fit: contain;
}
.yl-shape-image .yl-label-text { display: none; }

/* CART / CHECKOUT inline pills */
.yl-loc-cart,.yl-loc-minicart,.yl-loc-checkout { position:static!important;display:inline-flex;gap:4px;flex-wrap:wrap;margin-top:4px;overflow:visible!important; }
.yl-loc-cart .yl-product-label,.yl-loc-minicart .yl-product-label,.yl-loc-checkout .yl-product-label { position:static!important;display:inline-flex!important;width:auto!important;height:auto!important;clip-path:none!important;transform:none!important;border-radius:3px!important;padding:2px 8px!important;font-size:var(--yl-fs,11px)!important;font-weight:700;background:var(--yl-bg,#b5451b);color:var(--yl-txt,#fff);white-space:nowrap;margin:0!important; }
.yl-loc-cart .yl-label-text,.yl-loc-minicart .yl-label-text,.yl-loc-checkout .yl-label-text { position:static!important;transform:none!important;background:transparent!important;padding:0!important;width:auto!important; }

/* Product page */
.catalog-product-view .product.media { position:relative; }
.catalog-product-view .yl-labels-wrapper { z-index:99; }

/* Category */
.product-item-info { position:relative; }

/* Animate */
@keyframes yl-pop { 0%{opacity:0;transform:scale(.7)} 80%{transform:scale(1.05)} 100%{opacity:1;transform:scale(1)} }
.yl-product-label { animation:yl-pop .3s ease forwards; }
.yl-shape-ribbon,.yl-shape-corner_tl,.yl-shape-corner_tr,.yl-shape-corner_bl,.yl-shape-corner_br { animation:none; }

/* ── CORNER FLUSH OVERRIDES ──
   Remove all margins so labels sit tight in corners */
.yl-label-top-left     { top:0 !important; left:0 !important;  margin:0 !important; }
.yl-label-top-right    { top:0 !important; right:0 !important; margin:0 !important; }
.yl-label-bottom-left  { bottom:0 !important; left:0 !important;  margin:0 !important; }
.yl-label-bottom-right { bottom:0 !important; right:0 !important; margin:0 !important; }

/* Shapes that need a small offset for visual balance (circles, seals, badges) */
.yl-label-top-left .yl-shape-circle,
.yl-label-top-left .yl-shape-blob,
.yl-label-top-left .yl-shape-seal,
.yl-label-top-left .yl-shape-hexagon,
.yl-label-top-left .yl-shape-diamond,
.yl-label-top-left .yl-shape-star { margin: 6px 0 0 6px !important; }

.yl-label-top-right .yl-shape-circle,
.yl-label-top-right .yl-shape-blob,
.yl-label-top-right .yl-shape-seal,
.yl-label-top-right .yl-shape-hexagon,
.yl-label-top-right .yl-shape-diamond,
.yl-label-top-right .yl-shape-star { margin: 6px 6px 0 0 !important; }

.yl-label-bottom-left .yl-shape-circle,
.yl-label-bottom-left .yl-shape-blob,
.yl-label-bottom-left .yl-shape-seal { margin: 0 0 6px 6px !important; }

.yl-label-bottom-right .yl-shape-circle,
.yl-label-bottom-right .yl-shape-blob,
.yl-label-bottom-right .yl-shape-seal { margin: 0 6px 6px 0 !important; }

/* ── HIDE LABELS ON CARD HOVER ──
   Fades out when quickview/cart/compare buttons appear */
.product-item:hover .yl-labels-wrapper,
.item.product:hover .yl-labels-wrapper {
    opacity: 0;
    transition: opacity 0.2s ease;
}
.product-item .yl-labels-wrapper,
.item.product .yl-labels-wrapper {
    opacity: 1;
    transition: opacity 0.2s ease;
}