.color-swatches-section{--cs-ink: #22303f;--cs-bg-page: #f0ede6;--cs-pill-bg: #ffffff;--cs-pill-border: #ddd6c9;--cs-accent: #c96f4a;--cs-tile-size: 170px;padding:48px 40px 80px;background:var(--cs-bg-page);color:var(--cs-ink)}.color-swatches-header{margin-bottom:32px}.color-swatches-title{font-size:2.5rem;font-weight:700;margin:0 0 8px;color:var(--cs-ink)}.color-swatches-subtitle{font-size:1rem;opacity:.75;margin:0}.color-swatches-filterbar{display:flex;flex-wrap:wrap;gap:32px 40px;align-items:flex-start;padding-bottom:40px;margin-bottom:8px;border-bottom:1px solid var(--cs-pill-border)}.cs-filter-group{display:flex;flex-direction:column;gap:12px}.cs-filter-label{font-size:.85rem;font-weight:600;margin:0;color:var(--cs-ink)}.cs-pill-row{display:flex;flex-wrap:wrap;gap:8px;max-width:320px}.cs-pill{font:inherit;font-size:.9rem;padding:8px 18px;border-radius:999px;border:1px solid var(--cs-pill-border);background:var(--cs-pill-bg);color:var(--cs-ink);cursor:pointer;transition:background .15s ease,color .15s ease,border-color .15s ease}.cs-pill:hover{border-color:var(--cs-ink)}.cs-pill.is-active{background:var(--cs-ink);border-color:var(--cs-ink);color:#fff}.cs-dot-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.cs-dot{width:32px;height:32px;border-radius:50%;border:1px solid rgba(0,0,0,.15);background:var(--dot-color, #ccc);cursor:pointer;padding:0;position:relative;transition:transform .15s ease,box-shadow .15s ease}.cs-dot:hover{transform:scale(1.1)}.cs-dot.is-active{box-shadow:0 0 0 2px var(--cs-bg-page),0 0 0 4px var(--cs-ink)}.cs-dot-all{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:.6rem;font-weight:700;color:var(--cs-ink);background:var(--cs-pill-bg);border-radius:50%}.cs-toggle{display:inline-flex;cursor:pointer}.cs-toggle input{position:absolute;opacity:0;width:1px;height:1px}.cs-toggle-track{width:44px;height:24px;border-radius:999px;background:#d9d2c2;position:relative;transition:background .15s ease}.cs-toggle-thumb{position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:#fff;transition:transform .15s ease}.cs-toggle input:checked+.cs-toggle-track{background:var(--cs-ink)}.cs-toggle input:checked+.cs-toggle-track .cs-toggle-thumb{transform:translate(20px)}.cs-scale-slider{width:180px;accent-color:var(--cs-ink)}.cs-sample-btn{align-self:flex-start;display:inline-block;padding:14px 28px;border-radius:999px;background:var(--cs-ink);color:#fff;font-weight:600;text-decoration:none;white-space:nowrap;transition:background .15s ease}.cs-sample-btn:hover{background:var(--cs-accent);color:#fff}.cs-group+.cs-group{margin-top:56px}.cs-group-heading{font-size:2.25rem;font-weight:700;margin:40px 0 24px;color:var(--cs-ink)}.cs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--cs-tile-size),1fr));gap:24px}.cs-swatch{display:flex;flex-direction:column;gap:10px}.cs-swatch[hidden],.cs-group[hidden]{display:none!important}.cs-swatch-image{width:100%;aspect-ratio:1 / 1;overflow:hidden;border-radius:2px;background:#e3ded2}.cs-swatch-image img{width:100%;height:100%;object-fit:cover;display:block}.cs-swatch-placeholder{width:100%;height:100%;background:repeating-linear-gradient(45deg,#e3ded2,#e3ded2 10px,#d9d2c2 10px 20px)}.cs-swatch-label{font-size:.9rem;margin:0;color:var(--cs-ink)}.cs-empty-state{padding:60px 0;text-align:center;opacity:.6}@media screen and (max-width:749px){.color-swatches-section{padding:32px 20px 60px}.color-swatches-filterbar{gap:24px}.cs-pill-row{max-width:100%}.cs-sample-btn{width:100%;text-align:center}.cs-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:14px}}
/*# sourceMappingURL=/cdn/shop/t/4/assets/color-swatches.css.map */