{# Macro page_header
   Uso:
     {% from "core/components/page_header.html" import page_header %}
     {% call page_header(title="Apps", subtitle="12 activas", icon="layout-dashboard",
                         meta=[{"icon": "clock", "label": "Actualizado hace 2 h"}]) %}
       <a href="/projects/new" class="btn-primary">Crear</a>
     {% endcall %}

   icon     → nombre del registro de iconos; pinta un icon_tile a la izquierda.
   tone     → tono del tile (neutral por defecto: el acento queda para acciones).
   meta     → chips bajo el subtítulo; cada item es {"icon", "label"} o un texto.
   eyebrow  → texto corto sobre el título (sección o contexto).
   El bloque `call` se pinta como zona de acciones a la derecha.
#}
{% from "core/components/icon.html" import icon as _icon, icon_tile as _icon_tile %}

{% macro page_header(title, subtitle="", breadcrumbs=[], icon=none, tone="neutral", meta=[], eyebrow="") %}
<div class="dg-page-header">
  <div class="dg-page-header-main">
    {%- if icon %}
    {{ _icon_tile(icon, tone=tone, size="md") }}
    {%- endif %}
    <div class="dg-page-header-text">
      {%- if breadcrumbs %}
      <nav aria-label="Breadcrumb" class="dg-crumbs dg-crumbs-inline">
        {%- for crumb in breadcrumbs %}
          {%- if not loop.last %}
          <a href="{{ crumb.href }}">{{ crumb.label }}</a>
          {{ _icon("chevron-right", class="dg-crumbs-sep") }}
          {%- else %}
          <span aria-current="page">{{ crumb.label }}</span>
          {%- endif %}
        {%- endfor %}
      </nav>
      {%- endif %}
      {%- if eyebrow %}
      <span class="dg-page-header-eyebrow">{{ eyebrow }}</span>
      {%- endif %}
      <h1 class="dg-page-header-title">{{ title }}</h1>
      {%- if subtitle %}
      <p class="dg-page-header-subtitle">{{ subtitle }}</p>
      {%- endif %}
      {%- if meta %}
      <div class="dg-meta">
        {%- for item in meta %}
        {%- if item is mapping %}
        <span class="dg-meta-chip">{% if item.icon %}{{ _icon(item.icon, class="dg-meta-chip-icon") }}{% endif %}{{ item.label }}</span>
        {%- else %}
        <span class="dg-meta-chip">{{ item }}</span>
        {%- endif %}
        {%- endfor %}
      </div>
      {%- endif %}
    </div>
  </div>
  {%- if caller is defined %}
  <div class="dg-page-header-actions">
    {{ caller() }}
  </div>
  {%- endif %}
</div>
{%- endmacro %}