.woogency-accordion{--accordion-color:var(--fs-color-primary);--text-color:#fff;--transition:0.3s;--spacer:1rem;--radius:0.5rem;--border-width:0px;--border-type:solid;--border-color:var(--accordion-color, #ccc);--focus-outline:3px;interpolate-size:allow-keywords;display:grid;gap:calc(var(--spacer) / 2);details{overflow:hidden;border:var(--border-width,1px) var(--border-type,solid) var(--border-color,#ccc);border-radius:var(--radius);background-color:var(--accordion-color);transition:all var(--transition);&:hover,&:focus{background-color:hsl(from var(--accordion-color) h s calc(l * 0.7) / 1);border-color:hsl(from var(--accordion-color) h s calc(l * 0.7) / 1)}&:open{background-color:hsl(from var(--accordion-color) h s calc(l * 0.7) / 1);i{transform:rotate(180deg)}}*{color:var(--text-color,currentColor);margin:0}}summary{cursor:pointer;list-style-position:outside;display:flex;justify-content:space-between;align-items:center;gap:calc(var(--spacer) / 2);padding-block:calc(var(--spacer) / 2);padding-inline:var(--spacer);&:hover,&:focus{outline:var(--disable-focus)}i{transition:transform var(--transition)}}.woogency-accordion-content{>*{padding-block-end:calc(var(--spacer) / 2);padding-inline:var(--spacer)}ul:not([class]) li::before{background-color:#fff}}}@supports (transition-behavior:allow-discrete){.woogency-accordion details::details-content{block-size:0;transition:block-size 0.3s,content-visibility 0.3s;transition-behavior:allow-discrete}.woogency-accordion details[open]::details-content{block-size:auto}.woogency-accordion .accordion-content-inner{max-height:none;overflow:visible;opacity:1;transition:none}}.woogency-accordion details[open] summary i{transform:rotate(180deg)}