.color-picker{display:inline-flex;width:100%}.color-picker [data-slot=input-group],.color-picker [data-slot=input-group].focus-within-voltage,.color-picker [data-slot=input-group].focus-within-voltage:focus-within,.color-picker [data-slot=input-group]:focus-within{border-color:transparent!important;outline:none!important;box-shadow:none!important;--tw-ring-shadow:0 0 #0000!important;--tw-ring-offset-shadow:0 0 #0000!important;--tw-shadow:0 0 #0000!important}.color-picker [data-slot=input-group-control]:focus,.color-picker [data-slot=input-group-control]:focus-visible{border-color:transparent!important;outline:none!important;box-shadow:none!important;--tw-ring-shadow:0 0 #0000!important;--tw-ring-offset-shadow:0 0 #0000!important}.color-picker__trigger{display:inline-flex;width:100%;align-items:center;gap:.5rem;border:none;background:transparent;cursor:pointer;outline:none;appearance:none;text-align:left;font:inherit;color:inherit;padding:0}.color-picker__trigger:focus-visible{outline:none}.color-picker__popover{z-index:50;display:flex;width:16.5rem;flex-direction:column;gap:.75rem;overflow:visible;border-radius:1rem;border:1px solid color-mix(in oklch,var(--border) 80%,transparent);background:var(--popover);color:var(--popover-foreground);padding:.75rem;box-shadow:0 10px 40px color-mix(in oklch,var(--foreground) 12%,transparent),0 0 0 1px color-mix(in oklch,var(--foreground) 4%,transparent);scrollbar-width:none}.color-picker__popover::-webkit-scrollbar{display:none;width:0;height:0}.color-picker__popover:focus{outline:none}.color-picker__popover[data-entering=true]{animation:alenta-color-picker-in .15s cubic-bezier(.22,1,.36,1)}.color-picker__popover[data-exiting=true]{animation:alenta-color-picker-out .12s cubic-bezier(.22,1,.36,1)}@keyframes alenta-color-picker-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes alenta-color-picker-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.96)}}.color-area{position:relative;width:100%;max-width:100%;aspect-ratio:1/1;flex-shrink:0;border-radius:.875rem;background:var(--color-area-background);box-shadow:inset 0 0 0 1px color-mix(in oklch,var(--foreground) 10%,transparent);touch-action:none;forced-color-adjust:none}.color-area__thumb{position:absolute;top:50%;left:50%;box-sizing:border-box;width:1.125rem;height:1.125rem;border-radius:9999px;border:2px solid #fff;background:var(--color-area-thumb-color);box-shadow:0 1px 4px rgba(0,0,0,.35);transform:translate(-50%,-50%);forced-color-adjust:none}.color-area__thumb[data-focus-visible=true]{outline:2px solid var(--ring);outline-offset:2px}.color-slider{display:grid;width:100%;gap:.25rem;grid-template-areas:"label output" "track track";grid-template-columns:1fr auto}.color-slider:not(:has([data-slot=label])):not(:has(.color-slider__output)){grid-template-areas:"track";grid-template-columns:1fr;gap:0}.color-slider__output{grid-area:output;font-size:.75rem;font-variant-numeric:tabular-nums;color:var(--muted-foreground)}.color-slider__track{position:relative;grid-area:track;height:1.25rem;width:calc(100% - 1.25rem);justify-self:center;box-shadow:inset 0 0 0 1px color-mix(in oklch,var(--foreground) 8%,transparent)}.color-slider__thumb,.color-slider__track{border-radius:9999px;forced-color-adjust:none}.color-slider__thumb{position:absolute;top:50%;z-index:1;box-sizing:border-box;width:1rem;height:1rem;border:2px solid #fff;background:var(--color-slider-thumb-color,currentColor);box-shadow:0 1px 3px rgba(0,0,0,.35);transform:translate(-50%,-50%);cursor:grab}.color-slider__thumb[data-dragging=true]{cursor:grabbing}.color-slider__thumb[data-focus-visible=true]{outline:2px solid var(--ring);outline-offset:2px}.color-swatch{position:relative;box-sizing:border-box;flex-shrink:0;width:1.5rem;height:1.5rem;border-radius:.5rem;background:linear-gradient(var(--color-swatch-current),var(--color-swatch-current)),repeating-conic-gradient(#efefef 0 25%,#f7f7f7 0 50%) 50% /10px 10px;box-shadow:inset 0 0 0 1px color-mix(in oklch,var(--foreground) 12%,transparent)}.color-swatch--xs{width:1rem;height:1rem;border-radius:.375rem}.color-swatch--sm{width:1.25rem;height:1.25rem;border-radius:.4375rem}.color-swatch--lg{width:2rem;height:2rem;border-radius:.625rem}.color-swatch--circle,.color-swatch--circle.color-swatch--lg,.color-swatch--circle.color-swatch--sm,.color-swatch--circle.color-swatch--xs{border-radius:9999px}.color-swatch-picker{flex-wrap:wrap;gap:.375rem}.color-swatch-picker,.color-swatch-picker__item{display:flex;align-items:center;justify-content:center}.color-swatch-picker__item{position:relative;width:1.5rem;height:1.5rem;border-radius:9999px;border:2px solid transparent;outline:none;cursor:pointer;transition:border-color .1s cubic-bezier(.22,1,.36,1)}.color-swatch-picker__item[data-selected=true]{border-color:color-mix(in oklch,var(--foreground) 55%,transparent)}.color-swatch-picker__item[data-focus-visible=true]{outline:2px solid var(--ring);outline-offset:1px}.color-swatch-picker__swatch{width:100%;height:100%;border-radius:inherit;transition:transform .1s cubic-bezier(.22,1,.36,1)}.color-swatch-picker__item[data-selected=true] .color-swatch-picker__swatch{transform:scale(.78)}.color-field{width:100%}.color-input-group{display:flex;width:100%;align-items:center;gap:.5rem;border-radius:.75rem;border:1px solid color-mix(in oklch,var(--border) 90%,transparent);background:color-mix(in oklch,var(--input) 50%,transparent);padding:.375rem .625rem;box-shadow:none}.color-input-group:focus,.color-input-group:focus-within,.color-input-group[data-focus-within=true],.color-input-group[data-focused=true]{border-color:color-mix(in oklch,var(--border) 90%,transparent);box-shadow:none;outline:none}.color-input-group__prefix{display:flex;flex-shrink:0;align-items:center}.color-input-group__input{width:100%;min-width:0;border:none!important;background:transparent;font-size:.8125rem;font-weight:600;font-variant-numeric:tabular-nums;text-transform:uppercase;color:var(--foreground);outline:none!important;box-shadow:none!important}.color-input-group__input:focus,.color-input-group__input:focus-visible,.color-input-group__input[data-focus-visible=true],.color-input-group__input[data-focused=true]{border:none!important;outline:none!important;box-shadow:none!important}