/* ============================================================
   LGPD de Todos - estilos da area logada
   Reaproveita as variaveis e componentes de site/assets/css/styles.css
   (azul-marinho como principal, verde como acento).
   ============================================================ */

.app-body{background:var(--branco)}

/* ---- Login ---- */
.auth-wrap{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px 20px;gap:16px}
.auth-card{width:100%;max-width:440px;border:1.5px solid var(--azul);border-radius:var(--radius);padding:34px 30px;background:var(--branco)}
.auth-logo{display:block;text-align:center;margin-bottom:18px}
.auth-logo img{height:72px;width:auto}
.auth-card h1{font-size:26px;text-align:center;margin-bottom:8px}
.auth-sub{text-align:center;color:var(--tinta-70);font-size:15px;margin-bottom:22px}
.auth-card label{display:block;font-size:14px;font-weight:600;margin:14px 0 6px}
.auth-card input{width:100%;padding:13px 15px;border:1.5px solid var(--tinta-15);border-radius:var(--radius-sm);font-size:16px;font-family:inherit;color:var(--preto)}
.auth-card input:focus{outline:none;border-color:var(--azul);box-shadow:0 0 0 3px var(--azul-suave)}
.btn-block{width:100%;margin-top:22px}
.auth-foot{font-size:13px;color:var(--tinta-55);text-align:center}
.auth-tabs{display:flex;gap:4px;background:var(--tinta-04);border-radius:999px;padding:4px;margin-bottom:18px}
.auth-tabs button{flex:1;border:0;background:none;font-family:inherit;font-size:14px;font-weight:700;color:var(--tinta-70);padding:9px;border-radius:999px;cursor:pointer}
.auth-tabs button.ativo{background:#fff;color:var(--azul);box-shadow:0 1px 3px rgba(10,37,64,.12)}
.cnpj-row{display:flex;gap:8px;align-items:stretch}
.cnpj-row input{flex:1;min-width:0}
.cnpj-row .btn{flex:none;white-space:nowrap}
.auth-card select{width:100%;padding:13px 15px;border:1.5px solid var(--tinta-15);border-radius:var(--radius-sm);font-size:15px;font-family:inherit;color:var(--preto);background:#fff}
.auth-card select:focus{outline:none;border-color:var(--azul);box-shadow:0 0 0 3px var(--azul-suave)}
.check{display:flex;gap:9px;align-items:flex-start;margin:16px 0 0;font-size:13.5px;color:var(--tinta-70);font-weight:400}
.check input{margin-top:3px;flex:none}
.check a{color:var(--azul);font-weight:600}

/* ---- Cabecalho da area ---- */
.app-header{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.95);backdrop-filter:blur(8px);border-bottom:1px solid var(--tinta-15)}
.app-header-inner{display:flex;align-items:center;justify-content:space-between;height:84px}
.app-header .brand-logo{height:64px}
.app-header-right{display:flex;align-items:center;gap:16px}
.app-empresa{font-weight:600;font-size:15px;color:var(--preto);max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.app-loading{min-height:60vh;display:flex;align-items:center;justify-content:center;color:var(--tinta-55);font-size:16px;padding:40px;text-align:center}
.app-main{padding:34px 0 80px}
.app-intro h1{font-size:28px;margin-bottom:6px}
.app-intro p{color:var(--tinta-70);max-width:60ch}

.app-grid{display:grid;grid-template-columns:1fr 340px;gap:36px;align-items:start}

/* ---- Progresso ---- */
.progresso{display:flex;align-items:center;gap:12px;margin:18px 0 26px}
.progresso-bar{flex:1;height:8px;background:var(--tinta-08);border-radius:999px;overflow:hidden}
.progresso-bar span{display:block;height:100%;background:var(--azul-forte);width:0;transition:width .3s ease}
.progresso-txt{font-size:13px;color:var(--tinta-55);white-space:nowrap}

/* ---- Questionario ---- */
.q-bloco{margin-bottom:30px}
.q-bloco h3{font-size:18px;padding-bottom:8px;border-bottom:1px solid var(--tinta-15);margin-bottom:18px}
.q-pergunta{margin-bottom:20px}
.q-texto{font-size:15.5px;font-weight:600;margin-bottom:10px}
.q-opcoes{display:flex;flex-direction:column;gap:8px}
.q-opcao{display:flex;align-items:center;gap:11px;border:1.5px solid var(--tinta-15);border-radius:var(--radius-sm);padding:12px 14px;cursor:pointer;font-size:15px;transition:border-color .15s ease,background .15s ease}
.q-opcao:hover{border-color:var(--azul)}
.q-opcao.selecionada{border-color:var(--azul-forte);background:var(--azul-forte);color:var(--branco)}
.q-opcao input{accent-color:var(--azul-forte);width:17px;height:17px;flex:none}
.q-opcao.selecionada input{accent-color:var(--branco)}

/* ---- Coluna lateral ---- */
.side-sticky{position:sticky;top:88px}
.docs-card{margin-top:22px;border:1px solid var(--tinta-15);border-radius:var(--radius);padding:22px}
.docs-card h2{font-size:17px;margin-bottom:14px}
.docs-list{list-style:none;margin:0 0 12px;padding:0;display:flex;flex-direction:column;gap:10px}
.doc-item{display:grid;grid-template-columns:1fr auto;align-items:center;gap:6px 12px;padding:12px;border:1px solid var(--tinta-15);border-radius:var(--radius-sm)}
.doc-item.pronto{border-color:var(--azul-forte)}
.doc-nome{font-size:14.5px;font-weight:600}
.doc-status{font-size:12px;color:var(--tinta-55);grid-column:1}
.doc-item.pronto .doc-status{color:var(--azul-forte);font-weight:600}
.doc-item .btn{grid-row:1 / span 2;grid-column:2}
.docs-hint{font-size:12.5px;color:var(--tinta-55);margin:0}

@media (max-width:880px){
  .app-grid{grid-template-columns:1fr;gap:26px}
  .side-sticky{position:static}
  .app-col-side{order:-1}
}