/* ============================================================
   PAINEL VETBAHIA — ESTILOS
   Mesma paleta do catálogo público: verde profundo (#005825),
   verde vivo (#25BA2B), dourado (#BB900D).
   ============================================================ */
:root{
  --verde-profundo:#005825;
  --verde-vivo:#25BA2B;
  --dourado:#BB900D;
  --vermelho:#c0392b;
  --cinza-100:#f7f7f6;
  --cinza-200:#ebebe8;
  --cinza-400:#a6a9a2;
  --cinza-600:#6b6f67;
  --tinta:#20261f;
  --branco:#ffffff;
  --radius:14px;
  --sombra:0 2px 4px rgba(20,30,20,.04), 0 12px 28px -14px rgba(20,30,20,.14);
  --fonte-display:'Baloo 2', system-ui, sans-serif;
  --fonte-corpo:'Inter', system-ui, sans-serif;
}
*{box-sizing:border-box;}
body{margin:0; font-family:var(--fonte-corpo); background:var(--cinza-100); color:var(--tinta);}
button{font-family:inherit; cursor:pointer;}
input, select{font-family:inherit; font-size:14px;}
h1,h2,h3{font-family:var(--fonte-display); color:var(--verde-profundo); margin:0;}

/* ---------------- Login ---------------- */
.tela-login{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:
    radial-gradient(circle at 15% 10%, rgba(187,144,13,.10) 0%, transparent 45%),
    radial-gradient(circle at 85% 90%, rgba(37,186,43,.10) 0%, transparent 45%),
    var(--branco);
}
.tela-login[hidden]{ display:none; }
.login-caixa{background:var(--branco); padding:40px 36px; border-radius:20px; box-shadow:var(--sombra); width:100%; max-width:360px; text-align:center;}
.login-subtitulo{color:var(--cinza-600); font-size:14px; margin:6px 0 24px;}
#form-login{display:flex; flex-direction:column; gap:12px;}
#form-login input{padding:12px 14px; border:1.5px solid var(--cinza-200); border-radius:10px;}
#form-login input:focus{outline:none; border-color:var(--verde-vivo);}
#form-login button{background:var(--verde-profundo); color:#fff; border:none; padding:12px; border-radius:999px; font-weight:600; font-family:var(--fonte-display);}
#form-login button:hover{background:var(--verde-vivo);}
.login-erro{color:var(--vermelho); font-size:13px; margin:4px 0 0;}

/* ---------------- App shell ---------------- */
.app{min-height:100vh;}
.app-topo{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 24px; background:var(--branco); border-bottom:1px solid var(--cinza-200);
  position:sticky; top:0; z-index:20;
}
.app-topo-usuario{display:flex; align-items:center; gap:14px; font-size:13.5px; color:var(--cinza-600);}
.btn-link{background:none; border:none; color:var(--verde-profundo); font-weight:600; text-decoration:underline;}

.app-abas{
  display:flex; flex-wrap:wrap; gap:6px; padding:14px 24px; background:var(--branco);
  border-bottom:1px solid var(--cinza-200); position:sticky; top:61px; z-index:19;
}
.aba-btn{
  border:none; background:var(--cinza-100); color:var(--cinza-600); font-weight:600; font-size:13.5px;
  padding:9px 16px; border-radius:999px; transition:.2s;
}
.aba-btn:hover{background:var(--cinza-200);}
.aba-btn.is-ativa{background:var(--verde-profundo); color:#fff;}
.btn-publicar{
  margin-left:auto; border:none; background:var(--dourado); color:#fff; font-weight:700;
  padding:9px 18px; border-radius:999px; font-family:var(--fonte-display);
}
.btn-publicar:hover{background:#a17c0b;}

.app-conteudo{padding:24px; max-width:1100px; margin:0 auto;}
.aba{display:none;}
.aba.is-ativa{display:block;}
.aba-cabecalho{display:flex; align-items:center; justify-content:space-between; margin-bottom:6px;}
.aba-dica{color:var(--cinza-600); font-size:13px; margin:0 0 16px;}

.btn-primario{
  border:none; background:var(--verde-profundo); color:#fff; font-weight:600; font-size:13.5px;
  padding:10px 18px; border-radius:999px; font-family:var(--fonte-display);
}
.btn-primario:hover{background:var(--verde-vivo);}
.btn-secundario{
  border:1.5px solid var(--cinza-200); background:var(--branco); color:var(--tinta); font-weight:600; font-size:13px;
  padding:8px 14px; border-radius:999px;
}
.btn-secundario:hover{border-color:var(--verde-vivo);}
.btn-perigo{border:none; background:none; color:var(--vermelho); font-weight:600; font-size:13px;}
.btn-perigo:hover{text-decoration:underline;}
.btn-icone{border:none; background:var(--cinza-100); border-radius:8px; padding:5px 9px; font-size:13px;}
.btn-icone:hover{background:var(--cinza-200);}

/* ---------------- Listas administrativas ---------------- */
.lista-admin{display:flex; flex-direction:column; gap:10px; margin-top:14px;}
.item-admin{
  background:var(--branco); border:1px solid var(--cinza-200); border-radius:var(--radius);
  padding:12px 16px; display:flex; align-items:center; gap:14px; box-shadow:var(--sombra);
}
.item-admin-logo{width:40px; height:40px; border-radius:8px; object-fit:contain; background:var(--cinza-100); border:1px solid var(--cinza-200); flex-shrink:0;}
.item-admin-corpo{flex:1; min-width:0;}
.item-admin-corpo h3{font-size:14.5px; margin:0 0 2px;}
.item-admin-corpo span{font-size:12.5px; color:var(--cinza-600); display:block;}
.item-admin-acoes{display:flex; gap:6px; flex-shrink:0; align-items:center;}

.produtos-filtros{display:flex; gap:10px; flex-wrap:wrap; margin:14px 0;}
.produtos-filtros select, .produtos-filtros input{
  padding:9px 12px; border:1.5px solid var(--cinza-200); border-radius:10px; background:var(--branco);
}
.produtos-filtros input{flex:1; min-width:200px;}

.paginacao{display:flex; gap:8px; justify-content:center; margin-top:18px;}

.lista-log .item-admin{align-items:flex-start; flex-direction:column; gap:4px;}
.log-linha1{display:flex; gap:8px; align-items:center; font-size:13px;}
.log-tag{background:var(--cinza-100); color:var(--verde-profundo); font-weight:700; font-size:11px; padding:2px 8px; border-radius:999px; text-transform:uppercase;}
.log-tag--erro{background:#fdecea; color:var(--vermelho);}
.log-detalhe{font-size:12px; color:var(--cinza-600);}

/* ---------------- Modal ---------------- */
.modal-overlay{
  position:fixed; inset:0; background:rgba(20,30,20,.45); z-index:50;
  display:flex; align-items:center; justify-content:center; padding:20px;
}
.modal-overlay[hidden]{ display:none; }
.modal-caixa{
  background:var(--branco); border-radius:18px; padding:28px; width:100%; max-width:520px;
  max-height:88vh; overflow-y:auto; position:relative;
}
.modal-fechar{position:absolute; top:14px; right:16px; border:none; background:none; font-size:22px; color:var(--cinza-600); line-height:1;}
.modal-caixa h2{margin-bottom:18px; font-size:20px;}
.campo{margin-bottom:14px;}
.campo label{display:block; font-size:12.5px; font-weight:600; color:var(--cinza-600); margin-bottom:5px;}
.campo input, .campo select, .campo textarea{
  width:100%; padding:10px 12px; border:1.5px solid var(--cinza-200); border-radius:10px; font-size:14px;
}
.campo textarea{resize:vertical; min-height:70px;}
.campo input:focus, .campo select:focus, .campo textarea:focus{outline:none; border-color:var(--verde-vivo);}
.form-acoes{display:flex; justify-content:flex-end; gap:10px; margin-top:20px;}
.form-erro{color:var(--vermelho); font-size:13px; margin-top:8px;}

.upload-area{
  border:2px dashed var(--cinza-200); border-radius:14px; padding:18px; text-align:center;
  cursor:pointer; transition:.2s;
}
.upload-area:hover{border-color:var(--verde-vivo);}
.upload-preview{max-width:100%; max-height:160px; margin:0 auto 10px; display:block; border-radius:8px;}

/* ---------------- Toast ---------------- */
.toast{
  position:fixed; bottom:24px; left:50%; transform:translateX(-50%);
  background:var(--tinta); color:#fff; padding:12px 22px; border-radius:999px;
  font-size:13.5px; z-index:60; box-shadow:var(--sombra);
}
.toast.erro{background:var(--vermelho);}
.toast.sucesso{background:var(--verde-profundo);}

@media(max-width:640px){
  .app-topo, .app-abas{padding:12px 14px;}
  .app-conteudo{padding:14px;}
  .item-admin{flex-wrap:wrap;}
}
