.color-swatches{display:flex;flex-wrap:wrap;gap:15px;margin:20px 0}.swatch-item{position:relative;width:60px;height:60px;border-radius:50%;cursor:pointer;border:2px solid #e5e5e5;overflow:hidden;transition:all .3s ease;display:flex;flex-direction:column;align-items:center;text-align:center}.swatch-item img{width:100%;height:100%;object-fit:cover;border-radius:50%;transition:transform .3s ease}.swatch-item:hover{transform:scale(1.05);border-color:#999}.swatch-item:hover img{transform:scale(1.1)}.swatch-item.selected{border-color:#000;transform:scale(1.1)}.swatch-color{display:block;width:100%;height:100%;border-radius:50%;transition:transform .3s ease}.swatch-item:hover .swatch-color{transform:scale(1.1)}.swatch-item.sold-out{opacity:.6;cursor:not-allowed}.swatch-item.sold-out:before{content:"Out Of Stock";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#000c;color:#fff;font-size:8px;font-weight:700;padding:2px 4px;border-radius:3px;z-index:2;white-space:nowrap;line-height:1}.swatch-item.sold-out:hover{transform:none;border-color:#e5e5e5}.swatch-info{display:flex;flex-direction:column;align-items:center;margin-top:8px;min-height:35px}.swatch-label{font-size:11px;font-weight:500;color:#333;margin-bottom:2px;line-height:1.2;text-align:center;max-width:70px}.swatch-price{font-size:10px;color:#666;font-weight:400}.swatch-price.on-sale{color:#e53e3e}.swatch-compare-price{font-size:9px;color:#999;text-decoration:line-through;margin-right:3px}.color-swatch-section{margin:25px 0}.color-swatch-section h3{margin-bottom:15px;font-size:18px;font-weight:600}.swatch-controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:15px}.swatch-filters{display:flex;gap:25px;align-items:center;flex-wrap:wrap}.filter-group{display:flex;align-items:center;gap:8px;position:relative}.filter-label{font-size:12px;color:#888;font-weight:400;margin:0;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}.filter-select{position:relative!important;appearance:none!important;-webkit-appearance:none!important;-moz-appearance:none!important;background:transparent!important;border:none!important;border-radius:0!important;padding:4px 12px 4px 0!important;font-size:14px!important;font-family:Figtree,sans-serif!important;font-weight:400!important;color:#333!important;min-width:auto!important;cursor:pointer!important;transition:all .2s ease!important;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e")!important;background-repeat:no-repeat!important;background-position:calc(100% + -0px) center!important;background-size:12px!important}.filter-select:hover{color:#000!important;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23333' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e")!important}.filter-select:focus{outline:none!important;color:#000!important}.filter-select:active{transform:none!important}.filter-select option{padding:8px 12px!important;font-size:12px!important;font-family:Figtree,sans-serif!important;color:#333!important;background:#fff!important;border:none!important;line-height:1.4!important}.filter-select option:hover{background:#f8f9fa!important;color:#000!important}.filter-select option:checked,.filter-select option:focus,select.filter-select option:checked,select.filter-select option:focus{background:#e3f2fd!important;background-color:#e3f2fd!important;color:#1976d2!important;font-weight:500!important}.filter-select::-webkit-scrollbar{width:6px}.filter-select::-webkit-scrollbar-track{background:#f1f1f1;border-radius:3px}.filter-select::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:3px}.filter-select::-webkit-scrollbar-thumb:hover{background:#a8a8a8}.swatch-count{font-size:12px;color:#888;font-weight:400;margin:0;padding:0}.swatch-controls{background:none;border:none;border-radius:0;padding:0;margin-bottom:20px}.color-swatch-content{background-color:#fafbfb;border-radius:8px;padding:20px;margin:20px 0;border:1px solid #e9ecef}@media(max-width:768px){.color-swatch-content{padding:15px!important;margin:15px 0!important;border-radius:6px!important}}@media(max-width:480px){.color-swatch-content{padding:12px!important;margin:10px 0!important;border-radius:4px!important}}.color-swatch-content .color-swatches-grid{margin:10px 0}.color-swatches-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:16px;margin:20px 0;width:100%;justify-items:center}@media(min-width:1200px){.color-swatches-grid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:20px}}@media(min-width:1400px){.color-swatches-grid{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:18px}}@media(max-width:768px){.color-swatches-grid{grid-template-columns:repeat(3,1fr)!important;gap:12px!important;margin:15px 0!important;justify-items:center!important}}@media(max-width:480px){.color-swatches-grid{grid-template-columns:repeat(2,1fr)!important;gap:10px!important;margin:10px 0!important;justify-items:center!important}}@media(max-width:360px){.color-swatches-grid{grid-template-columns:repeat(2,1fr)!important;gap:8px!important;justify-items:center!important}}.swatch-card{display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;animation:fadeIn .4s ease forwards}.swatch-card:nth-child(1){animation-delay:.05s}.swatch-card:nth-child(2){animation-delay:.1s}.swatch-card:nth-child(3){animation-delay:.15s}.swatch-card:nth-child(4){animation-delay:.2s}.swatch-card:nth-child(5){animation-delay:.25s}#product-content.loading{opacity:.6;pointer-events:none;position:relative}#product-content.loading:after{content:"";position:absolute;top:50%;left:50%;width:30px;height:30px;border:3px solid rgba(0,0,0,.1);border-top-color:#000;border-radius:50%;animation:spin 1s linear infinite;transform:translate(-50%,-50%)}@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}.no-swatches-message{animation:fadeIn .5s ease;padding:40px 20px!important;background:#f8f8f8;border-radius:8px;margin:20px 0}@media(max-width:768px){.filter-controls div[style*="column-gap: 30px"]{column-gap:18px!important;row-gap:10px!important;flex-wrap:wrap!important}.filter-controls select{min-width:auto!important;max-width:200px!important;padding:2px 12px 2px 0!important}}@media(max-width:650px){.filter-controls div[style*="column-gap: 30px"]{column-gap:15px!important;row-gap:10px!important}}@media(max-width:580px){.filter-controls div[style*="column-gap: 30px"]{flex-direction:column!important;column-gap:0px!important;row-gap:12px!important;align-items:flex-start!important;width:100%!important}.filter-controls div[style*="white-space: nowrap"]{white-space:normal!important;width:100%!important}.filter-controls select{margin-left:0!important;margin-top:5px!important;display:block!important;width:auto!important}}@media(max-width:480px){.filter-controls div[style*="column-gap: 30px"]{column-gap:0px!important;row-gap:10px!important}}@media(max-width:768px){.color-swatches-grid{grid-template-columns:repeat(auto-fill,minmax(70px,1fr));gap:15px}.swatch-item{width:50px;height:50px}.swatch-controls{flex-direction:column;align-items:stretch;padding:12px 15px}.swatch-filters{justify-content:center;gap:10px}.filter-select{min-width:120px;font-size:14px;font-family:Figtree,sans-serif;padding:6px 30px 6px 10px}.filter-label{font-size:11px}}@keyframes slideIn{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.filter-select::-ms-expand{display:none}@-moz-document url-prefix(){.filter-select{background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e")}}.swatch-filters select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background:transparent;border:none;padding:4px 12px 4px 0;font-size:14px;font-family:Figtree,sans-serif;font-weight:400;color:#333;cursor:pointer;transition:color .2s ease;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:calc(100% + -0px) center;background-size:12px}.swatch-filters select:hover{color:#000;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23333' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e")}.swatch-filters select:focus{outline:none;color:#000}.swatch-filters select option{padding:8px 12px;font-size:12px;font-family:Figtree,sans-serif;color:#333;background:#fff;border:none;line-height:1.4}.swatch-card{display:flex;flex-direction:column;align-items:center;text-align:center;cursor:pointer;transition:transform .2s ease}.swatch-card.swatch-size-large-grid .swatch-item{width:120px;height:120px;border:2px solid #ddd;border-radius:8px;overflow:hidden;background:#fff;margin-bottom:8px;transition:border-color .2s ease;position:relative}@media(max-width:768px){.swatch-card.swatch-size-large-grid .swatch-item{width:100px!important;height:100px!important}}@media(max-width:480px){.swatch-card.swatch-size-large-grid .swatch-item{width:120px!important;height:120px!important}}@media(max-width:360px){.swatch-card.swatch-size-large-grid .swatch-item{width:110px!important;height:110px!important}}.swatch-card.swatch-size-large-grid .swatch-item.selected{border:3px solid #007bff}.swatch-card.swatch-size-large-grid .swatch-item:hover{border-color:#007bff}.swatch-card.swatch-size-large-grid img,.swatch-card.swatch-size-large-grid .swatch-color{width:100%;height:100%;object-fit:cover;display:block;border-radius:6px}.swatch-card.swatch-size-large-grid .swatch-label{display:block;font-size:12px;margin-top:4px;font-weight:500;color:#333;max-width:120px;white-space:normal;text-align:center;line-height:1.3}@media(max-width:768px){.swatch-card.swatch-size-large-grid .swatch-label{font-size:11px!important;max-width:100px!important}}@media(max-width:480px){.swatch-card.swatch-size-large-grid .swatch-label{font-size:12px!important;max-width:120px!important}.swatch-card.swatch-size-small-grid .swatch-label{font-size:11px!important;max-width:90px!important}}.swatch-card.swatch-size-large-grid .swatch-price{display:none}.swatch-card.out-of-stock{opacity:.6}.swatch-card.out-of-stock .swatch-item{border-color:#ccc!important;background:#f5f5f5}.swatch-card.out-of-stock .swatch-label{color:#666!important}.swatch-card.out-of-stock img,.swatch-card.out-of-stock .swatch-color{filter:grayscale(.5) brightness(.8)}.out-of-stock-section-header{grid-column:1 / -1;margin:20px 0 12px;font-weight:600;color:#666;font-size:16px;border-top:1px solid #ddd;padding-top:16px}@media(max-width:768px){.swatch-card.swatch-size-large-grid .swatch-item{width:100px;height:100px}.swatch-card.swatch-size-large-grid .swatch-label{font-size:11px;max-width:100px}.swatch-card.swatch-size-small-grid .swatch-item{width:70px;height:70px}.swatch-card.swatch-size-small-grid .swatch-label{font-size:10px;max-width:70px}}@media(max-width:480px){.swatch-card.swatch-size-large-grid .swatch-item{width:80px;height:80px}.swatch-card.swatch-size-large-grid .swatch-label{font-size:10px;max-width:80px}.swatch-card.swatch-size-small-grid .swatch-item{width:60px;height:60px}.swatch-card.swatch-size-small-grid .swatch-label{font-size:9px;max-width:60px}}.swatch-card.swatch-size-small-grid .swatch-item{width:80px;height:80px;border:2px solid #ddd;border-radius:8px;overflow:hidden;background:#fff;margin-bottom:6px;transition:border-color .2s ease;position:relative}@media(max-width:768px){.swatch-card.swatch-size-small-grid .swatch-item{width:80px!important;height:80px!important}}@media(max-width:480px){.swatch-card.swatch-size-small-grid .swatch-item{width:90px!important;height:90px!important}}@media(max-width:360px){.swatch-card.swatch-size-small-grid .swatch-item{width:80px!important;height:80px!important}}.swatch-card.swatch-size-small-grid .swatch-item.selected{border:3px solid #007bff}.swatch-card.swatch-size-small-grid .swatch-item:hover{border-color:#007bff}.swatch-card.swatch-size-small-grid img,.swatch-card.swatch-size-small-grid .swatch-color{width:100%;height:100%;object-fit:cover;display:block;border-radius:6px}.swatch-card.swatch-size-small-grid .swatch-label{display:block;font-size:11px;margin-top:4px;font-weight:500;color:#333;max-width:80px;white-space:normal;text-align:center;line-height:1.3}.swatch-card.swatch-size-small-grid .swatch-price{display:none}.swatch-card.swatch-size-small-grid.out-of-stock .swatch-item{border-color:#ccc!important;background:#f5f5f5}.swatch-card.swatch-size-small-grid.out-of-stock .swatch-label{color:#666!important}.swatch-card.swatch-size-small-grid.out-of-stock img,.swatch-card.swatch-size-small-grid.out-of-stock .swatch-color{filter:grayscale(.3) brightness(.9)}.swatch-card.swatch-size-list-view{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;background:#f5f5f5;border-radius:6px;margin-bottom:8px;padding:12px 16px;min-height:60px;border:2px solid #e0e0e0;text-align:left;width:100%;transition:all .2s ease}.swatch-card.swatch-size-list-view:hover{background:#ebebeb;border-color:#d0d0d0}.swatch-card.swatch-size-list-view.selected{background:#e8f4fd;border-color:#2196f3;box-shadow:0 0 0 1px #2196f3}.swatch-card.swatch-size-list-view .swatch-item{width:48px;height:48px;margin-right:16px;flex-shrink:0}.swatch-card.swatch-size-list-view .swatch-item img,.swatch-card.swatch-size-list-view .swatch-item .swatch-color{width:48px;height:48px;border-radius:50%}.swatch-card.swatch-size-list-view .swatch-info{display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between;gap:16px;margin-top:0;margin-left:0;flex:1;min-width:0}.swatch-card.swatch-size-list-view .swatch-label{display:block;font-size:16px;font-weight:500;color:#333;margin:0;flex:1;white-space:normal;line-height:1.3;padding-right:16px}.swatch-card.swatch-size-list-view .swatch-status{font-size:14px;color:#555;font-weight:400;white-space:nowrap;flex-shrink:0;align-self:flex-start;margin-top:2px}@media(max-width:768px){.swatch-card.swatch-size-large-grid .swatch-item,.swatch-card.swatch-size-large-grid img,.swatch-card.swatch-size-large-grid .swatch-color{width:120px;height:120px}.swatch-card.swatch-size-large-grid .swatch-label{font-size:14px;max-width:130px}}@media(max-width:480px){.swatch-card.swatch-size-large-grid .swatch-item,.swatch-card.swatch-size-large-grid img,.swatch-card.swatch-size-large-grid .swatch-color{width:100px;height:100px}.swatch-card.swatch-size-small-grid .swatch-item,.swatch-card.swatch-size-small-grid img,.swatch-card.swatch-size-small-grid .swatch-color{width:70px;height:70px}}
/*# sourceMappingURL=/cdn/shop/t/7/assets/color-swatches.css.map */
