/* ---------- Fonte local (Poppins) ---------- */
@font-face { font-family:'Poppins'; font-style:normal; font-weight:400; font-display:swap; src:url('/assets/fonts/poppins-400.woff2') format('woff2'); }
@font-face { font-family:'Poppins'; font-style:normal; font-weight:500; font-display:swap; src:url('/assets/fonts/poppins-500.woff2') format('woff2'); }
@font-face { font-family:'Poppins'; font-style:normal; font-weight:600; font-display:swap; src:url('/assets/fonts/poppins-600.woff2') format('woff2'); }
@font-face { font-family:'Poppins'; font-style:normal; font-weight:700; font-display:swap; src:url('/assets/fonts/poppins-700.woff2') format('woff2'); }

/* ---------- Tokens ---------- */
:root {
  --bg:#eef1f6;
  --card:#ffffff;
  --navy:#1c2b4a;
  --navy-2:#16213c;
  --accent:#f5a623;
  --accent-soft:rgba(245,166,35,.14);
  --txt:#1c2b4a;
  --muted:#8a94a6;
  --line:#e4e8f0;
  --green:#2ecc71;
  --red:#d95d52;
  --indigo:#5e5ce6;
  --shadow:0 10px 30px rgba(28,43,74,.08);
  --shadow-lift:0 14px 38px rgba(28,43,74,.14);
  --radius:16px;
  --radius-sm:12px;
  --sidebar-w:248px;
  --font:'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}

/* ---------- Reset ---------- */
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; background:var(--bg); color:var(--txt); font:400 14px/1.6 var(--font); -webkit-font-smoothing:antialiased; }
h1,h2,h3,h4 { margin:0; font-weight:600; letter-spacing:-.01em; }
p { margin:0; }
a { color:inherit; }
button { font:inherit; }
img,svg { max-width:100%; }
:focus-visible { outline:2px solid var(--accent); outline-offset:2px; border-radius:4px; }
.icn { flex:none; }

/* ---------- Transições entre páginas ---------- */
@view-transition { navigation: auto; }
@keyframes page-in { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }
@keyframes card-in { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:none; } }
main.main { animation:page-in .35s ease both; }
.main > * { animation:card-in .45s cubic-bezier(.22,.9,.35,1) both; }
.main > *:nth-child(2) { animation-delay:.05s; }
.main > *:nth-child(3) { animation-delay:.10s; }
.main > *:nth-child(4) { animation-delay:.15s; }
.main > *:nth-child(5) { animation-delay:.20s; }
.main > *:nth-child(6) { animation-delay:.25s; }
@media (prefers-reduced-motion: reduce) {
  main.main, .main > * { animation:none; }
  * { transition-duration:.01ms !important; }
}

.skip-link { position:absolute; left:-9999px; top:0; background:var(--navy); color:#fff; padding:10px 16px; border-radius:0 0 10px 0; z-index:100; }
.skip-link:focus { left:0; }

/* ---------- Estrutura ---------- */
.app { min-height:100vh; overflow-x:clip; }
body.nav-open { overflow:hidden; }
.content { margin-left:var(--sidebar-w); min-height:100vh; display:flex; flex-direction:column; }
.main { padding:24px 32px 56px; max-width:1240px; width:100%; margin:0 auto; }

/* ---------- Sidebar ---------- */
.sidebar { position:fixed; inset:0 auto 0 0; width:var(--sidebar-w); z-index:30; display:flex; flex-direction:column;
  background:linear-gradient(178deg, var(--navy) 0%, var(--navy-2) 100%); color:#fff;
  box-shadow:4px 0 24px rgba(22,33,60,.18); overflow-y:auto; overscroll-behavior:contain; }
.side-brand { display:flex; align-items:center; gap:12px; padding:22px 20px 18px; }
/* Marca oficial (mesma da guia de exames): logo dourada sobre branco. */
.brand-mark { display:grid; place-items:center; width:48px; height:48px; border-radius:13px;
  background:#fff; box-shadow:0 6px 16px rgba(0,0,0,.18); }
.brand-word { font-family:Georgia, 'Times New Roman', serif; font-size:27px; font-weight:600;
  letter-spacing:.5px; line-height:1; color:#fff; }
.brand-word b { color:#b89160; font-weight:600; }
.login-brand .brand-word { color:#1f3b5c; }
.login-brand .brand-word b { color:#a87f4e; }
.brand-text { display:flex; flex-direction:column; line-height:1.25; }
.brand-text strong { font-size:17px; font-weight:700; letter-spacing:.01em; }
.brand-text span { font-size:11px; color:rgba(255,255,255,.55); font-weight:500; }
.side-close { display:none; margin-left:auto; color:rgba(255,255,255,.75); }
.side-nav { padding:10px 12px; display:flex; flex-direction:column; gap:4px; flex:1; }
.nav-item { display:flex; align-items:center; gap:12px; padding:11px 14px; border-radius:12px; text-decoration:none;
  color:rgba(255,255,255,.72); font-weight:500; font-size:13.5px; border:none; background:transparent; width:100%;
  cursor:pointer; text-align:left; transition:background .18s, color .18s, transform .18s; }
.nav-item:hover { background:rgba(255,255,255,.07); color:#fff; transform:translateX(2px); }
.nav-item.active { background:rgba(245,166,35,.15); color:#fff; position:relative; }
.nav-item.active::before { content:''; position:absolute; left:-12px; top:8px; bottom:8px; width:3px; border-radius:3px; background:var(--accent); }
.nav-item.active .icn { color:var(--accent); }
.side-foot { padding:14px 12px 18px; border-top:1px solid rgba(255,255,255,.08); }
.side-user { display:flex; align-items:center; gap:10px; padding:6px 8px 10px; }
.avatar { display:inline-grid; place-items:center; width:36px; height:36px; border-radius:50%; flex:none;
  background:var(--accent-soft); color:var(--accent); font-weight:600; font-size:14px; }
.avatar-side { background:rgba(245,166,35,.2); color:#f7b955; }
.side-user-meta { display:flex; flex-direction:column; line-height:1.3; min-width:0; }
.side-user-meta strong { font-size:12.5px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.side-user-meta span { font-size:11px; color:rgba(255,255,255,.5); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.logout-form { margin:0; }
.nav-logout:hover { background:rgba(217,93,82,.18); }

/* ---------- Topbar ---------- */
.topbar { position:sticky; top:0; z-index:20; display:flex; align-items:center; gap:14px;
  padding:16px 32px; background:rgba(238,241,246,.85); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line); }
.page-title { font-size:19px; font-weight:600; }
.topbar-extra { margin-left:auto; display:flex; align-items:center; gap:10px; }
.icon-btn { display:inline-grid; place-items:center; width:38px; height:38px; border:none; border-radius:10px;
  background:transparent; color:inherit; cursor:pointer; transition:background .15s; }
.icon-btn:hover { background:rgba(28,43,74,.08); }
.nav-toggle { display:none; }

/* ---------- Cards ---------- */
.card { background:var(--card); border-radius:var(--radius); box-shadow:var(--shadow); padding:22px 24px;
  border:1px solid rgba(228,232,240,.7); }
.card + .card, section + section { margin-top:20px; }
/* Card que vem logo depois de uma grade também respira (ex.: Pedidos de exame
   após o detail-grid do prontuário). */
.detail-grid + .card, .detail-grid + section, .chart-grid + .card, .chart-grid + section,
.kpi-grid + .card, .kpi-grid + section { margin-top:20px; }
.card-head { display:flex; align-items:center; gap:10px; margin-bottom:16px; flex-wrap:wrap; }
.card-head h2 { font-size:15px; font-weight:600; }
.card-head .icn { color:var(--accent); }
.card-head .spacer { margin-left:auto; }
.muted { color:var(--muted); }
.small { font-size:12px; }

/* ---------- Botões ---------- */
.btn { display:inline-flex; align-items:center; gap:8px; padding:10px 16px; border-radius:10px; border:1px solid var(--line);
  background:#fff; color:var(--txt); font-weight:500; font-size:13px; cursor:pointer; text-decoration:none;
  transition:transform .15s, box-shadow .15s, background .15s, border-color .15s; }
.btn:hover { transform:translateY(-1px); box-shadow:0 6px 16px rgba(28,43,74,.12); border-color:#d3d9e4; }
.btn-primary { background:var(--navy); border-color:var(--navy); color:#fff; }
.btn-primary:hover { background:var(--navy-2); box-shadow:0 8px 20px rgba(28,43,74,.28); }
.btn-accent { background:var(--accent); border-color:var(--accent); color:#fff; }
.btn-accent:hover { background:#e79915; box-shadow:0 8px 20px rgba(245,166,35,.35); }
.btn-danger { background:rgba(217,93,82,.09); border-color:rgba(217,93,82,.28); color:var(--red); }
.btn-danger:hover { background:rgba(217,93,82,.16); }
.btn:disabled { opacity:.55; cursor:not-allowed; transform:none; box-shadow:none; }

/* ---------- Badges ---------- */
.badge { display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:600; letter-spacing:.02em;
  padding:4px 11px; border-radius:999px; white-space:nowrap; }
.badge::before { content:''; width:6px; height:6px; border-radius:50%; background:currentColor; flex:none; }
.b-neutral { background:rgba(138,148,166,.13); color:#66718a; }
.b-info    { background:rgba(28,43,74,.09);   color:var(--navy); }
.b-ok      { background:rgba(46,204,113,.13); color:#1d9e56; }
.b-warn    { background:var(--accent-soft);   color:#c47d0e; }
.b-sign    { background:rgba(94,92,230,.12);  color:var(--indigo); }
.b-danger  { background:rgba(217,93,82,.12);  color:var(--red); }
.risk-flag { display:inline-flex; align-items:center; gap:5px; color:var(--red); font-size:11.5px; font-weight:600; }

/* ---------- Dashboard ---------- */
.period-picker { display:inline-flex; background:#fff; border:1px solid var(--line); border-radius:10px; padding:3px; gap:2px; box-shadow:var(--shadow); }
.period-picker a { padding:7px 14px; border-radius:8px; text-decoration:none; font-size:12.5px; font-weight:500; color:var(--muted); transition:background .15s, color .15s; }
.period-picker a:hover { color:var(--navy); background:rgba(28,43,74,.05); }
.period-picker a.active { background:var(--navy); color:#fff; }

.kpi-grid { display:grid; grid-template-columns:repeat(5, 1fr); gap:16px; }
.kpi { background:var(--card); border-radius:var(--radius); box-shadow:var(--shadow); padding:14px 16px;
  border:1px solid rgba(228,232,240,.7); display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto;
  column-gap:12px; row-gap:2px; align-items:center; transition:transform .18s, box-shadow .18s; }
.kpi:hover { transform:translateY(-2px); box-shadow:var(--shadow-lift); }
.kpi-top { grid-row:1 / span 2; display:flex; align-items:center; }
.kpi-icon { display:grid; place-items:center; width:38px; height:38px; border-radius:11px; background:rgba(28,43,74,.07); color:var(--navy); }
.kpi-icon.accent { background:var(--accent-soft); color:var(--accent); }
.kpi-icon.green { background:rgba(46,204,113,.12); color:#1d9e56; }
.kpi-icon.indigo { background:rgba(94,92,230,.12); color:var(--indigo); }
.kpi-icon.red { background:rgba(217,93,82,.12); color:var(--red); }
.kpi-value { font-size:22px; font-weight:700; line-height:1.05; grid-column:2; }
.kpi-label { font-size:11.5px; color:var(--muted); font-weight:500; grid-column:2; }

.chart-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:20px; }
.chart-grid .card { margin:0; }
.chart-wide { grid-column:1 / -1; }
.chart-scroll { overflow-x:auto; }
.chart-svg { width:100%; height:auto; display:block; }
.bar-rect { fill:var(--navy); transition:fill .15s; }
.bar-rect:hover { fill:var(--accent); }
.bar-rect.today { fill:var(--accent); }
.chart-axis { font-size:10px; font-weight:400; fill:#a5aebf; font-family:var(--font); letter-spacing:.01em; }
.chart-grid-line { stroke:var(--line); stroke-width:1; }
.chart-grid-soft { stroke:#edf0f5; stroke-width:1; stroke-dasharray:3 4; }
.chart-empty { padding:36px 0; text-align:center; color:var(--muted); }

.funnel { display:flex; flex-direction:column; gap:14px; }
.funnel-row { display:grid; grid-template-columns:170px 1fr 76px; gap:12px; align-items:center; }
.funnel-label { font-size:12.5px; font-weight:500; color:var(--txt); }
.funnel-track { background:rgba(28,43,74,.06); border-radius:8px; height:30px; overflow:hidden; }
.funnel-bar { height:100%; border-radius:8px; display:flex; align-items:center; justify-content:flex-end;
  padding:0 10px; color:#fff; font-size:11.5px; font-weight:600; min-width:34px;
  background:linear-gradient(90deg, var(--navy), #2c4370); transition:width .4s ease; }
.funnel-row:last-child .funnel-bar { background:linear-gradient(90deg, var(--accent), #f7b955); }
.funnel-conv { font-size:11.5px; color:var(--muted); font-weight:600; text-align:right; }

.donut-wrap { display:flex; align-items:center; gap:24px; flex-wrap:wrap; }
.donut-svg { width:180px; height:180px; flex:none; }
.donut-center-num { font-size:30px; font-weight:700; fill:var(--txt); font-family:var(--font); }
.donut-center-lbl { font-size:11px; fill:var(--muted); font-family:var(--font); }
.legend { display:flex; flex-direction:column; gap:9px; min-width:170px; }
.legend-row { display:flex; align-items:center; gap:9px; font-size:12.5px; }
.legend-dot { width:10px; height:10px; border-radius:3px; flex:none; }
.legend-count { margin-left:auto; font-weight:600; }

/* ---------- Tabelas ---------- */
.table-card { padding:0; overflow:hidden; }
.table-scroll { overflow-x:auto; -webkit-overflow-scrolling:touch; }
table.tbl { width:100%; border-collapse:collapse; min-width:640px; }
.tbl th, .tbl td { text-align:left; padding:13px 18px; border-bottom:1px solid var(--line); }
.tbl th { color:var(--muted); font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.07em; background:#fafbfd; }
.tbl th:first-child, .tbl td:first-child { padding-left:24px; }
.tbl th:last-child, .tbl td:last-child { padding-right:24px; }
.tbl tbody tr:last-child td { border-bottom:none; }
tr.row-link { cursor:pointer; transition:background .14s; }
tr.row-link:hover { background:rgba(245,166,35,.05); }
tr.row-link:focus-visible { outline:2px solid var(--accent); outline-offset:-2px; }
.cell-name { display:flex; align-items:center; gap:11px; font-weight:500; }
.cell-empty { text-align:center; padding:44px 20px; color:var(--muted); }

/* ---------- Busca / paginação ---------- */
.toolbar { display:flex; align-items:center; gap:12px; margin-bottom:18px; flex-wrap:wrap; }
.search-form { display:flex; flex:1; min-width:230px; max-width:430px; }
.search-box { display:flex; align-items:center; gap:9px; flex:1; background:#fff; border:1px solid var(--line);
  border-radius:11px; padding:0 8px 0 13px; box-shadow:var(--shadow); transition:border-color .15s, box-shadow .15s; }
.search-box:focus-within { border-color:var(--accent); box-shadow:0 0 0 3px rgba(245,166,35,.15); }
.search-box .icn { color:var(--muted); }
.search-box input { flex:1; border:none; background:transparent; padding:11px 0; font:inherit; color:var(--txt); min-width:0; }
.search-box input:focus { outline:none; }
.search-box .btn { padding:7px 13px; box-shadow:none; }
.toolbar-count { margin-left:auto; font-size:12.5px; color:var(--muted); }
.pagination { display:flex; align-items:center; justify-content:center; gap:12px; padding:16px; }
.pagination .pg-info { font-size:12.5px; color:var(--muted); }

/* ---------- Detalhe do paciente ---------- */
.back-link { display:inline-flex; align-items:center; gap:7px; font-size:13px; font-weight:500; color:var(--muted);
  text-decoration:none; margin-bottom:16px; transition:color .15s; }
.back-link:hover { color:var(--navy); }
.patient-head { display:flex; align-items:flex-start; gap:18px; flex-wrap:wrap; }
.avatar-lg { width:56px; height:56px; font-size:22px; border-radius:16px; }
.patient-id { flex:1; min-width:220px; }
.patient-id h2 { font-size:20px; margin-bottom:6px; }
.patient-meta { display:flex; gap:16px; flex-wrap:wrap; font-size:12.5px; color:var(--muted); }
.patient-meta span { display:inline-flex; align-items:center; gap:6px; }
.patient-actions { display:flex; gap:10px; align-items:flex-start; }
.detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:20px; }
.detail-grid .card { margin:0; }
.summary-text { background:#f8fafc; border:1px solid var(--line); border-radius:var(--radius-sm); padding:14px 16px; line-height:1.75; font-size:13.5px; }
/* fit-content: rótulos curtos não roubam espaço do valor; minmax(0,..) impede o
   badge de vazar do card. */
.kv { display:grid; grid-template-columns:fit-content(150px) minmax(0,1fr); gap:8px 14px; font-size:13px; }
.kv dt { color:var(--muted); font-weight:500; }
.kv dd { margin:0; font-weight:500; min-width:0; }
.kv .badge { max-width:100%; white-space:normal; }
.media-list { margin:0; padding-left:18px; font-size:13px; }
.media-list li { margin-bottom:6px; }

.session-list { display:flex; flex-direction:column; }
.session-hidden { display:none; }
.session-row { display:flex; align-items:center; gap:14px; padding:14px 6px; border-bottom:1px solid var(--line);
  text-decoration:none; border-radius:8px; transition:background .14s; }
.session-row:last-child { border-bottom:none; }
.session-row:hover { background:rgba(245,166,35,.05); }
.session-row .sr-date { min-width:128px; font-weight:500; font-size:13px; display:flex; align-items:center; gap:7px; }
.session-row .sr-date .icn { color:var(--muted); }
.sr-badges { display:flex; align-items:center; gap:8px; flex-wrap:wrap; flex:1; }
.sr-msgs { display:inline-flex; align-items:center; gap:5px; color:var(--muted); font-size:12px; }
.sr-arrow { color:var(--muted); }

/* ---------- Pedidos de exame ---------- */
.exam-item { border:1px solid var(--line); border-radius:var(--radius-sm); padding:16px 18px; margin-bottom:14px; background:#fdfdfe; }
.exam-item:last-child { margin-bottom:0; }
.exam-item.pending { border-color:rgba(245,166,35,.5); background:#fffdf7; }
.exam-item.signing { border-color:rgba(94,92,230,.4); background:#fbfbff; }
.exam-head { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.exam-head .exam-date { font-size:12px; color:var(--muted); display:inline-flex; align-items:center; gap:5px; }
.exam-head .pdf-link { margin-left:auto; display:inline-flex; align-items:center; gap:6px; color:var(--navy);
  font-size:12.5px; font-weight:600; text-decoration:none; }
.exam-head .pdf-link:hover { color:var(--accent); }
.exam-rationale { margin-top:10px; font-size:13px; color:#5a6478; border-left:3px solid var(--accent); padding-left:12px; line-height:1.65; }
.exam-list { margin:10px 0 0; padding-left:20px; font-size:13px; }
.exam-list li { margin-bottom:4px; }
.exam-edit-label { display:block; margin:14px 0 7px; font-size:12.5px; color:var(--muted); font-weight:500; }
textarea.exam-edit { width:100%; min-height:110px; resize:vertical; background:#fff; color:var(--txt);
  border:1px solid var(--line); border-radius:10px; padding:12px 14px; font:400 13px/1.6 var(--font);
  transition:border-color .15s, box-shadow .15s; }
textarea.exam-edit:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(245,166,35,.15); }
.exam-actions { display:flex; gap:10px; margin-top:13px; flex-wrap:wrap; }
.sign-hint { margin-top:10px; font-size:13px; color:var(--indigo); line-height:1.6; display:flex; gap:8px; align-items:flex-start; }

/* ---------- Chat ---------- */
.chat-layout { display:grid; grid-template-columns:340px 1fr; gap:20px; align-items:start; }
.chat-layout .card { margin:0; }
.chat-side { position:sticky; top:86px; display:flex; flex-direction:column; gap:20px; }
.chat-card { padding:0; overflow:hidden; }
.chat-head { display:flex; align-items:center; gap:10px; padding:16px 20px; border-bottom:1px solid var(--line); background:#fafbfd; }
.chat-head h2 { font-size:14.5px; }
.chat-body { padding:22px 20px 26px; display:flex; flex-direction:column; gap:4px; max-height:72vh; overflow-y:auto; background:#f6f8fb; }
.day-sep { align-self:center; margin:16px 0 10px; font-size:11px; font-weight:600; color:var(--muted);
  background:#fff; border:1px solid var(--line); border-radius:999px; padding:4px 14px; text-transform:capitalize; }
.msg { max-width:78%; margin-bottom:10px; display:flex; flex-direction:column; }
.msg.in { align-self:flex-start; align-items:flex-start; }
.msg.out { align-self:flex-end; align-items:flex-end; }
.msg.intervention { align-self:center; align-items:center; max-width:88%; }
.bubble { padding:10px 14px; border-radius:14px; font-size:13.5px; line-height:1.6; white-space:pre-wrap; word-break:break-word; }
.msg.in .bubble { background:#fff; border:1px solid var(--line); border-bottom-left-radius:5px; box-shadow:0 2px 8px rgba(28,43,74,.05); }
.msg.out .bubble { background:var(--navy); color:#fff; border-bottom-right-radius:5px; box-shadow:0 4px 12px rgba(28,43,74,.22); }
.msg.intervention .bubble { background:var(--accent-soft); border:1px dashed rgba(245,166,35,.6); color:#8a5f10; border-radius:12px; }
.msg-meta { font-size:10.5px; color:var(--muted); margin-top:4px; display:flex; align-items:center; gap:6px; }
.media-chip { display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:600; padding:3px 9px;
  border-radius:999px; background:rgba(28,43,74,.07); color:var(--navy); margin-bottom:6px; }
.msg.out .media-chip { background:rgba(255,255,255,.16); color:#fff; }
.msg.intervention .msg-meta { justify-content:center; }

/* ---------- Agente IA ---------- */
.agent-grid { display:grid; grid-template-columns:repeat(2, 1fr); gap:28px; margin-top:28px; }
.agent-grid .card { margin:0; }
/* Página do agente: mais respiro vertical entre Enxame, Provedor e Assinatura. */
.agent-grid + section, section + .agent-grid { margin-top:28px; }
.setting-row { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
/* Select com a identidade do painel (sem o widget padrão do navegador). */
select.select { appearance:none; -webkit-appearance:none; -moz-appearance:none;
  background:#fff url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%238a94a6' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right 12px center;
  color:var(--txt); border:1px solid var(--line); border-radius:10px;
  padding:10px 36px 10px 14px; font:500 13px var(--font); cursor:pointer; min-width:190px;
  box-shadow:0 2px 8px rgba(28,43,74,.05); transition:border-color .15s, box-shadow .15s; }
select.select:hover { border-color:#cdd4e0; box-shadow:0 4px 14px rgba(28,43,74,.10); }
select.select:focus-visible { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(245,166,35,.18); }
select.select-sm { padding:7px 32px 7px 12px; font-size:12.5px; min-width:170px; border-radius:9px; }
input.input { background:#fff; color:var(--txt); border:1px solid var(--line); border-radius:10px;
  padding:10px 12px; font:500 13px var(--font); transition:border-color .15s, box-shadow .15s; }
input.input:hover { border-color:#cdd4e0; }
input.input:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(245,166,35,.18); }
.btn-ghost { background:transparent; border-color:var(--line); color:var(--muted); }
.btn-ghost:hover { color:var(--txt); }
select.select:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(245,166,35,.15); }
.status-pill { display:inline-flex; align-items:center; gap:6px; font-size:11.5px; font-weight:600; padding:4px 11px; border-radius:999px; }
.status-pill.on { background:rgba(46,204,113,.12); color:#1d9e56; }
.status-pill.off { background:rgba(138,148,166,.13); color:#66718a; }
.error-card { border-color:rgba(217,93,82,.35); background:#fff9f8; }
.error-card .card-head .icn { color:var(--red); }

.prompt-card { padding:0; overflow:hidden; }
.prompt-card + .prompt-card { margin-top:14px; }
details.prompt > summary { list-style:none; cursor:pointer; display:flex; align-items:center; gap:12px; padding:16px 20px; }
details.prompt > summary::-webkit-details-marker { display:none; }
details.prompt > summary .icn.chev { margin-left:auto; color:var(--muted); transition:transform .2s; }
details.prompt[open] > summary .icn.chev { transform:rotate(180deg); }
details.prompt > summary:hover { background:rgba(245,166,35,.05); }
.prompt-title { display:flex; flex-direction:column; gap:2px; min-width:0; }
.prompt-title strong { font-size:13.5px; font-weight:600; }
.prompt-title span { font-size:12px; color:var(--muted); }
.prompt-body { border-top:1px solid var(--line); padding:16px 20px; background:#fafbfd; }
.prompt-body .prompt-tools { display:flex; justify-content:flex-end; margin-bottom:10px; }
pre.prompt-pre { margin:0; background:var(--navy-2); color:#dde4f0; border-radius:12px; padding:16px 18px;
  font:12px/1.65 ui-monospace, 'Cascadia Mono', Consolas, monospace; overflow:auto; max-height:420px; white-space:pre-wrap; word-break:break-word; }

/* ---------- Login ---------- */
body.bare { min-height:100vh; min-height:100dvh; display:flex; align-items:center; justify-content:center; padding:24px;
  background:linear-gradient(160deg, #eef1f6 0%, #e3e9f2 60%, #dbe3ef 100%); }
.login-card { width:100%; max-width:400px; background:#fff; border-radius:20px; box-shadow:0 24px 60px rgba(28,43,74,.16);
  padding:40px 36px 34px; animation:card-in .5s cubic-bezier(.22,.9,.35,1) both; }
.login-brand { display:flex; align-items:center; gap:12px; margin-bottom:26px; }
.login-brand .brand-mark { width:44px; height:44px; }
.login-brand strong { font-size:20px; font-weight:700; color:var(--navy); }
.login-brand span { display:block; font-size:12px; color:var(--muted); font-weight:500; }
.login-card h1 { font-size:17px; margin-bottom:4px; }
.login-sub { font-size:12.5px; color:var(--muted); margin-bottom:22px; }
.field { margin-bottom:16px; }
.field label { display:block; font-size:12.5px; font-weight:500; margin-bottom:6px; color:var(--navy); }
.field input { width:100%; border:1px solid var(--line); border-radius:11px; padding:12px 14px; font:400 14px var(--font);
  color:var(--txt); background:#fdfdfe; transition:border-color .15s, box-shadow .15s; }
.field input:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(245,166,35,.16); }
.login-btn { width:100%; justify-content:center; padding:13px; font-size:14px; font-weight:600; margin-top:6px; }
/* Campo de senha com botão de olho (mostrar/ocultar) */
.pw-wrap { position:relative; }
.pw-wrap input { padding-right:46px; }
.pw-eye { position:absolute; right:5px; top:50%; transform:translateY(-50%); border:none; background:transparent;
  color:var(--muted); cursor:pointer; display:inline-grid; place-items:center; width:36px; height:36px;
  border-radius:9px; transition:color .15s, background .15s; }
.pw-eye:hover { color:var(--navy); background:rgba(28,43,74,.06); }
.pw-eye span { display:inline-grid; place-items:center; }
.login-error { display:flex; gap:9px; align-items:flex-start; background:rgba(217,93,82,.09); border:1px solid rgba(217,93,82,.25);
  color:var(--red); border-radius:11px; padding:11px 14px; font-size:12.5px; margin-bottom:18px; line-height:1.55; }
.login-info { display:flex; gap:9px; align-items:flex-start; background:var(--accent-soft); border:1px solid rgba(245,166,35,.35);
  color:#8a5f10; border-radius:11px; padding:11px 14px; font-size:12.5px; margin-bottom:18px; line-height:1.55; }
.login-foot { margin-top:20px; text-align:center; font-size:11.5px; color:var(--muted); }

/* ---------- 404 ---------- */
.notfound-card { max-width:460px; margin:8vh auto 0; text-align:center; padding:44px 36px; }
.nf-icon { display:grid; place-items:center; width:64px; height:64px; margin:0 auto 18px; border-radius:18px;
  background:var(--accent-soft); color:var(--accent); }
.notfound-card h2 { font-size:19px; margin-bottom:8px; }
.notfound-card p { margin-bottom:22px; }
.notfound-card .btn { justify-content:center; }

/* ---------- Toast ---------- */
.toast { position:fixed; left:50%; bottom:28px; transform:translate(-50%, 16px); opacity:0; pointer-events:none; z-index:80;
  max-width:min(560px, calc(100vw - 32px)); padding:13px 20px; border-radius:12px; background:var(--navy);
  color:#fff; box-shadow:0 16px 40px rgba(22,33,60,.35); font-size:13px; line-height:1.5;
  border-left:4px solid var(--accent); transition:opacity .25s, transform .25s; }
.toast.show { opacity:1; transform:translate(-50%, 0); }
.toast.ok { border-left-color:var(--green); }
.toast.err { border-left-color:var(--red); }
.toast.sign { border-left-color:var(--indigo); }

/* ---------- Responsivo: tablet ---------- */
@media (max-width:1024px) {
  .sidebar { transform:translateX(-100%); transition:transform .28s cubic-bezier(.4,0,.2,1); box-shadow:none; }
  .sidebar.open { transform:translateX(0); box-shadow:8px 0 40px rgba(22,33,60,.35); }
  .side-close { display:inline-grid; }
  .sidebar-backdrop { position:fixed; inset:0; background:rgba(22,33,60,.45); z-index:25; }
  .content { margin-left:0; }
  .nav-toggle { display:inline-grid; }
  .kpi-grid { grid-template-columns:repeat(3, 1fr); }
  .chart-grid { grid-template-columns:1fr; }
  /* Empilhado, a conversa (conteúdo principal) vem ANTES dos cards de resumo. */
  .chat-layout { display:flex; flex-direction:column; }
  .chat-layout .chat-card { order:-1; }
  .chat-side { position:static; }
  .agent-grid { grid-template-columns:1fr; }
  .detail-grid { grid-template-columns:1fr; }
}

/* Tabelas viram cards empilhados também no tablet retrato (scroll lateral é ruim no toque). */
@media (max-width:860px) {
  .table-card { background:transparent; box-shadow:none; border:none; overflow:visible; }
  .table-scroll { overflow:visible; }
  table.tbl { min-width:0; }
  .tbl thead { display:none; }
  .tbl tbody tr { display:block; background:var(--card); border:1px solid rgba(228,232,240,.7); border-radius:var(--radius);
    margin-bottom:12px; box-shadow:var(--shadow); overflow:hidden; }
  .tbl tbody tr td { display:flex; justify-content:space-between; align-items:center; gap:14px; text-align:right;
    padding:11px 16px; border-bottom:1px solid var(--line); }
  .tbl tbody tr td::before { content:attr(data-label); color:var(--muted); font-size:11px; text-transform:uppercase;
    letter-spacing:.07em; font-weight:600; text-align:left; white-space:nowrap; }
  .tbl tbody tr td:last-child { border-bottom:none; }
  .tbl th:first-child, .tbl td:first-child { padding-left:16px; }
  .tbl th:last-child, .tbl td:last-child { padding-right:16px; }
  .cell-empty { display:block; text-align:center; }
  .cell-empty::before { content:none !important; }
}

/* ---------- Responsivo: mobile ---------- */
@media (max-width:720px) {
  .main { padding:16px 14px 48px; }
  .topbar { padding:12px 14px; flex-wrap:wrap; row-gap:8px; }
  .page-title { font-size:16px; }
  .period-picker a { white-space:nowrap; padding:8px 12px; }
  /* iOS Safari dá zoom automático em campo com fonte <16px — e o zoom não volta. */
  input.input, .field input, .search-box input, select.select, select.select-sm,
  textarea.exam-edit, input.kb-file { font-size:16px; }
  /* Gráficos SVG: sem esta trava o texto dos eixos escala junto e fica ilegível. */
  .chart-scroll .chart-svg, .chart-scroll .weekly-chart { min-width:560px; }
  .chart-axis { font-size:13px; }
  .chat-body { max-height:none; }
  .kpi-grid { grid-template-columns:repeat(2, 1fr); gap:12px; }
  .kpi-value { font-size:22px; }
  .card { padding:18px 16px; }
  .funnel-row { grid-template-columns:1fr; gap:5px; }
  .funnel-conv { text-align:left; }
  .donut-wrap { justify-content:center; }
  .patient-head { gap:12px; }
  .patient-actions { width:100%; }
  .patient-actions .btn { flex:1; justify-content:center; }
  .toolbar-count { margin-left:0; width:100%; }
  .msg { max-width:92%; }
  .session-row { flex-wrap:wrap; }
  .pagination { flex-wrap:wrap; }
}

@media (max-width:430px) {
  body.bare { padding:16px; }
  .login-card { padding:28px 22px 26px; }
}

/* ---------- Alvos de toque confortáveis (dedo, não mouse) ---------- */
@media (pointer:coarse) {
  .icon-btn { width:44px; height:44px; }
  .doc-act, .kb-del, .period-picker a, .search-box .btn { min-height:42px; padding-top:10px; padding-bottom:10px; }
  select.select-sm { min-height:42px; }
  .exam-head .pdf-link, .flow-example summary { min-height:42px; align-items:center; }
}

/* ---------------------------------------------------------------------------
   Médicos: lista em cards limpos + foto de perfil
--------------------------------------------------------------------------- */
.doc-list { display:flex; flex-direction:column; gap:10px; }
.doc-card { display:flex; align-items:center; gap:14px; padding:12px 14px; border:1px solid var(--line);
  border-radius:14px; background:#fdfdfe; cursor:pointer; transition:border-color .15s, box-shadow .15s, transform .15s; }
.doc-card:hover, .doc-card:focus-visible { border-color:#cdd4e0; box-shadow:0 8px 20px rgba(28,43,74,.10);
  transform:translateY(-1px); outline:none; }
.doc-card.editing { border-color:var(--accent); background:#fffaf1; }
.doc-card-id { min-width:0; flex:1; display:flex; flex-direction:column; line-height:1.35; }
.doc-card-id strong { font-size:14px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.doc-card-chev { color:var(--muted); flex:none; }
.doc-card-photo, .doc-photo { width:46px; height:46px; border-radius:50%; object-fit:cover; flex:none;
  border:2px solid #fff; box-shadow:0 3px 10px rgba(28,43,74,.14); }
.doc-photo { width:72px; height:72px; }
.doc-photo-empty { display:inline-grid; place-items:center; background:var(--accent-soft); color:#9a6a0e;
  font-weight:600; font-size:18px; }
.doc-photo-row { display:flex; align-items:center; gap:16px; margin-bottom:18px; padding-bottom:16px;
  border-bottom:1px dashed var(--line); }
.doc-photo-tools { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.doc-edit-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:18px;
  padding-top:16px; border-top:1px dashed var(--line); }

/* ---------------------------------------------------------------------------
   Datepicker próprio (identidade do painel)
--------------------------------------------------------------------------- */
.dp-pop { position:absolute; z-index:1000; width:264px;
  background:#fff; border:1px solid var(--line); border-radius:14px; padding:12px;
  box-shadow:0 18px 40px rgba(28,43,74,.22); animation:card-in .18s ease both; }
.dp-head { display:flex; align-items:center; gap:6px; margin-bottom:8px; }
.dp-year-btn { flex:1; border:none; background:transparent; font:600 13px var(--font); color:var(--navy);
  cursor:pointer; padding:6px 4px; border-radius:8px; transition:background .12s; }
.dp-year-btn:hover { background:var(--accent-soft); color:#9a6a0e; }
.dp-years { display:grid; grid-template-columns:repeat(4,1fr); gap:4px; max-height:216px; overflow-y:auto;
  padding:2px; scrollbar-width:thin; }
.dp-yy { border:none; background:transparent; border-radius:8px; padding:7px 0; font:500 12.5px var(--font);
  color:var(--txt); cursor:pointer; transition:background .12s, color .12s; }
.dp-yy:hover { background:var(--accent-soft); color:#9a6a0e; }
.dp-yy.sel { background:var(--accent); color:#fff; font-weight:600; }
.dp-nav { width:28px; height:28px; border:1px solid var(--line); border-radius:8px; background:#fff;
  color:var(--navy); font-size:16px; line-height:1; cursor:pointer; transition:background .15s, border-color .15s; }
.dp-nav:hover { background:var(--accent-soft); border-color:var(--accent); color:var(--accent); }
.dp-week { display:grid; grid-template-columns:repeat(7,1fr); margin-bottom:2px; }
.dp-week span { text-align:center; font-size:10px; font-weight:600; color:var(--muted); padding:4px 0; }
.dp-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:2px; }
.dp-day { border:none; background:transparent; border-radius:8px; padding:6px 0; font:500 12.5px var(--font);
  color:var(--txt); cursor:pointer; transition:background .12s, color .12s; }
.dp-day:hover { background:var(--accent-soft); color:#9a6a0e; }
.dp-day.today { box-shadow:inset 0 0 0 1.5px var(--line); }
.dp-day.sel { background:var(--accent); color:#fff; font-weight:600; }
.dp-empty { padding:6px 0; }

/* ---------------------------------------------------------------------------
   Crosshair do gráfico semanal
--------------------------------------------------------------------------- */
.weekly-chart { position:relative; }
.weekly-cross-line { stroke:#b5bdcb; stroke-width:1; stroke-dasharray:3 3; }
.weekly-cross-dot { fill:#fff; stroke:#f09d13; stroke-width:1.75; }
.weekly-tip { position:absolute; pointer-events:none; background:#1c2b4a; color:#fff; font:500 11.5px var(--font);
  padding:6px 10px; border-radius:8px; box-shadow:0 8px 20px rgba(28,43,74,.25); white-space:nowrap;
  transform:translate(-50%, calc(-100% - 10px)); z-index:2; }
.weekly-tip strong { color:#f5a623; font-weight:600; }

/* ---------------------------------------------------------------------------
   Leitor de prompts (lista à esquerda, texto à direita)
--------------------------------------------------------------------------- */
.prompt-reader { display:grid; grid-template-columns:300px minmax(0,1fr); gap:20px; align-items:start; }
.prompt-reader-list { display:flex; flex-direction:column; gap:8px; position:sticky; top:86px; }
.prompt-nav-item { text-align:left; background:#fff; border:1px solid var(--line); border-radius:12px;
  padding:12px 14px; cursor:pointer; font-family:var(--font); transition:border-color .15s, box-shadow .15s, background .15s; }
.prompt-nav-item strong { display:block; font-size:13px; font-weight:600; color:var(--txt); }
.prompt-nav-item span { display:block; font-size:11.5px; color:var(--muted); margin-top:3px; line-height:1.4; }
.prompt-nav-item:hover { border-color:#cdd4e0; box-shadow:0 6px 16px rgba(28,43,74,.08); }
.prompt-nav-item.active { border-color:var(--accent); background:#fffaf1; box-shadow:0 6px 16px rgba(245,166,35,.14); }
.prompt-nav-item.active strong { color:#9a6a0e; }
.prompt-reader-view { min-height:70vh; display:flex; flex-direction:column; }
.prompt-reader-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:6px; }
.prompt-reader-head h2 { font-size:16px; font-weight:600; }
.prompt-reader-pre { flex:1; margin-top:12px; background:#141d33; border:1px solid #24304d; border-radius:12px;
  padding:18px 20px; font:12.5px/1.7 ui-monospace, 'Cascadia Mono', Consolas, monospace; color:#e8ecf5;
  white-space:pre-wrap; word-break:break-word; overflow:auto; max-height:calc(100vh - 240px); }
@media (max-width: 860px) {
  .prompt-reader { grid-template-columns:1fr; }
  .prompt-reader-list { position:static; flex-direction:row; overflow-x:auto; padding-bottom:6px; }
  .prompt-nav-item { min-width:220px; }
}

/* ---------------------------------------------------------------------------
   Mapa de conversa (árvore de comportamento)
--------------------------------------------------------------------------- */
.flow-legend { display:flex; gap:14px; flex-wrap:wrap; margin-bottom:18px; }
.flow-legend-item { display:inline-flex; align-items:center; gap:7px; font-size:12px; color:var(--muted); font-weight:500; }
.flow-legend-item i { width:10px; height:10px; border-radius:3px; background:var(--kind, #b9c2d0); display:inline-block; }
.flow-legend-item.flow-kind-inicio i { background:#1c2b4a; }
.flow-legend-item.flow-kind-det i { background:#5b8def; }
.flow-legend-item.flow-kind-llm i { background:#f5a623; }
.flow-legend-item.flow-kind-humano i { background:#7b6cf6; }
.flow-legend-item.flow-kind-sistema i { background:#8a94a6; }
.flow-legend-item.flow-kind-ok i { background:#2ea36b; }
.flow-legend-item.flow-kind-stop i { background:#d95d52; }

/* Sem animação de entrada no mapa: medir os cards em movimento entortava as setas. */
.main > .flow-page, .flow-page { animation:none !important; }
.flow-wrap { position:relative; padding-left:56px; }
.flow-lines { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; z-index:0; overflow:visible; }
.flow-lines path.flow-edge { fill:none; stroke-width:2; stroke-linecap:round; }
.flow-lines path.flow-edge.main { stroke-width:2.5; }
.flow-lines path.flow-edge.loop { stroke-dasharray:6 6; }
.flow-labels { position:absolute; inset:0; pointer-events:none; z-index:2; }
.flow-edge-label { position:absolute; transform:translate(-50%,-50%); background:#fff; border:1.5px solid;
  border-radius:99px; padding:3px 10px; font:600 10.5px var(--font); white-space:nowrap;
  box-shadow:0 3px 10px rgba(28,43,74,.10); }

.flow-grid { position:relative; z-index:1; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:64px 48px; align-items:start; }
.flow-node { background:#fff; border:1px solid var(--line); border-radius:14px; padding:16px 18px;
  box-shadow:0 10px 30px rgba(28,43,74,.08); border-top:3px solid var(--kind, #b9c2d0);
  transition:transform .15s, box-shadow .15s; max-width:360px; justify-self:center; width:100%; }
.flow-node:hover, .flow-node:focus-visible { transform:translateY(-2px); box-shadow:0 14px 34px rgba(28,43,74,.14); outline:none; }
.flow-node header { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px; }
.flow-node h3 { font-size:14.5px; font-weight:600; color:var(--txt); margin:0 0 6px; }
.flow-node p { font-size:12.5px; color:var(--muted); line-height:1.55; margin:0; }
.flow-chip { font-size:10.5px; font-weight:600; letter-spacing:.03em; text-transform:uppercase;
  color:#fff; background:var(--kind, #b9c2d0); border-radius:6px; padding:3px 8px; }
.flow-state { font-size:10px; color:#9aa3b5; background:#f2f4f8; border-radius:5px; padding:2px 6px; }
.flow-node.flow-kind-inicio { --kind:#1c2b4a; }
.flow-node.flow-kind-det { --kind:#5b8def; }
.flow-node.flow-kind-llm { --kind:#f5a623; }
.flow-node.flow-kind-humano { --kind:#7b6cf6; }
.flow-node.flow-kind-sistema { --kind:#8a94a6; }
.flow-node.flow-kind-ok { --kind:#2ea36b; }
.flow-node.flow-kind-stop { --kind:#d95d52; }

.flow-example { margin-top:10px; border-top:1px dashed var(--line); padding-top:8px; }
.flow-example summary { display:inline-flex; align-items:center; gap:6px; font-size:11.5px; font-weight:500;
  color:var(--accent); cursor:pointer; list-style:none; }
.flow-example summary::-webkit-details-marker { display:none; }
.flow-example p { margin-top:8px; background:#f7f8fb; border:1px solid var(--line); border-radius:10px;
  padding:10px 12px; font-size:12px; color:var(--txt); white-space:pre-wrap; }
.flow-fallback-msg { margin:10px 0 0; background:#f7f8fb; border-left:3px solid var(--accent); border-radius:8px;
  padding:10px 14px; font-size:12.5px; color:var(--txt); }

/* Empilha também no tablet: 3 trilhas só respiram acima de 1024px (mesmo corte da sidebar). */
@media (max-width: 1024px) {
  .flow-lines { display:none; }
  .flow-wrap { padding-left:0; }
  .flow-grid { display:flex; flex-direction:column; gap:0; }
  .flow-node { max-width:none; margin-bottom:0; }
  .flow-node + .flow-node { margin-top:30px; position:relative; }
  .flow-node + .flow-node::before { content:''; position:absolute; top:-30px; left:50%; width:1.5px; height:30px; background:#c3cbd9; }
}

/* ---------------------------------------------------------------------------
   Enxame de agentes (página /agente)
--------------------------------------------------------------------------- */
.swarm-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(min(300px, 100%), 1fr)); gap:20px; }
.swarm-provider-row { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:14px;
  padding-top:12px; border-top:1px dashed var(--line); }
.swarm-url { user-select:all; }
.swarm-card { border:1px solid var(--line); border-radius:var(--radius-sm); padding:16px 18px; background:#fdfdfe;
  transition:transform .15s, box-shadow .15s; }
.swarm-card:hover { transform:translateY(-2px); box-shadow:0 10px 26px rgba(28,43,74,.10); }
.swarm-card.offline { border-color:rgba(217,93,82,.35); background:#fffafa; }
.swarm-head { display:flex; align-items:flex-start; gap:12px; justify-content:space-between; }
.swarm-id { display:flex; flex-direction:column; gap:2px; min-width:0; }
.swarm-id strong { font-size:14px; font-weight:600; }
.swarm-url { font-size:11px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:220px; }
.swarm-pill { display:inline-flex; align-items:center; gap:6px; flex:none; font-size:12.5px; font-weight:700;
  padding:6px 14px; border-radius:999px; letter-spacing:.02em; }
.swarm-pill.on { background:rgba(46,204,113,.14); color:#1d9e56; }
.swarm-pill.off { background:rgba(217,93,82,.13); color:var(--red); }
.swarm-chips { display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; min-height:4px; }
.swarm-chip { display:inline-flex; align-items:center; gap:5px; font-size:10.5px; font-weight:600;
  padding:3px 9px; border-radius:999px; }
.swarm-chip.up { background:rgba(46,204,113,.11); color:#1d9e56; }
.swarm-chip.down { background:rgba(217,93,82,.11); color:var(--red); }
.swarm-kv { margin-top:12px; grid-template-columns:fit-content(110px) minmax(0,1fr); font-size:12.5px; }
.swarm-note { margin-top:12px; }

/* ---------------------------------------------------------------------------
   Base de conhecimento (/conhecimento)
--------------------------------------------------------------------------- */
.kb-upload { display:flex; align-items:flex-end; gap:16px; flex-wrap:wrap; }
.kb-field { display:flex; flex-direction:column; gap:6px; flex:1; min-width:220px; }
.kb-field label { font-size:12.5px; font-weight:500; color:var(--navy); }
.kb-field .input { width:100%; }
input.kb-file { border:1px dashed #cdd4e0; border-radius:10px; padding:9px 12px; background:#fafbfd;
  font:400 12.5px var(--font); color:var(--muted); cursor:pointer; transition:border-color .15s, background .15s; }
input.kb-file:hover { border-color:var(--accent); background:#fffdf7; }
input.kb-file::file-selector-button { border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--txt);
  font:500 12px var(--font); padding:6px 12px; margin-right:10px; cursor:pointer; }
.kb-submit { flex:none; margin-bottom:1px; }
.kb-del { padding:7px 12px; font-size:12px; }
.kb-empty { text-align:center; padding:44px 32px; }
.kb-empty .nf-icon { margin-bottom:16px; }
.kb-empty h2 { font-size:17px; margin-bottom:6px; }

/* ---------------------------------------------------------------------------
   Pré-visualização do pedido de exame (/guia-preview)
--------------------------------------------------------------------------- */
.guia-frame-wrap { max-width:820px; margin:20px auto 0; background:#fff; border:1px solid rgba(228,232,240,.7);
  border-radius:var(--radius); box-shadow:var(--shadow-lift); overflow:hidden; }
.guia-frame { display:block; width:100%; aspect-ratio:210/297; border:none; background:#eef0f3; }
@media (max-width:720px) {
  .kb-upload { flex-direction:column; align-items:stretch; }
  .kb-submit { width:100%; justify-content:center; }
}

/* ---------------------------------------------------------------------------
   Médicos (/medicos) e Meu perfil (/perfil)
--------------------------------------------------------------------------- */
.doc-form { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:14px 18px; }
.doc-form-narrow { grid-template-columns:1fr; max-width:420px; }
.doc-field { display:flex; flex-direction:column; gap:6px; min-width:0; }
.doc-field label { font-size:12.5px; font-weight:500; color:var(--navy); }
.doc-field .input { width:100%; }
.doc-form-actions { grid-column:1 / -1; display:flex; gap:10px; margin-top:4px; }
.doc-actions { display:flex; gap:8px; flex-wrap:wrap; align-items:center; justify-content:flex-end; }
.doc-act { padding:7px 12px; font-size:12px; white-space:nowrap; }
.doc-link-row { display:inline-flex; gap:8px; align-items:center; flex-wrap:wrap; }
.doc-login { font-size:12.5px; font-weight:500; }
.doc-active-badge { margin-left:8px; }
.doc-active-badge .icn { width:12px; height:12px; }

/* Aviso de perfil somente visualização (role 'medico') */
.view-only { display:inline-flex; align-items:flex-start; gap:8px; font-size:12.5px; font-weight:500;
  color:#8a5f10; background:var(--accent-soft); border:1px dashed rgba(245,166,35,.55);
  border-radius:10px; padding:9px 14px; line-height:1.55; }
.view-only .icn { flex:none; margin-top:2px; }
.view-only-card { padding:16px 20px; }
.view-only-card .view-only { background:transparent; border:none; padding:0; }

@media (max-width:720px) {
  .doc-form { grid-template-columns:1fr; }
  .doc-actions { justify-content:flex-start; }
}

/* ---------------------------------------------------------------------------
   Telas bem estreitas (fim do arquivo de propósito: ganha a cascata das
   regras base de .doc-card/.swarm-kv definidas acima)
--------------------------------------------------------------------------- */
@media (max-width:520px) {
  .kv, .swarm-kv { grid-template-columns:1fr; gap:2px 0; }
  .kv dt { margin-top:10px; }
  .kv dt:first-of-type { margin-top:0; }
  /* Card de médico: o selo "Responsável" desce para a linha de baixo em vez de
     esmagar o nome e o CRM. */
  .doc-card { flex-wrap:wrap; }
  .doc-card-id { flex:1 1 auto; min-width:calc(100% - 76px); }
  .doc-card-id strong { white-space:normal; }
  .doc-card .badge { margin-left:60px; }
  .doc-card-chev { display:none; }
}

/* Datepicker no toque: alvos de dedo (as regras base dele estão acima). */
@media (pointer:coarse) {
  .dp-pop { width:min(320px, calc(100vw - 24px)); }
  .dp-day, .dp-yy { padding:11px 0; font-size:14px; }
  .dp-nav { width:40px; height:40px; }
}