/* ============================================================================
   dialogo.css — janela padrão do site (confirmar, avisar, provador)   [2026-10-02]
   ----------------------------------------------------------------------------
   Mesmo desenho das janelas da Loja (.tvl-dlg, loja.css) e do modelo .tv-modal
   (universo.css): caixa com borda, título 800, botão fechar redondo. Carregado
   no index.php para todas as páginas; quem usa é o tv-dialogo.js (TV.dialogo).
   Até 560px: tela cheia com o fundo da página (padrão de 28/09/2026, SITE §14.6).
   ============================================================================ */
.tvd { padding: 0; margin: auto; width: min(460px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); border: 0; background: transparent; color: var(--tv-texto); overflow: visible; }
.tvd::backdrop { background: var(--tv-fundo-modal, rgba(6, 4, 18, .72)); backdrop-filter: blur(3px); }
.tvd[open] { animation: tvd-entra .22s cubic-bezier(.2, .9, .3, 1.2); }
.tvd.tvd-fechando { animation: tvd-sai .16s ease forwards; }
@keyframes tvd-entra { from { opacity: 0; transform: translateY(14px) scale(.97); } }
@keyframes tvd-sai { to { opacity: 0; transform: translateY(10px) scale(.98); } }
.tvd-caixa { position: relative; display: flex; flex-direction: column; max-height: calc(100dvh - 24px); overflow: hidden; background: var(--tv-superficie); border: 1px solid var(--tv-borda); border-radius: var(--tv-raio-lg, 18px); box-shadow: 0 24px 60px rgba(0, 0, 0, .5); }
html[data-modo="claro"] .tvd-caixa { box-shadow: 0 24px 60px rgba(30, 20, 70, .22); }
.tvd-caixa::before { content: ""; position: absolute; inset: 0 0 auto; height: 3px; background: var(--tv-faixa, var(--tv-destaque)); }
.tvd-corpo { overflow-y: auto; overscroll-behavior: contain; }
.tvd-largo { width: min(860px, calc(100vw - 24px)); }
html:has(.tvd[open]) body { overflow: hidden; }

/* confirmação */
.tvd-icone { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 12px; font-size: 19px; color: #fff; background: linear-gradient(135deg, var(--tv-destaque), color-mix(in srgb, var(--tv-destaque) 60%, var(--tv-luz, #48d0ff))); }
.tvd-perigo .tvd-icone { background: var(--tv-erro, #ef4444); }
.tvd-info .tvd-icone { background: var(--tv-superficie-2); color: var(--tv-destaque-txt, var(--tv-destaque)); border: 1px solid var(--tv-borda); }
.tvd-texto { margin: 0 0 14px; font-size: 14.5px; line-height: 1.5; color: var(--tv-texto-2); }
.tvd-resumo { display: flex; align-items: center; gap: 12px; margin: 0 0 14px; padding: 12px; border-radius: 14px; background: var(--tv-superficie-2); border: 1px solid var(--tv-borda); }
.tvd-resumo-mini { flex: 0 0 auto; width: 64px; height: 48px; border-radius: 10px; overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--tv-fundo); }
.tvd-resumo-mini > * { max-width: 100%; max-height: 100%; }
.tvd-resumo-info { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.tvd-resumo-info b { font-size: 15px; color: var(--tv-texto); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tvd-resumo-info small { font-size: 12px; color: var(--tv-texto-2); }
.tvd-linhas { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 6px; }
.tvd-linhas li { display: flex; justify-content: space-between; gap: 12px; font-size: 14px; color: var(--tv-texto-2); }
.tvd-linhas li b { color: var(--tv-texto); font-variant-numeric: tabular-nums; }
.tvd-linhas li.tvd-total { padding-top: 8px; margin-top: 2px; border-top: 1px dashed var(--tv-borda); font-size: 15px; }
.tvd-linhas li.tvd-total b { font-size: 17px; }
.tvd-linhas li.tvd-neg b { color: var(--tv-erro, #ef4444); }
.tvd-acoes { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }

/* botões (mesmo desenho do .tvl-bt da Loja, para funcionar em qualquer página) */
.tvd-bt {
	display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 42px; padding: 0 18px;
	font: 700 14px/1 var(--tv-fonte, inherit); white-space: nowrap; cursor: pointer;
	color: var(--tv-texto) !important; background: var(--tv-superficie-2); border: 1px solid var(--tv-borda); border-radius: 11px; text-decoration: none !important;
	transition: transform .12s ease, filter .15s ease, border-color .15s ease;
}
.tvd-bt:hover { border-color: var(--tv-destaque); }
.tvd-bt:active { transform: translateY(1px); }
.tvd-bt:focus-visible { outline: 2px solid var(--tv-destaque); outline-offset: 2px; }
.tvd-bt:disabled { opacity: .55; cursor: not-allowed; transform: none; }
.tvd-bt-ok { color: #fff !important; background: linear-gradient(135deg, var(--tv-destaque), color-mix(in srgb, var(--tv-destaque) 70%, var(--tv-luz, #48d0ff))); border-color: transparent; box-shadow: 0 6px 18px color-mix(in srgb, var(--tv-destaque) 30%, transparent); }
.tvd-bt-ok:hover { filter: brightness(1.1); border-color: transparent; }
.tvd-perigo .tvd-bt-ok { background: var(--tv-erro, #ef4444); box-shadow: none; }

@media (max-width: 560px) {
	.tvd, .tvd-largo { width: 100vw; max-width: 100vw; height: 100dvh; max-height: 100dvh; margin: 0; padding: 10px; background: var(--tv-fundo); }
	.tvd::backdrop { background: var(--tv-fundo); backdrop-filter: none; }
	.tvd-caixa { min-height: calc(100dvh - 20px); max-height: calc(100dvh - 20px); border-radius: 14px; box-shadow: none; }
	.tvd-corpo { flex: 1 1 auto; display: flex; flex-direction: column; }
	.tvd-confirma .tvd-corpo { justify-content: center; }
	.tvd-acoes { margin-top: auto; display: grid; grid-template-columns: 1fr 1fr; }
	.tvd-acoes .tvd-bt { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .tvd[open], .tvd.tvd-fechando { animation: none; } }