:root{--swatch-radius:8px;--swatch-border:3px;--swatch-selected-extra:2px;--swatch-pad-y:10px;--swatch-pad-x:12px;--swatch-row-height:48px;--swatch-line-height:1.2}
.product-form__input--swatch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:minmax(var(--swatch-legend-reserve,32px),max-content);grid-auto-rows:minmax(var(--swatch-row-height,48px),max-content);grid-auto-flow:row;column-gap:var(--swatch-col-gap,20px);row-gap:var(--swatch-row-gap,10px);align-content:start;width:100%;padding:0;margin:0;border:0;box-sizing:border-box}
.product-form__input--swatch>legend.form__label{grid-column:1/-1;grid-row:1;display:flex;align-items:center;padding:0;margin:0;line-height:var(--swatch-line-height);min-height:var(--swatch-legend-reserve,32px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.product-form__input--swatch>input[type="radio"]{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px;margin:0;padding:0}
.product-form__input--swatch .variant-swatch__label{--swatch-accent:var(--swatch-bg,#000);display:flex;align-items:center;justify-content:center;min-width:0;min-height:var(--swatch-row-height,48px);height:var(--swatch-row-height,48px);padding:var(--swatch-pad-y) var(--swatch-pad-x);background:#fff;color:#000;border:var(--swatch-border) solid var(--swatch-accent);border-radius:var(--swatch-radius);box-sizing:border-box;font-size:var(--font-size-body);line-height:var(--swatch-line-height);letter-spacing:.02rem;font-family:var(--font-body-family);font-style:var(--font-body-style);font-weight:var(--font-body-weight);text-align:center;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent}
.product-form__input--swatch input[type="radio"]:checked+.variant-swatch__label{box-shadow:0 0 0 var(--swatch-selected-extra) var(--swatch-accent) inset}
.product-form__input--swatch .variant-swatch__name{padding:0;line-height:inherit;color:inherit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.product-form__input--swatch .variant-swatch__name br{display:none!important}
.product-form__input--swatch .variant-swatch__label>*{pointer-events:none}
.variant-swatch__label .label-unavailable{display:none}
input.visually-disabled+.variant-swatch__label{opacity:.55;cursor:not-allowed}
@media (max-width:480px){.product-form__input--swatch .variant-swatch__label{font-size:clamp(12px,3.6vw,14px);padding:8px 10px;letter-spacing:0}}