@stihl-design-system/components/assets/Checkbox.C6RWhy0V.css

Welcome to the STIHL Design System react component library.

.ds-checkbox_root_1fk9p_1{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-size:1rem;line-height:1.25;font-size-adjust:.414;font-weight:400;color:#252525;display:flex;justify-content:flex-start;gap:8px;padding:0;text-align:left;cursor:pointer;-webkit-user-select:none;user-select:none;max-width:fit-content}.ds-checkbox_root--disabled_1fk9p_21{cursor:not-allowed}.ds-checkbox_root--dark_1fk9p_24{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-size:1rem;line-height:1.25;font-size-adjust:.414;font-weight:400;color:#fff;display:flex;justify-content:flex-start;gap:8px;padding:0;text-align:left;cursor:pointer;-webkit-user-select:none;user-select:none;max-width:fit-content}.ds-checkbox_root--dark--disabled_1fk9p_44{cursor:not-allowed}.ds-checkbox_checkbox_1fk9p_48{width:1.25rem;height:1.25rem;min-width:1.25rem;min-height:1.25rem;border:1px solid #252525;position:relative}.ds-checkbox_checkbox_1fk9p_48{transition:background-color var(--ds-animation-duration, .1s) linear}@media(prefers-reduced-motion:reduce){.ds-checkbox_checkbox_1fk9p_48{transition-duration:0ms}}.ds-checkbox_checkbox_1fk9p_48 .ds-checkbox_icon-check_1fk9p_64,.ds-checkbox_checkbox_1fk9p_48 .ds-checkbox_icon-minus_1fk9p_65{opacity:0;fill:#e9640c;position:absolute;top:50%;left:50%;transform:translate3d(-50%,-50%,0)}.ds-checkbox_checkbox_1fk9p_48 .ds-checkbox_icon-check_1fk9p_64,.ds-checkbox_checkbox_1fk9p_48 .ds-checkbox_icon-minus_1fk9p_65{transition:opacity var(--ds-animation-duration, .1s) linear,fill var(--ds-animation-duration, .1s) linear}@media(prefers-reduced-motion:reduce){.ds-checkbox_checkbox_1fk9p_48 .ds-checkbox_icon-check_1fk9p_64,.ds-checkbox_checkbox_1fk9p_48 .ds-checkbox_icon-minus_1fk9p_65{transition-duration:0ms}}@media screen and (forced-colors:active){.ds-checkbox_checkbox_1fk9p_48 .ds-checkbox_icon-check_1fk9p_64,.ds-checkbox_checkbox_1fk9p_48 .ds-checkbox_icon-minus_1fk9p_65{fill:CanvasText}}.ds-checkbox_checkbox--dark_1fk9p_89{width:1.25rem;height:1.25rem;min-width:1.25rem;min-height:1.25rem;border:1px solid #F8F8F8;position:relative}.ds-checkbox_checkbox--dark_1fk9p_89{transition:background-color var(--ds-animation-duration, .1s) linear}@media(prefers-reduced-motion:reduce){.ds-checkbox_checkbox--dark_1fk9p_89{transition-duration:0ms}}.ds-checkbox_checkbox--dark_1fk9p_89 .ds-checkbox_icon-check_1fk9p_64,.ds-checkbox_checkbox--dark_1fk9p_89 .ds-checkbox_icon-minus_1fk9p_65{opacity:0;fill:#f37a1f;position:absolute;top:50%;left:50%;transform:translate3d(-50%,-50%,0)}.ds-checkbox_checkbox--dark_1fk9p_89 .ds-checkbox_icon-check_1fk9p_64,.ds-checkbox_checkbox--dark_1fk9p_89 .ds-checkbox_icon-minus_1fk9p_65{transition:opacity var(--ds-animation-duration, .1s) linear,fill var(--ds-animation-duration, .1s) linear}@media(prefers-reduced-motion:reduce){.ds-checkbox_checkbox--dark_1fk9p_89 .ds-checkbox_icon-check_1fk9p_64,.ds-checkbox_checkbox--dark_1fk9p_89 .ds-checkbox_icon-minus_1fk9p_65{transition-duration:0ms}}@media screen and (forced-colors:active){.ds-checkbox_checkbox--dark_1fk9p_89 .ds-checkbox_icon-check_1fk9p_64,.ds-checkbox_checkbox--dark_1fk9p_89 .ds-checkbox_icon-minus_1fk9p_65{fill:CanvasText}}.ds-checkbox_checkbox--invalid_1fk9p_130,.ds-checkbox_checkbox--dark_1fk9p_89.ds-checkbox_checkbox--invalid_1fk9p_130{border-color:#d43b3b;box-shadow:0 0 0 1px #d43b3b}.ds-checkbox_label--hidden_1fk9p_139,.ds-checkbox_input_1fk9p_152{border:0;clip:rect(0 0 0 0);width:1px;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;text-indent:-999999px;white-space:nowrap}.ds-checkbox_input_1fk9p_152:checked+.ds-checkbox_checkbox_1fk9p_48 .ds-checkbox_icon-check_1fk9p_64{opacity:1}.ds-checkbox_input_1fk9p_152:indeterminate+.ds-checkbox_checkbox_1fk9p_48 .ds-checkbox_icon-minus_1fk9p_65{opacity:1}.ds-checkbox_input_1fk9p_152:indeterminate+.ds-checkbox_checkbox_1fk9p_48 .ds-checkbox_icon-check_1fk9p_64{opacity:0}.ds-checkbox_input_1fk9p_152:disabled+.ds-checkbox_checkbox_1fk9p_48{border-color:#00000080;box-shadow:unset}@media screen and (forced-colors:active){.ds-checkbox_input_1fk9p_152:disabled+.ds-checkbox_checkbox_1fk9p_48{border-color:GrayText}}.ds-checkbox_input_1fk9p_152:disabled+.ds-checkbox_checkbox_1fk9p_48 svg{fill:#00000080}@media screen and (forced-colors:active){.ds-checkbox_input_1fk9p_152:disabled+.ds-checkbox_checkbox_1fk9p_48 svg{fill:GrayText}}.ds-checkbox_input_1fk9p_152:disabled~.ds-checkbox_label_1fk9p_139{color:#00000080}@media screen and (forced-colors:active){.ds-checkbox_input_1fk9p_152:disabled~.ds-checkbox_label_1fk9p_139{color:GrayText}}.ds-checkbox_input_1fk9p_152:focus{outline:none}.ds-checkbox_input_1fk9p_152:focus+.ds-checkbox_checkbox_1fk9p_48{outline:2px solid;outline-color:#252525;outline-offset:2px}@media screen and (forced-colors:active){.ds-checkbox_input_1fk9p_152:focus+.ds-checkbox_checkbox_1fk9p_48{forced-color-adjust:auto;outline-color:Highlight}}@supports selector(:focus-visible){.ds-checkbox_input_1fk9p_152:focus{outline:none}.ds-checkbox_input_1fk9p_152:focus+.ds-checkbox_checkbox_1fk9p_48{outline:revert;outline-offset:revert}@media screen and (forced-colors:active){.ds-checkbox_input_1fk9p_152:focus+.ds-checkbox_checkbox_1fk9p_48{border-color:Highlight}}.ds-checkbox_input_1fk9p_152:focus-visible{outline:none}.ds-checkbox_input_1fk9p_152:focus-visible+.ds-checkbox_checkbox_1fk9p_48{outline:2px solid;outline-color:#252525;outline-offset:2px}@media screen and (forced-colors:active){.ds-checkbox_input_1fk9p_152:focus-visible+.ds-checkbox_checkbox_1fk9p_48{forced-color-adjust:auto;outline-color:Highlight}}@media screen and (forced-colors:active){.ds-checkbox_input_1fk9p_152:focus-visible+.ds-checkbox_checkbox_1fk9p_48{border-color:Highlight}}}@media(hover:hover){.ds-checkbox_input_1fk9p_152:hover:not(:disabled)+.ds-checkbox_checkbox_1fk9p_48{background-color:#0000001a}.ds-checkbox_input_1fk9p_152:hover:not(:disabled)+.ds-checkbox_checkbox_1fk9p_48 svg{fill:#d9480f}}@media screen and (hover:hover)and (forced-colors:active){.ds-checkbox_input_1fk9p_152:hover:not(:disabled)+.ds-checkbox_checkbox_1fk9p_48 svg{fill:CanvasText}}@media screen and (hover:hover)and (forced-colors:active){.ds-checkbox_input_1fk9p_152:hover:not(:disabled)+.ds-checkbox_checkbox_1fk9p_48{border-color:Highlight}}.ds-checkbox_input--dark_1fk9p_265:disabled+.ds-checkbox_checkbox_1fk9p_48{border-color:#ffffff80;box-shadow:unset}@media screen and (forced-colors:active){.ds-checkbox_input--dark_1fk9p_265:disabled+.ds-checkbox_checkbox_1fk9p_48{border-color:GrayText}}.ds-checkbox_input--dark_1fk9p_265:disabled+.ds-checkbox_checkbox_1fk9p_48 svg{fill:#ffffff80}@media screen and (forced-colors:active){.ds-checkbox_input--dark_1fk9p_265:disabled+.ds-checkbox_checkbox_1fk9p_48 svg{fill:GrayText}}.ds-checkbox_input--dark_1fk9p_265:disabled~.ds-checkbox_label_1fk9p_139{color:#ffffff80}@media screen and (forced-colors:active){.ds-checkbox_input--dark_1fk9p_265:disabled~.ds-checkbox_label_1fk9p_139{color:GrayText}}.ds-checkbox_input--dark_1fk9p_265:focus+.ds-checkbox_checkbox_1fk9p_48{outline:2px solid;outline-color:#fff;outline-offset:2px}@media screen and (forced-colors:active){.ds-checkbox_input--dark_1fk9p_265:focus+.ds-checkbox_checkbox_1fk9p_48{forced-color-adjust:auto;outline-color:Highlight}}@supports selector(:focus-visible){.ds-checkbox_input--dark_1fk9p_265:focus-visible+.ds-checkbox_checkbox_1fk9p_48{outline:2px solid;outline-color:#fff;outline-offset:2px}@media screen and (forced-colors:active){.ds-checkbox_input--dark_1fk9p_265:focus-visible+.ds-checkbox_checkbox_1fk9p_48{forced-color-adjust:auto;outline-color:Highlight}}@media screen and (forced-colors:active){.ds-checkbox_input--dark_1fk9p_265:focus-visible+.ds-checkbox_checkbox_1fk9p_48{border-color:Highlight}}}@media(hover:hover){.ds-checkbox_input--dark_1fk9p_265:hover:not(:disabled)+.ds-checkbox_checkbox_1fk9p_48{background-color:#ffffff26}.ds-checkbox_input--dark_1fk9p_265:hover:not(:disabled)+.ds-checkbox_checkbox_1fk9p_48 svg{fill:#f7a669}}@media screen and (hover:hover)and (forced-colors:active){.ds-checkbox_input--dark_1fk9p_265:hover:not(:disabled)+.ds-checkbox_checkbox_1fk9p_48 svg{fill:CanvasText}}@media screen and (hover:hover)and (forced-colors:active){.ds-checkbox_input--dark_1fk9p_265:hover:not(:disabled)+.ds-checkbox_checkbox_1fk9p_48{border-color:Highlight}}.ds-checkbox_feedback_1fk9p_338{margin-block-start:8px}