{% comment %}
Cotton Card Component - Django Template Version of shadcn/ui Card
Converts existing card component to use Django Cotton's component system
{% endcomment %}

<!-- Cotton Card Component -->
<c-vars
  card_classes="card_classes|default:''"
  title="title|default:''"
  description="description|default:''"
  header_content="header_content|default:''"
  body_content="body_content|default:''"
  footer_content="footer_content|default:''"
  content="content|default:''"
/>

<div class="rounded-lg border bg-card text-card-foreground shadow-sm {{ card_classes }}">
  {% if title or description or header_content %}
  <div class="flex flex-col space-y-1.5 p-6">
    {% if title %}
    <h3 class="text-2xl font-semibold leading-none tracking-tight">{{ title }}</h3>
    {% endif %}
    {% if description %}
    <p class="text-sm text-muted-foreground">{{ description }}</p>
    {% endif %}
    
    <!-- Card Header Slot -->
    <c-slot name="header">
      {% if header_content %}
      {{ header_content|safe }}
      {% endif %}
    </c-slot>
  </div>
  {% endif %}
  
  {% if content or body_content %}
  <div class="p-6 pt-0">
    <!-- Card Body Content -->
    <c-slot name="content">
      {% if content %}
      {{ content|safe }}
      {% endif %}
      {% if body_content %}
      {{ body_content|safe }}
      {% endif %}
    </c-slot>
  </div>
  {% endif %}
  
  {% if footer_content %}
  <div class="flex items-center p-6 pt-0">
    <!-- Card Footer Slot -->
    <c-slot name="footer">
      {{ footer_content|safe }}
    </c-slot>
  </div>
  {% endif %}
</div>