/* ==========================================================================
   empty-state.css: Estado vacío para listas y páginas completas
   ========================================================================== */

.empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--lib-space-3);
  padding: var(--lib-space-12) var(--lib-space-6);
  text-align: center;
}

.empty-state__icon {
  display: grid;
  place-items: center;
  width: 4.5rem;
  height: 4.5rem;
  margin-bottom: var(--lib-space-2);
  border-radius: var(--lib-radius-pill);
  background-color: var(--lib-primary-50);
  color: var(--lib-primary-500);
}

.empty-state__icon svg {
  width: 2.25rem;
  height: 2.25rem;
}

.empty-state__title {
  margin-bottom: 0;
  font-size: 1.25rem;
  font-weight: var(--lib-font-weight-semibold);
}

.empty-state__text {
  max-width: 30rem;
  margin-bottom: var(--lib-space-2);
  color: var(--lib-text-muted);
  font-size: var(--lib-font-size-sm);
}

/* Variante a pantalla completa (páginas de error) */
.empty-state--full {
  min-height: calc(100dvh - var(--lib-topbar-height) - 3rem);
}

.empty-state__code {
  font-size: clamp(4rem, 14vw, 8rem);
  font-weight: var(--lib-font-weight-bold);
  line-height: 1;
  letter-spacing: -0.04em;
  color: var(--lib-primary-500);
}

/* Variantes de color del código de error */
.empty-state__code--danger {
  color: var(--lib-danger-500);
}

.empty-state__code--warning {
  color: var(--lib-warning-500);
}