/* ============================================================
   Prontuário APS — módulo único (out/2026). Prefixo pa-*.
   Base: mc-modulo.css (mm-*, tokens --p-*, tons mm-tom-*). Aqui só o
   que é próprio das listas do território vindas do PEC: barra de
   filtros, exportação, paginação, cidadão, alertas e o Painel.
   ============================================================ */

/* ---- Barra de filtros ---- */
.pa-filtros .mm-periodo-lbl { min-width: 168px; }
.pa-filtros .mm-search { max-width: 300px; min-width: 200px; }
.pa-carregando { display: inline-flex; align-items: center; gap: 7px; font-size: .72rem; font-weight: 700; color: var(--p-muted); white-space: nowrap; }
.pa-carregando .mm-spin-sm,
.pa-exportar-spin .mm-spin-sm {
    display: inline-block; width: 14px; height: 14px; border-radius: 50%;
    border: 2px solid var(--p-blue-line-soft); border-top-color: var(--p-blue);
    animation: mmSpin .8s linear infinite;
}

/* ---- Exportação ---- */
.pa-exportar button { height: 28px; padding: 0 9px; font-size: .7rem; }
.pa-exportar button:disabled { opacity: .5; }
.pa-exportar-spin { display: inline-flex; align-items: center; padding: 0 6px; }

/* ---- Paginação ---- */
.pa-paginacao {
    display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
    padding: 10px 14px; border-top: 1px solid var(--p-border);
    font-size: .72rem; font-weight: 600; color: var(--p-muted);
}
.pa-pag-n { min-width: 52px; text-align: center; font-size: .72rem; font-weight: 800; color: var(--p-ink); }

/* ---- Cidadão (avatar pelo sexo; clique abre a árvore familiar) ---- */
.pa-av { cursor: pointer; font-size: 15px; background: linear-gradient(135deg, #64748b, #334155); }
.pa-av.f { background: linear-gradient(135deg, #db2777, #9333ea); }
.pa-av.m { background: linear-gradient(135deg, #0891b2, #2563eb); }
.pa-av:hover { filter: brightness(1.08); box-shadow: 0 0 0 3px var(--p-blue-line-soft); }
.pa-cidadao { max-width: 280px; }
.pa-aviso { color: var(--p-orange) !important; }
.pa-sem-nome { color: var(--p-faint) !important; font-style: italic; font-weight: 600 !important; }

/* ---- Tabela das listas ---- */
.pa-tbl th, .pa-tbl td { padding: 8px 10px; }
.pa-tbl td.ctr, .pa-tbl th.ctr { text-align: center; }
.pa-tbl .pa-sub { display: block; font-size: .64rem; font-weight: 600; color: var(--p-faint); margin-top: 1px; }
.pa-alertas { display: flex; flex-wrap: wrap; gap: 3px 4px; max-width: 460px; }
.pa-alertas .mm-chip { font-size: .6rem; padding: .1rem .45rem; }
.pa-triagem { display: inline-flex; gap: 3px; }
.mm-tag.pa-tag-ok { background: var(--p-green-soft); color: var(--p-green); }
.mm-tag.pa-tag-nao { background: var(--p-red-soft); color: var(--p-red); }
.pa-sim { color: var(--p-green); font-weight: 800; }
.pa-nao { color: var(--p-faint); font-weight: 600; }
.pa-ruim { color: var(--p-red); font-weight: 800; }
.pa-fonte { display: inline-flex; align-items: center; gap: 5px; font-size: .66rem; font-weight: 700; color: var(--p-faint); }
.pa-fonte i { font-size: 13px; color: var(--p-teal); }

/* ---- Cobertura vacinal ---- */
.mm-f.pa-f-c1 { grid-column: span 1; }
.pa-tbl tr.pa-total td { background: var(--p-soft); color: var(--p-ink); font-weight: 800; border-top: 1px solid var(--p-border); }
.mm-bar-row.pa-cob { grid-template-columns: 1fr 52px; }

/* ---- Painel: cartões das linhas de cuidado ---- */
.pa-linhas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.pa-linha { display: flex; flex-direction: column; }
.pa-linha .mm-card-head > i { color: var(--tom, var(--p-blue)); }
.pa-linha-num { display: flex; align-items: baseline; gap: 8px; }
.pa-linha-num b { font-size: 1.9rem; font-weight: 800; color: var(--p-ink); letter-spacing: -.8px; line-height: 1; }
.pa-linha-num span { font-size: .74rem; font-weight: 600; color: var(--p-muted); }
.pa-linha-meta { font-size: .7rem; font-weight: 600; color: var(--p-faint); margin-top: 4px; }
.pa-linha .mm-bars { margin-top: 12px; }
.pa-linha .mm-bar-row { grid-template-columns: minmax(120px, 52%) 1fr auto; text-decoration: none; }
.pa-linha a.mm-bar-row:hover .mm-bar-lbl { color: var(--p-blue); }
.pa-linha .mm-card-body { flex: 1; }
.pa-linha-erro { font-size: .72rem; font-weight: 600; color: var(--p-orange); }
.pa-esqueleto { height: 12px; border-radius: 6px; background: linear-gradient(90deg, var(--p-soft2), var(--p-soft), var(--p-soft2)); background-size: 200% 100%; animation: paBrilho 1.2s ease-in-out infinite; }
@keyframes paBrilho { 0% { background-position: 100% 0; } 100% { background-position: -100% 0; } }

/* ---- Pé diabético: formulário (modal) ---- */
.pa-pe-paciente { margin-bottom: 14px; }
.pa-obrig { color: var(--p-red); }
.pa-pe-abas { margin-bottom: 14px; flex-wrap: wrap; }
.pa-pe-card .mm-card-head { min-height: 44px; padding: 8px 14px; }
.pa-pe-mapa { display: flex; justify-content: center; }
.pa-pe-svg { width: 170px; height: 270px; }
.pa-pe-contorno { fill: #fde8d0; stroke: #d4a574; stroke-width: 1.5; }
.pa-pe-ponto { cursor: pointer; }
.pa-pe-ponto circle { transition: transform .15s; transform-box: fill-box; transform-origin: center; }
.pa-pe-ponto:hover circle { transform: scale(1.25); }
.pa-pe-ponto.ok circle { fill: var(--p-green); }
.pa-pe-ponto.alt circle { fill: var(--p-red); }
.pa-pe-ponto text { fill: #fff; font-size: 9px; font-weight: 800; pointer-events: none; }
.pa-checks { display: flex; flex-direction: column; gap: 6px; }
.pa-check {
    display: flex; align-items: center; gap: 9px; margin: 0; cursor: pointer;
    padding: 8px 11px; border-radius: 10px; border: 1px solid var(--p-border); background: var(--p-surface);
    font-size: .78rem; font-weight: 600; color: var(--p-text); transition: all .15s;
}
.pa-check input { width: 16px; height: 16px; accent-color: var(--tom, var(--p-blue-light)); flex: none; }
.pa-check:hover { border-color: var(--p-blue-line); }
.pa-check.on { background: var(--tom-soft, var(--p-blue-soft)); border-color: var(--tom-line, var(--p-blue-line)); color: var(--tom, var(--p-blue)); }
.pa-pulso { display: flex; width: 100%; }
.pa-pulso button { flex: 1; justify-content: center; }
.pa-pulso button.on.pa-pulso-presente { color: var(--p-green); }
.pa-pulso button.on.pa-pulso-diminuido { color: var(--p-yellow); }
.pa-pulso button.on.pa-pulso-ausente { color: var(--p-red); }
.pa-soap { font-size: .72rem; color: var(--p-text); margin-top: 4px; line-height: 1.45; }
.pa-soap b { color: var(--p-ink); margin-right: 4px; }
.mm-mfoot .mm-spin-sm { display: inline-block; width: 14px; height: 14px; border-radius: 50%; border: 2px solid rgba(255,255,255,.45); border-top-color: #fff; animation: mmSpin .8s linear infinite; }

/* ---- Barras clicáveis (filtro por categoria) ---- */
button.mm-bar-row.pa-bar-btn { width: 100%; border: 0; background: transparent; padding: 3px 4px; border-radius: 8px; text-align: left; font: inherit; cursor: pointer; }
button.mm-bar-row.pa-bar-btn:hover, button.mm-bar-row.pa-bar-btn.on { background: var(--p-soft); }
button.mm-bar-row.pa-bar-btn.on .mm-bar-lbl { color: var(--p-blue); font-weight: 800; }

/* ---- Histórico: abas por tipo ---- */
.mm-seg.pa-tipos { align-self: flex-start; flex-wrap: wrap; }
.pa-marcadores { font-size: .7rem; color: var(--p-text); }

/* ---- Prontuário odontológico: odontograma anatômico (FDI) ---- */
.pa-legenda { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-bottom: 14px; }
.pa-legenda .sw { border: 1px solid var(--p-border); }
.pa-arcada-lbl { text-align: center; font-size: .62rem; font-weight: 800; letter-spacing: .9px; text-transform: uppercase; color: var(--p-faint); margin: 2px 0 4px; }
.pa-arcada { display: flex; justify-content: center; align-items: flex-end; flex-wrap: nowrap; gap: 2px; overflow-x: auto; padding-bottom: 2px; }
.pa-arcada-sep { height: 2px; width: 90%; margin: 6px auto; background: var(--p-border-strong); border-radius: 2px; }
.pa-dente { cursor: pointer; text-align: center; flex: 0 0 auto; width: 46px; border-radius: 8px; padding: 2px 1px; transition: background .15s, box-shadow .15s; }
.pa-dente:hover { background: var(--p-blue-soft); }
.pa-dente.sel { background: var(--p-blue-soft); box-shadow: inset 0 0 0 2px var(--p-blue-light); }
.pa-dente-num { display: block; font-size: .62rem; font-weight: 700; color: var(--p-muted); line-height: 1.2; }
.pa-dente-img { position: relative; height: 64px; display: flex; align-items: center; justify-content: center; }
.pa-dente-corpo { position: absolute; inset: 0; opacity: .62; pointer-events: none;
    -webkit-mask-size: contain; mask-size: contain; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
    -webkit-mask-position: center; mask-position: center; }
.pa-dente-contorno { position: relative; max-height: 100%; max-width: 100%; object-fit: contain; pointer-events: none; -webkit-user-drag: none; }
.pa-dente-x { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: var(--p-red); font-size: 1.6rem; font-weight: 800; line-height: 1; pointer-events: none; }
.pa-dente-edit { margin-top: 16px; }
.mm-f.pa-f-face { grid-column: span 2; }
.pa-plano-linha { margin-bottom: 8px; align-items: center; }

/* ---- Periograma ---- */
.pa-perio { border-collapse: collapse; width: 100%; font-size: .7rem; }
.pa-perio th, .pa-perio td { border: 1px solid var(--p-border-soft); text-align: center; padding: 1px; vertical-align: middle; }
.pa-perio thead th { background: var(--p-soft); color: var(--p-muted); font-weight: 800; }
.pa-perio th.pa-perio-dente { font-size: .72rem; color: var(--p-ink); }
.pa-perio th.pa-perio-sitio { font-size: .58rem; color: var(--p-faint); }
.pa-perio .pa-perio-med { width: 52px; font-weight: 800; color: var(--p-ink); background: var(--p-soft); text-align: left; padding-left: 8px; }
.pa-perio-in { width: 24px; height: 22px; margin: auto; display: block; text-align: center; font-size: .66rem; font-weight: 700; padding: 0;
    border: 1px solid transparent; border-radius: 6px; background: transparent; color: var(--p-ink); -moz-appearance: textfield; }
.pa-perio-in:focus { outline: none; border-color: var(--p-blue-light); background: var(--p-surface); }
.pa-perio-in::-webkit-inner-spin-button, .pa-perio-in::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.pa-perio-ck { width: 13px; height: 13px; margin: auto; display: block; cursor: pointer; }
.pa-perio td.pa-perio-ss { background: var(--p-red-soft); }
.pa-perio td.pa-perio-pv { background: var(--p-yellow-soft); }
.pa-spin-inline { display: inline-block; width: 12px; height: 12px; border-radius: 50%; border: 2px solid var(--p-blue-line-soft); border-top-color: var(--p-blue); animation: mmSpin .8s linear infinite; }

@media print {
    .mm-subnav, .pa-noprint, .app-header, .app-sidebar, footer, .mm-toasts { display: none !important; }
    .pa-perio-print { break-inside: avoid; page-break-inside: avoid; box-shadow: none !important; }
    .mm-body { padding: 0 !important; }
}

/* ---- Plano de tratamento: edição na linha ---- */
.pa-tbl tr.pa-linha-edit td { background: var(--p-blue-soft); }
.pa-tbl .prmd-field { padding: .35rem .45rem; font-size: .74rem; }
.prmd-field.pa-w70 { width: 70px; }
.prmd-field.pa-w90 { width: 90px; }

/* ---- Atendimento odontológico → FAO (out/2026) ---- */
.pa-mb { margin-bottom: 10px; }
.mm-count.pa-ao-vivo { background: var(--p-blue); color: #fff; }
.prmd-field.pa-leitura { background: var(--p-soft); font-weight: 700; color: var(--p-ink); }
.mm-f.pa-f-fim { display: flex; align-items: flex-end; }
.pa-proc-sel { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--p-blue-line); border-radius: 10px; background: var(--p-blue-soft); font-size: .78rem; }
.pa-proc-lista { max-height: 280px; overflow-y: auto; margin-top: 8px; display: flex; flex-direction: column; gap: 4px; }
.pa-proc-lista .mm-item { text-align: left; }
.pa-fao { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 18px; margin-top: 12px; }
.pa-fao .pa-checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.pa-tbl td.pa-nowrap { white-space: nowrap; }