h1{font-size:clamp(1.2rem,2.5vw,2rem);font-weight:500;margin-bottom:3vh}.container-color{background-color:#8a2be2}.try-on-btn{width:30%;height:8vh;border:.3vh solid #333;border-radius:9999px;background-color:#fff;font-size:clamp(1rem,1.6vw,1.2rem);font-weight:600;letter-spacing:.05em;cursor:pointer;transition:background-color .3s;min-width:150px}.try-on-btn:hover{background-color:#f5f5f5}.filter-tabs{display:flex;width:100%;height:7vh;border:.3vh solid #333;border-radius:9999px;overflow:hidden;margin-bottom:4vh;flex-wrap:wrap}.tab{flex-grow:1;display:flex;justify-content:center;align-items:center;font-size:clamp(.9rem,1.5vw,1rem);font-weight:500;cursor:pointer;transition:background-color .3s;border-right:1px solid #ddd;padding:0 1vw;min-width:80px;height:100%}.tab:last-child{border-right:none}.tab.active{background-color:#333;color:#fff}.swatches-grid{display:grid;grid-template-columns:repeat(9,1fr);gap:1vw;margin-bottom:4vh;width:100%}.swatch{width:100%;aspect-ratio:1/1;border-radius:50%;cursor:pointer;position:relative;transition:transform .2s}.swatch:hover{transform:scale(1.05)}.swatch.selected{transform:scale(1.05);box-shadow:0 0 0 2px #fff,0 0 0 4px #333}.shade-1{background-color:#e8ceb2}.shade-2{background-color:#debd95}.shade-3{background-color:#e5b78a}.shade-4{background-color:#dba978}.shade-5{background-color:#c99d7d}.shade-6{background-color:#eacfb8}.shade-7{background-color:#d9a681}.shade-8{background-color:#e5b48b}.shade-9{background-color:#e2b387}@media (max-width: 768px){.swatches-grid{grid-template-columns:repeat(5,1fr);gap:1.5vh}}.color-selector-block{font-size:.9em;padding:21.6px 0}.color-selector-filters{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:15px}.filter-group{margin-bottom:10px;display:flex;flex-direction:row;align-items:center;gap:10px;position:relative;flex:1 1 50%;min-width:0;margin-top:0!important}.filter-group label{flex-shrink:0;margin-right:8px;line-height:1;display:flex;align-items:center;margin-bottom:0;font-size:clamp(.8rem,1.2vw,.945rem);font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#222}.filter-group select{width:100%;box-sizing:border-box;border:none;border-bottom:2px solid #222;border-radius:0;background:transparent;font-size:.81rem;font-weight:500;color:#222;padding:3.4px 28px 3.4px 0;outline:none;min-width:68px;transition:border-color .2s;appearance:none;-webkit-appearance:none;-moz-appearance:none}.filter-group select:focus{border-bottom:2px solid #222}.color-grid{display:grid;grid-template-columns:repeat(10,1fr)}.color-square{width:100%;aspect-ratio:1/1;cursor:pointer;position:relative;transition:box-shadow .2s;display:flex;align-items:flex-end;justify-content:center;overflow:hidden;transform:scale(.9);color:inherit}.color-square.selected{box-shadow:0 0 0 3px currentColor;outline:2px solid currentColor;outline-offset:-2px}.color-label{font-size:.8rem;color:#222;background:#ffffffb3;padding:2px 6px;border-radius:4px 4px 0 0;margin-bottom:4px}@media (max-width: 700px){.color-selector-block{padding:16px 4px}.color-selector-filters{gap:8px}.color-grid{grid-template-columns:repeat(5,1fr);gap:2px}}.filter-group:after{content:"";position:absolute;right:12px;top:50%;transform:translateY(-50%);width:0;height:0;pointer-events:none;border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid #222;z-index:2}
/*# sourceMappingURL=/cdn/shop/t/12/assets/select-color-theme.css.map */