@stihl-design-system/components/assets/ActionButton.Ewi0i1hW.css

Welcome to the STIHL Design System react component library.

.ds-action-button_root_16ush_1:focus{outline:2px solid;outline-color:#252525;outline-offset:0px}@media screen and (forced-colors: active){.ds-action-button_root_16ush_1:focus{forced-color-adjust:auto;outline-color:Highlight}}@supports selector(:focus-visible){.ds-action-button_root_16ush_1:focus{outline:revert;outline-offset:revert}.ds-action-button_root_16ush_1:focus-visible{outline:2px solid;outline-color:#252525;outline-offset:0px}@media screen and (forced-colors: active){.ds-action-button_root_16ush_1:focus-visible{forced-color-adjust:auto;outline-color:Highlight}}}.ds-action-button_root_16ush_1{padding-block-start:5px;padding-block-end:5px;padding-inline-start:15px;padding-inline-end:15px;color:#252525;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-width:1px;border-style:solid;border-color:transparent;border-radius:2px;transform:translateZ(0);white-space:nowrap;overflow-wrap:normal;text-align:center;text-decoration:none;background-color:transparent;cursor:pointer}@media (hover: hover){.ds-action-button_root_16ush_1:hover{background-color:#0000001a}}.ds-action-button_root_16ush_1{transition:background-color var(--ds-animation-duration, .1s) linear,border-color var(--ds-animation-duration, .1s) linear,color var(--ds-animation-duration, .1s) linear}@media (prefers-reduced-motion: reduce){.ds-action-button_root_16ush_1{transition-duration:0ms}}@media screen and (forced-colors: active){.ds-action-button_root_16ush_1{background-color:Canvas!important}.ds-action-button_root_16ush_1:hover{border-color:Highlight}}.ds-action-button_root--indent-level-1_16ush_72{padding-inline-start:39px}.ds-action-button_root--active_16ush_75{background-color:#0000001a}.ds-action-button_root--active--with-marker_16ush_78{padding-inline-start:0px}.ds-action-button_root--icon--top_16ush_81{gap:.25rem;flex-direction:column;padding-block-start:11px;padding-block-end:5px;padding-inline-start:7px;padding-inline-end:7px}.ds-action-button_root_16ush_1[aria-disabled=true]{background-color:transparent;color:#00000080;cursor:not-allowed}.ds-action-button_root_16ush_1[aria-disabled=true] svg{fill:currentColor}@media screen and (forced-colors: active){.ds-action-button_root_16ush_1[aria-disabled=true]{color:GrayText;border-color:GrayText}}.ds-action-button_root_16ush_1[aria-disabled=true]:before{background-color:transparent}.ds-action-button_root--stretched_16ush_106{justify-content:flex-start;width:100%}.ds-action-button_active-marker_16ush_111{width:.25rem;height:1.25rem;margin-inline-start:-.0625rem;margin-inline-end:.25rem;background-color:#e9640c}@media screen and (forced-colors: active){.ds-action-button_active-marker_16ush_111{background-color:Highlight}}.ds-action-button_active-marker--with-indent_16ush_123{margin-inline-end:1.75rem}.ds-action-button_icon-wrapper_16ush_127{height:1rem}.ds-action-button_icon-wrapper--x-large_16ush_130{height:1.5rem}.ds-action-button_icon-wrapper--with-number-indicator_16ush_133{position:relative}.ds-action-button_icon-wrapper--with-number-indicator_16ush_133>span{position:absolute;top:-25%;left:.625rem}.ds-action-button_icon-wrapper--with-number-indicator--with-value_16ush_141>span{top:-50%}.ds-action-button_label_16ush_145{font-family:STIHL Contraface Digital Text Regular,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-style:normal;font-variant:normal;-webkit-hyphens:manual;hyphens:manual;overflow-wrap:break-word;font-weight:400;font-size:1rem;line-height:1.25;font-size-adjust:.414}.ds-action-button_label--bold_16ush_156,.ds-action-button_label--active_16ush_167{font-family:STIHL Contraface Digital Text Bold,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-style:normal;font-variant:normal;-webkit-hyphens:manual;hyphens:manual;overflow-wrap:break-word;font-weight:400;font-size:1rem;line-height:1.25;font-size-adjust:.426}.ds-action-button_label--icon-top_16ush_178{font-family:STIHL Contraface Digital Text Demi,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-style:normal;font-variant:normal;-webkit-hyphens:manual;hyphens:manual;overflow-wrap:break-word;font-weight:400;font-size:.75rem;line-height:1.14;font-size-adjust:.42}.ds-action-button_label--icon-top_16ush_178.ds-action-button_label--active_16ush_167{font-family:STIHL Contraface Digital Text Bold,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-style:normal;font-variant:normal;-webkit-hyphens:manual;hyphens:manual;overflow-wrap:break-word;font-weight:400;font-size:.75rem;line-height:1.33;font-size-adjust:.426}.ds-action-button_number-indicator_16ush_201{margin-inline-start:auto}.ds-action-button_label-wrapper_16ush_205{display:flex;align-items:center;gap:.375rem}.ds-action-button_label-wrapper--icon-top_16ush_210{gap:.125rem}.ds-action-button_chevron_16ush_214{transform:rotate(0);min-width:.75rem;min-height:.75rem;width:.75rem;height:.75rem}.ds-action-button_chevron_16ush_214{transition:transform var(--ds-animation-duration, .25s) cubic-bezier(.5,0,1,1)}@media (prefers-reduced-motion: reduce){.ds-action-button_chevron_16ush_214{transition-duration:0ms}}.ds-action-button_chevron--icon-position-top_16ush_229{min-width:.625rem;min-height:.625rem;width:.625rem;height:.625rem}.ds-action-button_chevron--up_16ush_235{transform:rotate(-180deg)}.ds-action-button_chevron--up_16ush_235{transition:transform var(--ds-animation-duration, .25s) cubic-bezier(0,0,.5,1)}@media (prefers-reduced-motion: reduce){.ds-action-button_chevron--up_16ush_235{transition-duration:0ms}}.ds-action-button_chevron--right_16ush_246{transform:rotate(-90deg)}.ds-action-button_chevron--right_16ush_246{transition:transform var(--ds-animation-duration, .25s) cubic-bezier(0,0,.5,1)}@media (prefers-reduced-motion: reduce){.ds-action-button_chevron--right_16ush_246{transition-duration:0ms}}.ds-action-button_chevron--left_16ush_257{transform:rotate(-270deg)}.ds-action-button_chevron--left_16ush_257{transition:transform var(--ds-animation-duration, .25s) cubic-bezier(0,0,.5,1)}@media (prefers-reduced-motion: reduce){.ds-action-button_chevron--left_16ush_257{transition-duration:0ms}}