.color-variants-container{margin:.3rem 0 .2rem}.color-variants{display:flex;gap:10px;align-items:center;margin-bottom:10px;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;scroll-behavior:smooth;-webkit-overflow-scrolling:touch}.color-variants::-webkit-scrollbar{display:none}.color-variants{-ms-overflow-style:none;scrollbar-width:none}.color-variant{position:relative;display:block;width:40px;height:60px;border:1px solid #e0e0e0;border-radius:4px;overflow:hidden;cursor:pointer;transition:all .3s ease;text-decoration:none}.color-variant:hover{transform:scale(1.05);border-color:#000;box-shadow:0 2px 8px #00000026}.color-variant.active{border:1.6px solid #000;box-shadow:0 2px 8px #0003}.color-variant img{width:100%;height:100%;object-fit:cover}.color-swatch{width:100%;height:100%}.color-variant-tooltip{position:absolute;bottom:-35px;left:50%;transform:translate(-50%);background:#fff;border:1px solid #000;padding:4px 10px;font-size:11px;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease;z-index:10;pointer-events:none;color:#000;font-weight:500}.color-variant-tooltip:before{content:"";position:absolute;top:-5px;left:50%;transform:translate(-50%);width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:5px solid #000}.color-variant-tooltip:after{content:"";position:absolute;top:-4px;left:50%;transform:translate(-50%);width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:4px solid #fff}.color-variant:hover .color-variant-tooltip{opacity:1;visibility:visible}.color-variant-label{margin-top:5px;color:#666}.color-variant-label-text{font-family:Times New Roman,Times,serif;font-size:10px;font-weight:400;text-transform:uppercase;letter-spacing:.3px}.color-variant{flex-shrink:0}.color-variant-more{position:relative;display:flex;align-items:center;justify-content:center;background:#f5f5f5;border:1px solid #000;color:#000;font-size:11px;font-weight:600;text-decoration:none}.color-variant-more:hover{background:#000;color:#fff;transform:scale(1.05)}.more-indicator{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:12px;font-weight:600;letter-spacing:.5px}.color-variant-more .color-variant-tooltip{display:none}@media (max-width: 768px){.color-variant{width:35px;height:50px}.color-variants{gap:8px;padding-right:0;overflow:hidden;flex-wrap:nowrap}.color-variant-more{width:35px;height:50px}.color-variant-tooltip{font-size:10px;padding:3px 8px;bottom:-30px}.template-collection .color-variants,.template-search .color-variants,.card .color-variants,.card-wrapper .color-variants{scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none}.template-collection .color-variant,.template-search .color-variant,.card .color-variant,.card-wrapper .color-variant{scroll-snap-align:start;scroll-snap-stop:always}}.card__inner .color-variants{margin-top:.3rem;margin-bottom:.2rem;gap:6px;position:relative;overflow:hidden;flex-wrap:nowrap;min-height:35px}.card__inner .color-variant{width:25px;height:35px;border-width:1px;flex-shrink:0}.card__inner .color-variant.active{border-width:1.2px}.card__inner .color-variant-more{width:25px;height:35px;font-size:10px}.card__inner .more-indicator{font-size:10px}.card__inner .color-variant-label{font-size:11px;margin-top:3px;min-height:14px}.card .color-variants-container,.card-wrapper .color-variants-container{min-height:40px;display:block}.card-information:not(:has(.color-variants-container)):after,.card__inner:not(:has(.color-variants-container)):after{content:"";display:block;height:40px}@supports not selector(:has(*)){.card-information,.card__inner{padding-bottom:40px}.card-information .color-variants-container,.card__inner .color-variants-container{margin-bottom:-40px}}@media (max-width: 768px){.card__inner .color-variants,.card-wrapper .color-variants,.card .color-variants{overflow:hidden;flex-wrap:nowrap;padding-right:0;gap:8px}.card__inner .color-variant,.card-wrapper .color-variant,.card .color-variant{width:28px;height:38px}.card__inner .color-variant-more,.card-wrapper .color-variant-more,.card .color-variant-more{width:28px;height:38px;font-size:9px}}.product__info-container .color-variants-container{margin-bottom:20px}@media (min-width: 769px){.color-variants{padding-bottom:40px;margin-bottom:-30px}}@media (max-width: 768px){.scrollable-variants{cursor:grab;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.scrollable-variants:active{cursor:grabbing}.template-collection .color-variant,.template-search .color-variant,.card .color-variant,.card-wrapper .color-variant{transition:transform .2s ease,box-shadow .2s ease}.card__inner .color-variants:focus-within,.card__inner .color-variants:hover{outline:none}}
/*# sourceMappingURL=/cdn/shop/t/27/assets/color-variant-selector.css.map */
