:root{--sp-accent: #C41E3A;--sp-primary: #1A1A1A;--sp-secondary: #666;--sp-border: #E5E5E5;--sp-bg: #FFFFFF;--sp-hover-bg: #F5F5F5;--sp-selected-overlay: rgba(120, 0, 18, .5);--sp-radius: 4px;--sp-transition: .2s ease}.shade-picker{font-family:inherit;width:100%;margin-bottom:0}variant-picker fieldset[style*="display: none"]{margin:0!important;padding:0!important;height:0!important;min-height:0!important;overflow:hidden!important}variant-picker.has-custom-shade-picker:has(fieldset[style*="display: none"]:only-child){margin-top:0!important;margin-bottom:0!important;padding-top:0!important;padding-bottom:0!important}.shade-picker__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px;gap:8px}.shade-picker__name-btn{display:inline-flex;align-items:center;gap:6px;background:none;border:none;padding:0;cursor:pointer;color:var(--sp-primary);font-family:inherit;line-height:1}.shade-picker__name-btn:focus-visible{outline:2px solid var(--sp-accent);outline-offset:3px;border-radius:3px}.shade-picker__selected-name-label{font-size:14px;font-weight:400;color:#333;letter-spacing:-.01em;line-height:1.2}.shade-picker__selected-name{font-size:16px;font-weight:500;color:#111;letter-spacing:0;line-height:1}.shade-picker__chevron{width:9px;height:6px;color:var(--sp-accent);flex-shrink:0;display:block;transition:transform var(--sp-transition)}.shade-picker__all-btn{flex-shrink:0;background:none;border:none;padding:0;cursor:pointer;font-family:inherit;font-size:14px;font-weight:500;color:var(--sp-primary);display:inline-flex;align-items:center;line-height:1.25;transition:color var(--sp-transition)}.shade-picker__all-btn-text{text-decoration:underline;text-decoration-color:var(--sp-accent);text-decoration-thickness:2px;text-underline-offset:3px}.shade-picker__all-btn:hover{color:var(--sp-accent)}.shade-picker__all-btn:focus-visible{outline:2px solid var(--sp-accent);outline-offset:3px;border-radius:3px}.shade-picker__label-group,.shade-picker__label,.shade-picker__preview-row{display:none}.shade-picker__body{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.shade-picker__preview-wrap{flex-shrink:0;width:48px;height:48px;border-radius:var(--sp-radius);overflow:hidden;background:var(--sp-hover-bg);cursor:pointer;border:1px solid var(--sp-border);transition:transform var(--sp-transition),border-color var(--sp-transition)}.shade-picker__preview-wrap:hover{border-color:#111;transform:scale(1.03)}.shade-picker__preview-img{width:100%;height:100%;object-fit:cover;display:block;transition:opacity .2s ease}.shade-picker__swatches-wrap{flex:1;min-width:0;display:flex;align-items:center;gap:8px;flex-wrap:wrap}.shade-picker__swatches-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.shade-picker__swatch[data-overflow=true]{display:none!important}.shade-picker__swatches-row.is-expanded .shade-picker__swatch[data-overflow=true]{display:flex!important}@keyframes swatch-pop-in{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.shade-picker__swatch{flex-shrink:0;width:42px;height:42px;border-radius:var(--sp-radius);border:1px solid var(--sp-border);background:var(--sp-bg);cursor:pointer;padding:0;overflow:hidden;display:flex;align-items:center;justify-content:center;position:relative;transition:transform var(--sp-transition),border-color var(--sp-transition),box-shadow var(--sp-transition)}.shade-picker__swatch img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}.shade-picker__swatch--placeholder{background:#f0f0f0;font-size:1rem;font-weight:600;color:#555}.shade-picker__swatch:hover{transform:scale(1.05);z-index:2;border-color:#aaa}.shade-picker__swatch.is-selected{border-color:#780012;box-shadow:0 2px 8px #0000002e;z-index:3}.shade-picker__swatch.is-selected:after{content:"\2713";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--sp-radius);border:2px solid #ffffff;background:transparent;color:#fff;font-size:1.8rem;font-weight:700;display:flex;align-items:center;justify-content:center;z-index:1;line-height:1;text-shadow:0 1px 4px rgba(0,0,0,.8),0 0 2px rgba(0,0,0,.8)}.shade-picker__swatch.is-selected:hover{transform:scale(1.04)}.shade-picker__swatch:focus-visible{outline:2px solid var(--sp-accent);outline-offset:2px}.shade-picker__swatch.is-unavailable{opacity:.4;cursor:not-allowed;pointer-events:none}.shade-picker__swatch.is-unavailable:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(-45deg,transparent,transparent 4px,rgba(0,0,0,.25) 4px,rgba(0,0,0,.25) 5px);z-index:2;border-radius:var(--sp-radius)}.shade-picker__more-btn{display:none;align-items:center;justify-content:center;background:none;border:none;padding:0 4px;margin:0;font-family:inherit;font-size:14px;font-weight:500;color:#111;letter-spacing:-.01em;white-space:nowrap;line-height:1.2;cursor:pointer;align-self:center;transition:color .2s ease,opacity .2s ease}.shade-picker__more-btn:hover{color:var(--sp-accent);opacity:.8}.shade-picker__more-btn:focus-visible{outline:2px solid #111111;outline-offset:2px}.shade-picker__more-btn.is-visible{display:inline-flex}.shade-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:10000;display:flex;align-items:flex-end;justify-content:center;opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s ease}@media screen and (min-width:750px){.shade-modal-overlay{align-items:center}}.shade-modal-overlay.is-open{opacity:1;visibility:visible}.shade-modal{background:#fff;border-radius:20px 20px 0 0;width:100%;max-width:100%;max-height:75vh;display:flex;flex-direction:column;transform:translateY(30px);transition:transform .3s cubic-bezier(.34,1.56,.64,1);overflow:hidden;box-shadow:0 -8px 40px #0000002e}@media screen and (min-width:750px){.shade-modal{border-radius:20px;max-width:580px;max-height:70vh;transform:translateY(20px) scale(.97);box-shadow:0 24px 60px #00000038}}.shade-modal-overlay.is-open .shade-modal{transform:translateY(0) scale(1)}.shade-modal__header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px 12px;border-bottom:1px solid rgba(0,0,0,.08);flex-shrink:0}.shade-modal__title{font-size:1.7rem;font-weight:700;letter-spacing:-.02em;color:#111;margin:0}.shade-modal__count{font-size:1.2rem;font-weight:400;color:#888;margin-left:6px}.shade-modal__close{width:36px;height:36px;border-radius:50%;border:1.5px solid rgba(0,0,0,.15);background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background var(--sp-transition),border-color var(--sp-transition);color:#333;flex-shrink:0}.shade-modal__close:hover{background:#0000000f;border-color:#0000004d}.shade-modal__close:focus-visible{outline:2px solid #000;outline-offset:2px}.shade-modal__close svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}.shade-modal__body{overflow-y:auto;padding:16px 20px 24px;-webkit-overflow-scrolling:touch}.shade-modal__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px 8px;list-style:none;margin:0;padding:0}@media screen and (min-width:480px){.shade-modal__grid{grid-template-columns:repeat(4,1fr)}}@media screen and (min-width:750px){.shade-modal__grid{grid-template-columns:repeat(6,1fr);gap:12px 10px}}.shade-modal__item{display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer}.shade-modal__item-btn{width:100%;aspect-ratio:1 / 1;border-radius:var(--sp-radius);border:1px solid var(--sp-border);background:var(--sp-hover-bg);overflow:hidden;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center;transition:transform var(--sp-transition),border-color var(--sp-transition),box-shadow var(--sp-transition);position:relative}.shade-modal__item-btn img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}.shade-modal__item-btn:hover{transform:scale(1.06);border-color:#aaa;box-shadow:0 3px 10px #0000001f}.shade-modal__item-btn.is-selected{border-color:#780012;box-shadow:0 3px 10px #00000026}.shade-modal__item-btn.is-selected:after{content:"\2713";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--sp-radius);border:2px solid #ffffff;background:transparent;color:#fff;font-size:1.6rem;font-weight:700;display:flex;align-items:center;justify-content:center;z-index:1;line-height:1;text-shadow:0 1px 4px rgba(0,0,0,.8),0 0 2px rgba(0,0,0,.8)}.shade-modal__item-btn:focus-visible{outline:2px solid var(--sp-accent);outline-offset:3px}.shade-modal__item.is-unavailable .shade-modal__item-btn,.shade-modal__item-btn.is-unavailable{opacity:.4;cursor:not-allowed;pointer-events:none}.shade-modal__item.is-unavailable .shade-modal__item-btn:before,.shade-modal__item-btn.is-unavailable:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(-45deg,transparent,transparent 4px,rgba(0,0,0,.25) 4px,rgba(0,0,0,.25) 5px);z-index:2;border-radius:var(--sp-radius)}.shade-modal__item.is-unavailable .shade-modal__item-name{opacity:.5;text-decoration:line-through}.shade-modal__item-name{font-size:1.05rem;font-weight:500;text-align:center;color:#333;line-height:1.2;word-break:break-word;max-width:100%}.shade-modal__item.is-selected .shade-modal__item-name{font-weight:700;color:#000}.shade-modal__item-btn--placeholder{background:linear-gradient(135deg,#e8e8e8,#d0d0d0)}.shade-modal__item-btn--placeholder:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(45deg,transparent,transparent 5px,rgba(0,0,0,.07) 5px,rgba(0,0,0,.07) 6px)}@media screen and (max-width:749px){.shade-picker__body{flex-direction:row;align-items:center;gap:10px}.shade-picker__preview-wrap{width:44px;height:44px}.shade-picker__swatches-wrap{width:auto}.shade-modal__header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px 12px;border-bottom:1px solid rgba(0,0,0,.08);flex-shrink:0}.shade-modal__body{padding:14px 16px 20px}}
/*# sourceMappingURL=/cdn/shop/t/5/assets/shade-picker.css.map */