/* Praxis Dialyse · Painel ao vivo e Passômetro (dialise-hosp-painel.js). Prefixo hp-. */
.hp { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.hp-cab { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; align-items: flex-end; }
.hp-cab h2 { margin: 0; }
.hp-cab p { margin: 2px 0 0; }
.hp-cab .ferr { display: flex; flex-wrap: wrap; gap: 8px; }
.hp-kpis { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.hp-kpi-i { font-style: normal; font-size: .8rem; font-weight: 500; color: var(--aco); font-family: var(--f-txt); }
.hp-aviso { margin: 0; }

/* hospital e leitos */
.hp-hosp { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.hp-hosp-cab { display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: baseline; }
.hp-hosp-cab h3 { margin: 0; font-size: 1.1rem; }
.hp-hosp-cab > span { font-size: .86rem; }
.hp-plantao { font-size: .86rem; }
.hp-nada { margin: 0; }
.hp-leitos { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(270px, 100%), 1fr)); gap: 10px; }
.hp-leito { all: unset; box-sizing: border-box; display: flex; flex-direction: column; gap: 5px; padding: 11px 13px; border: 1px solid var(--linha); border-left: 6px solid var(--px); border-radius: 10px; background: var(--sup, #fff); cursor: pointer; min-width: 0; font-size: .9rem; color: var(--tinta); }
.hp-leito:hover, .hp-leito:focus-visible { box-shadow: var(--sombra-l, 0 2px 8px rgba(0,0,0,.08)); outline: 2px solid transparent; }
.hp-leito:focus-visible { outline: 2px solid var(--px); outline-offset: 2px; }
.hp-c-ok { border-left-color: var(--ok); }
.hp-c-at { border-left-color: var(--at); background: color-mix(in srgb, var(--at-s, #fff7e0) 45%, var(--sup, #fff)); }
.hp-c-mal { border-left-color: var(--mal); background: color-mix(in srgb, var(--mal-s, #fde8e8) 55%, var(--sup, #fff)); }
.hp-c-px { border-left-color: var(--px); }
.hp-leito-cab { display: flex; justify-content: space-between; gap: 8px; align-items: flex-start; }
.hp-leito-pac { font-size: 1rem; overflow-wrap: anywhere; }
.hp-leito-cab .pill { flex: none; }
.hp-leito-loc { color: var(--aco); font-size: .84rem; }
.hp-leito-proc { font-weight: 600; }
.hp-leito-info { display: flex; flex-direction: column; gap: 2px; font-size: .86rem; }
.hp-tempo small { color: var(--aco); font-size: .8rem; }
.hp-barra { height: 9px; border-radius: 99px; background: var(--linha); overflow: hidden; margin: 2px 0 3px; }
.hp-barra i { display: block; height: 100%; background: var(--ok); border-radius: 99px; }
.hp-c-mal .hp-barra i { background: var(--mal); }
.hp-c-at .hp-barra i { background: var(--at); }
.hp-als { display: flex; flex-wrap: wrap; gap: 4px; }
.hp-al { display: inline-block; font-size: .78rem; font-weight: 600; padding: 2px 8px; border-radius: 99px; }
.hp-al-mal { background: var(--mal-s, #fde8e8); color: var(--mal, #b42318); }
.hp-al-at { background: var(--at-s, #fff4d6); color: var(--at, #8a5a00); }
.hp-v-mal { color: var(--mal); font-weight: 700; }
.hp-fin summary, .hp-gantt summary { cursor: pointer; font-weight: 600; font-size: .92rem; }
.hp-fin .sp-lista li { cursor: pointer; }

/* linha do tempo */
.hp-g-grade { margin-top: 8px; }
.hp-g-eixo, .hp-g-linha, .hp-g-agora-cx { display: grid; grid-template-columns: 170px 1fr; gap: 8px; align-items: center; }
.hp-g-corpo { position: relative; }
.hp-g-agora-cx { position: absolute; inset: 0; pointer-events: none; }
.hp-g-agora-cx .hp-g-trilho { height: 100%; background: none; }
.hp-g-nome { min-width: 0; display: flex; flex-direction: column; font-size: .82rem; line-height: 1.2; }
.hp-g-nome b, .hp-g-nome small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hp-g-nome small { color: var(--aco); }
.hp-g-trilho { position: relative; height: 22px; background: linear-gradient(90deg, var(--linha) 1px, transparent 1px) 0 0 / calc(100% / var(--hp-n, 14)) 100% repeat-x; border-radius: 4px; }
.hp-g-marcas { background: none; height: 16px; font-size: .72rem; color: var(--aco); }
.hp-g-marcas span { position: absolute; transform: translateX(-50%); white-space: nowrap; }
.hp-g-marcas span:first-child { transform: none; }
.hp-g-linha { padding: 3px 0; border-top: 1px dashed var(--linha); cursor: pointer; }
.hp-g-linha:hover { background: var(--px-suave); }
.hp-g-bar { position: absolute; top: 3px; bottom: 3px; border-radius: 4px; background: var(--px); overflow: hidden; }
.hp-g-bar i { display: block; height: 100%; background: rgba(0,0,0,.18); }
.hp-g-em_andamento, .hp-g-k.hp-g-em_andamento { background: var(--ok); }
.hp-g-finalizado, .hp-g-k.hp-g-finalizado { background: #8a8aa8; }
.hp-g-suspenso, .hp-g-k.hp-g-suspenso { background: var(--mal); }
.hp-g-assumido { background: var(--px); }
.hp-g-devolvido, .hp-g-prescrito { background: var(--at); }
.hp-g-plan, .hp-g-k.hp-g-plan { background: transparent !important; border: 2px dashed var(--px); }
.hp-g-semhora { font-size: .76rem; color: var(--at); font-weight: 600; padding-left: 4px; line-height: 22px; }
.hp-g-agora { position: absolute; top: 0; bottom: 0; width: 2px; background: var(--mal); }
.hp-g-leg { font-size: .76rem; margin: 6px 0 0; display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; }
.hp-g-k { display: inline-block; width: 18px; height: 10px; border-radius: 3px; margin-right: 3px; vertical-align: -1px; }
.hp-g-lista { display: none; list-style: none; margin: 8px 0 0; padding: 0; }
.hp-g-lista li { display: grid; grid-template-columns: 92px 1fr auto; gap: 8px; align-items: center; padding: 7px 0; border-top: 1px solid var(--linha); cursor: pointer; font-size: .86rem; }
.hp-g-lista li small { display: block; color: var(--aco); }
.hp-g-hora { font-variant-numeric: tabular-nums; font-weight: 600; }

/* gaveta */
.hp-ficha li span { color: var(--aco); }
.hp-h3 { font-size: .98rem; margin: 14px 0 6px; }
.hp-exp { padding-left: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; font-size: .9rem; }
.hp-exp .hp-al { margin-right: 6px; }

/* Modo TV */
.hp-tv { position: fixed; inset: 0; z-index: 90; background: var(--bg, #f0f0f8); overflow: auto; padding: 18px 22px; display: flex; flex-direction: column; gap: 14px; font-size: 1.25rem; }
.hp-tv-cab { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.hp-tv-cab b { font-size: 2rem; font-family: var(--f-tit); display: block; }
.hp-tv-cab small { color: var(--aco); font-size: 1rem; }
.hp-tv-hora { font-size: 2.4rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.hp-tv-sair { border: 1px solid var(--linha); background: var(--sup, #fff); border-radius: 10px; padding: 10px 16px; font-size: 1rem; cursor: pointer; }
.hp-tv .sp-kpi b { font-size: 2rem; }
.hp-tv .sp-kpi span { font-size: .9rem; }
.hp-tv .hp-leitos { grid-template-columns: repeat(auto-fill, minmax(min(380px, 100%), 1fr)); gap: 14px; }
.hp-tv .hp-leito { font-size: 1.15rem; padding: 16px 18px; border-left-width: 10px; }
.hp-tv .hp-leito-pac { font-size: 1.4rem; }
.hp-tv .hp-leito-info, .hp-tv .hp-leito-loc { font-size: 1.05rem; }
.hp-tv .hp-al { font-size: 1rem; }
.hp-tv .hp-barra { height: 14px; }
.hp-tv .hp-hosp-cab h3 { display: none; }

/* Passômetro */
.hp-ps-sel { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: 10px; }
.hp-ps-sel .campo, .hp-hist-f .campo { margin: 0; }
.hp-ps-grade { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.hp-ps-grade .cx h3 { margin: 0 0 8px; font-size: 1.02rem; }
.hp-ps-grade .cx h3 small { font-weight: 400; font-size: .8rem; }
.hp-setor { margin: 12px 0 4px; font-size: .84rem; text-transform: uppercase; letter-spacing: .05em; color: var(--aco); }
.hp-foto { list-style: none; margin: 0; padding: 0; }
.hp-foto li { display: grid; grid-template-columns: 130px minmax(0, 1fr) auto; gap: 10px; align-items: start; padding: 8px 0; border-top: 1px solid var(--linha); }
.hp-foto li.hp-fora { opacity: .45; }
.hp-foto-l { display: flex; flex-direction: column; gap: 3px; align-items: flex-start; font-size: .86rem; }
.hp-foto-p { display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: .9rem; }
.hp-foto-p small { color: var(--tinta); opacity: .82; font-size: .84rem; overflow-wrap: anywhere; }
.hp-foto-p textarea { width: 100%; font-size: .86rem; box-sizing: border-box; }
.hp-foto-a { display: flex; flex-direction: column; gap: 4px; align-items: flex-end; }
.hp-chk { font-size: .8rem; display: flex; gap: 4px; align-items: center; white-space: nowrap; }
.hp-outros { list-style: none; margin: 0; padding: 0; }
.hp-outros li { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 10px; padding: 6px 0; border-top: 1px solid var(--linha); font-size: .88rem; }
.hp-outros li span { overflow-wrap: anywhere; }
.hp-lab { display: block; font-weight: 600; font-size: .88rem; margin: 10px 0 4px; }
.hp-pend, .hp-pend-l { list-style: none; margin: 0 0 6px; padding: 0; }
.hp-pend li { display: flex; justify-content: space-between; gap: 8px; align-items: center; padding: 5px 0; border-top: 1px solid var(--linha); font-size: .9rem; }
.hp-pend li span { min-width: 0; overflow-wrap: anywhere; }
.hp-pend-l li { padding: 3px 0; font-size: .92rem; }
.hp-pend-novo { display: flex; gap: 6px; }
.hp-pend-novo input { flex: 1; min-width: 0; }
.hp-sug { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; align-items: center; }
.hp-sug > small { flex-basis: 100%; }
.hp-chip { border: 1px dashed var(--px); background: var(--px-suave); color: var(--tinta); border-radius: 10px; padding: 5px 9px; font-size: .82rem; text-align: left; cursor: pointer; display: flex; flex-direction: column; max-width: 100%; overflow-wrap: anywhere; }
.hp-chip small { color: var(--aco); font-size: .72rem; }
.hp-pass { display: flex; flex-direction: column; gap: 8px; }
.hp-pass-dest { border: 2px solid var(--px); }
.hp-pass-cab { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; align-items: flex-start; }
.hp-pass-cab small { display: block; color: var(--aco); font-size: .84rem; }
.hp-pass-txt { white-space: pre-wrap; margin: 0; padding: 8px 10px; background: var(--px-suave); border-radius: 8px; overflow-wrap: anywhere; }
.hp-pass details summary { cursor: pointer; font-weight: 600; font-size: .9rem; }
.hp-pass p.mut { margin: 0; }
.hp-hist-f { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
.hp-hist-f .campo { flex: 1 1 180px; }

@media (max-width: 900px) {
  .hp-ps-grade { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .hp-g-grade { display: none; }
  .hp-g-lista { display: block; }
  .hp-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hp-foto li { grid-template-columns: minmax(0, 1fr) auto; }
  .hp-foto-l { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 6px; }
  .hp-outros li { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .hp-g-lista li { grid-template-columns: 78px minmax(0, 1fr); }
  .hp-g-lista li .pill { grid-column: 2; justify-self: start; }
  .hp-tv { font-size: 1rem; padding: 12px; }
  .hp-tv-cab b { font-size: 1.3rem; }
  .hp-tv-hora { font-size: 1.4rem; }
}
@media print { .hp-cab .ferr, .hp-filtro, .hp-ps-sel, .hp .sp-abas { display: none !important; } }
html.hp-tv-on, html.hp-tv-on body { overflow: hidden !important; }