@layer Quaff,Quaff.theme,Quaff.ripple,Quaff.components,Quaff.classes,Quaff.disabled,theme,ripple,components,classes,disabled,Quaff.components.q-avatar,Quaff.components.q-btn,Quaff.components.q-btn--disabled,Quaff.components.q-chip,Quaff.components.q-chip--disabled,Quaff.components.q-slider,Quaff.components.q-switch,Quaff.components.q-switch--disabled;@layer theme,ripple,components,classes,disabled;@layer Quaff.components{.q-color-picker{min-inline-size:0}.q-color-picker--inline{inline-size:320px;max-inline-size:100%;border-radius:16px;background:var(--surface-container);color:var(--on-surface)}.q-color-picker__popup.q-menu{inline-size:320px;min-inline-size:0;max-inline-size:calc(100vw - 16px);max-block-size:var(--q-menu-available-height, calc(100dvh - 16px) );border-radius:16px;background:var(--surface-container)}.q-color-picker__panel{display:flex;flex-direction:column;gap:16px;padding:16px;min-inline-size:0}.q-color-picker__title{font-family:var(--typescale-title-large-font-family-name);font-style:var(--typescale-title-large-font-family-style);font-weight:var(--typescale-title-large-font-weight);font-size:var(--typescale-title-large-font-size);line-height:var(--typescale-title-large-line-height);letter-spacing:var(--typescale-title-large-letter-spacing);margin:0}.q-color-picker__axes,.q-color-picker__control-label{font-family:var(--typescale-label-medium-font-family-name);font-style:var(--typescale-label-medium-font-family-style);font-weight:var(--typescale-label-medium-font-weight);font-size:var(--typescale-label-medium-font-size);line-height:var(--typescale-label-medium-line-height);letter-spacing:var(--typescale-label-medium-letter-spacing);color:var(--on-surface-variant)}.q-color-picker__axes{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 16px;margin-block-end:-8px}.q-color-picker__field{position:relative;min-block-size:144px;aspect-ratio:3/2;border-radius:8px;background:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,transparent),hsl(var(--q-color-hue),100%,50%);box-shadow:inset 0 0 0 1px var(--outline);touch-action:none;forced-color-adjust:none;cursor:crosshair}.q-color-picker__axis,.q-color-picker__thumb{position:absolute;left:var(--q-color-x);top:var(--q-color-y);translate:-50% -50%;inline-size:24px;block-size:24px;border-radius:50%;pointer-events:none}.q-color-picker__axis{margin:0;opacity:0}.q-color-picker__thumb{border:3px solid #fff;box-shadow:0 0 0 2px #000}.q-color-picker__field:has(input:focus-visible){outline:3px solid var(--secondary);outline-offset:3px}.q-color-picker__field:has(input:focus-visible) .q-color-picker__thumb{outline:3px solid #fff;outline-offset:4px}.q-color-picker__control{display:flex;flex-direction:column;gap:4px}.q-color-picker__hue,.q-color-picker__opacity{direction:ltr;flex:none;inline-size:calc(100% - 24px);margin-inline:12px;color:var(--on-surface)}.q-color-picker__hue .q-slider__track,.q-color-picker__opacity .q-slider__track{border-radius:8px;outline:1px solid var(--outline);outline-offset:-1px;forced-color-adjust:none}.q-color-picker__hue .q-slider__segment,.q-color-picker__opacity .q-slider__segment{background:transparent}.q-color-picker__hue .q-slider__stop,.q-color-picker__opacity .q-slider__stop{display:none}.q-color-picker__hue .q-slider__handle:before,.q-color-picker__opacity .q-slider__handle:before{background:#fff;box-shadow:0 0 0 1px #000;forced-color-adjust:none}.q-color-picker__hue .q-slider__track{background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.q-color-picker__opacity .q-slider__track{background:linear-gradient(to right,transparent,var(--q-color-opaque)),repeating-conic-gradient(#ddd 0% 25%,#fff 0% 50%) 0/8px 8px}.q-color-picker__formats{display:flex;align-items:center;flex-wrap:wrap;gap:16px;justify-content:space-between}.q-color-picker__swatch{display:inline-block;flex:none;position:relative;inline-size:32px;block-size:32px;border:1px solid var(--outline);border-radius:8px;overflow:hidden;background:repeating-conic-gradient(#ddd 0% 25%,#fff 0% 50%) 0/8px 8px;forced-color-adjust:none}.q-color-picker__swatch:after{content:"";position:absolute;inset:0;background:var(--q-color-preview)}.q-color-picker__channels{font-family:var(--typescale-body-large-font-family-name);font-style:var(--typescale-body-large-font-family-style);font-weight:var(--typescale-body-large-font-weight);font-size:var(--typescale-body-large-font-size);line-height:var(--typescale-body-large-line-height);letter-spacing:var(--typescale-body-large-letter-spacing);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,4ch + 48px),1fr));gap:8px}.q-color-picker__error{font-family:var(--typescale-body-small-font-family-name);font-style:var(--typescale-body-small-font-family-style);font-weight:var(--typescale-body-small-font-weight);font-size:var(--typescale-body-small-font-size);line-height:var(--typescale-body-small-line-height);letter-spacing:var(--typescale-body-small-letter-spacing);margin:4px 0 0;color:var(--error)}.q-color-picker__error:empty{position:absolute;inline-size:1px;block-size:1px;margin:0;overflow:hidden;clip-path:inset(50%)}.q-color-picker__actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.q-color-picker--disabled .q-color-picker__panel :is(.q-color-picker__field,.q-color-picker__axes,.q-color-picker__control-label,.q-color-picker__swatch,.q-slider__track){opacity:38%}.q-color-picker:is(.q-color-picker--disabled,.q-color-picker--readonly) .q-color-picker__field{cursor:default;touch-action:auto}}