.ayla-color-picker{background:#fff;padding:32px 24px}.ayla-color-picker__header{max-width:1300px;margin:0 auto 24px}.ayla-color-picker__eyebrow{margin:0 0 6px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#666}.ayla-color-picker__heading{margin:0;font-size:20px;letter-spacing:.05em;text-transform:uppercase;color:#000}.ayla-color-picker__swatches{max-width:1300px;margin:0 auto 32px;display:flex;flex-wrap:wrap;gap:14px}.ayla-color-picker__swatch{width:44px;height:44px;border-radius:50%;border:2px solid transparent;padding:0;cursor:pointer;position:relative}.ayla-color-picker__swatch.is-active{border-color:#000;outline:1px solid #ffffff;outline-offset:-6px}.ayla-color-picker__swatch-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.ayla-color-picker__panels{max-width:1300px;margin:0 auto}.ayla-color-picker__panel{display:none}.ayla-color-picker__panel.is-active{display:block}.ayla-color-picker__track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding-bottom:8px}.ayla-color-picker__item{flex:0 0 240px;scroll-snap-align:start}.ayla-color-picker__link{text-decoration:none;color:#000;display:block}.ayla-color-picker__image{position:relative;width:100%;aspect-ratio:3 / 4;background:#f2f2f2;overflow:hidden;margin-bottom:10px}.ayla-color-picker__quick-add{position:absolute;bottom:10px;right:10px;width:36px;height:36px;border-radius:50%;background:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px #00000026}.ayla-color-picker__quick-add-icon{font-size:18px;line-height:1;color:#000}.ayla-color-picker__quick-add:disabled{opacity:.6;cursor:default}.ayla-color-picker__image img{width:100%;height:100%;object-fit:cover;display:block}.ayla-color-picker__placeholder{width:100%;height:100%;background:#e0e0e0}.ayla-color-picker__name{margin:0 0 2px;font-size:13px}.ayla-color-picker__variant{margin:0 0 4px;font-size:12px;color:#666}.ayla-color-picker__price{margin:0;font-size:13px;font-weight:600}.ayla-color-picker__empty{font-size:13px;color:#666;padding:20px 0}@media screen and (max-width:767px){.ayla-color-picker{padding:24px 16px}.ayla-color-picker__item{flex:0 0 62%}.ayla-color-picker__heading{font-size:16px}.ayla-color-picker__swatch{width:38px;height:38px}}
/*# sourceMappingURL=/cdn/shop/t/4/assets/ayla-color-picker.css.map */