The rules — progressive disclosure of independent sections
- An accordion stacks independent, individually-openable sections — FAQ entries, advanced/rare option groups, long read-mostly content. If the sections are peer views of ONE object, that is tabs; if the user needs several open to work, use plain cards.
- The default is single-open (
data-bs-parenton every.accordion-collapse) with the first item open; dropdata-bs-parentonly when comparing sections side by side is the point. - Inside a card use
.accordion-flushfull-bleed (directly in the card, not in.card-body) — the card provides the frame, the accordion drops its own borders. - Standalone (not in a card) the plain
.accordioncarries its own borders and needs no card around it. Pick ONE per page — do not mix framed and flush. - Headers are short noun phrases; the body follows the normal standards. No icons in accordion headers (the chevron is the affordance).
Standalone — plain
.accordion, single-open
Plans are billed per company, monthly or yearly. Every seat you add is prorated to the current period.
Yes — upgrades apply immediately, downgrades at the end of the billing period.
You can export everything before closing the account; we keep the data 30 days, then it is deleted.
Inside a card —
.accordion-flush, full-bleedAdvanced settings — rare options, tucked away
Tokens, allowed origins and rate limits would live here — a full form section, hidden until needed.
Retention windows per data type — another independent section.
Destructive operations live collapsed by default — opening the section is the first "are you sure".