/* Ajustes do portal Emira Pro além do protótipo (escolha de empresa, carregamento e tela inicial). */
.tenants {
  display: grid;
  gap: 8px;
  margin-top: 4px;
}
.tenants button {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 13px 16px;
  border-radius: 16px;
  border: 1px solid var(--ln);
  background: rgb(var(--wh) / 0.05);
  text-align: left;
  color: var(--tx);
  transition: 0.2s;
}
.tenants button:hover {
  border-color: rgba(173, 250, 17, 0.5);
  background: rgba(173, 250, 17, 0.08);
}
.tenants button:after {
  content: '›';
  color: var(--ac);
  font-size: 20px;
  line-height: 1;
}
.boot {
  min-height: 100vh;
  display: grid;
  place-items: center;
  color: var(--mut);
}
.boot i {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 3px solid rgb(var(--wh) / 0.12);
  border-top-color: var(--g);
  animation: spin 0.8s linear infinite;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
.who {
  padding: 10px 12px;
  border-radius: 16px;
  background: rgb(var(--wh) / 0.05);
  border: 1px solid var(--ln);
  font-size: 13px;
  color: var(--mut);
  margin-bottom: 8px;
  overflow: hidden;
}
.who b {
  display: block;
  color: var(--tx);
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.who span {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.kv {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 10px 24px;
}
.kv dt {
  color: var(--mut);
}
.kv dd {
  margin: 0;
  overflow-wrap: anywhere;
}

/* Padrão das grades do portal (classe .rows): linhas de 15px, sem esticar para preencher o cartão. */
.card.grow > .tbl.rows {
  flex: none;
}
.tbl.rows td {
  padding-top: 15px;
  padding-bottom: 15px;
}
.tbl.rows th {
  padding-bottom: 6px;
}
.tbl.rows .av {
  width: 34px;
  height: 34px;
  font-size: 13px;
}

/* Atendimento: a tela ocupa a altura da janela; lista e mensagens rolam cada uma no seu painel
   e o campo de resposta fica fixo embaixo, como no WhatsApp Web. */
.scr.on:has(.chat) {
  height: calc(100vh - 44px);
  min-height: 0;
}
.chat {
  min-height: 0;
  grid-template-rows: minmax(0, 1fr);
}
.chat > #chat-list {
  min-height: 0;
  overflow-y: auto;
}
.chat-panel {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
}
.chat-panel .msgs {
  flex: 1 1 0;
  min-height: 0;
  max-height: none;
  overflow-y: auto;
}
.chat-panel #chat-head,
.chat-panel .send {
  flex: none;
}
@media (max-width: 860px) {
  .scr.on:has(.chat) {
    height: calc(100dvh - 120px);
  }
}