/* ====== Sistema odontológico — estilos próprios (sobre o Pico.css) ====== */
:root {
  --pico-font-size: 100%;
  --cor-marca: #0f6e8c;
  --cor-marca-texto: #0f6e8c;
  --cor-ok: #2e7d32;
  --cor-aviso: #b26a00;
  --cor-erro: #c62828;
  --cor-info: #1565c0;
  --altura-menu-inferior: 64px;
}
:root:not([data-theme="dark"]) { --pico-primary: var(--cor-marca); --pico-primary-background: var(--cor-marca); --pico-primary-border: var(--cor-marca); --pico-primary-hover-background: #0b5670; --pico-primary-hover: #0b5670; }

body.com-menu { padding-bottom: calc(var(--altura-menu-inferior) + 16px); }
main.container { padding-top: 1rem; }
h1 { font-size: 1.6rem; margin-bottom: .75rem; }
h2 { font-size: 1.25rem; margin-bottom: .6rem; }
h3 { font-size: 1.08rem; margin-bottom: .5rem; }
small.muted, .muted { color: var(--pico-muted-color); }
.nowrap { white-space: nowrap; }
.direita { text-align: right; }
.centro { text-align: center; }
.oculto { display: none !important; }
.mt { margin-top: 1rem; }
.sem-margem { margin: 0; }

/* ---------- Topo ---------- */
.topo { position: sticky; top: 0; z-index: 20; background: var(--pico-background-color); border-bottom: 1px solid var(--pico-muted-border-color); }
.topo .barra { display: flex; align-items: center; gap: .75rem; padding: .5rem 0; }
.topo .marca { display: flex; align-items: center; gap: .5rem; text-decoration: none; font-weight: 700; color: var(--cor-marca-texto); white-space: nowrap; }
.topo .marca img { height: 34px; width: auto; }
.topo form.busca-global { flex: 1; margin: 0; }
.topo form.busca-global input { margin: 0; height: 2.4rem; padding-top: .3rem; padding-bottom: .3rem; }
.topo details.dropdown { margin: 0; }
.topo details.dropdown summary { height: 2.4rem; padding: .3rem .7rem; }
.topo .abre-menu { width: auto; margin: 0; padding: .3rem .65rem; height: 2.4rem; font-size: 1.2rem; line-height: 1; background: transparent; color: inherit; border: 1px solid var(--pico-muted-border-color); }
@media (max-width: 600px) { .topo .marca span { display: none; } }

/* ---------- Menu lateral (recolhível no computador; gaveta no celular e tablet em pé) ---------- */
:root { --lateral: 258px; --lateral-recolhida: 64px; }
.lateral { position: fixed; top: 0; bottom: 0; left: 0; z-index: 50; width: min(82vw, 290px); display: flex; flex-direction: column;
  background: var(--pico-card-background-color); border-right: 1px solid var(--pico-muted-border-color);
  transform: translateX(-102%); transition: transform .2s ease; overflow-y: auto; overflow-x: hidden; }
body.menu-aberto .lateral { transform: none; box-shadow: 0 0 24px rgba(0, 0, 0, .35); }
.lateral-fundo { display: none; position: fixed; inset: 0; z-index: 45; background: rgba(0, 0, 0, .45); }
body.menu-aberto .lateral-fundo { display: block; }
.lateral-topo { display: flex; align-items: center; gap: .4rem; padding: .6rem .6rem .6rem .8rem; min-height: 3.4rem; border-bottom: 1px solid var(--pico-muted-border-color); }
.lateral .marca { flex: 1; min-width: 0; display: flex; align-items: center; gap: .55rem; text-decoration: none; font-weight: 700; color: var(--cor-marca-texto); }
.lateral .marca img { height: 32px; width: auto; max-width: 40px; object-fit: contain; }
.lateral .marca .ico { font-size: 1.5rem; line-height: 1; }
.lateral .marca .rotulo { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lateral button { width: auto; margin: 0; background: transparent; color: var(--pico-muted-color); border: 1px solid var(--pico-muted-border-color); padding: .2rem .5rem; line-height: 1.2; }
.lateral .lateral-alterna { display: none; }
.lateral nav { display: flex; flex-direction: column; gap: .15rem; padding: .6rem .5rem; }
.lateral .item { display: flex; align-items: center; gap: .8rem; padding: .62rem .75rem; border-radius: 8px; text-decoration: none; color: var(--pico-color); white-space: nowrap; border-left: 3px solid transparent; }
.lateral .item:hover { background: var(--pico-secondary-focus, rgba(0, 0, 0, .06)); }
.lateral .item.ativo { background: var(--pico-primary-focus); border-left-color: var(--cor-marca); font-weight: 600; color: var(--cor-marca-texto); }
.lateral .item .ico { width: 1.7rem; text-align: center; font-size: 1.3rem; line-height: 1; flex: none; }
.lateral .grupo { margin: .9rem .75rem .25rem; font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--pico-muted-color); }
.lateral .seta-expandir { display: none; }

@media (min-width: 1024px) {
  body.com-menu { padding-bottom: 1rem; }
  body.com-menu { padding-left: var(--lateral); transition: padding-left .2s ease; }
  html.menu-recolhido body.com-menu { padding-left: var(--lateral-recolhida); }
  .lateral { width: var(--lateral); transform: none; transition: width .2s ease; box-shadow: none !important; }
  html.menu-recolhido .lateral { width: var(--lateral-recolhida); }
  .lateral-fundo, body.menu-aberto .lateral-fundo { display: none; }
  .lateral .lateral-fechar, .topo .abre-menu, .topo .marca { display: none; }
  .lateral .lateral-alterna { display: block; flex: none; }
  .menu-inferior { display: none !important; }
  /* o espaço ganho vai para o conteúdo: odontograma e silhuetas ficam mais largos */
  body main.container, body .topo .container { max-width: none; margin-inline: 0; padding-inline: 1.25rem; }
  /* recolhido: só os ícones */
  html.menu-recolhido .lateral .rotulo, html.menu-recolhido .lateral .grupo .rotulo { display: none; }
  html.menu-recolhido .lateral .grupo { height: 1px; margin: .6rem .75rem; background: var(--pico-muted-border-color); font-size: 0; }
  html.menu-recolhido .lateral-topo { flex-direction: column; padding: .5rem .3rem; gap: .4rem; }
  html.menu-recolhido .lateral .marca { flex: none; justify-content: center; }
  html.menu-recolhido .lateral .item { justify-content: center; padding-inline: 0; gap: 0; }
  html.menu-recolhido .lateral .seta-recolher { display: none; }
  html.menu-recolhido .lateral .seta-expandir { display: inline; }
}
@media (max-width: 1023px) {
  .lateral .lateral-fechar { display: block; }
}
@media (min-width: 1024px) { .lateral .lateral-fechar { display: none; } }

/* ---------- Menu inferior (celular/tablet) ---------- */
.menu-inferior { position: fixed; left: 0; right: 0; bottom: 0; height: var(--altura-menu-inferior); z-index: 30;
  display: flex; background: var(--pico-background-color); border-top: 1px solid var(--pico-muted-border-color); box-shadow: 0 -2px 8px rgba(0,0,0,.06); }
.menu-inferior a, .menu-inferior button { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  text-decoration: none; font-size: .75rem; color: var(--pico-muted-color); }
.menu-inferior button { background: transparent; border: 0; border-radius: 0; margin: 0; padding: 0; width: auto; }
.menu-inferior a .ico, .menu-inferior button .ico { font-size: 1.35rem; line-height: 1; }
.menu-inferior a.ativo { color: var(--cor-marca-texto); font-weight: 600; }
.menu-inferior a.destaque .ico { background: var(--cor-marca); color: #fff; border-radius: 50%; width: 2.2rem; height: 2.2rem; display: flex; align-items: center; justify-content: center; }

/* ---------- Mensagens ---------- */
.mensagens { display: grid; gap: .5rem; margin-bottom: 1rem; }
.msg { padding: .7rem 1rem; border-radius: 8px; border-left: 5px solid; background: var(--pico-card-background-color); box-shadow: var(--pico-card-box-shadow); }
.msg.sucesso { border-color: var(--cor-ok); }
.msg.erro { border-color: var(--cor-erro); }
.msg.aviso { border-color: var(--cor-aviso); }
.msg.info { border-color: var(--cor-info); }

/* ---------- Cabeçalho de página ---------- */
.cabecalho { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: 1rem; }
.cabecalho h1 { margin: 0; }
.acoes { display: flex; flex-wrap: wrap; gap: .5rem; }
.acoes > *, .acoes form button { margin: 0; width: auto; }
.acoes form { margin: 0; }
a[role="button"], button { white-space: nowrap; }
.btn-pequeno { padding: .3rem .65rem !important; font-size: .85rem; }
button.perigo, a.perigo[role="button"] { --pico-background-color: var(--cor-erro); --pico-border-color: var(--cor-erro); }
button.outline.perigo { --pico-color: var(--cor-erro); background: transparent; }
.btn-whatsapp { --pico-background-color: #25d366; --pico-border-color: #25d366; --pico-color: #fff; }
.voltar { display: inline-block; margin-bottom: .5rem; text-decoration: none; }

/* botões grandes para toque */
@media (max-width: 1023px) { .acoes a[role="button"], .acoes button { padding: .65rem 1rem; } }

/* ---------- Cartões / grade ---------- */
.grade { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.grade-2 { display: grid; gap: 0 1rem; grid-template-columns: 1fr; }
.grade-3 { display: grid; gap: 0 1rem; grid-template-columns: 1fr; }
.grade-4 { display: grid; gap: 0 1rem; grid-template-columns: 1fr 1fr; }
@media (min-width: 700px) {
  .grade-2 { grid-template-columns: 1fr 1fr; }
  .grade-3 { grid-template-columns: repeat(3, 1fr); }
  .grade-4 { grid-template-columns: repeat(4, 1fr); }
}
article { margin-bottom: 1rem; padding: 1rem 1.1rem; }
article > header { padding: .6rem 1.1rem; margin: -1rem -1.1rem 1rem; }
.cartao-resumo { margin: 0; }
.cartao-resumo .rotulo { font-size: .8rem; text-transform: uppercase; letter-spacing: .03em; color: var(--pico-muted-color); }
.cartao-resumo .valor { font-size: 1.35rem; font-weight: 700; margin: .15rem 0; }
.cartao-resumo.alerta { border-left: 5px solid var(--cor-aviso); }
.cartao-resumo.perigo { border-left: 5px solid var(--cor-erro); }
.cartao-resumo.ok { border-left: 5px solid var(--cor-ok); }
.atalhos { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); margin-bottom: 1.25rem; }
.atalhos a[role="button"] { padding: 1rem; font-size: 1.05rem; }

/* ---------- Etiquetas de status ---------- */
.badge { display: inline-block; padding: .15rem .55rem; border-radius: 999px; font-size: .78rem; font-weight: 600; white-space: nowrap; background: #e0e0e0; color: #333; }
.badge.aberta { background: #e3f2fd; color: #0d47a1; }
.badge.aguardando_lab { background: #fff3e0; color: #8a4b00; }
.badge.pronta { background: #e8f5e9; color: #1b5e20; }
.badge.entregue { background: #eceff1; color: #37474f; }
.badge.cancelada { background: #ffebee; color: #b71c1c; text-decoration: line-through; }
.badge.atrasada { background: #ffebee; color: #b71c1c; }
/* Status do tratamento */
.badge.orcamento { background: #ede7f6; color: #4527a0; }
.badge.aprovado { background: #e3f2fd; color: #0d47a1; }
.badge.em_tratamento { background: #fff3e0; color: #8a4b00; }
.badge.concluido { background: #e8f5e9; color: #1b5e20; }
.badge.recusado { background: #eceff1; color: #616161; }
.badge.cancelado { background: #ffebee; color: #b71c1c; text-decoration: line-through; }
.badge.aviso { background: #fff3e0; color: #8a4b00; }
.badge.inativo { background: #eceff1; color: #616161; }
.saldo-devedor { color: var(--cor-erro); font-weight: 700; }
.saldo-ok { color: var(--cor-ok); font-weight: 700; }

/* ---------- Tabelas ---------- */
.tabela-rolagem { overflow-x: auto; -webkit-overflow-scrolling: touch; }
table { margin-bottom: .5rem; }
table td, table th { padding: .55rem .5rem; }
tr.clicavel { cursor: pointer; }
tr.clicavel:hover td { background: var(--pico-primary-focus); }
/* Lista em cartões no celular */
@media (max-width: 700px) {
  table.responsiva thead { display: none; }
  table.responsiva, table.responsiva tbody, table.responsiva tr, table.responsiva td { display: block; width: 100%; }
  table.responsiva tr { border: 1px solid var(--pico-muted-border-color); border-radius: 8px; margin-bottom: .6rem; padding: .35rem .6rem; }
  table.responsiva td { border: none; padding: .2rem 0; display: flex; justify-content: space-between; gap: 1rem; text-align: right; }
  table.responsiva td::before { content: attr(data-label); font-weight: 600; color: var(--pico-muted-color); text-align: left; }
  table.responsiva td[data-label=""]::before { content: none; }
}

/* ---------- Tabela de graus ---------- */
table.graus { text-align: center; }
table.graus th, table.graus td { text-align: center; padding: .4rem .3rem; }
table.graus th:first-child, table.graus td:first-child { text-align: left; font-weight: 700; }
table.graus select, table.graus input { margin: 0; padding: .45rem .3rem; min-width: 4.6rem; text-align: center; background-position: right .2rem center; padding-right: 1.1rem; }
table.graus input { padding-right: .3rem; }
.graus-form { overflow-x: auto; }

/* ---------- Formulários ---------- */
form .erros-form { color: var(--cor-erro); }
label .obrigatorio { color: var(--cor-erro); }
.campo-erro { color: var(--cor-erro); display: block; margin-top: -.6rem; margin-bottom: .6rem; font-size: .85rem; }
fieldset.grupo { min-width: 0; min-inline-size: 0; border: 1px solid var(--pico-muted-border-color); border-radius: 8px; padding: .75rem 1rem 0; margin-bottom: 1rem; }
fieldset.grupo legend { padding: 0 .4rem; font-weight: 600; }
.cep-status { display: block; margin-top: -.6rem; margin-bottom: .6rem; font-size: .85rem; min-height: 1em; }
.cep-status .ok { color: var(--cor-ok); }
.cep-status .erro { color: var(--cor-aviso); }
.barra-salvar { position: sticky; bottom: calc(var(--altura-menu-inferior)); background: var(--pico-background-color); padding: .75rem 0; border-top: 1px solid var(--pico-muted-border-color); display: flex; gap: .5rem; flex-wrap: wrap; z-index: 5; }
.barra-salvar > * { margin: 0; width: auto; flex: 1 1 auto; }
@media (min-width: 1024px) { .barra-salvar { bottom: 0; } .barra-salvar > * { flex: 0 0 auto; } }
.form-inline { display: grid; gap: 0 .6rem; grid-template-columns: 1fr; align-items: end; }
@media (min-width: 700px) {
  .form-item { grid-template-columns: 2fr 2fr .7fr 1fr auto; }
  .form-pagamento { grid-template-columns: 1fr 1fr 1.2fr .7fr auto; }
  .form-desconto { grid-template-columns: 1fr 1fr auto; max-width: 480px; }
}
.form-inline button { margin-bottom: var(--pico-spacing); }

/* ---------- Autocomplete ---------- */
.autocomplete { position: relative; }
.autocomplete-lista { position: absolute; left: 0; right: 0; top: calc(100% - var(--pico-spacing)); z-index: 15; background: var(--pico-card-background-color);
  border: 1px solid var(--pico-muted-border-color); border-radius: 8px; box-shadow: var(--pico-card-box-shadow); max-height: 260px; overflow-y: auto; }
.autocomplete-lista:empty { display: none; }
.autocomplete-lista button { display: block; width: 100%; text-align: left; background: none; border: none; color: var(--pico-color); padding: .6rem .8rem; border-radius: 0; margin: 0; }
.autocomplete-lista button:hover { background: var(--pico-primary-focus); }
.selecionado { display: flex; align-items: center; gap: .5rem; margin-bottom: var(--pico-spacing); }

/* ---------- Abas (ficha do cliente) ---------- */
.abas { display: flex; gap: .25rem; overflow-x: auto; border-bottom: 2px solid var(--pico-muted-border-color); margin-bottom: 1rem; }
.abas button { background: none; border: none; color: var(--pico-muted-color); border-bottom: 3px solid transparent; border-radius: 0; margin: 0 0 -2px; padding: .6rem .9rem; }
.abas button.ativa { color: var(--cor-marca-texto); border-bottom-color: var(--cor-marca-texto); font-weight: 600; }
.painel-aba { display: none; }
.painel-aba.ativa { display: block; }
@media (min-width: 1024px) {
  .abas.so-mobile { display: none; }
  .paineis-desktop .painel-aba { display: block; margin-bottom: 1.5rem; }
}
.painel-aba > h2.titulo-desktop { display: none; }
@media (min-width: 1024px) { .paineis-desktop .painel-aba > h2.titulo-desktop { display: block; } }

/* ---------- Anexos ---------- */
.anexos { display: flex; flex-wrap: wrap; gap: .6rem; }
.anexo { width: 110px; text-align: center; font-size: .75rem; word-break: break-all; }
.anexo a.miniatura { display: flex; align-items: center; justify-content: center; width: 110px; height: 110px; border: 1px solid var(--pico-muted-border-color); border-radius: 8px; overflow: hidden; background: var(--pico-card-sectioning-background-color); text-decoration: none; font-size: 2rem; }
.anexo img { max-width: 100%; max-height: 100%; object-fit: cover; }
.upload-botoes { display: flex; gap: .75rem; flex-wrap: wrap; }
.upload-botoes label { flex: 1 1 200px; }
.upload-botoes input[type=file] { margin-bottom: .3rem; }
.upload-lista { font-size: .85rem; color: var(--pico-muted-color); }

/* ---------- Configurações ---------- */
.subnav { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 1rem; }
.subnav a { padding: .4rem .8rem; border-radius: 999px; border: 1px solid var(--pico-muted-border-color); text-decoration: none; }
.subnav a.ativo { background: var(--cor-marca); color: #fff; border-color: var(--cor-marca); }

/* ---------- Totais da OS ---------- */
.totais { margin-left: auto; max-width: 360px; }
.totais div { display: flex; justify-content: space-between; padding: .25rem 0; }
.totais .total { font-size: 1.2rem; font-weight: 700; border-top: 1px solid var(--pico-muted-border-color); padding-top: .4rem; }
.auditoria { font-size: .8rem; color: var(--pico-muted-color); margin-top: 1.5rem; }
.linha-tempo { list-style: none; padding: 0; margin: 0; font-size: .9rem; }
.linha-tempo li { padding: .3rem 0; border-bottom: 1px dashed var(--pico-muted-border-color); list-style: none; }

/* ---------- Login ---------- */
.pagina-login { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 1rem; }
.pagina-login article { width: 100%; max-width: 400px; }
.pagina-login .logo-login { text-align: center; margin-bottom: 1rem; }
.pagina-login .logo-login img { max-height: 80px; }

/* ---------- Paginação ---------- */
.paginacao { display: flex; gap: .5rem; align-items: center; justify-content: center; margin-top: 1rem; }

/* ---------- Agenda ---------- */
.nav-dia { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; margin-bottom: .5rem; }
.nav-dia > * { margin: 0 !important; width: auto; }
.nav-dia input[type=date] { margin: 0; width: auto; }
.titulo-dia { }
.agenda-layout { display: grid; gap: 1rem; grid-template-columns: 1fr; }
@media (min-width: 1024px) { .agenda-layout { grid-template-columns: 1fr 320px; } }
.resumo-dia { grid-template-columns: repeat(3, 1fr); gap: .5rem; margin-bottom: 1rem; }
.resumo-dia article { padding: .6rem .8rem; }
.resumo-dia .valor { font-size: 1.15rem; }
.linhas-agenda { border: 1px solid var(--pico-muted-border-color); border-radius: 10px; overflow: hidden; background: var(--pico-card-background-color); }
.linha-agenda { display: flex; gap: .75rem; align-items: stretch; border-bottom: 1px solid var(--pico-muted-border-color); min-height: 3rem; }
.linha-agenda:last-child { border-bottom: none; }
.linha-agenda .ag-hora { width: 4rem; flex: 0 0 4rem; padding: .7rem .6rem; font-weight: 700; background: var(--pico-card-sectioning-background-color); }
.linha-agenda .ag-conteudo { flex: 1; padding: .45rem .5rem; display: flex; flex-direction: column; gap: .35rem; justify-content: center; }
.linha-agenda.livre .ag-hora { color: var(--cor-ok); }
.linha-agenda.passado, .linha-agenda.feriado, .linha-agenda.bloqueado { opacity: .7; }
.linha-agenda.bloqueado .ag-conteudo { background: repeating-linear-gradient(45deg, transparent, transparent 6px, rgba(0,0,0,.035) 6px, rgba(0,0,0,.035) 12px); }
.linha-agenda.intervalo { min-height: 2rem; background: var(--pico-card-sectioning-background-color); }
.linha-agenda.intervalo .ag-hora { padding: .35rem .6rem; font-weight: 400; color: var(--pico-muted-color); }
.ag-livre { text-decoration: none; color: var(--cor-ok); font-weight: 600; }
.ag-cartao { display: block; text-decoration: none; color: var(--pico-color); border-left: 4px solid var(--cor-marca); padding: .3rem .6rem; border-radius: 4px; background: var(--pico-primary-focus); }
.ag-item { display: flex; gap: .8rem; text-decoration: none; color: var(--pico-color); padding: .5rem 0; border-bottom: 1px dashed var(--pico-muted-border-color); }
.ag-item:last-child { border-bottom: none; }
.ag-item .ag-hora { font-weight: 700; min-width: 3.2rem; }
.badge.ag-agendado { background: #e3f2fd; color: #0d47a1; }
.badge.ag-confirmado { background: #e8f5e9; color: #1b5e20; }
.badge.ag-atendido { background: #eceff1; color: #37474f; }
.badge.ag-nao_compareceu { background: #fff3e0; color: #8a4b00; }
.badge.ag-cancelado { background: #ffebee; color: #b71c1c; text-decoration: line-through; }
.badge.online { background: #ede7f6; color: #4527a0; }
.lista-lembretes { list-style: none; padding: 0; margin: 0; }
.lista-lembretes li { list-style: none; padding: .45rem 0; border-bottom: 1px dashed var(--pico-muted-border-color); }
.lista-lembretes li button { margin-top: .3rem; }
.pre-consulta { background: #f1f8e9; border-left: 4px solid var(--cor-ok); padding: .6rem .8rem; border-radius: 6px; }
.faixa-agendamento { background: #e3f2fd; border-left: 5px solid var(--cor-info); padding: .8rem 1rem; border-radius: 8px; margin-bottom: 1rem; }
.destaque-whatsapp { border-left: 5px solid #25d366; }
.destaque-alerta { border-left: 5px solid var(--cor-aviso); }
.qr-bloco { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; }
.qr-bloco img { border: 1px solid var(--pico-muted-border-color); border-radius: 8px; }
table.grade-semanal input { margin: 0; padding: .35rem; min-width: 6.5rem; }
table.grade-semanal input[type=checkbox] { min-width: 0; }
details.grupo { border: 1px solid var(--pico-muted-border-color); border-radius: 8px; padding: .5rem 1rem; margin-bottom: 1rem; }

/* Ajustes: botões em grupos de ação não esticam; botões vazados de perigo legíveis */
.acoes > button, .acoes > button[type=submit], button.btn-pequeno, .acoes form > button { width: auto; }
a.outline.perigo[role="button"], button.outline.perigo { --pico-background-color: transparent; --pico-color: var(--cor-erro); --pico-border-color: var(--cor-erro); background: transparent; color: var(--cor-erro); }
a.outline.perigo[role="button"]:hover, button.outline.perigo:hover { background: #ffebee; }


/* ---------- Seletor de tema ---------- */
.seletor-tema { display: flex; gap: .25rem; }
.seletor-tema button { flex: 1; margin: 0; padding: .35rem .5rem; font-size: .85rem; width: auto;
  background: transparent; color: var(--pico-color); border: 1px solid var(--pico-muted-border-color); }
.seletor-tema button.ativo { background: var(--cor-marca); border-color: var(--cor-marca); color: #fff; }
.topo details.dropdown ul li .seletor-tema { min-width: 15rem; }
.botao-tema { background: transparent; border: 1px solid var(--pico-muted-border-color); color: inherit; width: auto;
  margin: 0; padding: .3rem .55rem; line-height: 1.2; font-size: 1.1rem; border-radius: 8px; }
.tema-flutuante { position: fixed; top: .6rem; right: .6rem; z-index: 40; }

/* ---------- Foto do paciente ---------- */
.foto-paciente { width: 56px; height: 56px; border-radius: 50%; overflow: hidden; flex: none; display: flex; align-items: center;
  justify-content: center; background: var(--pico-muted-border-color); font-size: 1.6rem; }
.foto-paciente img { width: 100%; height: 100%; object-fit: cover; }
.foto-paciente.grande { width: 120px; height: 120px; font-size: 3rem; }
.cadastro-com-foto { display: grid; gap: 1rem; grid-template-columns: 1fr; }
.foto-paciente-campo { display: flex; flex-direction: column; align-items: center; gap: .4rem; }
.foto-paciente-campo label[role="button"] { margin: 0; width: 100%; max-width: 160px; }
@media (min-width: 700px) { .cadastro-com-foto { grid-template-columns: 170px 1fr; } }
.cabecalho-paciente { display: flex; gap: .9rem; align-items: center; }
.grupo-opcoes.linha { display: flex; flex-wrap: wrap; gap: .25rem 1.5rem; border: 0; padding: 0; }
.grupo-opcoes.linha legend { width: 100%; }
.grupo-opcoes label { display: block; }
.grupo-opcoes.linha label { display: inline-flex; align-items: center; gap: .3rem; }

.amostra-cor { display: inline-block; width: 1.4rem; height: 1.4rem; border-radius: 50%; vertical-align: middle; }
.assinatura-previa { max-height: 60px; background: #fff; padding: 4px; border-radius: 4px; }

/* ---------- Tratamento: progresso e situação dos itens ---------- */
.progresso-tratamento { display: inline-flex; align-items: center; gap: .5rem; font-size: .9rem; white-space: nowrap; }
.progresso-tratamento progress { width: 110px; margin: 0; }
.form-acao-linha { display: inline; margin: 0; }
tr.item-executado td { color: var(--pico-muted-color); }
.badge-camada { display: inline-block; padding: .1rem .5rem; border-radius: 999px; font-size: .78rem; font-weight: 600; color: #fff; white-space: nowrap; }
.badge-camada.c-planejado { background: #c62828; }
.badge-camada.c-realizado { background: #2e7d32; }

/* ---------- Prontuário: alertas, anamnese, assinatura, evolução ---------- */
.faixa-alertas { background: #fdecea; border-left: 5px solid var(--cor-erro); color: #7f1d1d; padding: .65rem 1rem;
  border-radius: 8px; margin-bottom: 1rem; display: flex; flex-wrap: wrap; gap: .35rem .8rem; align-items: center; }
.faixa-alertas.discreta { background: #fff3e0; border-color: var(--cor-aviso); color: #6b3d00; }
.alerta-item { background: rgba(198, 40, 40, .1); border-radius: 999px; padding: .1rem .6rem; font-weight: 600; font-size: .9rem; }
.anamnese-grupo legend { font-weight: 700; }
.pergunta { padding: .55rem 0; border-bottom: 1px solid var(--pico-muted-border-color); }
.pergunta:last-child { border-bottom: 0; }
.opcoes-pergunta { display: flex; flex-wrap: wrap; gap: .2rem 1.4rem; margin-top: .3rem; }
.opcoes-pergunta label { display: inline-flex; align-items: center; gap: .35rem; margin: 0; }
.detalhe-pergunta { margin: .4rem 0 0; }
.quadro-assinatura { position: relative; width: 100%; max-width: 620px; height: 190px; background: #fff;
  border: 2px dashed #90a4ae; border-radius: 10px; touch-action: none; margin: .6rem 0; }
.quadro-assinatura canvas { position: absolute; inset: 0; width: 100%; height: 100%; touch-action: none; cursor: crosshair; }
.quadro-assinatura .linha-assinatura { position: absolute; left: 8%; right: 8%; bottom: 38px; border-top: 1px solid #b0bec5;
  color: #90a4ae; font-size: .8rem; padding-top: 2px; pointer-events: none; }
.quadro-assinatura.assinado { border-style: solid; border-color: var(--cor-ok); }
.respostas-anamnese { width: 100%; margin: 0; }
.respostas-anamnese td { padding: .35rem .5rem; vertical-align: top; }
.resposta-alerta td { background: rgba(198, 40, 40, .08); }
.linhas-evolucao { margin: .3rem 0 .6rem; padding-left: 1.1rem; }
.linhas-evolucao li { margin: .15rem 0; }
.adendo { border-left: 3px solid var(--cor-info); padding: .3rem .7rem; margin: .4rem 0; background: var(--pico-card-sectioning-background-color); }

/* ---------- Tema escuro ---------- */
[data-theme="dark"] {
  --cor-marca-texto: #5cc3e4;
  --cor-ok: #66bb6a;
  --cor-aviso: #ffa726;
  --cor-erro: #ef5350;
  --cor-info: #64b5f6;
  --pico-primary: #5cc3e4;
  --pico-primary-hover: #8ad6ee;
  --pico-primary-background: #0f7fa1;
  --pico-primary-border: #0f7fa1;
  --pico-primary-hover-background: #1593b9;
  --pico-primary-hover-border: #1593b9;
  --pico-primary-underline: rgba(92, 195, 228, .5);
  --pico-primary-focus: rgba(92, 195, 228, .18);
  --pico-primary-inverse: #fff;
}
[data-theme="dark"] .badge { background: #2f3540; color: #d6dbe1; }
[data-theme="dark"] .badge.aberta, [data-theme="dark"] .badge.ag-agendado { background: rgba(100, 181, 246, .18); color: #90caf9; }
[data-theme="dark"] .badge.aguardando_lab, [data-theme="dark"] .badge.aviso, [data-theme="dark"] .badge.ag-nao_compareceu { background: rgba(255, 167, 38, .18); color: #ffcc80; }
[data-theme="dark"] .badge.pronta, [data-theme="dark"] .badge.ag-confirmado { background: rgba(102, 187, 106, .18); color: #a5d6a7; }
[data-theme="dark"] .badge.entregue, [data-theme="dark"] .badge.ag-atendido, [data-theme="dark"] .badge.inativo { background: #2f3540; color: #b0bac5; }
[data-theme="dark"] .badge.cancelada, [data-theme="dark"] .badge.atrasada, [data-theme="dark"] .badge.ag-cancelado { background: rgba(239, 83, 80, .2); color: #ef9a9a; }
[data-theme="dark"] .badge.orcamento { background: rgba(179, 157, 219, .2); color: #d1c4e9; }
[data-theme="dark"] .badge.aprovado { background: rgba(100, 181, 246, .18); color: #90caf9; }
[data-theme="dark"] .badge.em_tratamento { background: rgba(255, 167, 38, .18); color: #ffcc80; }
[data-theme="dark"] .badge.concluido { background: rgba(102, 187, 106, .18); color: #a5d6a7; }
[data-theme="dark"] .badge.recusado { background: #2f3540; color: #b0bac5; }
[data-theme="dark"] .badge.cancelado { background: rgba(239, 83, 80, .2); color: #ef9a9a; }
[data-theme="dark"] .badge.online { background: rgba(179, 157, 219, .2); color: #d1c4e9; }
[data-theme="dark"] .faixa-alertas { background: rgba(239, 83, 80, .15); color: #ffcdd2; }
[data-theme="dark"] .faixa-alertas.discreta { background: rgba(255, 167, 38, .15); color: #ffe0b2; }
[data-theme="dark"] .pre-consulta { background: rgba(102, 187, 106, .1); }
[data-theme="dark"] .faixa-agendamento { background: rgba(100, 181, 246, .1); }
[data-theme="dark"] a.outline.perigo[role="button"]:hover, [data-theme="dark"] button.outline.perigo:hover { background: rgba(239, 83, 80, .12); }
[data-theme="dark"] .menu-inferior { box-shadow: 0 -2px 8px rgba(0, 0, 0, .4); }
[data-theme="dark"] .linha-agenda.bloqueado .ag-conteudo { background: repeating-linear-gradient(45deg, transparent, transparent 6px, rgba(255,255,255,.04) 6px, rgba(255,255,255,.04) 12px); }
[data-theme="dark"] .anexo img { background: #fff; }

/* ---------- Bolinha de notificação (alertas do menu) ---------- */
.bolinha { display: inline-flex; align-items: center; justify-content: center; min-width: 1.15rem; height: 1.15rem; padding: 0 .3rem; border-radius: 999px;
  background: #d32f2f; color: #fff; font-size: .7rem; font-weight: 700; line-height: 1; box-shadow: 0 0 0 2px var(--pico-card-background-color, #fff); vertical-align: middle; }
.bolinha:empty { min-width: .7rem; width: .7rem; height: .7rem; padding: 0; }
.lateral .item { position: relative; }
.lateral .item .bolinha { margin-left: auto; }
.subnav a .bolinha { margin-left: .4rem; }
.menu-inferior a, .menu-inferior button { position: relative; }
.menu-inferior .bolinha { position: absolute; top: .45rem; left: calc(50% + .55rem); }
.topo .abre-menu { position: relative; }
.topo .abre-menu .bolinha { position: absolute; top: -.3rem; right: -.3rem; }
@media (min-width: 1024px) {
  html.menu-recolhido .lateral .item .bolinha { position: absolute; top: .3rem; right: .55rem; margin: 0; min-width: .7rem; width: .7rem; height: .7rem; padding: 0; font-size: 0; }
}

/* ---------- Agenda: uma coluna por dentista, blocos de 15 minutos ---------- */
.agenda-grade-caixa { overflow-x: auto; margin-bottom: 1rem; border: 1px solid var(--pico-muted-border-color); border-radius: 8px; }
.agenda-grade { width: 100%; min-width: calc(64px + var(--colunas, 1) * 170px); border-collapse: collapse; table-layout: fixed; margin: 0; }
.agenda-grade th, .agenda-grade td { padding: 0; border: 0; border-bottom: 1px solid var(--pico-muted-border-color); height: 30px; font-size: .82rem; vertical-align: top; }
.agenda-grade th.hora { width: 64px; text-align: right; padding: 2px 8px 0 0; color: var(--pico-muted-color); background: var(--pico-card-sectioning-background-color); font-weight: 400; position: sticky; left: 0; z-index: 2; }
.agenda-grade th.hora.cheia { font-weight: 700; color: var(--pico-color); }
.agenda-grade thead th { position: sticky; top: 0; z-index: 3; background: var(--pico-card-sectioning-background-color); height: auto; padding: .4rem .5rem; text-align: left; font-size: .9rem; }
.agenda-grade thead th small { display: block; font-weight: 400; color: var(--pico-muted-color); }
.agenda-grade td { border-left: 1px solid var(--pico-muted-border-color); }
.agenda-grade td.livre a { display: block; height: 100%; min-height: 29px; text-align: center; text-decoration: none; color: var(--cor-ok); opacity: .35; line-height: 29px; }
.agenda-grade td.livre a:hover { opacity: 1; background: rgba(46, 125, 50, .12); }
.agenda-grade td.passado { background: repeating-linear-gradient(135deg, transparent 0 6px, rgba(128, 128, 128, .06) 6px 12px); }
.agenda-grade td.fechado { background: var(--pico-card-sectioning-background-color); }
.agenda-grade td.intervalo, .agenda-grade td.bloqueado { background: var(--pico-card-sectioning-background-color); color: var(--pico-muted-color); font-size: .74rem; padding: 2px 6px; }
.agenda-grade td.ag { padding: 2px; }
.ag-bloco { display: flex; flex-direction: column; gap: 1px; height: 100%; padding: 3px 6px; border-radius: 6px; text-decoration: none; overflow: hidden;
  background: color-mix(in srgb, var(--cor) 18%, var(--pico-background-color)); border-left: 5px solid var(--cor); color: var(--pico-color); }
.ag-bloco small { color: var(--pico-muted-color); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ag-bloco strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ag-bloco.st-confirmado { box-shadow: inset 0 0 0 1px var(--cor-ok); }
.ag-bloco.st-atendido { opacity: .65; }
.ag-bloco.st-nao_compareceu { opacity: .55; text-decoration: line-through; }
.ag-icones { font-size: .75rem; }
.agenda-lista { display: none; }
.ag-item { display: flex; gap: .75rem; padding: .55rem .7rem; margin-bottom: .45rem; border-radius: 8px; text-decoration: none; background: var(--pico-card-background-color); color: var(--pico-color); }
@media (max-width: 767px) {
  .agenda-grade-caixa.varios { display: none; }
  .agenda-grade-caixa.varios ~ .agenda-lista { display: block; }
}
.nav-dia select { margin: 0; width: auto; min-width: 12rem; }

.bolinha-cor { display: inline-block; width: .8rem; height: .8rem; border-radius: 50%; vertical-align: -1px; }
small.d-block { display: block; }

/* Aviso de sessão prestes a terminar por inatividade (js/inatividade.js) */
.aviso-inatividade { position: fixed; left: 50%; bottom: 1.2rem; transform: translateX(-50%); z-index: 1000; max-width: min(92vw, 520px);
  padding: .9rem 1.1rem; border-radius: 10px; background: var(--pico-card-background-color); border-left: 5px solid var(--cor-aviso);
  box-shadow: 0 6px 24px rgba(0, 0, 0, .3); }
.aviso-inatividade button { margin: .6rem 0 0; }