{# Detail region — UX-035 adopter #14. #}
{% from 'macros/region_wrapper.html' import region_card %}
{% from 'macros/status_badge.html' import render_status_badge %}
{% call region_card(title) %}
  {% if item %}
  <dl class="grid grid-cols-2 gap-2">
    {% for col in columns %}
    <dt class="text-[11px] font-semibold text-[hsl(var(--muted-foreground))] uppercase tracking-wide">{{ col.label }}</dt>
    <dd class="text-[13px] text-[hsl(var(--foreground))]">
      {% if col.type == "badge" %}
        {{ render_status_badge(value=item[col.key], bordered=true) }}
      {% elif col.type == "bool" %}
        {{ item[col.key] | bool_icon }}
      {% elif col.type == "date" %}
        {{ item[col.key] | dateformat }}
      {% elif col.type == "currency" %}
        {{ item[col.key] | currency }}
      {% elif col.type == "ref" %}
        {% set ref = item[col.key] %}
        {% set display_name = item.get(col.key ~ "_display", "") %}
        {% if ref is mapping %}
          {% set display_name = display_name or (ref | ref_display) %}
          {% if col.ref_route and ref.get("id") %}
            <a href="{{ col.ref_route | replace('{id}', ref.get('id', '')|string) }}" class="text-[hsl(var(--primary))] hover:underline">{{ display_name }}</a>
          {% else %}{{ display_name }}{% endif %}
        {% elif display_name %}{{ display_name }}{% elif ref %}{{ ref }}{% else %}—{% endif %}
      {% else %}
        {{ item[col.key] | default("—") }}
      {% endif %}
    </dd>
    {% endfor %}
  </dl>
  {% else %}
  <p class="dz-empty-dense text-[13px] text-[hsl(var(--muted-foreground))]" role="status">{{ empty_message | default("No record selected.") }}</p>
  {% endif %}
{% endcall %}