/* Acabamento compartilhado. Sem alterar ordem, rotas ou cores dos estados clínicos. */
#app {
  --linha: #dce3ea;
  --fundo: #f5f7fa;
  --cinza: #607184;
  --raio: 12px;
  --sombra: 0 2px 8px rgba(24,39,56,.045);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
#app #topbar { background:#fff; border-bottom:1px solid #dce3ea; box-shadow:0 1px 4px #172b4d06; }
#app #topbar .titulo { letter-spacing:-.025em; font-weight:650; }
#app #view { background:#f5f7fa; }
#app .pane { min-width:0; }
#app .btn { border-radius:9px; box-shadow:0 1px 2px #16283b0a; font-weight:600; transition:background-color .12s,border-color .12s; }
#app .btn:hover { box-shadow:0 2px 5px #16283b10; }
#app .btn.ghost { border-color:#ccd6e1; box-shadow:none; }
#app .btn.ghost:hover { border-color:#93a8bb; background:#f0f5f9; }
#app button:disabled, #modal button:disabled { cursor:not-allowed; }
#app :is(button,a,input,select,textarea):focus-visible,
#modal :is(button,a,input,select,textarea):focus-visible { outline:2px solid #1477ab; outline-offset:3px; }
#app :is(input,select,textarea) { scroll-margin:70px; }
#app :is(.card,.cc-card,.cc-kpi,.cc-rel-card,.cc-prioridades) { box-shadow:0 2px 8px #18273806; }
#app .cc-topo { background:#fff; border:1px solid #dce3ea; border-radius:14px; padding:18px 20px; gap:16px; }
#app .cc-topo > div { min-width:0; }
#app .cc-topo .muted { line-height:1.6; margin-top:5px; max-width:850px; }
#app .cc-cards { gap:14px; grid-template-columns:repeat(auto-fill,minmax(min(310px,100%),1fr)); }
#app .cc-card { padding:18px; border-color:#dce3ea; border-radius:14px; }
#app .cc-card-t { gap:9px; line-height:1.45; }
#app .cc-card-t > b { font-size:14px; letter-spacing:-.015em; }
#app .cc-card-acoes { padding-top:12px; margin-top:14px; gap:8px; border-color:#edf1f5; }
#app .cc-mini { min-height:32px; border-radius:8px; font-weight:600; }
#app .cc-prev { padding:10px 12px; line-height:1.55; background:#f6f8fa; color:#526579; }
#app .cc-exec { background:#fff; border-color:#dce3ea; }
#app .cc-exec-acoes > div { border-left-color:#7895ab; background:#f6f8fa; }
#app .cc-exec-acoes b { color:#3c566b; }
#app .cc-exec-item:not(.alerta) { background:#f8fafc; }
#app .estado-tela { border-radius:14px; line-height:1.6; }
#app .estado-tela > b { letter-spacing:-.02em; }
#app .cc-vazio { background:#fff; border:1px dashed #cbd6e0; }
#app .cc-vazio .estado-icone { color:#42647d; background:#edf3f7; }
#app .gf-ic { display:inline-flex; align-items:center; justify-content:center; flex:none; }
#app :is(.gf-ic,.cc-ic) svg { display:block; width:17px; height:17px; }
#app .gf-aba { min-height:37px; border-radius:8px; gap:7px; font-weight:550; }
#app .gf-aba:not(.on) { color:#526579; }
#app .gf-aba.on { background:#edf4f8; color:#173b52; border-color:#b9cfdf; box-shadow:none; }
#app #grupo-faixa { background:#fff; border-bottom:1px solid #dce3ea; }
#app .cc-grupo .cc-gic { box-shadow:none; }
#app #taskbar { background:#fff; border-top:1px solid #dce3ea; gap:6px; padding-top:7px; padding-bottom:7px; }
#app #taskbar .tab { border-radius:8px; box-shadow:none; min-height:32px; }
#app #taskbar .tab:not(.on) { border-color:#dde4ec; background:#fff; color:#4b6073; }
#app #taskbar .tab.on { background:#193e56; border-color:#193e56; color:#fff; box-shadow:0 2px 4px #193e5614; }
#app #taskbar .tab .x { width:22px; min-height:22px; display:inline-flex; align-items:center; justify-content:center; border-radius:5px; }
#app #taskbar .tab .x:hover { background:#7895ab24; }
#modal .modal-card { border-color:#dce3ea; box-shadow:0 24px 70px #1224382b; }
#modal .close-x { border-radius:10px; }
#modal .modal-card label { color:#526579; }
#modal .modal-card :is(input:not([type=checkbox]):not([type=radio]),select,textarea) { border-radius:8px; }
/* Qualificação comercial: evidência da compra separada do cadastro. */
.cc-compra-ajuda { padding:12px 15px; margin:12px 0; border:1px solid #dce5ec; border-radius:10px; background:#f4f8fb; color:#486075; font-size:13px; line-height:1.6; }
#app .cc-compra-status { display:flex; flex-direction:column; gap:4px; align-items:flex-start; min-height:44px; padding:9px 12px; border:1px solid #c5d7e3; border-radius:9px; background:#f8fbfd; color:#173e57; cursor:pointer; text-align:left; }
#app .cc-compra-status:hover { background:#edf5fa; border-color:#709db8; }
#app .cc-compra-status small { color:#60788b; }
#app .cc-compra-origem { display:block; margin-top:6px; color:#5c7081; line-height:1.5; }
#app .cc-compra-divergente { display:block; margin-top:6px; padding:5px 8px; border-radius:6px; background:#fff7e8; color:#825900; }
#app .drp-comparativo { overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:thin; }
#app .drp-comparativo:focus-visible { outline:2px solid #1477ab; outline-offset:3px; }
#app .fv-ver-todos { max-width:100%; white-space:normal!important; overflow-wrap:anywhere; min-width:0; }
#app .ccv-envio-pendente .ccv-msg { border:1px solid #dfc89c; background:#fffbf2; }
#app .ccv-envio-pendente .ccv-msg-meta { color:#765d32; white-space:normal; line-height:1.5; }
#app .ccv-envio-pendente.falhou .ccv-msg { border-color:#e2bbbb; background:#fff7f7; }
#app #ccv-shell .ccv-anexo-previa[hidden] { display:none; }
#app #ccv-shell .ccv-coleta { background:#f7f9fc; border-color:#dce5ed; color:#516b80; }
#app .ccv-coleta-detalhes { width:100%; }
#app .ccv-coleta-detalhes summary { cursor:pointer; padding:4px 0; font-size:12px; font-weight:600; }
#app .ccv-coleta-detalhes summary small { margin-left:10px; font-weight:400; text-decoration:underline; }
#app .ccv-coleta-corpo { display:flex; flex-wrap:wrap; align-items:center; gap:7px; padding-top:10px; }
@media (max-width:680px) {
  /* As listas viram fichas sem duplicar controles, valores ou eventos. */
  #app .lm-tabela, #app .lm-tabela > tbody { display:block; width:100%!important; min-width:0!important; max-width:100%; border:0; }
  #app .lm-tabela > tbody > tr { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 14px; margin:10px 0; padding:14px; border:1px solid #dce3ea; border-radius:12px; background:#fff; box-shadow:0 2px 6px #193e5606; }
  #app .lm-tabela > tbody > tr[hidden] { display:none!important; }
  #app .lm-tabela > tbody > tr > td { display:block; min-width:0!important; width:auto!important; max-width:100%; padding:9px 0!important; border:0; border-bottom:1px solid #edf1f5; background:transparent!important; white-space:normal!important; overflow-wrap:anywhere; text-align:left!important; font-size:13px; line-height:1.5; }
  #app .lm-tabela td[data-lm-campo]::before { content:attr(data-lm-campo); display:block; margin-bottom:4px; color:#607184; font-size:11px; font-weight:600; line-height:1.4; }
  #app .lm-tabela > tbody > tr > td.lm-inteira, #app .lm-tabela > tbody > tr.lm-linha-composta > td { grid-column:1/-1; }
  #app .lm-tabela > tbody > tr > td.lm-titulo { padding-top:0!important; color:#18374c; font-size:15px; }
  #app .lm-tabela td :is(button,a,input,select) { max-width:100%; white-space:normal; }
  #app .lm-tabela td :is(button,.btn) { min-height:44px; }
  #app .lm-tabela td input[type=checkbox], #app .lm-tabela th input[type=checkbox] { width:22px; height:22px; }
  #app .lm-tabela td.cfo-acoes { display:flex; flex-wrap:wrap; gap:8px; }
  #app .lm-tabela td.cfo-acoes::before { flex-basis:100%; }
  #app .lm-tabela > thead { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
  /* Ordenação e pesquisa do cabeçalho continuam acessíveis, com os mesmos
     elementos e handlers. Nada de esconder um filtro para caber na tela. */
  #app .lm-tabela > thead.lm-com-ferramentas { display:block; position:static; width:100%; height:auto; overflow:visible; clip-path:none; background:transparent; }
  #app .lm-tabela > thead.lm-com-ferramentas > tr { display:flex; flex-wrap:wrap; gap:8px; padding:8px 0; }
  #app .lm-tabela > thead.lm-com-ferramentas th { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
  #app .lm-tabela > thead.lm-com-ferramentas th.lm-ferramenta { display:block; position:relative; width:auto!important; height:auto; min-height:44px; padding:10px 16px; clip-path:none; overflow:visible; border:1px solid #dce3ea; border-radius:9px; background:#f5f8fa; color:#29495f; text-align:left!important; white-space:normal; }
  #app .lm-tabela > thead th.lm-ferramenta:has(input) { flex:1 1 100%; }
  #app .lm-tabela > thead th.lm-ferramenta input { width:100%; }
  #app .lm-recipiente { min-width:0; max-width:100%; overflow-x:clip!important; }
  #app .lm-tabela .trf-mini img { width:64px; height:64px; object-fit:cover; border-radius:8px; }
  #app .fv-col { min-width:0; max-width:calc(100vw - 32px); }
  #app .fv-col :is(.fv-card,.fv-col-cab) { min-width:0; overflow-wrap:anywhere; }
  #app .cc-topo { padding:14px; }
  #app .cc-topo > .btn { flex-shrink:0; }
  #app .cc-card { padding:14px; }
  #app .gf-aba { min-height:40px; }
  /* Uma única fileira rolável: a navegação não cobre o conteúdo da Mova. */
  body.cc-modo #sidebar { height:calc(72px + env(safe-area-inset-bottom,0px)); box-sizing:border-box; gap:0; padding:4px 6px calc(4px + env(safe-area-inset-bottom,0px)); }
  body.cc-modo #sidebar .cc-grupos { display:flex; flex-direction:row; flex-wrap:nowrap; flex:1 0 auto; width:max-content; gap:4px; overflow:visible; }
  body.cc-modo #sidebar .cc-grupo { flex:0 0 76px; min-width:76px; max-width:90px; height:60px; padding:4px; justify-content:center; font-size:10px; line-height:1.15; }
  body.cc-modo #sidebar .cc-gic { width:25px; height:25px; border-radius:7px; }
  body.cc-modo #sidebar .cc-voltar { flex:0 0 76px; min-height:60px; font-size:11px; }
  body.cc-modo #main { padding-bottom:calc(82px + env(safe-area-inset-bottom,0px)); }
  #app .cc-topo { flex-wrap:wrap; }
  #app .cc-topo :is(input,select) { flex:1 1 100%; min-width:0; max-width:100%; }
  #app :is(input:not([type=checkbox]):not([type=radio]),select,textarea),
  #modal :is(input:not([type=checkbox]):not([type=radio]),select,textarea) { font-size:16px; min-width:0; max-width:100%; }
  #app :is(input:not([type=checkbox]):not([type=radio]),select) { min-height:44px; }
  #app .btn, #app .cc-mini { min-height:42px; }
  #app .cc-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  #app .cc-kpi { min-width:0; padding:12px; }
  #app .cc-kpi-n { font-size:24px; }
  #app .cc-kpi-t { font-size:12px; line-height:1.4; }
  #app .cc-kpi-s { font-size:11px; line-height:1.5; }
  #app #cc-clista { background:transparent; border:0; box-shadow:none; overflow:visible!important; }
  #app #cc-clista table, #app #cc-clista tbody { display:block; width:100%; }
  #app #cc-clista thead { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
  #app #cc-clista tr { display:grid; grid-template-columns:minmax(0,1fr); padding:12px 14px; margin-bottom:12px; background:#fff; border:1px solid #dce3ea; border-radius:12px; }
  #app #cc-clista td { display:block; padding:8px 0; border:0; white-space:normal; overflow-wrap:anywhere; font-size:13px; }
  #app #cc-clista td+td { border-top:1px solid #edf1f5; }
  #app #cc-clista td::before { content:attr(data-campo); display:block; margin-bottom:4px; color:#6a7e8f; font-size:11px; font-weight:600; }
  #app #cc-clista td:first-child { font-size:16px; color:#18374c; }
  #app #cc-clista td:first-child::before { display:none; }
  #app .cc-contatos-pag { flex-wrap:wrap; gap:12px; padding:10px 0; }
  #app #la-cat { width:100%; min-width:0; }
  #modal .modal-card { width:calc(100vw - 20px)!important; max-width:calc(100vw - 20px); max-height:calc(100dvh - 24px); padding:22px 16px; border-radius:16px; }
  #modal .modal-card .grid2 { grid-template-columns:minmax(0,1fr); }
  #modal .modal-card label { min-width:0; }
  #modal .modal-card .row { flex-wrap:wrap; }
  #app #ccv-shell .ccv-grid { height:calc(100dvh - 245px); min-height:360px; }
  #app #ccv-shell .ccv-thread-head { padding:10px; gap:8px; }
  #app #ccv-shell .ccv-composer textarea { min-height:44px; font-size:16px; }
  #app #ccv-shell .ccv-topo { padding:12px; gap:10px; }
  #app #ccv-shell .ccv-titulo span:not(.ccv-marca) { font-size:12px; }
  #app #ccv-shell.tem-conversa .ccv-topo .ccv-titulo { display:none; }
  #app #ccv-shell .ccv-sessao { flex-wrap:wrap; gap:6px; }
  #app #ccv-shell .ccv-sessao .ccv-mini { margin-left:auto; }
  body.cc-modo .fxv-chamar { bottom:calc(88px + env(safe-area-inset-bottom,0px)); }
  body.cc-modo .rpt-chamar { bottom:calc(148px + env(safe-area-inset-bottom,0px)); }
  /* Durante a escrita, os atalhos flutuantes não cobrem Enviar. Ao sair do
     compositor, voltam ao lugar sem fechar nem desativar o assistente. */
  body:has(.pane.on :is(.ccv-composer,.rel-comp):focus-within) :is(.fxv-chamar,.rpt-chamar) { visibility:hidden; pointer-events:none; }
}
@media (prefers-reduced-motion:reduce) {
  #app *, #modal * { scroll-behavior:auto!important; animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
}