/* =====================================================================
   Regulação — refinamentos de layout · AGENTE A
   Abas cobertas: Painel (dashboard) · Solicitações (requests) · Fila regulada (queue)
   Somente POLIMENTO: espaçamento, alinhamento, consistência de hover/foco,
   responsividade, tipografia e hierarquia. Escopo restrito a #view-regulacao
   e ao conteúdo dessas 3 abas. Sem cores novas nem mudança estrutural.
   Tokens reutilizados do 07.css: roxo #394820/#586d34, borda #eaefe2,
   sombra base rgba(96,40,120,.05-.16). Carrega DEPOIS de 07.css.
   ===================================================================== */

/* ============================ PAINEL (dashboard) ============================ */

/* Barras "Fila por especialidade": anima o preenchimento ao renderizar e
   garante que valores pequenos continuem visualmente perceptíveis. */
#view-regulacao .reg-esp-bar-fill {
  transition: width .5s cubic-bezier(.4, 0, .2, 1);
  min-width: 5px;
}

/* "Fila por prioridade": divisória sutil entre linhas e contagem em coluna
   (números alinhados à direita = leitura mais rápida). */
#view-regulacao .reg-prio-stat {
  padding: 7px 0;
  border-bottom: 1px solid #eef2e6;
}
#view-regulacao .reg-prio-stat:first-child { padding-top: 2px; }
#view-regulacao .reg-prio-stat:last-child { border-bottom: 0; padding-bottom: 2px; }
#view-regulacao .reg-prio-stat-count { min-width: 26px; text-align: right; }

/* KPIs: em telas estreitas (<560px) empilha em 1 coluna e reduz o número
   para não estourar o cartão. */
@media (max-width: 560px) {
  #view-regulacao .reg-kpi-grid { grid-template-columns: 1fr; }
  #view-regulacao .reg-kpi-val { font-size: 28px; }
}

/* ========================= SOLICITAÇÕES (requests) ========================= */

/* Sub-abas: transição suave e foco acessível por teclado (mesma paleta roxa). */
#view-regulacao .reg-subtab {
  transition: background .14s ease, color .14s ease, border-color .14s ease;
}
#view-regulacao .reg-subtab:focus-visible {
  outline: 2px solid #819858;
  outline-offset: 2px;
}

/* Cartão de solicitação: leve elevação no hover (consistente com a fila) e
   acento à esquerda quando selecionado — via inset shadow, sem reflow. */
#view-regulacao .reg-solic-card {
  transition: border-color .14s ease, box-shadow .14s ease, transform .14s ease;
}
#view-regulacao .reg-solic-card:hover { transform: translateY(-1px); }
#view-regulacao .reg-solic-card.is-sel {
  box-shadow: inset 3px 0 0 #586d34, 0 10px 26px rgba(57,72,32,.16);
}

/* Detalhe inline: barra de rolagem fina e valores longos (CNS/telefone)
   quebram sem estourar a coluna de 380px. */
#view-regulacao .reg-detail-scroll {
  scrollbar-width: thin;
  scrollbar-color: #c7d2b5 transparent;
}
#view-regulacao .reg-detail-scroll::-webkit-scrollbar { width: 7px; }
#view-regulacao .reg-detail-scroll::-webkit-scrollbar-thumb {
  background: #d3dcc2;
  border-radius: 6px;
}
#view-regulacao .reg-detail-scroll::-webkit-scrollbar-thumb:hover { background: #b3c298; }
#view-regulacao .reg-detail-info strong { overflow-wrap: anywhere; }

/* Ações do detalhe: altura uniforme entre os botões que quebram linha,
   mantendo ícone + rótulo alinhados verticalmente. */
#view-regulacao .reg-detail-actions .btn {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

/* ========================== FILA REGULADA (queue) ========================== */

/* Linha da fila: hover com elevação/sombra equivalente aos cartões
   (feedback tátil consistente em todo o módulo). */
#view-regulacao .reg-fila-row {
  transition: border-color .14s ease, box-shadow .14s ease, transform .14s ease;
}
#view-regulacao .reg-fila-row:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(57,70,36,.1);
}

/* Responsivo: abaixo de 680px a grade de 6 colunas quebra em 2 linhas —
   identificação (rank + prioridade + paciente) em cima; espera / SLA / score
   embaixo, alinhados à esquerda. Evita estouro horizontal em telas estreitas. */
@media (max-width: 680px) {
  #view-regulacao .reg-fila-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 14px;
  }
  #view-regulacao .reg-fila-pac { flex: 1 1 45%; }
  #view-regulacao .reg-fila-col { text-align: left; }
}