/* Uma folha branca sobre azul claro. A receita é a tela; o resto é material translúcido por cima. */
:root {
  color-scheme: light;
  --fundo: #f4f9fe;
  --fundo-topo: #e6f2fd;
  --papel: #ffffff;
  --campo: #f2f7fc;
  --campo-forte: #e7f0f9;
  --tinta: #0f1c2e;
  --suave: #5a6b82;
  --apagado: #97a6b8;
  --linha: #e3ebf3;
  --azul: #0f6fde;
  --azul-forte: #0a58b5;
  --azul-claro: #e8f3fe;
  --azul-medio: #bcdcfb;
  --alerta: #c93a32;
  --alerta-fundo: #fdeeed;
  --ambar: #a66300;
  --ambar-fundo: #fff5e2;

  /* Fonte do sistema: já traz ajuste óptico e legibilidade em cada plataforma. */
  --fonte: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Segoe UI Variable Text', 'Segoe UI', system-ui, Roboto, 'Helvetica Neue', Arial, sans-serif;

  /* Mola sem ressalto: chega rápido e assenta suave. */
  --mola: cubic-bezier(0.32, 0.72, 0, 1);
  --topo: 3.75rem;
  --raio: 0.75rem;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font: 100%/1.45 var(--fonte);
  font-size: 0.9375rem;
  color: var(--tinta);
  background: var(--fundo) linear-gradient(180deg, var(--fundo-topo), var(--fundo) 22rem) no-repeat;
  -webkit-font-smoothing: antialiased;
  font-variant-numeric: tabular-nums;
}

button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; -webkit-tap-highlight-color: transparent; }
h2, h3, p, ul, ol, dl, dd { margin: 0; padding: 0; }
ul, ol { list-style: none; }
hr { border: 0; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--azul); outline-offset: 2px; }

.rotulo, .cmp > span {
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.005em;
  color: var(--suave);
}

/* ------------------------------------------------------------------ */
/* Topo: material translúcido, conteúdo rola por baixo                 */
/* ------------------------------------------------------------------ */

.top {
  position: sticky;
  top: env(safe-area-inset-top, 0px);
  z-index: 30;
  height: var(--topo);
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 1rem;
  padding: 0 1.5rem;
  box-shadow: 0 1px 0 rgba(15, 28, 46, 0);
  transition: box-shadow 0.3s;
}
/* O desfoque vai numa camada própria: aplicado no próprio topo, ele prenderia a barra de ações do celular dentro dele. */
.top::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: rgba(244, 249, 254, 0.72);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
}
/* A divisa só aparece quando há conteúdo passando por baixo. */
.rolou .top { box-shadow: 0 1px 0 rgba(15, 28, 46, 0.08); }

/* Faixa da demonstração: rola junto com a página, o topo continua fixo. */
.demo-faixa {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  padding: 0.5rem 1rem;
  font-size: 0.8125rem;
  color: var(--azul-forte);
  background: var(--azul-claro);
  text-align: center;
  text-wrap: balance;
}
.demo-faixa a { color: inherit; font-weight: 600; flex: none; }

.brand { display: flex; align-items: center; gap: 0.625rem; }
/* Logotipo no computador, símbolo no celular. */
.brand__logo { display: block; height: 1.5rem; width: auto; }
.brand__simbolo { display: none; width: 1.875rem; height: 1.875rem; }

.brand__icon {
  display: grid;
  place-items: center;
  width: 1.875rem;
  height: 1.875rem;
  border-radius: 0.5625rem;
  background: linear-gradient(160deg, #4aa8f6, var(--azul));
  box-shadow: 0 2px 6px -1px rgba(15, 111, 222, 0.45);
}
.brand__icon svg { width: 1.125rem; height: 1.125rem; fill: none; stroke: #fff; stroke-width: 2.6; stroke-linecap: round; }
.brand__name { font-size: 1.0625rem; font-weight: 650; letter-spacing: -0.015em; }

/* Controle segmentado: o indicador desliza entre as áreas. */
.tabs {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 0.1875rem;
  border-radius: 0.6875rem;
  background: rgba(15, 60, 120, 0.08);
}
.tabs::before {
  content: '';
  position: absolute;
  top: 0.1875rem;
  bottom: 0.1875rem;
  left: 0.1875rem;
  width: calc(50% - 0.1875rem);
  border-radius: 0.5rem;
  background: var(--papel);
  box-shadow: 0 1px 3px rgba(15, 28, 46, 0.14), 0 0 0 0.5px rgba(15, 28, 46, 0.04);
  transition: transform 0.35s var(--mola);
}
.tabs[data-ativo='prontuario']::before { transform: translateX(100%); }
.tabs__btn {
  position: relative;
  min-width: 7rem;
  padding: 0.375rem 1rem;
  border: 0;
  background: none;
  font-size: 0.875rem;
  font-weight: 550;
  color: var(--suave);
  transition: color 0.2s;
}
.tabs__btn[aria-selected='true'] { color: var(--tinta); }

.top__dir { justify-self: end; display: flex; align-items: center; gap: 0.5rem; }
.acoes { display: flex; gap: 0.5rem; }

.btn {
  height: 2.25rem;
  padding: 0 0.9375rem;
  border: 0;
  border-radius: 0.625rem;
  background: rgba(15, 60, 120, 0.08);
  font-size: 0.875rem;
  font-weight: 550;
  color: var(--tinta);
  transition: background-color 0.15s, transform 0.25s var(--mola);
}
.btn:hover { background: rgba(15, 60, 120, 0.13); }
/* A resposta vem no toque, não ao soltar. */
.btn:active, .chip:active, .atalho:active, .dose:active { transform: scale(0.97); transition-duration: 0.1s; }
.btn--primario { background: var(--azul); color: #fff; box-shadow: 0 1px 2px rgba(15, 111, 222, 0.3); }
.btn--primario:hover { background: var(--azul-forte); }
.btn--icone { position: relative; width: 2.25rem; padding: 0; display: grid; place-items: center; }
.btn--icone svg { width: 1.25rem; height: 1.25rem; fill: var(--suave); }
.btn--pendente::after { content: ''; position: absolute; top: 0.375rem; right: 0.375rem; width: 0.4375rem; height: 0.4375rem; border-radius: 50%; background: #f0a020; box-shadow: 0 0 0 2px var(--fundo); }

/* Menu: nasce do botão que o abriu e some pelo mesmo caminho. */
.menu { position: relative; }
.menu__lista {
  position: absolute;
  top: calc(100% + 0.5rem);
  right: 0;
  z-index: 40;
  min-width: 13.5rem;
  padding: 0.375rem;
  border-radius: 0.875rem;
  background: rgba(255, 255, 255, 0.86);
  backdrop-filter: blur(24px) saturate(180%);
  -webkit-backdrop-filter: blur(24px) saturate(180%);
  box-shadow: 0 0 0 0.5px rgba(15, 28, 46, 0.1), 0 12px 32px -8px rgba(15, 40, 80, 0.28);
  transform-origin: top right;
  opacity: 0;
  transform: scale(0.94);
  visibility: hidden;
  transition: opacity 0.18s, transform 0.3s var(--mola), visibility 0s 0.3s;
}
.menu--aberto .menu__lista { opacity: 1; transform: none; visibility: visible; transition-delay: 0s; }
.menu__lista button {
  display: block;
  width: 100%;
  padding: 0.5625rem 0.75rem;
  border: 0;
  border-radius: 0.5625rem;
  background: none;
  font-size: 0.9375rem;
  text-align: left;
}
.menu__lista button:hover, .menu__lista button:focus-visible { background: var(--azul); color: #fff; outline: 0; }
.menu__lista hr { height: 1px; margin: 0.25rem 0.5rem; background: var(--linha); }

/* ------------------------------------------------------------------ */
/* Folha                                                               */
/* ------------------------------------------------------------------ */

.work { width: min(100%, 50rem); margin: 0 auto; padding: 1.25rem 1.25rem 4rem; }

/* ------------------------------------------------------------------ */
/* Por diagnóstico: barra à esquerda da folha                          */
/* ------------------------------------------------------------------ */

.lateral {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 1.125rem;
  border-radius: 1.25rem;
  background: var(--papel);
  box-shadow: 0 0 0 0.5px rgba(15, 40, 80, 0.06), 0 1px 2px rgba(15, 40, 80, 0.04), 0 16px 44px -20px rgba(15, 60, 120, 0.16);
  overflow-y: auto;
  scrollbar-width: thin;
}
.lateral__cab { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; }
.lateral__titulo { font-size: 1.0625rem; font-weight: 700; letter-spacing: -0.015em; }
.lateral__fechar { display: grid; place-items: center; width: 2rem; height: 2rem; border: 0; border-radius: 0.5rem; background: none; color: var(--suave); }
.lateral__fechar svg { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.lateral__fechar:hover { background: var(--campo); }
.lateral__busca { display: flex; align-items: center; gap: 0.5rem; height: 2.625rem; padding: 0 0.75rem; border-radius: var(--raio); background: var(--campo); transition: background-color 0.15s, box-shadow 0.15s; }
.lateral__busca:focus-within { background: var(--papel); box-shadow: 0 0 0 1px var(--azul), 0 0 0 4px var(--azul-claro); }
.lateral__busca svg { flex: none; fill: none; stroke: var(--suave); stroke-width: 2; stroke-linecap: round; }
.lateral__busca input { flex: 1; min-width: 0; height: 100%; padding: 0; border: 0; background: none; font-size: 0.9375rem; }
.lateral__busca input:focus { outline: 0; }
.lateral__busca input::placeholder { color: var(--apagado); }
.lateral__vazio { padding: 0.875rem; border-radius: var(--raio); background: var(--azul-claro); font-size: 0.8125rem; color: var(--azul-forte); text-wrap: pretty; }
.lateral__nada { font-size: 0.8125rem; color: var(--suave); }
.lateral__nota { margin-top: auto; padding-top: 0.75rem; border-top: 1px solid var(--linha); font-size: 0.75rem; color: var(--apagado); text-wrap: pretty; }
.lateral .mais { align-self: flex-start; }

.diags { display: flex; flex-direction: column; gap: 0.125rem; }
.diag { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; border-radius: 0.75rem; transition: background-color 0.15s; }
.diag:hover { background: var(--campo); }
.diag--atual, .diag--atual:hover { background: var(--azul-claro); }
.diag__usar { display: grid; gap: 0.0625rem; min-width: 0; padding: 0.5625rem 0.25rem 0.5625rem 0.625rem; border: 0; background: none; text-align: left; transition: transform 0.25s var(--mola); }
.diag__usar:active { transform: scale(0.98); transition-duration: 0.1s; }
.diag__usar strong { font-size: 0.9375rem; font-weight: 600; letter-spacing: -0.01em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.diag__usar span { font-size: 0.75rem; color: var(--suave); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.diag__usos { padding: 0.0625rem 0.4375rem; margin-right: 0.5rem; border-radius: 999px; background: rgba(15, 60, 120, 0.07); font-size: 0.75rem; font-weight: 600; color: var(--suave); }
.diag__del { position: absolute; right: 0.25rem; top: 50%; transform: translateY(-50%); display: grid; place-items: center; width: 1.75rem; height: 1.75rem; border: 0; border-radius: 0.5rem; background: var(--papel); color: var(--suave); opacity: 0; transition: opacity 0.15s; }
.diag__del svg { width: 0.9375rem; height: 0.9375rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.diag:hover .diag__del, .diag__del:focus-visible { opacity: 1; }
.diag__del:hover { background: var(--alerta-fundo); color: var(--alerta); }
@media (hover: none) { .diag__del { position: static; transform: none; opacity: 1; background: none; margin-right: 0.25rem; } .diag { grid-template-columns: minmax(0, 1fr) auto auto; } }

/* Botão que abre a barra em telas menores */
.abre-lateral {
  display: inline-flex;
  align-items: center;
  gap: 0.4375rem;
  margin: 0 0.25rem 0.75rem;
  padding: 0.375rem 0.75rem 0.375rem 0.5625rem;
  border: 0;
  border-radius: 999px;
  background: rgba(15, 60, 120, 0.07);
  font-size: 0.875rem;
  font-weight: 550;
  color: var(--tinta);
}
.abre-lateral:hover { background: rgba(15, 60, 120, 0.12); }
.abre-lateral svg { flex: none; fill: none; stroke: var(--azul); stroke-width: 2; stroke-linecap: round; }
.abre-lateral__n { padding: 0 0.375rem; border-radius: 999px; background: var(--azul); color: #fff; font-size: 0.75rem; font-weight: 600; }
.abre-lateral__n:empty { display: none; }

.veu-lateral { display: none; }

/* Tela larga: a barra fica fixa à esquerda da folha. */
@media (min-width: 64rem) {
  main { display: grid; grid-template-columns: 16.5rem minmax(0, 50rem); justify-content: center; align-items: start; column-gap: 1.75rem; padding-inline: 1.25rem; }
  main > .work { width: 100%; margin: 0; padding-inline: 0; }
  .lateral { position: sticky; top: calc(var(--topo) + 1.25rem + env(safe-area-inset-top, 0px)); max-height: calc(100dvh - var(--topo) - 2.5rem); margin-top: 1.25rem; }
  .abre-lateral, .lateral__fechar { display: none; }
}

/* Tela menor: a barra entra pela esquerda, por cima, e sai pelo mesmo caminho. */
@media (max-width: 63.99rem) {
  .lateral {
    position: fixed;
    z-index: 50;
    top: 0;
    bottom: 0;
    left: 0;
    width: min(20rem, 86vw);
    padding-top: calc(1.125rem + env(safe-area-inset-top, 0px));
    padding-bottom: calc(1.125rem + env(safe-area-inset-bottom, 0px));
    border-radius: 0 1.25rem 1.25rem 0;
    transform: translateX(-104%);
    visibility: hidden;
    transition: transform 0.4s var(--mola), visibility 0s 0.4s;
  }
  .lateral-aberta .lateral { transform: none; visibility: visible; transition-delay: 0s; }
  .veu-lateral { display: block; position: fixed; inset: 0; z-index: 45; background: rgba(15, 40, 80, 0.28); opacity: 0; pointer-events: none; transition: opacity 0.3s; }
  .lateral-aberta .veu-lateral { opacity: 1; pointer-events: auto; }
}

/* Onde o médico está atendendo: o local escolhido define timbre e prontuário. */
.local-atual {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  max-width: 100%;
  margin: 0 0.25rem 0.75rem;
  padding: 0.375rem 0.75rem 0.375rem 0.5625rem;
  border: 0;
  border-radius: 999px;
  background: rgba(15, 60, 120, 0.07);
  font-size: 0.875rem;
  font-weight: 550;
  color: var(--tinta);
  transition: background-color 0.15s, transform 0.25s var(--mola);
}
.local-atual:hover { background: rgba(15, 60, 120, 0.12); }
.local-atual:active { transform: scale(0.97); transition-duration: 0.1s; }
.local-atual svg { flex: none; width: 1.0625rem; height: 1.0625rem; fill: none; stroke: var(--azul); stroke-width: 2; stroke-linejoin: round; }
.local-atual__nome { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.local-atual__trocar { flex: none; color: var(--azul); font-weight: 600; }
.local-atual--vazio { background: var(--azul-claro); color: var(--azul-forte); }
.local-atual--vazio .local-atual__trocar { display: none; }

.pendencias { display: flex; flex-direction: column; gap: 0.125rem; margin: 0 0.25rem 0.75rem; }
.pendencias:empty { display: none; }
.pendencias li { position: relative; padding-left: 1rem; font-size: 0.8125rem; color: var(--ambar); }
.pendencias li::before { content: ''; position: absolute; left: 0.125rem; top: 0.5em; width: 0.4375rem; height: 0.4375rem; border-radius: 50%; background: #f0a020; }

.aviso { margin-top: 1rem; font-size: 0.8125rem; color: var(--apagado); text-align: center; text-wrap: balance; }

.folha {
  display: flex;
  flex-direction: column;
  min-height: 46rem;
  padding: 2.5rem 2.75rem 2.25rem;
  background: var(--papel);
  border-radius: 1.375rem;
  box-shadow: 0 0 0 0.5px rgba(15, 40, 80, 0.06), 0 1px 2px rgba(15, 40, 80, 0.04), 0 16px 44px -16px rgba(15, 60, 120, 0.16);
}
.entrando .folha { animation: surgir 0.5s var(--mola) backwards; }
@keyframes surgir { from { opacity: 0; transform: translateY(0.625rem) scale(0.985); } }

.folha__cab { display: flex; justify-content: space-between; align-items: flex-start; gap: 1.25rem; padding-bottom: 1.25rem; }
.folha__unidade { font-size: 1.375rem; font-weight: 700; line-height: 1.15; letter-spacing: -0.022em; text-wrap: balance; }
.folha__local { margin-top: 0.1875rem; font-size: 0.8125rem; color: var(--suave); }
.folha__tipo { flex: none; padding-top: 0.25rem; font-size: 0.8125rem; font-weight: 550; letter-spacing: 0.01em; color: var(--azul); }

/* Timbre oficial da unidade no lugar do cabeçalho do Pronto. */
.folha__cab--timbre { flex-direction: column; align-items: stretch; gap: 0.5rem; }
.folha__cab--timbre .folha__tipo { align-self: flex-end; padding-top: 0; }
.folha__editar--timbre { width: 100%; }
.folha__timbre { display: block; width: 100%; max-height: 8.5rem; object-fit: contain; object-position: left center; }

button.folha__editar { display: block; padding: 0.25rem 0.5rem; margin: -0.25rem -0.5rem; border: 0; border-radius: 0.5rem; background: none; text-align: inherit; transition: background-color 0.15s; }
button.folha__editar:hover { background: var(--campo); }
.falta { display: inline-block; padding: 0.3125rem 0.6875rem; border-radius: 0.5rem; background: var(--ambar-fundo); color: var(--ambar); font-size: 0.8125rem; font-weight: 550; letter-spacing: 0; }

/* Campos: preenchimento suave, sem borda; o foco acende em azul. */
.cmp { display: flex; flex-direction: column; gap: 0.3125rem; min-width: 0; }
.cmp input, .cmp select {
  width: 100%;
  height: 2.625rem;
  padding: 0 0.8125rem;
  border: 0;
  border-radius: var(--raio);
  background: var(--campo);
  font-size: 0.9375rem;
  transition: background-color 0.15s, box-shadow 0.15s;
}
.cmp input::placeholder { color: var(--apagado); }
.cmp input:hover, .cmp select:hover { background: var(--campo-forte); }
.cmp input:focus, .cmp select:focus { outline: 0; background: var(--papel); box-shadow: 0 0 0 1px var(--azul), 0 0 0 4px var(--azul-claro); }
.cmp select { appearance: none; padding-right: 2rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1.5 1.5 6 6l4.5-4.5' fill='none' stroke='%235a6b82' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 0.75rem center; background-size: 0.6875rem; cursor: pointer; }
.cmp select:has(option[value='']:checked) { color: var(--apagado); }

.folha__pac { display: grid; grid-template-columns: minmax(0, 1fr) 8rem 9.5rem; gap: 0.75rem; align-items: end; }
.cmp--end, .mais { grid-column: 1 / -1; }
.mais { justify-self: start; padding: 0.125rem 0; border: 0; background: none; font-size: 0.8125rem; font-weight: 550; color: var(--azul); }
.mais:hover { color: var(--azul-forte); }

.folha__corpo { flex: 1; display: flex; flex-direction: column; gap: 1.5rem; padding: 1.75rem 0 2rem; }
#itens { display: flex; flex-direction: column; gap: 1.5rem; }
#itens:empty { display: none; }

.via__nome { margin-bottom: 0.25rem; font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.01em; color: var(--azul); }

.rx__item { padding: 0.8125rem 0; border-top: 1px solid var(--linha); }
.rx__item:last-child { border-bottom: 1px solid var(--linha); }
.rx__linha { display: flex; align-items: baseline; gap: 0.5rem; }
.rx__n { flex: none; width: 1.5rem; font-size: 0.875rem; color: var(--apagado); }
.rx__nome { font-size: 1.0625rem; font-weight: 650; letter-spacing: -0.012em; }
.rx__conc { font-weight: 650; }
.rx__forma { font-size: 0.8125rem; color: var(--suave); }
.rx__qtd { flex: none; margin-left: auto; font-size: 0.875rem; font-weight: 550; color: var(--suave); text-align: right; }

/* Texto da receita: parece texto, e mostra que é editável ao passar o mouse ou focar. */
input.rx__qtd, textarea.rx__uso, .rx__orienta, .sec__texto {
  border: 0;
  border-radius: 0.4375rem;
  background: transparent;
  transition: background-color 0.15s, box-shadow 0.15s;
}
input.rx__qtd:hover, textarea.rx__uso:hover, .rx__orienta:hover, .sec__texto:hover { background: var(--campo); }
input.rx__qtd:focus, textarea.rx__uso:focus, .rx__orienta:focus, .sec__texto:focus { outline: 0; background: var(--papel); box-shadow: 0 0 0 1px var(--azul), 0 0 0 4px var(--azul-claro); }
input.rx__qtd { height: 1.75rem; padding: 0 0.375rem; margin-right: -0.375rem; field-sizing: content; min-width: 5ch; }

.rx__uso, .rx__orienta {
  display: block;
  width: calc(100% - 1.625rem);
  margin: 0.125rem 0 0 1.625rem;
  padding: 0.125rem 0.375rem;
  font-size: 0.9375rem;
  line-height: 1.5;
  resize: none;
  overflow: hidden;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.rx__orienta { width: calc(100% + 0.75rem); margin: 0 -0.375rem; }
.rx__orienta::placeholder { color: var(--apagado); }

/* Opções do item: ficam um nível abaixo, à mão só quando o item está em uso. */
.rx__opcoes { display: flex; flex-wrap: wrap; align-items: center; gap: 0.375rem; margin: 0.5rem 0 0 2rem; }
.rx__mover { display: flex; gap: 0.125rem; margin-left: auto; }
.rx__mover button { display: grid; place-items: center; width: 1.875rem; height: 1.875rem; border: 0; border-radius: 0.5rem; background: none; color: var(--suave); transition: background-color 0.15s, color 0.15s; }
.rx__mover svg { width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.rx__mover button:hover:not(:disabled) { background: var(--campo-forte); color: var(--tinta); }
.rx__mover button:disabled { opacity: 0.28; cursor: default; }
.rx__mover button[data-acao='remover']:hover { background: var(--alerta-fundo); color: var(--alerta); }
.rx__link { padding: 0.1875rem 0.25rem; border: 0; background: none; font-size: 0.8125rem; font-weight: 500; color: var(--azul); }
.rx__link:hover { color: var(--azul-forte); }
.rx__conferir { padding: 0.1875rem 0.5625rem; border-radius: 999px; background: var(--ambar-fundo); color: var(--ambar); font-size: 0.75rem; font-weight: 600; }

@media (hover: hover) {
  .rx__opcoes { opacity: 0; max-height: 0; margin-top: 0; overflow: hidden; transition: opacity 0.2s, max-height 0.35s var(--mola), margin-top 0.35s var(--mola); }
  .rx__item:hover .rx__opcoes, .rx__item:focus-within .rx__opcoes, .rx__item--novo .rx__opcoes { opacity: 1; max-height: 7.5rem; margin-top: 0.5rem; }
}

/* O item recém-escolhido assenta na folha. */
.rx__item--novo .rx__linha, .rx__item--novo .rx__uso { animation: assentar 0.45s var(--mola) backwards; }
.rx__item--novo .rx__uso { animation-delay: 0.06s; }
@keyframes assentar { from { opacity: 0; transform: translateY(0.5rem); } }

.chips { display: flex; flex-wrap: wrap; gap: 0.375rem; }
.chip, .atalho {
  padding: 0.3125rem 0.75rem;
  border: 0;
  border-radius: 999px;
  background: var(--campo);
  font-size: 0.8125rem;
  line-height: 1.35;
  text-align: left;
  color: var(--tinta);
  transition: background-color 0.15s, color 0.15s, transform 0.25s var(--mola);
}
.chip:hover, .atalho:hover { background: var(--azul-claro); color: var(--azul-forte); }
.chip--on, .chip--on:hover { background: var(--azul); color: #fff; font-weight: 550; }
.chip--meu:not(.chip--on) { box-shadow: inset 0 0 0 1px var(--azul-medio); color: var(--azul); }
.chip--acao { background: var(--azul-claro); color: var(--azul); font-weight: 550; }

.selo { display: inline-block; padding: 0.0625rem 0.4375rem; border-radius: 999px; background: var(--alerta-fundo); color: var(--alerta); font-size: 0.6875rem; font-weight: 600; white-space: nowrap; vertical-align: 0.125em; }
.atb { align-self: flex-start; padding: 0.375rem 0.75rem; border-radius: 999px; background: var(--alerta-fundo); color: var(--alerta); font-size: 0.8125rem; font-weight: 550; }

/* ------------------------------------------------------------------ */
/* Primeiro uso e valor acumulado                                      */
/* ------------------------------------------------------------------ */

/* Uma ação só, com mais peso que tudo em volta: é ela que leva à primeira receita. */
.inicio { margin-bottom: -0.625rem; }
.inicio__titulo { font-size: 1.375rem; font-weight: 700; line-height: 1.15; letter-spacing: -0.022em; }
.inicio__texto { max-width: 34rem; margin-top: 0.375rem; color: var(--suave); text-wrap: pretty; }

/* Antes da primeira receita, os dados do médico são só um lugar reservado, sem cobrança. */
.folha__vago { color: var(--apagado); font-weight: 600; }
.folha__medico .folha__vago { font-weight: 500; }

.sugestoes .mais { align-self: flex-start; }
/* O atalho de teclado só interessa a quem tem teclado. */
@media (hover: none) { .busca__kbd { display: none; } }

.acumulado { margin-top: 1rem; font-size: 0.8125rem; font-weight: 500; color: var(--suave); text-align: center; text-wrap: balance; }
.acumulado + .aviso { margin-top: 0.375rem; }

.resumo { display: flex; flex-direction: column; gap: 0.375rem; max-height: 50vh; overflow-y: auto; }
.resumo__numeros { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 0.5rem; }
.resumo__numeros p { display: flex; flex-direction: column; gap: 0.125rem; padding: 0.875rem 1rem; border-radius: var(--raio); background: var(--campo); }
.resumo__numeros strong { font-size: 1.5rem; font-weight: 700; line-height: 1.1; letter-spacing: -0.022em; }
.resumo__numeros span { font-size: 0.8125rem; color: var(--suave); }
.resumo h3 { margin-top: 0.75rem; font-size: 0.8125rem; font-weight: 600; color: var(--azul); }
.resumo ul { display: flex; flex-direction: column; }
.resumo li { padding: 0.4375rem 0; border-top: 1px solid var(--linha); font-size: 0.875rem; overflow-wrap: anywhere; }
.resumo li span { color: var(--apagado); }
.resumo__vazio { font-size: 0.875rem; color: var(--apagado); }

/* ------------------------------------------------------------------ */
/* Ponto de escrita                                                    */
/* ------------------------------------------------------------------ */

.compor { position: relative; }
.compor__campo {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  height: 3.25rem;
  padding: 0 0.875rem;
  border-radius: 0.9375rem;
  background: var(--campo);
  transition: background-color 0.15s, box-shadow 0.2s;
}
.compor__campo:hover { background: var(--campo-forte); }
.compor__campo:focus-within { background: var(--papel); box-shadow: 0 0 0 1.5px var(--azul), 0 0 0 5px var(--azul-claro); }
.compor__lupa { flex: none; width: 1.25rem; height: 1.25rem; fill: none; stroke: var(--suave); stroke-width: 2; stroke-linecap: round; }
.busca__med {
  flex: none;
  max-width: 60%;
  height: 2rem;
  padding: 0 0.6875rem;
  border: 0;
  border-radius: 0.5625rem;
  background: var(--azul);
  color: #fff;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  animation: assentar 0.3s var(--mola) backwards;
}
.busca__med span { margin-left: 0.25rem; opacity: 0.7; }
.busca__campo { position: relative; flex: 1; min-width: 0; height: 100%; }
.busca__campo input, .busca__fantasma { font-size: 1.0625rem; font-weight: 500; letter-spacing: -0.01em; }
.busca__campo input { position: relative; width: 100%; height: 100%; padding: 0; border: 0; background: transparent; }
.busca__campo input:focus { outline: 0; }
.busca__campo input::placeholder { color: var(--apagado); font-weight: 400; }
.busca__fantasma { position: absolute; inset: 0; display: flex; align-items: center; overflow: hidden; white-space: pre; color: var(--apagado); pointer-events: none; }
.busca__fantasma i { font-style: normal; visibility: hidden; }
.busca__kbd { flex: none; padding: 0.0625rem 0.4375rem; border-radius: 0.375rem; background: rgba(15, 60, 120, 0.08); font: 500 0.75rem var(--fonte); color: var(--suave); }
.compor__campo:focus-within .busca__kbd { display: none; }

/* Resultados: superfície que se materializa a partir do campo. */
.pop {
  position: absolute;
  top: 3.75rem; /* altura do campo + respiro: abre colado a ele, por cima dos atalhos */
  left: 0;
  right: 0;
  z-index: 15;
  padding: 0.375rem;
  border-radius: 1rem;
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(24px) saturate(180%);
  -webkit-backdrop-filter: blur(24px) saturate(180%);
  box-shadow: 0 0 0 0.5px rgba(15, 28, 46, 0.1), 0 16px 40px -10px rgba(15, 50, 100, 0.28);
  transform-origin: top center;
  opacity: 0;
  transform: translateY(-0.25rem) scale(0.98);
  visibility: hidden;
  transition: opacity 0.16s, transform 0.3s var(--mola), visibility 0s 0.3s;
}
.pop--aberto { opacity: 1; transform: none; visibility: visible; transition-delay: 0s; }
.pop__titulo { padding: 0.375rem 0.75rem 0.25rem; font-size: 0.75rem; font-weight: 550; color: var(--suave); }
.pop__titulo:empty { display: none; }

.res, .dose {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0 0.875rem;
  padding: 0.5625rem 0.75rem;
  border-radius: 0.6875rem;
  cursor: pointer;
  transition: transform 0.25s var(--mola);
}
.res--sel, .dose--sel, .res:hover, .dose:hover { background: var(--azul-claro); }
.res__nome { font-size: 1rem; font-weight: 600; letter-spacing: -0.008em; }
.res__nome mark { background: none; color: var(--azul); }
.res__meta { grid-column: 1; font-size: 0.8125rem; color: var(--suave); }
.res__pos { grid-column: 2; grid-row: 1 / span 2; font-size: 0.8125rem; color: var(--apagado); white-space: nowrap; }
.resultados__nada { padding: 0.75rem; font-size: 0.875rem; color: var(--suave); }
.dose__conc { font-size: 1.0625rem; font-weight: 650; letter-spacing: -0.01em; }
.dose__forma { grid-column: 1; font-size: 0.8125rem; color: var(--suave); }
.dose__pos { grid-column: 2; grid-row: 1 / span 2; font-size: 0.8125rem; color: var(--suave); white-space: nowrap; }

.sugestoes { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.875rem; }
.sugestoes .rotulo { font-size: 0.75rem; }
.atalhos, .modelos { display: flex; flex-wrap: wrap; gap: 0.375rem; }
.atalho { cursor: pointer; }
.atalho span { color: var(--suave); }
#modelosBox { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.375rem; }
.modelo { display: inline-flex; border-radius: 999px; background: var(--azul-claro); overflow: hidden; }
.modelo__usar { padding: 0.3125rem 0.25rem 0.3125rem 0.75rem; border: 0; background: none; font-size: 0.8125rem; font-weight: 550; color: var(--azul-forte); }
.modelo__usar span { font-weight: 400; opacity: 0.7; }
.modelo__del { padding: 0 0.625rem 0 0.375rem; border: 0; background: none; color: var(--azul); opacity: 0.6; }
.modelo__del:hover { opacity: 1; color: var(--alerta); }

.folha__rodape { display: flex; justify-content: space-between; align-items: flex-end; gap: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--linha); }
.folha__data { font-size: 0.875rem; color: var(--suave); }
.folha__assina { min-width: 15rem; text-align: center; }
.folha__assina button.folha__editar { width: 100%; margin: 0; }
.folha__traco { display: block; height: 2.5rem; border-bottom: 1px solid var(--tinta); margin-bottom: 0.375rem; }
.folha__medico { font-weight: 600; min-height: 1.375rem; }
.folha__crm, .folha__esp { font-size: 0.8125rem; color: var(--suave); }

/* ------------------------------------------------------------------ */
/* Prontuário                                                          */
/* ------------------------------------------------------------------ */

.folha--pront { min-height: 0; gap: 1.75rem; }
.queixas { display: flex; flex-direction: column; gap: 0.5rem; }
.chip--queixa { padding: 0.4375rem 0.875rem; font-size: 0.875rem; }
.secoes { display: flex; flex-direction: column; gap: 1.75rem; }
.sec { padding-top: 1.25rem; border-top: 1px solid var(--linha); }
.sec__cab { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; margin-bottom: 0.25rem; }
.sec__cab .via__nome { margin-bottom: 0; }
.sec__copiar {
  height: 1.75rem;
  padding: 0 0.6875rem;
  border: 0;
  border-radius: 0.5rem;
  background: var(--azul-claro);
  color: var(--azul);
  font-size: 0.8125rem;
  font-weight: 600;
  transition: background-color 0.15s, transform 0.25s var(--mola);
}
.sec__copiar:hover { background: var(--azul-medio); color: var(--azul-forte); }
.sec__copiar:active { transform: scale(0.96); transition-duration: 0.1s; }
.sec__texto {
  display: block;
  width: calc(100% + 0.75rem);
  margin: 0 -0.375rem 0.625rem;
  padding: 0.25rem 0.375rem;
  font-size: 1rem;
  line-height: 1.55;
  resize: none;
  overflow: hidden;
}
.sec__texto::placeholder { color: var(--apagado); }

/* Copiar o prontuário inteiro: grande e sempre à vista enquanto o médico rola as seções. */
.copiar-tudo {
  position: sticky;
  bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
  z-index: 5;
  display: grid;
  justify-items: center;
  gap: 0.5rem;
  margin: 0 -0.75rem -0.75rem;
  padding: 0.75rem;
  border-radius: 1.125rem;
  background: rgba(255, 255, 255, 0.82);
  backdrop-filter: blur(18px) saturate(180%);
  -webkit-backdrop-filter: blur(18px) saturate(180%);
  box-shadow: 0 0 0 0.5px rgba(15, 40, 80, 0.08), 0 12px 30px -14px rgba(15, 60, 120, 0.35);
}
.copiar-tudo__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  height: 3.25rem;
  border-radius: 0.875rem;
  font-size: 1.0625rem;
  font-weight: 650;
  letter-spacing: -0.01em;
}
.copiar-tudo__btn svg { flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linejoin: round; }
.copiar-tudo__btn--ok, .copiar-tudo__btn--ok:hover { background: #12805c; }
/* No prontuário, o aviso sobe para não cobrir o botão grande. */
body[data-tab='prontuario'] .toast { bottom: calc(9.25rem + env(safe-area-inset-bottom, 0px)); }
.copiar-tudo__ajuda { font-size: 0.8125rem; color: var(--suave); text-align: center; text-wrap: balance; }
.sec .chips { flex-direction: column; gap: 0.5rem; }
.sec .chips:empty { display: none; }
.sec__grupo { display: flex; flex-wrap: wrap; align-items: center; gap: 0.375rem; }
.sec__rotulo { flex-basis: 100%; font-size: 0.75rem; color: var(--apagado); }

/* ------------------------------------------------------------------ */
/* Diálogos: escurecem o fundo para concentrar a tarefa                */
/* ------------------------------------------------------------------ */

.dlg {
  width: min(33rem, calc(100vw - 2rem));
  padding: 1.75rem;
  overflow-x: hidden; /* com a barra de rolagem clássica do Windows, a vertical puxava uma horizontal */
  border: 0;
  border-radius: 1.375rem;
  background: var(--papel);
  color: var(--tinta);
  box-shadow: 0 0 0 0.5px rgba(15, 28, 46, 0.08), 0 32px 80px -20px rgba(15, 40, 80, 0.45);
  opacity: 0;
  transform: translateY(0.75rem) scale(0.97);
  transition: opacity 0.2s, transform 0.4s var(--mola), overlay 0.4s allow-discrete, display 0.4s allow-discrete;
}
.dlg[open] { opacity: 1; transform: none; }
@starting-style { .dlg[open] { opacity: 0; transform: translateY(0.75rem) scale(0.97); } }
.dlg::backdrop { background: rgba(15, 40, 80, 0); transition: background-color 0.3s, overlay 0.3s allow-discrete, display 0.3s allow-discrete; }
.dlg[open]::backdrop { background: rgba(15, 40, 80, 0.28); }
@starting-style { .dlg[open]::backdrop { background: rgba(15, 40, 80, 0); } }
.dlg--pequeno { width: min(25rem, calc(100vw - 2rem)); }
.dlg--grande { width: min(40rem, calc(100vw - 2rem)); max-height: min(52rem, calc(100dvh - 2rem)); }

.locais__vazio { margin: -0.25rem 0 1rem; padding: 0.875rem 1rem; border-radius: var(--raio); background: var(--azul-claro); font-size: 0.875rem; color: var(--azul-forte); }
.locais { display: flex; flex-direction: column; gap: 0.375rem; }
.local { display: flex; align-items: stretch; gap: 0.375rem; }
.local__usar {
  flex: 1;
  min-width: 0;
  display: grid;
  gap: 0.125rem;
  padding: 0.75rem 0.875rem 0.75rem 2.5rem;
  border: 0;
  border-radius: var(--raio);
  background: var(--campo);
  text-align: left;
  position: relative;
  transition: background-color 0.15s;
}
.local__usar::before { content: ''; position: absolute; left: 0.9375rem; top: 1rem; width: 0.875rem; height: 0.875rem; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--apagado); }
.local--atual .local__usar { background: var(--azul-claro); }
.local--atual .local__usar::before { box-shadow: inset 0 0 0 4px var(--azul); }
.local__usar:hover { background: var(--campo-forte); }
.local__usar strong { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.local__usar span { font-size: 0.8125rem; color: var(--suave); }
.local__editar { flex: none; padding: 0 0.875rem; border: 0; border-radius: var(--raio); background: none; font-size: 0.875rem; font-weight: 550; color: var(--azul); }
.local__editar:hover { background: var(--azul-claro); }

.bloco-local { display: grid; gap: 0.625rem; margin: 0; padding: 1.25rem 0 0; border: 0; border-top: 1px solid var(--linha); }
.bloco-local + .bloco-local { margin-top: 1.25rem; }
.bloco-local legend { float: left; width: 100%; padding: 0; font-size: 1rem; font-weight: 650; letter-spacing: -0.01em; }
.bloco-local legend small { margin-left: 0.375rem; font-size: 0.8125rem; font-weight: 500; color: var(--apagado); }
.bloco-local__ajuda { font-size: 0.875rem; color: var(--suave); text-wrap: pretty; }
.bloco-local__acoes { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.bloco-local__status { font-size: 0.8125rem; color: var(--suave); }
.bloco-local__status:empty { display: none; }

/* Envio do modelo do hospital */
.envio {
  position: relative;
  display: grid;
  justify-items: center;
  gap: 0.25rem;
  padding: 1.25rem 1rem;
  border-radius: var(--raio);
  background: var(--campo);
  box-shadow: inset 0 0 0 1.5px var(--azul-medio);
  text-align: center;
  cursor: pointer;
  transition: background-color 0.15s, box-shadow 0.15s;
}
.envio:hover, .envio--sobre { background: var(--azul-claro); box-shadow: inset 0 0 0 1.5px var(--azul); }
.envio:focus-within { outline: 2px solid var(--azul); outline-offset: 2px; }
.envio input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.envio svg { width: 1.5rem; height: 1.5rem; fill: none; stroke: var(--azul); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.envio strong { font-size: 0.9375rem; font-weight: 600; color: var(--azul-forte); }
.envio span { font-size: 0.8125rem; color: var(--suave); }

.envio--compacto { padding: 1rem; }

/* Levar para outro aparelho / Sair deste computador */
.bloco-local__titulo { font-size: 1rem; font-weight: 650; letter-spacing: -0.01em; }
.bloco-local__aviso { font-size: 0.8125rem; color: var(--apagado); }
.bloco-local__ajuda:empty { display: none; }
.sair__resumo { margin-top: 1rem; padding: 0.75rem 0.875rem; border-radius: var(--raio); background: var(--campo); font-size: 0.875rem; color: var(--tinta); }
.sair__resumo:empty { display: none; }
.sair__dica { margin-top: 0.75rem; font-size: 0.875rem; color: var(--suave); }
.link { padding: 0; border: 0; background: none; font: inherit; color: var(--azul); font-weight: 600; cursor: pointer; }
.link:hover { text-decoration: underline; }
.btn--apagar, .btn--apagar:hover { background: var(--alerta); color: #fff; }

.recorte { display: grid; grid-template-columns: minmax(0, 11rem) minmax(0, 1fr); align-items: center; gap: 1rem; }
.recorte__pagina { position: relative; justify-self: start; max-width: 100%; border-radius: 0.5rem; overflow: hidden; box-shadow: 0 0 0 1px var(--linha), 0 6px 16px -8px rgba(15, 40, 80, 0.3); }
.recorte__pagina img { display: block; width: 100%; height: auto; }
.recorte__sombra { position: absolute; left: 0; right: 0; bottom: 0; top: 16%; background: rgba(244, 249, 254, 0.78); border-top: 2px solid var(--azul); }
.recorte__controles { display: grid; gap: 0.75rem; justify-items: start; }
.recorte__altura { display: grid; gap: 0.375rem; width: 100%; font-size: 0.875rem; font-weight: 550; }
.recorte__altura em { font-style: normal; font-weight: 400; color: var(--suave); }
.recorte__altura input { width: 100%; accent-color: var(--azul); }

.timbre { display: grid; place-items: center; min-height: 4.5rem; padding: 0.75rem; border-radius: var(--raio); background: var(--campo); box-shadow: inset 0 0 0 1px var(--linha); }
.timbre img { display: block; width: 100%; max-height: 8rem; object-fit: contain; }
.timbre span { font-size: 0.8125rem; color: var(--apagado); text-align: center; }
.btn--arquivo { display: inline-flex; align-items: center; cursor: pointer; }
.btn--arquivo input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.btn--arquivo:focus-within { outline: 2px solid var(--azul); outline-offset: 2px; }

.amostra {
  width: 100%;
  padding: 0.625rem 0.8125rem;
  border: 0;
  border-radius: var(--raio);
  background: var(--campo);
  font: 0.875rem/1.5 var(--fonte);
  resize: vertical;
}
.amostra:focus { outline: 0; background: var(--papel); box-shadow: 0 0 0 1px var(--azul), 0 0 0 4px var(--azul-claro); }
.amostra::placeholder { color: var(--apagado); }

.campos-local__cab { display: grid; grid-template-columns: 1.25rem minmax(0, 1fr) minmax(0, 13rem) 4rem; gap: 0.5rem; margin-bottom: -0.25rem; font-size: 0.75rem; font-weight: 500; color: var(--apagado); }
.campos-local__cab span:first-child { grid-column: 2; }
.campos-local { display: flex; flex-direction: column; gap: 0.375rem; padding: 0; counter-reset: campo; }
.campo-local { display: grid; grid-template-columns: 1.25rem minmax(0, 1fr) minmax(0, 13rem) auto; align-items: center; gap: 0.5rem; }
.campo-local__n { font-size: 0.8125rem; color: var(--apagado); text-align: right; }
.campo-local input, .campo-local select {
  width: 100%;
  height: 2.375rem;
  padding: 0 0.6875rem;
  border: 0;
  border-radius: 0.625rem;
  background: var(--campo);
  font-size: 0.875rem;
}
.campo-local input { font-weight: 550; }
.campo-local select { appearance: none; padding-right: 1.75rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1.5 1.5 6 6l4.5-4.5' fill='none' stroke='%235a6b82' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 0.625rem center; background-size: 0.625rem; color: var(--suave); cursor: pointer; }
.campo-local input:focus, .campo-local select:focus { outline: 0; background-color: var(--papel); box-shadow: 0 0 0 1px var(--azul), 0 0 0 4px var(--azul-claro); }
.campo-local__acoes { display: flex; }
.campo-local__acoes button { display: grid; place-items: center; width: 2rem; height: 2rem; border: 0; border-radius: 0.5rem; background: none; color: var(--suave); }
.campo-local__acoes svg { width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.campo-local__acoes button:hover:not(:disabled) { background: var(--campo-forte); color: var(--tinta); }
.campo-local__acoes button:disabled { opacity: 0.28; cursor: default; }
.campo-local__acoes button[data-campo-acao='remover']:hover { background: var(--alerta-fundo); color: var(--alerta); }

.dlg__acoes--separadas { justify-content: space-between; align-items: center; }
.dlg__acoes-dir { display: flex; gap: 0.5rem; margin-left: auto; }
.btn--perigo { background: none; color: var(--alerta); }
.btn--perigo:hover { background: var(--alerta-fundo); }
.dlg h2 { font-size: 1.375rem; font-weight: 700; line-height: 1.15; letter-spacing: -0.022em; }
.dlg__sub { margin: 0.375rem 0 1.25rem; font-size: 0.875rem; color: var(--suave); }
.dlg__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.cmp--full { grid-column: 1 / -1; }
.dlg__acoes { display: flex; justify-content: flex-end; gap: 0.5rem; margin-top: 1.5rem; }
.dlg__acoes .btn { height: 2.5rem; padding: 0 1.125rem; }

.toast {
  position: fixed;
  left: 50%;
  bottom: calc(1.5rem + env(safe-area-inset-bottom, 0px));
  z-index: 60;
  display: flex;
  align-items: center;
  gap: 0.875rem;
  max-width: calc(100vw - 2rem);
  padding: 0.6875rem 1rem;
  border-radius: 0.875rem;
  background: rgba(20, 32, 50, 0.86);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  color: #fff;
  font-size: 0.875rem;
  font-weight: 500;
  letter-spacing: 0.005em;
  box-shadow: 0 12px 32px -10px rgba(15, 28, 46, 0.5);
  opacity: 0;
  transform: translate(-50%, 0.75rem) scale(0.97);
  pointer-events: none;
  transition: opacity 0.2s, transform 0.4s var(--mola);
}
.toast--on { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
.toast button { border: 0; background: none; font-weight: 600; color: #8cc6ff; }

#impressao { display: none; }

/* ------------------------------------------------------------------ */
/* Celular: as ações descem para uma barra flutuante ao alcance do polegar */
/* ------------------------------------------------------------------ */

@media (max-width: 45rem) {
  .top { grid-template-columns: auto 1fr auto; gap: 0.625rem; padding: 0 1rem; }
  .brand__logo { display: none; }
  .brand__simbolo { display: block; }
  .tabs { justify-self: center; }
  .tabs__btn { min-width: 6.25rem; padding: 0.4375rem 0.5rem; }

  .acoes {
    position: fixed;
    left: 1rem;
    right: 1rem;
    bottom: calc(0.75rem + env(safe-area-inset-bottom, 0px));
    z-index: 25;
    padding: 0.375rem;
    border-radius: 1.125rem;
    background: rgba(255, 255, 255, 0.78);
    backdrop-filter: blur(24px) saturate(180%);
    -webkit-backdrop-filter: blur(24px) saturate(180%);
    box-shadow: 0 0 0 0.5px rgba(15, 28, 46, 0.1), 0 12px 32px -8px rgba(15, 50, 100, 0.3);
  }
  .acoes .btn { flex: 1; height: 2.875rem; border-radius: 0.8125rem; font-size: 0.9375rem; }
  .toast { bottom: calc(5.25rem + env(safe-area-inset-bottom, 0px)); }
  /* No prontuário, o botão grande da folha já faz o papel da barra de baixo: uma só, para não empilhar duas. */
  body[data-tab='prontuario'] .acoes { display: none; }
  body[data-tab='prontuario'] .toast { bottom: calc(10.5rem + env(safe-area-inset-bottom, 0px)); }
  .copiar-tudo { bottom: calc(0.75rem + env(safe-area-inset-bottom, 0px)); }

  .work { padding: 0.75rem 1rem 7rem; }
  .folha { min-height: 0; padding: 1.5rem 1.125rem 1.375rem; border-radius: 1.25rem; }
  .folha__cab { flex-direction: column; gap: 0.375rem; }
  .folha__pac { grid-template-columns: 1fr 1fr; }
  .cmp--nome { grid-column: 1 / -1; }
  /* 16px nos campos evita o zoom automático do iPhone ao focar. */
  .cmp input, .cmp select, .busca__campo input, .busca__fantasma, .rx__uso, .rx__orienta, .sec__texto, input.rx__qtd { font-size: 1rem; }

  .rx__linha { flex-wrap: wrap; row-gap: 0; }
  .rx__nome { flex: 1 1 calc(100% - 2rem); }
  .rx__forma { margin-left: 2rem; }
  input.rx__qtd, span.rx__qtd { margin-left: auto; }
  .chip, .atalho { padding: 0.5rem 0.875rem; }
  .rx__mover button { width: 2.375rem; height: 2.375rem; }
  .folha__rodape { flex-direction: column; align-items: stretch; }
  .folha__assina { min-width: 0; }
  .dlg__grid { grid-template-columns: 1fr; }
  .campo-local { grid-template-columns: 1.25rem minmax(0, 1fr) auto; }
  .campo-local select { grid-column: 2 / -1; grid-row: 2; }
  .campos-local__cab { display: none; }
  .recorte { grid-template-columns: minmax(0, 8rem) minmax(0, 1fr); gap: 0.75rem; }
  .campo-local { row-gap: 0.25rem; padding-bottom: 0.375rem; border-bottom: 1px solid var(--linha); }
  .dlg { padding: 1.375rem; }
}

/* ------------------------------------------------------------------ */
/* Preferências de acessibilidade                                      */
/* ------------------------------------------------------------------ */

/* Menos movimento: troca deslocamento e escala por um esmaecer curto. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition-property: opacity, background-color, color, box-shadow, visibility !important; transition-duration: 0.15s !important; }
  .menu__lista, .pop, .dlg, .toast { transform: none !important; }
  .toast { transform: translateX(-50%) !important; }
}
@media (prefers-reduced-transparency: reduce) {
  .top::before { background: var(--fundo); backdrop-filter: none; -webkit-backdrop-filter: none; }
  .menu__lista, .pop, .acoes { background: var(--papel); backdrop-filter: none; -webkit-backdrop-filter: none; }
  .toast { background: #142032; backdrop-filter: none; -webkit-backdrop-filter: none; }
}
@media (prefers-contrast: more) {
  :root { --suave: #3c4a5e; --apagado: #5a6b82; --linha: #9fb0c4; --campo: #eaf1f8; }
  .top { box-shadow: 0 1px 0 var(--tinta); }
  .top::before { background: var(--fundo); }
  .menu__lista, .pop { background: var(--papel); box-shadow: 0 0 0 1px var(--tinta); }
  .cmp input, .cmp select, .compor__campo { box-shadow: inset 0 0 0 1px var(--suave); }
}

/* ------------------------------------------------------------------ */
/* Impressão: folha limpa, só texto                                    */
/* ------------------------------------------------------------------ */

.pacp { display: grid; grid-template-columns: minmax(0, 1fr) 8rem 9.5rem; gap: 0.625rem 1.125rem; padding: 0.875rem 0; border-top: 1px solid var(--tinta); border-bottom: 1px solid var(--linha); }
.pacp dt { font-size: 0.75rem; color: var(--suave); }
.pacp dd { min-height: 1.375rem; font-weight: 550; }
.pacp__end { grid-column: 1 / -1; }
/* Fecho: uma linha de ponta a ponta marca onde a prescrição termina, para nada ser acrescentado depois. */
.rx__fim { display: flex; align-items: center; gap: 0.75rem; margin-top: 0.5rem; font-size: 0.6875rem; letter-spacing: 0.02em; color: var(--suave); }
.rx__fim::before, .rx__fim::after { content: ''; flex: 1; height: 1px; background: #9fb0c4; }

@page { size: A4; margin: 0; }

@media print {
  body { background: #fff; }
  body > *:not(#impressao) { display: none !important; }
  #impressao { display: block; }
  .folha--impressa {
    box-sizing: border-box;
    min-height: 296mm;
    margin: 0;
    padding: 14mm 16mm;
    border-radius: 0;
    box-shadow: none;
    animation: none;
    break-after: page;
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }
  .folha--impressa:last-child { break-after: auto; }
  .folha--impressa .folha__tipo, .folha--impressa .via__nome { color: var(--tinta); }
  .folha--impressa .rx__item { break-inside: avoid; }
  /* No papel o texto de uso alinha com o nome do medicamento (número + respiro). */
  .folha--impressa p.rx__uso { width: auto; margin-left: 2rem; padding: 0; }
  .folha--impressa p.rx__orienta { width: auto; margin: 0; padding: 0; }
  .folha--impressa .atb { background: none; border: 1px solid var(--alerta); }
}