/* PDP purchase column gap, cash price and variation swatches. */
.yc-buy .yc-buy-top{gap:clamp(24px,2.5vw,32px);background:transparent;align-items:start}
.yc-buy .yc-buy-gallery,.yc-buy .yc-buy-info{background:var(--yc-surface);border-radius:8px}
.yc-price-details{margin:0 0 20px;display:grid;gap:10px}
.yc-price-details .yc-tax-badge{order:-1}
.yc-price-details .yc-cash-price{margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;font-size:12px;padding:12px 14px;border-radius:6px;background:var(--yc-primary-soft);color:var(--yc-primary-strong)}
.yc-price-details .yc-cash-price[hidden]{display:none}
.yc-cash-amounts{display:inline-flex;align-items:baseline;gap:8px;margin-left:auto}
.yc-cash-price del{font-size:13px;color:var(--yc-text-soft);text-decoration:line-through}
.yc-cash-price strong{font-size:18px;color:var(--yc-primary);font-weight:600;white-space:nowrap}
.yc-cash-price small{flex:0 0 100%;font-size:11px;color:var(--yc-muted)}
.yc-tax-badge{display:inline-flex;align-items:center;gap:5px;color:var(--yc-muted);background:var(--yc-surface-alt);padding:5px 8px;border-radius:4px;font-size:11px;width:fit-content}
.yc-tax-badge .micon{font-size:12px}
.yc-buy .yc-swatches-color{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 12px}
.yc-buy .yc-swatch.is-color{height:auto;min-height:94px;width:84px;padding:8px;border:1px solid var(--yc-border);border-radius:6px;display:flex;flex-direction:column;gap:6px;align-items:center;justify-content:center;background:var(--yc-surface);color:var(--yc-muted);box-shadow:none;cursor:pointer;font:inherit}
.yc-buy .yc-swatch.is-color img{width:52px;height:52px;object-fit:contain;background:var(--yc-surface);display:block}
.yc-buy .yc-swatch.is-color span{font-size:11px;line-height:1.2;text-align:center}
/* Image cards replace the legacy colour dot: drop its squircle clip and --swatch fill when selected. */
.yc-buy .yc-swatches-color .yc-swatch.is-color.on{padding:8px;border-color:var(--yc-primary);background:var(--yc-surface);clip-path:none;box-shadow:inset 0 0 0 1px var(--yc-shadow-color);color:var(--yc-primary)}
.yc-buy .yc-swatch:disabled{opacity:.35;cursor:not-allowed}
.yc-buy .yc-swatch:focus-visible,.yc-product-assurance:focus-visible,.yc-etbis-banner:focus-visible{outline:2px solid var(--yc-primary);outline-offset:3px}
@media(max-width:767px){
  .yc-buy .yc-buy-top{gap:16px}
  .yc-buy .yc-buy-info{padding:20px 16px}
  .yc-buy .yc-buy-gallery{padding:12px}
  .yc-cash-price strong{font-size:17px}
  .yc-buy .yc-swatch.is-color,.yc-buy .yc-swatches-color .yc-swatch.is-color.on{width:74px;min-height:85px;padding:7px}
  .yc-buy .yc-swatch.is-color img{width:46px;height:46px}
}

/* Product cards use four columns on wide screens, three on tablets, and two on phones. */
@media(min-width:1025px){
  .yc-home-product-grid.yc-grid.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(min-width:641px) and (max-width:1024px){
  .yc-home-product-grid.yc-grid.cols-4{grid-template-columns:repeat(3,minmax(0,1fr))}
  .yc-grid.cols-3,.yc-grid.cols-4{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:640px){
  .yc-home-product-grid.yc-grid.cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .yc-grid.cols-3,.yc-grid.cols-4{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .yc-archive-main ul.products{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px;margin:0;padding:0}
  .yc-archive-main ul.products>li.product{float:none!important;width:auto!important;max-width:none!important;margin:0!important;min-width:0}
  .yc-card{height:100%;border-radius:7px}
  .yc-card-media{aspect-ratio:1.04;padding:26px 9px 30px}
  .yc-card-media:has(.yc-card-installment){padding:35px 10px 37px}
  .yc-card-body{padding:9px 9px 11px}
  .yc-card-brand{font-size:9px;letter-spacing:.2px;margin-bottom:4px}
  .yc-card-title{font-size:12px;line-height:1.35;min-height:32px;-webkit-line-clamp:2}
  .yc-card-rating{gap:4px;margin:8px 0 0;font-size:9px}
  .yc-rating-squares{gap:1px}
  .yc-rating-squares>span{width:12px;height:12px;font-size:10px}
  .yc-card .yc-card-price{padding-top:9px;margin-top:auto;gap:5px}
  .yc-card-price strong,.yc-card-price .amount{font-size:13px;gap:4px}
  .yc-card-price del{font-size:9px}
  .yc-card-online{left:6px;top:6px;max-width:calc(100% - 12px);font-size:8px;padding:4px 5px}
  .yc-card-installment{bottom:6px;max-width:calc(100% - 12px);font-size:8px;padding:4px 5px;gap:3px}
  .yc-card-installment .micon{font-size:10px}
}
