/* V5.5: lista compacta, priorizando telas estreitas como o Z Fold fechado. */
.clients-empty {
  padding: 42px;
  text-align: center;
  color: var(--muted);
}

.pill.status-empty {
  background: #29313e;
  color: #b7c2cf;
}

@media (max-width: 720px) {
  .client {
    grid-template-columns: 34px minmax(0, 1fr) auto;
    gap: 10px;
    padding: 12px 13px;
    align-items: start;
  }

  .client .avatar {
    width: 34px;
    height: 34px;
    font-size: 0.86rem;
  }

  .client-main {
    min-width: 0;
    gap: 2px;
  }

  .client-main strong,
  .client-main small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .client-main small {
    font-size: 0.72rem;
  }

  .client-meta {
    grid-column: 2;
    align-items: flex-start;
    gap: 3px;
    margin-top: 3px;
    min-width: 0;
  }

  .client-meta small {
    font-size: 0.7rem;
  }

  .client-meta .pill {
    padding: 3px 7px;
    font-size: 0.66rem;
  }

  .chev {
    grid-column: 3;
    grid-row: 1 / 3;
    align-self: center;
    font-size: 1.35rem;
  }
}

@media (max-width: 420px) {
  .app {
    padding: 20px 10px 24px;
  }

  .clients {
    border-radius: 12px;
  }

  .client {
    padding: 11px 10px;
    gap: 9px;
  }

  .client-main small {
    max-width: calc(100vw - 92px);
  }
}
