@layer modules{.card{--row-gap: var(--spacing-2xs);padding:var(--spacing-xs);border-radius:var(--radius-md);display:grid;grid-auto-rows:auto 1fr auto;gap:var(--row-gap) var(--spacing-xs);font-size:var(--font-size-body-md)}.card .card-content *{font-size:inherit}.card .card-content>*:not(ul:only-child,ol:only-child){break-inside:avoid}.card .buttons{display:flex;flex-wrap:wrap;gap:var(--spacing-4xs);margin-top:var(--spacing-4xs)}.card.collapsable .card-heading{display:grid;align-items:center;grid-template-columns:1fr auto;cursor:pointer;transition-property:margin;transition-duration:var(--transition-duration-fast);transition-timing-function:var(--transition-timing-function)}.card.collapsable .card-heading::before,.card.collapsable .card-heading::after{content:"";display:inline-block;width:1.33em;height:1.33em;mask-image:url("/assets/icons/close.svg");mask-size:contain;mask-position:center;mask-repeat:no-repeat;background-color:currentColor;margin-left:.5em;flex-shrink:0;grid-area:1/2/2/3;transition-property:opacity,translate;transition-duration:inherit;transition-timing-function:inherit}.card.collapsable .card-heading::after{mask-image:url("/assets/icons/caret.svg");translate:0 -11%;opacity:0}.card.collapsable .card-heading[aria-expanded=false]{margin-bottom:calc(-1*var(--row-gap))}.card.collapsable .card-heading[aria-expanded=false]::after{opacity:1;translate:0 0}.card.collapsable .card-heading[aria-expanded=false]::before{opacity:0;translate:0 11%}.card.collapsable .collapsable-content{display:grid;grid-auto-rows:1fr auto;gap:inherit;overflow:hidden;opacity:1;height:var(--height);transition-property:height,opacity;transition-duration:var(--transition-duration-fast);transition-timing-function:var(--transition-timing-function)}.card.collapsable .collapsable-content[hidden]{height:0px;opacity:0}.card.color-secondary{background-color:var(--bg-color-secondary);color:var(--text-color-secondary)}.card.color-tertiary{background-color:var(--bg-color-tertiary);color:var(--text-color-tertiary)}.card.color-dark{background-color:var(--bg-color-dark);color:var(--text-color-light)}@container (min-width: 32rem){.card .card-content.two-column{columns:2;column-gap:var(--spacing-xs)}}}/*# sourceMappingURL=card.css.map */
