{# Form rendering for styled Section — white card with optional header/footer #}
{% from "partials/macros/form_item.html" import render_item with context %}
{% set _section_span = _span_map[item.col_span] if item.col_span in _span_map else "" %}
{% set cols_class = _cols_map[item.cols] if item.cols in _cols_map else "grid-cols-1" %}
<div class="{{ _section_span }} bg-white dark:bg-secondary-800 rounded-xl border border-secondary-200 dark:border-secondary-700 shadow-sm overflow-hidden {{ item.css_class }}">
  {% if item.title %}
  <div class="px-5 py-4 border-b border-secondary-100 dark:border-secondary-700">
    <h3 class="text-sm font-semibold text-secondary-700 dark:text-secondary-200">{{ item.title }}</h3>
    {% if item.description %}<p class="text-xs text-secondary-400 dark:text-secondary-500 mt-0.5">{{ item.description }}</p>{% endif %}
  </div>
  {% endif %}
  <div class="p-5 grid {{ cols_class }} gap-4">
    {% for child in item.fields %}{{ render_item(child) }}{% endfor %}
  </div>
  {% if item.footer %}
  <div class="px-5 py-3 border-t border-secondary-100 dark:border-secondary-700 bg-secondary-50 dark:bg-secondary-900/40">
    <p class="text-xs text-secondary-400 dark:text-secondary-500">{{ item.footer }}</p>
  </div>
  {% endif %}
</div>