.customers-page {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

.customers-page .app-form__form,
.customers-page .app-form__panel {
  width: 100%;
  max-width: none;
}

.customers-form {
  width: min(1180px, calc(100vw - 2rem));
}

.customers-show__tab.is-active,
.customers-show__tab.is-active:hover {
  color: #0e578f !important;
  border-bottom-color: #1489e5;
  font-weight: 600;
}

/* As abas de cada um dos dois quadros da Ficha Clínica. Mesma gramática das
   abas da barra, num tamanho que cabe na coluna. */
.customers-show__subtab.is-active,
.customers-show__subtab.is-active:hover {
  color: #0e578f !important;
  border-bottom-color: #1489e5;
  font-weight: 600;
}

/* Os dois quadros da Ficha Clínica têm altura DECLARADA, e não herdada do
   conteúdo: qualquer um dos cinco painéis pode cair em qualquer lado, e sem
   altura definida o `min-h-0 flex-1` de dentro nunca encolhe, a rolagem
   interna nunca acontece e uma linha do tempo longa faz a página crescer sem
   fim. Antes a altura vinha do odontograma, que era fixo à direita.

   O piso mantém o mapa de dentes usável num notebook baixo; o teto evita que
   num monitor grande uma lista de três itens fique com 1500px de altura. Os
   22rem são medidos, e não estimados: é o que a navbar, o cabeçalho do paciente
   e as duas fileiras de abas da ficha ocupam acima dos quadros. */
.clinical-slot {
  max-height: 75vh;
}

@media (min-width: 80rem) {
  .clinical-slot {
    height: clamp(34rem, calc(100vh - 22rem), 54rem);
    max-height: none;
  }
}

/* Lexxy markdown content renders inside `.lexxy-content` with a hardcoded
   dark ink color. Soften it inside the logged area to match the project's
   slate-600 text tone. */
.logged-ui .lexxy-content {
  --lexxy-color-ink: #334155; /* slate-700 */
}

/* O "+" do disclosure de informações adicionais vira "×" ao abrir. O
   details.css do projeto está inteiramente comentado, então o marcador é este
   ícone e a rotação mora aqui. */
.ui-disclosure-icon {
  transition: transform 200ms linear;
}

details[open] > summary .ui-disclosure-icon {
  transform: rotate(45deg);
}