import { Meta, Title, Subtitle, Description, Primary, Controls, Stories, Canvas } from '@storybook/addon-docs/blocks';
import * as CardStories from './card.stories';

<Meta of={CardStories} />

<Title />
<Subtitle>The primary structural container for content blocks.</Subtitle>

<Description />

<Primary />

---

## Variations

<Stories />

---

## AI Best Practices

> [!IMPORTANT]
> - **No Raw Divs** — Never use raw Tailwind classes for containers (`bg-white rounded-lg shadow`). Always use `<Card>`.
> - **Hierarchy** — Use `CardHeader` for titles and descriptions, and `CardFooter` for action buttons.
> - **Stats** — For KPI displays, use `text-sm font-medium` for titles and `text-2xl font-bold` for values.