/* ============================================================================
   LINHA · Atendimento clínico da unidade (units/02): barra de comando, quem
   está em atendimento, números, filtros e a fila em colunas por etapa.
   Cor de risco (Manchester) só na marca do cartão e no ponto do filtro.
   ============================================================================ */

.cl-vercomo{
  display:flex; align-items:center; gap:var(--l-e3); margin:0; padding:10px var(--l-e4);
  border-radius:var(--l-raio-2); background:var(--l-atencao-fundo); color:var(--l-atencao); font-size:var(--l-t-peq);
}
.cl-vercomo span{ flex:1 }
.cl-vercomo svg{ width:16px; height:16px; flex:none }

/* barra de comando */
.cl-sala input{ width:150px; min-width:0 }
.cl-saved-msg{ font-size:var(--l-t-mini); color:var(--l-ok); opacity:0; transition:opacity var(--l-rapido) }
.cl-saved-msg.show{ opacity:1 }
.cl-save.saved{ color:var(--l-ok) }
.cl-more{ position:relative }
.cl-menu{
  position:absolute; right:0; top:calc(100% + 6px); z-index:40; display:none; flex-direction:column; min-width:260px; padding:var(--l-e1);
  background:var(--l-sup); border:1px solid var(--l-borda); border-radius:var(--l-raio-3); box-shadow:var(--l-sombra-flutua);
}
.cl-more.open .cl-menu{ display:flex }
.cl-menu > button{
  display:flex; align-items:center; gap:10px; width:100%; height:36px; padding:0 12px; border:0; border-radius:var(--l-raio-2);
  background:none; color:var(--l-texto); font-size:var(--l-t-corpo); text-align:left;
}
.cl-menu > button:hover{ background:var(--l-sup-3) }
.cl-menu > button svg{ width:16px; height:16px; color:var(--l-texto-3) }
.cl-menu > button .l-nota{ margin-left:auto }
.cl-menu-fld{ display:flex; flex-direction:column; gap:4px; margin-top:var(--l-e1); padding:var(--l-e3) 12px var(--l-e2); border-top:1px solid var(--l-fio) }
.cl-menu-fld label{ font-size:var(--l-t-mini); color:var(--l-texto-3) }

/* em atendimento agora */
.cl-now-empty{ margin:0; padding:var(--l-e5); color:var(--l-texto-3) }
.cl-now-card{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:var(--l-e3) var(--l-e4); align-items:center; padding:var(--l-e4) var(--l-e5) }
.cl-now-id b{ font-size:var(--l-t-med); font-weight:600 }
.cl-now-meta{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--l-e2) var(--l-e3); margin-top:4px; font-size:var(--l-t-peq); color:var(--l-texto-2) }
.cl-timer{ display:inline-flex; align-items:center; gap:4px; color:var(--l-texto-3) }
.cl-timer svg{ width:13px; height:13px }
.cl-now-acts{ grid-column:1 / -1; display:flex; flex-wrap:wrap; gap:var(--l-e2) }
.cl-rasc-tag{ margin-left:6px; padding:1px 6px; border-radius:var(--l-raio-1); background:var(--l-atencao-fundo); color:var(--l-atencao); font-size:var(--l-t-mini); font-weight:500 }

/* números e filtros */
.cl-stats .is-alerta b{ color:var(--l-erro) }
.cl-filters .l-seg button{ display:inline-flex; align-items:center; gap:6px }
.cl-risco-pt{ width:8px; height:8px; border-radius:50%; flex:none }
.cl-risco-pt.r-vermelho{ background:var(--l-r-vermelho) }
.cl-risco-pt.r-laranja{ background:var(--l-r-laranja) }
.cl-risco-pt.r-amarelo{ background:var(--l-r-amarelo) }
.cl-risco-pt.r-verde{ background:var(--l-r-verde) }
.cl-risco-pt.r-azul{ background:var(--l-r-azul) }

/* fila: uma coluna por etapa do fluxo */
.cl-cols{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:var(--l-e4); align-items:start }
.cl-cols.cl-cols-4{ grid-template-columns:repeat(4, minmax(0,1fr)) }
.cl-col{ display:flex; flex-direction:column; min-width:0; background:var(--l-sup-2); border:1px solid var(--l-borda); border-radius:var(--l-raio-3) }
.cl-col-head{ display:flex; align-items:center; gap:var(--l-e2); padding:var(--l-e3) var(--l-e4); border-bottom:1px solid var(--l-fio) }
.cl-col-head h3{ flex:1; font-size:var(--l-t-corpo); font-weight:600 }
.cl-step{ display:grid; place-items:center; width:22px; height:22px; border-radius:50%; background:var(--l-sup-3); color:var(--l-texto-2); font-size:var(--l-t-mini); font-weight:600 }
.cl-count{ min-width:24px; padding:0 8px; border-radius:var(--l-raio-1); background:var(--l-sup); text-align:center; font-size:var(--l-t-peq); font-weight:600; font-variant-numeric:tabular-nums }
.cl-col-regra{ margin:0; padding:var(--l-e2) var(--l-e4) 0 }
.cl-col-body{ display:flex; flex-direction:column; gap:var(--l-e2); padding:var(--l-e3) }
.cl-empty{ margin:0; padding:var(--l-e6) var(--l-e3); text-align:center; font-size:var(--l-t-peq); color:var(--l-texto-3) }

/* cartão do paciente: barra de risco à esquerda */
.cl-card{
  position:relative; display:flex; flex-direction:column; gap:4px; padding:var(--l-e3) var(--l-e3) var(--l-e3) calc(var(--l-e3) + 4px);
  background:var(--l-sup); border:1px solid var(--l-borda); border-radius:var(--l-raio-2); overflow:hidden;
}
.cl-card::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--l-borda) }
.cl-card.r0::before{ background:var(--l-r-vermelho) }
.cl-card.r1::before{ background:var(--l-r-laranja) }
.cl-card.r2::before{ background:var(--l-r-amarelo) }
.cl-card.r3::before{ background:var(--l-r-verde) }
.cl-card.r4::before{ background:var(--l-r-azul) }
.cl-card.next{ border-color:var(--l-marca); box-shadow:0 0 0 1px var(--l-marca) }
.cl-next-flag{ align-self:flex-start; font-size:var(--l-t-mini); font-weight:600; color:var(--l-marca-tinta); text-transform:uppercase; letter-spacing:.04em }
.cl-card-top{ display:flex; align-items:center; gap:var(--l-e2); min-width:0 }
.cl-card-top .av{ width:28px; height:28px; font-size:11px }
.cl-card-top b{ flex:1; min-width:0; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.cl-sem-nome{ color:var(--l-texto-3); font-style:italic }
.cl-tag{ font-style:normal; padding:1px 6px; border-radius:var(--l-raio-1); background:var(--l-sup-3); color:var(--l-texto-2); font-size:var(--l-t-mini); font-weight:500; white-space:nowrap }
.cl-tag.prio{ background:var(--l-atencao-fundo); color:var(--l-atencao) }
.cl-tag.mine{ background:var(--l-marca-suave); color:var(--l-marca-tinta) }
.cl-line{ display:flex; flex-wrap:wrap; align-items:center; gap:2px 6px; font-size:var(--l-t-peq); color:var(--l-texto-3) }
.cl-line svg{ width:12px; height:12px }
.cl-dot{ width:3px; height:3px; border-radius:50%; background:var(--l-texto-3) }
.cl-card-acts{ display:flex; flex-wrap:wrap; gap:var(--l-e2); margin-top:var(--l-e2) }
.cl-card-acts .btn{ height:30px; padding:0 10px; font-size:var(--l-t-peq) }
.cl-rodape{ text-align:center }

/* modais clínicos */
.cl-modal{ display:flex; flex-direction:column; gap:var(--l-e3) }
.cl-modal > h3{ font-size:var(--l-t-titulo); font-weight:600; padding-right:32px }
.cl-fora-aviso{ padding:var(--l-e3) var(--l-e4); border-radius:var(--l-raio-2); background:var(--l-atencao-fundo); color:var(--l-atencao); font-size:var(--l-t-peq) }
.cl-fora-aviso b{ display:block; color:inherit }
.cl-cons-res{ display:flex; flex-direction:column; gap:var(--l-e2); max-height:55vh; overflow:auto }

@media (max-width:1100px){
  .cl-cols, .cl-cols.cl-cols-4{ grid-template-columns:1fr }
}
.un-clinico{ display:flex; flex-direction:column; gap:var(--l-e4) }

/* ============================================================================
   Ciclo do Atendimento (units/06): observação, farmácia, enfermaria,
   executante, retornos e gestão. Mesma casca: resumo, quadros e plantão.
   ============================================================================ */
.fx-live{ align-items:center }
.fx-live > .l-nota:first-child{ margin:0; color:var(--l-texto-2) }
.fx-body{ display:flex; flex-direction:column; gap:var(--l-e4) }
.fx-plantao:empty{ display:none }
.fx-plantao{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--l-e3); padding:var(--l-e3) var(--l-e4); border:1px solid var(--l-borda); border-radius:var(--l-raio-2); background:var(--l-sup-2) }
.fx-grid-3{ display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:var(--l-e4); align-items:start }
.l-bloco > .fx-grid-3{ padding:var(--l-e4) var(--l-e5) var(--l-e5) }
.fx-cell{ display:flex; flex-direction:column; gap:var(--l-e2); min-width:0 }
.fx-cell > h3{ font-size:var(--l-t-peq); font-weight:600; color:var(--l-texto-2) }

/* quadros em lista */
.fx-quadro.fx-lider{ border-color:var(--l-marca) }
.fx-list{ list-style:none; margin:0; padding:0 }
.fx-list > li{ display:flex; flex-direction:column; gap:4px; padding:12px var(--l-e5); border-top:1px solid var(--l-fio) }
.fx-list > li:first-child{ border-top:0 }
.fx-list > li:has(> .fx-li-acao){ flex-direction:row-reverse; align-items:center; justify-content:space-between; gap:var(--l-e4) }
.fx-list > li.fx-now{ background:var(--l-marca-suave) }
.fx-li-txt{ display:flex; flex-direction:column; gap:4px; min-width:0; flex:1 }
.fx-li-acao{ display:flex; flex-wrap:wrap; gap:var(--l-e2); flex:none }
.fx-quadro-foot{ padding:var(--l-e2) var(--l-e5) var(--l-e4) }

/* tabelas de decisão (observação, farmácia) */
.fx-table td{ vertical-align:top }
.fx-table tr.fx-late, .fx-table tr.fx-now{ background:var(--l-atencao-fundo) }
.fx-decide{ display:flex; flex-direction:column; align-items:flex-start; gap:var(--l-e2); min-width:180px }
.fx-sinal{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--l-e2) }
.fx-flag{ font-size:var(--l-t-mini); font-weight:600; color:var(--l-erro) }
.fx-pend{ display:flex; flex-wrap:wrap; gap:var(--l-e2) }
.fx-chip-go{ height:auto; padding:2px 4px }
.fx-excecao{ font-size:var(--l-t-peq); color:var(--l-texto-2) }
.fx-item-h{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--l-e2) }
.fx-note{ color:var(--l-texto-3) }
.fx-dcheck{ display:flex; flex-direction:column; gap:4px; padding:var(--l-e3) var(--l-e4); border:1px solid var(--l-borda); border-radius:var(--l-raio-2); background:var(--l-sup-2) }
.fx-dcheck-hint{ font-size:var(--l-t-mini); color:var(--l-atencao) }

/* distribuição (gestão): rótulo, número e barra */
.fx-dist{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:var(--l-e2) }
.fx-dist li{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:2px var(--l-e3); align-items:baseline; font-size:var(--l-t-peq) }
.fx-dist .k-bar{ grid-column:1 / -1; display:block !important }
.fx-dist-k{ color:var(--l-texto-2) }
.fx-dist-n{ font-variant-numeric:tabular-nums }
.fx-dist-n em{ font-style:normal; font-weight:400; color:var(--l-texto-3) }

/* retornos ao médico */
.ret-list{ display:grid; grid-template-columns:repeat(auto-fill, minmax(340px, 1fr)); gap:var(--l-e4) }
.ret-card{ display:flex; flex-direction:column; gap:var(--l-e3); padding:var(--l-e4) var(--l-e5); border-left:4px solid var(--l-ok) }
.ret-card.ret-neg{ border-left-color:var(--l-erro) }
.ret-critico{ margin:0; font-weight:600 }
.ret-body{ display:flex; flex-direction:column; gap:4px; font-size:var(--l-t-peq) }
.ret-crit{ color:var(--l-erro); font-weight:600 }
.ret-just{ color:var(--l-texto-2) }

/* evoluções, solicitações e pedido da farmácia */
.cl-esq{ margin-right:auto }
.l-fim > .cl-esq{ margin-right:auto }
.cl-historico{ display:flex; flex-direction:column; gap:var(--l-e2); padding-top:var(--l-e3); border-top:1px solid var(--l-fio) }
.cl-rolagem{ display:flex; flex-direction:column; gap:var(--l-e2); max-height:320px; overflow:auto }
.cl-registro{ display:flex; flex-direction:column; gap:4px; padding:var(--l-e2) var(--l-e3); border:1px solid var(--l-fio); border-radius:var(--l-raio-2) }
.cl-registro.is-enf{ background:var(--l-ok-fundo) }
.cl-registro-cab{ display:flex; justify-content:space-between; align-items:center; gap:var(--l-e2); font-size:var(--l-t-peq) }
.cl-ok{ color:var(--l-ok) }
.cl-acoes{ display:flex; flex-wrap:wrap; gap:var(--l-e2) }
.cl-saldo{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--l-e2); margin:4px 0 }
.cl-erro{ padding:var(--l-e3); border:1px solid var(--l-erro); border-radius:var(--l-raio-2); background:var(--l-erro-fundo); color:var(--l-erro); font-size:var(--l-t-peq) }
.cl-iframe{ display:block; width:100%; height:72vh; border:0 }
#ubs-main-content > #view-ubs-clinical.embedded-in-shell{ padding:var(--l-e6) var(--l-e10) var(--l-e12) !important }