/* Portal DieLogic — identidade amarelo e preto (Barlow Condensed nos títulos) */
@font-face { font-family: "Barlow Condensed"; font-weight: 800; src: url("/marca/fontes/BarlowCondensed-ExtraBold.ttf"); }
:root {
  --amarelo: #f5c400; --preto: #141414; --cinza: #2a2a2a; --texto: #1d1d1d; --fundo: #f4f4f1;
  --linha: #d9d9d4; --erro: #b3261e; --ok: #1e7b34;
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body { font: 15px/1.5 "Noto Sans", "Segoe UI", system-ui, sans-serif; color: var(--texto); background: var(--fundo); }
a { color: #8a6d00; }
h1, h2 { font-family: "Barlow Condensed", "Noto Sans", sans-serif; font-weight: 800; letter-spacing: .3px; line-height: 1.15; }
h1 { font-size: 30px; margin: 0 0 12px; }
h2 { font-size: 22px; margin: 0 0 8px; }
button, .botao {
  display: inline-block; border: 0; border-radius: 6px; padding: 10px 18px; cursor: pointer; text-decoration: none;
  background: var(--amarelo); color: var(--preto); font: 600 15px "Noto Sans", sans-serif;
}
button:hover, .botao:hover { filter: brightness(.95); }
button.mini { padding: 4px 9px; font-size: 12px; background: #e9e9e4; }
button.mini.perigo { background: #f6d8d5; color: var(--erro); }

/* páginas */
.topo { background: var(--preto); padding: 14px 24px; display: flex; align-items: center; justify-content: space-between; }
.topo .logo img { height: 34px; display: block; }
.caixa { max-width: 560px; margin: 32px auto; padding: 28px; background: #fff; border-radius: 10px;
  box-shadow: 0 1px 3px rgba(0,0,0,.08); }
body.pag:has(.tabela) .caixa { max-width: 1280px; }
.rodape { text-align: center; color: #777; font-size: 13px; padding: 0 16px 24px; }
.form { display: grid; gap: 14px; margin: 18px 0; }
.form label { display: grid; gap: 4px; font-weight: 600; font-size: 14px; }
.form input[type=text], .form input[type=email], .form input[type=password], .form input[type=tel] {
  font: inherit; padding: 10px 12px; border: 1px solid var(--linha); border-radius: 6px; background: #fff; }
.form input:focus { outline: 2px solid var(--amarelo); border-color: var(--amarelo); }
.form .check { display: flex; gap: 8px; align-items: center; font-weight: 400; }
.aviso { padding: 10px 14px; border-radius: 6px; }
.aviso.erro { background: #fbe9e7; color: var(--erro); }
.aviso.ok { background: #e7f4ea; color: var(--ok); }
.destaque { margin-top: 26px; padding: 20px; border-radius: 8px; background: var(--preto); color: #eee; }
.destaque h2 { color: var(--amarelo); }
.links { font-size: 14px; }
.resumo { background: var(--fundo); padding: 10px 14px; border-radius: 6px; }
.tabela { overflow-x: auto; }
table { border-collapse: collapse; width: 100%; font-size: 13px; }
th, td { text-align: left; padding: 7px 8px; border-bottom: 1px solid var(--linha); vertical-align: top; }
th { background: var(--preto); color: var(--amarelo); position: sticky; top: 0; }
tr.s-encerrada td { color: #888; }
tr.s-bloqueada td { background: #fdf0ef; }
td.acoes { display: flex; flex-wrap: wrap; gap: 4px; }
td.acoes form { margin: 0; }

/* área do cliente (sessão) */
body.app { display: flex; flex-direction: column; background: #3a3a3a; overflow: hidden; }
.barra { height: 46px; flex: none; display: flex; align-items: center; gap: 14px; padding: 0 12px;
  background: var(--preto); color: #ddd; font-size: 13px; }
.barra img { height: 26px; }
.barra .esp { flex: 1; }
.barra form { margin: 0; }
.barra button { padding: 6px 12px; font-size: 13px; }
.barra form button { background: #333; color: #eee; }
#tela { flex: 1; min-height: 0; position: relative; }
.sobre { position: fixed; inset: 46px 0 0 0; display: grid; place-items: center; background: rgba(20,20,20,.85);
  color: #eee; text-align: center; padding: 24px; z-index: 5; }
.sobre[hidden] { display: none; }
.sobre p { font-size: 17px; max-width: 520px; }
.barra button.contratar { background: var(--amarelo); color: var(--preto); }
button.secundario { background: #ececec; width: 100%; margin-top: 6px; }
#contratar { position: fixed; top: 46px; right: 0; bottom: 0; width: 380px; max-width: 100%; background: #fff;
  box-shadow: -2px 0 12px rgba(0,0,0,.3); padding: 14px 16px; overflow-y: auto; z-index: 11; }
#contratar[hidden] { display: none; }
.vantagens { padding-left: 18px; font-size: 14px; }
.vantagens li { margin-bottom: 6px; }
.oferta { background: #fff7e0; border: 1px solid #f0d58a; border-radius: 6px; padding: 8px 10px; font-weight: 600; }
.whats { display: block; text-align: center; background: #25d366; color: #fff; margin: 8px 0; }
.interesse { color: #1e7b34; }
.cartao { background: #fff; color: var(--texto); border-radius: 10px; padding: 22px 26px; max-width: 520px; text-align: left; }
.cartao ol { padding-left: 20px; }
.cartao li { margin-bottom: 8px; }
#bemvindo { z-index: 20; }
#painel { position: fixed; top: 46px; right: 0; bottom: 0; width: 360px; max-width: 100%; background: #fff;
  box-shadow: -2px 0 12px rgba(0,0,0,.3); padding: 14px 16px; overflow-y: auto; z-index: 10; }
#painel[hidden] { display: none; }
.painel-topo { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.painel-topo button { background: none; font-size: 22px; padding: 0 6px; }
.dica { font-size: 13px; color: #555; }
.envio { position: relative; overflow: hidden; width: 100%; text-align: center; }
.envio input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
#p-progresso { font-size: 13px; margin: 6px 0; min-height: 18px; }
#p-lista { list-style: none; padding: 0; margin: 0; }
#p-lista li { padding: 7px 0; border-bottom: 1px solid var(--linha); display: grid; word-break: break-all; }
#p-lista small { color: #777; }