---
const { variant = "compact" } = Astro.props;
---

<div
  class:list={[
    "not-prose my-6",
    variant === "table"
      ? "space-y-4"
      : "grid grid-cols-2 gap-x-5 gap-y-4 sm:grid-cols-4",
  ]}
  data-blume-color={variant}
>
  <slot />
</div>