/* Convênios — as folhas que sobem de baixo: formulário, ficha (o
   faturamento de um convênio, o demonstrativo de um profissional) e conta.
   Três véus iguais (app-eventos.js abre e fecha), um desenho só. */

.veu{position:fixed;inset:0;z-index:50;background:rgba(14,30,34,.42);display:none;
align-items:flex-end;justify-content:center}
.veu.ver{display:flex}
/* O formulário abre POR CIMA da ficha (Marcar como pago no demonstrativo). */
.veu-alto{z-index:55}
.folha{background:var(--cartao);width:100%;max-width:560px;max-height:92vh;overflow-y:auto;
border-radius:20px 20px 0 0;padding:6px 16px calc(24px + env(safe-area-inset-bottom));
box-shadow:var(--sombra-alta);animation:subir .2s ease-out}
@keyframes subir{from{transform:translateY(24px);opacity:.6}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.folha{animation:none}}
@media (min-width:600px){.veu{align-items:center}.folha{border-radius:20px;max-height:88vh}}

.folha-barra{position:sticky;top:0;background:var(--cartao);display:flex;align-items:center;
padding:10px 0 8px;z-index:2;gap:10px}
.folha-fechar{color:var(--cor);font-weight:700;font-size:15px}
.folha-apagar{margin-left:auto;color:var(--vermelho);font-weight:600;font-size:14px}
.folha-tit{font-size:21px;font-weight:700;letter-spacing:-.4px;line-height:1.25}
.folha-sub{font-size:14px;color:var(--tinta-2);margin-top:3px}

/* ---------- confirmar antes de apagar ---------- */
.confirmar{background:var(--vermelho-claro);border:1px solid #F0C9C2;border-radius:13px;
padding:13px 14px;margin:4px 0 10px}
.confirmar p{font-size:14px;color:var(--vermelho)}
.confirmar-acoes{display:flex;gap:8px;margin-top:10px}
.confirmar-acoes button{flex:1;border-radius:10px;padding:10px;font-size:14px;font-weight:700}
.confirmar-nao{background:#fff;border:1px solid var(--linha);color:var(--tinta)}
.confirmar-sim{background:var(--vermelho);color:#fff}

/* ---------- formulário ---------- */
.campo{margin-top:14px;min-width:0}
.campo label{display:block;font-size:13px;font-weight:700;color:var(--tinta-2);margin-bottom:5px}
.campo input,.campo select,.campo textarea{width:100%;border:1px solid var(--linha);
border-radius:11px;padding:11px 12px;background:var(--papel);font-size:16px;outline:none;min-width:0}
.campo input:focus,.campo select:focus,.campo textarea:focus{border-color:var(--cor);
background:var(--cartao);box-shadow:0 0 0 3px var(--cor-claro)}
.campo textarea{min-height:84px;resize:vertical}
.campo 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='%2352636B' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E");
background-repeat:no-repeat;background-position:right 10px center;background-size:18px;padding-right:36px}
.campo small{display:block;font-size:12.5px;color:var(--tinta-3);margin-top:4px}
.campo.moeda{position:relative}
.campo.moeda input{padding-left:38px}
.campo-rs{position:absolute;left:13px;bottom:12px;font-size:15px;color:var(--tinta-2);font-weight:600;
pointer-events:none}
.campo.marcar label{display:flex;align-items:center;gap:10px;font-size:15px;color:var(--tinta);
font-weight:600;border:1px solid var(--linha);border-radius:11px;padding:11px 12px;background:var(--papel)}
.campo.marcar input{width:20px;height:20px;accent-color:var(--cor);flex:none}
.duas{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.erro{background:var(--vermelho-claro);color:var(--vermelho);border-radius:11px;padding:10px 12px;
font-size:13.5px;font-weight:600;margin-top:14px}
.form-acoes{margin-top:20px;display:grid;gap:8px}
.btn-salvar{background:var(--cor);color:#fff;border-radius:12px;padding:14px;font-size:16px;
font-weight:700;box-shadow:var(--sombra)}
.btn-salvar.claro{background:var(--cor-claro);color:var(--cor);box-shadow:none}
.btn-salvar[disabled]{opacity:.6}
.btn-cancelar{color:var(--tinta-2);font-weight:600;padding:10px;font-size:15px}

/* A regra que o atendimento achou (ou não achou), e a conta da linha. */
.regra{margin-top:14px;border-radius:12px;padding:11px 13px;font-size:13.5px;line-height:1.45;
background:var(--cor-claro);color:var(--cor-fundo);border:1px solid var(--cor-borda)}
.regra b{font-variant-numeric:tabular-nums}
.regra.falta{background:var(--ambar-claro);color:#7A4C00;border-color:#F1DDB4}
.regra button{margin-top:8px;font-weight:700;color:inherit;text-decoration:underline;font-size:13.5px}
.conta-linha{margin-top:12px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.conta-linha div{background:var(--papel);border:1px solid var(--linha);border-radius:11px;padding:8px 10px;min-width:0}
.conta-linha span{display:block;font-size:11px;font-weight:700;text-transform:uppercase;color:var(--tinta-2)}
.conta-linha b{display:block;font-size:15px;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;
text-overflow:ellipsis}

/* ---------- ficha (convênio, demonstrativo) ---------- */
.ficha-val{font-size:26px;font-weight:700;letter-spacing:-.8px;margin-top:10px;font-variant-numeric:tabular-nums}
.ficha-val small{font-size:14px;font-weight:600;color:var(--tinta-2);letter-spacing:0}
.ficha-bloco{margin-top:16px}
.ficha-bloco h3{font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;
color:var(--tinta-2);margin-bottom:8px}
.ficha-tabela{border:1px solid var(--linha);border-radius:12px;overflow:hidden}
.ficha-tabela .tabela td.esq{min-width:0}
.pagamento{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:10px 12px;
border:1px solid var(--linha);border-radius:12px;background:var(--papel);margin-bottom:6px;font-size:14px}
.pagamento b{margin-left:auto;font-variant-numeric:tabular-nums}

.folha-acoes{margin-top:18px;display:grid;gap:8px}
.btn-linha{display:flex;align-items:center;gap:11px;border:1px solid var(--linha);border-radius:12px;
padding:12px 14px;font-size:15px;font-weight:600;background:var(--papel);color:var(--tinta);
text-decoration:none;width:100%;text-align:left}
.btn-linha svg{width:19px;height:19px;color:var(--tinta-2)}
.btn-linha.destaque{background:var(--cor);border-color:var(--cor);color:#fff}
.btn-linha.destaque svg{color:#fff}
.btn-linha.zap{background:#128C4B;border-color:#128C4B;color:#fff}
.btn-linha.zap svg{color:#fff}
.btn-linha.perigo{color:var(--vermelho)}
.btn-linha.perigo svg{color:var(--vermelho)}
