/* ============================================================
   Meddys — Design System (sistema interno)
   Azul clínico · claro e arejado
   Fontes: Fraunces (display) + Outfit (texto)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600&family=Outfit:wght@300;400;500;600;700&display=swap');

:root {
  --az-900: #0b1f3a;
  --az-700: #1d4ed8;
  --az-600: #2563eb;
  --az-500: #3b82f6;
  --az-100: #dbeafe;
  --az-50:  #eff4ff;
  --ciano:  #06b6d4;

  --papel:    #ffffff;
  --papel-2:  #f6f8fc;
  --tinta:    #0f1b2d;
  --tinta-2:  #51607a;
  --linha:    #e4e9f2;
  --erro:     #b8443a;
  --ok:       #16a34a;

  --r-lg: 20px;
  --r-md: 14px;
  --r-sm: 10px;
  --sb-1: 0 1px 2px rgba(11,31,58,.04), 0 8px 24px rgba(11,31,58,.06);
  --sb-2: 0 4px 12px rgba(11,31,58,.08), 0 24px 60px rgba(29,78,216,.12);
}

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  font-family: 'Outfit', system-ui, sans-serif;
  background: var(--papel-2);
  color: var(--tinta);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3 { font-family: 'Fraunces', Georgia, serif; font-weight: 500; line-height: 1.15; }
a { color: inherit; text-decoration: none; }
iconify-icon, svg { vertical-align: -0.125em; }

.container { max-width: 1140px; margin: 0 auto; padding: 0 24px; }

/* ---------- Topo ---------- */
.topo {
  display: flex; align-items: center; justify-content: space-between;
  padding: 20px 0;
}
.logo {
  display: flex; align-items: center; gap: 10px;
  font-family: 'Fraunces', serif; font-size: 1.35rem; font-weight: 600;
  color: var(--az-900);
}
.logo-mark {
  width: 34px; height: 34px; border-radius: 9px;
  background: linear-gradient(150deg, var(--az-600), var(--az-900));
  color: #fff; display: grid; place-items: center; font-size: 1.05rem;
  box-shadow: 0 4px 10px rgba(29,78,216,.3);
}
.topo-acoes { display: flex; align-items: center; gap: 16px; font-size: .92rem; }

/* ---------- Botões ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font-family: 'Outfit', sans-serif; font-weight: 600; font-size: .98rem;
  padding: 13px 26px; border-radius: var(--r-sm); border: none;
  cursor: pointer; transition: transform .13s ease, box-shadow .2s ease, background .2s;
}
.btn-primario {
  background: var(--az-700); color: #fff;
  box-shadow: 0 6px 16px rgba(29,78,216,.28);
}
.btn-primario:hover { background: var(--az-600); transform: translateY(-2px); }
.btn-claro { background: #fff; color: var(--az-700); border: 1.5px solid var(--linha); }
.btn-claro:hover { border-color: var(--az-500); transform: translateY(-2px); }
.btn-bloco { width: 100%; }
.btn:disabled { opacity: .5; cursor: not-allowed; transform: none; }

/* ---------- Flash ---------- */
.flash {
  padding: 13px 18px; border-radius: var(--r-sm); margin-bottom: 16px;
  font-size: .92rem; font-weight: 500;
}
.flash-erro  { background: #fbe9e7; color: var(--erro); border: 1px solid #f0c4be; }
.flash-aviso { background: #fef3e0; color: #c98a2a; border: 1px solid #f1ddb4; }

/* ============================================================
   PÁGINA DE PLANOS
   ============================================================ */
.planos-hero { text-align: center; max-width: 640px; margin: 36px auto 48px; }
.planos-hero h1 { font-size: 2.7rem; color: var(--az-900); margin-bottom: 14px; letter-spacing: -.02em; }
.planos-hero p { color: var(--tinta-2); font-size: 1.08rem; }

.planos-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px;
  align-items: start;
}
.plano-card {
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-lg); padding: 30px 26px; position: relative;
  transition: transform .18s ease, box-shadow .25s ease, border-color .2s;
  cursor: pointer;
}
.plano-card:hover { transform: translateY(-4px); box-shadow: var(--sb-1); }
.plano-card.destaque { border-color: var(--az-500); box-shadow: var(--sb-2); }
.plano-card.selecionado {
  border-color: var(--az-700); border-width: 2px; box-shadow: var(--sb-2);
}
.plano-tag {
  position: absolute; top: -13px; left: 50%; transform: translateX(-50%);
  background: linear-gradient(135deg, var(--ciano), var(--az-500));
  color: #fff; font-size: .73rem; font-weight: 700; letter-spacing: .04em;
  text-transform: uppercase; padding: 5px 14px; border-radius: 20px;
  white-space: nowrap;
}
.plano-radio {
  position: absolute; top: 24px; right: 24px;
  width: 22px; height: 22px; border: 2px solid var(--linha);
  border-radius: 50%; transition: all .15s ease;
}
.plano-card.selecionado .plano-radio {
  border-color: var(--az-700); background: var(--az-700);
  box-shadow: inset 0 0 0 4px #fff;
}
.plano-nome { font-size: 1.5rem; color: var(--az-900); }
.plano-desc { color: var(--tinta-2); font-size: .9rem; margin: 4px 0 20px; }
.plano-preco { display: flex; align-items: baseline; gap: 4px; }
.plano-preco .moeda { font-size: 1.1rem; color: var(--tinta-2); font-weight: 600; }
.plano-preco .valor { font-family: 'Fraunces', serif; font-size: 2.8rem; color: var(--az-900); }
.plano-preco .periodo { font-size: .85rem; color: var(--tinta-2); }
.plano-recursos { list-style: none; margin: 22px 0; }
.plano-recursos li {
  display: flex; align-items: center; gap: 10px;
  padding: 7px 0; font-size: .93rem; color: var(--tinta);
}
.plano-recursos li.off { color: #aeb6c4; }
.rec-icon { font-size: 1.05rem; flex-shrink: 0; }
.rec-icon.on  { color: var(--az-600); }
.rec-icon.off { color: #c4cbd6; }
.plano-limite { font-size: .82rem; color: var(--tinta-2); }

/* ---------- Barra de contratação ---------- */
.barra-contratacao {
  position: sticky; bottom: 0; margin-top: 36px;
  background: var(--az-900); border-radius: var(--r-lg) var(--r-lg) 0 0;
  padding: 24px 30px; color: #fff;
  box-shadow: 0 -8px 32px rgba(11,31,58,.22);
  display: grid; grid-template-columns: 1.4fr 1fr auto; gap: 28px;
  align-items: center;
}
.medicos-bloco label {
  font-size: .82rem; text-transform: uppercase; letter-spacing: .05em;
  color: var(--az-100); display: block; margin-bottom: 6px;
}
.medicos-ajuda { font-size: .78rem; color: rgba(255,255,255,.5); margin-top: 6px; }
.slider-linha { display: flex; align-items: center; gap: 16px; }
.slider-linha input[type=range] {
  -webkit-appearance: none; appearance: none; flex: 1; height: 6px;
  border-radius: 4px; background: var(--az-700); outline: none;
}
.slider-linha input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none; width: 24px; height: 24px; border-radius: 50%;
  background: var(--ciano); cursor: pointer; border: 3px solid var(--az-900);
}
.slider-linha input[type=range]::-moz-range-thumb {
  width: 24px; height: 24px; border-radius: 50%; background: var(--ciano);
  cursor: pointer; border: 3px solid var(--az-900);
}
.medicos-num {
  font-family: 'Fraunces', serif; font-size: 2rem; min-width: 48px;
  text-align: center; color: var(--ciano);
}
.total-bloco label {
  font-size: .82rem; text-transform: uppercase; letter-spacing: .05em;
  color: var(--az-100); display: block; margin-bottom: 2px;
}
.total-valor { font-family: 'Fraunces', serif; font-size: 2.3rem; }
.total-valor .moeda { font-size: 1.1rem; color: var(--az-100); }
.total-valor .mes { font-size: .9rem; color: rgba(255,255,255,.55); }

/* ============================================================
   CHECKOUT
   ============================================================ */
.checkout-grid {
  display: grid; grid-template-columns: 1fr 380px; gap: 32px;
  margin: 30px 0 60px; align-items: start;
}
.card {
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-lg); padding: 30px;
}
.card h2 { font-size: 1.5rem; color: var(--az-900); margin-bottom: 6px; }
.card-sub { color: var(--tinta-2); font-size: .92rem; margin-bottom: 22px; }

.campo { margin-bottom: 16px; }
.campo label {
  display: block; font-size: .85rem; font-weight: 600;
  color: var(--az-900); margin-bottom: 6px;
}
.campo input {
  width: 100%; padding: 12px 14px; font-family: 'Outfit', sans-serif;
  font-size: .96rem; border: 1.5px solid var(--linha);
  border-radius: var(--r-sm); background: #fff; color: var(--tinta);
  transition: border-color .15s ease;
}
.campo input:focus { outline: none; border-color: var(--az-500); }
.campo-duplo { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

.pgto-opcoes { display: grid; gap: 12px; margin: 8px 0 20px; }
.pgto-opcao {
  display: flex; gap: 14px; align-items: flex-start;
  border: 1.5px solid var(--linha); border-radius: var(--r-sm);
  padding: 16px; cursor: pointer; transition: border-color .15s, background .15s;
}
.pgto-opcao:hover { border-color: var(--az-500); }
.pgto-opcao.ativa { border-color: var(--az-700); background: var(--az-50); }
.pgto-bolinha {
  width: 20px; height: 20px; border-radius: 50%; flex-shrink: 0;
  border: 2px solid var(--linha); margin-top: 2px;
}
.pgto-opcao.ativa .pgto-bolinha {
  border-color: var(--az-700); background: var(--az-700);
  box-shadow: inset 0 0 0 3px #fff;
}
.pgto-titulo { font-weight: 600; font-size: .96rem; }
.pgto-aviso { font-size: .82rem; color: var(--tinta-2); margin-top: 3px; }

.resumo { position: sticky; top: 20px; }
.resumo-linha {
  display: flex; justify-content: space-between;
  padding: 10px 0; font-size: .94rem; border-bottom: 1px dashed var(--linha);
}
.resumo-linha.total {
  border-bottom: none; padding-top: 16px; font-size: 1.05rem; font-weight: 700;
  color: var(--az-900);
}
.resumo-linha.total .v { font-family: 'Fraunces', serif; font-size: 1.6rem; }

/* ============================================================
   PIX
   ============================================================ */
.tela-centro { max-width: 480px; margin: 40px auto; text-align: center; }
.pix-qr {
  width: 240px; height: 240px; margin: 22px auto; border-radius: var(--r-sm);
  border: 8px solid #fff; box-shadow: var(--sb-1);
}
.pix-copia { display: flex; gap: 8px; margin: 18px 0; }
.pix-copia input {
  flex: 1; padding: 11px 13px; font-size: .82rem; font-family: monospace;
  border: 1.5px solid var(--linha); border-radius: var(--r-sm);
  background: #fff; color: var(--tinta-2);
}
.pix-status {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  margin-top: 18px; font-size: .92rem; color: var(--tinta-2);
}
.spinner {
  width: 18px; height: 18px; border: 3px solid var(--az-100);
  border-top-color: var(--az-700); border-radius: 50%;
  animation: girar .8s linear infinite;
}
@keyframes girar { to { transform: rotate(360deg); } }

/* ============================================================
   LOGIN · SUCESSO · PAINEL
   ============================================================ */
.box-auth {
  max-width: 400px; margin: 60px auto; background: #fff;
  border: 1.5px solid var(--linha); border-radius: var(--r-lg); padding: 38px;
}
.box-auth h1 { font-size: 1.7rem; color: var(--az-900); margin-bottom: 24px; text-align: center; }

.sucesso-icone {
  width: 78px; height: 78px; border-radius: 50%; margin: 0 auto 20px;
  background: #dcfce7; color: var(--ok);
  display: grid; place-items: center; font-size: 2.2rem;
}

/* ============================================================
   LAYOUT DO PAINEL — navbar + sidebar + conteúdo (largura cheia)
   ============================================================ */

/* estrutura: navbar fixa no topo, sidebar + conteúdo abaixo */
.pnl { min-height: 100vh; background: var(--papel-2); }

/* --- Navbar --- */
.pnl-nav {
  position: sticky; top: 0; z-index: 50;
  background: var(--az-900); color: #fff;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 20px; height: 60px;
}
.pnl-nav-logo {
  display: flex; align-items: center; gap: 9px;
  font-family: 'Fraunces', serif; font-size: 1.25rem; font-weight: 600;
  color: #fff;
}
.pnl-nav-logo .logo-mark {
  background: linear-gradient(150deg, var(--az-500), var(--ciano));
}
.pnl-nav-dir { display: flex; align-items: center; gap: 10px; }

/* botão do pânico */
.pnl-panico {
  display: flex; align-items: center; gap: 7px;
  background: var(--erro); color: #fff; border: none; cursor: pointer;
  font-family: 'Outfit', sans-serif; font-weight: 700; font-size: .85rem;
  padding: 9px 16px; border-radius: 9px;
  transition: transform .12s ease, background .15s ease;
}
.pnl-panico:hover { background: #9d3a31; transform: translateY(-1px); }
.pnl-panico iconify-icon, .pnl-panico svg { font-size: 1rem; }

/* itens da navbar à direita */
.pnl-nav-item {
  display: flex; align-items: center; gap: 7px;
  color: rgba(255,255,255,.85); font-size: .9rem; font-weight: 500;
  padding: 7px 12px; border-radius: 9px; cursor: pointer;
  background: rgba(255,255,255,.06);
}
.pnl-nav-item:hover { background: rgba(255,255,255,.12); }
.pnl-nav-sair {
  display: flex; align-items: center; gap: 7px;
  color: #fff; background: rgba(184,68,58,.25);
  border: 1px solid rgba(184,68,58,.5);
  padding: 7px 14px; border-radius: 9px; font-size: .88rem; font-weight: 600;
}
.pnl-nav-sair:hover { background: var(--erro); }
.pnl-nav-user {
  display: flex; align-items: center; gap: 8px;
  font-size: .9rem; font-weight: 600;
}
.pnl-nav-avatar {
  width: 32px; height: 32px; border-radius: 50%;
  background: linear-gradient(135deg, var(--az-500), var(--ciano));
  display: grid; place-items: center; font-size: .85rem; font-weight: 700;
}

/* --- Corpo: sidebar + conteúdo --- */
.pnl-corpo { display: flex; min-height: calc(100vh - 60px); }

/* sidebar — começa FECHADA (só ícones), expande no estado .aberta */
.pnl-side {
  width: 232px; flex-shrink: 0; background: #fff;
  border-right: 1px solid var(--linha); padding: 16px 12px;
  display: flex; flex-direction: column;
  transition: width .2s ease;
}
.pnl-side.aberta { width: 232px; }
/* Quando o html tem data-side="fechada", a sidebar recolhe para só ícones */
html[data-side="fechada"] .pnl-side { width: 68px; }

/* botão de abrir/fechar a sidebar */
.pnl-side-toggle {
  display: flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; margin-bottom: 10px;
  border: none; background: var(--az-50); color: var(--az-700);
  border-radius: 10px; cursor: pointer; font-size: 1.2rem;
  transition: background .14s ease;
}
.pnl-side-toggle:hover { background: var(--az-100); }

.pnl-side-titulo {
  font-size: .72rem; text-transform: uppercase; letter-spacing: .07em;
  color: var(--tinta-2); padding: 8px 12px 6px; font-weight: 700;
  white-space: nowrap;
}
.pnl-menu-item {
  display: flex; align-items: center; gap: 12px;
  padding: 11px 13px; border-radius: 10px; margin-bottom: 3px;
  color: var(--tinta-2); font-size: .94rem; font-weight: 500;
  transition: background .14s ease, color .14s ease;
  white-space: nowrap; overflow: hidden;
}
.pnl-menu-item:hover { background: var(--az-50); color: var(--az-700); }
.pnl-menu-item.ativo { background: var(--az-700); color: #fff; }
.pnl-menu-item iconify-icon, .pnl-menu-item svg { font-size: 1.2rem; flex-shrink: 0; }
.pnl-menu-tag {
  margin-left: auto; font-size: .6rem; font-weight: 700;
  background: var(--az-100); color: var(--az-700);
  padding: 2px 7px; border-radius: 10px; text-transform: uppercase;
  white-space: nowrap; letter-spacing: .02em;
}
.pnl-menu-item.ativo .pnl-menu-tag { background: rgba(255,255,255,.2); color: #fff; }

/* o texto dos itens só aparece com a sidebar aberta */
html[data-side="fechada"] .pnl-side .pnl-side-titulo,
html[data-side="fechada"] .pnl-menu-item span,
html[data-side="fechada"] .pnl-side .pnl-menu-tag { display: none; }
html[data-side="fechada"] .pnl-menu-item { justify-content: center; padding: 11px; }

/* item Configurações — fixo no rodapé da sidebar, fundo leve */
.pnl-side-rodape { margin-top: auto; padding-top: 10px; }
.pnl-menu-config {
  background: var(--papel-2);
  border: 1px solid var(--linha);
}
.pnl-menu-config:hover { background: var(--az-50); }

/* conteúdo — largura cheia */
.pnl-main { flex: 1; padding: 28px 32px; min-width: 0; }
.pnl-main h1 { font-size: 1.8rem; color: var(--az-900); margin-bottom: 4px; }
.pnl-main-sub { color: var(--tinta-2); margin-bottom: 24px; }

/* nome do usuário clicável (abre o offcanvas) */
.pnl-nav-user { cursor: pointer; padding: 6px 8px; border-radius: 9px; }
.pnl-nav-user:hover { background: rgba(255,255,255,.1); }

/* --- Offcanvas (painel lateral do usuário) --- */
.pnl-oc-bg {
  display: none; position: fixed; inset: 0; z-index: 150;
  background: rgba(11,31,58,.5);
}
.pnl-oc-bg.aberto { display: block; }
.pnl-oc {
  position: fixed; top: 0; right: 0; height: 100vh; width: 320px;
  background: #fff; box-shadow: -8px 0 32px rgba(11,31,58,.18);
  transform: translateX(100%); transition: transform .25s ease;
  display: flex; flex-direction: column;
}
.pnl-oc-bg.aberto .pnl-oc { transform: translateX(0); }
.pnl-oc-topo {
  background: var(--az-900); color: #fff; padding: 24px 22px;
  display: flex; align-items: center; gap: 14px;
}
.pnl-oc-avatar {
  width: 48px; height: 48px; border-radius: 50%; flex-shrink: 0;
  background: linear-gradient(135deg, var(--az-500), var(--ciano));
  display: grid; place-items: center; font-size: 1.2rem; font-weight: 700;
}
.pnl-oc-nome { font-size: 1.05rem; font-weight: 600; }
.pnl-oc-email { font-size: .82rem; color: rgba(255,255,255,.6); }
.pnl-oc-fechar {
  margin-left: auto; background: rgba(255,255,255,.1); border: none;
  color: #fff; width: 32px; height: 32px; border-radius: 8px;
  cursor: pointer; font-size: 1rem;
}
.pnl-oc-fechar:hover { background: rgba(255,255,255,.2); }
.pnl-oc-corpo { padding: 14px; flex: 1; }
.pnl-oc-link {
  display: flex; align-items: center; gap: 12px;
  padding: 13px 14px; border-radius: 10px;
  color: var(--tinta); font-size: .94rem; font-weight: 500;
}
.pnl-oc-link:hover { background: var(--az-50); color: var(--az-700); }
.pnl-oc-link iconify-icon, .pnl-oc-link svg { font-size: 1.2rem; color: var(--az-600); }
.pnl-oc-sep { height: 1px; background: var(--linha); margin: 10px 4px; }
.pnl-oc-link.sair { color: var(--erro); }
.pnl-oc-link.sair svg, .pnl-oc-link.sair iconify-icon { color: var(--erro); }
.pnl-oc-link.sair:hover { background: #fbe9e7; }

/* aviso no topo do conteúdo */
.pnl-aviso {
  display: flex; align-items: center; gap: 10px;
  background: #fef3e0; border: 1px solid #f1ddb4; color: #9a6a1a;
  padding: 13px 18px; border-radius: var(--r-sm); margin-bottom: 22px;
  font-size: .92rem;
}
.pnl-aviso iconify-icon, .pnl-aviso svg { font-size: 1.1rem; flex-shrink: 0; }

/* cards de acesso rápido */
.pnl-cards {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 16px; margin-bottom: 28px;
}
.pnl-card {
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-md); padding: 22px;
  transition: transform .16s ease, box-shadow .2s ease, border-color .16s;
}
.pnl-card:hover {
  transform: translateY(-3px); box-shadow: var(--sb-1);
  border-color: var(--az-500);
}
.pnl-card-ico {
  width: 44px; height: 44px; border-radius: 11px; margin-bottom: 12px;
  background: linear-gradient(150deg, var(--az-100), var(--az-50));
  color: var(--az-700); display: grid; place-items: center; font-size: 1.25rem;
}
.pnl-card h3 { font-size: 1.05rem; color: var(--az-900); margin-bottom: 3px; }
.pnl-card p { font-size: .85rem; color: var(--tinta-2); }


/* ============================================================
   ASSINATURA — painel claro recolhível (dashboard)
   ============================================================ */
.painel-sub { color: var(--tinta-2); margin-bottom: 24px; }

.assinatura {
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-md); margin-bottom: 26px; overflow: hidden;
}
/* cabeçalho clicável */
.assinatura-cab {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; padding: 14px 18px; cursor: pointer;
  list-style: none; user-select: none;
}
.assinatura-cab::-webkit-details-marker { display: none; }
.assinatura-cab:hover { background: var(--papel-2); }
.assinatura-cab-info {
  display: flex; align-items: center; gap: 11px;
  font-size: .96rem; color: var(--az-900);
}
.assinatura-cab-info > svg { color: var(--az-600); font-size: 1.2rem; }
.assinatura-cab-info strong { margin-right: 8px; }
.assinatura-seta {
  color: var(--tinta-2); display: flex;
  transition: transform .2s ease;
}
.assinatura[open] .assinatura-seta { transform: rotate(180deg); }

/* corpo expansível */
.assinatura-corpo {
  padding: 4px 18px 18px; border-top: 1px solid var(--linha);
}
.assinatura-itens {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 16px 24px; padding-top: 14px;
}
.assinatura-item label {
  font-size: .74rem; text-transform: uppercase; letter-spacing: .04em;
  color: var(--tinta-2); display: block; margin-bottom: 3px;
}
.assinatura-item .v { font-size: 1.02rem; font-weight: 600; color: var(--az-900); }
.assinatura-item .v.destaque {
  font-family: 'Fraunces', serif; font-size: 1.3rem; color: var(--az-700);
}

.pill {
 display: inline-block; padding: 3px 12px; border-radius: 20px; font-size: .78rem; font-weight: 700; }
.pill.ativa  { background: var(--ok); color: #fff; }
.pill.pendente { background: #e2a541; color: var(--az-900); }
.pill.inadimplente, .pill.suspensa, .pill.cancelada { background: var(--erro); color: #fff; }

/* página-esqueleto dos módulos ainda não construídos */
.pnl-vazio {
  text-align: center; padding: 70px 30px;
  background: #fff; border: 1.5px dashed var(--linha);
  border-radius: var(--r-lg);
}
.pnl-vazio-ico {
  width: 64px; height: 64px; border-radius: 16px; margin: 0 auto 18px;
  background: var(--az-50); color: var(--az-500);
  display: grid; place-items: center; font-size: 1.8rem;
}
.pnl-vazio h2 { font-size: 1.4rem; color: var(--az-900); margin-bottom: 6px; }
.pnl-vazio p { color: var(--tinta-2); font-size: .95rem; max-width: 420px; margin: 0 auto; }

/* modal do botão do pânico */
.pnl-modal-bg {
  display: none; position: fixed; inset: 0; z-index: 200;
  background: rgba(11,31,58,.6); align-items: center; justify-content: center;
}
.pnl-modal-bg.aberto { display: flex; }
.pnl-modal {
  background: #fff; border-radius: var(--r-lg); padding: 32px;
  max-width: 420px; width: 90%; text-align: center;
}
.pnl-modal-ico {
  width: 60px; height: 60px; border-radius: 50%; margin: 0 auto 16px;
  background: #fbe9e7; color: var(--erro);
  display: grid; place-items: center; font-size: 1.7rem;
}
.pnl-modal h2 { font-size: 1.35rem; color: var(--az-900); margin-bottom: 8px; }
.pnl-modal p { color: var(--tinta-2); font-size: .93rem; margin-bottom: 22px; }
.pnl-modal-acoes { display: flex; gap: 10px; }

/* responsivo */
@media (max-width: 820px) {
  .pnl-side.aberta { width: 200px; }
  .pnl-main { padding: 20px 16px; }
  .assinatura-grid { grid-template-columns: 1fr 1fr; }
  .pnl-nav-user span { display: none; }
  .pnl-oc { width: 86%; }
}

/* ---------- Responsivo ---------- */
@media (max-width: 880px) {
  .planos-grid { grid-template-columns: 1fr; }
  .barra-contratacao { grid-template-columns: 1fr; gap: 18px; }
  .checkout-grid { grid-template-columns: 1fr; }
  .resumo { position: static; }
  .assinatura-grid { grid-template-columns: 1fr 1fr; }
  .planos-hero h1 { font-size: 2.1rem; }
}

/* ============================================================
   CONFIGURAÇÕES — dados da clínica e usuários
   ============================================================ */
.cfg-bloco {
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-md); padding: 24px; margin-bottom: 18px;
}
.cfg-bloco-tit {
  font-size: 1.05rem; color: var(--az-900); margin-bottom: 16px;
}
.cfg-select {
  width: 100%; padding: 12px 14px; font-family: 'Outfit', sans-serif;
  font-size: .96rem; border: 1.5px solid var(--linha);
  border-radius: var(--r-sm); background: #fff; color: var(--tinta);
}
.cfg-select:focus { outline: none; border-color: var(--az-500); }

/* logomarca */
.cfg-logo { display: flex; gap: 18px; align-items: center; }
.cfg-logo-preview {
  width: 96px; height: 96px; border-radius: var(--r-sm); flex-shrink: 0;
  border: 1.5px dashed var(--linha); background: var(--papel-2);
  display: grid; place-items: center; overflow: hidden;
}
.cfg-logo-preview img { max-width: 100%; max-height: 100%; }
.cfg-logo-preview span { font-size: .8rem; color: var(--tinta-2); }

/* resumo de vagas / cobrança */
.cfg-vagas {
  display: flex; align-items: center; gap: 22px;
  background: var(--az-50); border: 1px solid var(--az-100);
  border-radius: var(--r-md); padding: 18px 22px; margin-bottom: 24px;
}
.cfg-vagas-item { text-align: center; flex-shrink: 0; }
.cfg-vagas-num {
  display: block; font-family: 'Fraunces', serif; font-size: 2.2rem;
  color: var(--az-700); line-height: 1;
}
.cfg-vagas-lbl { font-size: .8rem; color: var(--tinta-2); }
.cfg-vagas-sep { width: 1px; align-self: stretch; background: var(--az-100); }
.cfg-vagas-texto {
  font-size: .9rem; color: var(--tinta-2); line-height: 1.5;
  display: flex; align-items: center; gap: 8px;
}
.cfg-vagas-texto svg { color: var(--az-600); font-size: 1.1rem; flex-shrink: 0; }

/* tabela de usuários */
.cfg-tabela {
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-md); overflow: hidden;
}
.cfg-linha {
  display: grid; grid-template-columns: 1.4fr 1.6fr 1fr .8fr 1.6fr;
  gap: 14px; align-items: center;
  padding: 14px 18px; border-bottom: 1px solid var(--linha);
  font-size: .92rem;
}
.cfg-linha:last-child { border-bottom: none; }
.cfg-cabecalho {
  background: var(--papel-2); font-size: .78rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em; color: var(--tinta-2);
}
.cfg-email { color: var(--tinta-2); font-size: .87rem; word-break: break-all; }
.cfg-tag {
  display: inline-block; padding: 3px 10px; border-radius: 20px;
  font-size: .76rem; font-weight: 700;
}
.cfg-tag-admin  { background: var(--az-900); color: #fff; }
.cfg-tag-medico { background: var(--az-100); color: var(--az-700); }
.cfg-tag-adm    { background: #e7edf5; color: var(--tinta-2); }
.cfg-badge-pend {
  display: inline-block; margin-left: 6px; padding: 2px 8px;
  background: #fef3e0; color: #b07d1f; border-radius: 12px;
  font-size: .68rem; font-weight: 700;
}
.cfg-acoes { display: flex; gap: 8px; flex-wrap: wrap; }
.cfg-select-mini {
  width: auto; padding: 6px 8px; font-size: .82rem; border-radius: 7px;
}
.cfg-btn-mini {
  background: var(--az-700); color: #fff; border: none; cursor: pointer;
  padding: 6px 12px; border-radius: 7px; font-size: .82rem; font-weight: 600;
  font-family: 'Outfit', sans-serif;
}
.cfg-btn-mini:hover { background: var(--az-600); }
.cfg-btn-mini-claro {
  background: #fff; color: var(--tinta-2); border: 1.5px solid var(--linha);
}
.cfg-btn-mini-claro:hover { border-color: var(--az-500); color: var(--az-700); }

/* escolha do próprio perfil */
.cfg-perfil-opcoes { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.cfg-perfil-card {
  display: block; cursor: pointer; text-align: center;
  background: #fff; border: 2px solid var(--linha);
  border-radius: var(--r-md); padding: 26px 22px;
  transition: border-color .15s ease, box-shadow .2s ease;
}
.cfg-perfil-card:hover { border-color: var(--az-500); }
.cfg-perfil-card input { position: absolute; opacity: 0; }
.cfg-perfil-card:has(input:checked) {
  border-color: var(--az-700); box-shadow: var(--sb-1);
}
.cfg-perfil-ico {
  width: 54px; height: 54px; border-radius: 14px; margin: 0 auto 12px;
  background: linear-gradient(150deg, var(--az-100), var(--az-50));
  color: var(--az-700); display: grid; place-items: center; font-size: 1.5rem;
}
.cfg-perfil-tit { font-size: 1.1rem; font-weight: 600; color: var(--az-900); }
.cfg-perfil-desc {
  font-size: .85rem; color: var(--tinta-2); margin-top: 6px; line-height: 1.5;
}

@media (max-width: 820px) {
  .cfg-linha { grid-template-columns: 1fr; gap: 6px; }
  .cfg-cabecalho { display: none; }
  .cfg-perfil-opcoes { grid-template-columns: 1fr; }
  .cfg-logo { flex-direction: column; align-items: flex-start; }
}

/* ============================================================
   MÓDULO DE PACIENTES
   ============================================================ */
.pac-topo {
  display: flex; align-items: flex-start; justify-content: space-between;
  margin-bottom: 18px; gap: 16px;
}
.pac-contador {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: .85rem; color: var(--tinta-2); margin-top: 2px;
}
.pac-contador svg { font-size: 1rem; color: var(--az-600); }

/* filtros */
.pac-filtros {
  display: flex; gap: 10px; margin-bottom: 20px; flex-wrap: wrap;
  align-items: center;
}
.pac-busca {
  display: flex; align-items: center; gap: 8px; flex: 1; min-width: 220px;
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-sm); padding: 0 14px;
}
.pac-busca svg { color: var(--tinta-2); font-size: 1.05rem; }
.pac-busca input {
  border: none; outline: none; padding: 12px 0; flex: 1;
  font-family: 'Outfit', sans-serif; font-size: .95rem; background: transparent;
}

/* grid da tabela de pacientes */
.pac-grid { grid-template-columns: 2fr 1.3fr 1fr 1.2fr 1.5fr; }
.pac-nome-cel { display: flex; align-items: center; gap: 10px; }
.pac-avatar {
  width: 36px; height: 36px; border-radius: 50%; flex-shrink: 0;
  background: linear-gradient(135deg, var(--az-500), var(--ciano));
  color: #fff; display: grid; place-items: center;
  font-size: .9rem; font-weight: 700; overflow: hidden;
}
.pac-avatar img { width: 100%; height: 100%; object-fit: cover; }

/* formulário de paciente — largura cheia */
.pac-form-grid {
  display: grid; grid-template-columns: 300px 1fr; gap: 18px;
  align-items: start;
}
/* blocos de dados lado a lado em telas largas */
.pac-dados-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 18px;
  align-items: start;
}
.pac-dados-grid .cfg-bloco { margin-bottom: 0; }
/* endereço: grid fluido que aproveita a largura */
.pac-end-grid {
  display: grid; gap: 0 14px;
  grid-template-columns: 200px 1fr 110px 1fr;
}
.pac-end-grid .campo:nth-child(2) { grid-column: span 1; }
.pac-foto-bloco { position: sticky; top: 20px; }
.pac-foto-area {
  width: 100%; aspect-ratio: 3/4; border-radius: var(--r-sm);
  background: var(--papel-2); border: 1.5px dashed var(--linha);
  overflow: hidden; display: flex; align-items: center; justify-content: center;
  margin-bottom: 12px;
}
.pac-foto-area img, .pac-foto-area video {
  width: 100%; height: 100%; object-fit: cover;
}
.pac-foto-vazio {
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  color: var(--tinta-2);
}
.pac-foto-vazio svg { font-size: 2.4rem; color: #c4cbd6; }
.pac-foto-vazio span { font-size: .82rem; }
.pac-foto-acoes { display: flex; gap: 8px; }
.pac-foto-acoes .btn { flex: 1; padding: 10px; font-size: .88rem; }
.pac-foto-ajuda {
  font-size: .78rem; color: var(--tinta-2); margin-top: 10px; line-height: 1.4;
}

.pac-textarea {
  width: 100%; padding: 12px 14px; font-family: 'Outfit', sans-serif;
  font-size: .95rem; border: 1.5px solid var(--linha);
  border-radius: var(--r-sm); resize: vertical; color: var(--tinta);
}
.pac-textarea:focus { outline: none; border-color: var(--az-500); }

/* CEP */
.pac-cep { display: flex; gap: 8px; }
.pac-cep input { flex: 1; }
.pac-cep .btn { padding: 0 16px; white-space: nowrap; }
.pac-cep-status {
  display: block; font-size: .78rem; color: var(--tinta-2); margin-top: 5px;
}

@media (max-width: 1100px) {
  .pac-dados-grid { grid-template-columns: 1fr; }
  .pac-end-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 820px) {
  .pac-grid { grid-template-columns: 1fr; }
  .pac-form-grid { grid-template-columns: 1fr; }
  .pac-end-grid { grid-template-columns: 1fr; }
  .pac-foto-bloco { position: static; }
}

/* ============================================================
   MÓDULO DE AGENDA — calendário, formulário, transferência
   (calendário ocupa 100% da largura da página)
   ============================================================ */
.ag-topo {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 16px; margin-bottom: 16px;
}

/* cores dos status (usadas em todo o módulo) */
.status-agendado   { --c: #1d4ed8; --bg: #dbeafe; }
.status-confirmado { --c: #0891b2; --bg: #cffafe; }
.status-atendido   { --c: #16a34a; --bg: #dcfce7; }
.status-faltou     { --c: #c2410c; --bg: #ffedd5; }
.status-cancelado  { --c: #6b7280; --bg: #e5e7eb; }

/* barra de controles */
.ag-controles {
  display: flex; align-items: center; justify-content: space-between;
  gap: 14px; margin-bottom: 16px; flex-wrap: wrap; width: 100%;
}
.ag-nav { display: flex; align-items: center; gap: 6px; }
.ag-nav-btn {
  width: 38px; height: 38px; border-radius: 9px;
  display: grid; place-items: center; font-size: 1.1rem;
  background: #fff; border: 1.5px solid var(--linha); color: var(--az-700);
}
.ag-nav-btn:hover { border-color: var(--az-500); }
.ag-nav-hoje {
  padding: 9px 16px; border-radius: 9px; font-size: .9rem; font-weight: 600;
  background: #fff; border: 1.5px solid var(--linha); color: var(--az-700);
}
.ag-nav-hoje:hover { border-color: var(--az-500); }
.ag-controles-dir {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
}
.ag-visao-toggle {
  display: flex; background: #fff; border: 1.5px solid var(--linha);
  border-radius: 9px; overflow: hidden;
}
.ag-visao-toggle a {
  padding: 9px 16px; font-size: .88rem; font-weight: 600; color: var(--tinta-2);
}
.ag-visao-toggle a.ativo { background: var(--az-700); color: #fff; }

/* ---- visão de MÊS — largura cheia ---- */
.ag-mes {
  width: 100%;
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-md); overflow: hidden;
}
.ag-mes-cabecalho {
  display: grid; grid-template-columns: repeat(7, 1fr);
  background: var(--papel-2); border-bottom: 1px solid var(--linha);
}
.ag-mes-cabecalho span {
  padding: 10px; text-align: center; font-size: .78rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em; color: var(--tinta-2);
}
.ag-mes-grade {
  display: grid; grid-template-columns: repeat(7, 1fr);
  width: 100%;
}
.ag-mes-dia {
  min-height: 140px; border-right: 1px solid var(--linha);
  border-bottom: 1px solid var(--linha); padding: 6px;
  display: flex; flex-direction: column; gap: 3px;
  transition: background .12s ease; min-width: 0;
}
.ag-mes-dia:nth-child(7n) { border-right: none; }
.ag-mes-dia:hover { background: var(--az-50); }
.ag-mes-dia.fora { background: #fafbfd; }
.ag-mes-dia.fora .ag-mes-num { color: #c4cbd6; }
.ag-mes-num {
  font-size: .85rem; font-weight: 600; color: var(--tinta);
  width: 26px; height: 26px; display: grid; place-items: center;
}
.ag-mes-dia.hoje .ag-mes-num {
  background: var(--az-700); color: #fff; border-radius: 50%;
}
.ag-mes-evt {
  font-size: .72rem; padding: 2px 6px; border-radius: 5px;
  background: var(--bg); color: var(--c); font-weight: 600;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  cursor: pointer; border-left: 3px solid var(--c);
}
.ag-mes-evt:hover { filter: brightness(.95); }
.ag-mes-mais { font-size: .68rem; color: var(--tinta-2); padding-left: 4px; }

/* ---- visão de SEMANA — largura cheia ---- */
.ag-semana {
  width: 100%;
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-md); overflow: hidden;
}
.ag-semana-cabecalho {
  display: grid; grid-template-columns: 64px repeat(7, 1fr);
  background: var(--papel-2); border-bottom: 1px solid var(--linha);
}
.ag-sem-diahead {
  padding: 8px; text-align: center; font-size: .82rem; color: var(--tinta-2);
  border-left: 1px solid var(--linha);
}
.ag-sem-diahead strong { display: block; font-size: .72rem;
  text-transform: uppercase; letter-spacing: .04em; }
.ag-sem-data { font-family: 'Fraunces', serif; font-size: 1.2rem;
  color: var(--az-900); }
.ag-sem-diahead.hoje .ag-sem-data {
  background: var(--az-700); color: #fff; border-radius: 50%;
  width: 30px; height: 30px; display: inline-grid; place-items: center;
}
.ag-sem-linha {
  display: grid; grid-template-columns: 64px repeat(7, 1fr);
  border-bottom: 1px solid var(--linha); min-height: 66px;
  width: 100%;
}
.ag-sem-linha:last-child { border-bottom: none; }
.ag-sem-hora {
  font-size: .72rem; color: var(--tinta-2); padding: 4px 6px;
  text-align: right; border-right: 1px solid var(--linha);
}
.ag-sem-celula {
  border-left: 1px solid var(--linha); padding: 3px;
  display: flex; flex-direction: column; gap: 3px; min-width: 0;
  transition: background .12s ease;
}
.ag-sem-celula:hover { background: var(--az-50); }
.ag-sem-evt {
  font-size: .73rem; padding: 4px 7px; border-radius: 6px;
  background: var(--bg); color: var(--c); border-left: 3px solid var(--c);
  cursor: pointer; line-height: 1.3; overflow: hidden;
}
.ag-sem-evt:hover { filter: brightness(.96); }
.ag-sem-evt strong { display: block; }
.ag-sem-evt-med { display: block; font-size: .66rem; opacity: .8; }

/* legenda */
.ag-legenda {
  display: flex; gap: 18px; flex-wrap: wrap; margin-top: 14px;
  font-size: .82rem; color: var(--tinta-2);
}
.ag-legenda span { display: flex; align-items: center; gap: 6px; }
.ag-legenda i {
  width: 14px; height: 14px; border-radius: 4px;
  background: var(--bg); border-left: 3px solid var(--c);
}

/* ---- formulário de agendamento ---- */
.ag-busca {
  display: flex; align-items: center; gap: 8px;
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-sm); padding: 0 14px;
}
.ag-busca svg { color: var(--tinta-2); }
.ag-busca input {
  flex: 1; border: none; outline: none; padding: 12px 0;
  font-family: 'Outfit', sans-serif; font-size: .95rem; background: transparent;
}
.ag-sugestoes {
  display: none; background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-sm); margin-top: 4px; overflow: hidden;
  box-shadow: var(--sb-1); max-height: 280px; overflow-y: auto;
}
.ag-sug-item {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 14px; cursor: pointer; font-size: .9rem;
  border-bottom: 1px solid var(--linha);
}
.ag-sug-item:last-child { border-bottom: none; }
.ag-sug-item:hover { background: var(--az-50); }
.ag-sug-item span { font-size: .82rem; color: var(--tinta-2); }
.ag-sug-vazio { padding: 12px 14px; font-size: .88rem; color: var(--tinta-2); }
.ag-form-grid {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px;
}
.ag-status-linha { display: flex; gap: 8px; flex-wrap: wrap; }
.ag-status-atual {
  padding: 5px 12px; border-radius: 20px; font-size: .8rem; font-weight: 700;
  background: #f0f2f6; color: #aab2c0;
}
.ag-status-atual.on { background: var(--bg); color: var(--c); }

/* ---- transferência ---- */
.ag-transf-filtro {
  display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap;
  margin-bottom: 20px;
}
.ag-transf-cab {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 14px; gap: 12px; flex-wrap: wrap;
}
.ag-transf-todos {
  display: flex; align-items: center; gap: 7px; font-size: .88rem;
  color: var(--tinta-2); cursor: pointer;
}
.ag-transf-lista { display: flex; flex-direction: column; gap: 6px; }
.ag-transf-item {
  display: grid;
  grid-template-columns: 24px 130px 1fr 1fr auto;
  gap: 12px; align-items: center;
  padding: 11px 14px; border: 1.5px solid var(--linha);
  border-radius: var(--r-sm); cursor: pointer; font-size: .9rem;
  transition: border-color .12s ease, background .12s ease;
}
.ag-transf-item:hover { border-color: var(--az-500); }
.ag-transf-item:has(input:checked) {
  border-color: var(--az-700); background: var(--az-50);
}
.ag-transf-hora { font-weight: 600; color: var(--az-900); }
.ag-transf-pac { font-weight: 600; }
.ag-transf-med { color: var(--tinta-2); font-size: .85rem; }

@media (max-width: 980px) {
  .ag-mes-dia { min-height: 96px; }
  .ag-form-grid { grid-template-columns: 1fr; }
  .ag-transf-item { grid-template-columns: 24px 1fr; row-gap: 4px; }
}
@media (max-width: 820px) {
  .ag-semana { overflow-x: auto; }
  .ag-semana-cabecalho, .ag-sem-linha { min-width: 700px; }
}

/* ============================================================
   FILA DE ESPERA
   ============================================================ */
.fila-lista { display: flex; flex-direction: column; gap: 10px; }
.fila-card {
  display: flex; align-items: center; gap: 16px;
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-md); padding: 14px 18px;
  transition: border-color .14s ease;
}
.fila-card:hover { border-color: var(--az-500); }
.fila-card.chamado { background: var(--az-50); border-color: var(--az-100); }
.fila-hora {
  font-family: 'Fraunces', serif; font-size: 1.3rem; color: var(--az-700);
  min-width: 64px;
}
.fila-card .pac-avatar { width: 44px; height: 44px; font-size: 1rem; }
.fila-info { display: flex; flex-direction: column; }
.fila-info strong { font-size: 1.02rem; color: var(--az-900); }
.fila-info span { font-size: .85rem; color: var(--tinta-2); }
.fila-status {
  display: flex; align-items: center; gap: 6px;
  font-size: .85rem; font-weight: 600; color: var(--ok);
}
.fila-status svg { font-size: 1rem; }
.fila-acao {
  margin-left: auto; display: flex; gap: 8px; align-items: center;
  flex-wrap: wrap;
}
.fila-acao .cfg-select-mini { min-width: 150px; }

@media (max-width: 820px) {
  .fila-card { flex-wrap: wrap; }
  .fila-acao { margin-left: 0; width: 100%; }
}

/* ============================================================
   PRONTUÁRIO — atendimento em tela única
   ============================================================ */
.pr-cabecalho {
  display: flex; align-items: center; gap: 16px; margin-bottom: 20px;
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-md); padding: 16px 20px;
}

/* layout: registro + histórico lateral */
.pr-grid {
  display: grid; grid-template-columns: 1fr 320px; gap: 18px;
  align-items: start;
}
.pr-principal { min-width: 0; }

/* abas */
.pr-abas {
  display: flex; gap: 4px; flex-wrap: wrap; margin-bottom: 14px;
}
.pr-aba {
  background: #fff; border: 1.5px solid var(--linha); cursor: pointer;
  padding: 9px 16px; border-radius: 9px; font-size: .9rem; font-weight: 600;
  color: var(--tinta-2); font-family: 'Outfit', sans-serif;
  transition: all .13s ease;
}
.pr-aba:hover { border-color: var(--az-500); }
.pr-aba.ativa { background: var(--az-700); color: #fff; border-color: var(--az-700); }

.pr-painel { display: none; }
.pr-painel.ativo { display: block; }

/* chips de exame */
.pr-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.pr-chip {
  background: var(--az-50); border: 1px solid var(--az-100); cursor: pointer;
  color: var(--az-700); padding: 6px 12px; border-radius: 16px;
  font-size: .83rem; font-weight: 600; font-family: 'Outfit', sans-serif;
}
.pr-chip:hover { background: var(--az-100); }

/* medicamentos da receita */
.pr-med {
  display: grid; grid-template-columns: 1.6fr 1.4fr .8fr 36px;
  gap: 8px; margin-bottom: 8px; align-items: center;
}
.pr-med input {
  padding: 10px 12px; border: 1.5px solid var(--linha);
  border-radius: var(--r-sm); font-family: 'Outfit', sans-serif;
  font-size: .92rem; color: var(--tinta);
}
.pr-med input:focus { outline: none; border-color: var(--az-500); }
.pr-med-x {
  background: #fbe9e7; color: var(--erro); border: none; cursor: pointer;
  border-radius: var(--r-sm); font-size: 1.2rem; height: 38px;
}
.pr-med-x:hover { background: #f5d0cb; }

/* ações */
.pr-acoes {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  margin-top: 8px;
}
.pr-imprimir-grupo {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
}

/* histórico lateral */
.pr-historico {
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-md); padding: 20px; position: sticky; top: 20px;
  max-height: calc(100vh - 100px); overflow-y: auto;
}
.pr-hist-item {
  border-left: 3px solid var(--az-500); padding: 4px 0 12px 12px;
  margin-bottom: 14px;
}
.pr-hist-item:last-child { margin-bottom: 0; }
.pr-hist-data {
  font-size: .82rem; font-weight: 700; color: var(--az-900);
}
.pr-hist-data span {
  display: block; font-weight: 400; color: var(--tinta-2); font-size: .76rem;
}
.pr-hist-evol {
  font-size: .84rem; color: var(--tinta-2); margin-top: 5px; line-height: 1.5;
}
.pr-hist-docs { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 6px; }
.pr-hist-docs span {
  font-size: .66rem; font-weight: 700; text-transform: uppercase;
  background: var(--az-50); color: var(--az-700);
  padding: 2px 7px; border-radius: 10px;
}

@media (max-width: 1000px) {
  .pr-grid { grid-template-columns: 1fr; }
  .pr-historico { position: static; max-height: none; }
  .pr-med { grid-template-columns: 1fr 1fr; }
  .pr-med-x { grid-column: span 2; }
}

/* ============================================================
   PRONTUÁRIO — atendimento com menu lateral + evolução
   ============================================================ */
/* cabeçalho do paciente */
.pr-cabecalho {
  display: flex; align-items: center; gap: 16px; margin-bottom: 18px;
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-md); padding: 16px 20px;
}

/* layout: menu lateral + conteúdo */
.pr-layout {
  display: grid; grid-template-columns: 244px 1fr; gap: 18px;
  align-items: start;
}

/* menu lateral do prontuário */
.pr-menu {
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-md); padding: 10px; position: sticky; top: 20px;
  display: flex; flex-direction: column; gap: 2px;
}
.pr-menu-item {
  display: flex; align-items: center; gap: 11px;
  padding: 12px 13px; border-radius: 10px;
  color: var(--tinta-2); font-size: .93rem; font-weight: 500;
  transition: background .14s ease, color .14s ease;
}
.pr-menu-item svg { font-size: 1.2rem; flex-shrink: 0; }
.pr-menu-item span { flex: 1; }
.pr-menu-item:hover { background: var(--az-50); color: var(--az-700); }
.pr-menu-item.ativo { background: var(--az-700); color: #fff; }
.pr-menu-item.desativado {
  color: #aeb6c4; cursor: default;
}
.pr-menu-item.desativado:hover { background: transparent; color: #aeb6c4; }
.pr-menu-soon {
  font-size: .58rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .02em; background: var(--papel-2); color: #aeb6c4;
  padding: 2px 6px; border-radius: 10px; white-space: nowrap;
  flex-shrink: 0;
}
.pr-menu-item span { min-width: 0; }

/* conteúdo da seção */
.pr-conteudo { min-width: 0; }

/* cada evolução registrada */
.pr-evo {
  border-left: 3px solid var(--az-500);
  background: var(--papel-2); border-radius: 0 var(--r-sm) var(--r-sm) 0;
  padding: 12px 16px; margin-bottom: 12px;
}
.pr-evo:last-child { margin-bottom: 0; }
.pr-evo-outro { border-left-color: #c4cbd6; }
.pr-evo-cab {
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 10px; margin-bottom: 6px; flex-wrap: wrap;
}
.pr-evo-cab strong { font-size: .92rem; color: var(--az-900); }
.pr-evo-cab span { font-size: .8rem; color: var(--tinta-2); }
.pr-evo-texto {
  font-size: .93rem; color: var(--tinta); line-height: 1.6;
  white-space: pre-wrap;
}

@media (max-width: 900px) {
  .pr-layout { grid-template-columns: 1fr; }
  .pr-menu { position: static; flex-direction: row; flex-wrap: wrap; }
  .pr-menu-item { flex: 1 1 auto; }
}

/* ============================================================
   AGENDA — visão de DIA (lista de pacientes)
   ============================================================ */
.ag-dia-lista { display: flex; flex-direction: column; gap: 10px; }
.ag-dia-card {
  display: flex; align-items: center; gap: 16px;
  background: #fff; border: 1.5px solid var(--linha);
  border-left: 4px solid var(--c, var(--linha));
  border-radius: var(--r-md); padding: 14px 18px;
  transition: border-color .14s ease;
}
.ag-dia-card:hover { border-color: var(--az-500); }
.ag-dia-hora {
  font-family: 'Fraunces', serif; font-size: 1.3rem;
  color: var(--az-700); min-width: 62px;
}
.ag-dia-card .pac-avatar { width: 44px; height: 44px; font-size: 1rem; }
.ag-dia-info { display: flex; flex-direction: column; min-width: 140px; }
.ag-dia-info strong { font-size: 1.02rem; color: var(--az-900); }
.ag-dia-info span { font-size: .85rem; color: var(--tinta-2); }
.ag-dia-status {
  font-size: .76rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .03em; padding: 4px 11px; border-radius: 20px;
  background: var(--bg, var(--papel-2)); color: var(--c, var(--tinta-2));
}
.ag-dia-acoes {
  margin-left: auto; display: flex; gap: 7px; align-items: center;
  flex-wrap: wrap;
}
.ag-dia-nafila {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: .82rem; font-weight: 600; color: var(--ok);
}
.ag-dia-nafila svg { font-size: 1rem; }

@media (max-width: 820px) {
  .ag-dia-card { flex-wrap: wrap; }
  .ag-dia-acoes { margin-left: 0; width: 100%; }
}

/* ============================================================
   FILA DE ESPERA — abas (na fila / atendidos)
   ============================================================ */
.fila-tabs {
  display: flex; gap: 4px; margin-bottom: 16px;
  border-bottom: 1.5px solid var(--linha);
}
.fila-tab {
  display: flex; align-items: center; gap: 7px;
  padding: 11px 18px; font-size: .92rem; font-weight: 600;
  color: var(--tinta-2); border-bottom: 2.5px solid transparent;
  margin-bottom: -1.5px; transition: color .14s ease, border-color .14s ease;
}
.fila-tab:hover { color: var(--az-700); }
.fila-tab.ativa { color: var(--az-700); border-bottom-color: var(--az-700); }
.fila-tab svg { font-size: 1.1rem; }
.fila-tab-num {
  font-size: .76rem; font-weight: 700;
  background: var(--papel-2); color: var(--tinta-2);
  padding: 1px 8px; border-radius: 12px;
}
.fila-tab.ativa .fila-tab-num { background: var(--az-100); color: var(--az-700); }

/* card de paciente já atendido */
.fila-card-atendido { background: var(--papel-2); }
.fila-card-atendido .fila-status { color: var(--ok); }

/* botão de ação dentro do card de assinatura */
.assinatura-acoes {
  margin-top: 16px; padding-top: 14px;
  border-top: 1px solid var(--linha);
}

/* ============================================================
   MODAL ALTERAR PLANO — stepper de nº de médicos
   ============================================================ */
.pnl-modal-plano { max-width: 380px; }

.plano-stepper {
  display: flex; align-items: center; justify-content: center;
  gap: 14px; margin: 20px 0 4px;
}
.plano-step-btn {
  width: 44px; height: 44px; border-radius: 50%;
  border: 1.5px solid var(--linha); background: #fff;
  color: var(--az-700); cursor: pointer; display: flex;
  align-items: center; justify-content: center;
  transition: background .14s ease, border-color .14s ease;
}
.plano-step-btn svg { font-size: 1.25rem; }
.plano-step-btn:hover:not(:disabled) {
  background: var(--az-100); border-color: var(--az-500);
}
.plano-step-btn:disabled { opacity: .4; cursor: not-allowed; }

#plano-qtd {
  width: 78px; text-align: center; font-family: 'Fraunces', serif;
  font-size: 2rem; color: var(--az-900); border: none;
  background: transparent; -moz-appearance: textfield;
}
#plano-qtd::-webkit-outer-spin-button,
#plano-qtd::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.plano-stepper-rotulo {
  text-align: center; font-size: .85rem; color: var(--tinta-2);
  margin: 0 0 16px;
}

.plano-resumo {
  background: var(--papel-2); border-radius: var(--r-md);
  padding: 14px 16px; text-align: center; margin-bottom: 18px;
}
.plano-resumo span {
  display: block; font-size: .78rem; text-transform: uppercase;
  letter-spacing: .04em; color: var(--tinta-2); margin-bottom: 3px;
}
.plano-resumo strong {
  font-family: 'Fraunces', serif; font-size: 1.7rem; color: var(--az-700);
}
.plano-resumo small {
  display: block; font-size: .8rem; color: var(--tinta-2); margin-top: 4px;
}

#plano-salvar:disabled { opacity: .5; cursor: not-allowed; }

/* ============================================================
   MODAL ALTERAR PLANO — seletor de planos
   ============================================================ */
.plano-opcoes {
  display: flex; flex-direction: column; gap: 8px;
  margin: 18px 0 6px; text-align: left;
}
.plano-opcao {
  display: block; cursor: pointer;
  border: 1.5px solid var(--linha); border-radius: var(--r-sm);
  transition: border-color .14s ease, background .14s ease;
}
.plano-opcao:hover { border-color: var(--az-500); }
.plano-opcao input { position: absolute; opacity: 0; }
.plano-opcao:has(input:checked) {
  border-color: var(--az-700); background: var(--az-50);
}
.plano-opcao-corpo {
  display: flex; align-items: center; justify-content: space-between;
  padding: 11px 15px; gap: 12px;
}
.plano-opcao-nome { font-weight: 600; font-size: .98rem; color: var(--az-900); }
.plano-opcao-preco {
  font-family: 'Fraunces', serif; font-size: 1.25rem; color: var(--az-700);
}
.plano-opcao-preco small {
  font-family: 'Outfit', sans-serif; font-size: .72rem;
  color: var(--tinta-2); font-weight: 500;
}
.plano-opcao:has(input:checked) .plano-opcao-nome::after {
  content: '✓'; margin-left: 7px; color: var(--az-700); font-weight: 700;
}

.plano-limite-aviso {
  font-size: .8rem; color: var(--erro);
  text-align: center; margin: 0 0 12px;
}

/* ============================================================
   MÓDULO FINANCEIRO
   ============================================================ */
.fin-topo {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 16px; margin-bottom: 16px; flex-wrap: wrap;
}
.fin-topo-acoes { display: flex; gap: 8px; flex-wrap: wrap; }
.fin-topo-acoes .btn { padding: 10px 16px; font-size: .9rem; }

/* navegação de mês */
.fin-mesnav {
  display: flex; align-items: center; gap: 12px; margin-bottom: 18px;
}
.fin-mesnav-atual {
  font-family: 'Fraunces', serif; font-size: 1.15rem; color: var(--az-900);
  min-width: 180px; text-align: center;
}

/* cards de totais */
.fin-cards {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
  margin-bottom: 24px;
}
.fin-card {
  background: #fff; border: 1.5px solid var(--linha);
  border-left: 4px solid var(--linha);
  border-radius: var(--r-md); padding: 18px 20px;
}
.fin-card-receber { border-left-color: var(--ok); }
.fin-card-pagar   { border-left-color: var(--erro); }
.fin-card-saldo   { border-left-color: var(--az-600); }
.fin-card-saldo.negativo { border-left-color: var(--erro); }
.fin-card-rotulo {
  font-size: .8rem; text-transform: uppercase; letter-spacing: .04em;
  color: var(--tinta-2); display: block; margin-bottom: 4px;
}
.fin-card-valor {
  font-family: 'Fraunces', serif; font-size: 1.9rem; color: var(--az-900);
  display: block; line-height: 1.1;
}
.fin-card-saldo.negativo .fin-card-valor { color: var(--erro); }
.fin-card-extra {
  font-size: .8rem; color: var(--tinta-2); margin-top: 6px;
  display: inline-flex; align-items: center; gap: 5px;
}
.fin-card-extra.atraso { color: var(--erro); font-weight: 600; }
.fin-card-extra svg { font-size: .95rem; }

/* atalhos para as listas */
.fin-atalhos { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.fin-atalho {
  display: flex; align-items: center; gap: 14px;
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-md); padding: 18px 20px;
  transition: border-color .14s ease, transform .14s ease;
}
.fin-atalho:hover { border-color: var(--az-500); transform: translateY(-2px); }
.fin-atalho > svg:last-child { margin-left: auto; color: var(--tinta-2); }
.fin-atalho strong { display: block; color: var(--az-900); font-size: 1.02rem; }
.fin-atalho span { font-size: .84rem; color: var(--tinta-2); }
.fin-atalho-ico {
  width: 46px; height: 46px; border-radius: 12px; flex-shrink: 0;
  display: grid; place-items: center; font-size: 1.3rem;
}
.fin-atalho-ico.receber { background: #dcfce7; color: var(--ok); }
.fin-atalho-ico.pagar   { background: #fbe9e7; color: var(--erro); }

/* filtros (chips) */
.fin-filtros { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.fin-chip {
  padding: 7px 14px; border-radius: 18px; font-size: .85rem; font-weight: 600;
  background: #fff; border: 1.5px solid var(--linha); color: var(--tinta-2);
}
.fin-chip:hover { border-color: var(--az-500); }
.fin-chip.ativo { background: var(--az-700); color: #fff; border-color: var(--az-700); }

/* tabela de lançamentos */
.fin-tabela {
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-md); overflow: hidden;
}
.fin-linha {
  display: grid;
  grid-template-columns: 130px 1.6fr 1fr .9fr .9fr 1.3fr;
  gap: 14px; align-items: center;
  padding: 13px 18px; border-bottom: 1px solid var(--linha);
  font-size: .9rem;
}
.fin-linha:last-child { border-bottom: none; }
.fin-cabecalho {
  background: var(--papel-2); font-size: .76rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em; color: var(--tinta-2);
}
.fin-venc { font-weight: 600; color: var(--az-900);
  display: flex; align-items: center; gap: 6px; }
.fin-serie { color: var(--az-600); display: inline-flex; }
.fin-serie svg { font-size: .95rem; }
.fin-desc { font-weight: 600; }
.fin-cat { color: var(--tinta-2); font-size: .85rem; }
.fin-valor { font-weight: 700; color: var(--az-900); }
.fin-tag {
  display: inline-block; padding: 3px 10px; border-radius: 14px;
  font-size: .74rem; font-weight: 700;
}
.fin-tag-aberto    { background: var(--az-100); color: var(--az-700); }
.fin-tag-pago      { background: #dcfce7; color: var(--ok); }
.fin-tag-atraso    { background: #fbe9e7; color: var(--erro); }
.fin-tag-cancelado { background: #e5e7eb; color: #6b7280; }
.fin-acoes { display: flex; gap: 6px; flex-wrap: wrap; }
.fin-excluir { cursor: pointer; }

/* formulário */
.fin-form { max-width: 680px; }
.fin-form-acoes {
  display: flex; gap: 10px; justify-content: flex-end; margin-top: 4px;
}
.fin-rec-check {
  display: flex; align-items: flex-start; gap: 12px; cursor: pointer;
}
.fin-rec-check input { margin-top: 3px; width: 18px; height: 18px; }
.fin-rec-check strong { display: block; color: var(--az-900); }
.fin-rec-check small { color: var(--tinta-2); font-size: .84rem; }
.fin-rec-campos { margin-top: 16px; padding-top: 16px;
  border-top: 1px solid var(--linha); }

/* escopo (este / futuros) */
.fin-escopo { display: flex; flex-direction: column; gap: 8px; }
.fin-escopo-op {
  display: flex; align-items: center; gap: 10px; cursor: pointer;
  border: 1.5px solid var(--linha); border-radius: var(--r-sm);
  padding: 11px 14px; font-size: .9rem;
}
.fin-escopo-op:has(input:checked) {
  border-color: var(--az-700); background: var(--az-50);
}
.fin-escopo-op input { width: 17px; height: 17px; }

/* categorias */
.fin-catform {
  display: flex; gap: 14px; align-items: flex-end; flex-wrap: wrap;
}
.fin-cat-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.fin-cat-lista { display: flex; flex-direction: column; gap: 6px; }
.fin-cat-item {
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; padding: 10px 14px; border: 1.5px solid var(--linha);
  border-radius: var(--r-sm); font-size: .9rem;
}
.fin-cat-item span { display: flex; align-items: center; gap: 8px; }
.fin-cat-item svg { color: var(--az-600); }
.fin-cat-item.inativa { opacity: .55; }
.fin-cat-item small { color: var(--tinta-2); }

@media (max-width: 900px) {
  .fin-cards { grid-template-columns: 1fr; }
  .fin-atalhos { grid-template-columns: 1fr; }
  .fin-cat-cols { grid-template-columns: 1fr; }
  .fin-linha { grid-template-columns: 1fr 1fr; gap: 6px; }
  .fin-cabecalho { display: none; }
}

/* ============================================================
   MÓDULO FORMULÁRIOS
   ============================================================ */
.form-topo {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 16px; margin-bottom: 20px; flex-wrap: wrap;
}
.form-topo-acoes { display: flex; gap: 8px; flex-wrap: wrap; }
.form-topo-acoes .btn { padding: 10px 16px; font-size: .9rem; }

/* 3 cards de navegação principal */
.form-cards {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
  margin-bottom: 28px;
}
.form-card {
  display: flex; align-items: center; gap: 14px;
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-md); padding: 20px;
  transition: border-color .14s ease, transform .14s ease,
              box-shadow .14s ease;
}
.form-card:hover {
  border-color: var(--az-500); transform: translateY(-2px);
  box-shadow: 0 6px 16px -8px rgba(29, 78, 216, .18);
}
.form-card > svg:last-child { margin-left: auto; color: var(--tinta-2); flex-shrink: 0; }
.form-card-ico {
  width: 52px; height: 52px; border-radius: 14px; flex-shrink: 0;
  display: grid; place-items: center; font-size: 1.4rem;
}
.form-card-ico.modelos    { background: var(--az-50);  color: var(--az-700); }
.form-card-ico.pacotes    { background: #e0f2fe;        color: var(--ciano); }
.form-card-ico.documentos { background: #dcfce7;        color: var(--ok); }
.form-card-corpo { flex: 1; min-width: 0; }
.form-card-corpo strong {
  display: block; color: var(--az-900); font-size: 1.05rem;
  margin-bottom: 2px;
}
.form-card-corpo span {
  display: block; color: var(--tinta-2); font-size: .85rem;
  line-height: 1.4;
}
.form-card-rodape {
  display: flex; align-items: baseline; gap: 6px; margin-top: 10px;
}
.form-card-num {
  font-family: 'Fraunces', serif; font-size: 1.5rem; color: var(--az-900);
  line-height: 1;
}
.form-card-rotulo { font-size: .78rem; color: var(--tinta-2); }

/* últimos documentos */
.form-recentes {
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-md); overflow: hidden;
}
.form-recentes-topo {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px; border-bottom: 1px solid var(--linha);
  background: var(--papel-2);
}
.form-recentes-topo h2 {
  margin: 0; font-size: 1rem; color: var(--az-900);
  font-family: 'Fraunces', serif;
}
.form-ver-tudo {
  font-size: .85rem; color: var(--az-700); font-weight: 600;
  display: inline-flex; align-items: center; gap: 2px;
}
.form-ver-tudo:hover { color: var(--az-900); }

.form-recentes-lista { display: flex; flex-direction: column; }
.form-recente-item {
  display: flex; align-items: center; gap: 14px;
  padding: 12px 20px; border-bottom: 1px solid var(--linha);
  transition: background .12s ease;
}
.form-recente-item:last-child { border-bottom: none; }
.form-recente-item:hover { background: var(--papel-2); }
.form-recente-ico {
  width: 36px; height: 36px; border-radius: 10px; flex-shrink: 0;
  display: grid; place-items: center; font-size: 1rem;
  background: var(--az-50); color: var(--az-700);
}
.form-recente-ico.assinado  { background: #dcfce7; color: var(--ok); }
.form-recente-ico.cancelado { background: #e5e7eb; color: #6b7280; }
.form-recente-corpo { flex: 1; min-width: 0; }
.form-recente-corpo strong {
  display: block; color: var(--az-900); font-size: .92rem;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.form-recente-corpo span {
  display: block; font-size: .8rem; color: var(--tinta-2);
}
.form-recente-meta {
  display: flex; flex-direction: column; align-items: flex-end; gap: 2px;
  flex-shrink: 0;
}
.form-recente-meta small { font-size: .74rem; color: var(--tinta-2); }

/* tags de status (compartilhadas por telas de formulários) */
.form-tag {
  display: inline-block; padding: 3px 10px; border-radius: 14px;
  font-size: .72rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .03em;
}
.form-tag-assinado  { background: #dcfce7; color: var(--ok); }
.form-tag-rascunho  { background: var(--az-100); color: var(--az-700); }
.form-tag-cancelado { background: #e5e7eb; color: #6b7280; }

@media (max-width: 900px) {
  .form-cards { grid-template-columns: 1fr; }
  .form-recente-meta { flex-direction: row; align-items: center; gap: 8px; }
}

/* ============================================================
   MÓDULO FORMULÁRIOS — telas de modelos e campos
   ============================================================ */

/* formulário geral (criar/editar modelo) */
.form-form {
  width: 100%;
  box-sizing: border-box;
}
.form-form .cfg-bloco {
  box-sizing: border-box;
  max-width: 100%;
}
.form-form-acoes {
  display: flex; gap: 10px; justify-content: flex-end; margin-top: 4px;
}

/* bloco de dicas jurídicas (CFM) ao criar modelo pela 1ª vez */
.form-dicas {
  background: var(--az-50); border: 1.5px solid var(--az-200);
  border-left: 4px solid var(--az-700); border-radius: var(--r-md);
  padding: 16px 20px; margin: 16px 0;
}
.form-dicas-tit {
  display: flex; align-items: center; gap: 8px;
  color: var(--az-900); margin-bottom: 8px;
}
.form-dicas-tit svg { color: var(--az-700); }
.form-dicas ul {
  margin: 8px 0; padding-left: 22px; font-size: .9rem;
  color: var(--az-900); line-height: 1.7;
}
.form-dicas p {
  margin: 10px 0 0; font-size: .85rem; color: var(--tinta-2);
}

/* filtros + busca na lista de modelos */
.form-filtros {
  display: flex; align-items: center; gap: 12px; margin-bottom: 18px;
  flex-wrap: wrap;
}
.form-filtro-busca {
  position: relative; flex: 1; min-width: 240px; max-width: 420px;
}
.form-filtro-busca svg {
  position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
  color: var(--tinta-2); pointer-events: none;
}
.form-filtro-busca input {
  width: 100%; padding: 10px 12px 10px 38px;
  border: 1.5px solid var(--linha); border-radius: var(--r-sm);
  font: inherit; background: #fff; color: var(--tinta);
}
.form-filtro-busca input:focus {
  outline: none; border-color: var(--az-500);
}
.form-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.form-chip {
  padding: 7px 14px; border-radius: 18px; font-size: .85rem; font-weight: 600;
  background: #fff; border: 1.5px solid var(--linha); color: var(--tinta-2);
}
.form-chip:hover { border-color: var(--az-500); }
.form-chip.ativo {
  background: var(--az-700); color: #fff; border-color: var(--az-700);
}

/* lista de modelos */
.form-lista {
  display: flex; flex-direction: column; gap: 10px;
}
.form-item {
  display: flex; align-items: center; gap: 14px;
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-md); padding: 14px 18px;
  transition: border-color .12s ease;
}
.form-item:hover { border-color: var(--az-500); }
.form-item.inativo { opacity: .6; }
.form-item-ico {
  width: 40px; height: 40px; border-radius: 10px; flex-shrink: 0;
  display: grid; place-items: center; font-size: 1.15rem;
  background: var(--az-50); color: var(--az-700);
}
.form-item-corpo { flex: 1; min-width: 0; }
.form-item-corpo strong {
  display: block; color: var(--az-900); font-size: .95rem;
  margin-bottom: 2px;
}
.form-item-meta {
  display: flex; gap: 6px; align-items: center; font-size: .8rem;
  color: var(--tinta-2); flex-wrap: wrap;
}
.form-item-tipo { color: var(--az-700); font-weight: 600; }
.form-item-inativo { color: var(--erro); font-weight: 600; }
.form-item-acoes {
  display: flex; gap: 6px; flex-shrink: 0; flex-wrap: wrap;
}

/* construtor de campos (tela de edição de perguntas) */
.form-novo-campo { margin-bottom: 24px; }
.form-check {
  display: inline-flex; align-items: center; gap: 8px; cursor: pointer;
  margin-top: 20px;
}
.form-check input { width: 17px; height: 17px; }
.campo-obrig { align-self: flex-end; }

.form-campos-tit {
  font-family: 'Fraunces', serif; font-size: 1.1rem;
  color: var(--az-900); margin: 24px 0 12px;
}
.form-campos-lista {
  display: flex; flex-direction: column; gap: 8px;
}
.form-campo-item {
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-md); overflow: hidden;
}
.form-campo-item summary {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 18px; cursor: pointer; list-style: none;
}
.form-campo-item summary::-webkit-details-marker { display: none; }
.form-campo-item summary > svg:last-child {
  color: var(--tinta-2); margin-left: auto;
  transition: transform .18s ease; flex-shrink: 0;
}
.form-campo-item[open] summary > svg:last-child { transform: rotate(180deg); }
.form-campo-item[open] summary {
  border-bottom: 1px solid var(--linha); background: var(--papel-2);
}

.form-campo-ordem {
  width: 28px; height: 28px; border-radius: 50%; flex-shrink: 0;
  background: var(--az-100); color: var(--az-700);
  display: grid; place-items: center;
  font-weight: 700; font-size: .85rem;
}
.form-campo-topo { flex: 1; min-width: 0; }
.form-campo-topo strong {
  display: block; color: var(--az-900); font-size: .95rem;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.form-campo-meta {
  display: flex; gap: 8px; align-items: center; margin-top: 2px;
  font-size: .78rem; color: var(--tinta-2); flex-wrap: wrap;
}
.form-campo-tipo { color: var(--az-700); font-weight: 600; }
.form-campo-obrig {
  background: #fef3c7; color: #b45309; padding: 2px 8px; border-radius: 10px;
  font-weight: 600;
}
.form-campo-opc { color: var(--tinta-2); }

.form-campo-edit { padding: 16px 18px; }
.form-campo-acoes {
  display: flex; justify-content: flex-end; margin-top: 4px;
}
.form-campo-excluir {
  padding: 0 18px 14px; margin-top: -4px;
}

@media (max-width: 760px) {
  .form-item { flex-wrap: wrap; }
  .form-item-acoes { width: 100%; justify-content: flex-end; }
}

/* ============================================================
   MÓDULO FORMULÁRIOS — pacotes (transfer list)
   ============================================================ */

/* ícone diferenciado para itens de pacote na lista */
.form-item-ico.pacote-ico { background: #e0f2fe; color: var(--ciano); }

/* duas colunas lado a lado: Disponíveis / No pacote */
.form-transfer {
  display: grid; grid-template-columns: 1fr 1fr; gap: 16px;
  margin-top: 8px;
}
.form-transfer-col {
  background: var(--papel-2); border: 1.5px solid var(--linha);
  border-radius: var(--r-md); overflow: hidden; min-height: 240px;
  display: flex; flex-direction: column;
}
.form-transfer-tit {
  display: flex; align-items: center; gap: 8px;
  padding: 11px 14px; border-bottom: 1px solid var(--linha);
  font-weight: 700; color: var(--az-900); font-size: .9rem;
  background: #fff;
}
.form-transfer-tit svg { color: var(--az-700); }
.form-transfer-cnt {
  margin-left: auto; font-size: .72rem; font-weight: 700;
  background: var(--az-100); color: var(--az-700);
  padding: 2px 9px; border-radius: 10px;
}
.form-transfer-lista {
  list-style: none; margin: 0; padding: 8px;
  display: flex; flex-direction: column; gap: 6px;
  flex: 1; overflow-y: auto; max-height: 400px;
}
.form-transfer-lista li {
  display: flex; align-items: center; gap: 10px;
  background: #fff; border: 1px solid var(--linha);
  border-radius: 10px; padding: 10px 12px;
}
.form-transfer-lista.destino li { border-left: 3px solid var(--az-700); }
.form-tr-item-ico {
  width: 32px; height: 32px; border-radius: 8px; flex-shrink: 0;
  display: grid; place-items: center; font-size: 1rem;
  background: var(--az-50); color: var(--az-700);
}
.form-tr-ordem {
  width: 28px; height: 28px; border-radius: 50%; flex-shrink: 0;
  background: var(--az-700); color: #fff;
  display: grid; place-items: center;
  font-weight: 700; font-size: .82rem;
}
.form-tr-item-txt { flex: 1; min-width: 0; }
.form-tr-item-txt strong {
  display: block; color: var(--az-900); font-size: .9rem;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.form-tr-item-txt small {
  display: block; color: var(--az-700); font-size: .68rem;
  font-weight: 700; letter-spacing: .04em;
}
.form-tr-mover { display: flex; gap: 2px; flex-shrink: 0; }
.form-tr-btn {
  width: 30px; height: 30px; padding: 0;
  border: 1px solid var(--linha); background: #fff;
  border-radius: 7px; cursor: pointer;
  display: grid; place-items: center;
  color: var(--az-700); transition: background .12s ease;
}
.form-tr-btn:hover { background: var(--az-50); }
.form-tr-btn.remover { color: var(--erro); }
.form-tr-btn.remover:hover { background: #fef2f2; }

.form-transfer-vazio {
  padding: 24px 16px; text-align: center;
  color: var(--tinta-2); font-size: .88rem;
}

@media (max-width: 820px) {
  .form-transfer { grid-template-columns: 1fr; }
}

/* ============================================================
   FORMULÁRIOS — textarea do corpo + ajuda de sintaxe
   ============================================================ */

/* textarea do corpo: fonte legível, bom espaçamento, altura confortável */
.form-corpo {
  width: 100%; box-sizing: border-box;
  min-height: 320px; padding: 14px 16px;
  border: 1.5px solid var(--linha); border-radius: var(--r-md);
  background: #fff; color: var(--tinta);
  font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  font-size: .92rem; line-height: 1.65;
  resize: vertical; tab-size: 2;
}
.form-corpo:focus {
  outline: none; border-color: var(--az-500);
  box-shadow: 0 0 0 3px rgba(29, 78, 216, .08);
}
.form-corpo::placeholder {
  color: var(--tinta-2); font-style: italic;
  font-family: inherit;
}

/* caixa de ajuda com a sintaxe suportada */
.form-sintaxe-ajuda {
  margin-top: 10px; padding: 14px 16px;
  background: var(--papel-2); border: 1px dashed var(--linha);
  border-radius: var(--r-sm);
}
.form-sintaxe-ajuda > strong {
  display: inline-flex; align-items: center; gap: 6px;
  color: var(--az-900); font-size: .9rem;
  margin-bottom: 10px;
}
.form-sintaxe-ajuda > strong svg { color: var(--az-700); }
.form-sintaxe-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px 20px;
  font-size: .85rem;
}
.form-sintaxe-grid > div {
  display: flex; align-items: baseline; gap: 10px;
}
.form-sintaxe-grid code {
  background: #fff; border: 1px solid var(--linha);
  padding: 2px 7px; border-radius: 5px;
  font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  font-size: .82rem; color: var(--az-700);
  white-space: nowrap; flex-shrink: 0;
}
.form-sintaxe-grid > div span {
  color: var(--tinta-2); font-size: .83rem;
}
.form-sintaxe-nota {
  grid-column: 1 / -1;
  margin-top: 6px; padding-top: 8px;
  border-top: 1px dashed var(--linha);
  color: var(--tinta-2); font-size: .8rem; font-style: italic;
}

@media (max-width: 760px) {
  .form-sintaxe-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   MENU LATERAL — submenu de Relatórios
   Faltava este bloco: o painel_base.html usa .pnl-menu-grupo /
   .pnl-menu-pai / .pnl-submenu / .pnl-submenu-item para o item
   Relatórios (que agrupa quatro telas). Sem esses estilos, o
   submenu aparecia desformatado dentro da sidebar.
   ============================================================ */

/* grupo = container do botão-pai + submenu */
.pnl-menu-grupo { margin-bottom: 3px; position: relative; }

/* o botão-pai é um .pnl-menu-item, mas é <button> em vez de <a>:
   herda os estilos do item, só ajusta borda/background padrão */
.pnl-menu-pai {
  width: 100%; border: none; background: transparent;
  text-align: left; cursor: pointer; font-family: inherit;
}

/* seta ao lado direito do botão-pai (chevron-right) */
.pnl-menu-chev {
  margin-left: auto; font-size: 1rem;
  transition: transform .18s ease; flex-shrink: 0;
}
.pnl-menu-pai.expandido .pnl-menu-chev { transform: rotate(90deg); }

/* submenu: inicia fechado (altura zero) */
.pnl-submenu {
  overflow: hidden; max-height: 0;
  transition: max-height .22s ease;
  padding-left: 0;
}
.pnl-submenu.aberto { max-height: 400px; }  /* suficiente p/ ~8 itens */

/* itens do submenu — recuados, menores */
.pnl-submenu-item {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 12px 9px 36px; border-radius: 8px;
  color: var(--tinta-2); font-size: .88rem;
  margin-bottom: 2px;
  transition: background .14s ease, color .14s ease;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pnl-submenu-item:hover { background: var(--az-50); color: var(--az-700); }
.pnl-submenu-item.ativo { background: var(--az-100); color: var(--az-700); font-weight: 600; }
.pnl-submenu-item svg { font-size: 1rem; flex-shrink: 0; }

/* quando a sidebar está colapsada, o submenu vira flutuante:
   aparece à direita do botão como um pequeno menu "popover" */
html[data-side="fechada"] .pnl-side .pnl-submenu {
  position: absolute; left: calc(100% + 8px); top: 0;
  min-width: 220px; max-height: none; overflow: visible;
  background: #fff; border: 1px solid var(--linha);
  border-radius: 10px; padding: 6px;
  box-shadow: 0 10px 24px -8px rgba(11, 31, 58, .18);
  z-index: 50;
}
html[data-side="fechada"] .pnl-side .pnl-submenu:not(.aberto) {
  display: none;
}
html[data-side="fechada"] .pnl-side .pnl-submenu-item {
  padding: 9px 12px;
}
html[data-side="fechada"] .pnl-side .pnl-submenu-item span { display: inline; }
html[data-side="fechada"] .pnl-side .pnl-menu-chev { display: none; }

/* ============================================================
   PRONTUÁRIO — Tela de documentação (envio para tablet)
   ============================================================ */
.docm-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 14px; margin-top: 8px;
}
.docm-card {
  background: #fff; border: 1.5px solid var(--linha);
  border-radius: var(--r-md); padding: 16px;
  display: flex; flex-direction: column; gap: 14px;
}
.docm-card-topo { display: flex; align-items: center; gap: 12px; flex: 1; }
.docm-card-ico {
  width: 44px; height: 44px; border-radius: 10px; flex-shrink: 0;
  display: grid; place-items: center; font-size: 1.2rem;
  background: var(--az-50); color: var(--az-700);
}
.docm-card-ico-pacote { background: #e0f2fe; color: var(--ciano); }
.docm-card-nome strong {
  display: block; color: var(--az-900); font-size: .98rem;
  margin-bottom: 2px;
}
.docm-card-nome small {
  display: block; color: var(--tinta-2); font-size: .8rem;
}
.docm-vazio {
  color: var(--tinta-2); padding: 14px 0;
}
.docm-vazio a { color: var(--az-700); font-weight: 600; }

/* Histórico de links do atendimento */
.docm-links { display: flex; flex-direction: column; gap: 8px; }
.docm-link {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 16px; background: #fff;
  border: 1.5px solid var(--linha); border-radius: var(--r-md);
}
.docm-link-ico {
  width: 36px; height: 36px; border-radius: 50%; flex-shrink: 0;
  display: grid; place-items: center; font-size: 1rem;
  background: var(--papel-2); color: var(--tinta-2);
}
.docm-link-pendente .docm-link-ico   { background: var(--az-50); color: var(--az-700); }
.docm-link-em_uso .docm-link-ico     { background: #fef9c3; color: #a16207; }
.docm-link-concluido .docm-link-ico  { background: #dcfce7; color: var(--ok); }
.docm-link-expirado .docm-link-ico   { background: #fef2f2; color: var(--erro); }
.docm-link-cancelado .docm-link-ico  { background: #f1f5f9; color: var(--tinta-2); }
.docm-link-corpo { flex: 1; min-width: 0; }
.docm-link-corpo strong {
  display: block; color: var(--az-900); font-size: .92rem;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.docm-link-corpo small {
  display: block; color: var(--tinta-2); font-size: .78rem;
}

/* ============================================================
   PRONTUÁRIO — item de menu que vai para página externa
   (como "Documentação" que abre tela de envio ao tablet)
   ============================================================ */
.pron-tab-link-externo {
  border-top: 1px solid var(--linha);
  margin-top: 6px;
  padding-top: 14px;
  color: var(--az-700);
}
.pron-tab-link-externo > svg:last-child {
  margin-left: auto;
  font-size: .9rem;
  opacity: .5;
  transition: transform .14s ease, opacity .14s ease;
}
.pron-tab-link-externo:hover > svg:last-child {
  opacity: 1;
  transform: translateX(2px);
}

/* Badge contador nas abas do histórico (ex.: Documentos [2]) */
.pron-hist-badge {
  display: inline-block;
  background: var(--az-700); color: #fff;
  font-size: .7rem; font-weight: 700;
  padding: 2px 7px; border-radius: 10px;
  margin-left: 4px; vertical-align: middle;
}
.pron-hist-tab.ativo .pron-hist-badge {
  background: #fff; color: var(--az-700);
}

/* Botão "Documentação" no topo do atendimento (envia ao tablet) */
.btn-pron-doc {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 12px; border-radius: var(--r-sm);
  background: #e0f2fe; color: #0369a1;
  font-size: .88rem; font-weight: 600;
  text-decoration: none; border: 1px solid #bae6fd;
  transition: background .14s ease;
}
.btn-pron-doc:hover { background: #bae6fd; }
.btn-pron-doc kbd {
  background: rgba(3, 105, 161, .1); color: #0369a1;
  font-size: .7rem; padding: 1px 5px; border-radius: 3px;
  font-family: inherit;
}

/* Contador no título "Documentos" do resumo clínico */
.pron-resumo-contador {
  display: inline-block;
  background: var(--az-100); color: var(--az-700);
  font-size: .7rem; font-weight: 700;
  padding: 1px 7px; border-radius: 10px;
  margin-left: 4px; vertical-align: middle;
}

/* Lista de documentos no resumo lateral */
.pron-docs-lista li { align-items: flex-start; }
.pron-docs-lista li span { flex: 1; }
.pron-resumo-mais {
  display: block; margin-top: 6px;
  color: var(--tinta-2); font-size: .78rem;
  font-style: italic; text-align: center;
}

/* ============================================================
   PRONTUÁRIO — Tela de Documentação
   (envio de modelos/pacotes ao tablet + histórico)
   ============================================================ */
.pron-doc { max-width: 1200px; margin: 0 auto; }

/* Topo com paciente */
.pron-doc-topo {
  display: flex; flex-direction: column; gap: 14px;
  margin-bottom: 24px;
}
.pron-doc-paciente {
  display: flex; align-items: center; gap: 16px;
}
.pron-doc-paciente-avatar {
  width: 56px; height: 56px; border-radius: 50%;
  background: var(--az-100); color: var(--az-700);
  display: grid; place-items: center;
  font-size: 1.5rem; font-weight: 700;
  font-family: 'Fraunces', serif;
  flex-shrink: 0;
}
.pron-doc-paciente h1 {
  font-family: 'Fraunces', serif; font-size: 1.6rem;
  color: var(--az-900); margin: 0;
}
.pron-doc-paciente p {
  color: var(--tinta-2); margin: 2px 0 0; font-size: .92rem;
}
.pron-doc-paciente p strong { color: var(--az-900); }

/* Caixa de aviso explicativa */
.pron-doc-aviso {
  display: flex; gap: 12px; align-items: flex-start;
  background: var(--az-50); border: 1px solid var(--az-100);
  border-left: 3px solid var(--az-700);
  border-radius: var(--r-md); padding: 14px 18px;
  margin-bottom: 24px; font-size: .9rem;
  color: var(--tinta); line-height: 1.5;
}
.pron-doc-aviso > svg {
  color: var(--az-700); flex-shrink: 0; margin-top: 2px;
}
.pron-doc-aviso strong {
  display: block; color: var(--az-900);
  margin-bottom: 4px; font-size: .95rem;
}

/* Blocos (Modelos, Pacotes, Histórico) */
.pron-doc-bloco {
  background: #fff; border: 1px solid var(--linha);
  border-radius: var(--r-md); padding: 20px 24px;
  margin-bottom: 20px;
}
.pron-doc-bloco h2 {
  display: flex; align-items: center; gap: 10px;
  font-family: 'Fraunces', serif; font-size: 1.2rem;
  color: var(--az-900); margin: 0 0 4px;
  font-weight: 600;
}
.pron-doc-bloco h2 svg { color: var(--az-700); font-size: 1.2rem; }
.pron-doc-sub {
  color: var(--tinta-2); font-size: .88rem;
  margin: 0 0 16px;
}
.pron-doc-badge {
  display: inline-block; background: var(--az-700); color: #fff;
  font-size: .72rem; font-weight: 700;
  padding: 3px 9px; border-radius: 10px;
  margin-left: 6px;
}

/* Grade de cards (modelos e pacotes) */
.pron-doc-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 12px;
}
.pron-doc-card {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 16px; background: #fff;
  border: 1.5px solid var(--linha); border-radius: var(--r-md);
  transition: border-color .14s ease, transform .08s ease;
  margin: 0;  /* reset form */
}
.pron-doc-card:hover {
  border-color: var(--az-500);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px -4px rgba(29, 78, 216, .1);
}
.pron-doc-card-ico {
  width: 42px; height: 42px; border-radius: 10px;
  display: grid; place-items: center;
  font-size: 1.15rem; flex-shrink: 0;
}
.pron-doc-card-ico-modelo { background: var(--az-50); color: var(--az-700); }
.pron-doc-card-ico-pacote { background: #e0f2fe; color: var(--ciano); }

.pron-doc-card-info { flex: 1; min-width: 0; }
.pron-doc-card-info strong {
  display: block; color: var(--az-900); font-size: .95rem;
  margin-bottom: 2px; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap;
}
.pron-doc-card-info small {
  display: block; color: var(--tinta-2); font-size: .78rem;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

.pron-doc-enviar {
  width: 40px; height: 40px; border-radius: 10px;
  background: var(--az-700); color: #fff;
  border: none; cursor: pointer;
  display: grid; place-items: center; flex-shrink: 0;
  transition: background .14s ease;
}
.pron-doc-enviar:hover { background: var(--az-900); }

.pron-doc-vazio {
  color: var(--tinta-2); padding: 20px;
  text-align: center; font-size: .95rem;
  background: var(--papel-2); border-radius: var(--r-sm);
}
.pron-doc-vazio a {
  display: inline-flex; align-items: center; gap: 4px;
  color: var(--az-700); font-weight: 600; margin-left: 8px;
}

/* ========= Histórico de links ========= */
.pron-doc-historico {
  display: flex; flex-direction: column; gap: 10px;
}
.pron-doc-link {
  display: flex; align-items: flex-start; gap: 14px;
  padding: 16px; background: #fff;
  border: 1.5px solid var(--linha); border-radius: var(--r-md);
  position: relative;
}
.pron-doc-link-pendente  { border-left: 3px solid var(--az-700); }
.pron-doc-link-em_uso    { border-left: 3px solid #eab308; }
.pron-doc-link-concluido { border-left: 3px solid var(--ok); }
.pron-doc-link-expirado  { border-left: 3px solid var(--erro); opacity: .7; }
.pron-doc-link-cancelado { border-left: 3px solid var(--tinta-2); opacity: .6; }

.pron-doc-link-ico {
  width: 36px; height: 36px; border-radius: 50%; flex-shrink: 0;
  display: grid; place-items: center; font-size: 1rem;
  background: var(--papel-2); color: var(--tinta-2);
}
.pron-doc-link-pendente .pron-doc-link-ico  { background: var(--az-50); color: var(--az-700); }
.pron-doc-link-em_uso .pron-doc-link-ico    { background: #fef9c3; color: #a16207; }
.pron-doc-link-concluido .pron-doc-link-ico { background: #dcfce7; color: var(--ok); }
.pron-doc-link-expirado .pron-doc-link-ico  { background: #fef2f2; color: var(--erro); }

.pron-doc-link-corpo { flex: 1; min-width: 0; }
.pron-doc-link-corpo header {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin-bottom: 8px;
}
.pron-doc-link-corpo header strong {
  color: var(--az-900); font-size: 1rem;
}

.pron-doc-status {
  display: inline-block; padding: 3px 10px; border-radius: 12px;
  font-size: .72rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em;
}
.pron-doc-status-pendente  { background: var(--az-100); color: var(--az-700); }
.pron-doc-status-em_uso    { background: #fef9c3; color: #a16207; }
.pron-doc-status-concluido { background: #dcfce7; color: var(--ok); }
.pron-doc-status-expirado  { background: #fef2f2; color: var(--erro); }
.pron-doc-status-cancelado { background: #f1f5f9; color: var(--tinta-2); }

.pron-doc-link-meta {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 4px;
}
.pron-doc-link-meta li {
  display: flex; align-items: center; gap: 6px;
  color: var(--tinta-2); font-size: .82rem;
}
.pron-doc-link-meta li svg { font-size: .82rem; opacity: .6; }
.pron-doc-link-meta li strong { color: var(--tinta); font-weight: 600; }

.pron-doc-link-acoes {
  display: flex; flex-direction: column; gap: 6px;
  flex-shrink: 0; min-width: 160px;
}
.pron-doc-acao {
  display: inline-flex; align-items: center; justify-content: center;
  gap: 6px; padding: 8px 14px;
  border-radius: var(--r-sm); border: 1px solid var(--linha);
  background: #fff; color: var(--az-700);
  font-size: .85rem; font-weight: 600;
  text-decoration: none; cursor: pointer;
  font-family: inherit;
  transition: background .14s ease;
}
.pron-doc-acao:hover { background: var(--papel-2); }
.pron-doc-acao.primaria {
  background: var(--az-700); color: #fff; border-color: var(--az-700);
}
.pron-doc-acao.primaria:hover { background: var(--az-900); }
.pron-doc-acao-info {
  color: var(--tinta-2); font-size: .85rem;
  display: inline-flex; align-items: center; gap: 4px;
  padding: 8px 0;
}

/* Toast de "link copiado" */
.pron-doc-toast {
  position: fixed; bottom: 20px; left: 50%;
  transform: translateX(-50%) translateY(100px);
  background: var(--az-900); color: #fff;
  padding: 12px 20px; border-radius: var(--r-sm);
  font-size: .9rem; z-index: 1000;
  box-shadow: 0 8px 24px -8px rgba(0,0,0,.3);
  transition: transform .25s ease, opacity .25s ease;
  opacity: 0; pointer-events: none;
}
.pron-doc-toast.visivel {
  transform: translateX(-50%) translateY(0);
  opacity: 1;
}

/* Responsivo */
@media (max-width: 760px) {
  .pron-doc-link { flex-wrap: wrap; }
  .pron-doc-link-acoes { width: 100%; flex-direction: row; }
  .pron-doc-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   PRONTUÁRIO — Seção Documentação (interna, mesmo padrão do resto)
   Prefixo pr-doc-* para seguir o padrão do seu prontuario_atender.
   ============================================================ */

/* Caixa de aviso explicativa (como funciona) */
.pr-doc-aviso {
  display: flex; gap: 12px; align-items: flex-start;
  background: var(--az-50); border: 1px solid var(--az-100);
  border-left: 3px solid var(--az-700);
  border-radius: var(--r-md); padding: 14px 18px;
  margin-bottom: 20px; font-size: .9rem;
  color: var(--tinta); line-height: 1.5;
}
.pr-doc-aviso > svg {
  color: var(--az-700); flex-shrink: 0; margin-top: 2px;
}
.pr-doc-aviso strong {
  display: block; color: var(--az-900);
  margin-bottom: 4px; font-size: .95rem;
}

/* Blocos (Modelos, Pacotes, Histórico) */
.pr-doc-bloco {
  background: #fff; border: 1px solid var(--linha);
  border-radius: var(--r-md); padding: 18px 22px;
  margin-bottom: 18px;
}
.pr-doc-bloco h3 {
  display: flex; align-items: center; gap: 10px;
  font-family: 'Fraunces', serif; font-size: 1.15rem;
  color: var(--az-900); margin: 0 0 4px;
  font-weight: 600;
}
.pr-doc-bloco h3 svg { color: var(--az-700); font-size: 1.1rem; }
.pr-doc-sub {
  color: var(--tinta-2); font-size: .86rem;
  margin: 0 0 14px;
}
.pr-doc-badge {
  display: inline-block; background: var(--az-700); color: #fff;
  font-size: .7rem; font-weight: 700;
  padding: 3px 9px; border-radius: 10px;
  margin-left: 6px;
}

/* Grade de cards (modelos e pacotes) */
.pr-doc-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 10px;
}
.pr-doc-card {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 14px; background: #fff;
  border: 1.5px solid var(--linha); border-radius: var(--r-md);
  transition: border-color .14s ease, transform .08s ease;
  margin: 0;  /* reset form */
}
.pr-doc-card:hover {
  border-color: var(--az-500);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px -4px rgba(29, 78, 216, .1);
}
.pr-doc-card-ico {
  width: 40px; height: 40px; border-radius: 10px;
  display: grid; place-items: center;
  font-size: 1.1rem; flex-shrink: 0;
}
.pr-doc-card-ico-modelo { background: var(--az-50); color: var(--az-700); }
.pr-doc-card-ico-pacote { background: #e0f2fe; color: var(--ciano); }

.pr-doc-card-info { flex: 1; min-width: 0; }
.pr-doc-card-info strong {
  display: block; color: var(--az-900); font-size: .94rem;
  margin-bottom: 2px; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap;
}
.pr-doc-card-info small {
  display: block; color: var(--tinta-2); font-size: .77rem;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pr-doc-enviar {
  width: 38px; height: 38px; border-radius: 10px;
  background: var(--az-700); color: #fff;
  border: none; cursor: pointer;
  display: grid; place-items: center; flex-shrink: 0;
  transition: background .14s ease;
}
.pr-doc-enviar:hover { background: var(--az-900); }

.pr-doc-vazio {
  color: var(--tinta-2); padding: 18px;
  text-align: center; font-size: .92rem;
  background: var(--papel-2); border-radius: var(--r-sm);
}
.pr-doc-vazio a {
  display: inline-flex; align-items: center; gap: 4px;
  color: var(--az-700); font-weight: 600; margin-left: 8px;
}

/* Histórico de links */
.pr-doc-historico { display: flex; flex-direction: column; gap: 10px; }
.pr-doc-link {
  display: flex; align-items: flex-start; gap: 14px;
  padding: 14px; background: #fff;
  border: 1.5px solid var(--linha); border-radius: var(--r-md);
}
.pr-doc-link-pendente  { border-left: 3px solid var(--az-700); }
.pr-doc-link-em_uso    { border-left: 3px solid #eab308; }
.pr-doc-link-concluido { border-left: 3px solid var(--ok); }
.pr-doc-link-expirado  { border-left: 3px solid var(--erro); opacity: .7; }
.pr-doc-link-cancelado { border-left: 3px solid var(--tinta-2); opacity: .6; }

.pr-doc-link-ico {
  width: 36px; height: 36px; border-radius: 50%; flex-shrink: 0;
  display: grid; place-items: center; font-size: 1rem;
  background: var(--papel-2); color: var(--tinta-2);
}
.pr-doc-link-pendente  .pr-doc-link-ico { background: var(--az-50); color: var(--az-700); }
.pr-doc-link-em_uso    .pr-doc-link-ico { background: #fef9c3; color: #a16207; }
.pr-doc-link-concluido .pr-doc-link-ico { background: #dcfce7; color: var(--ok); }
.pr-doc-link-expirado  .pr-doc-link-ico { background: #fef2f2; color: var(--erro); }

.pr-doc-link-corpo { flex: 1; min-width: 0; }
.pr-doc-link-corpo header {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin-bottom: 8px;
}
.pr-doc-link-corpo header strong {
  color: var(--az-900); font-size: 1rem;
}

.pr-doc-status {
  display: inline-block; padding: 3px 10px; border-radius: 12px;
  font-size: .7rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em;
}
.pr-doc-status-pendente  { background: var(--az-100); color: var(--az-700); }
.pr-doc-status-em_uso    { background: #fef9c3; color: #a16207; }
.pr-doc-status-concluido { background: #dcfce7; color: var(--ok); }
.pr-doc-status-expirado  { background: #fef2f2; color: var(--erro); }
.pr-doc-status-cancelado { background: #f1f5f9; color: var(--tinta-2); }

.pr-doc-link-meta {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 4px;
}
.pr-doc-link-meta li {
  display: flex; align-items: center; gap: 6px;
  color: var(--tinta-2); font-size: .82rem;
}
.pr-doc-link-meta li svg { font-size: .82rem; opacity: .6; }
.pr-doc-link-meta li strong { color: var(--tinta); font-weight: 600; }

.pr-doc-link-acoes {
  display: flex; flex-direction: column; gap: 6px;
  flex-shrink: 0; min-width: 150px;
}
.pr-doc-acao {
  display: inline-flex; align-items: center; justify-content: center;
  gap: 6px; padding: 8px 12px;
  border-radius: var(--r-sm); border: 1px solid var(--linha);
  background: #fff; color: var(--az-700);
  font-size: .84rem; font-weight: 600;
  text-decoration: none; cursor: pointer;
  font-family: inherit;
  transition: background .14s ease;
}
.pr-doc-acao:hover { background: var(--papel-2); }
.pr-doc-acao.primaria {
  background: var(--az-700); color: #fff; border-color: var(--az-700);
}
.pr-doc-acao.primaria:hover { background: var(--az-900); }
.pr-doc-acao-info {
  color: var(--tinta-2); font-size: .84rem;
  display: inline-flex; align-items: center; gap: 4px;
  padding: 8px 0;
}

/* Toast */
.pr-doc-toast {
  position: fixed; bottom: 20px; left: 50%;
  transform: translateX(-50%) translateY(100px);
  background: var(--az-900); color: #fff;
  padding: 12px 20px; border-radius: var(--r-sm);
  font-size: .9rem; z-index: 1000;
  box-shadow: 0 8px 24px -8px rgba(0,0,0,.3);
  transition: transform .25s ease, opacity .25s ease;
  opacity: 0; pointer-events: none;
}
.pr-doc-toast.visivel {
  transform: translateX(-50%) translateY(0);
  opacity: 1;
}

@media (max-width: 760px) {
  .pr-doc-link { flex-wrap: wrap; }
  .pr-doc-link-acoes { width: 100%; flex-direction: row; }
  .pr-doc-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   FORMULÁRIOS — Visualização do documento assinado
   ============================================================ */
.fass { max-width: 1000px; margin: 0 auto; }

/* Topo */
.fass-topo {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; margin-bottom: 16px; flex-wrap: wrap;
}
.fass-topo-acoes { display: flex; align-items: center; gap: 12px; }
.fass-nav-pacote {
  display: flex; align-items: center; gap: 10px;
  background: #fff; border: 1px solid var(--linha);
  border-radius: var(--r-sm); padding: 6px 12px;
}
.fass-nav-pos {
  color: var(--tinta-2); font-size: .9rem;
}
.fass-nav-pos strong { color: var(--az-900); }

/* Cabeçalho do documento */
.fass-cabecalho {
  display: flex; align-items: center; gap: 16px;
  background: #fff; border: 1px solid var(--linha);
  border-left: 4px solid var(--ok);
  border-radius: var(--r-md); padding: 20px 24px;
  margin-bottom: 20px;
}
.fass-cab-ico {
  width: 48px; height: 48px; border-radius: 12px;
  background: #dcfce7; color: var(--ok);
  display: grid; place-items: center;
  font-size: 1.4rem; flex-shrink: 0;
}
.fass-cab-corpo { flex: 1; min-width: 0; }
.fass-cab-corpo h1 {
  font-family: 'Fraunces', serif; font-size: 1.4rem;
  color: var(--az-900); margin: 0 0 6px;
}
.fass-cab-meta {
  display: flex; gap: 16px; flex-wrap: wrap;
  color: var(--tinta-2); font-size: .88rem;
}
.fass-cab-meta span {
  display: inline-flex; align-items: center; gap: 5px;
}
.fass-cab-meta strong { color: var(--az-900); font-weight: 600; }
.fass-cab-status {
  display: flex; flex-direction: column; align-items: flex-end;
  gap: 4px; flex-shrink: 0;
}
.fass-cab-status small {
  color: var(--tinta-2); font-size: .78rem;
}

/* Bloco genérico */
.fass-bloco {
  background: #fff; border: 1px solid var(--linha);
  border-radius: var(--r-md); padding: 20px 24px;
  margin-bottom: 16px;
}
.fass-bloco > h2 {
  display: flex; align-items: center; gap: 8px;
  font-family: 'Fraunces', serif; font-size: 1.15rem;
  color: var(--az-900); margin: 0 0 14px;
  padding-bottom: 10px; border-bottom: 1px solid var(--linha);
}
.fass-contador {
  background: var(--az-700); color: #fff;
  font-size: .7rem; font-weight: 700;
  padding: 2px 9px; border-radius: 10px;
  font-family: 'Outfit', sans-serif;
}

/* Corpo do termo */
.fass-corpo {
  color: var(--tinta); font-size: 1rem; line-height: 1.6;
}
.fass-corpo p { margin: 0 0 1em; }
.fass-corpo h3 {
  color: var(--az-900); font-family: 'Fraunces', serif;
  font-size: 1.15rem; margin: 1.5em 0 .5em; font-weight: 600;
}
.fass-corpo h4 {
  color: var(--az-900); font-size: 1rem;
  margin: 1.2em 0 .4em; font-weight: 600;
}
.fass-corpo strong { color: var(--az-900); font-weight: 700; }
.fass-corpo ul, .fass-corpo ol {
  margin: 0 0 1em; padding-left: 1.6em;
}
.fass-corpo li { margin-bottom: .3em; }

/* Respostas */
.fass-respostas {
  display: flex; flex-direction: column; gap: 12px;
}
.fass-resp {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
  padding: 12px; background: var(--papel-2);
  border-radius: var(--r-sm);
}
.fass-resp-rotulo {
  color: var(--tinta); font-weight: 500; font-size: .95rem;
}
.fass-resp-valor {
  color: var(--az-900); font-size: .95rem;
}
.fass-resp-valor em { color: var(--tinta-2); font-style: italic; }

/* Sim/Não visual */
.fass-resp-sim {
  color: var(--ok); display: inline-flex; align-items: center; gap: 4px;
}
.fass-resp-nao {
  color: var(--erro); display: inline-flex; align-items: center; gap: 4px;
}

/* Multiescolha */
.fass-resp-valor-multiescolha ul {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 4px;
}
.fass-resp-valor-multiescolha li {
  display: inline-flex; align-items: center; gap: 6px;
}
.fass-resp-valor-multiescolha li svg {
  color: var(--ok); font-size: .9rem;
}

/* Textos longos quebram linha */
.fass-resp-valor-texto_longo { white-space: pre-wrap; }

/* Assinatura */
.fass-assinatura {
  background: #fff; border: 1px solid var(--linha);
  border-radius: var(--r-md); padding: 30px 40px;
  text-align: center; max-width: 500px; margin: 0 auto;
}
.fass-assinatura img {
  max-width: 100%; height: auto; max-height: 180px;
  display: block; margin: 0 auto;
}
.fass-assinatura-linha {
  border-top: 1px solid var(--az-900);
  margin: 10px 20px 8px;
}
.fass-assinatura-nome {
  font-family: 'Fraunces', serif;
  color: var(--az-900); font-size: .95rem;
}

/* Auditoria */
.fass-auditoria { border-left: 3px solid var(--az-700); }
.fass-auditoria-aviso {
  color: var(--tinta-2); font-size: .88rem;
  margin: 0 0 16px; line-height: 1.5;
}
.fass-auditoria-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
}
.fass-auditoria-grid > div {
  background: var(--papel-2); border-radius: var(--r-sm);
  padding: 12px 14px;
}
.fass-auditoria-grid small {
  display: block; color: var(--tinta-2);
  font-size: .78rem; margin-bottom: 4px;
  text-transform: uppercase; letter-spacing: .04em;
}
.fass-auditoria-grid strong { color: var(--az-900); font-size: .9rem; }
.fass-auditoria-grid code {
  background: #fff; color: var(--tinta); font-size: .8rem;
  padding: 2px 6px; border-radius: 3px;
  font-family: 'Menlo', monospace;
  word-break: break-all;
}
.fass-ua { grid-column: 1 / -1; }

/* Aviso para rascunho */
.fass-aviso-rascunho {
  display: flex; gap: 12px; align-items: flex-start;
  background: var(--az-50); border-left: 3px solid var(--az-700);
}
.fass-aviso-rascunho > svg {
  color: var(--az-700); flex-shrink: 0; margin-top: 2px;
}
.fass-aviso-rascunho strong {
  display: block; color: var(--az-900);
  margin-bottom: 4px; font-size: .95rem;
}

/* Impressão */
@media print {
  .pr-voltar, .fass-topo-acoes, .pnl-side, .pnl-topo { display: none !important; }
  .fass-cabecalho { page-break-after: avoid; }
  .fass-bloco { page-break-inside: avoid; }
  body { background: #fff; }
  .fass-bloco { border: none; box-shadow: none; }
}

@media (max-width: 700px) {
  .fass-resp { grid-template-columns: 1fr; }
  .fass-cabecalho { flex-wrap: wrap; }
}