/* Entrada do pedido — o formulário do papel que chegou ao balcão, e os
   controles que só existem nele: a lista de exames do mesmo pedido, a foto da
   guia e os exames irmãos na hora de marcar. */

.entry-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 18px 24px;

  & .full { grid-column: 1 / -1; }
}

@media (max-width: 40rem) {
  .entry-grid { grid-template-columns: 1fr; }
}

/* Um pedido, N exames — cada item é um combobox com o seu botão de remover. */
.exam-list { display: flex; flex-direction: column; gap: 8px; }

.exam-item {
  display: flex; gap: 8px; align-items: center;

  & :where(.combo) { flex: 1; }
}

/* As duas ações moram na própria linha, no tamanho do campo ao lado: tirar
   esta linha e acrescentar outra. Não há botão solto embaixo da lista. */
.exam-remove, .exam-add {
  display: inline-flex; align-items: center; justify-content: center;
  flex: none; border: 0; cursor: pointer; border-radius: var(--r);
  width: 34px; height: 34px; font-size: 16px; line-height: 1;
}

.exam-remove {
  color: var(--ink-faint); background: var(--surface-2);

  &:hover { color: var(--urgent); background: var(--urgent-soft); }
}

.exam-add {
  color: var(--ok); background: var(--ok-soft);

  &:hover { color: var(--accent-ink); background: var(--ok); }
}

/* Foto da guia e PDF da clínica — alvo de arrastar, não campo de texto.
   Sem arquivo, o alvo é vermelho: o papel que falta é uma pendência, e é o
   único outro uso do vermelho no app fora o prazo. */
.filepick {
  display: block;
  border: 1px dashed var(--urgent); border-radius: var(--r);
  padding: 18px; text-align: center; font-size: 13px; color: var(--urgent); cursor: pointer;

  &:hover { border-color: var(--accent); color: var(--accent); }
}

/* escolhido: a linha tracejada fecha e vira a borda de um campo preenchido */
.filepick.has-file { border-style: solid; border-color: var(--accent); color: var(--accent); }

/* Variante ícone — para o anexo secundário: um clipe no lugar da faixa
   tracejada, com o nome do arquivo ao lado depois de escolhido. O vermelho
   continua dizendo que o papel ainda não chegou. */
.filepick--icon {
  display: inline-flex; align-items: center; gap: 8px;
  border: 0; padding: 0; text-align: left;
  /* a mesma altura dos controles de uma linha (a conta está em inputs.css), e
     o mesmo corpo de letra para o 1lh bater: assim o clipe assenta no meio da
     faixa do campo vizinho em vez de subir para o topo da célula */
  font-size: 14.5px; line-height: normal; block-size: calc(1lh + 2 * 9px + 2 * 1px);

  & .fname { font-size: 13px; overflow-wrap: anywhere; }
}

.filepick--icon:where(:has(.has-file)) { color: var(--accent); }

/* Exames irmãos do mesmo pedido — o trilho à esquerda liga os irmãos ao
   pedido. Desmarcar avisa, na própria linha, que aquele fica pendente. */
.sibling-list {
  display: flex; flex-direction: column; gap: 6px;
  margin-left: 2px; padding-left: 16px; border-left: 2px solid var(--line-strong);
}

.sibling-row {
  display: grid; grid-template-columns: 20px auto 1fr; align-items: center; gap: 10px;
  cursor: pointer; background: var(--surface-2); border-radius: var(--r); padding: 8px 12px;

  & input { accent-color: var(--accent); width: 16px; height: 16px; margin: 0; }

  & .sibling-name { font-size: 14px; font-weight: 600; white-space: nowrap; }

  & .sibling-hint { font-size: 12.5px; color: var(--ink-muted); }

  & .sibling-hint--split { display: none; color: var(--warn); font-weight: 600; }

  /* a consequência de desmarcar se mostra sozinha, sem JS */
  &:has(input:not(:checked)) {
    background: var(--warn-soft);

    & .sibling-hint--with { display: none; }
    & .sibling-hint--split { display: inline; }
  }
}