{% extends '@Contao/content_element/description_list.html.twig' %}

{% set prose = html_cva(
    base = 'prose dark:prose-invert max-w-none',
    variants = {
        size: {
            sm: 'prose-sm',
            md: 'prose-sm lg:prose-base',
            lg: 'lg:prose-lg',
            xl: 'prose-lg lg:prose-xl',
        }
    },
    defaultVariant = {
        size: 'md',
    }
) %}

{% set attributes = attrs(attributes|default).addClass(prose.apply({size: data.cvaSize})) %}

{% set description_list_attributes = attrs(description_list_attributes|default).addClass('divide-y divide-gray-200 dark:divide-gray-800') %}
{% set description_term_attributes = attrs(description_term_attributes|default).addClass('font-medium') %}
{% set description_details_attributes = attrs(description_details_attributes|default).addClass('mt-1 sm:col-span-2 sm:mt-0') %}

{% block description %}
    <div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0">
        {{ parent() }}
    </div>
{% endblock %}
