:root{
  --roxo-primario:#C41230;
  --roxo-escuro:#8C0E23;
  --roxo-hover:#A30F29;
  --azul-marca:#154C90;
  --azul-marca-escuro:#0D3565;
  --cinza-bg:#F7F7F9;
  --cinza-borda:#E4E4EA;
  --texto-principal:#1B1B2F;
  --texto-secundario:#68687A;
  --sucesso:#1E7B4D;
  --sucesso-bg:#E7F5EC;
  --alerta:#8A5A00;
  --alerta-bg:#FDF1DC;
  --erro:#A32D2D;
  --erro-bg:#FBEAEA;
  --raio:10px;
  --raio-sm:7px;
  --sombra:0 1px 2px rgba(27,27,47,.04), 0 2px 8px rgba(27,27,47,.05);
  --sombra-media:0 4px 16px rgba(27,27,47,.09), 0 1px 3px rgba(27,27,47,.06);
  --sombra-modal:0 24px 60px rgba(13,20,40,.28);
}
*{box-sizing:border-box;}
body{margin:0;background:#fff;color:var(--texto-principal);font-family:'Segoe UI',Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;line-height:1.5;}
h1,h2,h3{letter-spacing:-.015em;margin:0;}
a{color:var(--roxo-primario);}

/* --- Cabecalho --- */
.topnav{display:flex;align-items:center;justify-content:space-between;padding:0 32px;height:68px;border-bottom:1px solid var(--cinza-borda);position:sticky;top:0;background:rgba(255,255,255,.92);backdrop-filter:saturate(180%) blur(6px);z-index:20;}
.topnav .marca{font-weight:700;font-size:18px;display:flex;align-items:center;gap:12px;color:var(--texto-principal);}
.topnav .marca img{height:38px;width:auto;display:block;flex-shrink:0;}
.topnav .marca .selo-produto{font-size:11px;font-weight:700;letter-spacing:.08em;color:var(--roxo-primario);background:var(--erro-bg);padding:3px 9px;border-radius:20px;text-transform:uppercase;}
.topnav nav{display:flex;gap:28px;height:100%;}
.topnav nav a{color:var(--texto-secundario);text-decoration:none;font-size:14px;font-weight:600;display:flex;align-items:center;border-bottom:2px solid transparent;transition:color .15s;}
.topnav nav a:hover{color:var(--texto-principal);}
.topnav nav a.ativo{color:var(--texto-principal);border-bottom-color:var(--roxo-primario);}
.topnav .usuario{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--roxo-primario),var(--azul-marca));color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;letter-spacing:.02em;box-shadow:var(--sombra);}

/* --- Hero / faixa inicial --- */
.hero-inicio{background:linear-gradient(120deg,var(--azul-marca-escuro),var(--roxo-primario));color:#fff;padding:56px 32px;}
.hero-inicio h1{font-weight:600;font-size:27px;margin:0 0 22px;}
.hero-inicio .acoes{display:flex;gap:10px;flex-wrap:wrap;}
.hero-inicio .acoes a,.hero-inicio .acoes button{background:#fff;color:var(--roxo-primario);border:none;border-radius:var(--raio-sm);padding:11px 20px;font-weight:600;font-size:14px;cursor:pointer;transition:transform .12s ease, box-shadow .15s ease;}
.hero-inicio .acoes a:hover,.hero-inicio .acoes button:hover{box-shadow:0 6px 18px rgba(0,0,0,.2);transform:translateY(-1px);}

.onboarding-bar{display:flex;align-items:center;gap:18px;background:var(--cinza-bg);border-bottom:1px solid var(--cinza-borda);padding:12px 32px;font-size:14px;}
.onboarding-bar .progresso{width:90px;height:6px;background:var(--cinza-borda);border-radius:4px;overflow:hidden;}
.onboarding-bar .progresso span{display:block;height:100%;background:var(--roxo-primario);}

/* --- Cabecalho padrao de pagina interna (titulo + subtitulo + acoes) --- */
.pagina{max-width:1100px;margin:0 auto;padding:32px 32px 56px;}
.pagina-cabecalho{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:26px;flex-wrap:wrap;}
.pagina-cabecalho h2{font-weight:600;font-size:22px;}
.pagina-cabecalho p{color:var(--texto-secundario);font-size:14px;margin:6px 0 0;max-width:560px;}
.pagina-cabecalho .acoes-topo{display:flex;gap:10px;flex-shrink:0;}

/* --- Reset de aparencia padrao do navegador em <button>, e <form> inline nao quebra alinhamento --- */
button{appearance:none;-webkit-appearance:none;font-family:inherit;margin:0;}
form.form-inline-acao{display:inline-flex;margin:0;}

/* --- Botoes --- */
.btn-primario{background:var(--roxo-primario);color:#fff;border:none;border-radius:var(--raio-sm);padding:10px 20px;font-weight:600;font-size:14px;cursor:pointer;transition:background .15s ease, transform .08s ease;}
.btn-primario:hover{background:var(--roxo-hover);}
.btn-primario:active{transform:scale(.98);}
.btn-primario:disabled{opacity:.6;cursor:not-allowed;}
.btn-secundario{background:#fff;color:var(--texto-principal);border:1px solid var(--cinza-borda);border-radius:var(--raio-sm);padding:10px 20px;font-weight:600;font-size:14px;cursor:pointer;transition:border-color .15s ease, background .15s ease;}
.btn-secundario:hover{background:var(--cinza-bg);border-color:#C9C9D2;}
.btn-perigo{background:var(--erro-bg);color:var(--erro);border:1px solid #F3C9C9;border-radius:var(--raio-sm);padding:10px 20px;font-weight:600;font-size:14px;cursor:pointer;transition:background .15s ease;}
.btn-perigo:hover{background:#F8D9D9;}
.btn-icone{width:34px;height:34px;border-radius:50%;border:1px solid var(--cinza-borda);background:#fff;color:var(--texto-secundario);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:15px;transition:all .15s ease;}
.btn-icone:hover{background:var(--cinza-bg);color:var(--texto-principal);}

.layout-com-sidebar{display:flex;min-height:calc(100vh - 120px);}
.sidebar-app{width:220px;border-right:1px solid var(--cinza-borda);padding:18px 0;}
.sidebar-app .btn-iniciar{background:var(--roxo-escuro);color:#fff;border:none;width:calc(100% - 32px);margin:0 16px 14px;padding:11px;border-radius:var(--raio-sm);font-weight:600;font-size:14px;}
.sidebar-app .grupo-titulo{font-size:11px;color:var(--texto-secundario);text-transform:uppercase;letter-spacing:.06em;padding:16px 20px 6px;font-weight:700;}
.sidebar-app a{display:block;padding:9px 20px;font-size:14px;color:var(--texto-principal);text-decoration:none;border-radius:0 20px 20px 0;}
.sidebar-app a.ativo{background:var(--cinza-bg);font-weight:600;color:var(--roxo-primario);}
.conteudo-app{flex:1;padding:28px 32px;}

.filtros{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap;}
.filtros input,.filtros select{border:1px solid var(--cinza-borda);border-radius:var(--raio-sm);padding:9px 12px;font-size:14px;font-family:inherit;}
.filtros input{flex:1;min-width:220px;}

.cartao{background:#fff;border:1px solid var(--cinza-borda);border-radius:12px;box-shadow:var(--sombra);}
.cartao-padding{padding:20px 22px;}

table.lista-envelopes{width:100%;border-collapse:collapse;font-size:14px;}
table.lista-envelopes th{text-align:left;color:var(--texto-secundario);font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.04em;padding:11px 14px;border-bottom:1px solid var(--cinza-borda);}
table.lista-envelopes td{padding:14px;border-bottom:1px solid var(--cinza-borda);vertical-align:middle;}
table.lista-envelopes tr:last-child td{border-bottom:none;}
table.lista-envelopes tr:hover td{background:var(--cinza-bg);}
.badge{font-size:12px;font-weight:600;padding:4px 11px;border-radius:20px;display:inline-flex;align-items:center;gap:5px;}
.badge-sucesso{background:var(--sucesso-bg);color:var(--sucesso);}
.badge-alerta{background:var(--alerta-bg);color:var(--alerta);}
.badge-erro{background:var(--erro-bg);color:var(--erro);}

.card-metrica{background:var(--cinza-bg);border-radius:12px;padding:18px 20px;transition:box-shadow .15s ease;}
.card-metrica .rotulo{font-size:13px;color:var(--texto-secundario);}
.card-metrica .valor{font-size:27px;font-weight:700;margin-top:5px;}

/* --- Campos de formulario: estilo unico global, nao depende do wrapper --- */
input,select,textarea{
  font-family:inherit;font-size:14px;color:var(--texto-principal);
  border:1px solid var(--cinza-borda);border-radius:var(--raio-sm);
  padding:10px 12px;background:#fff;transition:border-color .15s ease, box-shadow .15s ease;
}
input[type=file]{border:none;padding:0;background:none;}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--roxo-primario);box-shadow:0 0 0 3px rgba(196,18,48,.12);}
input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea{width:100%;display:block;}
textarea{resize:vertical;}

.form-grupo{margin-bottom:18px;}
.form-grupo label{display:block;font-size:13px;font-weight:600;margin-bottom:6px;}
.form-grupo label .obrig{color:#C0264F;}

.linha-destinatario{position:relative;background:#fff;border:1px solid var(--cinza-borda);border-left:3px solid var(--azul-marca);border-radius:var(--raio-sm);padding:16px;display:grid;grid-template-columns:1fr 1fr 90px auto;gap:16px;align-items:end;margin-bottom:10px;}
.linha-destinatario label{display:block;font-size:12px;font-weight:600;margin-bottom:6px;color:var(--texto-secundario);text-transform:uppercase;letter-spacing:.03em;}

.upload-area{border:1px dashed var(--cinza-borda);background:var(--cinza-bg);border-radius:12px;padding:40px;text-align:center;transition:border-color .15s ease, background .15s ease;}

.tela-assinatura-externa{max-width:480px;margin:60px auto;background:#fff;border-radius:16px;box-shadow:0 20px 60px rgba(13,53,101,.25);padding:36px;}
.fundo-assinatura{background:linear-gradient(120deg,var(--azul-marca-escuro),var(--roxo-primario));min-height:100vh;padding:20px;}
.aviso-seguranca{font-size:13px;color:var(--texto-secundario);margin-top:18px;}

/* --- Modal reutilizavel (window.abrirModal / window.fecharModal, ver app.js) --- */
.modal-fundo{display:none;position:fixed;inset:0;background:rgba(20,20,35,.55);align-items:center;justify-content:center;z-index:100;padding:20px;}
.modal-fundo.aberto{display:flex;}
.modal-caixa{background:#fff;border-radius:14px;box-shadow:var(--sombra-modal);width:100%;max-width:440px;max-height:86vh;overflow-y:auto;padding:26px;animation:modal-entrar .16s ease-out;}
@keyframes modal-entrar{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
.modal-cabecalho{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;}
.modal-cabecalho h3{font-size:17px;font-weight:600;}
.modal-fechar{background:none;border:none;font-size:20px;line-height:1;color:var(--texto-secundario);cursor:pointer;padding:4px;border-radius:6px;}
.modal-fechar:hover{background:var(--cinza-bg);color:var(--texto-principal);}
.modal-rodape{display:flex;justify-content:flex-end;gap:10px;margin-top:20px;}

/* --- Selecionar + editar (padrao usado em Areas/Categorias no Admin) --- */
.selecionar-editar{display:flex;gap:10px;align-items:center;max-width:420px;}
.selecionar-editar select{flex:1;}