.ds-colorsw{display:block;margin:4px 0 2px;font-family:var(--ds-font-sans);min-width:0;max-width:100%}.ds-colorsw__head{display:flex;align-items:baseline;gap:8px;margin-bottom:10px}.ds-colorsw__label{font-weight:700;font-size:14px;color:var(--ds-text)}.ds-colorsw__name{font-size:14px;color:var(--ds-text)}.ds-colorsw__toggle{margin-left:auto;display:inline-flex;align-items:center;gap:5px;background:none;border:none;padding:0;cursor:pointer;font-family:inherit;font-size:13px;color:var(--ds-text-muted)}.ds-colorsw__toggle:hover{color:var(--ds-text)}.ds-colorsw__toggle i{font-size:10px;transition:transform var(--ds-dur-fast) var(--ds-ease)}.ds-colorsw[data-open=true] .ds-colorsw__toggle i{transform:rotate(180deg)}.ds-colorsw__row{width:0;min-width:100%;display:flex;flex-wrap:nowrap;gap:10px;overflow-x:auto;overflow-y:visible;padding:6px 6px 9px 2px;margin:-6px -6px -9px -2px;scrollbar-width:none;-webkit-overflow-scrolling:touch;-webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 32px),transparent 100%);mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 32px),transparent 100%)}.ds-colorsw__row::-webkit-scrollbar{display:none}.ds-colorsw[data-open=true] .ds-colorsw__row{flex-wrap:wrap;overflow:visible;-webkit-mask-image:none;mask-image:none}.ds-colorsw__swatch{position:relative;width:32px;height:32px;border-radius:50%;border:none;padding:0;flex:none;cursor:pointer;display:block;background-color:var(--ds-gray-100);background-size:cover;box-shadow:inset 0 0 0 1px #0000001f;transition:box-shadow var(--ds-dur-fast) var(--ds-ease);text-decoration:none}.ds-colorsw__badge{position:absolute;bottom:-3px;right:-3px;min-width:15px;height:15px;padding:0 3px;box-sizing:border-box;border-radius:999px;background:var(--ds-white, #fff);box-shadow:0 0 0 1px #00000024;display:flex;align-items:center;justify-content:center;font-size:9.5px;font-weight:700;line-height:1;color:var(--ds-text)}.ds-colorsw__swatch:hover{box-shadow:inset 0 0 0 1px #0000004d}.ds-colorsw__swatch[data-active=true]{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--ds-black),inset 0 0 0 1px #0000001a}.ds-colorsw__swatch[data-available=false]{opacity:.4}.ds-colorsw__toggle[hidden]{display:none}.ds-colorsw__legend{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-top:12px;font-size:12.5px;color:var(--ds-text-muted)}.ds-colorsw__legend strong{font-weight:700;color:var(--ds-text)}.ds-colorsw__legend-dots{display:inline-flex;gap:5px}.ds-colorsw__legend-dot{width:16px;height:16px;border-radius:50%;flex:none;box-shadow:inset 0 0 0 1px #00000024}.ds-colorsw__legend[hidden]{display:none}
/*# sourceMappingURL=/cdn/shop/t/61/assets/ds-pdp-color-switcher.css.map */