@media screen and (max-width:699px){.variant-picker__option.color-variants-option{gap:0!important}}.color-variants-list{display:grid;grid-template-columns:repeat(5,1fr);align-items:start;gap:0px 3px;margin-top:8px}.color-variant-swatch{position:relative;display:flex;align-items:center;justify-content:center;width:100%;cursor:pointer;border:1px solid transparent;transition:all .2s ease;overflow:visible;background:#f5f5f5;min-height:40px}.color-variant-swatch:hover{border-color:#ccc}.color-variant-swatch.is-selected{border-color:rgb(var(--text-color))}.color-variant-swatch:before{content:attr(data-color-name);position:absolute;bottom:100%;left:50%;transform:translate(-50%) translateY(-8px);background:#fff;color:#000;padding:6px 12px;font-size:14px;line-height:1.2;white-space:nowrap;border:1px solid #e0e0e0;box-shadow:0 2px 8px #0000001a;opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease;z-index:10}.color-variant-swatch:hover:before{opacity:1;transform:translate(-50%) translateY(-12px)}.color-variant-swatch__image{width:100%;height:auto;object-fit:contain;display:block}.color-variant-swatch__label{position:absolute;top:5px;left:5px;background-color:#000;color:#fff;padding:3px 8px;font-size:12px;line-height:1.2;border-radius:3px;z-index:2;font-weight:500}.color-variant-see-more{display:inline-flex;align-items:center;justify-content:center;width:100%;aspect-ratio:1;border:2px solid rgba(var(--text-color),.15);text-decoration:none;font-size:14px;font-weight:500;color:rgb(var(--text-color));transition:all .2s ease}.color-variant-see-more:hover{border-color:rgb(var(--text-color));background-color:rgba(var(--text-color),.05)}.color-variant-swatch.is-hidden,.variant-picker__option-value.is-hidden{display:none}@keyframes slideInDown{0%{opacity:0;transform:translateY(-10px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.color-variant-swatch.is-revealing,.variant-picker__option-value.is-revealing{animation:slideInDown .3s ease-out forwards}.color-variants__view-more{display:inline-block;margin-top:12px;background:none;border:none;color:rgb(var(--text-color));font-size:14px;font-weight:400;text-decoration:underline;cursor:pointer;padding:0;transition:opacity .2s ease}.color-variants__view-more:hover{opacity:.7}.color-variants__view-more[hidden],.color-variant-view-all-tile{display:none}@media screen and (max-width:640px){.color-variants-list{grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;margin-top:12px}.color-variant-swatch__label{font-size:10px;padding:2px 6px}.color-variants-list.shopify-payment-button{display:none}}@media screen and (min-width:641px)and (max-width:1007px){.color-variants-list{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}.shopify-payment-button{display:none}}@media screen and (max-width:999px){.variant-stock-component{display:none!important}.variant-picker__option-info.h-stack.justify-between.gap-2{margin-top:0!important}.color-variants-collection,color-variants-collection{padding-bottom:10px;border-bottom:1px solid #f2f2f2}.color-variant-swatch,.color-variant-see-more,.color-variant-view-all-tile,color-variants-collection .thumbnail-swatch,color-variants-collection .block-swatch,color-variants-collection .color-swatch{aspect-ratio:53 / 40;border-radius:4px;background:#f2f2f2;overflow:hidden}color-variants-collection:not([data-colors-expanded=true]) .color-variants-list__cell[data-trimmed=true]>*{display:none!important}color-variants-collection[data-colors-expanded=true] .color-variant-view-all-tile{display:none}.color-variant-view-all-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;margin:0;padding:0;border:1px solid #ffffff;cursor:pointer;text-align:center;color:#111;font-family:Nunito Sans,sans-serif}.color-variant-view-all-tile__count,.color-variant-view-all-tile__link{display:block;font-size:10px;font-weight:400;line-height:normal;letter-spacing:0;font-family:Nunito Sans,sans-serif}.color-variant-view-all-tile__link{text-decoration:underline;text-underline-offset:2px;text-decoration-skip-ink:none;text-transform:capitalize}}@media screen and (min-width:1000px){.color-variant-view-all-tile{display:none!important}.color-variants-list__cell[data-trimmed=true]>*{display:revert!important}}
/*# sourceMappingURL=/cdn/shop/t/203/assets/color-variants-collection.css.map */
