[data-tds=color-picker]{min-block-size:var(--tds-toolbar-item-size,var(--tds-space-8));min-inline-size:var(--tds-toolbar-item-size,var(--tds-space-8));padding:var(--tds-space-1);border:var(--tds-border-width) solid var(--tds-border-default);border-radius:var(--tds-radius-sm);background:var(--tds-surface-default);cursor:pointer;justify-content:center;align-items:center;display:inline-flex}[data-tds=color-picker]:focus-visible{outline:var(--tds-border-width) solid var(--tds-focus-ring);outline-offset:2px}[data-tds=color-picker][data-disabled]{opacity:var(--tds-editor-disabled-opacity);cursor:not-allowed}[data-slot=swatch]{inline-size:var(--tds-space-5);block-size:var(--tds-space-5);border-radius:var(--tds-radius-sm);border:var(--tds-border-width) solid var(--tds-border-default)}[data-tds=color-picker-popover]{padding:var(--tds-space-3);border:var(--tds-border-width) solid var(--tds-border-default);border-radius:var(--tds-radius-md);background:var(--tds-surface-overlay);box-shadow:var(--tds-elevation-float)}[data-slot=panel]{gap:var(--tds-space-3);inline-size:var(--tds-space-24);outline:none;flex-direction:column;display:flex}[data-slot=area]{block-size:var(--tds-space-24);border-radius:var(--tds-radius-sm)}[data-slot=hue] [data-slot=track]{block-size:var(--tds-space-3);border-radius:var(--tds-radius-full)}[data-slot=field]{gap:var(--tds-space-1);flex-direction:column;display:flex}
[data-tds=toolbar]{align-items:center;row-gap:var(--tds-toolbar-gap);gap:var(--tds-toolbar-gap);max-inline-size:100%;padding:var(--tds-toolbar-padding);border:var(--tds-border-width) solid var(--tds-toolbar-border);border-radius:var(--tds-toolbar-radius);background:var(--tds-toolbar-bg);flex-wrap:wrap;display:inline-flex}[data-tds=toolbar][data-orientation=vertical]{flex-direction:column;align-items:stretch}[data-tds=tool-group]{align-items:center;gap:var(--tds-toolbar-gap);flex-wrap:wrap;display:inline-flex}[data-tds=toolbar][data-orientation=vertical] [data-tds=tool-group]{flex-direction:column;align-items:stretch}[data-tds=toolbar-separator]{inline-size:var(--tds-border-width);background:var(--tds-toolbar-separator);margin-inline:var(--tds-toolbar-gap);align-self:stretch}[data-tds=toolbar][data-orientation=vertical] [data-tds=toolbar-separator]{inline-size:auto;block-size:var(--tds-border-width);margin-inline:0;margin-block:var(--tds-toolbar-gap)}[data-tds=toggle-button]{justify-content:center;align-items:center;gap:var(--tds-toolbar-gap);min-block-size:var(--tds-toolbar-item-size);min-inline-size:var(--tds-toolbar-item-size);padding-inline:var(--tds-toolbar-item-padding-inline);border:var(--tds-border-width) solid transparent;border-radius:var(--tds-toolbar-item-radius);color:var(--tds-toolbar-item-fg);font-family:inherit;font-size:var(--tds-toolbar-item-font-size);font-weight:var(--tds-font-weight-medium);cursor:pointer;transition:background-color var(--tds-toolbar-transition), color var(--tds-toolbar-transition);background:0 0;display:inline-flex}[data-tds=toggle-button][data-icon-only]{padding-inline:0}[data-tds=toggle-button]:hover:not(:disabled){background:var(--tds-surface-hover)}[data-tds=toggle-button]:active:not(:disabled){background:var(--tds-surface-pressed)}[data-tds=toggle-button][data-pressed]{background:var(--tds-toolbar-pressed-bg);color:var(--tds-toolbar-pressed-fg);border-color:var(--tds-toolbar-pressed-border)}[data-tds=toggle-button]:focus-visible{outline:var(--tds-focus-edge) solid var(--tds-focus-ring);outline-offset:0;box-shadow:var(--tds-focus-halo)}[data-tds=toggle-button]:disabled{opacity:var(--tds-toolbar-disabled-opacity);cursor:not-allowed}[data-tds=toolbar][data-size=sm]{--tds-toolbar-item-size:var(--tds-control-height-sm)}@media print{[data-tds=toolbar][data-print=hide]{display:none}}