@sandlada/vue-mdc/build/css/split-button.css


@layer mdc-split-button{@layer shared{._filled_1p93e_3,._filled-tonal_1p93e_4,._outlined_1p93e_5{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;gap:8px;min-height:var(--_container-height);outline:none;padding-block:calc((var(--_container-height) - max(var(--_label-text-line-height),var(--_icon-size))) / 2);padding-inline-start:var(--_leading-space);padding-inline-end:var(--_trailing-space);place-content:center;place-items:center;position:relative;z-index:0;font-family:var(--_label-text-font);font-size:var(--_label-text-size);line-height:var(--_label-text-line-height);font-weight:var(--_label-text-weight);text-overflow:ellipsis;text-wrap:nowrap;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;vertical-align:top}._filled_1p93e_3:is([disabled],._disabled_1p93e_30),._filled-tonal_1p93e_4:is([disabled],._disabled_1p93e_30),._outlined_1p93e_5:is([disabled],._disabled_1p93e_30){cursor:default;pointer-events:none}._filled_1p93e_3 ._button_1p93e_36,._filled-tonal_1p93e_4 ._button_1p93e_36,._outlined_1p93e_5 ._button_1p93e_36{border-radius:inherit;cursor:inherit;display:inline-flex;align-items:center;justify-content:center;border:none;outline:none;-webkit-appearance:none;vertical-align:middle;background:transparent;text-decoration:none;min-width:calc(64px - var(--_leading-space) - var(--_trailing-space));width:100%;z-index:0;height:100%;font:inherit;color:var(--_label-text-color);padding:0;gap:inherit;text-transform:inherit}._filled_1p93e_3 ._button_1p93e_36::-moz-focus-inner,._filled-tonal_1p93e_4 ._button_1p93e_36::-moz-focus-inner,._outlined_1p93e_5 ._button_1p93e_36::-moz-focus-inner{padding:0;border:0}._filled_1p93e_3:hover ._button_1p93e_36,._filled-tonal_1p93e_4:hover ._button_1p93e_36,._outlined_1p93e_5:hover ._button_1p93e_36{color:var(--_hover-label-text-color)}._filled_1p93e_3:focus-within ._button_1p93e_36,._filled-tonal_1p93e_4:focus-within ._button_1p93e_36,._outlined_1p93e_5:focus-within ._button_1p93e_36{color:var(--_focus-label-text-color)}._filled_1p93e_3:active ._button_1p93e_36,._filled-tonal_1p93e_4:active ._button_1p93e_36,._outlined_1p93e_5:active ._button_1p93e_36{color:var(--_pressed-label-text-color)}._filled_1p93e_3 ._background_1p93e_81,._filled-tonal_1p93e_4 ._background_1p93e_81,._outlined_1p93e_5 ._background_1p93e_81{background-color:var(--_container-color);border-radius:inherit;inset:0;position:absolute;z-index:-1}._filled_1p93e_3 ._label_1p93e_90,._filled-tonal_1p93e_4 ._label_1p93e_90,._outlined_1p93e_5 ._label_1p93e_90{overflow:hidden}._filled_1p93e_3:is(._button_1p93e_36,._label_1p93e_90,._label_1p93e_90 *),._filled-tonal_1p93e_4:is(._button_1p93e_36,._label_1p93e_90,._label_1p93e_90 *),._outlined_1p93e_5:is(._button_1p93e_36,._label_1p93e_90,._label_1p93e_90 *){text-overflow:inherit}._filled_1p93e_3:is([disabled],._disabled_1p93e_30) ._label_1p93e_90,._filled-tonal_1p93e_4:is([disabled],._disabled_1p93e_30) ._label_1p93e_90,._outlined_1p93e_5:is([disabled],._disabled_1p93e_30) ._label_1p93e_90{color:var(--_disabled-label-text-color);opacity:var(--_disabled-label-text-opacity)}._filled_1p93e_3:is([disabled],._disabled_1p93e_30) ._background_1p93e_81,._filled-tonal_1p93e_4:is([disabled],._disabled_1p93e_30) ._background_1p93e_81,._outlined_1p93e_5:is([disabled],._disabled_1p93e_30) ._background_1p93e_81{background-color:var(--_disabled-container-color);opacity:var(--_disabled-container-opacity)}@media (forced-colors: active){._filled_1p93e_3 ._background_1p93e_81,._filled-tonal_1p93e_4 ._background_1p93e_81,._outlined_1p93e_5 ._background_1p93e_81{border:1px solid CanvasText}._filled_1p93e_3:is([disabled],._disabled_1p93e_30),._filled-tonal_1p93e_4:is([disabled],._disabled_1p93e_30),._outlined_1p93e_5:is([disabled],._disabled_1p93e_30){--_disabled-icon-color: GrayText;--_disabled-icon-opacity: 1;--_disabled-container-opacity: 1;--_disabled-label-text-color: GrayText;--_disabled-label-text-opacity: 1}}._filled_1p93e_3:has([data-component=icon])._left_1p93e_128,._filled-tonal_1p93e_4:has([data-component=icon])._left_1p93e_128,._outlined_1p93e_5:has([data-component=icon])._left_1p93e_128{padding-inline-start:var(--_with-leading-icon-leading-space);padding-inline-end:var(--_with-leading-icon-trailing-space)}._filled_1p93e_3:has([data-component=icon])._right_1p93e_134,._filled-tonal_1p93e_4:has([data-component=icon])._right_1p93e_134,._outlined_1p93e_5:has([data-component=icon])._right_1p93e_134{padding-inline-start:var(--_with-trailing-icon-leading-space);padding-inline-end:var(--_with-trailing-icon-trailing-space)}._filled_1p93e_3 ._touch_1p93e_140,._filled-tonal_1p93e_4 ._touch_1p93e_140,._outlined_1p93e_5 ._touch_1p93e_140{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}._filled_1p93e_3[touch-target=wrapper],._filled-tonal_1p93e_4[touch-target=wrapper],._outlined_1p93e_5[touch-target=wrapper]{margin:max(0px,(48px - var(--_container-height)) / 2) 0}._filled_1p93e_3[touch-target=none] ._touch_1p93e_140,._filled-tonal_1p93e_4[touch-target=none] ._touch_1p93e_140,._outlined_1p93e_5[touch-target=none] ._touch_1p93e_140{display:none}._filled_1p93e_3 :is(._touch_1p93e_140,._label_1p93e_90,._background_1p93e_81,._button_1p93e_36,._outline_1p93e_5),._filled-tonal_1p93e_4 :is(._touch_1p93e_140,._label_1p93e_90,._background_1p93e_81,._button_1p93e_36,._outline_1p93e_5),._outlined_1p93e_5 :is(._touch_1p93e_140,._label_1p93e_90,._background_1p93e_81,._button_1p93e_36,._outline_1p93e_5){pointer-events:none}@layer icon{._filled_1p93e_3 [data-component=icon],._filled-tonal_1p93e_4 [data-component=icon],._outlined_1p93e_5 [data-component=icon]{display:inline-flex;position:relative;writing-mode:horizontal-tb;fill:currentColor;flex-shrink:0;color:var(--_icon-color);font-size:var(--_icon-size);inline-size:var(--_icon-size);block-size:var(--_icon-size)}._filled_1p93e_3:hover [data-component=icon],._filled-tonal_1p93e_4:hover [data-component=icon],._outlined_1p93e_5:hover [data-component=icon]{color:var(--_hover-icon-color)}._filled_1p93e_3:focus-within [data-component=icon],._filled-tonal_1p93e_4:focus-within [data-component=icon],._outlined_1p93e_5:focus-within [data-component=icon]{color:var(--_focus-icon-color)}._filled_1p93e_3:active [data-component=icon],._filled-tonal_1p93e_4:active [data-component=icon],._outlined_1p93e_5:active [data-component=icon]{color:var(--_pressed-icon-color)}._filled_1p93e_3[disabled] [data-component=icon],._filled-tonal_1p93e_4[disabled] [data-component=icon],._outlined_1p93e_5[disabled] [data-component=icon]{color:var(--_disabled-icon-color);opacity:var(--_disabled-icon-opacity)}}@layer ripple{._filled_1p93e_3,._filled-tonal_1p93e_4,._outlined_1p93e_5{--md-ripple-hover-color: var(--_hover-state-layer-color);--md-ripple-pressed-color: var(--_pressed-state-layer-color);--md-ripple-hover-opacity: var(--_hover-state-layer-opacity);--md-ripple-pressed-opacity: var(--_pressed-state-layer-opacity)}}@layer focus-ring{._filled_1p93e_3,._filled-tonal_1p93e_4,._outlined_1p93e_5{--md-focus-ring-shape-start-start: var(--_container-shape-start-start);--md-focus-ring-shape-start-end: var(--_container-shape-start-end);--md-focus-ring-shape-end-end: var(--_container-shape-end-end);--md-focus-ring-shape-end-start: var(--_container-shape-end-start)}}}@layer appearance{@layer filled{._filled_1p93e_3{--_container-color: var(--md-filled-button-container-color, var(--md-sys-color-primary, #6750a4));--_container-elevation: var(--md-filled-button-container-elevation, 0);--_container-height: var(--md-filled-button-container-height, 40px);--_container-shadow-color: var(--md-filled-button-container-shadow-color, var(--md-sys-color-shadow, #000));--_disabled-container-color: var(--md-filled-button-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-container-elevation: var(--md-filled-button-disabled-container-elevation, 0);--_disabled-container-opacity: var(--md-filled-button-disabled-container-opacity, .12);--_disabled-label-text-color: var(--md-filled-button-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-filled-button-disabled-label-text-opacity, .38);--_focus-container-elevation: var(--md-filled-button-focus-container-elevation, 0);--_focus-label-text-color: var(--md-filled-button-focus-label-text-color, var(--md-sys-color-on-primary, #fff));--_hover-container-elevation: var(--md-filled-button-hover-container-elevation, 1);--_hover-label-text-color: var(--md-filled-button-hover-label-text-color, var(--md-sys-color-on-primary, #fff));--_hover-state-layer-color: var(--md-filled-button-hover-state-layer-color, var(--md-sys-color-on-primary, #fff));--_hover-state-layer-opacity: var(--md-filled-button-hover-state-layer-opacity, .08);--_label-text-color: var(--md-filled-button-label-text-color, var(--md-sys-color-on-primary, #fff));--_label-text-font: var(--md-filled-button-label-text-font, var(--md-sys-typescale-label-large-font, var(--md-ref-typeface-plain, Roboto)));--_label-text-line-height: var(--md-filled-button-label-text-line-height, var(--md-sys-typescale-label-large-line-height, 1.25rem));--_label-text-size: var(--md-filled-button-label-text-size, var(--md-sys-typescale-label-large-size, .875rem));--_label-text-weight: var(--md-filled-button-label-text-weight, var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500)));--_pressed-container-elevation: var(--md-filled-button-pressed-container-elevation, 0);--_pressed-label-text-color: var(--md-filled-button-pressed-label-text-color, var(--md-sys-color-on-primary, #fff));--_pressed-state-layer-color: var(--md-filled-button-pressed-state-layer-color, var(--md-sys-color-on-primary, #fff));--_pressed-state-layer-opacity: var(--md-filled-button-pressed-state-layer-opacity, .12);--_disabled-icon-color: var(--md-filled-button-disabled-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-icon-opacity: var(--md-filled-button-disabled-icon-opacity, .38);--_focus-icon-color: var(--md-filled-button-focus-icon-color, var(--md-sys-color-on-primary, #fff));--_hover-icon-color: var(--md-filled-button-hover-icon-color, var(--md-sys-color-on-primary, #fff));--_icon-color: var(--md-filled-button-icon-color, var(--md-sys-color-on-primary, #fff));--_icon-size: var(--md-filled-button-icon-size, 18px);--_pressed-icon-color: var(--md-filled-button-pressed-icon-color, var(--md-sys-color-on-primary, #fff));--_container-shape-start-start: var(--md-filled-button-container-shape-start-start, var(--md-filled-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-start-end: var(--md-filled-button-container-shape-start-end, var(--md-filled-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-end: var(--md-filled-button-container-shape-end-end, var(--md-filled-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-start: var(--md-filled-button-container-shape-end-start, var(--md-filled-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_leading-space: var(--md-filled-button-leading-space, 24px);--_trailing-space: var(--md-filled-button-trailing-space, 24px);--_with-leading-icon-leading-space: var(--md-filled-button-with-leading-icon-leading-space, 16px);--_with-leading-icon-trailing-space: var(--md-filled-button-with-leading-icon-trailing-space, 24px);--_with-trailing-icon-leading-space: var(--md-filled-button-with-trailing-icon-leading-space, 24px);--_with-trailing-icon-trailing-space: var(--md-filled-button-with-trailing-icon-trailing-space, 16px)}}@layer filled-tonal{._filled-tonal_1p93e_4{--_container-color: var(--md-filled-tonal-button-container-color, var(--md-sys-color-secondary-container, #e8def8));--_container-elevation: var(--md-filled-tonal-button-container-elevation, 0);--_container-height: var(--md-filled-tonal-button-container-height, 40px);--_container-shadow-color: var(--md-filled-tonal-button-container-shadow-color, var(--md-sys-color-shadow, #000));--_disabled-container-color: var(--md-filled-tonal-button-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-container-elevation: var(--md-filled-tonal-button-disabled-container-elevation, 0);--_disabled-container-opacity: var(--md-filled-tonal-button-disabled-container-opacity, .12);--_disabled-label-text-color: var(--md-filled-tonal-button-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-filled-tonal-button-disabled-label-text-opacity, .38);--_focus-container-elevation: var(--md-filled-tonal-button-focus-container-elevation, 0);--_focus-label-text-color: var(--md-filled-tonal-button-focus-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_hover-container-elevation: var(--md-filled-tonal-button-hover-container-elevation, 1);--_hover-label-text-color: var(--md-filled-tonal-button-hover-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_hover-state-layer-color: var(--md-filled-tonal-button-hover-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_hover-state-layer-opacity: var(--md-filled-tonal-button-hover-state-layer-opacity, .08);--_label-text-color: var(--md-filled-tonal-button-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_label-text-font: var(--md-filled-tonal-button-label-text-font, var(--md-sys-typescale-label-large-font, var(--md-ref-typeface-plain, Roboto)));--_label-text-line-height: var(--md-filled-tonal-button-label-text-line-height, var(--md-sys-typescale-label-large-line-height, 1.25rem));--_label-text-size: var(--md-filled-tonal-button-label-text-size, var(--md-sys-typescale-label-large-size, .875rem));--_label-text-weight: var(--md-filled-tonal-button-label-text-weight, var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500)));--_pressed-container-elevation: var(--md-filled-tonal-button-pressed-container-elevation, 0);--_pressed-label-text-color: var(--md-filled-tonal-button-pressed-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_pressed-state-layer-color: var(--md-filled-tonal-button-pressed-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_pressed-state-layer-opacity: var(--md-filled-tonal-button-pressed-state-layer-opacity, .12);--_disabled-icon-color: var(--md-filled-tonal-button-disabled-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-icon-opacity: var(--md-filled-tonal-button-disabled-icon-opacity, .38);--_focus-icon-color: var(--md-filled-tonal-button-focus-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_hover-icon-color: var(--md-filled-tonal-button-hover-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_icon-color: var(--md-filled-tonal-button-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_icon-size: var(--md-filled-tonal-button-icon-size, 18px);--_pressed-icon-color: var(--md-filled-tonal-button-pressed-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_container-shape-start-start: var(--md-filled-tonal-button-container-shape-start-start, var(--md-filled-tonal-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-start-end: var(--md-filled-tonal-button-container-shape-start-end, var(--md-filled-tonal-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-end: var(--md-filled-tonal-button-container-shape-end-end, var(--md-filled-tonal-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-start: var(--md-filled-tonal-button-container-shape-end-start, var(--md-filled-tonal-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_leading-space: var(--md-filled-tonal-button-leading-space, 24px);--_trailing-space: var(--md-filled-tonal-button-trailing-space, 24px);--_with-leading-icon-leading-space: var(--md-filled-tonal-button-with-leading-icon-leading-space, 16px);--_with-leading-icon-trailing-space: var(--md-filled-tonal-button-with-leading-icon-trailing-space, 24px);--_with-trailing-icon-leading-space: var(--md-filled-tonal-button-with-trailing-icon-leading-space, 24px);--_with-trailing-icon-trailing-space: var(--md-filled-tonal-button-with-trailing-icon-trailing-space, 16px)}}@layer outlined{._outlined_1p93e_5{--_container-height: var(--md-outlined-button-container-height, 40px);--_disabled-label-text-color: var(--md-outlined-button-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-outlined-button-disabled-label-text-opacity, .38);--_disabled-outline-color: var(--md-outlined-button-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-outline-opacity: var(--md-outlined-button-disabled-outline-opacity, .12);--_focus-label-text-color: var(--md-outlined-button-focus-label-text-color, var(--md-sys-color-primary, #6750a4));--_hover-label-text-color: var(--md-outlined-button-hover-label-text-color, var(--md-sys-color-primary, #6750a4));--_hover-state-layer-color: var(--md-outlined-button-hover-state-layer-color, var(--md-sys-color-primary, #6750a4));--_hover-state-layer-opacity: var(--md-outlined-button-hover-state-layer-opacity, .08);--_label-text-color: var(--md-outlined-button-label-text-color, var(--md-sys-color-primary, #6750a4));--_label-text-font: var(--md-outlined-button-label-text-font, var(--md-sys-typescale-label-large-font, var(--md-ref-typeface-plain, Roboto)));--_label-text-line-height: var(--md-outlined-button-label-text-line-height, var(--md-sys-typescale-label-large-line-height, 1.25rem));--_label-text-size: var(--md-outlined-button-label-text-size, var(--md-sys-typescale-label-large-size, .875rem));--_label-text-weight: var(--md-outlined-button-label-text-weight, var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500)));--_outline-color: var(--md-outlined-button-outline-color, var(--md-sys-color-outline, #79747e));--_outline-width: var(--md-outlined-button-outline-width, 1px);--_pressed-label-text-color: var(--md-outlined-button-pressed-label-text-color, var(--md-sys-color-primary, #6750a4));--_pressed-outline-color: var(--md-outlined-button-pressed-outline-color, var(--md-sys-color-outline, #79747e));--_pressed-state-layer-color: var(--md-outlined-button-pressed-state-layer-color, var(--md-sys-color-primary, #6750a4));--_pressed-state-layer-opacity: var(--md-outlined-button-pressed-state-layer-opacity, .12);--_disabled-icon-color: var(--md-outlined-button-disabled-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-icon-opacity: var(--md-outlined-button-disabled-icon-opacity, .38);--_focus-icon-color: var(--md-outlined-button-focus-icon-color, var(--md-sys-color-primary, #6750a4));--_hover-icon-color: var(--md-outlined-button-hover-icon-color, var(--md-sys-color-primary, #6750a4));--_icon-color: var(--md-outlined-button-icon-color, var(--md-sys-color-primary, #6750a4));--_icon-size: var(--md-outlined-button-icon-size, 18px);--_pressed-icon-color: var(--md-outlined-button-pressed-icon-color, var(--md-sys-color-primary, #6750a4));--_container-shape-start-start: var(--md-outlined-button-container-shape-start-start, var(--md-outlined-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-start-end: var(--md-outlined-button-container-shape-start-end, var(--md-outlined-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-end: var(--md-outlined-button-container-shape-end-end, var(--md-outlined-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-start: var(--md-outlined-button-container-shape-end-start, var(--md-outlined-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_leading-space: var(--md-outlined-button-leading-space, 24px);--_trailing-space: var(--md-outlined-button-trailing-space, 24px);--_with-leading-icon-leading-space: var(--md-outlined-button-with-leading-icon-leading-space, 16px);--_with-leading-icon-trailing-space: var(--md-outlined-button-with-leading-icon-trailing-space, 24px);--_with-trailing-icon-leading-space: var(--md-outlined-button-with-trailing-icon-leading-space, 24px);--_with-trailing-icon-trailing-space: var(--md-outlined-button-with-trailing-icon-trailing-space, 16px);--_container-color: none;--_disabled-container-color: none;--_disabled-container-opacity: 0}._outlined_1p93e_5 ._outline_1p93e_5{inset:0;border-style:solid;position:absolute;box-sizing:border-box;border-color:var(--_outline-color);border-radius:inherit}._outlined_1p93e_5:active ._outline_1p93e_5{border-color:var(--_pressed-outline-color)}._outlined_1p93e_5[disabled] ._outline_1p93e_5{border-color:var(--_disabled-outline-color);opacity:var(--_disabled-outline-opacity)}@media (forced-colors: active){._outlined_1p93e_5[disabled] ._background_1p93e_81{border-color:GrayText}._outlined_1p93e_5[disabled] ._outline_1p93e_5{opacity:1}}._outlined_1p93e_5 ._outline_1p93e_5,._outlined_1p93e_5 [data-component=ripple]{border-width:var(--_outline-width)}._outlined_1p93e_5 [data-component=ripple]{inline-size:calc(100% - 2 * var(--_outline-width));block-size:calc(100% - 2 * var(--_outline-width));border-style:solid;border-color:transparent}}}}@layer mdc-split-button-group{._button-group_1p93e_392{--container-shape-less: 4px;display:inline-flex;gap:4px}._button-group_1p93e_392>[data-component=split-button]{border-start-start-radius:var(--container-shape-less);border-start-end-radius:var(--container-shape-less);border-end-start-radius:var(--container-shape-less);border-end-end-radius:var(--container-shape-less)}._button-group_1p93e_392>:first-child{border-start-start-radius:20px;border-end-start-radius:20px}._button-group_1p93e_392>:last-child{border-start-end-radius:20px;border-end-end-radius:20px}}