/* NES Portal do Paciente — MVP Fase 2 (mobile-first, acolhedor)
   Escopo: exclusivo do Portal do Paciente. Não afeta o Portal do Farmacêutico.
   Tokens alinhados ao Design System NES (verde acolhedor). */

:root {
  --pac-verde: #0F6E56;
  --pac-verde-esc: #0a5740;
  --pac-verde-claro: #E8F5F0;
  --pac-bg: #F0F7F4;
  --pac-surface: #ffffff;
  --pac-fg: #1a2332;
  --pac-fg-muted: #6B7280;
  --pac-borda: #D1FAE5;
  --pac-ok: #0F6E56;
  --pac-atencao: #B45309;
  --pac-erro: #B91C1C;
  --pac-radius: 16px;
  --pac-nav-h: 64px;
}

/* Shell */
#pac-portal { width: 100%; max-width: 560px; margin: 0 auto; padding-bottom: calc(var(--pac-nav-h) + 16px); }
#pac-view { min-height: 40vh; }
.pac-secao { display: none; }
.pac-secao.ativa { display: block; animation: pac-fade .18s ease; }
@keyframes pac-fade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .pac-secao.ativa { animation: none; } }

/* Cabeçalho da seção */
.pac-titulo { font-size: 20px; font-weight: 800; color: var(--pac-verde); margin: 4px 0 2px; }
.pac-sub { font-size: 13.5px; color: var(--pac-fg-muted); margin-bottom: 16px; line-height: 1.5; }

/* Cards */
.pac-card {
  background: var(--pac-surface); border: 1px solid var(--pac-borda); border-radius: var(--pac-radius);
  padding: 16px; margin-bottom: 12px; box-shadow: 0 2px 12px rgba(0,0,0,.05);
}
.pac-card h3 { font-size: 15.5px; font-weight: 700; color: var(--pac-fg); margin-bottom: 6px; display: flex; align-items: center; gap: 8px; }
.pac-card p { font-size: 13.5px; color: var(--pac-fg-muted); line-height: 1.55; }

/* Badges */
.pac-badge { display: inline-block; font-size: 11.5px; font-weight: 700; padding: 3px 9px; border-radius: 999px; }
.pac-badge--prep { background: #FEF3C7; color: var(--pac-atencao); }
.pac-badge--ok { background: var(--pac-verde-claro); color: var(--pac-ok); }

/* Grade de atalhos */
.pac-grade { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin: 8px 0 4px; }
.pac-atalho {
  min-height: 88px; border: 1.5px solid var(--pac-borda); border-radius: 14px; background: var(--pac-surface);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  cursor: pointer; font: inherit; color: var(--pac-fg); padding: 10px; transition: border-color .15s;
}
.pac-atalho:hover { border-color: var(--pac-verde); }
.pac-atalho .ic { font-size: 24px; }
.pac-atalho .tx { font-size: 13px; font-weight: 600; text-align: center; }

/* Botões */
.pac-btn {
  display: block; width: 100%; min-height: 48px; border: none; border-radius: 12px;
  background: var(--pac-verde); color: #fff; font-size: 15px; font-weight: 700; cursor: pointer;
  padding: 12px; margin-top: 8px;
}
.pac-btn--ghost { background: transparent; color: var(--pac-verde); border: 1.5px solid var(--pac-borda); }
.pac-btn:active { filter: brightness(.96); }

/* Lista de itens (Mais / Comunicação) */
.pac-lista { list-style: none; padding: 0; margin: 0; }
.pac-item {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 52px; text-align: left;
  background: var(--pac-surface); border: 1px solid var(--pac-borda); border-radius: 12px;
  padding: 12px 14px; margin-bottom: 8px; font: inherit; color: var(--pac-fg); cursor: pointer;
}
.pac-item .ic { font-size: 20px; width: 26px; text-align: center; }
.pac-item .tx { flex: 1; font-size: 14.5px; font-weight: 600; }
.pac-item .seta { color: var(--pac-fg-muted); }

/* Estado vazio / erro */
.pac-vazio, .pac-erro { text-align: center; padding: 24px 12px; color: var(--pac-fg-muted); font-size: 14px; }
.pac-erro { color: var(--pac-erro); }
.pac-skeleton { height: 12px; border-radius: 6px; background: linear-gradient(90deg,#eef2f0,#f7faf8,#eef2f0); background-size: 200% 100%; animation: pac-sk 1.2s infinite; }
@keyframes pac-sk { to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .pac-skeleton { animation: none; } }

/* Navegação inferior */
#pac-nav {
  position: fixed; left: 0; right: 0; bottom: 0; height: var(--pac-nav-h);
  background: var(--pac-surface); border-top: 1px solid var(--pac-borda);
  display: flex; z-index: 50; box-shadow: 0 -2px 12px rgba(0,0,0,.05);
}
.pac-nav-btn {
  flex: 1; min-height: 44px; border: none; background: transparent; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  color: var(--pac-fg-muted); font: inherit; font-size: 11px; font-weight: 600;
}
.pac-nav-btn .ic { font-size: 20px; }
.pac-nav-btn[aria-current="page"] { color: var(--pac-verde); }

/* Foco visível global do portal */
#pac-portal :focus-visible, #pac-nav :focus-visible { outline: 3px solid #34d399; outline-offset: 2px; border-radius: 8px; }

@media (min-width: 561px) {
  #pac-portal { padding-bottom: 24px; }
  #pac-nav { position: static; max-width: 560px; margin: 16px auto 0; border-radius: 14px; border: 1px solid var(--pac-borda); }
}

/* B2-A — formulários de Trabalho/Cirurgias (preview; persistência = B2-B) */
.pac-in {
  display: block; width: 100%; box-sizing: border-box; margin: 4px 0 12px;
  padding: 10px 12px; border: 1px solid var(--pac-borda, #d7dee0); border-radius: 10px;
  font-size: 15px; background: #fff; color: inherit; min-height: 44px;
}
.pac-in:focus-visible { outline: 2px solid var(--pac-verde, #0F6E56); outline-offset: 1px; }
.pac-check { display: flex; align-items: center; gap: 8px; min-height: 44px; }
fieldset[disabled] .pac-in, fieldset[disabled] .pac-check { opacity: .7; }
/* B2-B: mensagem de confirmação/erro inline (compacta, alinhada à esquerda) */
.pac-ok { text-align: left; padding: 10px 12px; margin: 8px 0; border-radius: 10px;
  background: var(--pac-verde-claro, #E6F4EF); color: var(--pac-ok, #0F6E56); font-size: 14px; font-weight: 600; }
#pac-b2-msg.pac-erro, #pac-cf-msg.pac-erro { text-align: left; padding: 10px 12px; margin: 8px 0;
  border-radius: 10px; background: #FEECEC; }
.pac-cf-desc { margin-top: -4px; }
