/* ===========================================================================
   CARRO DE URGÊNCIA — botão flutuante + gaveta inferior + liturgia realista.
   =========================================================================== */

/* Botão flutuante (acima da barra de controlos) */
.fm-carro-btn {
  position: fixed; left: 50%; transform: translateX(-50%);
  bottom: calc(76px + env(safe-area-inset-bottom, 0px)); z-index: 70;
  display: inline-flex; align-items: center; gap: 9px;
  padding: 11px 20px; border-radius: 999px; cursor: pointer;
  font-size: 14.5px; font-weight: 600; color: var(--text-hi, #ECF1F8);
  background: rgba(14,19,27,0.94); border: 1px solid var(--line-strong, #232c38);
  backdrop-filter: blur(10px); box-shadow: 0 8px 28px rgba(0,0,0,0.4);
  transition: transform .15s, border-color .2s, background .2s;
}
.fm-carro-btn .fm-carro-ico { font-size: 18px; }
.fm-carro-btn.trancado { opacity: .72; }
.fm-carro-btn.trancado .fm-carro-txt { color: var(--text-mid, #aeb9c8); }
.fm-carro-btn.libertado {
  border-color: var(--accent, #00E6A0); color: var(--accent, #00E6A0);
  animation: carroPulso 1.8s ease-in-out infinite;
}
.fm-carro-btn.libertado .fm-carro-estado { color: var(--accent, #00E6A0); }
.fm-carro-btn:active { transform: translateX(-50%) scale(0.97); }
@keyframes carroPulso {
  0%,100% { box-shadow: 0 8px 28px rgba(0,0,0,0.4), 0 0 0 0 rgba(0,230,160,0.5); }
  55%     { box-shadow: 0 8px 28px rgba(0,0,0,0.4), 0 0 0 10px rgba(0,230,160,0); }
}

/* Gaveta inferior — MODO SPLIT: o carro ocupa só a parte de baixo do ecrã e o
   monitor (ritmo + sinais vitais) encolhe para cima, ficando sempre visível.
   Antes a gaveta cobria o ecrã todo e tapava o traçado — clinicamente errado. */
:root { --carro-h: 0px; }
body.carro-aberto { --carro-h: min(46dvh, 380px); }
body.carro-aberto .fm-layout { height: calc(100dvh - var(--carro-h)); }
body.carro-aberto .fm-carro-btn { display: none; }   /* o cartão substitui o botão */

/* Telemóvel deitado: o botão do carro recua para junto ao rodapé, para nunca
   ficar por cima do traçado (o monitor é mais baixo em landscape). */
@media (orientation: landscape) and (max-height: 560px) {
  .fm-carro-btn { bottom: calc(8px + env(safe-area-inset-bottom, 0px)); padding: 8px 16px; font-size: 13.5px; }
  .fm-carro-btn .fm-carro-ico { font-size: 16px; }
}

.fm-carro-gaveta {
  position: fixed; left: 0; right: 0; bottom: 0; top: auto;
  height: var(--carro-h, 46dvh); z-index: 120;
  display: flex; align-items: flex-end; justify-content: center;
  background: transparent;            /* NÃO escurece o monitor por cima */
  pointer-events: none;               /* só o cartão recebe toques */
}
.fm-carro-gaveta.aberta { opacity: 1; }
.fm-carro-cartao {
  width: 100%; max-width: 640px; height: 100%; max-height: 100%; overflow-y: auto;
  pointer-events: auto;
  background: var(--surface-1, #0E131B); border: 1px solid var(--line-strong, #232c38);
  border-bottom: none; border-radius: 20px 20px 0 0; padding: 14px 18px calc(16px + env(safe-area-inset-bottom,0px));
  box-shadow: 0 -18px 40px rgba(0,0,0,0.45);
  transform: translateY(100%); transition: transform .3s cubic-bezier(.2,.8,.2,1);
}
.fm-carro-gaveta.aberta .fm-carro-cartao { transform: translateY(0); }
.fm-carro-topo { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.fm-carro-topo h3 { margin: 0; font-size: 19px; color: var(--text-hi, #ECF1F8); }
.fm-carro-fechar {
  width: 40px; height: 40px; display: grid; place-items: center; cursor: pointer;
  background: var(--surface-2, #161c26); border: 1px solid var(--line-strong, #232c38);
  border-radius: 10px; color: var(--text-hi, #ECF1F8); font-size: 15px;
}

/* Tabs */
.fm-carro-tabs { display: flex; gap: 6px; margin-bottom: 14px; overflow-x: auto; scrollbar-width: none; }
.fm-carro-tabs::-webkit-scrollbar { display: none; }
.fm-ct-tab {
  flex: 1; min-width: max-content; white-space: nowrap; min-height: 44px; padding: 0 14px; cursor: pointer;
  font-size: 13px; color: var(--text-mid, #aeb9c8);
  background: var(--surface-2, #161c26); border: 1px solid var(--line, #1c2530); border-radius: 11px;
}
.fm-ct-tab.ativo { color: var(--text-hi, #ECF1F8); border-color: var(--accent-line, rgba(0,230,160,0.4)); background: var(--accent-soft, rgba(0,230,160,0.08)); }

.fm-ct-painel { display: none; flex-direction: column; gap: 12px; }
.fm-ct-painel.ativo { display: flex; }
.fm-ct-rotulo { margin: 4px 0 0; font-family: var(--font-mono, monospace); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-lo, #7d8898); }

/* Energia */
.fm-energia { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.fm-en-btn {
  min-height: 52px; cursor: pointer; font-size: 15px; font-weight: 600;
  color: var(--text-mid, #aeb9c8); background: var(--surface-2, #161c26);
  border: 1px solid var(--line, #1c2530); border-radius: 12px;
}
.fm-en-btn.ativo { color: var(--text-hi, #ECF1F8); border-color: var(--accent, #00E6A0); background: var(--accent-soft, rgba(0,230,160,0.1)); }

/* Carregar / chocar */
.fm-desf-acoes { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.fm-carregar {
  min-height: 60px; font-size: 15px; font-weight: 700; letter-spacing: .04em;
  color: #06120C; background: var(--co2, #F5D33D); border: none; position: relative; overflow: hidden;
}
.fm-carregar.a-carregar { background: #b89f1e; animation: cargaPulso .6s ease-in-out infinite; }
@keyframes cargaPulso { 0%,100% { opacity: .85; } 50% { opacity: 1; } }
.fm-chocar {
  min-height: 60px; font-size: 16px; font-weight: 800; letter-spacing: .04em;
  color: #fff; background: #E8512E; border: none;
}
.fm-chocar:disabled { background: var(--surface-2, #161c26); color: var(--text-faint, #5a6575); cursor: not-allowed; }
.fm-ct-aviso { margin: 0; text-align: center; font-size: 13px; font-weight: 600; color: var(--co2, #F5D33D); }

/* SINC */
.fm-sinc-toggle {
  align-self: flex-start; min-height: 44px; padding: 0 18px; cursor: pointer;
  font-family: var(--font-mono, monospace); font-size: 13px; letter-spacing: .08em;
  color: var(--text-mid, #aeb9c8); background: var(--surface-2, #161c26);
  border: 1px solid var(--line, #1c2530); border-radius: 11px;
}
.fm-sinc-toggle.on { color: var(--accent, #00E6A0); border-color: var(--accent, #00E6A0); background: var(--accent-soft, rgba(0,230,160,0.1)); }
.fm-sinc-toggle span { text-transform: uppercase; font-weight: 700; }

/* Pacing / DEA */
.fm-pacing-modo, .fm-pm-btn { }
.fm-pacing-modo { display: flex; gap: 8px; }
.fm-pm-btn { flex: 1; min-height: 44px; cursor: pointer; font-size: 13px; color: var(--text-mid, #aeb9c8); background: var(--surface-2, #161c26); border: 1px solid var(--line, #1c2530); border-radius: 11px; }
.fm-pm-btn.ativo { color: var(--text-hi, #ECF1F8); border-color: var(--accent-line, rgba(0,230,160,0.4)); background: var(--accent-soft, rgba(0,230,160,0.08)); }
.fm-pacing-linha { display: grid; grid-template-columns: 64px 1fr 56px; align-items: center; gap: 10px; }
.fm-pacing-linha label { font-size: 12px; color: var(--text-lo, #7d8898); }
.fm-pacing-linha input[type=range] { width: 100%; accent-color: var(--accent, #00E6A0); }
.fm-pacing-linha span { font-family: var(--font-mono, monospace); font-size: 14px; color: var(--text-hi, #ECF1F8); text-align: right; }
.fm-pace-toggle, .fm-dea-analisar { min-height: 50px; font-size: 14px; font-weight: 600; color: var(--text-hi, #ECF1F8); background: var(--surface-2, #161c26); border: 1px solid var(--line-strong, #232c38); }
.fm-pace-toggle.on { color: var(--accent, #00E6A0); border-color: var(--accent, #00E6A0); }
.fm-ct-estado { margin: 0; text-align: center; font-size: 13px; color: var(--text-mid, #aeb9c8); }
.fm-ct-estado.ok { color: var(--accent, #00E6A0); }

/* Fármacos */
.fm-rcp-btn { min-height: 52px; font-size: 15px; font-weight: 600; color: var(--text-hi, #ECF1F8); background: var(--surface-2, #161c26); border: 1px solid var(--line-strong, #232c38); }
.fm-rcp-btn.on { color: #fff; background: #B0344A; border-color: #B0344A; }
.fm-farmacos-grelha { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.fm-farm-btn {
  min-height: 56px; padding: 8px 12px; cursor: pointer; text-align: left;
  font-size: 13.5px; color: var(--text-hi, #ECF1F8);
  background: var(--surface-2, #161c26); border: 1px solid var(--line, #1c2530); border-radius: 12px;
  transition: border-color .15s, background .15s;
}
.fm-farm-btn.dado { border-color: var(--accent, #00E6A0); background: var(--accent-soft, rgba(0,230,160,0.12)); }

/* Flash de choque a cobrir o ecrã muito brevemente (feedback) */
.fm-choque-flash { position: fixed; inset: 0; z-index: 200; background: #fff; opacity: .0; pointer-events: none; animation: choqueFlash .38s ease; }
@keyframes choqueFlash { 0% { opacity: 0; } 22% { opacity: .55; } 100% { opacity: 0; } }

@media (max-width: 700px){
  .fm-farmacos-grelha { grid-template-columns: 1fr; }
  .fm-energia { grid-template-columns: repeat(2, 1fr); }
}

/* ---------------------------------------------------------------------------
   SPLIT com o carro aberto — manter o RITMO e os VITAIS legíveis acima do carro.
   Liberta espaço (esconde os controlos de visualização) e, em telemóvel deitado,
   passa os vitais para uma faixa horizontal compacta por baixo do traçado. */
body.carro-aberto .fm-controlos { display: none !important; }

@media (orientation: landscape) and (max-height: 560px) {
  body.carro-aberto { --carro-h: min(42dvh, 300px); }
  /* traçado em cima (ocupa o máximo) + vitais numa linha por baixo */
  body.carro-aberto .fm-monitor {
    grid-template-columns: 1fr !important;
    grid-template-rows: minmax(0,1fr) auto !important;
    gap: 5px !important; padding: 4px 8px !important;
  }
  body.carro-aberto .fm-vitais {
    grid-template-columns: repeat(4, 1fr) !important;
    grid-template-rows: auto !important;
    height: auto !important; gap: 4px !important;
  }
  body.carro-aberto .fm-vitais .vital-tile.fm-tile {
    min-height: 0 !important; padding: 3px 9px !important;
    align-items: flex-start !important; justify-content: center !important;
  }
  body.carro-aberto .fm-vitais .vital-tile.fm-tile .valor { font-size: clamp(15px, 4.6vh, 22px) !important; }
  body.carro-aberto .fm-vitais .vital-tile.fm-tile.t-fc .valor { font-size: clamp(18px, 5.4vh, 26px) !important; }
  /* FR/Temp saem da vista durante a atuação (menos críticos; libertam espaço) */
  body.carro-aberto .fm-vitais-rodape { display: none !important; }
}

/* ===========================================================================
   CARRO DE URGÊNCIA — painel lateral (redesenho UX)
   Ocupa ~1/3 à esquerda; o monitor recolhe para os 2/3 da direita e continua a
   correr. Tudo à vista, em secções curtas: sob pressão não se procura em menus.
   =========================================================================== */
.fm-carro-painel {
  position: fixed; inset: 0 auto 0 0;
  width: 34vw; min-width: 320px; max-width: 460px;
  display: flex; flex-direction: column;
  background: var(--surface-1, #0E141B);
  border-right: 1px solid var(--line);
  box-shadow: 8px 0 34px rgba(0,0,0,.55);
  z-index: 900;
  animation: fmCpEntra .18s ease-out;
}
@keyframes fmCpEntra { from { transform: translateX(-100%); } to { transform: translateX(0); } }

.fm-cp-topo {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px; border-bottom: 1px solid var(--line);
  background: var(--surface-2);
}
.fm-cp-topo h3 { margin: 0; font-size: 1rem; color: var(--text-hi); }
.fm-cp-fechar {
  width: 34px; height: 34px; border-radius: 8px;
  background: transparent; border: 1px solid var(--line);
  color: var(--text-mid); font-size: 15px; cursor: pointer;
}
.fm-cp-fechar:hover { background: var(--surface-1); color: var(--text-hi); }

.fm-cp-corpo { flex: 1; overflow-y: auto; padding: 12px 14px 24px; }
.fm-cp-sec { padding: 12px 0; border-bottom: 1px solid var(--line); }
.fm-cp-sec:last-child { border-bottom: none; }
.fm-cp-h {
  margin: 0 0 10px; font-size: .74rem; letter-spacing: .1em; text-transform: uppercase;
  color: var(--text-lo);
}

/* Grelha de ações (intervenções não farmacológicas) */
.fm-acoes-grelha { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.fm-acao-btn {
  padding: 11px 9px; border-radius: 10px;
  background: var(--surface-2); border: 1px solid var(--line);
  color: var(--text-mid); font-size: 12px; line-height: 1.3; text-align: center;
  cursor: pointer; transition: background .12s, border-color .12s, transform .1s;
}
.fm-acao-btn:hover { background: var(--surface-1); border-color: var(--line-strong); color: var(--text-hi); }
.fm-acao-btn:active { transform: scale(.97); }
.fm-acao-btn.dado { background: var(--accent-soft); border-color: var(--accent); color: var(--accent); }

/* Registo do que já foi feito */
.fm-cp-registo { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.fm-cp-registo li {
  font-size: 12px; color: var(--text-mid); line-height: 1.4;
  padding: 7px 10px; border-radius: 8px; background: var(--surface-2);
  display: flex; gap: 8px; align-items: baseline;
}
.fm-cp-registo li .h { color: var(--text-lo); font-family: var(--font-mono); font-size: 10px; flex-shrink: 0; }
.fm-cp-registo li.erro { border-left: 3px solid var(--crit, #FF5C66); }
.fm-cp-vazio { justify-content: center; color: var(--text-lo); font-style: italic; }

/* O monitor recolhe para a direita quando o carro está aberto */
body.fm-carro-on .fm-layout { padding-left: 34vw; transition: padding-left .18s ease-out; }
@media (min-width: 1400px) { body.fm-carro-on .fm-layout { padding-left: 460px; } }

/* Telemóvel/tablet estreito: o painel ocupa o ecrã todo (botões seguros).
   Depois de cada ação o painel fecha-se sozinho para se ver o monitor. */
@media (max-width: 900px) {
  .fm-carro-painel { width: 100vw; max-width: none; }
  body.fm-carro-on .fm-layout { padding-left: 0; }
}

/* Avisos ao vivo das ações da equipa, no dashboard do formador */
.df-acoes-avisos {
  position: fixed; right: 18px; bottom: 18px; z-index: 9500;
  display: flex; flex-direction: column; gap: 8px; pointer-events: none;
}
.df-aviso-acao {
  display: flex; align-items: center; gap: 10px;
  padding: 11px 15px; border-radius: 10px;
  background: var(--surface-2); border: 1px solid var(--accent-line, rgba(0,230,160,.35));
  color: var(--text-hi); font-size: 13px;
  box-shadow: 0 8px 26px rgba(0,0,0,.5);
  animation: dfAvisoEntra .2s ease-out;
  max-width: 340px;
}
.df-aviso-acao.erro { border-color: var(--crit, #FF5C66); }
.df-aviso-acao .ic { font-size: 17px; flex-shrink: 0; }
.df-aviso-acao.sai { opacity: 0; transform: translateX(12px); transition: opacity .3s, transform .3s; }
@keyframes dfAvisoEntra { from { opacity: 0; transform: translateX(18px); } to { opacity: 1; transform: translateX(0); } }

/* Com o painel lateral aberto, o monitor usa a ALTURA TODA à direita.
   (A regra antiga body.carro-aberto encurtava-o a ~54% — era da gaveta de baixo.) */
body.fm-carro-on .fm-layout { height: 100vh; }
body.fm-carro-on .fm-monitor { min-height: 0; }
body.fm-carro-on .fm-controlos { display: flex; }