/* ============================================================
   LAB AUDIO — estilo compartilhado dos painéis administrativos
   (agenda, clientes, equipe, invoices, propostas-lista, propostas)

   Editar aqui muda a aparência em todas as páginas que linkam
   este arquivo. Cada página ainda pode ter seu próprio <style>
   local pra layout específico — como o <style> local vem DEPOIS
   deste <link> no <head>, ele sempre pode sobrescrever o que
   precisar (cascata normal do CSS), sem editar este arquivo.

   index.html (form público) e proposta-editor.html (mockup do
   PDF) têm visual propositalmente diferente e não usam a maior
   parte disto — só o reset básico.
   ============================================================ */

:root{
  --accent:#ffb400;       /* cor de destaque da marca — troque só aqui pra rebranding */
  --accent-hover:#ffc733; /* tom mais claro, usado no hover dos botões de destaque */
}

*{box-sizing:border-box;margin:0;padding:0}

body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:#0d0d0f;
  color:#eee;
  min-height:100vh;
  display:flex;
  justify-content:center;
  padding:32px 16px;
}

h1{font-size:26px;letter-spacing:4px;color:#fff}
h1 span{color:var(--accent)}
.sub{color:#aaa;margin:4px 0 20px;font-size:14px}

/* ---- navegação por abas (dentro de uma página) ---- */
nav.abas{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px;align-items:center}
nav.abas button{background:#141417;color:#999;border:1px solid #26262b;border-radius:8px;padding:10px 18px;font-size:13.5px;cursor:pointer}
nav.abas button.on{border-color:var(--accent);color:var(--accent);font-weight:600}
section{display:none}
section.on{display:block}

/* ---- bloco / cartão de seção ---- */
.bloco{background:#141417;border:1px solid #26262b;border-radius:12px;padding:18px;margin-bottom:16px}
.bloco h2{font-size:12px;color:var(--accent);letter-spacing:1px;text-transform:uppercase;margin-bottom:14px}

/* ---- campos de formulário ---- */
fieldset{border:1px solid #232328;border-radius:9px;padding:14px;margin-bottom:12px}
legend{font-size:10.5px;color:#888;text-transform:uppercase;letter-spacing:.6px;padding:0 6px}
label{display:block;font-size:12px;color:#bbb;margin:0 0 5px}
input,select,textarea{width:100%;background:#0d0d0f;border:1px solid #2c2c33;border-radius:8px;padding:9px 11px;color:#fff;font-size:14px;font-family:inherit}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent)}
textarea{min-height:58px;resize:vertical}
.row{display:flex;gap:10px;flex-wrap:wrap}
.row>div{flex:1;min-width:150px}

/* ---- botões ---- */
.salvar{background:var(--accent);color:#111;font-weight:700;border:none;border-radius:8px;padding:10px 18px;font-size:13.5px;cursor:pointer}
.salvar:hover{background:var(--accent-hover)}
.salvar:disabled{background:#5a4a1a;color:#999;cursor:wait}
.btn{background:#26262b;color:#eee;border:1px solid #3a3a42;border-radius:8px;padding:9px 14px;font-size:12.5px;cursor:pointer}
.btn:hover{border-color:var(--accent);color:var(--accent)}
.btn:disabled{opacity:.5;cursor:wait}
.mini{padding:5px 10px;font-size:11.5px}

/* ---- resumo / KPIs no topo ---- */
.resumo-kpis,.resumo{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.resumo-kpis .kpi,.resumo .kpi{flex:1;min-width:150px;background:#141417;border:1px solid #26262b;border-radius:12px;padding:14px 16px}
.resumo-kpis .kpi .v,.resumo .kpi .v{font-size:21px;font-weight:700;color:var(--accent)}
.resumo-kpis .kpi .v.alerta{color:#ffb3b6}
.resumo-kpis .kpi .l,.resumo .kpi .l{font-size:11px;color:#888;text-transform:uppercase;letter-spacing:.5px;margin-top:2px}

/* ---- tabela — min-width força o scroll horizontal no mobile em vez de
   cortar colunas em silêncio (bug corrigido em 22/07/2026) ---- */
table{width:100%;min-width:640px;border-collapse:collapse;font-size:13px}
th{text-align:left;color:#888;font-size:10.5px;text-transform:uppercase;letter-spacing:.5px;padding:8px;border-bottom:1px solid #26262b;white-space:nowrap}
td{padding:9px 8px;border-bottom:1px solid #1e1e23;vertical-align:top}
tr:hover td{background:#18181c}
.scroll-hint{display:none;font-size:11px;color:#666;margin:-6px 0 8px}
@media(max-width:660px){.scroll-hint{display:block}}

/* ---- badges de status — todas as variantes usadas no site, pra qualquer
   página nova poder usar sem reinventar cor ---- */
.badge{display:inline-block;font-size:10.5px;padding:3px 9px;border-radius:20px;border:1px solid #3a3a42;color:#bbb;text-transform:uppercase;letter-spacing:.4px;white-space:nowrap}
.badge.ativo,.badge.fixo,.badge.enviada,.badge.aprovada,.badge.pago{border-color:#3aa05a;color:#8fe6a4}
.badge.pausado,.badge.pendente{border-color:#a8802f;color:#ffcf80}
.badge.encerrado,.badge.none{border-color:#555;color:#888}
.badge.teste,.badge.temporario,.badge.freela{border-color:#2f5aa8;color:#9dc0ff}
.badge.alerta,.badge.recusada{border-color:#e5484d;color:#ffb3b6}
.badge.pago,.badge.pendente{cursor:pointer}

/* ---- avisos, estados vazios, mensagens ---- */
.hint{color:#666;font-size:11.5px;margin-top:6px}
.mono{font-variant-numeric:tabular-nums}
.vazio{color:#666;font-size:13px;padding:22px;text-align:center}
#estado{color:#666;font-size:13.5px;padding:24px 4px;text-align:center}
#erro{display:none;background:#2a1214;border:1px solid #e5484d;border-radius:8px;padding:12px;color:#ffb3b6;font-size:13.5px;margin:14px 0;line-height:1.5}
.msg{font-size:12.5px;margin-top:8px;min-height:16px}
.msg.ok{color:#8fe6a4}
.msg.err{color:#ffb3b6}

@media(max-width:640px){body{padding:18px 10px}.bloco{padding:14px}}
