This widget works entirely without JavaScript. It uses a hidden checkbox input and the sibling selector to control the visibility of this container.
It is robust and works even if JS is disabled.
This widget uses the semantic <details> and <summary> tags.
This is the most accessible and semantic way to create expand/collapse widgets in modern browsers.
This implementation uses Vanilla JavaScript to toggle classes and handle ARIA attributes for accessibility.
It calculates the exact height needed for the animation.