.ral-picker{--ral-swatch-size: 44px;--ral-swatch-gap: 8px;--ral-border: rgba(0,0,0,.12);--ral-border-selected: #0a1428;margin:8px 0 16px}.ral-picker__header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:10px}.ral-picker__selected-name{font-size:14px;font-weight:600;color:var(--color-foreground, #0a1428);letter-spacing:.01em}.ral-picker__selected-name strong{font-weight:700}.ral-picker__search{position:relative;flex:0 1 220px;min-width:160px}.ral-picker__search input{width:100%;padding:8px 12px 8px 32px;font-size:13px;border:1px solid var(--ral-border);border-radius:4px;background:var(--color-background, #fff);color:inherit}.ral-picker__search input:focus{outline:none;border-color:var(--ral-border-selected);box-shadow:0 0 0 2px #0a142814}.ral-picker__search svg{position:absolute;left:9px;top:50%;transform:translateY(-50%);width:14px;height:14px;opacity:.55;pointer-events:none}.ral-picker__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--ral-swatch-size),1fr));gap:var(--ral-swatch-gap);max-height:320px;overflow-y:auto;padding:4px;border:1px solid var(--ral-border);border-radius:6px;scrollbar-width:thin}.ral-picker__grid::-webkit-scrollbar{width:6px}.ral-picker__grid::-webkit-scrollbar-thumb{background:#0003;border-radius:3px}.ral-picker__swatch{position:relative;width:100%;aspect-ratio:1 / 1;border:2px solid transparent;border-radius:6px;cursor:pointer;background-color:var(--ral-color, #ccc);transition:transform .12s ease,border-color .12s ease,box-shadow .12s ease;display:block}.ral-picker__swatch:hover{transform:translateY(-1px);box-shadow:0 4px 10px #00000026;border-color:#0000004d}.ral-picker__swatch.is-selected{border-color:var(--ral-border-selected);box-shadow:0 0 0 2px var(--color-background, #fff),0 0 0 4px var(--ral-border-selected)}.ral-picker__swatch.is-hidden{display:none}.ral-picker__swatch.is-unavailable{opacity:.35;cursor:not-allowed;position:relative}.ral-picker__swatch.is-unavailable:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to top right,transparent calc(50% - 1px),rgba(0,0,0,.6) calc(50% - 1px),rgba(0,0,0,.6) calc(50% + 1px),transparent calc(50% + 1px))}.ral-picker__swatch-code{position:absolute;bottom:2px;left:50%;transform:translate(-50%);font-size:9px;font-weight:600;line-height:1;padding:2px 4px;background:#ffffffd9;color:#0a1428;border-radius:2px;letter-spacing:0;pointer-events:none;white-space:nowrap}.ral-picker__swatch[data-luminance=dark] .ral-picker__swatch-code{background:#0000008c;color:#fff}.ral-picker__swatch:before{content:attr(data-ral-name);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%);padding:5px 9px;font-size:12px;font-weight:500;color:#fff;background:#0a1428;border-radius:4px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .15s ease;z-index:10}.ral-picker__swatch:hover:before{opacity:1}.ral-picker-host .swatch-group,.ral-picker-host .varient-class,.ral-picker-host>legend,.ral-picker-host input[type=radio]{position:absolute!important;opacity:0!important;pointer-events:none!important;width:1px!important;height:1px!important;overflow:hidden!important}.ral-picker-host .swatch-label-text{position:static}@media(max-width:640px){.ral-picker{--ral-swatch-size: 52px;--ral-swatch-gap: 6px}.ral-picker__grid{max-height:280px}.ral-picker__swatch:before{display:none}.ral-picker__swatch-code{font-size:10px}}.ral-picker__empty{grid-column:1 / -1;padding:30px 10px;text-align:center;color:#0000008c;font-size:13px}
/*# sourceMappingURL=/cdn/shop/t/6/assets/ral-color-picker.css.map */