:root {
  --coyful-badge-ink: #242424;
  --coyful-badge-white: #fffdf9;
  --coyful-badge-blush: #c98376;
  --coyful-badge-navy: #213957;
  --coyful-badge-mauve: #9b7888;
  --coyful-badge-gold: #aa8240;
  --coyful-badge-sage: #78876a;
  --coyful-badge-teal: #649294;
  --coyful-badge-border: #ded8d0;
}

/* Product image overlay layer. Product pixels are never modified. */
.woocommerce ul.products li.product,
.single-product div.product { position: relative; }

.coyful-product-overlay {
  position: absolute;
  z-index: 24;
  left: 12px;
  top: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  pointer-events: none;
  text-align: center;
  font-family: inherit;
  font-weight: 600;
  line-height: 1.08;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.coyful-overlay-context-loop { transform-origin: top left; }
.coyful-overlay-context-single { left: 16px; top: 16px; }

.coyful-overlay-bestseller {
  width: 86px; height: 86px;
  background: transparent;
  padding: 0;
}
.coyful-bestseller-svg {
  width: 100%; height: 100%; display: block; overflow: visible;
}
.coyful-bestseller-text {
  font-family: inherit;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .16em;
  fill: var(--coyful-badge-ink);
  text-anchor: middle;
}
.coyful-bestseller-star {
  fill: #d7b252;
  stroke: #b5871f;
  stroke-width: 2.1;
}
.coyful-overlay-almost-gone {
  min-width: 108px; min-height: 42px; padding: 8px 24px 8px 12px;
  background: var(--coyful-badge-blush); color: #fff;
  clip-path: polygon(0 0,100% 0,100% 72%,82% 72%,72% 100%,62% 72%,0 72%);
  font-size: 10px;
}
.coyful-overlay-last-one {
  width: 72px; height: 68px; padding: 10px;
  background: var(--coyful-badge-white); color: var(--coyful-badge-ink);
  border: 2px solid var(--coyful-badge-blush);
  clip-path: polygon(25% 5%,75% 5%,100% 50%,75% 95%,25% 95%,0 50%);
  font-size: 10px;
}
.coyful-overlay-limited-edition {
  min-width: 138px; height: 42px; padding: 8px 22px;
  background: var(--coyful-badge-navy); color: #fff;
  clip-path: polygon(0 0,100% 0,90% 50%,100% 100%,0 100%,10% 50%);
  font-size: 10px;
}
.coyful-overlay-exclusive-find {
  width: 82px; height: 82px; padding: 10px;
  background: var(--coyful-badge-mauve); color: #fff;
  clip-path: polygon(50% 0,61% 7%,74% 5%,81% 17%,94% 22%,92% 36%,100% 50%,92% 63%,94% 78%,81% 83%,74% 95%,61% 93%,50% 100%,39% 93%,26% 95%,19% 83%,6% 78%,8% 63%,0 50%,8% 36%,6% 22%,19% 17%,26% 5%,39% 7%);
  font-size: 9px;
}
.coyful-overlay-retired-legacy {
  width: 86px; height: 86px;
  background: transparent;
  padding: 0;
}
.coyful-retired-svg { width: 100%; height: 100%; display: block; }
.coyful-retired-rose { fill: #6e263b; stroke: #4e1728; stroke-width: 2.2; }
.coyful-retired-rose-detail { fill: none; stroke: #f4ddd8; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.coyful-retired-text {
  font-family: inherit;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .16em;
  fill: #fff8ef;
  text-anchor: middle;
}
.coyful-retired-bottom { dominant-baseline: hanging; }

/* Product-page verified attribute badges. */
.coyful-attribute-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0 16px;
  align-items: center;
}
.coyful-attribute-badge {
  --badge-accent: var(--coyful-badge-ink);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  box-sizing: border-box;
  min-height: 44px;
  padding: 7px 11px;
  border: 1.5px solid var(--badge-accent);
  background: rgba(255,253,249,.96);
  color: var(--coyful-badge-ink);
  font-family: inherit;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.12;
  letter-spacing: .025em;
  text-align: left;
}
.coyful-attribute-icon { width: 26px; height: 26px; color: var(--badge-accent); flex: 0 0 26px; }
.coyful-attribute-icon svg { display:block; width:100%; height:100%; fill:currentColor; }
.coyful-attribute-label { max-width: 92px; }

.coyful-attribute-designed-in-england { --badge-accent: var(--coyful-badge-navy); width: 118px; height: 58px; padding: 7px 10px; border-radius: 6px; flex-direction: row; gap: 8px; text-align: left; font-size: 10px; }
.coyful-attribute-designed-in-england .coyful-attribute-icon { width: 48px; height: 32px; flex: 0 0 48px; }
.coyful-attribute-designed-in-england .coyful-attribute-label { max-width: 48px; line-height: 1.02; }

.coyful-attribute-vegan { --badge-accent: var(--coyful-badge-sage); width: 88px; height: 94px; padding: 12px 10px 10px; clip-path: polygon(50% 2%, 76% 12%, 92% 32%, 95% 56%, 84% 77%, 63% 93%, 42% 97%, 22% 88%, 8% 68%, 5% 44%, 10% 24%, 24% 10%); flex-direction: column; gap: 3px; text-align: center; font-size: 9px; position: relative; }
.coyful-attribute-vegan::after { content: ""; position: absolute; bottom: -6px; left: 50%; width: 2px; height: 12px; background: var(--badge-accent); transform: translateX(-50%); border-radius: 2px; }
.coyful-attribute-cruelty-free { --badge-accent: var(--coyful-badge-mauve); width: 88px; height: 88px; padding: 18px 10px 8px; border-radius: 48% 48% 42% 42% / 50% 50% 44% 44%; flex-direction: column; gap: 2px; text-align: center; font-size: 9px; position: relative; }
.coyful-attribute-cruelty-free::before, .coyful-attribute-cruelty-free::after { content: ""; position: absolute; top: -16px; width: 21px; height: 32px; border: 1.5px solid var(--badge-accent); background: rgba(255,253,249,.96); border-radius: 65% 65% 28% 28%; }
.coyful-attribute-cruelty-free::before { left: 16px; transform: rotate(-14deg); }
.coyful-attribute-cruelty-free::after { right: 16px; transform: rotate(14deg); }
.coyful-attribute-artist-designed { --badge-accent: var(--coyful-badge-blush); width: 80px; height: 80px; padding: 8px 6px; border-radius: 50%; flex-direction: column; gap: 3px; text-align: center; font-size: 9px; }
.coyful-attribute-reusable-tin { --badge-accent: var(--coyful-badge-gold); border-radius: 24px; }
.coyful-attribute-wet-dry { --badge-accent: var(--coyful-badge-teal); border-radius: 24px; }
.coyful-attribute-gentle-detangling { --badge-accent: var(--coyful-badge-blush); border-radius: 20px; }
.coyful-attribute-curly-hair-friendly { --badge-accent: var(--coyful-badge-sage); clip-path: polygon(25% 2%,75% 2%,98% 50%,75% 98%,25% 98%,2% 50%); padding-left: 14px; padding-right: 14px; }
.coyful-attribute-travel-size { --badge-accent: var(--coyful-badge-navy); border-radius: 24px; }
.coyful-attribute-flexible-head { --badge-accent: var(--coyful-badge-gold); border-radius: 5px 24px 24px 5px; }

.coyful-attribute-context-loop { margin: 5px 0 7px; gap: 4px; }
.coyful-attribute-context-loop .coyful-attribute-badge { transform: scale(.78); transform-origin: left center; margin-right: -16px; margin-bottom: -7px; }

@media (max-width: 767px) {
  .coyful-product-overlay { left: 8px; top: 8px; transform: scale(.82); }
  .coyful-overlay-bestseller { width: 78px; height: 78px; }
  .coyful-overlay-retired-legacy { width: 78px; height: 78px; }
  .coyful-overlay-context-single { left: 10px; top: 10px; transform: scale(.9); }
  .coyful-attribute-badges { gap: 6px; margin: 8px 0 13px; }
  .coyful-attribute-badge { min-height: 40px; padding: 6px 9px; font-size: 10px; }
  .coyful-attribute-vegan { width: 78px; height: 84px; font-size: 8px; }
  .coyful-attribute-vegan::after { height: 10px; bottom: -5px; }
  .coyful-attribute-cruelty-free { width: 80px; height: 80px; padding-top: 16px; font-size: 8px; }
  .coyful-attribute-cruelty-free::before, .coyful-attribute-cruelty-free::after { width: 17px; height: 26px; top: -13px; }
  .coyful-attribute-cruelty-free::before { left: 15px; }
  .coyful-attribute-cruelty-free::after { right: 15px; }
  .coyful-attribute-artist-designed { width: 70px; height: 70px; font-size: 8px; }
  .coyful-attribute-icon { width: 23px; height: 23px; flex-basis: 23px; }
  .coyful-attribute-designed-in-england { width: 104px; height: 52px; padding: 6px 8px; }
  .coyful-attribute-designed-in-england .coyful-attribute-icon { width: 42px; height: 28px; flex-basis: 42px; }
  .coyful-attribute-designed-in-england .coyful-attribute-label { max-width: 44px; }
}