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

Welcome to the STIHL Design System react component library.

.ds-checkbox_root_1tuqo_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-weight:400;font-size:1rem;line-height:1.25;font-size-adjust:.414;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_1tuqo_21{cursor:not-allowed}.ds-checkbox_checkbox_1tuqo_25{width:1.25rem;height:1.25rem;min-width:1.25rem;min-height:1.25rem;border:1px solid #252525;position:relative}.ds-checkbox_checkbox_1tuqo_25{transition:background-color var(--ds-animation-duration, .1s) linear}@media (prefers-reduced-motion: reduce){.ds-checkbox_checkbox_1tuqo_25{transition-duration:0ms}}.ds-checkbox_checkbox_1tuqo_25 .ds-checkbox_icon-check_1tuqo_41,.ds-checkbox_checkbox_1tuqo_25 .ds-checkbox_icon-minus_1tuqo_42{opacity:0;fill:#e9640c;position:absolute;top:50%;left:50%;transform:translate3d(-50%,-50%,0)}.ds-checkbox_checkbox_1tuqo_25 .ds-checkbox_icon-check_1tuqo_41,.ds-checkbox_checkbox_1tuqo_25 .ds-checkbox_icon-minus_1tuqo_42{transition:opacity var(--ds-animation-duration, .1s) linear,fill var(--ds-animation-duration, .1s) linear}@media (prefers-reduced-motion: reduce){.ds-checkbox_checkbox_1tuqo_25 .ds-checkbox_icon-check_1tuqo_41,.ds-checkbox_checkbox_1tuqo_25 .ds-checkbox_icon-minus_1tuqo_42{transition-duration:0ms}}@media screen and (forced-colors: active){.ds-checkbox_checkbox_1tuqo_25 .ds-checkbox_icon-check_1tuqo_41,.ds-checkbox_checkbox_1tuqo_25 .ds-checkbox_icon-minus_1tuqo_42{fill:CanvasText}}.ds-checkbox_checkbox--invalid_1tuqo_66{border-color:#d43b3b;box-shadow:0 0 0 1px #d43b3b}.ds-checkbox_label--hidden_1tuqo_71,.ds-checkbox_input_1tuqo_84{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_1tuqo_84:checked+.ds-checkbox_checkbox_1tuqo_25 .ds-checkbox_icon-check_1tuqo_41{opacity:1}.ds-checkbox_input_1tuqo_84:indeterminate+.ds-checkbox_checkbox_1tuqo_25 .ds-checkbox_icon-minus_1tuqo_42{opacity:1}.ds-checkbox_input_1tuqo_84:indeterminate+.ds-checkbox_checkbox_1tuqo_25 .ds-checkbox_icon-check_1tuqo_41{opacity:0}.ds-checkbox_input_1tuqo_84:disabled+.ds-checkbox_checkbox_1tuqo_25{border-color:#00000080;box-shadow:unset}@media screen and (forced-colors: active){.ds-checkbox_input_1tuqo_84:disabled+.ds-checkbox_checkbox_1tuqo_25{border-color:GrayText}}.ds-checkbox_input_1tuqo_84:disabled+.ds-checkbox_checkbox_1tuqo_25 svg{fill:#00000080}@media screen and (forced-colors: active){.ds-checkbox_input_1tuqo_84:disabled+.ds-checkbox_checkbox_1tuqo_25 svg{fill:GrayText}}.ds-checkbox_input_1tuqo_84:disabled~.ds-checkbox_label_1tuqo_71{color:#00000080}@media screen and (forced-colors: active){.ds-checkbox_input_1tuqo_84:disabled~.ds-checkbox_label_1tuqo_71{color:GrayText}}.ds-checkbox_input_1tuqo_84:focus{outline:none}.ds-checkbox_input_1tuqo_84:focus+.ds-checkbox_checkbox_1tuqo_25{outline:2px solid;outline-color:#252525;outline-offset:2px}@media screen and (forced-colors: active){.ds-checkbox_input_1tuqo_84:focus+.ds-checkbox_checkbox_1tuqo_25{forced-color-adjust:auto;outline-color:Highlight}}@supports selector(:focus-visible){.ds-checkbox_input_1tuqo_84:focus{outline:none}.ds-checkbox_input_1tuqo_84:focus+.ds-checkbox_checkbox_1tuqo_25{outline:revert;outline-offset:revert}@media screen and (forced-colors: active){.ds-checkbox_input_1tuqo_84:focus+.ds-checkbox_checkbox_1tuqo_25{border-color:Highlight}}.ds-checkbox_input_1tuqo_84:focus-visible{outline:none}.ds-checkbox_input_1tuqo_84:focus-visible+.ds-checkbox_checkbox_1tuqo_25{outline:2px solid;outline-color:#252525;outline-offset:2px}@media screen and (forced-colors: active){.ds-checkbox_input_1tuqo_84:focus-visible+.ds-checkbox_checkbox_1tuqo_25{forced-color-adjust:auto;outline-color:Highlight}}@media screen and (forced-colors: active){.ds-checkbox_input_1tuqo_84:focus-visible+.ds-checkbox_checkbox_1tuqo_25{border-color:Highlight}}}@media (hover: hover){.ds-checkbox_input_1tuqo_84:hover:not(:disabled)+.ds-checkbox_checkbox_1tuqo_25{background-color:#0000001a}.ds-checkbox_input_1tuqo_84:hover:not(:disabled)+.ds-checkbox_checkbox_1tuqo_25 svg{fill:#d9480f}}@media screen and (hover: hover) and (forced-colors: active){.ds-checkbox_input_1tuqo_84:hover:not(:disabled)+.ds-checkbox_checkbox_1tuqo_25 svg{fill:CanvasText}}@media screen and (hover: hover) and (forced-colors: active){.ds-checkbox_input_1tuqo_84:hover:not(:disabled)+.ds-checkbox_checkbox_1tuqo_25{border-color:Highlight}}.ds-checkbox_feedback_1tuqo_198{margin-block-start:16px}