@stihl-design-system/components/assets/CustomReactSelect.D0b1Hg1T.css

Welcome to the STIHL Design System react component library.

:where(.ds-combobox_root_1q8z8_1){align-self:end}.ds-combobox_root_1q8z8_1:has(.ds-combobox_hint_1q8z8_10) .ds-combobox_label_1q8z8_10{margin-block-end:4px}.ds-combobox_wrapper_1q8z8_14{display:grid;grid-template-columns:max-content 1fr max-content max-content;align-items:center}.ds-combobox_action-button_1q8z8_20{grid-area:1/4/2/5}.ds-combobox_label_1q8z8_10{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;display:block;max-width:fit-content;margin-block-end:8px}.ds-combobox_label--hidden_1q8z8_38{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}@media screen and (forced-colors: active){.ds-combobox_label--disabled_1q8z8_51{color:GrayText}}.ds-combobox_hint_1q8z8_10{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:.875rem;line-height:1.14;font-size-adjust:.414;display:block;max-width:34em;margin-block-end:8px}.ds-combobox_feedback_1q8z8_71{margin-block-end:8px;margin-block-start:8px}:where(.ds-combobox_select_1q8z8_76){display:block;padding-inline-start:15px;padding-inline-end:15px;min-height:3rem;height:3rem}:where(.ds-combobox_select--small_1q8z8_84){padding-inline-start:7px;padding-inline-end:7px}.ds-combobox_select_1q8z8_76{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-combobox_select_1q8z8_76:focus{outline:1px solid;outline-color:#252525;outline-offset:0}@media screen and (forced-colors: active){.ds-combobox_select_1q8z8_76:focus{forced-color-adjust:auto;outline-color:Highlight}}@supports selector(:focus-visible){.ds-combobox_select_1q8z8_76:focus{outline:revert;outline-offset:revert}.ds-combobox_select_1q8z8_76:focus-visible{outline:1px solid;outline-color:#252525;outline-offset:0}@media screen and (forced-colors: active){.ds-combobox_select_1q8z8_76:focus-visible{forced-color-adjust:auto;outline-color:Highlight}}}.ds-combobox_select_1q8z8_76{transition:background-color var(--ds-animation-duration, .1s) linear,color var(--ds-animation-duration, .1s) linear}@media (prefers-reduced-motion: reduce){.ds-combobox_select_1q8z8_76{transition-duration:0ms}}@media (hover: hover){.ds-combobox_select_1q8z8_76:hover{background:#0000001a}}@media screen and (hover: hover) and (forced-colors: active){.ds-combobox_select_1q8z8_76:hover{border-color:Highlight}}.ds-combobox_select_1q8z8_76{background:transparent;border:1px solid #252525;border-radius:0;color:#252525;width:100%}.ds-combobox_select_1q8z8_76[readonly]{background-color:#ededed;border-color:transparent;color:#252525}.ds-combobox_select_1q8z8_76[readonly]:focus{outline:2px solid;outline-color:#252525;outline-offset:0}@media screen and (forced-colors: active){.ds-combobox_select_1q8z8_76[readonly]:focus{forced-color-adjust:auto;outline-color:Highlight}}@supports selector(:focus-visible){.ds-combobox_select_1q8z8_76[readonly]:focus{outline:revert;outline-offset:revert}.ds-combobox_select_1q8z8_76[readonly]:focus-visible{outline:2px solid;outline-color:#252525;outline-offset:0}@media screen and (forced-colors: active){.ds-combobox_select_1q8z8_76[readonly]:focus-visible{forced-color-adjust:auto;outline-color:Highlight}}}.ds-combobox_select_1q8z8_76:disabled{background-color:transparent;border-color:#00000080;color:#00000080;cursor:not-allowed}.ds-combobox_select_1q8z8_76::-webkit-placeholder,.ds-combobox_select_1q8z8_76::placeholder{color:#666;opacity:1}.ds-combobox_select--invalid_1q8z8_196{border-color:#d43b3b;outline-color:#d43b3b}.ds-combobox_select--invalid_1q8z8_196:active,.ds-combobox_select--invalid_1q8z8_196:focus,.ds-combobox_select--invalid_1q8z8_196:focus-visible{border-color:#252525}.ds-combobox_select--small_1q8z8_84{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:.875rem;line-height:1.14;font-size-adjust:.414}.ds-combobox_select_1q8z8_76{min-height:3rem;height:3rem;inline-size:100%;grid-area:1/1/2/5}.ds-combobox_select_1q8z8_76::-webkit-outer-spin-button,.ds-combobox_select_1q8z8_76::-webkit-inner-spin-button,.ds-combobox_select_1q8z8_76::-webkit-search-decoration,.ds-combobox_select_1q8z8_76::-webkit-search-cancel-button,.ds-combobox_select_1q8z8_76::-webkit-calendar-picker-indicator{display:none;-moz-appearance:none;appearance:none;-webkit-appearance:none}.ds-combobox_select_1q8z8_76::-webkit-date-and-time-value{text-align:left}.ds-combobox_select_1q8z8_76:is([type=date],[type=time],[type=datetime-local],[type=month],[type=week]){display:flex;align-items:center;min-width:-webkit-fill-available;-moz-appearance:none;appearance:none;-webkit-appearance:none}.ds-combobox_select_1q8z8_76[type=search]{-moz-appearance:none;appearance:none;-webkit-appearance:none}.ds-combobox_select_1q8z8_76[type=range]{accent-color:#E9640C}.ds-combobox_select_1q8z8_76[type=number]{-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}.ds-combobox_select--small_1q8z8_84{min-height:2rem;height:2rem}.ds-combobox_select--small_1q8z8_84.ds-combobox_input--has-leading-icon_1q8z8_254{padding-inline-start:calc(16px + 1rem)}.ds-combobox_select--small_1q8z8_84.ds-combobox_input--has-action-button_1q8z8_257{padding-inline-end:calc(2rem + 8px)}.ds-combobox_select--small_1q8z8_84.ds-combobox_input--has-second-action-button_1q8z8_260{padding-inline-end:calc(4rem + 8px)}.ds-combobox_select--has-leading-icon_1q8z8_263{padding-inline-start:calc(32px + 1rem)}.ds-combobox_select--has-action-button_1q8z8_266{padding-inline-end:calc(3rem + 16px)}.ds-combobox_select--has-second-action-button_1q8z8_269{padding-inline-end:calc(6rem + 16px)}.ds-combobox_select--has-affix_1q8z8_272{color:#0000}.ds-combobox_select--has-affix_1q8z8_272::placeholder{color:#0000}.ds-combobox_select--has-affix_1q8z8_272::placeholder{transition:color var(--ds-animation-duration, .1s) linear}@media (prefers-reduced-motion: reduce){.ds-combobox_select--has-affix_1q8z8_272::placeholder{transition-duration:0ms}}.ds-combobox_select--is-ready_1q8z8_286{color:#252525}.ds-combobox_select--is-ready_1q8z8_286::placeholder{color:#666}.ds-combobox_select_1q8z8_76{border-radius:0}.ds-combobox_select_1q8z8_76.ds-combobox_select--disabled_1q8z8_296{background-color:transparent;border-color:#00000080;color:#00000080;cursor:not-allowed}@media screen and (forced-colors: active){.ds-combobox_select_1q8z8_76.ds-combobox_select--disabled_1q8z8_296{color:GrayText}}.ds-combobox_select_1q8z8_76.ds-combobox_select--focused_1q8z8_307{outline:2px solid;outline-color:#252525;outline-offset:-1px}@media screen and (forced-colors: active){.ds-combobox_select_1q8z8_76.ds-combobox_select--focused_1q8z8_307{forced-color-adjust:auto;outline-color:Highlight}}@media screen and (forced-colors: active){.ds-combobox_select_1q8z8_76.ds-combobox_select--focused_1q8z8_307{outline-color:Highlight}}@media (hover: hover){.ds-combobox_select--hovered_1q8z8_324{background:#0000001a}}@media screen and (hover: hover) and (forced-colors: active){.ds-combobox_select--hovered_1q8z8_324{border-color:Highlight}}.ds-combobox_placeholder_1q8z8_334{color:#666}@media screen and (forced-colors: active){.ds-combobox_placeholder_1q8z8_334{color:GrayText}}.ds-combobox_menu-list_1q8z8_343{padding-block-start:8px;padding-block-end:7px;padding-inline-start:0;padding-inline-end:0;background-color:#fff;outline:2px solid;outline-color:#252525;outline-offset:-1px}@media screen and (forced-colors: active){.ds-combobox_menu-list_1q8z8_343{forced-color-adjust:auto;outline-color:Highlight}}.ds-combobox_group-heading_1q8z8_360{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:.875rem;line-height:1.14;font-size-adjust:.414;padding-block-start:16px;padding-block-end:11px;padding-inline-start:16px;padding-inline-end:16px;margin-block-start:4px;margin-block-end:8px;margin-inline-start:0;margin-inline-end:0;border-bottom:1px solid #B1B1B1;color:#666}.ds-combobox_option_1q8z8_382{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;padding-block-start:12px;padding-block-end:12px;padding-inline-start:24px;padding-inline-end:24px;align-items:center}.ds-combobox_option--small_1q8z8_398{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:.875rem;line-height:1.14;font-size-adjust:.414;padding-block-start:8px;padding-block-end:8px;padding-inline-start:16px;padding-inline-end:16px}.ds-combobox_option--single_1q8z8_413{justify-content:space-between}.ds-combobox_option--disabled_1q8z8_416{color:#00000080}@media screen and (forced-colors: active){.ds-combobox_option--disabled_1q8z8_416{color:GrayText}}.ds-combobox_option--focus-hover_1q8z8_424:not(.ds-combobox_option--disabled_1q8z8_416){background-color:#0000001a;padding-block-start:10px;padding-block-end:10px;border:2px solid #252525;border-left:none;border-right:none}@media screen and (forced-colors: active){.ds-combobox_option--focus-hover_1q8z8_424:not(.ds-combobox_option--disabled_1q8z8_416){background-color:Canvas;border-color:Highlight}}.ds-combobox_option--focus-hover_1q8z8_424.ds-combobox_option--small_1q8z8_398:not(.ds-combobox_option--disabled_1q8z8_416){padding-block-start:6px;padding-block-end:6px}.ds-combobox_option--text_1q8z8_442{margin-inline-end:8px}.ds-combobox_option--check-icon_1q8z8_445{margin-inline-start:auto;align-self:center;fill:#e9640c}@media screen and (forced-colors: active){.ds-combobox_option--check-icon_1q8z8_445{fill:CanvasText}}.ds-combobox_option--check-icon--disabled_1q8z8_455{fill:#00000080}@media screen and (forced-colors: active){.ds-combobox_option--check-icon--disabled_1q8z8_455{fill:GrayText}}.ds-combobox_single-option_1q8z8_464{display:flex;flex-wrap:nowrap;width:100%}.ds-combobox_multi-option_1q8z8_470{width:100%}.ds-combobox_single-value_1q8z8_474{display:flex;align-items:center}.ds-combobox_single-value--text_1q8z8_478{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.ds-combobox_leading-icon_1q8z8_485{margin-block-start:2px;margin-inline-end:8px;fill:#666}@media screen and (forced-colors: active){.ds-combobox_leading-icon_1q8z8_485{background-color:Canvas;fill:CanvasText}}.ds-combobox_leading-icon--small_1q8z8_496,.ds-combobox_leading-icon--selected_1q8z8_496{margin-block-start:0px}.ds-combobox_leading-icon--disabled_1q8z8_499{fill:#00000080}@media screen and (forced-colors: active){.ds-combobox_leading-icon--disabled_1q8z8_499{fill:GrayText}}.ds-combobox_indicator_1q8z8_508,.ds-combobox_clear_1q8z8_509{width:3rem;height:3rem;justify-content:center;cursor:pointer}.ds-combobox_indicator--small_1q8z8_515,.ds-combobox_clear--small_1q8z8_516{width:2rem;height:2rem}.ds-combobox_indicator--icon_1q8z8_520,.ds-combobox_clear--icon_1q8z8_521{margin-block-start:16px;margin-block-end:16px;margin-inline-start:16px;margin-inline-end:16px;align-self:center}.ds-combobox_indicator--icon--small_1q8z8_528,.ds-combobox_clear--icon--small_1q8z8_529{margin-block-start:8px;margin-block-end:8px;margin-inline-start:8px;margin-inline-end:8px}