UNPKG

@sandlada/vue-mdc

Version:

![Vue MDC Logo](https://raw.githubusercontent.com/sandlada/vue-mdc/refs/heads/main/docs/vue-mdc-cover.png)

2 lines (1 loc) 30.2 kB
@layer mdc-icon-button{@layer shared{._standard_a82uq_3,._filled_a82uq_4,._filled-tonal_a82uq_5,._outlined_a82uq_6{display:inline-flex;-webkit-tap-highlight-color:transparent;height:var(--_container-height);width:var(--_container-width);justify-content:center;place-items:center;background:none;border:none;box-sizing:border-box;cursor:pointer;place-content:center;outline:none;padding:0;position:relative;text-decoration:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:0;flex-grow:0;flex-shrink:0;border-start-start-radius:var(--_container-shape-start-start);border-start-end-radius:var(--_container-shape-start-end);border-end-start-radius:var(--_container-shape-end-start);border-end-end-radius:var(--_container-shape-end-end)}._standard_a82uq_3[touch-target=wrapper],._filled_a82uq_4[touch-target=wrapper],._filled-tonal_a82uq_5[touch-target=wrapper],._outlined_a82uq_6[touch-target=wrapper]{margin:max(0px,(48px - var(--_container-height)) / 2) max(0px,(48px - var(--_container-width)) / 2)}._standard_a82uq_3 [data-component=focus-ring],._filled_a82uq_4 [data-component=focus-ring],._filled-tonal_a82uq_5 [data-component=focus-ring],._outlined_a82uq_6 [data-component=focus-ring]{--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)}._standard_a82uq_3._disabled_a82uq_47,._standard_a82uq_3:disabled,._filled_a82uq_4._disabled_a82uq_47,._filled_a82uq_4:disabled,._filled-tonal_a82uq_5._disabled_a82uq_47,._filled-tonal_a82uq_5:disabled,._outlined_a82uq_6._disabled_a82uq_47,._outlined_a82uq_6:disabled{pointer-events:none}._standard_a82uq_3 ._icon_a82uq_56 *,._filled_a82uq_4 ._icon_a82uq_56 *,._filled-tonal_a82uq_5 ._icon_a82uq_56 *,._outlined_a82uq_6 ._icon_a82uq_56 *{font-size:var(--_icon-size);height:var(--_icon-size);width:var(--_icon-size);font-weight:inherit}._standard_a82uq_3 [data-component=ripple],._filled_a82uq_4 [data-component=ripple],._filled-tonal_a82uq_5 [data-component=ripple],._outlined_a82uq_6 [data-component=ripple]{border-start-start-radius:var(--_container-shape-start-start);border-start-end-radius:var(--_container-shape-start-end);border-end-start-radius:var(--_container-shape-end-start);border-end-end-radius:var(--_container-shape-end-end)}._standard_a82uq_3 ._flip-icon_a82uq_74 ._icon_a82uq_56,._filled_a82uq_4 ._flip-icon_a82uq_74 ._icon_a82uq_56,._filled-tonal_a82uq_5 ._flip-icon_a82uq_74 ._icon_a82uq_56,._outlined_a82uq_6 ._flip-icon_a82uq_74 ._icon_a82uq_56{transform:scaleX(-1)}._standard_a82uq_3 ._icon_a82uq_56,._filled_a82uq_4 ._icon_a82uq_56,._filled-tonal_a82uq_5 ._icon_a82uq_56,._outlined_a82uq_6 ._icon_a82uq_56{display:inline-flex}._standard_a82uq_3._link_a82uq_86,._filled_a82uq_4._link_a82uq_86,._filled-tonal_a82uq_5._link_a82uq_86,._outlined_a82uq_6._link_a82uq_86{height:100%;outline:none;position:absolute;width:100%}._standard_a82uq_3 ._touch_a82uq_95,._filled_a82uq_4 ._touch_a82uq_95,._filled-tonal_a82uq_5 ._touch_a82uq_95,._outlined_a82uq_6 ._touch_a82uq_95{position:absolute;height:max(48px,100%);width:max(48px,100%)}._standard_a82uq_3[touch-target=none] ._touch_a82uq_95,._filled_a82uq_4[touch-target=none] ._touch_a82uq_95,._filled-tonal_a82uq_5[touch-target=none] ._touch_a82uq_95,._outlined_a82uq_6[touch-target=none] ._touch_a82uq_95{display:none}@media (forced-colors: active){._standard_a82uq_3._disabled_a82uq_47,._standard_a82uq_3:disabled,._filled_a82uq_4._disabled_a82uq_47,._filled_a82uq_4:disabled,._filled-tonal_a82uq_5._disabled_a82uq_47,._filled-tonal_a82uq_5:disabled,._outlined_a82uq_6._disabled_a82uq_47,._outlined_a82uq_6:disabled{--_disabled-icon-opacity: 1}}}@layer filled{._filled_a82uq_4{--_container-color: var(--md-filled-icon-button-container-color, var(--md-sys-color-primary, #6750a4));--_container-height: var(--md-filled-icon-button-container-height, 40px);--_container-width: var(--md-filled-icon-button-container-width, 40px);--_disabled-container-color: var(--md-filled-icon-button-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-container-opacity: var(--md-filled-icon-button-disabled-container-opacity, .12);--_disabled-icon-color: var(--md-filled-icon-button-disabled-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-icon-opacity: var(--md-filled-icon-button-disabled-icon-opacity, .38);--_focus-icon-color: var(--md-filled-icon-button-focus-icon-color, var(--md-sys-color-on-primary, #fff));--_hover-icon-color: var(--md-filled-icon-button-hover-icon-color, var(--md-sys-color-on-primary, #fff));--_hover-state-layer-color: var(--md-filled-icon-button-hover-state-layer-color, var(--md-sys-color-on-primary, #fff));--_hover-state-layer-opacity: var(--md-filled-icon-button-hover-state-layer-opacity, .08);--_icon-color: var(--md-filled-icon-button-icon-color, var(--md-sys-color-on-primary, #fff));--_icon-size: var(--md-filled-icon-button-icon-size, 24px);--_pressed-icon-color: var(--md-filled-icon-button-pressed-icon-color, var(--md-sys-color-on-primary, #fff));--_pressed-state-layer-color: var(--md-filled-icon-button-pressed-state-layer-color, var(--md-sys-color-on-primary, #fff));--_pressed-state-layer-opacity: var(--md-filled-icon-button-pressed-state-layer-opacity, .12);--_selected-container-color: var(--md-filled-icon-button-selected-container-color, var(--md-sys-color-primary, #6750a4));--_toggle-selected-focus-icon-color: var(--md-filled-icon-button-toggle-selected-focus-icon-color, var(--md-sys-color-on-primary, #fff));--_toggle-selected-hover-icon-color: var(--md-filled-icon-button-toggle-selected-hover-icon-color, var(--md-sys-color-on-primary, #fff));--_toggle-selected-hover-state-layer-color: var(--md-filled-icon-button-toggle-selected-hover-state-layer-color, var(--md-sys-color-on-primary, #fff));--_toggle-selected-icon-color: var(--md-filled-icon-button-toggle-selected-icon-color, var(--md-sys-color-on-primary, #fff));--_toggle-selected-pressed-icon-color: var(--md-filled-icon-button-toggle-selected-pressed-icon-color, var(--md-sys-color-on-primary, #fff));--_toggle-selected-pressed-state-layer-color: var(--md-filled-icon-button-toggle-selected-pressed-state-layer-color, var(--md-sys-color-on-primary, #fff));--_unselected-container-color: var(--md-filled-icon-button-unselected-container-color, var(--md-sys-color-surface-container-highest, #e6e0e9));--_toggle-focus-icon-color: var(--md-filled-icon-button-toggle-focus-icon-color, var(--md-sys-color-primary, #6750a4));--_toggle-hover-icon-color: var(--md-filled-icon-button-toggle-hover-icon-color, var(--md-sys-color-primary, #6750a4));--_toggle-hover-state-layer-color: var(--md-filled-icon-button-toggle-hover-state-layer-color, var(--md-sys-color-primary, #6750a4));--_toggle-icon-color: var(--md-filled-icon-button-toggle-icon-color, var(--md-sys-color-primary, #6750a4));--_toggle-pressed-icon-color: var(--md-filled-icon-button-toggle-pressed-icon-color, var(--md-sys-color-primary, #6750a4));--_toggle-pressed-state-layer-color: var(--md-filled-icon-button-toggle-pressed-state-layer-color, var(--md-sys-color-primary, #6750a4));--_container-shape-start-start: var(--md-filled-icon-button-container-shape-start-start, var(--md-filled-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-start-end: var(--md-filled-icon-button-container-shape-start-end, var(--md-filled-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-end: var(--md-filled-icon-button-container-shape-end-end, var(--md-filled-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-start: var(--md-filled-icon-button-container-shape-end-start, var(--md-filled-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--md-ripple-hover-color: var(--_hover-state-layer-color);--md-ripple-hover-opacity: var(--_hover-state-layer-opacity);--md-ripple-pressed-color: var(--_pressed-state-layer-color);--md-ripple-pressed-opacity: var(--_pressed-state-layer-opacity)}._filled_a82uq_4{color:var(--_icon-color)}._filled_a82uq_4:hover{color:var(--_hover-icon-color)}._filled_a82uq_4:focus{color:var(--_focus-icon-color)}._filled_a82uq_4:active{color:var(--_pressed-icon-color)}._filled_a82uq_4:is(:disabled,._disabled_a82uq_47,[disabled]){color:var(--_disabled-icon-color)}._filled_a82uq_4 ._background_a82uq_177{background-color:var(--_container-color);border-radius:inherit;inset:0;position:absolute;z-index:-1}._filled_a82uq_4:is(:disabled,._disabled_a82uq_47,[disabled]) ._background_a82uq_177{background-color:var(--_disabled-container-color);opacity:var(--_disabled-container-opacity)}._filled_a82uq_4:is(:disabled,._disabled_a82uq_47,[disabled]) ._icon_a82uq_56{opacity:var(--_disabled-icon-opacity)}._filled_a82uq_4._toggle-icon-button_a82uq_191{--md-ripple-hover-color: var(--_toggle-hover-state-layer-color);--md-ripple-pressed-color: var(--_toggle-pressed-state-layer-color)}._filled_a82uq_4._toggle-icon-button_a82uq_191:not(:is(:disabled,._disabled_a82uq_47,[disabled])){color:var(--_toggle-icon-color)}._filled_a82uq_4._toggle-icon-button_a82uq_191:not(:is(:disabled,._disabled_a82uq_47,[disabled])):hover{color:var(--_toggle-hover-icon-color)}._filled_a82uq_4._toggle-icon-button_a82uq_191:not(:is(:disabled,._disabled_a82uq_47,[disabled])):focus{color:var(--_toggle-focus-icon-color)}._filled_a82uq_4._toggle-icon-button_a82uq_191:not(:is(:disabled,._disabled_a82uq_47,[disabled])):active{color:var(--_toggle-pressed-icon-color)}._filled_a82uq_4._toggle-icon-button_a82uq_191:not(:disabled) ._background_a82uq_177{background-color:var(--_unselected-container-color)}._filled_a82uq_4._selected_a82uq_210{--md-ripple-hover-color: var(--_toggle-selected-hover-state-layer-color);--md-ripple-pressed-color: var(--_toggle-selected-pressed-state-layer-color)}._filled_a82uq_4._selected_a82uq_210:not(:is(:disabled,._disabled_a82uq_47,[disabled])){color:var(--_toggle-selected-icon-color)}._filled_a82uq_4._selected_a82uq_210:not(:is(:disabled,._disabled_a82uq_47,[disabled])):hover{color:var(--_toggle-selected-hover-icon-color)}._filled_a82uq_4._selected_a82uq_210:not(:is(:disabled,._disabled_a82uq_47,[disabled])):focus{color:var(--_toggle-selected-focus-icon-color)}._filled_a82uq_4._selected_a82uq_210:not(:is(:disabled,._disabled_a82uq_47,[disabled])):active{color:var(--_toggle-selected-pressed-icon-color)}._filled_a82uq_4._selected_a82uq_210:not(:is(:disabled,._disabled_a82uq_47,[disabled])) ._background_a82uq_177{background-color:var(--_selected-container-color)}}@layer filled-tonal{._filled-tonal_a82uq_5{--_container-color: var(--md-filled-tonal-icon-button-container-color, var(--md-sys-color-secondary-container, #e8def8));--_container-height: var(--md-filled-tonal-icon-button-container-height, 40px);--_container-width: var(--md-filled-tonal-icon-button-container-width, 40px);--_disabled-container-color: var(--md-filled-tonal-icon-button-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-container-opacity: var(--md-filled-tonal-icon-button-disabled-container-opacity, .12);--_disabled-icon-color: var(--md-filled-tonal-icon-button-disabled-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-icon-opacity: var(--md-filled-tonal-icon-button-disabled-icon-opacity, .38);--_focus-icon-color: var(--md-filled-tonal-icon-button-focus-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_hover-icon-color: var(--md-filled-tonal-icon-button-hover-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_hover-state-layer-color: var(--md-filled-tonal-icon-button-hover-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_hover-state-layer-opacity: var(--md-filled-tonal-icon-button-hover-state-layer-opacity, .08);--_icon-color: var(--md-filled-tonal-icon-button-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_icon-size: var(--md-filled-tonal-icon-button-icon-size, 24px);--_pressed-icon-color: var(--md-filled-tonal-icon-button-pressed-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_pressed-state-layer-color: var(--md-filled-tonal-icon-button-pressed-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_pressed-state-layer-opacity: var(--md-filled-tonal-icon-button-pressed-state-layer-opacity, .12);--_selected-container-color: var(--md-filled-tonal-icon-button-selected-container-color, var(--md-sys-color-secondary-container, #e8def8));--_toggle-selected-focus-icon-color: var(--md-filled-tonal-icon-button-toggle-selected-focus-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_toggle-selected-hover-icon-color: var(--md-filled-tonal-icon-button-toggle-selected-hover-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_toggle-selected-hover-state-layer-color: var(--md-filled-tonal-icon-button-toggle-selected-hover-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_toggle-selected-icon-color: var(--md-filled-tonal-icon-button-toggle-selected-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_toggle-selected-pressed-icon-color: var(--md-filled-tonal-icon-button-toggle-selected-pressed-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_toggle-selected-pressed-state-layer-color: var(--md-filled-tonal-icon-button-toggle-selected-pressed-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_unselected-container-color: var(--md-filled-tonal-icon-button-unselected-container-color, var(--md-sys-color-surface-container-highest, #e6e0e9));--_toggle-focus-icon-color: var(--md-filled-tonal-icon-button-toggle-focus-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_toggle-hover-icon-color: var(--md-filled-tonal-icon-button-toggle-hover-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_toggle-hover-state-layer-color: var(--md-filled-tonal-icon-button-toggle-hover-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_toggle-icon-color: var(--md-filled-tonal-icon-button-toggle-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_toggle-pressed-icon-color: var(--md-filled-tonal-icon-button-toggle-pressed-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_toggle-pressed-state-layer-color: var(--md-filled-tonal-icon-button-toggle-pressed-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_container-shape-start-start: var(--md-filled-tonal-icon-button-container-shape-start-start, var(--md-filled-tonal-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-start-end: var(--md-filled-tonal-icon-button-container-shape-start-end, var(--md-filled-tonal-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-end: var(--md-filled-tonal-icon-button-container-shape-end-end, var(--md-filled-tonal-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-start: var(--md-filled-tonal-icon-button-container-shape-end-start, var(--md-filled-tonal-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--md-ripple-hover-color: var(--_hover-state-layer-color);--md-ripple-hover-opacity: var(--_hover-state-layer-opacity);--md-ripple-pressed-color: var(--_pressed-state-layer-color);--md-ripple-pressed-opacity: var(--_pressed-state-layer-opacity)}._filled-tonal_a82uq_5{color:var(--_icon-color)}._filled-tonal_a82uq_5:hover{color:var(--_hover-icon-color)}._filled-tonal_a82uq_5:focus{color:var(--_focus-icon-color)}._filled-tonal_a82uq_5:active{color:var(--_pressed-icon-color)}._filled-tonal_a82uq_5:is(:disabled,._disabled_a82uq_47,[disabled]){color:var(--_disabled-icon-color)}._filled-tonal_a82uq_5 ._background_a82uq_177{background-color:var(--_container-color);border-radius:inherit;inset:0;position:absolute;z-index:-1}._filled-tonal_a82uq_5:is(:disabled,._disabled_a82uq_47,[disabled]) ._background_a82uq_177{background-color:var(--_disabled-container-color);opacity:var(--_disabled-container-opacity)}._filled-tonal_a82uq_5:is(:disabled,._disabled_a82uq_47,[disabled]) ._icon_a82uq_56{opacity:var(--_disabled-icon-opacity)}._filled-tonal_a82uq_5._toggle-icon-button_a82uq_191{--md-ripple-hover-color: var(--_toggle-hover-state-layer-color);--md-ripple-pressed-color: var(--_toggle-pressed-state-layer-color)}._filled-tonal_a82uq_5._toggle-icon-button_a82uq_191:not(:is(:disabled,._disabled_a82uq_47,[disabled])){color:var(--_toggle-icon-color)}._filled-tonal_a82uq_5._toggle-icon-button_a82uq_191:not(:is(:disabled,._disabled_a82uq_47,[disabled])):hover{color:var(--_toggle-hover-icon-color)}._filled-tonal_a82uq_5._toggle-icon-button_a82uq_191:not(:is(:disabled,._disabled_a82uq_47,[disabled])):focus{color:var(--_toggle-focus-icon-color)}._filled-tonal_a82uq_5._toggle-icon-button_a82uq_191:not(:is(:disabled,._disabled_a82uq_47,[disabled])):active{color:var(--_toggle-pressed-icon-color)}._filled-tonal_a82uq_5._toggle-icon-button_a82uq_191:not(._disabled_a82uq_47) ._background_a82uq_177,._filled-tonal_a82uq_5._toggle-icon-button_a82uq_191:not(:is(:disabled,._disabled_a82uq_47,[disabled])) ._background_a82uq_177{background-color:var(--_unselected-container-color)}._filled-tonal_a82uq_5._selected_a82uq_210{--md-ripple-hover-color: var(--_toggle-selected-hover-state-layer-color);--md-ripple-pressed-color: var(--_toggle-selected-pressed-state-layer-color)}._filled-tonal_a82uq_5._selected_a82uq_210:not(:is(:disabled,._disabled_a82uq_47,[disabled])){color:var(--_toggle-selected-icon-color)}._filled-tonal_a82uq_5._selected_a82uq_210:not(:is(:disabled,._disabled_a82uq_47,[disabled])):hover{color:var(--_toggle-selected-hover-icon-color)}._filled-tonal_a82uq_5._selected_a82uq_210:not(:is(:disabled,._disabled_a82uq_47,[disabled])):focus{color:var(--_toggle-selected-focus-icon-color)}._filled-tonal_a82uq_5._selected_a82uq_210:not(:is(:disabled,._disabled_a82uq_47,[disabled])):active{color:var(--_toggle-selected-pressed-icon-color)}._filled-tonal_a82uq_5._selected_a82uq_210:not(:is(:disabled,._disabled_a82uq_47,[disabled])) ._background_a82uq_177{background-color:var(--_selected-container-color)}}@layer outlined{._outlined_a82uq_6{--_container-height: var(--md-outlined-icon-button-container-height, 40px);--_container-width: var(--md-outlined-icon-button-container-width, 40px);--_disabled-icon-color: var(--md-outlined-icon-button-disabled-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-icon-opacity: var(--md-outlined-icon-button-disabled-icon-opacity, .38);--_disabled-selected-container-color: var(--md-outlined-icon-button-disabled-selected-container-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-selected-container-opacity: var(--md-outlined-icon-button-disabled-selected-container-opacity, .12);--_hover-state-layer-opacity: var(--md-outlined-icon-button-hover-state-layer-opacity, .08);--_icon-size: var(--md-outlined-icon-button-icon-size, 24px);--_pressed-state-layer-opacity: var(--md-outlined-icon-button-pressed-state-layer-opacity, .12);--_selected-container-color: var(--md-outlined-icon-button-selected-container-color, var(--md-sys-color-inverse-surface, #322f35));--_selected-focus-icon-color: var(--md-outlined-icon-button-selected-focus-icon-color, var(--md-sys-color-inverse-on-surface, #f5eff7));--_selected-hover-icon-color: var(--md-outlined-icon-button-selected-hover-icon-color, var(--md-sys-color-inverse-on-surface, #f5eff7));--_selected-hover-state-layer-color: var(--md-outlined-icon-button-selected-hover-state-layer-color, var(--md-sys-color-inverse-on-surface, #f5eff7));--_selected-icon-color: var(--md-outlined-icon-button-selected-icon-color, var(--md-sys-color-inverse-on-surface, #f5eff7));--_selected-pressed-icon-color: var(--md-outlined-icon-button-selected-pressed-icon-color, var(--md-sys-color-inverse-on-surface, #f5eff7));--_selected-pressed-state-layer-color: var(--md-outlined-icon-button-selected-pressed-state-layer-color, var(--md-sys-color-inverse-on-surface, #f5eff7));--_disabled-outline-color: var(--md-outlined-icon-button-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-outline-opacity: var(--md-outlined-icon-button-disabled-outline-opacity, .12);--_focus-icon-color: var(--md-outlined-icon-button-focus-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-icon-color: var(--md-outlined-icon-button-hover-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-color: var(--md-outlined-icon-button-hover-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_icon-color: var(--md-outlined-icon-button-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_outline-color: var(--md-outlined-icon-button-outline-color, var(--md-sys-color-outline, #79747e));--_outline-width: var(--md-outlined-icon-button-outline-width, 1px);--_pressed-icon-color: var(--md-outlined-icon-button-pressed-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_pressed-state-layer-color: var(--md-outlined-icon-button-pressed-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_container-shape-start-start: var(--md-outlined-icon-button-container-shape-start-start, var(--md-outlined-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-start-end: var(--md-outlined-icon-button-container-shape-start-end, var(--md-outlined-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-end: var(--md-outlined-icon-button-container-shape-end-end, var(--md-outlined-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-start: var(--md-outlined-icon-button-container-shape-end-start, var(--md-outlined-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--md-ripple-hover-color: var(--_hover-state-layer-color);--md-ripple-hover-opacity: var(--_hover-state-layer-opacity);--md-ripple-pressed-color: var(--_pressed-state-layer-color);--md-ripple-pressed-opacity: var(--_pressed-state-layer-opacity)}._outlined_a82uq_6{color:var(--_icon-color)}._outlined_a82uq_6:hover{color:var(--_hover-icon-color)}._outlined_a82uq_6:focus{color:var(--_focus-icon-color)}._outlined_a82uq_6:active{color:var(--_pressed-icon-color)}._outlined_a82uq_6:is(:disabled,._disabled_a82uq_47,[disabled]){color:var(--_disabled-icon-color)}._outlined_a82uq_6 ._background_a82uq_177{background-color:transparent;border-radius:inherit;inset:0;position:absolute;z-index:-1}._outlined_a82uq_6 ._outline_a82uq_6{border-radius:inherit;content:"";inset:0;position:absolute;z-index:-1;border-color:var(--_outline-color);border-width:var(--_outline-width);border-style:solid}._outlined_a82uq_6:is(:disabled,._disabled_a82uq_47,[disabled]) ._outline_a82uq_6{border-color:var(--_disabled-outline-color);opacity:var(--_disabled-outline-opacity)}._outlined_a82uq_6:is(:disabled,._disabled_a82uq_47,[disabled]) ._icon_a82uq_56{opacity:var(--_disabled-icon-opacity)}._outlined_a82uq_6 ._background_a82uq_177{block-size:100%;border-radius:inherit;box-sizing:border-box;content:"";inline-size:100%;inset:0;pointer-events:none;position:absolute;z-index:-1}._outlined_a82uq_6._selected_a82uq_210 ._outline_a82uq_6{border-width:0}._outlined_a82uq_6._selected_a82uq_210{--md-ripple-hover-color: var(--_selected-hover-state-layer-color);--md-ripple-hover-opacity: var(--_hover-state-layer-opacity);--md-ripple-pressed-color: var(--_selected-pressed-state-layer-color);--md-ripple-pressed-opacity: var(--_pressed-state-layer-opacity)}._outlined_a82uq_6._selected_a82uq_210:not(:disabled){color:var(--_selected-icon-color)}._outlined_a82uq_6._selected_a82uq_210:not(:disabled):hover{color:var(--_selected-hover-icon-color)}._outlined_a82uq_6._selected_a82uq_210:not(:disabled):focus{color:var(--_selected-focus-icon-color)}._outlined_a82uq_6._selected_a82uq_210:not(:disabled):active{color:var(--_selected-pressed-icon-color)}._outlined_a82uq_6._selected_a82uq_210:not(:disabled) ._background_a82uq_177,._outlined_a82uq_6._selected_a82uq_210:not(._disabled_a82uq_47) ._background_a82uq_177{background-color:var(--_selected-container-color)}._outlined_a82uq_6._selected_a82uq_210._disabled_a82uq_47 ._background_a82uq_177,._outlined_a82uq_6._selected_a82uq_210:disabled ._background_a82uq_177{background-color:var(--_disabled-selected-container-color);opacity:var(--_disabled-selected-container-opacity)}@media (forced-colors: active){._outlined_a82uq_6 ._disabled_a82uq_47,._outlined_a82uq_6[disabled]{--_disabled-outline-opacity: 1}._outlined_a82uq_6._selected_a82uq_210 ._outline_a82uq_6{border-color:CanvasText;border-width:var(--_outline-width)}._outlined_a82uq_6._selected_a82uq_210:is(:disabled,._disabled_a82uq_47,[disabled]) ._background_a82uq_177{border-color:GrayText;opacity:1}}}@layer standard{._standard_a82uq_3{--_container-height: var(--md-standard-icon-button-container-height, 40px);--_container-width: var(--md-standard-icon-button-container-width, 40px);--_disabled-icon-color: var(--md-standard-icon-button-disabled-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-icon-opacity: var(--md-standard-icon-button-disabled-icon-opacity, .38);--_icon-size: var(--md-standard-icon-button-icon-size, 24px);--_selected-focus-icon-color: var(--md-standard-icon-button-selected-focus-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-icon-color: var(--md-standard-icon-button-selected-hover-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-state-layer-color: var(--md-standard-icon-button-selected-hover-state-layer-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-state-layer-opacity: var(--md-standard-icon-button-selected-hover-state-layer-opacity, .08);--_selected-icon-color: var(--md-standard-icon-button-selected-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-pressed-icon-color: var(--md-standard-icon-button-selected-pressed-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-pressed-state-layer-color: var(--md-standard-icon-button-selected-pressed-state-layer-color, var(--md-sys-color-primary, #6750a4));--_selected-pressed-state-layer-opacity: var(--md-standard-icon-button-selected-pressed-state-layer-opacity, .12);--_state-layer-height: var(--md-standard-icon-button-state-layer-height, 40px);--_state-layer-shape: var(--md-standard-icon-button-state-layer-shape, var(--md-sys-shape-corner-full, 9999px));--_state-layer-width: var(--md-standard-icon-button-state-layer-width, 40px);--_focus-icon-color: var(--md-standard-icon-button-focus-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-icon-color: var(--md-standard-icon-button-hover-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-color: var(--md-standard-icon-button-hover-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-opacity: var(--md-standard-icon-button-hover-state-layer-opacity, .08);--_icon-color: var(--md-standard-icon-button-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-icon-color: var(--md-standard-icon-button-pressed-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-color: var(--md-standard-icon-button-pressed-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-opacity: var(--md-standard-icon-button-pressed-state-layer-opacity, .12);--_container-shape-start-start: var(--md-standard-icon-button-container-shape-start-start, var(--md-standard-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-start-end: var(--md-standard-icon-button-container-shape-start-end, var(--md-standard-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-end: var(--md-standard-icon-button-container-shape-end-end, var(--md-standard-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-start: var(--md-standard-icon-button-container-shape-end-start, var(--md-standard-icon-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--md-ripple-hover-color: var(--_hover-state-layer-color);--md-ripple-hover-opacity: var(--_hover-state-layer-opacity);--md-ripple-pressed-color: var(--_pressed-state-layer-color);--md-ripple-pressed-opacity: var(--_pressed-state-layer-opacity)}._standard_a82uq_3[touch-target=wrapper]{margin:max(0px,(48px - var(--_state-layer-height)) / 2) max(0px,(48px - var(--_state-layer-width)) / 2)}._standard_a82uq_3{color:var(--_icon-color)}._standard_a82uq_3:hover{color:var(--_hover-icon-color)}._standard_a82uq_3:focus{color:var(--_focus-icon-color)}._standard_a82uq_3:active{color:var(--_pressed-icon-color)}._standard_a82uq_3:is(:disabled,._disabled_a82uq_47,[disabled]){color:var(--_disabled-icon-color)}._standard_a82uq_3 ._background_a82uq_177{background-color:transparent;border-radius:inherit;inset:0;position:absolute;z-index:-1}._standard_a82uq_3:is(:disabled,._disabled_a82uq_47,[disabled]) ._icon_a82uq_56{opacity:var(--_disabled-icon-opacity)}._standard_a82uq_3._selected_a82uq_210{--md-ripple-hover-color: var(--_selected-hover-state-layer-color);--md-ripple-hover-opacity: var(--_selected-hover-state-layer-opacity);--md-ripple-pressed-color: var(--_selected-pressed-state-layer-color);--md-ripple-pressed-opacity: var(--_selected-pressed-state-layer-opacity)}._standard_a82uq_3._selected_a82uq_210:not(._disabled_a82uq_47),._standard_a82uq_3._selected_a82uq_210:not(:disabled){color:var(--_selected-icon-color)}._standard_a82uq_3._selected_a82uq_210:not(._disabled_a82uq_47):hover,._standard_a82uq_3._selected_a82uq_210:not(:disabled):hover{color:var(--_selected-hover-icon-color)}._standard_a82uq_3._selected_a82uq_210:not(._disabled_a82uq_47):focus,._standard_a82uq_3._selected_a82uq_210:not(:disabled):focus{color:var(--_selected-focus-icon-color)}._standard_a82uq_3._selected_a82uq_210:not(._disabled_a82uq_47):active,._standard_a82uq_3._selected_a82uq_210:not(:disabled):active{color:var(--_selected-pressed-icon-color)}}}