/* VetSist — sistema (ica.vetsist.com.br). Cores e fontes do Manual da Marca. */
:root {
    --verde: #2BB39A;
    --azul: #305AA6;
    --verde-clinico: #17796A;
    --verde-clinico-escuro: #12645a;
    --marinho: #132A3A;
    --marinho-2: #1b3a4f;
    --menta: #E7F6F2;
    --nevoa: #F4F7F7;
    --texto-suave: #4a5d6a;
    --borda: #dce6e6;
    --perigo: #c0392b;
    --triagem-vermelho: #D93A3A;
    --triagem-laranja: #F08A24;
    --triagem-amarelo: #F2C230;
    --triagem-verde: #3E9E4F;
    --triagem-azul: #3A7BD5;
    --fonte-titulo: 'Nunito', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --fonte-texto: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --gradiente: linear-gradient(120deg, var(--verde), var(--azul));
    --sombra: 0 10px 30px rgba(19, 42, 58, .07);
    --suave: cubic-bezier(.22, 1, .36, 1);
    --lateral: 256px;
}
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; font-family: var(--fonte-texto); font-size: 15px; line-height: 1.55; color: var(--marinho); background: var(--nevoa); -webkit-font-smoothing: antialiased; }
h1, h2, h3 { font-family: var(--fonte-titulo); font-weight: 800; line-height: 1.2; margin: 0 0 .5em; }
h1 { font-size: 1.7rem; }
h2 { font-size: 1.15rem; }
a { color: var(--verde-clinico); }
p { margin: 0 0 1em; }
.icone { width: 20px; height: 20px; flex: none; }
.icone-grande { width: 48px; height: 48px; color: var(--verde-clinico); }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pular { position: absolute; left: 12px; top: -60px; z-index: 100; padding: 8px 14px; border-radius: 8px; background: var(--marinho); color: #fff; }
.pular:focus { top: 12px; }
:focus-visible { outline: 3px solid var(--azul); outline-offset: 2px; }
.suave { color: var(--texto-suave); }
.pequeno { font-size: .85rem; }
.centro { text-align: center; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .88em; }
.bloco { display: block; }
.vazio { color: var(--texto-suave); padding: 12px 0; margin: 0; }
[hidden] { display: none !important; }

/* Logo */
/* Logo: arquivos do Manual da Marca (assets/img/logo-vetsist*.png) */
.logo { display: inline-flex; align-items: center; text-decoration: none; line-height: 0; }
.logo img { display: block; height: 42px; width: auto; }
.logo-tv img { height: 3.2vw; min-height: 32px; }

/* Botões */
.botao { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 11px 20px; border-radius: 10px; border: 2px solid var(--verde-clinico); background: var(--verde-clinico); color: #fff; font: 600 .95rem var(--fonte-texto); text-decoration: none; cursor: pointer; white-space: nowrap; transition: background .2s, border-color .2s, transform .15s, box-shadow .2s; }
.botao:hover { background: var(--verde-clinico-escuro); border-color: var(--verde-clinico-escuro); box-shadow: 0 6px 16px rgba(23, 121, 106, .25); }
.botao:active { transform: translateY(1px); }
.botao-largo { width: 100%; }
.botao-secundario { background: #fff; color: var(--verde-clinico); border-color: var(--borda); }
.botao-secundario:hover { background: var(--menta); border-color: var(--verde); color: var(--verde-clinico-escuro); box-shadow: none; }
.botao-perigo { background: #fff; color: var(--perigo); border-color: #f0c4be; }
.botao-perigo:hover { background: #fdeceb; border-color: var(--perigo); color: var(--perigo); box-shadow: none; }
.botao-texto { padding: 6px 10px; border: 0; background: transparent; color: var(--verde-clinico); }
.botao-texto:hover { background: var(--menta); box-shadow: none; color: var(--verde-clinico-escuro); }
.texto-perigo { color: var(--perigo); }
.texto-aviso { color: #a86a00; }
.texto-perigo:hover { background: #fdeceb; color: var(--perigo); }
.botao-icone { display: grid; place-items: center; width: 38px; height: 38px; border: 0; border-radius: 10px; background: transparent; color: var(--texto-suave); cursor: pointer; }
.botao-icone:hover { background: var(--nevoa); color: var(--marinho); }
.link-botao { border: 0; background: none; padding: 6px; color: var(--verde-clinico); font: 500 .95rem var(--fonte-texto); text-decoration: underline; cursor: pointer; }

/* Selos */
.selo { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border-radius: 999px; font-size: .78rem; font-weight: 600; white-space: nowrap; vertical-align: middle; }
.selo .icone { width: 14px; height: 14px; }
.selo-verde { background: #e3f4e7; color: #23733a; }
.selo-azul { background: #e5eefb; color: #2b5ea8; }
.selo-amarelo { background: #fdf3d5; color: #8a6400; }
.selo-vermelho { background: #fbe4e4; color: #a12a2a; }
.selo-cinza { background: #edf1f2; color: #5b6b74; }

/* Alertas */
.alerta { margin-bottom: 18px; padding: 12px 16px; border-radius: 12px; font-size: .95rem; border: 1px solid; animation: entrar .4s var(--suave); }
.alerta-ok { background: var(--menta); color: var(--verde-clinico-escuro); border-color: #b5e3d8; }
.alerta-erro { background: #fdeceb; color: #a12a2a; border-color: #f5c6c4; }
.alerta-aviso { background: #fdf6e1; color: #7a5a00; border-color: #f2df9f; }
@keyframes entrar { from { opacity: 0; transform: translateY(-6px); } }

/* Formulários */
.form { display: grid; gap: 16px; }
.form label, .linha-form label { display: grid; gap: 6px; font-weight: 500; font-size: .92rem; }
input[type=text], input[type=email], input[type=password], input[type=search], input[type=date], input[type=tel], input[type=number], input[type=time], input[type=url], input[type=month], input[type=datetime-local], select, textarea {
    width: 100%; padding: 11px 13px; border: 1.5px solid #cfdcdc; border-radius: 10px; background: #fff; color: var(--marinho); font: 400 .95rem var(--fonte-texto); transition: border-color .2s, box-shadow .2s;
}
select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23132A3A' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; background-size: 16px; padding-right: 34px; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--verde-clinico); box-shadow: 0 0 0 4px rgba(23, 121, 106, .15); }
.campo-codigo { font-family: var(--fonte-titulo); font-size: 1.8rem !important; font-weight: 800; letter-spacing: .5em; text-align: center; }
.form label.caixa { display: flex; gap: 10px; align-items: center; font-weight: 400; color: var(--texto-suave); }
.caixa input { width: 18px; height: 18px; accent-color: var(--verde-clinico); flex: none; }
.linha-form { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; margin-bottom: 14px; }
.crescer { flex: 1 1 180px; }

/* Tela de login */
/* Login: foto dos pets à esquerda, formulário à direita (no celular, a foto vira faixa no topo) */
.tela-auth { min-height: 100vh; margin: 0; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); background: var(--nevoa); }
.auth-foto { position: relative; overflow: hidden; background: var(--marinho); }
.auth-foto > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 42% 50%; animation: aproximar 1.4s var(--suave); }
.auth-foto::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(19, 42, 58, 0) 45%, rgba(19, 42, 58, .82) 100%); }
.auth-foto-texto { position: absolute; z-index: 1; left: clamp(24px, 5vw, 56px); right: clamp(24px, 5vw, 56px); bottom: clamp(24px, 5vw, 56px); color: #fff; }
.auth-foto-texto img { display: block; height: 52px; width: auto; margin-bottom: 14px; }
.auth-foto-texto p { margin: 0; max-width: 34ch; font: 800 clamp(1.15rem, 1.8vw, 1.5rem)/1.3 var(--fonte-titulo); text-wrap: balance; }
.auth-lado { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 40px 24px; background: linear-gradient(160deg, var(--menta), #fff 55%); }
.auth-cartao { position: relative; width: 100%; max-width: 420px; padding: 36px 32px; border-radius: 22px; background: #fff; border: 1px solid var(--borda); box-shadow: 0 30px 70px rgba(19, 42, 58, .12); animation: entrar .6s var(--suave); }
.auth-cartao .logo { margin-bottom: 24px; }
.auth-cartao .logo img { height: 48px; }
.auth-cartao h1 { font-size: 1.6rem; }
.auth-cartao > p { margin: 14px 0 0; }
.auth-cartao form + p, .auth-cartao form.centro { margin-top: 16px; }
.auth-rodape { position: relative; margin-top: 20px; font-size: .85rem; color: var(--texto-suave); }
.auth-rodape a { color: var(--texto-suave); }
@keyframes aproximar { from { transform: scale(1.06); } }
@media (max-width: 860px) {
    .tela-auth { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
    .auth-foto { height: 220px; }
    .auth-foto > img { object-position: 42% 52%; }
    .auth-foto::after { background: linear-gradient(180deg, rgba(19, 42, 58, .55) 0%, rgba(19, 42, 58, 0) 55%); }
    .auth-foto-texto { top: 18px; bottom: auto; }
    .auth-foto-texto img { height: 36px; margin-bottom: 0; }
    .auth-foto-texto p { display: none; }
    .auth-lado { justify-content: flex-start; padding: 0 16px 32px; background: var(--nevoa); }
    .auth-cartao { margin-top: -28px; }
    .auth-cartao .logo { display: none; }
}
@media (max-width: 480px) { .auth-cartao { padding: 28px 20px; } }
@media (prefers-reduced-motion: reduce) { .auth-foto > img, .auth-cartao { animation: none; } }

/* Estrutura do painel */
.tela-painel { display: block; }
.lateral { position: fixed; inset: 0 auto 0 0; z-index: 40; width: var(--lateral); display: flex; flex-direction: column; background: var(--marinho); color: #c9d7de; transition: transform .3s var(--suave); }
.lateral-topo { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 22px 20px 18px; }
.lateral-tag { padding: 2px 8px; border-radius: 999px; background: rgba(43, 179, 154, .2); color: #7fe0cc; font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
.lateral-menu { flex: 1; overflow-y: auto; padding: 6px 12px; display: grid; align-content: start; gap: 2px; }
.lateral-menu a, .lateral-breve { position: relative; display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; color: #c9d7de; text-decoration: none; font-weight: 500; transition: background .2s, color .2s; }
.lateral-menu a:hover { background: rgba(255, 255, 255, .06); color: #fff; }
.lateral-menu a[aria-current="page"] { background: rgba(43, 179, 154, .16); color: #fff; }
.lateral-menu a[aria-current="page"]::before { content: ''; position: absolute; left: -12px; top: 8px; bottom: 8px; width: 3px; border-radius: 0 3px 3px 0; background: var(--verde); }
.lateral-menu a[aria-current="page"] .icone { color: var(--verde); }
.lateral-breve { color: #6f8794; cursor: default; }
.lateral-breve em { margin-left: auto; white-space: nowrap; padding: 1px 7px; border-radius: 999px; background: rgba(255, 255, 255, .07); font-size: .66rem; font-style: normal; font-weight: 600; }
.lateral-rodape { padding: 16px 20px; color: #6f8794; font-size: .78rem; }
.lateral-sombra { display: none; }
.principal { margin-left: var(--lateral); min-height: 100vh; display: flex; flex-direction: column; }
.barra { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: 14px; height: 64px; padding: 0 28px; background: rgba(255, 255, 255, .9); backdrop-filter: blur(10px); border-bottom: 1px solid var(--borda); }
.barra-menu { display: none; width: 40px; height: 40px; border: 0; border-radius: 10px; background: transparent; color: var(--marinho); cursor: pointer; place-items: center; }
.barra-titulo { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.barra-usuario { display: flex; align-items: center; gap: 10px; }
.barra-usuario form { margin: 0; }
.avatar { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--gradiente); color: #fff; font-weight: 700; }
.barra-nome { display: grid; font-weight: 600; font-size: .9rem; line-height: 1.25; }
.barra-nome small { color: var(--texto-suave); font-weight: 400; font-size: .78rem; }
.conteudo { flex: 1; width: 100%; max-width: 1200px; padding: 28px; animation: entrar .4s var(--suave); }
@media (max-width: 960px) {
    .lateral { transform: translateX(-100%); }
    .menu-aberto .lateral { transform: none; box-shadow: 20px 0 60px rgba(0, 0, 0, .25); }
    .menu-aberto .lateral-sombra { display: block; position: fixed; inset: 0; z-index: 35; background: rgba(19, 42, 58, .4); }
    .principal { margin-left: 0; }
    .barra { padding: 0 12px; }
    .barra-menu { display: grid; }
    .barra-nome { display: none; }
    .conteudo { padding: 20px 16px; }
}

/* Blocos de conteúdo */
.cabecalho { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; margin-bottom: 22px; }
.cabecalho h1 { margin-bottom: 4px; }
.cabecalho p { margin: 0; }
.acoes { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.acoes form { margin: 0; }
.migalha { margin: 0 0 6px; font-size: .85rem; color: var(--texto-suave); }
.migalha a { color: var(--texto-suave); }
.cartao { margin-bottom: 20px; padding: 22px; border-radius: 16px; background: #fff; border: 1px solid var(--borda); box-shadow: var(--sombra); }
.cartao h2 { margin-bottom: 14px; }
.cartao-tabela { padding: 6px 0; }
.cartao-tabela h2 { padding: 16px 22px 0; }
.grade-2 { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); }
.grade-2 > .cartao { margin-bottom: 0; }
.grade-2 { margin-bottom: 20px; }
.grade-3 { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }
.grade-equipe { display: grid; gap: 20px; align-items: start; }
.grade-equipe > *, .grade-2 > * { min-width: 0; }
@media (min-width: 1100px) { .grade-equipe { grid-template-columns: 1fr 340px; } }

.numeros { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); margin-bottom: 20px; }
.numero { position: relative; display: grid; gap: 2px; padding: 18px 20px; border-radius: 16px; background: #fff; border: 1px solid var(--borda); color: var(--marinho); text-decoration: none; overflow: hidden; transition: transform .25s var(--suave), box-shadow .25s; }
.numero::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--gradiente); }
.numero-amarelo::before { background: var(--triagem-amarelo); }
.numero-azul::before { background: var(--triagem-azul); }
.numero-verde::before { background: var(--triagem-verde); }
a.numero:hover { transform: translateY(-3px); box-shadow: var(--sombra); }
.numero small { color: var(--texto-suave); font-weight: 500; }
.numero strong { font-family: var(--fonte-titulo); font-size: 2rem; font-weight: 900; line-height: 1.1; }

.lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.lista a { display: grid; padding: 10px 12px; border-radius: 10px; color: var(--marinho); text-decoration: none; transition: background .2s; }
.lista a:hover { background: var(--nevoa); }
.lista small { color: var(--texto-suave); }

.dados { display: grid; grid-template-columns: max-content 1fr; gap: 10px 18px; margin: 0; }
.dados dt { color: var(--texto-suave); font-size: .88rem; }
.dados dd { margin: 0; overflow-wrap: anywhere; }
@media (max-width: 520px) { .dados { grid-template-columns: 1fr; gap: 2px; } .dados dd { margin-bottom: 10px; } }
.situacao { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--borda); }

/* Tabelas */
.tabela-rolagem { overflow-x: auto; }
.tabela { width: 100%; border-collapse: collapse; font-size: .92rem; }
.tabela th { padding: 12px 22px; text-align: left; font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--texto-suave); border-bottom: 1px solid var(--borda); white-space: nowrap; }
.tabela td { padding: 13px 22px; border-bottom: 1px solid var(--nevoa); vertical-align: middle; }
.tabela tr:last-child td { border-bottom: 0; }
.tabela tbody tr { transition: background .15s; }
.tabela tbody tr:hover { background: #fafcfc; }
.tabela a { color: var(--marinho); text-decoration: none; }
.tabela a:hover { color: var(--verde-clinico); }
.acoes-linha { text-align: right; white-space: nowrap; }
.acoes-linha form { display: inline; margin: 0; }

.filtros { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 18px; }
.filtros input[type=search] { flex: 1 1 240px; width: auto; }
.filtros select, .filtros input[type=date] { width: auto; flex: 0 1 220px; }
.paginas, nav .pagination { display: flex; gap: 8px; justify-content: center; margin: 10px 0; }
.pagination { list-style: none; padding: 0; }
.pagination li a, .pagination li span { display: block; padding: 6px 12px; border-radius: 8px; border: 1px solid var(--borda); background: #fff; text-decoration: none; }
.pagination li.active a { background: var(--verde-clinico); color: #fff; border-color: var(--verde-clinico); }

/* Histórico */
.linha-tempo { list-style: none; margin: 0; padding: 0 0 0 18px; border-left: 2px solid var(--borda); display: grid; gap: 16px; }
.linha-tempo li { position: relative; }
.linha-tempo li::before { content: ''; position: absolute; left: -25px; top: 5px; width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 3px solid var(--verde); }
.linha-tempo li.acao-excluir::before, .linha-tempo li.acao-login_falhou::before, .linha-tempo li.acao-mfa_falhou::before { border-color: var(--triagem-vermelho); }
.linha-tempo li.acao-alterar::before { border-color: var(--azul); }
.linha-tempo li.acao-login::before, .linha-tempo li.acao-logout::before, .linha-tempo li.acao-acessar::before { border-color: #9fb0b8; }
.linha-tempo-topo { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.linha-tempo time { color: var(--texto-suave); font-size: .85rem; }
.mudancas { margin-top: 6px; font-size: .85rem; }
.mudancas summary { cursor: pointer; color: var(--verde-clinico); }
.mudancas table { margin-top: 6px; border-collapse: collapse; }
.mudancas th, .mudancas td { padding: 4px 10px 4px 0; text-align: left; vertical-align: top; }
.mudancas th { color: var(--texto-suave); font-weight: 500; }
.mudancas .de { color: #a12a2a; text-decoration: line-through; }
.mudancas .para { color: #23733a; }

/* Painel da clínica */
.faixa-teste { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 20px; padding: 14px 18px; border-radius: 14px; background: linear-gradient(120deg, #e5eefb, var(--menta)); border: 1px solid #c9daf2; }
.faixa-teste .icone { color: var(--azul); margin-top: 2px; }
.faixa-teste p { margin: 0; }
.passos { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.passos li { display: flex; gap: 14px; }
.passos li > span { flex: none; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; border: 2px solid var(--borda); color: var(--texto-suave); font-weight: 700; font-size: .85rem; }
.passos li.feito > span { background: var(--verde-clinico); border-color: var(--verde-clinico); color: #fff; }
.passos li.feito > span .icone { width: 16px; height: 16px; }
.passos strong { display: block; }
.passos small { display: block; color: var(--texto-suave); }
.modulos { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); }
.modulo { display: flex; gap: 12px; align-items: center; padding: 14px; border-radius: 12px; border: 1px solid var(--borda); transition: border-color .2s, transform .2s var(--suave); }
.modulo:hover { border-color: var(--verde); transform: translateY(-2px); }
.modulo > .icone { width: 38px; height: 38px; padding: 8px; border-radius: 10px; background: var(--menta); color: var(--verde-clinico); }
.modulo div { flex: 1; min-width: 0; }
.modulo strong { display: block; font-size: .95rem; }
.modulo small { display: block; color: var(--texto-suave); font-size: .82rem; }
.modulo-bloqueado { opacity: .6; background: var(--nevoa); }
.modulo-bloqueado > .icone { background: #e3e9ea; color: #7a8b93; }

.plano .preco { font-family: var(--fonte-titulo); font-size: 1.8rem; font-weight: 900; margin: 6px 0; }
.plano .preco small { font-family: var(--fonte-texto); font-size: .9rem; font-weight: 500; color: var(--texto-suave); }
.lista-check { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 8px; }
.lista-check li { display: flex; gap: 8px; align-items: center; }
.lista-check .icone { width: 18px; height: 18px; padding: 3px; border-radius: 50%; background: var(--verde-clinico); color: #fff; }

.vazio-grande { text-align: center; padding: 48px 24px; display: grid; justify-items: center; gap: 6px; }

/* Tela de status / "em preparação" (legado) */
.tela-centro { min-height: 100vh; display: grid; place-items: center; padding: 16px; }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* =====================================================================
   Versão 1.1 — atendimento
   ===================================================================== */
.botao-pequeno { padding: 6px 12px; font-size: .85rem; border-radius: 8px; }
.margem-topo { margin-top: 22px; }
.link-titulo { color: inherit; text-decoration: none; }
.link-titulo:hover { color: var(--verde-clinico); }
.contador { display: inline-grid; place-items: center; min-width: 24px; height: 24px; padding: 0 7px; margin-left: 6px; border-radius: 999px; background: var(--nevoa); color: var(--texto-suave); font: 700 .78rem var(--fonte-texto); vertical-align: middle; }
.contador-vermelho { background: #fbe4e4; color: #a12a2a; }
.numero-vermelho::before { background: var(--triagem-vermelho); }
.cartao-topo { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.cartao-topo h2 { margin: 0; }
.sem-padding { padding: 0 !important; }
.filtro-rotulo { display: flex !important; align-items: center; gap: 8px; color: var(--texto-suave); font-size: .9rem; }
.filtro-rotulo input { width: auto; }

/* Busca global na barra */
.busca-global { display: flex; align-items: center; gap: 8px; flex: 0 1 340px; padding: 0 12px; border-radius: 10px; background: var(--nevoa); border: 1.5px solid transparent; transition: border-color .2s, background .2s; }
.busca-global:focus-within { background: #fff; border-color: var(--verde-clinico); }
.busca-global .icone { color: var(--texto-suave); width: 18px; height: 18px; }
.busca-global input { border: 0 !important; background: transparent !important; box-shadow: none !important; padding: 9px 0 !important; }
@media (max-width: 760px) { .busca-global { display: none; } }

/* Formulários em grade */
.form-grade { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); }
.form-grade > label, .form-grade > div > label { display: grid; gap: 6px; font-weight: 500; font-size: .92rem; }
.form-grade h2 { margin: 0; }
.form-grade-4 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 170px), 1fr)); }
.col-2 { grid-column: span 2; }
.col-total { grid-column: 1 / -1; }
@media (max-width: 560px) { .col-2 { grid-column: 1 / -1; } }
.rotulo { display: block; margin-bottom: 6px; font-weight: 500; font-size: .92rem; }
.opcoes-caixa { border: 0; padding: 0; margin: 0; display: grid; gap: 10px; }
.opcoes-caixa legend { font-weight: 600; margin-bottom: 6px; }
.opcoes-caixa .caixa, .form .caixa { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; color: var(--texto-suave); }
.destaque-lgpd { padding: 12px 14px; border-radius: 12px; background: var(--menta); color: var(--verde-clinico-escuro) !important; }
.dobravel > summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 8px; }
.dobravel > summary::-webkit-details-marker { display: none; }
.dobravel > summary h2 { margin: 0; }
.dobravel > summary::after { content: ''; width: 9px; height: 9px; border-right: 2px solid var(--texto-suave); border-bottom: 2px solid var(--texto-suave); transform: rotate(45deg); transition: transform .2s; margin-left: 4px; }
.dobravel[open] > summary::after { transform: rotate(225deg); }
details.form-grade:not([open]) { display: block; }
.texto-documento { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .9rem; line-height: 1.6; }
.campos-modelo { list-style: none; padding: 0; margin: 10px 0; display: flex; flex-wrap: wrap; gap: 6px; }
.campos-modelo code { display: inline-block; padding: 3px 8px; border-radius: 6px; background: var(--nevoa); font-size: .8rem; }

/* Pets */
.lista-pets { display: grid; gap: 8px; }
.pet-cartao { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 12px; border: 1px solid var(--borda); color: var(--marinho); text-decoration: none; transition: border-color .2s, transform .2s var(--suave), background .2s; }
.pet-cartao:hover { border-color: var(--verde); background: #fafdfc; transform: translateX(3px); }
.pet-cartao div { flex: 1; min-width: 0; }
.pet-cartao strong { display: block; }
.pet-cartao small { color: var(--texto-suave); }
.pet-cartao > .icone { color: var(--texto-suave); }
.pet-obito { opacity: .6; }
.pet-avatar { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; object-fit: cover; background: var(--menta); color: var(--verde-clinico); font: 900 1.1rem var(--fonte-titulo); }
.pet-avatar.especie-gato { background: #e5eefb; color: var(--azul); }
.pet-avatar.especie-ave, .pet-avatar.especie-coelho, .pet-avatar.especie-roedor { background: #fdf3d5; color: #8a6400; }
.pet-avatar-grande { width: 88px; height: 88px; font-size: 2rem; box-shadow: 0 0 0 4px #fff, 0 0 0 6px var(--menta); }
.pet-topo { display: flex; gap: 20px; align-items: flex-start; flex-wrap: wrap; }
.pet-topo-info { flex: 1 1 320px; min-width: 0; }
.pet-topo-info h1 { margin-bottom: 4px; }
.pet-topo-info p { margin: 0 0 6px; }
.pet-topo-acoes { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.pet-topo-acoes form { margin: 0; }
.alertas-pet { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.alertas-pet .selo { white-space: normal; text-align: left; }
.faixa-alerta { margin: -8px 0 18px; }
.dados-2col { grid-template-columns: max-content 1fr max-content 1fr; }
@media (max-width: 900px) { .dados-2col { grid-template-columns: max-content 1fr; } }

/* Abas */
.abas-lista { display: flex; gap: 4px; margin-bottom: 18px; padding: 5px; border-radius: 14px; background: #fff; border: 1px solid var(--borda); overflow-x: auto; width: fit-content; max-width: 100%; }
.abas-lista button { display: flex; align-items: center; gap: 6px; padding: 9px 16px; border: 0; border-radius: 10px; background: transparent; color: var(--texto-suave); font: 600 .9rem var(--fonte-texto); cursor: pointer; white-space: nowrap; transition: background .2s, color .2s; }
.abas-lista button small { padding: 0 6px; border-radius: 999px; background: var(--nevoa); font-size: .72rem; }
.abas-lista button[aria-selected="true"] { background: var(--verde-clinico); color: #fff; }
.abas-lista button[aria-selected="true"] small { background: rgba(255, 255, 255, .2); }
.abas-lista button:not([aria-selected="true"]):hover { background: var(--menta); color: var(--verde-clinico); }
.abas-painel { animation: entrar .3s var(--suave); }

/* Linha do tempo do pet */
.registro-novo summary h2 { font-size: 1rem; color: var(--verde-clinico); }
.linha-pet { list-style: none; margin: 0; padding: 0 0 0 22px; border-left: 2px solid var(--borda); display: grid; gap: 14px; }
.linha-pet li { position: relative; padding: 16px 18px; border-radius: 14px; background: #fff; border: 1px solid var(--borda); }
.linha-pet li::before { content: ''; position: absolute; left: -30px; top: 20px; width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 3px solid var(--verde); }
.linha-pet .item-vacina::before { border-color: var(--azul); }
.linha-pet .item-documento::before { border-color: #9fb0b8; }
.linha-pet .item-atendimento::before { border-color: var(--triagem-laranja); }
.item-topo { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; align-items: center; margin-bottom: 6px; }
.item-topo strong { display: flex; align-items: center; gap: 8px; }
.item-topo strong .icone { color: var(--verde-clinico); width: 18px; height: 18px; }
.item-topo time { color: var(--texto-suave); font-size: .85rem; }
.linha-pet p { margin: 0; }
.registro { display: grid; gap: 8px; }
.registro small { display: block; color: var(--texto-suave); font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; }
.registro p { margin: 0; }
.versoes { margin: 8px 0; font-size: .88rem; }
.versoes summary { cursor: pointer; color: var(--azul); }
.versao-antiga { margin-top: 8px; padding: 10px 12px; border-left: 3px solid var(--borda); background: var(--nevoa); border-radius: 0 8px 8px 0; opacity: .85; }

/* Gráfico de peso */
.grafico-peso { margin: 0; }
.grafico-peso svg { width: 100%; height: auto; }
.grafico-peso .grade { stroke: var(--borda); stroke-dasharray: 3 4; }
.grafico-peso .eixo { fill: var(--texto-suave); font-size: 11px; font-family: var(--fonte-texto); }
.grafico-peso .linha { fill: none; stroke: var(--verde-clinico); stroke-width: 2.5; stroke-linejoin: round; }
.grafico-peso .area { fill: rgba(43, 179, 154, .12); }
.grafico-peso .ponto { fill: #fff; stroke: var(--verde-clinico); stroke-width: 2.5; }

/* Escolher pet */
.escolher-pet { position: relative; }
.pet-escolhido { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 14px; border-radius: 10px; background: var(--menta); }
.pet-escolhido small { color: var(--texto-suave); }
.pet-busca { display: grid; gap: 6px; }
.sugestoes { position: absolute; top: 46px; left: 0; right: 0; z-index: 20; list-style: none; margin: 0; padding: 6px; border-radius: 12px; background: #fff; border: 1px solid var(--borda); box-shadow: 0 16px 40px rgba(19, 42, 58, .15); max-height: 320px; overflow-y: auto; }
.sugestoes li { display: grid; padding: 9px 12px; border-radius: 8px; cursor: pointer; }
.sugestoes li small { color: var(--texto-suave); }
.sugestoes li[aria-selected="true"], .sugestoes li:hover { background: var(--menta); }
.sugestoes .sem-resultado { color: var(--texto-suave); cursor: default; }

/* Agenda */
.semana { display: flex; align-items: center; gap: 6px; margin-bottom: 16px; overflow-x: auto; padding-bottom: 4px; }
.semana .botao-icone { font-size: 1.4rem; flex: none; }
.dia { position: relative; flex: 1 0 64px; display: grid; justify-items: center; padding: 8px 6px; border-radius: 12px; background: #fff; border: 1px solid var(--borda); color: var(--marinho); text-decoration: none; transition: border-color .2s, transform .2s; }
.dia:hover { border-color: var(--verde); }
.dia small { color: var(--texto-suave); font-size: .75rem; }
.dia strong { font: 800 1.2rem var(--fonte-titulo); }
.dia em { position: absolute; top: 4px; right: 6px; min-width: 18px; padding: 0 5px; border-radius: 999px; background: var(--menta); color: var(--verde-clinico); font: 700 .68rem var(--fonte-texto); font-style: normal; text-align: center; }
.dia-hoje { border-color: var(--verde); }
.dia-atual { background: var(--verde-clinico); border-color: var(--verde-clinico); color: #fff; }
.dia-atual small { color: rgba(255, 255, 255, .8); }
.dia-atual em { background: rgba(255, 255, 255, .25); color: #fff; }
.agenda-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.agenda-lista li { display: grid; grid-template-columns: 70px 1fr auto; gap: 6px 14px; align-items: center; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--borda); border-left: 4px solid var(--verde); }
.agenda-lista li.ag-confirmado { border-left-color: var(--azul); }
.agenda-lista li.ag-chegou { border-left-color: var(--triagem-verde); background: #f6fbf7; }
.agenda-lista li.ag-cancelado, .agenda-lista li.ag-faltou { opacity: .55; border-left-color: #c7d1d4; }
.agenda-lista time { display: grid; font: 800 1.1rem var(--fonte-titulo); }
.agenda-lista time small { font: 400 .75rem var(--fonte-texto); color: var(--texto-suave); }
.ag-info { min-width: 0; }
.ag-info strong { display: block; }
.ag-info strong a { color: var(--marinho); text-decoration: none; }
.ag-info > small { display: block; color: var(--texto-suave); }
.ag-acoes { grid-column: 2 / -1; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.ag-acoes form { display: contents; }
@media (min-width: 900px) { .agenda-lista li { grid-template-columns: 70px 1fr auto auto; } .ag-acoes { grid-column: auto; justify-content: flex-end; } }

/* Cores de triagem */
.triagem-vermelho { background: var(--triagem-vermelho); }
.triagem-laranja { background: var(--triagem-laranja); }
.triagem-amarelo { background: var(--triagem-amarelo); }
.triagem-verde { background: var(--triagem-verde); }
.triagem-azul { background: var(--triagem-azul); }
.triagem-borda-vermelho { --cor-triagem: var(--triagem-vermelho); }
.triagem-borda-laranja { --cor-triagem: var(--triagem-laranja); }
.triagem-borda-amarelo { --cor-triagem: var(--triagem-amarelo); }
.triagem-borda-verde { --cor-triagem: var(--triagem-verde); }
.triagem-borda-azul { --cor-triagem: var(--triagem-azul); }
.selo-triagem { display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 999px; color: #fff; font: 700 .78rem var(--fonte-texto); vertical-align: middle; white-space: nowrap; }
.selo-triagem.triagem-amarelo { color: #3d2e00; }
.legenda-cores { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-bottom: 16px; font-size: .85rem; }
.legenda-cores span { display: flex; align-items: center; gap: 6px; }
.legenda-cores i { width: 12px; height: 12px; border-radius: 4px; }
.legenda-cores small { color: var(--texto-suave); }

/* Fila */
.fila-colunas { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); align-items: start; }
.fila-coluna { margin: 0; }
.fila { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.fila-item { border-radius: 12px; border: 1px solid var(--borda); border-left: 5px solid var(--cor-triagem, #c7d1d4); background: #fff; overflow: hidden; transition: box-shadow .2s, transform .2s var(--suave); }
.fila-item:hover { box-shadow: var(--sombra); transform: translateY(-1px); }
.fila-link { display: flex; gap: 10px; align-items: flex-start; padding: 12px 12px 6px; color: var(--marinho); text-decoration: none; }
.fila-cor { display: none; }
.fila-pet { flex: 1; min-width: 0; display: grid; }
.fila-pet small { color: var(--texto-suave); font-size: .8rem; }
.fila-queixa { color: var(--marinho) !important; }
.fila-alerta { display: flex; align-items: center; gap: 4px; color: #a12a2a !important; font-weight: 600; }
.fila-alerta .icone { width: 14px; height: 14px; }
.fila-tempo { display: grid; justify-items: end; text-align: right; }
.fila-tempo strong { font: 800 1.15rem var(--fonte-titulo); font-variant-numeric: tabular-nums; }
.fila-tempo small { color: var(--texto-suave); font-size: .72rem; white-space: nowrap; }
.fila-acoes { display: flex; gap: 6px; align-items: center; justify-content: flex-end; padding: 0 12px 10px; }
.fila-acoes form { margin: 0; }
.fila-atrasado { background: #fff5f5; box-shadow: 0 0 0 2px rgba(217, 58, 58, .25); animation: pulsar-atraso 2s ease-in-out infinite; }
.fila-atrasado .fila-tempo strong { color: var(--triagem-vermelho); }
@keyframes pulsar-atraso { 50% { box-shadow: 0 0 0 4px rgba(217, 58, 58, .12); } }
.dialogo { width: min(520px, calc(100% - 32px)); border: 0; border-radius: 18px; padding: 24px; box-shadow: 0 30px 80px rgba(19, 42, 58, .3); overflow: visible; }
.dialogo::backdrop { background: rgba(19, 42, 58, .45); backdrop-filter: blur(2px); }

/* Painel da TV */
.tela-tv { min-height: 100vh; margin: 0; display: flex; flex-direction: column; background: var(--marinho); color: #fff; font-size: 1.4vw; }
.tv-topo { display: flex; align-items: center; justify-content: space-between; gap: 2vw; padding: 1.5vw 3vw; border-bottom: 1px solid rgba(255, 255, 255, .1); }
.tv-topo strong { font: 800 1.6vw var(--fonte-titulo); }
.tv-topo time { font: 900 2.4vw var(--fonte-titulo); color: var(--verde); }
.tv-grade { flex: 1; display: grid; grid-template-columns: 1.4fr 1fr; gap: 3vw; padding: 2vw 3vw; }
.tv-grade h1 { font-size: 2.2vw; color: #9fb0b8; margin-bottom: 1.2vw; }
.tv-fila { list-style: none; margin: 0; padding: 0; display: grid; gap: .8vw; }
.tv-fila li { display: grid; grid-template-columns: 1vw 1fr auto; grid-template-rows: auto auto; column-gap: 1.4vw; align-items: center; padding: 1vw 1.4vw; border-radius: 1vw; background: rgba(255, 255, 255, .06); }
.tv-cor { grid-row: 1 / 3; width: 1vw; height: 100%; min-height: 3vw; border-radius: .5vw; background: #5b6b74; }
.tv-fila strong { font: 800 2.2vw var(--fonte-titulo); }
.tv-fila small { grid-column: 2; color: #b8c9d2; font-size: 1.2vw; }
.tv-fila em { grid-row: 1 / 3; grid-column: 3; font: 800 2vw var(--fonte-titulo); font-style: normal; color: #d6e2e8; }
.tv-atrasado { background: rgba(217, 58, 58, .22) !important; }
.tv-vazio { color: #6f8794; font-size: 2vw; }
.tv-rodape { padding: 1vw 3vw; color: #6f8794; font-size: 1vw; text-align: center; }

/* Triagem: escolha da cor */
.escolha-cor { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr)); }
.opcao-cor { position: relative; display: grid; gap: 2px; padding: 14px 14px 14px 20px; border-radius: 12px; border: 2px solid var(--borda); cursor: pointer; overflow: hidden; transition: border-color .2s, transform .2s var(--suave), box-shadow .2s; }
.opcao-cor:hover { transform: translateY(-2px); }
.opcao-cor input { position: absolute; opacity: 0; }
.opcao-cor-faixa { position: absolute; left: 0; top: 0; bottom: 0; width: 7px; }
.opcao-cor small { color: var(--texto-suave); font-weight: 600; }
.opcao-cor em { font-style: normal; font-size: .8rem; color: var(--texto-suave); }
.opcao-cor:has(input:checked) { border-color: var(--cor-triagem); box-shadow: 0 0 0 4px color-mix(in srgb, var(--cor-triagem) 20%, transparent); background: color-mix(in srgb, var(--cor-triagem) 6%, #fff); }
.opcao-cor:has(input:focus-visible) { outline: 3px solid var(--azul); outline-offset: 2px; }

/* Ficha de atendimento */
.grade-atendimento { display: grid; gap: 20px; align-items: start; }
@media (min-width: 1100px) { .grade-atendimento { grid-template-columns: 1fr 340px; } }
.grade-atendimento > * { min-width: 0; }
.reclassificar { display: flex; gap: 8px; align-items: center; }
.reclassificar select { width: auto; padding-top: 6px; padding-bottom: 6px; }
.sinais { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); margin-bottom: 14px; }
.sinais div { padding: 10px 12px; border-radius: 10px; background: var(--nevoa); }
.sinais small { display: block; color: var(--texto-suave); font-size: .75rem; }
.sinais strong { font: 800 1.05rem var(--fonte-titulo); }
.consulta-form textarea { font-size: .95rem; }
.finalizar { margin: 8px 0 0; padding: 16px; border: 2px dashed var(--borda); border-radius: 14px; display: grid; gap: 12px; }
.finalizar legend { padding: 0 6px; font-weight: 700; }
.destinos { display: flex; flex-wrap: wrap; gap: 8px; }
.pilula { position: relative; display: inline-flex; cursor: pointer; }
.pilula input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.pilula span { padding: 7px 14px; border-radius: 999px; border: 1.5px solid #cfdcdc; background: #fff; font-size: .88rem; font-weight: 500; transition: background .2s, border-color .2s, color .2s; }
.pilula input:checked + span { background: var(--verde-clinico); border-color: var(--verde-clinico); color: #fff; }
.pilula input:focus-visible + span { outline: 3px solid var(--azul); outline-offset: 2px; }
.timesheet { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.timesheet li { position: relative; display: grid; grid-template-columns: 1fr auto; gap: 0 10px; padding: 8px 0 8px 18px; border-left: 2px solid var(--borda); }
.timesheet li::before { content: ''; position: absolute; left: -6px; top: 13px; width: 10px; height: 10px; border-radius: 50%; background: var(--verde); }
.timesheet li.etapa-aberta::before { background: var(--triagem-laranja); box-shadow: 0 0 0 4px rgba(240, 138, 36, .2); animation: pulsar-atraso 1.6s infinite; }
.ts-etapa { font-weight: 600; }
.ts-hora { grid-row: 2; color: var(--texto-suave); font-size: .82rem; }
.timesheet strong { grid-row: 1 / 3; grid-column: 2; align-self: center; font-variant-numeric: tabular-nums; }
.timesheet small { grid-column: 1; color: var(--texto-suave); font-size: .78rem; }
.ts-total { display: flex; justify-content: space-between; margin: 12px 0 0; padding-top: 12px; border-top: 1px solid var(--borda); }
.ts-total strong { font: 900 1.3rem var(--fonte-titulo); color: var(--verde-clinico); }

/* Mídias */
.upload { display: grid; gap: 10px; margin-bottom: 16px; padding: 14px; border-radius: 12px; background: var(--nevoa); }
.upload-botoes { display: flex; flex-wrap: wrap; gap: 8px; }
.upload-botoes .botao { cursor: pointer; }
.gravando { background: #fdeceb !important; color: var(--perigo) !important; border-color: var(--perigo) !important; animation: pulsar-atraso 1.4s infinite; }
.upload-status { margin: 0; }
.galeria { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 180px), 1fr)); }
.midia { display: grid; gap: 6px; }
.midia img, .midia video { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 10px; background: var(--marinho); }
.midia small { color: var(--texto-suave); font-size: .78rem; }
.midia-audio { display: grid; gap: 8px; justify-items: center; padding: 14px; border-radius: 10px; background: var(--menta); color: var(--verde-clinico); }
.midia-audio audio { width: 100%; }
.midia-arquivo { display: flex; gap: 8px; align-items: center; padding: 14px; border-radius: 10px; background: var(--nevoa); color: var(--marinho); text-decoration: none; word-break: break-all; }
.midia-audio + small, .midia-arquivo + small { grid-column: 1; }
.galeria .midia-audio, .galeria .midia-arquivo { aspect-ratio: auto; }
.galeria li.midia-audio, .galeria li.midia-documento { grid-column: span 2; }
@media (max-width: 420px) { .galeria li.midia-audio, .galeria li.midia-documento { grid-column: auto; } }

/* Catálogo de vacinas */
.linha-catalogo { display: grid; grid-template-columns: 2fr 1fr 1.4fr 110px 90px auto; gap: 8px; align-items: center; padding: 8px 22px; }
.linha-catalogo input, .linha-catalogo select { padding: 8px 10px; font-size: .9rem; }
.linha-nova { background: var(--menta); }
@media (max-width: 900px) { .linha-catalogo { grid-template-columns: 1fr 1fr; } }

/* Relatórios */
.barras { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.barras li { display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; }
.barras b { grid-column: 1 / -1; grid-row: 2; height: 10px; border-radius: 6px; background: var(--nevoa); position: relative; overflow: hidden; }
.barras b::after { content: ''; position: absolute; inset: 0 auto 0 0; width: var(--largura); border-radius: 6px; background: var(--gradiente); }
.barra-gargalo b::after { background: linear-gradient(90deg, var(--triagem-laranja), var(--triagem-vermelho)); }
.barras em { font-style: normal; font-size: .72rem; font-weight: 700; padding: 1px 7px; border-radius: 999px; background: #fdeedd; color: #b85f0c; }

/* Histórico: reverter */
.form-reverter { display: inline-block; margin: 4px 0 0; }

/* Documento para imprimir */
.tela-documento { background: #e9eeee; }
.doc-barra { display: flex; justify-content: center; gap: 10px; padding: 16px; }
.documento { width: min(210mm, calc(100% - 24px)); min-height: 270mm; margin: 0 auto 32px; padding: 22mm 20mm; background: #fff; box-shadow: 0 10px 40px rgba(19, 42, 58, .15); display: flex; flex-direction: column; }
.doc-topo { display: flex; justify-content: space-between; padding-bottom: 14px; margin-bottom: 26px; border-bottom: 3px solid var(--verde); }
.doc-clinica { display: block; font: 900 1.4rem var(--fonte-titulo); }
.doc-topo small { color: var(--texto-suave); }
.documento h1 { font-size: 1.3rem; text-align: center; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 26px; }
.doc-texto { flex: 1; font-size: 1rem; line-height: 1.8; white-space: normal; }
.doc-assinatura { display: grid; justify-items: center; margin-top: 60px; }
.doc-linha { width: 280px; border-top: 1px solid var(--marinho); margin-bottom: 6px; }
.doc-rodape { margin: 30px 0 0; text-align: center; font-size: .75rem; color: var(--texto-suave); }
@media print {
    @page { size: A4; margin: 0; }
    .tela-documento { background: #fff; }
    .doc-barra { display: none; }
    .documento { width: auto; min-height: 297mm; margin: 0; box-shadow: none; }
}

/* Instalador */
.passo-instalacao { margin: 0 0 4px !important; color: var(--verde-clinico); font-weight: 700; font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; }
.grupo-instalacao { border: 1px solid var(--borda); border-radius: 14px; padding: 14px 16px 16px; margin: 0; display: grid; gap: 12px; }
.grupo-instalacao legend, .grupo-instalacao summary { font-weight: 700; padding: 0 6px; cursor: pointer; }
.grupo-instalacao label { display: grid; gap: 6px; font-weight: 500; font-size: .92rem; }
.chave-gerada { display: grid; gap: 6px; margin: 14px 0; padding: 14px; border-radius: 12px; background: #fdf6e1; border: 1px solid #f2df9f; }
.chave-gerada code { font-size: .85rem; word-break: break-all; padding: 8px; border-radius: 8px; background: #fff; user-select: all; }
.chave-gerada small { color: #7a5a00; }
.tela-auth .auth-cartao:has(.grupo-instalacao) { max-width: 520px; }

/* Topo: ícones de notificações e atualizações */
.barra-icones { display: flex; align-items: center; gap: 4px; }
.barra-icones .botao-icone { position: relative; width: 40px; height: 40px; }
.contador-icone { position: absolute; top: 2px; right: 1px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: var(--triagem-vermelho); color: #fff; font: 700 .68rem/18px var(--fonte-texto); text-align: center; box-shadow: 0 0 0 2px #fff; }
.ponto-novo { position: absolute; top: 7px; right: 7px; width: 10px; height: 10px; border-radius: 50%; background: var(--verde); box-shadow: 0 0 0 2px #fff; animation: pulso-novo 2s infinite; }
.tem-novidade { color: var(--verde-clinico); }
@keyframes pulso-novo { 0% { box-shadow: 0 0 0 2px #fff, 0 0 0 2px rgba(43, 179, 154, .6); } 70% { box-shadow: 0 0 0 2px #fff, 0 0 0 10px rgba(43, 179, 154, 0); } 100% { box-shadow: 0 0 0 2px #fff, 0 0 0 2px rgba(43, 179, 154, 0); } }

/* Gaveta lateral */
.gaveta-sombra { position: fixed; inset: 0; z-index: 60; background: rgba(19, 42, 58, .4); backdrop-filter: blur(2px); animation: aparecer-sombra .2s; }
@keyframes aparecer-sombra { from { opacity: 0; } }
.gaveta { position: fixed; top: 0; right: 0; bottom: 0; z-index: 61; width: min(400px, 100%); display: flex; flex-direction: column; background: #fff; box-shadow: -20px 0 60px rgba(19, 42, 58, .2); animation: abrir-gaveta .3s var(--suave); }
.gaveta-larga { width: min(480px, 100%); }
@keyframes abrir-gaveta { from { transform: translateX(100%); } }
.gaveta-topo { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 18px 20px; border-bottom: 1px solid var(--borda); }
.gaveta-topo h2 { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 1.15rem; }
.gaveta-topo h2 .icone { color: var(--verde-clinico); }
.gaveta-corpo { flex: 1; overflow-y: auto; padding: 18px 20px 24px; display: grid; gap: 16px; align-content: start; }
.gaveta-vazia { display: grid; justify-items: center; gap: 6px; padding: 28px 10px; text-align: center; }
.gaveta-vazia p { margin: 0; font-weight: 600; }
.avisos { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.avisos a { display: flex; gap: 12px; align-items: flex-start; padding: 12px; border-radius: 12px; border: 1px solid var(--borda); color: var(--marinho); text-decoration: none; transition: background .2s, border-color .2s; }
.avisos a:hover { background: var(--nevoa); border-color: var(--verde); }
.avisos strong { display: block; font-size: .92rem; }
.avisos small { color: var(--texto-suave); }
.aviso-icone { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: var(--menta); color: var(--verde-clinico); }
.aviso-icone .icone { width: 18px; height: 18px; }
.aviso-alerta .aviso-icone { background: #fdf3d5; color: #8a6400; }
.aviso-perigo .aviso-icone { background: #fbe4e4; color: #a12a2a; }
.versao-atual { display: grid; gap: 2px; padding: 16px; border-radius: 14px; background: var(--nevoa); }
.versao-atual small { color: var(--texto-suave); }
.versao-atual strong { font: 900 1.6rem var(--fonte-titulo); }
.atualizacao-nova { display: grid; gap: 8px; padding: 16px; border-radius: 14px; border: 2px solid transparent; background: linear-gradient(#fff, #fff) padding-box, var(--gradiente) border-box; }
.atualizacao-nova h3 { margin: 0; font-size: 1.5rem; }
.atualizacao-nova .selo { justify-self: start; }
.atualizacao-nova .alerta { margin: 0; }
.notas-versao { padding-left: 14px; border-left: 3px solid var(--menta); }
.notas-versao h4 { margin: 0 0 6px; font-family: var(--fonte-titulo); font-size: 1rem; }
.notas-versao h4 small { color: var(--texto-suave); font: 400 .8rem var(--fonte-texto); }
.notas { font-size: .9rem; }
.notas p { margin: 0 0 6px; }
.notas ul { margin: 0 0 8px; padding-left: 18px; }
.notas strong { display: block; margin: 6px 0 4px; }
details.notas summary { cursor: pointer; color: var(--verde-clinico); font-size: .85rem; }
.item-pacote { display: grid; gap: 2px; padding: 10px 12px; }
.item-pacote small { color: var(--texto-suave); }
.item-pacote form { margin: 4px 0 0; }
.alerta-cartao { border-color: #f5c6c4; background: #fff8f8; }
.concluindo { display: grid; justify-items: center; text-align: center; gap: 6px; }
.girando { width: 48px; height: 48px; border-radius: 50%; border: 4px solid var(--menta); border-top-color: var(--verde-clinico); animation: girar .8s linear infinite; margin-bottom: 10px; }
@keyframes girar { to { transform: rotate(360deg); } }
.atualizando .gaveta-corpo { pointer-events: none; opacity: .6; }
@media (max-width: 520px) { .barra-icones .botao-icone { width: 36px; } }
.item-pacote a { display: inline; padding: 0; color: var(--verde-clinico); }

/* Super admin vendo como outro usuário */
.faixa-ver-como { position: sticky; top: 0; z-index: 31; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 10px 28px; background: linear-gradient(90deg, #8a4b00, #b85f0c); color: #fff; font-size: .9rem; }
.faixa-ver-como span { display: flex; align-items: center; gap: 8px; }
.faixa-ver-como form { margin: 0; }
.faixa-ver-como + .barra { top: 0; }
.botao-claro { background: #fff; border-color: #fff; color: #8a4b00; }
.botao-claro:hover { background: #fdeedd; border-color: #fdeedd; color: #8a4b00; box-shadow: none; }
@media (max-width: 960px) { .faixa-ver-como { padding: 10px 14px; } }

/* Versão 1.2: financeiro e estoque */
.subabas { display: flex; gap: 4px; margin: -6px 0 20px; border-bottom: 1px solid var(--borda); overflow-x: auto; }
.subabas a { padding: 10px 14px; color: var(--texto-suave); text-decoration: none; font-weight: 600; font-size: .92rem; white-space: nowrap; border-bottom: 3px solid transparent; margin-bottom: -1px; }
.subabas a:hover { color: var(--verde-clinico); }
.subabas a[aria-current="page"] { color: var(--verde-clinico); border-bottom-color: var(--verde-clinico); }
.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.texto-ok { color: #23733a; }
.inativo { opacity: .5; }
.alerta-cartao-leve { border-color: #f2df9f; background: #fffdf5; }
.alerta-cartao-leve h2 { display: flex; align-items: center; gap: 8px; }
.selo.mov-entrada, .selo.mov-estorno { background: #e3f4e7; color: #23733a; }
.selo.mov-venda, .selo.mov-uso_cobrado { background: #e5eefb; color: #2b5ea8; }
.selo.mov-uso_incluso { background: #edf1f2; color: #5b6b74; }
.selo.mov-perda { background: #fbe4e4; color: #a12a2a; }
.selo.mov-ajuste { background: #fdf3d5; color: #8a6400; }
.fluxo { display: flex; align-items: flex-end; gap: 3px; height: 160px; padding-top: 8px; overflow-x: auto; }
.fluxo-dia { flex: 1 0 14px; display: grid; grid-template-rows: 1fr auto; height: 100%; text-align: center; }
.fluxo-barras { display: flex; align-items: flex-end; justify-content: center; gap: 2px; }
.fluxo-barras i { width: 6px; min-height: 2px; border-radius: 3px 3px 0 0; }
.fluxo i.entrada, .legenda-fluxo i.entrada { background: var(--triagem-verde); }
.fluxo i.saida, .legenda-fluxo i.saida { background: var(--triagem-vermelho); }
.fluxo small { font-size: .65rem; color: var(--texto-suave); }
.legenda-fluxo { display: flex; gap: 16px; margin: 8px 0 0; font-size: .82rem; color: var(--texto-suave); }
.legenda-fluxo i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 4px; vertical-align: -1px; }
.baixa-rapida { display: inline-flex !important; gap: 6px; align-items: center; }
.baixa-rapida select { width: auto; padding: 5px 30px 5px 8px; font-size: .82rem; }
.tabela-itens { margin-top: 4px; }
.tabela-itens td, .tabela-itens th { padding: 10px 8px; }
.tabela-itens tfoot td { border-top: 2px solid var(--borda); font-weight: 600; }
.form-item { display: grid; gap: 10px; margin-top: 12px; }
.busca-item { position: relative; }
.item-escolhido { padding: 10px 12px; border-radius: 10px; background: var(--menta); display: grid; }
.item-escolhido small { color: var(--texto-suave); }
.linha-item { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
.linha-item label { display: grid; gap: 4px; font-size: .88rem; font-weight: 500; }
.linha-item input[type=text] { width: 110px; }
.linha-item .caixa { display: flex; gap: 6px; align-items: center; padding-bottom: 10px; }
.fechar-conta { position: sticky; top: 84px; display: grid; gap: 12px; }
.total-conta { display: grid; margin: 0; padding: 14px; border-radius: 12px; background: var(--nevoa); }
.total-conta small { color: var(--texto-suave); }
.total-conta strong { font: 900 2rem var(--fonte-titulo); color: var(--verde-clinico); font-variant-numeric: tabular-nums; }
.pdv { display: grid; gap: 20px; align-items: start; }
@media (min-width: 1000px) { .pdv { grid-template-columns: 1fr 340px; } }
.pdv-itens .busca-item input { font-size: 1.05rem; padding: 14px; }
.qtd-pdv { width: 70px !important; text-align: right; padding: 6px 8px !important; }
.linha-servico { grid-template-columns: 2fr 1.2fr 110px 110px 80px auto; }
.cabecalho-linha { font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--texto-suave); padding-top: 14px; padding-bottom: 6px; }
.campo-alerta { border-color: var(--triagem-amarelo) !important; background: #fffdf2 !important; }
.plano-novo { border-style: dashed; }
.modulos-avulsos { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); align-items: end; }
.modulos-avulsos label { display: grid; gap: 4px; font-size: .9rem; font-weight: 500; }

/* Menu do usuário (canto superior direito) */
button.barra-usuario { display: flex; align-items: center; gap: 10px; padding: 4px 8px 4px 4px; border: 1px solid transparent; border-radius: 999px; background: transparent; color: var(--marinho); font: inherit; text-align: left; cursor: pointer; transition: background .2s, border-color .2s; }
button.barra-usuario:hover, button.barra-usuario:focus-visible { background: var(--nevoa); border-color: var(--borda); }
.seta-menu { width: 16px; height: 16px; color: var(--texto-suave); }
.avatar-grande { width: 52px; height: 52px; font-size: 1.3rem; flex: none; }
.usuario-topo { display: flex; gap: 12px; align-items: center; min-width: 0; }
.usuario-topo div { display: grid; min-width: 0; }
.usuario-topo small { color: var(--texto-suave); font-size: .8rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.menu-usuario { display: grid; gap: 6px; }
.menu-usuario a { display: flex; gap: 12px; align-items: center; padding: 12px; border-radius: 12px; color: var(--marinho); text-decoration: none; transition: background .2s; }
.menu-usuario a:hover { background: var(--nevoa); }
.menu-usuario a > .icone { width: 36px; height: 36px; padding: 8px; border-radius: 10px; background: var(--menta); color: var(--verde-clinico); }
.menu-usuario strong { display: block; font-size: .95rem; }
.menu-usuario small { color: var(--texto-suave); font-size: .8rem; }
.perfil-resumo { display: grid; justify-items: center; gap: 4px; text-align: center; margin-bottom: 16px; }
@media (max-width: 960px) { .seta-menu { display: none; } }

/* TV: chamada em destaque */
.tv-chamada { position: fixed; inset: 0; z-index: 10; display: grid; place-items: center; background: rgba(10, 25, 35, .88); animation: aparecer-sombra .3s; }
.tv-chamada-cartao { display: grid; justify-items: center; gap: 1vw; padding: 4vw 6vw; border-radius: 3vw; background: #fff; color: var(--marinho); text-align: center; box-shadow: 0 0 0 1vw rgba(43, 179, 154, .35); animation: pulso-chamada 1.2s ease-in-out infinite alternate; }
.tv-chamada-cartao small { font-size: 2vw; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--verde-clinico); }
.tv-chamada-cartao strong { font: 900 9vw/1 var(--fonte-titulo); }
.tv-chamada-cartao span { font-size: 3vw; }
.tv-chamada-cartao em { font-style: normal; font-size: 2.6vw; font-weight: 600; color: var(--azul); }
@keyframes pulso-chamada { to { transform: scale(1.03); box-shadow: 0 0 0 2vw rgba(43, 179, 154, .15); } }
.tv-ativar-som { position: fixed; right: 2vw; bottom: 3vw; z-index: 11; padding: 1vw 2vw; border: 0; border-radius: 999px; background: var(--verde); color: var(--marinho); font: 700 1.3vw var(--fonte-texto); cursor: pointer; box-shadow: 0 10px 30px rgba(0, 0, 0, .3); }
@media (max-width: 900px) { .tv-ativar-som { font-size: 1rem; padding: 12px 18px; } }

/* Balões de notificação */
.baloes { position: fixed; right: 18px; bottom: 18px; z-index: 70; display: grid; gap: 10px; width: min(360px, calc(100% - 36px)); }
.balao { position: relative; display: grid; gap: 2px; padding: 14px 40px 14px 16px; border-radius: 14px; background: #fff; border: 1px solid var(--borda); border-left: 5px solid var(--verde); box-shadow: 0 16px 40px rgba(19, 42, 58, .2); color: var(--marinho); text-decoration: none; animation: entrar-balao .35s var(--suave); transition: opacity .4s, transform .4s; }
.balao small { color: var(--texto-suave); }
.balao-alerta { border-left-color: var(--triagem-amarelo); }
.balao-perigo { border-left-color: var(--triagem-vermelho); }
.balao.saindo { opacity: 0; transform: translateX(30px); }
.balao-fechar { position: absolute; top: 8px; right: 8px; width: 26px; height: 26px; border: 0; border-radius: 8px; background: transparent; color: var(--texto-suave); font-size: 1.2rem; cursor: pointer; }
.balao-fechar:hover { background: var(--nevoa); }
@keyframes entrar-balao { from { opacity: 0; transform: translateY(20px); } }
.som-notificacoes { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border-radius: 12px; background: var(--nevoa); font-size: .9rem; }

/* ---------- 2.0: portal do tutor ---------- */
.tela-portal { min-height: 100vh; display: flex; flex-direction: column; }
.portal-topo { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 12px max(16px, calc((100% - 1100px) / 2)); background: #fff; border-bottom: 1px solid var(--borda); }
.portal-topo::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--gradiente); }
.portal-marca { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--marinho); }
.portal-marca strong { display: block; font-family: var(--fonte-titulo); font-size: 1.1rem; line-height: 1.1; }
.portal-marca small { color: var(--texto-suave); font-size: .8rem; }
.portal-icone { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: var(--menta); color: var(--verde-clinico); }
.portal-menu { display: flex; align-items: center; gap: 4px; }
.portal-menu a, .portal-menu .botao-texto { padding: 8px 12px; border-radius: 10px; color: var(--marinho); text-decoration: none; font-weight: 600; font-size: .92rem; }
.portal-menu a:hover, .portal-menu .botao-texto:hover { background: var(--nevoa); }
.portal-menu form { margin: 0; }
.portal-conteudo { flex: 1; width: min(1100px, calc(100% - 32px)); margin: 24px auto; }
.portal-rodape { padding: 20px 16px 28px; text-align: center; color: var(--texto-suave); font-size: .88rem; }
.portal-rodape p { margin-bottom: 6px; }
.linha-portal { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--borda); }
.linha-portal:last-child { border-bottom: 0; }
.linha-portal > span:first-child { display: flex; flex-direction: column; }
.linha-portal small { color: var(--texto-suave); }
.linha-portal form { margin: 0; }
.dias-portal { display: flex; gap: 8px; overflow-x: auto; padding: 4px 2px 10px; scroll-snap-type: x mandatory; }
.dia-portal, .hora-portal { position: relative; cursor: pointer; scroll-snap-align: start; }
.dia-portal input, .hora-portal input { position: absolute; opacity: 0; pointer-events: none; }
.dia-portal span { display: flex; flex-direction: column; align-items: center; min-width: 62px; padding: 8px 6px; border: 1.5px solid var(--borda); border-radius: 14px; background: #fff; transition: .2s var(--suave); }
.dia-portal strong { font-family: var(--fonte-titulo); font-size: 1.35rem; line-height: 1.1; }
.dia-portal small { color: var(--texto-suave); font-size: .75rem; text-transform: uppercase; }
.horarios-portal { display: flex; flex-wrap: wrap; gap: 8px; }
.hora-portal span { display: inline-block; padding: 8px 14px; border: 1.5px solid var(--borda); border-radius: 999px; background: #fff; font-weight: 600; transition: .2s var(--suave); }
.dia-portal input:checked + span, .hora-portal input:checked + span { border-color: var(--verde-clinico); background: var(--verde-clinico); color: #fff; }
.dia-portal input:checked + span small { color: rgba(255, 255, 255, .85); }
.dia-portal input:focus-visible + span, .hora-portal input:focus-visible + span { outline: 3px solid var(--azul); outline-offset: 2px; }
fieldset { border: 0; padding: 0; margin: 0 0 14px; min-width: 0; }
legend { font-weight: 600; margin-bottom: 8px; font-size: .92rem; }

/* Configurações da clínica */
.opcao-config { display: flex; gap: 12px; align-items: flex-start; padding: 12px 0; border-bottom: 1px solid var(--borda); cursor: pointer; }
.opcao-config input { margin-top: 4px; width: 18px; height: 18px; accent-color: var(--verde-clinico); flex: none; }
.opcao-config span { display: flex; flex-direction: column; }
.opcao-config small { color: var(--texto-suave); }
.tabela-horario input[type=time] { min-width: 110px; }

/* Carteirinha digital */
.carteirinha { width: min(560px, calc(100% - 24px)); margin: 0 auto 32px; background: #fff; border-radius: 20px; overflow: hidden; box-shadow: 0 16px 50px rgba(19, 42, 58, .18); border: 1px solid var(--borda); }
.cart-topo { display: flex; justify-content: space-between; align-items: center; padding: 16px 22px; background: var(--gradiente); color: #fff; }
.cart-topo strong { display: block; font-family: var(--fonte-titulo); font-size: 1.15rem; }
.cart-topo small { opacity: .9; }
.cart-marca { font-family: var(--fonte-titulo); font-weight: 900; font-size: 1.1rem; }
.cart-marca b { color: var(--marinho); }
.cart-corpo { display: grid; grid-template-columns: 96px 1fr 120px; gap: 16px; align-items: center; padding: 20px 22px 10px; }
.cart-foto img, .cart-foto span { display: grid; place-items: center; width: 96px; height: 96px; border-radius: 18px; object-fit: cover; background: var(--menta); color: var(--verde-clinico); font: 900 2.2rem var(--fonte-titulo); }
.cart-dados { display: grid; grid-template-columns: auto 1fr; gap: 2px 10px; margin: 0; font-size: .85rem; }
.cart-dados dt { color: var(--texto-suave); }
.cart-dados dd { margin: 0; font-weight: 600; }
.cart-nome { font-family: var(--fonte-titulo); font-size: 1.15rem; }
.cart-qr { margin: 0; text-align: center; font-size: .72rem; color: var(--texto-suave); line-height: 1.25; }
.cart-qr svg { width: 120px; height: 120px; display: block; }
.cart-alerta { margin: 4px 22px 0; padding: 8px 12px; border-radius: 10px; background: #fdecea; color: #8e2a1f; font-size: .85rem; }
.cart-vacinas { width: calc(100% - 44px); margin: 12px 22px; border-collapse: collapse; font-size: .85rem; }
.cart-vacinas th, .cart-vacinas td { text-align: left; padding: 6px 4px; border-bottom: 1px solid var(--borda); }
.cart-vacinas th { color: var(--texto-suave); font-weight: 600; font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; }
.cart-rodape { padding: 10px 22px 16px; font-size: .78rem; color: var(--texto-suave); }
@media (max-width: 520px) { .cart-corpo { grid-template-columns: 72px 1fr; } .cart-foto img, .cart-foto span { width: 72px; height: 72px; } .cart-qr { grid-column: 1 / -1; } .cart-qr svg { margin: 0 auto; width: 150px; height: 150px; } }
@media print { .carteirinha { box-shadow: none; margin: 0 auto; -webkit-print-color-adjust: exact; print-color-adjust: exact; } }
.doc-registro { padding: 10px 0; border-bottom: 1px solid var(--borda); }
.doc-registro h3 { font-size: 1rem; margin-bottom: 2px; }
.documento h2 { font-size: 1.05rem; margin-top: 22px; border-bottom: 2px solid var(--menta); padding-bottom: 4px; }

/* Página pública do QR Code */
.publico-pet { text-align: center; }
.publico-foto img, .publico-foto span { display: grid; place-items: center; width: 132px; height: 132px; margin: 0 auto 14px; border-radius: 50%; object-fit: cover; background: var(--menta); color: var(--verde-clinico); font: 900 3rem var(--fonte-titulo); box-shadow: 0 0 0 5px #fff, 0 0 0 8px var(--menta); }
.publico-perdido .publico-foto img, .publico-perdido .publico-foto span { box-shadow: 0 0 0 5px #fff, 0 0 0 8px var(--triagem-vermelho); }
.publico-faixa { display: flex; align-items: center; justify-content: center; gap: 8px; margin: -36px -32px 20px; padding: 12px; border-radius: 22px 22px 0 0; background: var(--triagem-vermelho); color: #fff; font: 900 1.3rem var(--fonte-titulo); animation: pulsar 1.6s ease-in-out infinite; }
@keyframes pulsar { 50% { filter: brightness(1.15); } }
.publico-clinica { margin-top: 22px; padding: 16px; border-radius: 14px; background: var(--nevoa); display: flex; flex-direction: column; align-items: center; gap: 4px; }
.publico-clinica small { color: var(--texto-suave); }
.botoes-linha { display: flex; flex-wrap: wrap; gap: 8px; }
.publico-clinica .botoes-linha { justify-content: center; margin-top: 8px; }
@media (max-width: 480px) { .publico-faixa { margin: -28px -20px 18px; } }
@media (prefers-reduced-motion: reduce) { .publico-faixa { animation: none; } }

/* ---------- 2.1: serviços ---------- */
.mapa-baias { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.baia { display: flex; flex-direction: column; gap: 2px; padding: 14px; border: 2px dashed var(--borda); border-radius: 14px; text-decoration: none; color: var(--texto-suave); background: #fff; transition: .2s var(--suave); }
.baia:hover { border-color: var(--verde); transform: translateY(-2px); }
.baia small { font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; }
.baia strong { font-family: var(--fonte-titulo); font-size: 1.1rem; color: var(--marinho); }
.baia span { font-size: .82rem; }
.baia-ocupada { border-style: solid; border-color: var(--verde); background: var(--menta); color: var(--verde-clinico-escuro); }
.baia-hospedagem { border-color: var(--azul); background: #eaf0fb; color: var(--azul); }
.baia-em_andamento { border-color: var(--triagem-vermelho); background: #fdecea; }
.baia-recuperacao { border-color: var(--triagem-amarelo); background: #fdf7e1; }
.dose-atrasada { background: #fdecea; border-radius: 10px; padding-left: 10px !important; padding-right: 10px !important; }
.evolucoes li { display: flex; flex-direction: column; gap: 2px; padding: 10px 0; border-bottom: 1px solid var(--borda); }
.evolucoes li p { margin: 4px 0 0; }
.diario { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; margin-top: 12px; }
.diario-item { display: flex; flex-direction: column; gap: 6px; padding: 10px; border: 1px solid var(--borda); border-radius: 12px; background: #fff; }
.diario-item img, .diario-item video { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 8px; background: var(--nevoa); }
.diario-item p { margin: 0; font-size: .92rem; }
.diario-form .botoes-linha { align-items: center; }
.upload-botao { cursor: pointer; }
.arquivo-escolhido { align-self: center; }
.termo-caixa { display: flex; flex-direction: column; gap: 6px; padding: 12px 14px; border: 1px solid #f2d27a; background: #fdf7e1; border-radius: 12px; }
.termo-caixa.termo-ok { border-color: #b7e2d4; background: var(--menta); }
.termo-caixa strong { display: flex; align-items: center; gap: 6px; }
.termo-caixa form { margin: 4px 0; }
.termo-caixa input[type=text] { flex: 1; min-width: 180px; }
.opcoes-exames { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 6px 14px; }
form.inline { display: inline-block; margin: 0 0 0 8px; }
.passos-cirurgia { display: flex; gap: 6px; list-style: none; padding: 0; margin: 0 0 18px; overflow-x: auto; }
.passos-cirurgia li { flex: 1; min-width: 110px; padding: 8px 10px; border-radius: 10px; background: #fff; border: 1px solid var(--borda); font-size: .85rem; font-weight: 600; color: var(--texto-suave); text-align: center; }
.passos-cirurgia .passo-feito { background: var(--menta); border-color: #b7e2d4; color: var(--verde-clinico); }
.passos-cirurgia .passo-atual { background: var(--verde-clinico); border-color: var(--verde-clinico); color: #fff; }
.bt-quadro { display: grid; grid-template-columns: repeat(4, minmax(220px, 1fr)); gap: 14px; overflow-x: auto; padding-bottom: 6px; }
.bt-coluna { background: #eef3f3; border-radius: 16px; padding: 12px; min-height: 200px; }
.bt-coluna h2 { display: flex; align-items: center; justify-content: space-between; font-size: 1rem; }
.bt-chegou { background: #eaf0fb; } .bt-em_andamento { background: #fdf7e1; } .bt-pronto { background: var(--menta); }
.bt-card { display: flex; flex-direction: column; gap: 4px; padding: 12px; margin-bottom: 10px; border-radius: 12px; background: #fff; box-shadow: var(--sombra); }
.bt-card a { color: var(--marinho); text-decoration: none; }
.bt-card small { font-size: .8rem; }
.bt-card form { margin: 6px 0 0; }
@media (max-width: 960px) { .bt-quadro { grid-template-columns: repeat(4, 240px); } }
.portal-servico { border-left: 4px solid var(--verde); }
.termo-texto { max-height: 320px; overflow: auto; padding: 14px; border: 1px solid var(--borda); border-radius: 10px; background: var(--nevoa); white-space: pre-line; font-size: .92rem; }
.menu-atalhos { position: relative; display: inline-block; }
.menu-atalhos summary { list-style: none; cursor: pointer; }
.menu-atalhos summary::-webkit-details-marker { display: none; }
.menu-atalhos-lista { position: absolute; right: 0; top: calc(100% + 6px); z-index: 20; min-width: 190px; display: flex; flex-direction: column; padding: 6px; background: #fff; border: 1px solid var(--borda); border-radius: 12px; box-shadow: var(--sombra); }
.menu-atalhos-lista a { padding: 9px 12px; border-radius: 8px; color: var(--marinho); text-decoration: none; font-weight: 500; }
.menu-atalhos-lista a:hover { background: var(--menta); }

/* ---------- 2.2: presença online ---------- */
.mapa-presenca { height: 280px; border-radius: 14px; border: 1px solid var(--borda); margin-top: 8px; z-index: 0; }
.campo-prefixo { display: flex; align-items: stretch; border: 1px solid var(--borda); border-radius: 10px; overflow: hidden; background: #fff; }
.campo-prefixo span { display: flex; align-items: center; padding: 0 10px; background: var(--nevoa); color: var(--texto-suave); font-size: .85rem; white-space: nowrap; }
.campo-prefixo input { border: 0 !important; border-radius: 0 !important; flex: 1; min-width: 0; }
.estrelas-escolha { display: inline-flex; flex-direction: row-reverse; gap: 4px; }
.estrelas-escolha input { position: absolute; opacity: 0; pointer-events: none; }
.estrelas-escolha label { font-size: 2.2rem; line-height: 1; color: #d5dcdc; cursor: pointer; transition: transform .15s; }
.estrelas-escolha label:hover, .estrelas-escolha label:hover ~ label, .estrelas-escolha input:checked ~ label { color: #f2b01e; }
.estrelas-escolha input:focus-visible + label { outline: 3px solid var(--azul); border-radius: 4px; }
.vs-estrelas { color: #f2b01e; letter-spacing: 1px; }
.vs-estrelas span { color: #d5dcdc; }
.estrelas-grandes { font-size: 1.2rem; }
.texto-artigo { font-family: var(--fonte-texto); line-height: 1.7; }
.capa-artigo-previa { width: 100%; border-radius: 12px; }
a.numero { text-decoration: none; color: inherit; }

/* ---------- 3.0: IA ---------- */
.ia-painel { border-left: 4px solid #8b6cf0; background: linear-gradient(180deg, #f6f3ff, #fff); }
.ia-painel ul { margin: 6px 0; padding-left: 20px; }
.ia-topo { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; margin-bottom: 6px; }
.ia-topo strong { color: #5b3fd0; }
.ia-topo small { color: var(--texto-suave); }
.ia-carregando::before { content: ''; display: inline-block; width: 14px; height: 14px; margin-right: 8px; vertical-align: -2px; border: 2px solid #c9bbf7; border-top-color: #5b3fd0; border-radius: 50%; animation: girar .8s linear infinite; }
@keyframes girar { to { transform: rotate(360deg); } }
.ia-preenchido { background: #f6f3ff !important; border-color: #8b6cf0 !important; }
.ia-ditado, .ia-blog { margin: 0 0 14px; padding: 12px 14px; border: 1px dashed #b9a8f5; border-radius: 12px; background: #faf8ff; }
.ia-ditado summary, .ia-blog summary { cursor: pointer; font-weight: 600; color: #5b3fd0; display: flex; align-items: center; gap: 8px; }
.ia-ditado[open] summary, .ia-blog[open] summary { margin-bottom: 10px; }
.ia-ditado textarea { width: 100%; margin-bottom: 8px; }
.ia-ditado .ia-painel { margin-top: 10px; padding: 12px; border-radius: 10px; }
.gravando { background: #fdecea !important; border-color: var(--triagem-vermelho) !important; color: var(--triagem-vermelho) !important; animation: pulsar 1.4s ease-in-out infinite; }
.ia-tema { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; margin: 6px 0; padding: 10px 12px; border: 1px solid var(--borda); border-radius: 10px; background: #fff; text-align: left; cursor: pointer; font: inherit; }
.ia-tema:hover { border-color: #8b6cf0; }
.ia-tema small { color: var(--texto-suave); }
.ia-rede { margin: 8px 0; padding: 10px 12px; border: 1px solid var(--borda); border-radius: 10px; background: #fff; }
.ia-rede pre { white-space: pre-wrap; font: inherit; font-size: .9rem; margin: 6px 0; }
.chat-ia { display: flex; flex-direction: column; gap: 12px; }
.chat-mensagens { display: flex; flex-direction: column; gap: 10px; min-height: 260px; max-height: 60vh; overflow-y: auto; padding: 4px; }
.chat-msg { overflow-wrap: anywhere; max-width: 82%; padding: 10px 14px; border-radius: 16px; line-height: 1.55; }
.chat-msg p { margin: 0 0 .6em; } .chat-msg p:last-child { margin: 0; }
.chat-msg ul { margin: 4px 0; padding-left: 20px; }
.chat-eu { align-self: flex-end; background: var(--verde-clinico); color: #fff; border-bottom-right-radius: 4px; white-space: pre-wrap; }
.chat-ia .chat-ia, .chat-msg.chat-ia { align-self: flex-start; background: #f3f0ff; border-bottom-left-radius: 4px; }
.chat-vazio { margin: auto; text-align: center; color: var(--texto-suave); }
.pilula-exemplo { display: inline-block; margin: 4px; padding: 8px 14px; border: 1px solid #c9bbf7; border-radius: 999px; background: #fff; color: #5b3fd0; font: inherit; font-size: .9rem; cursor: pointer; }
.pilula-exemplo:hover { background: #f6f3ff; }
.chat-form { display: flex; gap: 10px; align-items: flex-end; }
.chat-form textarea { flex: 1; resize: vertical; }
.ia-digitando { display: inline-flex; gap: 4px; } .ia-digitando i { width: 7px; height: 7px; border-radius: 50%; background: #8b6cf0; animation: pulsar 1s infinite; } .ia-digitando i:nth-child(2) { animation-delay: .2s; } .ia-digitando i:nth-child(3) { animation-delay: .4s; }
code[data-copiavel] { display: block; margin-top: 6px; padding: 10px; background: #fff; border-radius: 8px; word-break: break-all; user-select: all; }

/* ---------- 3.1: integrações ---------- */
.integracao { display: flex; flex-direction: column; gap: 6px; text-decoration: none; color: inherit; border: 1px solid var(--borda); transition: border-color .2s, transform .2s var(--suave); }
.integracao:hover { border-color: var(--verde); transform: translateY(-2px); }
.integracao-ligada { border-color: #b7e2d4; background: linear-gradient(180deg, var(--menta), #fff); }
.integracao-topo { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.api-doc { white-space: pre-wrap; font-size: .82rem; background: var(--nevoa); padding: 12px; border-radius: 10px; overflow-x: auto; }
.pagamento-online { display: flex; gap: 20px; align-items: flex-start; flex-wrap: wrap; }
.pix-qr { width: 220px; height: 220px; border: 1px solid var(--borda); border-radius: 12px; padding: 8px; background: #fff; image-rendering: pixelated; }
.pagamento-valor { font: 900 2rem var(--fonte-titulo); margin: 0; }
.pix-codigo { width: 100%; font-size: .8rem; word-break: break-all; }
.pagamento-online > div { flex: 1; min-width: 240px; display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.cobrar-online { padding: 12px; border: 1px dashed var(--verde); border-radius: 12px; background: #f7fcfb; }
.cobrar-online summary { cursor: pointer; }
.cobrar-online[open] summary { margin-bottom: 10px; }
.mapa-veiculos { height: 420px; border-radius: 14px; border: 1px solid var(--borda); margin-bottom: 12px; z-index: 0; }
.balao-chamada { border-left: 5px solid var(--triagem-azul); background: #eef4ff; }
.balao-chamada strong { font-size: 1.05rem; }

/* ---------- Fotos: perfil, tutor e documentos ---------- */
.avatar-foto { padding: 0; overflow: hidden; background: #fff; }
.avatar-foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.avatar-perfil { width: 96px; height: 96px; font-size: 2rem; }
.foto-perfil { margin: 12px 0 16px; padding-top: 12px; border-top: 1px solid var(--borda); }
.campo-foto { display: flex; flex-direction: column; gap: 8px; }
.campo-foto-previa { display: flex; flex-wrap: wrap; gap: 8px; }
.campo-foto-previa:empty { display: none; }
.campo-foto-previa img { width: 96px; height: 96px; object-fit: cover; border-radius: 12px; border: 1px solid var(--borda); }
.doc-pdf { display: grid; place-items: center; width: 96px; height: 96px; border-radius: 12px; background: #fdecea; color: #8e2a1f; font-weight: 800; }
.webcam-caixa { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 16px; background: rgba(19, 42, 58, .75); }
.webcam-janela { width: min(720px, 100%); padding: 16px; border-radius: 18px; background: #fff; display: flex; flex-direction: column; gap: 10px; }
.webcam-janela video { width: 100%; max-height: 65vh; border-radius: 12px; background: #000; object-fit: contain; }
.webcam-status { margin: 0; color: var(--texto-suave); }
.tutor-topo { display: flex; align-items: center; gap: 16px; }
.tutor-foto { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; border: 3px solid #fff; box-shadow: 0 0 0 2px var(--menta); flex: none; }
.tutor-sem-foto { display: grid; place-items: center; background: var(--menta); color: var(--verde-clinico); font: 900 1.4rem var(--fonte-titulo); }
.grupo-anexos { border: 1px dashed var(--borda); border-radius: 14px; padding: 14px 16px; }
.grupo-anexos legend { font-weight: 700; padding: 0 6px; }
.docs-tutor { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; }
.doc-tutor { display: flex; flex-direction: column; gap: 3px; padding: 10px; border: 1px solid var(--borda); border-radius: 12px; }
.doc-tutor-img img, .doc-tutor-img .doc-pdf { width: 100%; height: 120px; object-fit: cover; border-radius: 8px; margin-bottom: 4px; }

/* ---------- Ajuda flutuante e passo a passo ---------- */
.ajuda-botao { position: fixed; right: 20px; bottom: 20px; z-index: 90; width: 54px; height: 54px; border: 0; border-radius: 50%; background: var(--gradiente); color: #fff; font: 900 1.6rem var(--fonte-titulo); cursor: pointer; box-shadow: 0 10px 28px rgba(19, 42, 58, .28); transition: transform .2s var(--suave); }
.ajuda-botao:hover { transform: scale(1.07); }
.ajuda-painel { position: fixed; right: 20px; bottom: 86px; z-index: 91; width: min(380px, calc(100vw - 32px)); max-height: min(70vh, 640px); display: flex; flex-direction: column; border-radius: 18px; background: #fff; box-shadow: 0 24px 60px rgba(19, 42, 58, .25); border: 1px solid var(--borda); overflow: hidden; animation: entrar .3s var(--suave); }
.ajuda-topo { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; padding: 16px 18px 10px; background: var(--menta); }
.ajuda-topo small { color: var(--verde-clinico); font-weight: 700; text-transform: uppercase; font-size: .72rem; letter-spacing: .06em; }
.ajuda-topo h2 { margin: 2px 0 0; font-size: 1.15rem; }
.ajuda-corpo { padding: 14px 18px 18px; overflow-y: auto; }
.ajuda-corpo h3 { font-size: .95rem; margin: 14px 0 6px; }
.ajuda-passos, .ajuda-dicas { margin: 0; padding-left: 20px; display: grid; gap: 6px; font-size: .92rem; }
.ajuda-dicas { color: var(--texto-suave); }
.ajuda-mais { margin: 16px 0 0; font-size: .88rem; }
.tour-destaque { position: fixed; z-index: 150; border-radius: 12px; box-shadow: 0 0 0 4px var(--verde), 0 0 0 9999px rgba(19, 42, 58, .55); pointer-events: auto; transition: all .25s var(--suave); }
.tour-caixa { position: fixed; z-index: 151; padding: 14px 16px; border-radius: 14px; background: #fff; box-shadow: 0 18px 50px rgba(19, 42, 58, .3); }
.tour-caixa p { margin: 0 0 10px; }
.tour-rodape { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; }
.tour-rodape span { display: flex; gap: 6px; }
@media (max-width: 600px) { .ajuda-botao { right: 14px; bottom: 14px; width: 48px; height: 48px; } .ajuda-painel { right: 12px; bottom: 72px; } }
@media print { .ajuda-botao, .ajuda-painel { display: none !important; } }

/* Passkeys */
.separador-ou { display: flex; align-items: center; gap: 12px; margin: 18px 0 12px; color: var(--suave, #6b7c8a); font-size: .85rem; }
.separador-ou::before, .separador-ou::after { content: ""; flex: 1; height: 1px; background: currentColor; opacity: .25; }
.form-linha { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; margin-top: 12px; }
.form-linha label { flex: 1 1 240px; display: flex; flex-direction: column; gap: 6px; }

/* Multiunidades */
.trocar-unidade { margin: 0 0 14px; padding: 12px 14px; border-radius: 12px; background: var(--verde-claro, #e8f5f1); }
.trocar-unidade label { display: flex; flex-direction: column; gap: 6px; font-weight: 600; font-size: .9rem; }
.trocar-unidade label span { display: flex; align-items: center; gap: 6px; }
.trocar-unidade select { width: 100%; }
.selo-unidade { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 999px; background: var(--verde-claro, #e8f5f1); font-size: .78rem; font-weight: 600; }
.tabela tfoot td { font-weight: 700; border-top: 2px solid rgba(0,0,0,.08); }
.resumo-rede { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; margin-bottom: 18px; }

/* Controlados: receita de controle especial (duas vias) e impressão do livro/balanço */
.receita-folha { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; max-width: 1180px; margin: 0 auto 30px; }
.receita-via { background: #fff; padding: 22px 24px; border-radius: 6px; box-shadow: 0 4px 18px rgba(19,42,58,.08); font-size: .86rem; display: flex; flex-direction: column; }
.receita-topo { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 10px; border-bottom: 3px solid var(--verde); }
.receita-topo small { display: block; color: var(--texto-suave); }
.receita-numero { text-align: right; } .receita-numero strong { display: block; font: 800 1.1rem var(--fonte-titulo); }
.receita-via h1 { margin: 12px 0 2px; font-size: 1.05rem; text-transform: uppercase; letter-spacing: .04em; text-align: center; }
.receita-via-nome { margin: 0 0 10px; text-align: center; font-weight: 700; color: var(--texto-suave); }
.receita-bloco { border: 1px solid var(--borda); border-radius: 8px; padding: 8px 10px; margin-bottom: 8px; }
.receita-bloco h2 { margin: 0 0 4px; font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: var(--texto-suave); }
.receita-bloco p { margin: 2px 0; }
.receita-prescricao { flex: 1; } .receita-med { font-size: 1rem; }
.receita-assinatura { display: grid; justify-items: center; gap: 4px; margin: 20px 0 12px; } .receita-assinatura span:first-child { justify-self: start; }
.receita-caixas { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.receita-caixas > div { border: 1px solid var(--borda); border-radius: 8px; padding: 6px 8px; font-size: .74rem; }
.receita-caixas h3 { margin: 0 0 4px; font-size: .72rem; text-transform: uppercase; }
.receita-caixas p { margin: 3px 0; }
.so-impressao { display: none; }
.tabela-compacta td, .tabela-compacta th { padding-top: 8px; padding-bottom: 8px; font-size: .86rem; }
.texto-sucesso { color: #1f7a4d; }
@media (max-width: 900px) { .receita-folha { grid-template-columns: 1fr; } }
@page receita { size: A4 landscape; margin: 8mm; }
@media print {
    .receita-folha { page: receita; gap: 8mm; max-width: none; margin: 0; }
    .receita-via { box-shadow: none; border: 1px dashed #999; padding: 6mm; }
    .so-impressao { display: block; padding: 10px 0; }
    .balanco-assinatura { display: grid; justify-items: center; margin-top: 40px; }
    .filtros, .subabas, .cabecalho .botao { display: none !important; }
}
.tabela-numeros td:not(:first-child), .tabela-numeros th { white-space: nowrap; }
.tabela-numeros td:first-child { min-width: 180px; }

/* Gráficos (saúde das clínicas): série única, marcas finas, grade discreta */
.viz { --serie-1: #2a78d6; --texto-eixo: #52514e; --grade: rgba(19, 42, 58, .08); --bom: #0ca30c; --aviso: #fab219; --serio: #ec835a; --critico: #d03b3b; }
.grafico { margin: 0; }
.grafico-titulo { font: 700 .95rem var(--fonte-titulo); margin-bottom: 6px; }
.grafico-area { position: relative; }
.grafico svg { width: 100%; height: auto; display: block; overflow: visible; }
.grafico .grade { stroke: var(--grade); stroke-width: 1; }
.grafico .base { stroke: rgba(19, 42, 58, .25); stroke-width: 1; }
.grafico .eixo { fill: var(--texto-eixo); font: 500 11px var(--fonte-texto); }
.grafico .linha { fill: none; stroke: var(--serie-1); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.grafico .area { fill: var(--serie-1); opacity: .08; }
.grafico .barra { fill: var(--serie-1); }
.grafico .ponto-final, .grafico .ponto-foco { fill: var(--serie-1); stroke: #fff; stroke-width: 2; }
.grafico .cruz { stroke: rgba(19, 42, 58, .35); stroke-width: 1; stroke-dasharray: 3 3; }
.grafico .alvo { fill: transparent; cursor: crosshair; }
.grafico-dica { position: absolute; pointer-events: none; transform: translate(-50%, calc(-100% - 12px)); padding: 6px 10px; border-radius: 8px; background: var(--marinho); color: #fff; font-size: .8rem; white-space: nowrap; box-shadow: var(--sombra); }
.grafico-dica strong { display: block; font-size: .95rem; }
.grafico-resumo { margin: 6px 0 0; font-size: .85rem; color: var(--texto-suave); }
.grafico-tabela { margin-top: 6px; font-size: .85rem; } .grafico-tabela summary { cursor: pointer; color: var(--texto-suave); }
.minigrafico polyline { fill: none; stroke: var(--serie-1, #2a78d6); stroke-width: 1.5; stroke-linejoin: round; }
.minigrafico circle { fill: var(--serie-1, #2a78d6); }
.minigrafico .base { stroke: rgba(19, 42, 58, .15); stroke-width: 1; }
.nivel { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px 3px 8px; border-radius: 999px; font-size: .8rem; font-weight: 700; color: var(--marinho); background: #fff; border: 1px solid var(--borda); white-space: nowrap; }
.nivel svg { width: 14px; height: 14px; }
.nivel-good svg { color: var(--bom); } .nivel-warning svg { color: #b47c00; } .nivel-serious svg { color: #c4572c; } .nivel-critical svg { color: var(--critico); }
.nivel::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; display: none; }
.nivel-good { border-color: var(--bom); } .nivel-warning { border-color: var(--aviso); } .nivel-serious { border-color: var(--serio); } .nivel-critical { border-color: var(--critico); }
.variacao-queda { color: var(--critico); font-weight: 700; } .variacao-alta { color: #1f7a4d; font-weight: 700; }
.motivos { margin: 4px 0 0; padding: 0; list-style: none; font-size: .8rem; color: var(--texto-suave); }
.motivos li::before { content: "• "; }
.grade-graficos { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 480px), 1fr)); gap: 18px; }
.chat-provedor { display: block; margin-top: 6px; font-size: .72rem; color: var(--texto-suave); }

/* Financeiro da plataforma */
.tabela-dre .dre-grupo td { font-weight: 700; background: var(--nevoa); }
.tabela-dre .dre-categoria td:first-child { padding-left: 28px; color: var(--texto-suave); }
.tabela-dre .dre-total td { font-weight: 800; border-top: 2px solid rgba(19,42,58,.12); }
.tabela-dre .dre-final td { background: var(--menta); font-size: 1rem; }
.tabela-dre td.num, .tabela-dre th.num { white-space: nowrap; }
.linha-acao { display: inline-block; margin: 0 6px 6px 0; }
.num { text-align: right; }
.tabela-dre td:first-child, .tabela-dre th:first-child { min-width: 260px; position: sticky; left: 0; background: #fff; z-index: 1; } .tabela-dre .dre-grupo td:first-child { background: var(--nevoa); } .tabela-dre .dre-final td:first-child { background: var(--menta); }
.numero strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pessoa-linha { display: flex; align-items: center; gap: 10px; }
.fidelidade-caixa { padding: 10px 12px; border-radius: 12px; background: var(--menta); margin: 4px 0 10px; } .fidelidade-caixa p { margin: 0 0 6px; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; } .fidelidade-caixa svg { width: 16px; height: 16px; }

/* 3.6: equipamentos */
.numero .bloco { margin-top: 2px; }

/* 3.7: notificações no celular */
.push-aparelho { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; padding: 12px; border-radius: 12px; background: var(--menta); font-size: .9rem; }
.push-aparelho > span:first-child { display: flex; flex-direction: column; gap: 2px; }
.push-aparelho strong { display: flex; align-items: center; gap: 6px; }
.push-aparelho strong .icone { width: 16px; height: 16px; color: var(--verde-clinico); }
.push-aparelho small { color: var(--texto-suave); }
.push-aparelho .botoes-linha { display: flex; flex-wrap: wrap; gap: 6px; }

/* Voltar para versão anterior (super admin, com senha) */
.versao-anterior { margin-top: 8px; }
.versao-anterior > summary { cursor: pointer; color: var(--perigo); font-size: .88rem; font-weight: 600; }
.versao-anterior .form { margin-top: 10px; padding: 12px; border: 1px solid #f0c4be; border-radius: 12px; background: #fff; }
.versao-anterior .alerta p { margin: 4px 0 0; font-size: .88rem; }

/* 3.8: leitor de código de barras */
.campo-com-botao { display: flex; gap: 6px; align-items: stretch; width: 100%; }
.campo-com-botao > input { flex: 1; min-width: 0; }
.campo-com-botao > .botao { flex: none; padding-left: 12px; padding-right: 12px; }
.leitor-camera { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 16px; background: rgba(10, 25, 35, .78); }
.leitor-camera[hidden] { display: none; }
.leitor-janela { width: min(520px, 100%); padding: 16px; border-radius: 20px; background: #fff; box-shadow: 0 30px 70px rgba(0, 0, 0, .35); text-align: center; }
.leitor-video { position: relative; overflow: hidden; border-radius: 14px; background: #000; aspect-ratio: 4 / 3; }
.leitor-video video { width: 100%; height: 100%; object-fit: cover; display: block; }
.leitor-mira { position: absolute; left: 10%; right: 10%; top: 38%; height: 24%; border: 3px solid var(--verde); border-radius: 12px; box-shadow: 0 0 0 999px rgba(0, 0, 0, .25); }
.leitor-mira::after { content: ''; position: absolute; left: 6px; right: 6px; top: 50%; height: 2px; background: #ff4d4d; animation: leitor-linha 1.6s ease-in-out infinite alternate; }
@keyframes leitor-linha { from { transform: translateY(-30px); } to { transform: translateY(30px); } }
.leitor-status { margin: 12px 0; font-weight: 600; color: var(--marinho); }
.leitor-acoes { display: flex; justify-content: center; }
@media (prefers-reduced-motion: reduce) { .leitor-mira::after { animation: none; } }