/* ============================================================
   HUF — Componente: EmptyState (.hd-empty-state)
   ------------------------------------------------------------
   Vehículo: TagHelper <hd-empty-state> (AdminPortal/TagHelpers/
   HdEmptyStateTagHelper.cs). Versión HUF-nativa, en paralelo a
   _EmptyState.cshtml (que sigue sin cambios — no se migra ninguna
   pantalla). Regla de copy (plan §16.4): el mensaje debe ser accionable
   cuando exista una acción posible, usando el slot de contenido para el
   botón en vez de solo texto descriptivo.
   Ejemplos de uso → docs/hednora-ui-framework-guide.md §EmptyState.
   ============================================================ */

.hd-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--hd-space-7) var(--hd-space-5);
    color: var(--hd-theme-text-muted);
    background: var(--hd-color-bg-secondary, transparent);
    border: 1px dashed var(--hd-color-border);
    border-radius: var(--hd-radius-md);
}

/* Ícono de 32px (tamaño ya lo fija <hd-icon size="32">), sin fondo circular
   de color (HVL §5.5/§6.11) — es neutro, no un estado "activo". */
.hd-empty-state .hd-icon {
    color: var(--hd-theme-text-muted);
    margin-bottom: var(--hd-space-3);
}

.hd-empty-state__message {
    margin: 0;
    font-size: var(--hd-text-base);
}

/* Admite varias acciones en línea (primaria primero). Un estado vacío que
   solo describe el vacío no ayuda a decidir nada: si hay salida, se ofrece
   aquí. En móvil se apilan a ancho completo — dos botones de 44px lado a
   lado no caben cómodos bajo 576px. */
.hd-empty-state__action {
    margin-top: var(--hd-space-4);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--hd-space-2);
    flex-wrap: wrap;
}

@media (max-width: 575.98px) {
    .hd-empty-state__action {
        flex-direction: column;
        align-self: stretch;
    }

    .hd-empty-state__action > * {
        width: 100%;
    }
}