Card

Card(
  header: const CardHeader(
    title: CardTitle('Complete Card'),
    description: CardDescription('With all sections'),
  ),
  content: CardContent(
    child: Text(
      'Use the content slot for your main information or body copy.',
      style: TextStyle(color: AppTheme.textSecondary),
    ),
  ),
  footer: CardFooter(
    child: Row(
      children: [
        Button(
          onPressed: () {},
          child: const Text('Primary Action'),
        ),
        AppTheme.gapHorizontalSm,
        Button(
          variant: ButtonVariant.ghost,
          onPressed: () {},
          child: const Text('Secondary'),
        ),
      ],
    ),
  ),
)

Card(
  onTap: () {
    print('Card tapped');
  },
  header: CardHeader(
    title: CardTitle('Clickable Card'),
    description: CardDescription('Tap to interact'),
  ),
  content: CardContent(
    child: Text('This card responds to taps'),
  ),
)

Card(
  showDividers: true,
  header: CardHeader(
    title: CardTitle('Sectioned Card'),
    description: CardDescription('With dividers'),
  ),
  content: CardContent(
    child: Text('Content section'),
  ),
  footer: CardFooter(
    child: Text('Footer section'),
  ),
)

Card(
  header: const CardHeader(
    title: CardTitle('John Doe'),
    description: CardDescription('Software Engineer'),
  ),
  content: CardContent(
    child: Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        const Text('Email: john@example.com'),
        AppTheme.gapSm,
        const Text('Location: San Francisco, CA'),
        AppTheme.gapSm,
        Row(
          children: const [
            Icon(Icons.star, color: Colors.amber),
            SizedBox(width: 4),
            Text('Top-rated mentor'),
          ],
        ),
      ],
    ),
  ),
  footer: CardFooter(
    child: Button(
      onPressed: () {},
      child: const Text('View Profile'),
    ),
  ),
)