/* ============================================================
   AGENDA PSI — PRONTUÁRIOS 3.0
   Reaproveita o shell, os tokens (--dd-*) e os primitivos definidos em
   dashboard-2.0.css (carregado ANTES deste arquivo) — mesma sidebar,
   topbar, tipografia, paleta, superfícies, bordas, sombras e raios do
   Dashboard 3.0 / Agenda 3.0. Este arquivo só acrescenta os componentes
   próprios do Prontuário (lista de pacientes, cabeçalho clínico, abas,
   linha do tempo, resumo, próximo encontro, painel lateral, modais).

   IDs e classes usados pelo JS (openRecord/loadRecords/setupRecordTabs/
   setupResumoClinico/setupProximoEncontro/renderTimelineList/etc. em
   painel-2.0-runtime.js, e plano-terapeutico.js/escalas-clinicas.js) foram
   mantidos IDENTICOS — aqui e' so' a camada visual por cima deles.

   Este arquivo carrega DEPOIS de painel-2.0-runtime.css. Esse arquivo
   ainda tem um bloco grande body[data-page="prontuarios"] (comportamento
   responsivo: drawer de pacientes no mobile, rodape fixo de acoes,
   sticky do "Proximo encontro", foco, etc.) que continua ativo de
   proposito — nao reimplementamos layout responsivo que ja funciona.
   Em vez disso, remapeamos os tokens --aps-* (usados por aquele bloco e
   por agenda-psi-design-system-2.0.css) para os tokens --dd-* desta
   pagina, para a cor acompanhar o resto do app sem duplicar CSS.
   ============================================================ */

/* ============================================================
   BADGES / AVATAR / BOTÕES / CARD — reskin dos primitivos compartilhados
   (agenda-psi-design-system-2.0.css), escopado a esta pagina (este arquivo
   so carrega em prontuarios.html). Fica logo no topo de proposito: os
   componentes mais especificos abaixo tambem levam .aps-card/.aps-btn e
   precisam vencer o empate de especificidade pela ORDEM no arquivo.
   ============================================================ */
.aps-badge{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;padding:3.5px 9px;border-radius:999px;line-height:1;white-space:nowrap}
.aps-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.aps-badge--success{color:#0b6b47;background:var(--dd-green-soft)}
.aps-badge--warning{color:#8a5a09;background:var(--dd-amber-soft)}
.aps-badge--danger{color:#a32a20;background:var(--dd-red-soft)}
.aps-badge--neutral{color:var(--dd-ink-soft);background:var(--dd-bg)}
.aps-avatar{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:var(--dd-blue-soft);color:#1f4f96;font-weight:700;font-size:12px;flex:none}
.aps-card{background:var(--dd-surface);border:1px solid var(--dd-border);border-radius:var(--dd-radius-lg);box-shadow:var(--dd-shadow-sm)}
.aps-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:600;font-size:13.5px;padding:10px 18px;border-radius:var(--dd-radius-md);border:1px solid transparent;cursor:pointer;transition:background var(--dd-fast) var(--dd-ease),border-color var(--dd-fast) var(--dd-ease);white-space:nowrap}
.aps-btn--primary{background:var(--dd-violet);color:#fff;box-shadow:var(--dd-shadow-sm)}
.aps-btn--primary:hover{background:var(--dd-violet-dark)}
.aps-btn--secondary{background:var(--dd-surface);color:var(--dd-ink);border-color:var(--dd-border-strong)}
.aps-btn--secondary:hover{border-color:var(--dd-violet);background:var(--dd-violet-soft)}
.aps-btn:focus-visible{box-shadow:var(--dd-shadow-focus)}
.aps-btn:disabled{cursor:default;opacity:.55}
.aps-icon-btn{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:var(--dd-radius-md);border:1px solid transparent;background:transparent;color:var(--dd-ink-soft);cursor:pointer}
.aps-icon-btn:hover{background:var(--dd-bg);color:var(--dd-ink)}
.aps-icon-btn:focus-visible{box-shadow:var(--dd-shadow-focus)}
.aps-kicker{color:var(--dd-violet);font-size:11.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.aps-heading{margin:0;color:var(--dd-ink);font-family:var(--dd-font-display);letter-spacing:-.02em}
.aps-empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:40px 20px}
.aps-empty .v2-empty-icon{display:flex;color:var(--dd-ink-mute)}
.aps-empty .v2-empty-icon svg{width:64px;height:64px}
.aps-empty strong{font-family:var(--dd-font-display);font-size:15.5px;color:var(--dd-ink)}
.aps-empty p{margin:0;color:var(--dd-ink-soft);font-size:13px;max-width:320px}
.aps-empty-actions{display:flex;gap:9px;flex-wrap:wrap;justify-content:center;margin-top:6px}

/* ============================================================
   RETEMA DE TOKENS --aps-* → --dd-* (escopado a esta pagina)
   painel-2.0-runtime.css tem um bloco body[data-page="prontuarios"] que
   cuida do COMPORTAMENTO responsivo (drawer de pacientes, rodape fixo de
   acoes do Plano/Escalas, sticky do "Proximo encontro", foco). Ele usa as
   variaveis --aps-* para cor. Em vez de duplicar aquelas regras so para
   trocar a cor, redeclaramos as variaveis aqui — qualquer regra (deste
   arquivo, do bloco legado ou de agenda-psi-design-system-2.0.css) que
   leia --aps-* dentro desta pagina passa a usar a paleta --dd-* sozinha.
   ============================================================ */
body[data-page="prontuarios"]{
  --aps-primary:var(--dd-ink);
  --aps-primary-light:var(--dd-ink-soft);
  --aps-primary-dark:var(--dd-ink);
  --aps-accent:var(--dd-violet);
  --aps-accent-soft:var(--dd-violet-soft);
  --aps-cta:var(--dd-violet);
  --aps-cta-hover:var(--dd-violet-dark);
  --aps-surface:var(--dd-surface);
  --aps-surface-subtle:var(--dd-bg);
  --aps-surface-lilac:var(--dd-violet-soft);
  --aps-text-secondary:var(--dd-ink-soft);
  --aps-text-muted:var(--dd-ink-mute);
  --aps-border:var(--dd-border);
  --aps-border-strong:var(--dd-border-strong);
  --aps-success:#12986a;
  --aps-success-soft:var(--dd-green-soft);
  --aps-warning:#b3760f;
  --aps-warning-soft:var(--dd-amber-soft);
  --aps-danger:#c93a2e;
  --aps-danger-soft:var(--dd-red-soft);
  --aps-font-display:var(--dd-font-display);
  --aps-font-body:var(--dd-font-body);
}

/* ============================================================
   CABEÇALHO DA PÁGINA
   ============================================================ */
.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;flex-wrap:wrap}
.page-head p{margin-top:5px;color:var(--dd-ink-soft);font-size:14px;max-width:640px}
.secure{display:flex;align-items:center;gap:9px;padding:10px 13px;border:1px solid var(--dd-border);border-radius:var(--dd-radius-md);color:var(--dd-ink-soft);background:var(--dd-surface);font-size:13px;flex:none}
.secure strong{display:block;color:var(--dd-violet);font-size:13px}

/* ============================================================
   RECORD SHELL — lista de pacientes + registro do paciente selecionado
   ============================================================ */
.record-shell{display:grid;grid-template-columns:322px minmax(0,1fr);gap:18px;align-items:start}
.patient-panel{padding:18px}
.patient-panel .search{position:relative;margin-bottom:13px}
.patient-panel .search span{position:absolute;left:13px;top:50%;color:var(--dd-ink-mute);transform:translateY(-50%)}
.patient-panel .search input{width:100%;height:42px;padding:0 12px 0 38px;border:1px solid var(--dd-border);border-radius:var(--dd-radius-md);outline:0;background:var(--dd-bg);font-size:13.5px;color:var(--dd-ink)}
.patient-panel .search input:focus-visible{border-color:var(--dd-violet);background:var(--dd-surface);box-shadow:var(--dd-shadow-focus)}
.list-title{display:flex;justify-content:space-between;margin:16px 2px 9px;color:var(--dd-ink-mute);font-size:13px;font-weight:700}
.patient-list{display:flex;flex-direction:column;gap:4px}
.patient{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:11px;width:100%;padding:10px 11px;border:1px solid transparent;border-radius:var(--dd-radius-md);background:transparent;text-align:left;cursor:pointer;transition:background var(--dd-fast) var(--dd-ease),border-color var(--dd-fast) var(--dd-ease)}
.patient:hover{background:var(--dd-bg)}
.patient.active{border-color:var(--dd-violet-line);background:var(--dd-violet-soft)}
.patient .aps-avatar{width:40px;height:40px}
.pname{font-size:13px;font-weight:700;color:var(--dd-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pmeta{margin-top:2px;color:var(--dd-ink-mute);font-size:12.5px}
.count{display:grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:999px;color:var(--dd-violet);background:var(--dd-violet-soft);font-size:12px;font-weight:800}

/* ============================================================
   REGISTRO DO PACIENTE — cabeçalho clínico (hero)
   ============================================================ */
.record{overflow:hidden}
.record-hero{
  display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px 22px;color:var(--dd-ink);
  background:radial-gradient(circle at 95% 0,rgba(109,92,224,.1),transparent 45%),linear-gradient(145deg,#f7f5fe,var(--dd-violet-soft));
  border-bottom:1px solid var(--dd-violet-line);
}
.hero-profile{display:flex;align-items:center;gap:13px;flex:1 1 420px;min-width:0}
.hero-profile>div{min-width:0}
.hero-profile .aps-avatar{width:48px;height:48px;flex:none;color:#fff;border:1px solid rgba(255,255,255,.5);background:var(--dd-violet);box-shadow:var(--dd-shadow-sm)}
.hero-name{font:750 19px/1.25 var(--dd-font-display);color:var(--dd-ink)}
.hero-meta{margin-top:4px;color:var(--dd-ink-soft);font-size:13.5px;line-height:1.35}
.hero-details{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin-top:8px;color:var(--dd-ink-soft);font-size:12.5px;line-height:1.35}
.hero-details .hero-badge{padding:3px 9px;border-radius:999px;color:var(--dd-violet-dark);background:#fff;font-weight:700;box-shadow:var(--dd-shadow-sm)}
.hero-detail-item{white-space:nowrap}
.hero-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:7px;flex:0 1 auto}
.hero-actions .aps-btn{color:var(--dd-ink);border-color:var(--dd-border-strong);background:#fff;white-space:nowrap}
.hero-actions .aps-btn:hover{border-color:var(--dd-violet);background:var(--dd-violet-soft)}
.hero-actions .aps-btn:focus-visible{box-shadow:var(--dd-shadow-focus)}
.hero-actions .primary{color:#fff;background:var(--dd-violet);border-color:var(--dd-violet);box-shadow:var(--dd-shadow-sm)}
.hero-actions .primary:hover{background:var(--dd-violet-dark);border-color:var(--dd-violet-dark)}
.hero-actions .record-message{display:inline-flex;align-items:center;gap:6px;color:var(--dd-ink-soft);border-color:var(--dd-border-strong);background:#fff;font-size:12.5px}
.hero-actions .record-more{width:40px;min-width:40px;padding:0;font-size:13px;letter-spacing:1px;color:var(--dd-ink-soft)}

.context{position:relative}
.context.open{z-index:60}
.context .context-menu{position:absolute;top:calc(100% + 6px);right:0;z-index:70;display:none;width:220px;padding:6px;border:1px solid var(--dd-border);border-radius:var(--dd-radius-md);background:var(--dd-surface);box-shadow:var(--dd-shadow-md)}
.context.open .context-menu{display:block}
.context .context-menu button{width:100%;padding:9px 10px;border:0;border-radius:8px;color:var(--dd-ink-soft);background:none;cursor:pointer;font-size:13px;text-align:left;transition:background var(--dd-fast) var(--dd-ease)}
.context .context-menu button:hover,.context .context-menu button:focus-visible{color:var(--dd-ink);background:var(--dd-bg)}
.context .context-menu button.danger,.context .context-menu button[data-more="arquivar"]{color:#a32a20}
.context .context-menu button.danger:hover{background:var(--dd-red-soft)}

/* ============================================================
   VISÃO GERAL (cadência / última / próxima / sessões)
   ============================================================ */
.record-body{padding:20px 22px}
.overview{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:20px}
.overview-item{padding:13px;border:1px solid var(--dd-border);border-radius:var(--dd-radius-md);background:var(--dd-bg)}
.olabel{color:var(--dd-ink-mute);font-size:12.5px;font-weight:600}
.ovalue{margin-top:5px;color:var(--dd-ink);font-size:14px;font-weight:700}
.ovalue-hint{margin-top:3px;color:var(--dd-ink-mute);font-size:11px;line-height:1.3}
.overview-action{border:1px solid var(--dd-border);text-align:left;cursor:pointer;font:inherit;transition:border-color var(--dd-fast) var(--dd-ease),background var(--dd-fast) var(--dd-ease)}
.overview-action:hover,.overview-action:focus-visible{border-color:var(--dd-violet-line);background:var(--dd-violet-soft);outline:none}
.overview-action:disabled{cursor:default;opacity:.55}

/* ============================================================
   PENDÊNCIAS
   ============================================================ */
.pendencias-banner{display:flex;flex-direction:column}
.pendencia-dot{flex:none;width:8px;height:8px;border-radius:50%;background:#b3760f}
.pendencia-row.administrativa .pendencia-dot{background:var(--dd-ink-mute)}

/* ============================================================
   ABAS (Linha do tempo / Resumo / Plano terapêutico / Escalas)
   ============================================================ */
.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.tab-switch{display:inline-flex;max-width:100%;padding:4px;border:1px solid var(--dd-border);border-radius:var(--dd-radius-md);background:var(--dd-bg);overflow-x:auto}
.tab-btn{flex:none;min-height:34px;padding:0 14px;border:0;border-radius:9px;color:var(--dd-ink-soft);background:transparent;cursor:pointer;font-size:13.5px;font-weight:600;white-space:nowrap;transition:background var(--dd-fast) var(--dd-ease),color var(--dd-fast) var(--dd-ease)}
.tab-btn:hover{color:var(--dd-ink)}
.tab-btn:focus-visible{box-shadow:var(--dd-shadow-focus);border-radius:9px}
.tab-btn.active{color:#fff;background:var(--dd-violet);box-shadow:var(--dd-shadow-sm)}
#toggle-filters[hidden]{display:none}
[data-tab-panel][hidden]{display:none}

.record-filters{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px;margin-bottom:16px;padding:14px;border:1px solid var(--dd-border);border-radius:var(--dd-radius-md);background:var(--dd-bg)}
.record-filters[hidden]{display:none}
.record-filters .ffield{display:grid;gap:4px}
.record-filters label{color:var(--dd-ink-mute);font-size:12px;font-weight:700}
.record-filters select,.record-filters input{height:38px;padding:0 10px;border:1px solid var(--dd-border);border-radius:9px;background:var(--dd-surface);color:var(--dd-ink);font-size:13px}
.record-filters select:focus-visible,.record-filters input:focus-visible{box-shadow:var(--dd-shadow-focus);border-color:var(--dd-violet)}
.record-filters .fsearch{flex:1;min-width:180px}
.record-filters .fclear{align-self:flex-end;height:38px;padding:0 6px;border:0;color:var(--dd-violet);background:none;cursor:pointer;font-size:13px;font-weight:700}

/* ============================================================
   LINHA DO TEMPO
   ============================================================ */
.timeline{position:relative;padding-left:22px}
.timeline:before{content:"";position:absolute;left:6px;top:7px;bottom:12px;width:1px;background:var(--dd-border-strong)}
.entry{position:relative;padding:0 0 20px}
.entry:before{content:"";position:absolute;left:-20px;top:5px;width:9px;height:9px;border:3px solid var(--dd-surface);border-radius:50%;background:var(--dd-violet);box-shadow:0 0 0 1px var(--dd-violet-line)}
/* Distinção visual por tipo de registro na linha do tempo (Fase H — Clinical
   Workspace): sessão continua violeta (cor padrão, é o registro mais comum);
   anamnese, documento e observação ganham cor própria no marcador do eixo
   para que o profissional identifique o tipo sem abrir o card, sem duplicar
   nenhuma lógica de leitura/gravação já existente — só o marcador muda. */
.entry[data-tipo="anamnese"]:before{background:var(--dd-blue);box-shadow:0 0 0 1px var(--dd-blue-soft)}
.entry[data-tipo="documento"]:before{background:var(--dd-amber);box-shadow:0 0 0 1px var(--dd-amber-soft)}
.entry[data-tipo="observacao"]:before{background:var(--dd-ink-mute);box-shadow:0 0 0 1px var(--dd-border)}
.entry-date{color:var(--dd-violet);font-size:12.5px;font-weight:800;text-transform:uppercase;letter-spacing:.02em}
.entry-card{margin-top:7px;padding:15px;border:1px solid var(--dd-border);border-radius:var(--dd-radius-md);background:var(--dd-surface)}
.entry-title{display:flex;justify-content:space-between;gap:10px;color:var(--dd-ink);font-size:13.5px;font-weight:700}
.entry-text{margin:8px 0 0;color:var(--dd-ink-soft);font-size:14px;line-height:1.55}
.entry-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.tag{padding:3.5px 9px;border-radius:999px;color:var(--dd-violet);background:var(--dd-violet-soft);font-size:12px;font-weight:700}
.tag-origem-paciente{color:#1f4f96;background:var(--dd-blue-soft)}
.tag-compartilhado{color:#0b6b47;background:var(--dd-green-soft)}
.timeline-loadmore{display:flex;justify-content:center;margin-top:14px}
.timeline-loadmore .aps-btn{min-width:200px}

/* ============================================================
   RESUMO CLÍNICO
   ============================================================ */
.resumo-panel{display:flex;flex-direction:column;gap:16px}
.resumo-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.resumo-card-head h3{margin:0;color:var(--dd-ink);font:700 15px var(--dd-font-display)}
.resumo-updated{color:var(--dd-ink-mute);font-size:12px}
.resumo-view{display:grid;gap:12px}
.resumo-view .rline{display:grid;gap:3px}
.resumo-view .rline span{color:var(--dd-ink-mute);font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.resumo-view .rline p{margin:0;color:var(--dd-ink-soft);font-size:14px;line-height:1.6;white-space:pre-wrap}
.resumo-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.resumo-fields label{display:grid;gap:5px;color:var(--dd-ink-soft);font-size:12.5px;font-weight:700}
.resumo-fields label.full{grid-column:1/-1}
.resumo-fields textarea{min-height:80px;padding:10px 11px;border:1px solid var(--dd-border);border-radius:9px;font:13px/1.5 inherit;color:var(--dd-ink);resize:vertical}
.resumo-fields textarea:focus-visible{box-shadow:var(--dd-shadow-focus);border-color:var(--dd-violet)}
.resumo-fields select{height:40px;padding:0 10px;border:1px solid var(--dd-border);border-radius:9px;background:var(--dd-surface);color:var(--dd-ink);font-size:13px}
.resumo-edit-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px}
.resumo-status-msg{min-height:16px;color:var(--dd-ink-mute);font-size:12px}
.resumo-status-msg.success{color:#0b6b47}
.resumo-status-msg.error{color:#a32a20}
.resumo-status-msg.loading{color:var(--dd-violet)}

/* ============================================================
   PRÓXIMO ENCONTRO
   ============================================================ */
.proximo-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.proximo-card-head h3{margin:0;color:var(--dd-ink);font:700 15px var(--dd-font-display)}
.proximo-toggle{display:flex;align-items:center;gap:6px;color:var(--dd-ink-mute);font-size:12px;font-weight:600}
.proximo-add{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:6px}
.proximo-add select{height:40px;padding:0 8px;border:1px solid var(--dd-border);border-radius:9px;background:var(--dd-surface);color:var(--dd-ink);font-size:13px}
.proximo-add input{flex:1;min-width:180px;height:40px;padding:0 11px;border:1px solid var(--dd-border);border-radius:9px;color:var(--dd-ink);font-size:13px}
.proximo-add select:focus-visible,.proximo-add input:focus-visible{box-shadow:var(--dd-shadow-focus);border-color:var(--dd-violet)}
.proximo-list{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.proximo-item{display:flex;align-items:flex-start;gap:10px;padding:11px 12px;border:1px solid var(--dd-border);border-radius:var(--dd-radius-md);background:var(--dd-bg)}
.proximo-item.concluido{opacity:.6}
.proximo-item.descartado{opacity:.45}
.proximo-item-body{flex:1;min-width:0}
.proximo-item-tag{display:inline-block;margin-bottom:4px;padding:2px 8px;border-radius:999px;color:var(--dd-violet);background:var(--dd-violet-soft);font-size:11px;font-weight:700}
.proximo-item-text{margin:0;color:var(--dd-ink-soft);font-size:13px;line-height:1.5;overflow-wrap:anywhere;word-break:normal}
.proximo-item-actions{display:flex;flex:none;gap:6px}
.proximo-item-actions button{padding:5px 9px;border:1px solid var(--dd-border);border-radius:7px;color:var(--dd-ink-soft);background:var(--dd-surface);cursor:pointer;font-size:12px;font-weight:600}
.proximo-item-actions button:hover{color:var(--dd-violet);background:var(--dd-violet-soft)}

/* ============================================================
   INDICADORES DE CONTINUIDADE
   ============================================================ */
.indicadores-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.indicador-item{padding:11px;border:1px solid var(--dd-border);border-radius:var(--dd-radius-md);background:var(--dd-bg)}
.indicador-item span{display:block;color:var(--dd-ink-mute);font-size:11px;font-weight:700;text-transform:uppercase}
.indicador-item strong{display:block;margin-top:4px;color:var(--dd-ink);font-size:15px;font-family:var(--dd-font-display)}

/* ============================================================
   PAINEL LATERAL (anamnese + documentos)
   ============================================================ */
.side-card{padding:16px;border:1px solid var(--dd-border);border-radius:var(--dd-radius-md);background:var(--dd-bg)}
.side-card+.side-card{margin-top:12px}
.side-card h3{margin:0;color:var(--dd-ink);font:700 13px var(--dd-font-display)}
.side-card p{margin:8px 0 0;color:var(--dd-ink-soft);font-size:14px;line-height:1.55}
.privacy,.support-privacy-note{display:flex;gap:8px;padding:13px;border:1px solid rgba(18,152,106,.2);border-radius:var(--dd-radius-md);color:#0b6b47;background:var(--dd-green-soft);font-size:12.5px;line-height:1.45}
.support-card{background:var(--dd-bg)}
.support-block-head{color:var(--dd-ink)}
.support-block-head svg,.support-chevron{color:var(--dd-ink-mute)}
.v2-document{display:flex;align-items:center;gap:10px;padding:9px 8px;border-radius:9px;transition:background var(--dd-fast) var(--dd-ease)}
.v2-document:hover{background:var(--dd-surface)}

/* Fase 4 — compartilhamento de documento com o paciente */
.v2-doc-compartilhado-tag{color:#0b6b47;font-weight:700}
.v2-doc-origem-tag{color:#1f4f96;font-weight:700}
.v2-doc-compartilhado{color:#0b6b47;font-weight:600}
.v2-doc-nao-compartilhado{color:var(--dd-ink-mute)}

/* ============================================================
   MODAIS (novo registro / agendar / detalhes / anamnese / documento)
   ============================================================ */
.modal-backdrop{position:fixed;inset:0;z-index:100;display:none;place-items:center;padding:20px;background:rgba(33,26,72,.42);backdrop-filter:blur(4px)}
.modal-backdrop.open{display:grid}
.modal,.v2-clinical-modal .modal,.v2-message-modal .modal{width:min(100%,680px);padding:24px;background:var(--dd-surface);border:1px solid var(--dd-border);border-radius:var(--dd-radius-xl);box-shadow:var(--dd-shadow-md)}
.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}
.modal h2{margin:0;font-family:var(--dd-font-display);font-size:20px;font-weight:700;color:var(--dd-ink)}
.modal p{margin:5px 0 0;color:var(--dd-ink-soft);font-size:13.5px}
.field{display:grid;gap:6px;margin-top:14px}
.field:first-of-type{margin-top:0}
.field.full{grid-column:1/-1}
.field label{color:var(--dd-ink-soft);font-size:13px;font-weight:700}
.field select,.field input,.field textarea{padding:11px 12px;border:1px solid var(--dd-border);border-radius:var(--dd-radius-md);background:var(--dd-surface-subtle);color:var(--dd-ink);font:inherit;font-size:13.5px}
.field select{height:42px;padding:0 12px}
.field input{height:42px}
.field textarea{min-height:140px;resize:vertical}
.field select:focus-visible,.field input:focus-visible,.field textarea:focus-visible{background:var(--dd-surface);outline:0;box-shadow:var(--dd-shadow-focus);border-color:var(--dd-violet)}
.modal-actions{display:flex;justify-content:flex-end;align-items:center;gap:9px;margin-top:20px;padding-top:17px;border-top:1px solid var(--dd-border)}
.v2-record-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.v2-record-form-grid .field{margin-top:0}
.v2-form-error{margin:12px 0 0;color:#a32a20;font-size:13px}
.v2-form-error[hidden]{display:none}
.v2-draft-discard{color:#a32a20;background:none;border:0;font-size:13px;font-weight:700;cursor:pointer}
.v2-modal-body{display:flex;flex-direction:column;gap:0}

/* ============================================================
   RESPONSIVO
   ============================================================ */
@media(max-width:1120px){
  .record-shell{grid-template-columns:290px 1fr}
  .body-grid{grid-template-columns:1fr}
  .side-context{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .side-card+.side-card{margin-top:0}
  .overview{grid-template-columns:1fr 1fr}
}
@media(max-width:780px){
  .page-head{display:block}
  .secure{margin-top:14px}
  .record-shell{grid-template-columns:1fr}
  .patient-panel{padding:14px}
  .record-body{padding:16px}
  .record-hero{align-items:stretch;flex-direction:column;gap:14px;padding:16px}
  .hero-profile{flex:none}
  .hero-actions{justify-content:flex-start}
  .side-context{grid-template-columns:1fr}
  .overview{grid-template-columns:1fr 1fr}
  .record-filters{flex-direction:column;align-items:stretch}
  .record-filters .fsearch{min-width:0}
  .resumo-fields{grid-template-columns:1fr}
  .resumo-fields label.full{grid-column:auto}
  .indicadores-grid{grid-template-columns:1fr 1fr}
  .proximo-add{flex-direction:column;align-items:stretch}
  .proximo-add select,.proximo-add input{width:100%}
  .resumo-edit-footer{flex-direction:column;align-items:stretch;gap:8px}
  .resumo-edit-footer>div{display:flex;gap:8px}
  .resumo-edit-footer>div .aps-btn{flex:1}
  .v2-record-form-grid{grid-template-columns:1fr}
}
@media(max-width:520px){
  .indicadores-grid{grid-template-columns:1fr 1fr}
  .pendencia-row{align-items:flex-start}
  .proximo-item{flex-direction:column}
  .proximo-item-actions{align-self:flex-end}
  .modal-actions{flex-wrap:wrap}
  .modal-actions .aps-btn,.modal-actions .v2-draft-discard{flex:1 1 100%}
}