<div class="spellbook-card spellbook-border spellbook-border-radius-lg spellbook-shadow-sm spellbook-transition spellbook-mb-3 spellbook-bg-light {% if kwargs.class %}{{ kwargs.class }}{% endif %}">
    {% if title %}
        <div class="spellbook-card-header spellbook-bg-light spellbook-p-2 spellbook-font-bold">
            <h5 class="spellbook-card-title">{{ title }}</h5>
        </div>
    {% endif %}
    <div class="spellbook-card-body spellbook-p-3">
        {{ content|safe }}
    </div>
    {% if footer %}
        <div class="spellbook-card-footer spellbook-bg-light spellbook-p-2 spellbook-border-t">
            {{ footer }}
        </div>
    {% endif %}
</div>
