@stihl-design-system/components/assets/Accordion.RlqWqpGo.css

Welcome to the STIHL Design System react component library.

*:not(li)>.ds-accordion_details_zfwi3_1:only-of-type,li>.ds-accordion_details_zfwi3_1:only-of-type:not(:only-child){border-bottom:none}.ds-accordion_details_zfwi3_1{max-width:44.9375rem;border-bottom:1px solid #B1B1B1;color:#252525}.ds-accordion_details_zfwi3_1 a:not([class]){display:inline;padding-inline-end:2px;padding-inline-start:2px;padding-block-start:0;padding-block-end:0;line-height:inherit;font-size:inherit;text-decoration-skip-ink:auto;text-decoration-line:underline;text-underline-offset:2px;text-decoration-thickness:1px;text-decoration-color:currentColor}:where(.ds-accordion_details_zfwi3_1 a:not([class]))[href^="http://"]:after,:where(.ds-accordion_details_zfwi3_1 a:not([class]))[href^="https://"]:after,:where(.ds-accordion_details_zfwi3_1 a:not([class]))[href^="#"]:after{display:inline-block;margin-inline-start:.375em;width:.75em;height:.75em}.ds-accordion_details_zfwi3_1 a:not([class]){color:#252525}.ds-accordion_details_zfwi3_1 a:not([class]):link,.ds-accordion_details_zfwi3_1 a:not([class]):visited{color:#252525}.ds-accordion_details_zfwi3_1 a:not([class]):active{background-color:#0000001a;color:#252525}@media(hover:hover){.ds-accordion_details_zfwi3_1 a:not([class]):hover{background-color:#0000001a;color:#252525}}@media screen and (hover:hover)and (forced-colors:active){.ds-accordion_details_zfwi3_1 a:not([class]):hover{background-color:Canvas}}.ds-accordion_details_zfwi3_1 a:not([class])[href^="http://"]:after,.ds-accordion_details_zfwi3_1 a:not([class])[href^="https://"]:after{content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23252525' viewBox='0 0 16 16' focusable='false' width='100%25' height='100%25'%3E%3Cpath fill-rule='evenodd' d='M9 2V0h7v7h-2V3.4L8.1 9.3 6.7 7.9 12.6 2H9Zm5 8h-2v4H2V4h4V2H0v14h14v-6Z' clip-rule='evenodd'/%3E%3C/svg%3E")}.ds-accordion_details_zfwi3_1 a:not([class])[href^="#"]:after{content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23252525' viewBox='0 0 16 16' focusable='false' width='100%25' height='100%25'%3E%3Cpath d='M14.4 9.6 8 16 1.6 9.6 3 8.2l4 4V0h2v12.2l4-4 1.4 1.4Z'/%3E%3C/svg%3E")}@media screen and (forced-colors:active){.ds-accordion_details_zfwi3_1 a:not([class])[href^="http://"]:after,.ds-accordion_details_zfwi3_1 a:not([class])[href^="https://"]:after{forced-color-adjust:none;content:"";background-color:LinkText;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='100%25' height='100%25'%3E%3Cpath fill-rule='evenodd' d='M9 2V0h7v7h-2V3.4L8.1 9.3 6.7 7.9 12.6 2H9Zm5 8h-2v4H2V4h4V2H0v14h14v-6Z' clip-rule='evenodd'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='100%25' height='100%25'%3E%3Cpath fill-rule='evenodd' d='M9 2V0h7v7h-2V3.4L8.1 9.3 6.7 7.9 12.6 2H9Zm5 8h-2v4H2V4h4V2H0v14h14v-6Z' clip-rule='evenodd'/%3E%3C/svg%3E");-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.ds-accordion_details_zfwi3_1 a:not([class])[href^="#"]:after{forced-color-adjust:none;content:"";background-color:LinkText;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='100%25' height='100%25'%3E%3Cpath d='M14.4 9.6 8 16 1.6 9.6 3 8.2l4 4V0h2v12.2l4-4 1.4 1.4Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='100%25' height='100%25'%3E%3Cpath d='M14.4 9.6 8 16 1.6 9.6 3 8.2l4 4V0h2v12.2l4-4 1.4 1.4Z'/%3E%3C/svg%3E");-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}}.ds-accordion_details_zfwi3_1 a:not([class]):focus{outline:2px solid;outline-color:#252525;outline-offset:0}@media screen and (forced-colors:active){.ds-accordion_details_zfwi3_1 a:not([class]):focus{forced-color-adjust:auto;outline-color:Highlight}}@supports selector(:focus-visible){.ds-accordion_details_zfwi3_1 a:not([class]):focus{outline:revert;outline-offset:revert}.ds-accordion_details_zfwi3_1 a:not([class]):focus-visible{outline:2px solid;outline-color:#252525;outline-offset:0}@media screen and (forced-colors:active){.ds-accordion_details_zfwi3_1 a:not([class]):focus-visible{forced-color-adjust:auto;outline-color:Highlight}}}.ds-accordion_details_zfwi3_1 a:not([class]){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-accordion_details_zfwi3_1 a:not([class]){transition-duration:0ms}}.ds-accordion_details--dark_zfwi3_112{color:#fff;border-bottom-color:#666}.ds-accordion_details--dark_zfwi3_112 a:not([class]){display:inline;padding-inline-end:2px;padding-inline-start:2px;padding-block-start:0;padding-block-end:0;line-height:inherit;font-size:inherit;text-decoration-skip-ink:auto;text-decoration-line:underline;text-underline-offset:2px;text-decoration-thickness:1px;text-decoration-color:currentColor}:where(.ds-accordion_details--dark_zfwi3_112 a:not([class]))[href^="http://"]:after,:where(.ds-accordion_details--dark_zfwi3_112 a:not([class]))[href^="https://"]:after,:where(.ds-accordion_details--dark_zfwi3_112 a:not([class]))[href^="#"]:after{display:inline-block;margin-inline-start:.375em;width:.75em;height:.75em}.ds-accordion_details--dark_zfwi3_112 a:not([class]){color:#fff}.ds-accordion_details--dark_zfwi3_112 a:not([class]):link,.ds-accordion_details--dark_zfwi3_112 a:not([class]):visited{color:#fff}.ds-accordion_details--dark_zfwi3_112 a:not([class]):active{background-color:#ffffff26;color:#fff}@media(hover:hover){.ds-accordion_details--dark_zfwi3_112 a:not([class]):hover{background-color:#ffffff26;color:#fff}}@media screen and (hover:hover)and (forced-colors:active){.ds-accordion_details--dark_zfwi3_112 a:not([class]):hover{background-color:Canvas}}.ds-accordion_details--dark_zfwi3_112 a:not([class])[href^="http://"]:after,.ds-accordion_details--dark_zfwi3_112 a:not([class])[href^="https://"]:after{content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FFFFFF' viewBox='0 0 16 16' focusable='false' width='100%25' height='100%25'%3E%3Cpath fill-rule='evenodd' d='M9 2V0h7v7h-2V3.4L8.1 9.3 6.7 7.9 12.6 2H9Zm5 8h-2v4H2V4h4V2H0v14h14v-6Z' clip-rule='evenodd'/%3E%3C/svg%3E")}.ds-accordion_details--dark_zfwi3_112 a:not([class])[href^="#"]:after{content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FFFFFF' viewBox='0 0 16 16' focusable='false' width='100%25' height='100%25'%3E%3Cpath d='M14.4 9.6 8 16 1.6 9.6 3 8.2l4 4V0h2v12.2l4-4 1.4 1.4Z'/%3E%3C/svg%3E")}@media screen and (forced-colors:active){.ds-accordion_details--dark_zfwi3_112 a:not([class])[href^="http://"]:after,.ds-accordion_details--dark_zfwi3_112 a:not([class])[href^="https://"]:after{forced-color-adjust:none;content:"";background-color:LinkText;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='100%25' height='100%25'%3E%3Cpath fill-rule='evenodd' d='M9 2V0h7v7h-2V3.4L8.1 9.3 6.7 7.9 12.6 2H9Zm5 8h-2v4H2V4h4V2H0v14h14v-6Z' clip-rule='evenodd'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='100%25' height='100%25'%3E%3Cpath fill-rule='evenodd' d='M9 2V0h7v7h-2V3.4L8.1 9.3 6.7 7.9 12.6 2H9Zm5 8h-2v4H2V4h4V2H0v14h14v-6Z' clip-rule='evenodd'/%3E%3C/svg%3E");-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.ds-accordion_details--dark_zfwi3_112 a:not([class])[href^="#"]:after{forced-color-adjust:none;content:"";background-color:LinkText;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='100%25' height='100%25'%3E%3Cpath d='M14.4 9.6 8 16 1.6 9.6 3 8.2l4 4V0h2v12.2l4-4 1.4 1.4Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='100%25' height='100%25'%3E%3Cpath d='M14.4 9.6 8 16 1.6 9.6 3 8.2l4 4V0h2v12.2l4-4 1.4 1.4Z'/%3E%3C/svg%3E");-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}}.ds-accordion_details--dark_zfwi3_112 a:not([class]):focus{outline:2px solid;outline-color:#fff;outline-offset:0}@media screen and (forced-colors:active){.ds-accordion_details--dark_zfwi3_112 a:not([class]):focus{forced-color-adjust:auto;outline-color:Highlight}}@supports selector(:focus-visible){.ds-accordion_details--dark_zfwi3_112 a:not([class]):focus{outline:revert;outline-offset:revert}.ds-accordion_details--dark_zfwi3_112 a:not([class]):focus-visible{outline:2px solid;outline-color:#fff;outline-offset:0}@media screen and (forced-colors:active){.ds-accordion_details--dark_zfwi3_112 a:not([class]):focus-visible{forced-color-adjust:auto;outline-color:Highlight}}}.ds-accordion_details--dark_zfwi3_112 a:not([class]){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-accordion_details--dark_zfwi3_112 a:not([class]){transition-duration:0ms}}.ds-accordion_details_zfwi3_1::details-content{block-size:0;overflow:hidden;opacity:0;transition-property:block-size,content-visibility,opacity;transition-behavior:allow-discrete;transition-duration:var(--ds-animation-duration, .25s);transition-timing-function:cubic-bezier(.5,0,1,1)}@media(prefers-reduced-motion:reduce){.ds-accordion_details_zfwi3_1::details-content{transition-duration:0ms}}.ds-accordion_details_zfwi3_1[open]::details-content{overflow:visible;transition-timing-function:cubic-bezier(0,0,.5,1);block-size:auto;block-size:calc-size(auto);opacity:1}.ds-accordion_summary_zfwi3_241{cursor:pointer;padding-block-start:12px;padding-inline-end:16px;padding-block-end:12px;padding-inline-start:16px;list-style:none}.ds-accordion_summary_zfwi3_241:focus{outline:2px solid;outline-color:#252525;outline-offset:0px}@media screen and (forced-colors:active){.ds-accordion_summary_zfwi3_241:focus{forced-color-adjust:auto;outline-color:Highlight}}@supports selector(:focus-visible){.ds-accordion_summary_zfwi3_241:focus{outline:revert;outline-offset:revert}.ds-accordion_summary_zfwi3_241:focus-visible{outline:2px solid;outline-color:#252525;outline-offset:0px}@media screen and (forced-colors:active){.ds-accordion_summary_zfwi3_241:focus-visible{forced-color-adjust:auto;outline-color:Highlight}}}.ds-accordion_summary_zfwi3_241::-webkit-details-marker{display:none}.ds-accordion_summary--utility--m_zfwi3_280{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}.ds-accordion_summary_zfwi3_241{transition:background-color var(--ds-animation-duration, .1s) linear}@media(prefers-reduced-motion:reduce){.ds-accordion_summary_zfwi3_241{transition-duration:0ms}}@media(hover:hover){.ds-accordion_summary_zfwi3_241:hover{background-color:#ededed}}@media screen and (hover:hover)and (forced-colors:active){.ds-accordion_summary_zfwi3_241:hover{background-color:Highlight}}.ds-accordion_summary--dark_zfwi3_309:focus{outline:2px solid;outline-color:#fff;outline-offset:0px}@media screen and (forced-colors:active){.ds-accordion_summary--dark_zfwi3_309:focus{forced-color-adjust:auto;outline-color:Highlight}}@supports selector(:focus-visible){.ds-accordion_summary--dark_zfwi3_309:focus{outline:revert;outline-offset:revert}.ds-accordion_summary--dark_zfwi3_309:focus-visible{outline:2px solid;outline-color:#fff;outline-offset:0px}@media screen and (forced-colors:active){.ds-accordion_summary--dark_zfwi3_309:focus-visible{forced-color-adjust:auto;outline-color:Highlight}}}@media(hover:hover){.ds-accordion_summary--dark_zfwi3_309:hover{background-color:#444}}@media screen and (hover:hover)and (forced-colors:active){.ds-accordion_summary--dark_zfwi3_309:hover{background-color:Highlight}}@media(hover:hover){.ds-accordion_summary--dark_zfwi3_309.ds-accordion_summary--flush_zfwi3_348:hover:before{background-color:#444}}@media screen and (hover:hover)and (forced-colors:active){.ds-accordion_summary--dark_zfwi3_309.ds-accordion_summary--flush_zfwi3_348:hover:before{background-color:Highlight}}@media screen and (hover:hover)and (forced-colors:active){.ds-accordion_summary--dark_zfwi3_309.ds-accordion_summary--flush_zfwi3_348:hover{background-color:transparent}}.ds-accordion_summary--dark_zfwi3_309.ds-accordion_summary--flush_zfwi3_348:focus,.ds-accordion_summary--dark_zfwi3_309.ds-accordion_summary--flush_zfwi3_348:focus-visible{outline:none}.ds-accordion_summary--dark_zfwi3_309.ds-accordion_summary--flush_zfwi3_348:focus:before{outline:2px solid;outline-color:#fff;outline-offset:0px}@media screen and (forced-colors:active){.ds-accordion_summary--dark_zfwi3_309.ds-accordion_summary--flush_zfwi3_348:focus:before{forced-color-adjust:auto;outline-color:Highlight}}@supports selector(:focus-visible){.ds-accordion_summary--dark_zfwi3_309.ds-accordion_summary--flush_zfwi3_348:focus:before{outline:revert;outline-offset:revert}.ds-accordion_summary--dark_zfwi3_309.ds-accordion_summary--flush_zfwi3_348:focus-visible:before{outline:2px solid;outline-color:#fff;outline-offset:0px}@media screen and (forced-colors:active){.ds-accordion_summary--dark_zfwi3_309.ds-accordion_summary--flush_zfwi3_348:focus-visible:before{forced-color-adjust:auto;outline-color:Highlight}}}.ds-accordion_summary--flush_zfwi3_348{position:relative;padding-inline-start:0;padding-inline-end:0}@media(hover:hover){.ds-accordion_summary--flush_zfwi3_348:hover:before{background-color:#ededed}}@media screen and (hover:hover)and (forced-colors:active){.ds-accordion_summary--flush_zfwi3_348:hover:before{background-color:Highlight}}@media screen and (hover:hover)and (forced-colors:active){.ds-accordion_summary--flush_zfwi3_348:hover{background-color:transparent}}.ds-accordion_summary--flush_zfwi3_348:before{content:"";position:absolute;inset:0 -16px}.ds-accordion_summary--flush_zfwi3_348:before{transition:background-color var(--ds-animation-duration, .1s) linear,color var(--ds-animation-duration, .1s) linear}@media(prefers-reduced-motion:reduce){.ds-accordion_summary--flush_zfwi3_348:before{transition-duration:0ms}}.ds-accordion_summary--flush_zfwi3_348:focus,.ds-accordion_summary--flush_zfwi3_348:focus-visible{outline:none}.ds-accordion_summary--flush_zfwi3_348:focus:before{outline:2px solid;outline-color:#252525;outline-offset:0px}@media screen and (forced-colors:active){.ds-accordion_summary--flush_zfwi3_348:focus:before{forced-color-adjust:auto;outline-color:Highlight}}@supports selector(:focus-visible){.ds-accordion_summary--flush_zfwi3_348:focus:before{outline:revert;outline-offset:revert}.ds-accordion_summary--flush_zfwi3_348:focus-visible:before{outline:2px solid;outline-color:#252525;outline-offset:0px}@media screen and (forced-colors:active){.ds-accordion_summary--flush_zfwi3_348:focus-visible:before{forced-color-adjust:auto;outline-color:Highlight}}}.ds-accordion_summary--small_zfwi3_460{padding-block-start:8px;padding-block-end:8px}.ds-accordion_summary--x-small_zfwi3_464{padding-block-start:6px;padding-block-end:6px}.ds-accordion_summary-content-wrapper_zfwi3_469{display:flex;justify-content:space-between;align-items:center;gap:16px}.ds-accordion_summary-content-wrapper--flush_zfwi3_475{position:relative;z-index:1}.ds-accordion_summary-content-wrapper--chevron-left_zfwi3_479{flex-flow:row-reverse;justify-content:flex-end}.ds-accordion_summary-content-wrapper--x-small_zfwi3_483{gap:8px}.ds-accordion_heading-summary-wrapper_zfwi3_487{flex-grow:1}.ds-accordion_heading-summary_zfwi3_487{display:flex;justify-content:space-between;align-items:center;gap:16px}.ds-accordion_heading-summary--x-small_zfwi3_497{gap:8px}.ds-accordion_hint_zfwi3_501{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:.875rem;line-height:1.14;font-size-adjust:.414;font-weight:400;display:block;margin-block-start:4px}.ds-accordion_icon_zfwi3_515{transform:rotate(0)}.ds-accordion_icon_zfwi3_515{transition:transform var(--ds-animation-duration, .25s) cubic-bezier(.5,0,1,1)}@media(prefers-reduced-motion:reduce){.ds-accordion_icon_zfwi3_515{transition-duration:0ms}}.ds-accordion_icon--open_zfwi3_526{transform:rotate(-180deg)}.ds-accordion_icon--open_zfwi3_526{transition:transform var(--ds-animation-duration, .25s) cubic-bezier(0,0,.5,1)}@media(prefers-reduced-motion:reduce){.ds-accordion_icon--open_zfwi3_526{transition-duration:0ms}}.ds-accordion_icon--open-caret_zfwi3_537{transform:rotate(90deg)}.ds-accordion_icon--open-caret_zfwi3_537{transition:transform var(--ds-animation-duration, .25s) cubic-bezier(0,0,.5,1)}@media(prefers-reduced-motion:reduce){.ds-accordion_icon--open-caret_zfwi3_537{transition-duration:0ms}}.ds-accordion_content-wrapper_zfwi3_549{padding-block-start:4px;padding-inline-end:16px;padding-block-end:32px;padding-inline-start:16px}.ds-accordion_content-wrapper--flush_zfwi3_555{padding-inline-start:0;padding-inline-end:0}.ds-accordion_content-wrapper--small_zfwi3_559{padding-block-start:4px;padding-block-end:20px}.ds-accordion_content-wrapper--x-small_zfwi3_563{padding-inline-start:0px;padding-inline-end:0px;padding-block-start:2px;padding-block-end:16px}