/* Easy Work Web - mesmo visual do Easy Work Desktop (menus, faixa azul, janelas, grades) */
:root{
  --marinho:#13215a; --janela:#0b1a86; --fundo:#eef1f6; --branco:#fff; --texto:#1d2433; --suave:#5d6880;
  --borda:#c3cad6; --borda2:#dfe3ea; --sel:#0a5ad4; --hover:#e5efff; --botao:#f3f4f6; --botao-b:#adb3bd;
  --ok:#1f7a3a; --erro:#b42318; --alerta:#9a6200;
  --fonte:"Segoe UI", Tahoma, Arial, sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:var(--fonte);font-size:13px;color:var(--texto);background:var(--fundo);min-height:100vh;display:flex;flex-direction:column}
a{color:var(--sel)}
button,input,select,textarea{font:inherit;color:inherit}

/* ---- barra de modulos (icones) + gaveta ---- */
:root{--rail:78px;--gaveta:300px}
body.com-lateral{flex-direction:row}
.rail{width:var(--rail);flex:none;background:var(--marinho);height:100vh;position:sticky;top:0;display:flex;flex-direction:column;z-index:80;overflow-y:auto;scrollbar-width:none}
.rail::-webkit-scrollbar{display:none}
.rail-marca{display:grid;place-items:center;height:52px;flex:none;border-bottom:1px solid rgba(255,255,255,.12)}
.rail-marca img{width:32px;height:32px}
.rail-mods{display:flex;flex-direction:column;padding:4px 0}
.rail-fim{margin-top:auto;display:flex;flex-direction:column;padding:4px 0 8px;border-top:1px solid rgba(255,255,255,.12)}
.rail-bt{display:flex;flex-direction:column;align-items:center;gap:3px;width:100%;padding:6px 4px;border:0;background:none;color:#c9d2ec;text-decoration:none;cursor:pointer;font-size:10.5px;line-height:1.15;text-align:center;position:relative}
.rail-bt svg{width:21px;height:21px;stroke-width:1.8}
.rail-bt:hover{background:rgba(255,255,255,.09);color:#fff}
.rail-bt:focus-visible{outline:2px solid #9fc2ff;outline-offset:-3px}
.rail-bt.ativo{color:#fff}
.rail-bt.ativo::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:3px;background:#f5b800;border-radius:0 2px 2px 0}
.rail-bt.aberto{background:#fff;color:var(--marinho)}
.gaveta{position:fixed;left:var(--rail);top:0;bottom:0;width:var(--gaveta);background:var(--branco);border-right:1px solid var(--borda);box-shadow:6px 0 24px rgba(10,20,50,.18);z-index:75;display:flex;flex-direction:column;animation:gaveta-entra .14s ease-out}
.gaveta[hidden]{display:none}
@keyframes gaveta-entra{from{transform:translateX(-14px);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.gaveta{animation:none}}
.gaveta-topo{display:flex;align-items:center;height:52px;padding:0 8px 0 16px;border-bottom:1px solid var(--borda2);flex:none}
.gaveta-topo h2{margin:0;font-size:15px;color:var(--marinho);flex:1}
.gaveta-fechar{border:0;background:none;padding:6px;cursor:pointer;color:var(--suave);display:grid;place-items:center;border-radius:3px}
.gaveta-fechar:hover{background:var(--hover);color:var(--texto)}
.gaveta-fechar svg{width:18px;height:18px}
.menu-busca{position:relative;padding:8px 10px;border-bottom:1px solid var(--borda2);flex:none}
.menu-busca svg{position:absolute;left:18px;top:50%;transform:translateY(-50%);width:15px;height:15px;color:var(--suave)}
.menu-busca input{width:100%;border:1px solid var(--borda);padding:5px 8px 5px 28px;min-height:30px;background:#f7f8fa}
.menu-busca input:focus{outline:2px solid #7fb0ff;outline-offset:-1px;background:#fff}
.gaveta-corpo{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:4px 0 12px}
.gaveta ul{list-style:none;margin:0;padding:0}
.gaveta .sub[hidden]{display:none}
.gaveta a,.gaveta-corpo button{display:flex;align-items:center;gap:9px;width:100%;padding:6px 12px 6px calc(14px + var(--n,0) * 18px);border:0;background:none;text-align:left;text-decoration:none;color:var(--texto);cursor:pointer;min-height:32px;line-height:1.25}
.gaveta a:hover,.gaveta-corpo button:hover{background:var(--hover)}
.gaveta a:focus-visible,.gaveta-corpo button:focus-visible{outline:2px solid var(--sel);outline-offset:-2px}
.gaveta a.pendente span{color:#7b8496}
.gaveta a.atual{background:#dce8ff;box-shadow:inset 3px 0 0 var(--sel);font-weight:600}
.gaveta svg{width:16px;height:16px;flex:none;stroke-width:2}
.gaveta .ic-vazio{width:16px;flex:none}
.gaveta .seta{margin-left:auto;width:14px;height:14px;color:var(--suave);transition:transform .15s}
.gaveta button[aria-expanded=true] .seta{transform:rotate(90deg)}
.gaveta .sep{height:1px;background:var(--borda2);margin:4px 14px}
.gaveta mark{background:#ffe58a;color:inherit;padding:0}
.gaveta-res .caminho{display:block;font-size:11px;color:var(--suave);font-weight:400;margin-top:1px}
.gaveta-res a{align-items:flex-start}
.gaveta-res a svg,.gaveta-res a .ic-vazio{margin-top:2px}
.gaveta-dica{padding:12px 16px;color:var(--suave)}
.conteudo{flex:1;min-width:0;display:flex;flex-direction:column;min-height:100vh}
.lateral-fundo{display:none}
body.gaveta-aberta .lateral-fundo{display:block;position:fixed;inset:0;background:rgba(10,18,40,.18);z-index:70}
.bt-lateral{display:none;border:0;background:none;color:#fff;padding:6px;margin-left:-6px;cursor:pointer;place-items:center;border-radius:3px}
.bt-lateral:hover{background:rgba(255,255,255,.14)}
.bt-lateral svg{width:22px;height:22px}
@media (max-width:760px){
  .rail{position:fixed;left:0;top:0;transform:translateX(-100%);transition:transform .2s}
  body.lateral-aberta .rail{transform:none}
  body.lateral-aberta .lateral-fundo{display:block;position:fixed;inset:0;background:rgba(10,18,40,.4);z-index:70}
  .gaveta{width:calc(100vw - var(--rail) - 16px)}
  .bt-lateral{display:grid}
}

/* ---- faixa azul (cabecalho do Desktop) ---- */
.faixa{background:var(--marinho);color:#fff;display:flex;align-items:center;gap:12px;padding:0 16px;height:52px;position:sticky;top:0;z-index:40}
.faixa-titulo{font-size:15px;font-weight:600}
.faixa-usuario{font-size:12px;opacity:.85}

.area{flex:1;padding:10px;display:flex;flex-direction:column;gap:16px;min-width:0}
.status{background:#f7f8fa;border-top:1px solid var(--borda2);padding:4px 10px;font-size:12px;color:var(--suave)}

.aviso{margin:10px 16px 0;padding:8px 12px;border:1px solid;border-radius:2px}
.aviso-ok{background:#ecf7ef;border-color:#a8d5b4;color:var(--ok)}
.aviso-erro{background:#fdeeee;border-color:#f0b3ad;color:var(--erro)}
.aviso-alerta{background:#fff7e6;border-color:#f1d29a;color:var(--alerta)}

/* ---- janelas (telas) ---- */
.janela{background:var(--branco);border:1px solid var(--borda);box-shadow:0 2px 8px rgba(20,30,60,.08);width:100%;flex:1;display:flex;flex-direction:column}
.janela-titulo{background:var(--janela);color:#fff;display:flex;align-items:center;gap:12px;padding:10px 14px}
.janela-titulo h1{font-size:16px;margin:0;font-weight:600}
.janela-titulo span{opacity:.8;font-size:12px}
.janela-titulo .fechar{margin-left:auto;color:#fff;text-decoration:none;font-size:20px;line-height:1;opacity:.85}
.janela-corpo{padding:10px 12px 12px;display:flex;flex-direction:column;gap:10px;min-width:0}

.barra-busca{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.barra-busca input[type=search],.barra-busca input[type=text]{width:260px;max-width:100%}
.barra-busca .direita{margin-left:auto;display:flex;gap:8px;align-items:center}
.total{color:var(--suave)}

/* grade (DBGrid) */
.grade{border:1px solid var(--borda);overflow:auto;max-height:max(300px,38vh);background:#fff}
.grade.alta{max-height:max(420px,62vh)}
.grade table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums}
.grade th{position:sticky;top:0;background:#f0f2f5;font-weight:400;text-align:left;border-right:1px solid var(--borda2);border-bottom:1px solid var(--borda);padding:3px 6px;white-space:nowrap}
.grade td{padding:2px 6px;border-right:1px solid #eef0f3;border-bottom:1px solid #eef0f3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:480px}
.grade tr.linha{cursor:pointer}
.grade tr.linha:hover td{background:#f2f7ff}
.grade tr.sel td{background:var(--sel);color:#fff}
.grade .vazio{padding:14px;color:var(--suave);text-align:center}
.grade td.num{text-align:right}

/* formulario */
.ficha{display:flex;flex-direction:column;gap:10px}
fieldset{border:1px solid var(--borda2);margin:0;padding:6px 10px 10px;display:flex;flex-wrap:wrap;gap:8px 10px;min-width:0}
legend{padding:0 4px;color:var(--texto)}
.linha-campos{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:flex-end}
.campo{display:flex;flex-direction:column;gap:2px;width:var(--w,200px);max-width:100%}
.campo label{font-size:12px;line-height:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.campo input,.campo select,.campo textarea{border:1px solid var(--botao-b);background:#fff;padding:3px 5px;border-radius:0;min-height:26px;width:100%}
.campo input:not([type=checkbox]):not([type=radio]):not([type=file]),.campo select{height:26px}
.linha-campos>.bt{min-height:26px}
.campo textarea{resize:vertical}
.campo input:focus,.campo select:focus,.campo textarea:focus{outline:2px solid #7fb0ff;outline-offset:-1px}
.campo .so-leitura,form.leitura .campo input,form.leitura .campo select,form.leitura .campo textarea{background:#f4f5f7;color:#3a4252}
form.leitura .campo input,form.leitura .campo select,form.leitura .campo textarea,form.leitura .chk input{pointer-events:none}
.chk{display:flex;align-items:center;gap:6px;min-height:26px;align-self:flex-end;width:var(--w,auto)}
.lista-marcar{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:2px 12px;border:1px solid var(--borda2);padding:6px 8px;max-height:220px;overflow:auto;width:100%}

/* abas (PageControl) */
.abas{display:flex;flex-wrap:wrap;border-bottom:1px solid var(--borda);gap:2px}
.abas button{border:1px solid var(--borda);border-bottom:0;background:#f0f2f5;padding:4px 12px;cursor:pointer;margin-bottom:-1px}
.abas button[aria-selected=true]{background:#fff;position:relative;z-index:1;padding-bottom:5px}
.abas .aba{border:1px solid var(--borda);border-bottom:0;background:#f0f2f5;padding:4px 12px;margin-bottom:-1px;text-decoration:none;color:var(--sel)}
.abas .aba:hover{background:#e6ebf3}
.abas .aba[aria-current]{background:#fff;color:var(--texto);position:relative;z-index:1;padding-bottom:5px;font-weight:600}
.abas .aba.desab{color:#9aa3b2;cursor:default}
.painel-aba{border:1px solid var(--borda);border-top:0;padding:10px;display:flex;flex-direction:column;gap:10px}
.painel-aba[hidden]{display:none}
.linha-campos[hidden],fieldset[hidden],.dialogo[hidden]{display:none}

/* botoes (iguais aos do Desktop) */
.botoes{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding-top:4px}
.botoes .direita{margin-left:auto}
.bt{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:80px;padding:4px 14px;border:1px solid var(--botao-b);background:var(--botao);cursor:pointer;text-decoration:none;color:var(--texto);min-height:28px}
.bt:hover{background:#e8eaee}
.bt:focus-visible{outline:2px solid var(--sel);outline-offset:1px}
.bt.primario{border-color:var(--sel)}
.bt[disabled],.bt.desab{opacity:.45;pointer-events:none}

/* tela inicial */
.inicio{display:block}
@media (max-width:900px){.inicio{grid-template-columns:1fr}}
.indicadores{display:flex;flex-wrap:wrap;gap:12px}
.ind{background:#f6f2ee;background:#eef0f3;padding:10px 14px;width:200px;min-height:66px}
.ind .t{display:flex;align-items:center;gap:6px;color:var(--suave);font-size:12px}
.ind .t svg{width:16px;height:16px}
.ind .v{font-size:21px;font-weight:700;margin-top:6px}
.ind.clicavel{cursor:pointer}
.ind .nomes{font-size:12px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
h2.secao{font-size:16px;color:var(--marinho);margin:4px 0 0}
.atalhos{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
.atalho{background:#fff;border:1px solid var(--borda2);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:104px;padding:10px;text-align:center;text-decoration:none;color:var(--texto)}
.atalho:hover{border-color:#9db8e8;box-shadow:0 2px 6px rgba(20,30,60,.08)}
.atalho .ic{width:46px;height:46px;border-radius:8px;display:grid;place-items:center}
.atalho .ic svg{width:26px;height:26px}
.atalho.pendente{opacity:.6}
.agenda{background:#fff;border:1px solid var(--borda2);padding:10px 12px}
.agenda h3{margin:0 0 8px;font-size:15px;display:flex;justify-content:space-between}
.agenda h3 small{font-weight:400;color:var(--suave);font-size:12px}
.agenda ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.agenda li{display:grid;grid-template-columns:80px 1fr;gap:6px;font-size:12px}
.agenda li.atraso{color:var(--erro)}

/* login */
body.login{background:linear-gradient(160deg,#eef1f6 0%,#d5ddee 100%);justify-content:center;align-items:center;padding:16px}
.login-caixa{background:#fff;width:100%;max-width:380px;border-radius:8px;overflow:hidden;box-shadow:0 12px 32px rgba(19,33,90,.22)}
.login-topo{background:var(--marinho);color:#fff;display:flex;align-items:center;gap:12px;padding:18px 20px;border-bottom:4px solid #f5b800}
.login-topo img{width:48px;height:48px}
.login-topo b{font-size:22px;display:block}
.login-topo small{opacity:.8}
.login-caixa form{padding:18px 20px 22px;display:flex;flex-direction:column;gap:12px}
.login-caixa .campo{width:100%}
.login-caixa .bt{background:#f5b800;border-color:#d79f00;font-weight:600;min-height:34px}
.login-erro{color:var(--erro);min-height:18px}

@media (max-width:600px){
  .campo{width:100% !important}
  .barra-busca .direita{margin-left:0}
}

/* telas academicas */
.grade td.ed{padding:1px 3px}
.grade td.ed input{width:100%;min-width:56px;border:1px solid var(--borda);padding:2px 4px;min-height:24px;text-align:center;font:inherit}
.grade td.ed input:focus{outline:2px solid #7fb0ff;outline-offset:-1px}
.grade td.ed input.abaixo{color:var(--erro);font-weight:600}
.grade td.ed input.invalido{background:#fdeeee;border-color:var(--erro)}
.grade tr.dispensado td{color:#8a93a3}
.grade.sem-limite{max-height:none}
.lista-chk{border:1px solid var(--borda);background:#fff;max-height:max(320px,52vh);overflow:auto;padding:4px 0}
.lista-chk label{display:flex;align-items:center;gap:8px;padding:3px 10px;cursor:pointer}
.lista-chk label:hover{background:#f2f7ff}
.lista-chk label.marcado{background:#fdeeee}
.log{background:#f7f8fa;border:1px solid var(--borda2);padding:8px 10px;font-family:Consolas,monospace;font-size:12px;white-space:pre-wrap;max-height:220px;overflow:auto}
.log .erro{color:var(--erro)}
.info{color:var(--suave)}
.grade th.c,.grade td.c{text-align:center}
.grade td.mat input{text-align:left}
.hist-grade th{text-align:center}
.hist-grade th:first-child{text-align:left}
.hist-grade tr.tot td{font-weight:600;background:#f6f7f9}
.bt-mini{border:0;background:none;color:var(--erro);cursor:pointer;font-size:15px;line-height:1;padding:0 4px}
.radio-linha{display:flex;flex-wrap:wrap;gap:4px 16px;align-items:center}
.radio-linha label{display:flex;align-items:center;gap:5px}
.campos-doc{display:flex;flex-wrap:wrap;gap:4px;align-items:center;border:1px solid var(--borda2);background:#f9fafb;padding:6px 8px;max-height:120px;overflow:auto}
.campos-doc .info{width:100%;font-size:12px}
.campo-doc{border:1px solid var(--borda);background:#fff;font:12px Consolas,monospace;padding:2px 6px;cursor:pointer;color:var(--marinho)}
.campo-doc:hover{background:var(--hover)}
.arquivo-doc{display:flex;flex-wrap:wrap;gap:8px;align-items:center;border:1px solid var(--borda2);background:#f7f3f0;padding:8px 10px}
.etapas{display:flex;flex-wrap:wrap;gap:4px}
.etapas span{padding:4px 10px;border:1px solid var(--borda2);background:#f4f6f9;color:var(--suave);font-size:12px}
.etapas span.feita{color:var(--ok);border-color:#b9dcc3;background:#f1f9f3}
.etapas span.atual{background:var(--marinho);border-color:var(--marinho);color:#fff;font-weight:600}
section.etapa[hidden]{display:none}
section.etapa{display:flex;flex-direction:column;gap:10px}
/* financeiro: extrato */
.grade tr.pago td{color:#147a2e}
.grade tr.venc td{color:#c0161c}
.grade tr.canc td{color:#8a93a3}
.grade tr.sel td{color:#fff}
.grade .item-grupo{padding-left:22px}
.grade tr.sel .info{color:#dfe8ff}
.total-fin{padding:4px 2px;font-size:13px}
.total-fin .grupo-msg{color:var(--marinho);margin-top:3px}
.dialogo{border:2px solid var(--sel);background:#f6f9ff;padding:12px 14px;border-radius:4px}
.dialogo h3{margin:0;font-size:15px;color:var(--marinho)}
.dialogo p,.dialogo ul{margin:0}
.menu-bt{position:relative}
.menu-bt summary{list-style:none}
.menu-bt summary::-webkit-details-marker{display:none}
.menu-bt.desab{opacity:.45;pointer-events:none}
.menu-bt>div{position:absolute;bottom:100%;left:0;background:#fff;border:1px solid var(--borda);box-shadow:0 4px 14px rgba(0,0,0,.15);z-index:20;min-width:330px;display:flex;flex-direction:column}
.menu-bt>div a{padding:7px 12px;color:var(--texto);text-decoration:none}
.menu-bt>div a:hover{background:var(--hover)}
.log.resultado{max-height:none;min-height:160px;flex:1}
/* financeiro: terminal de caixa */
.caixa{display:grid;grid-template-columns:minmax(300px,32%) 1fr;gap:12px;align-items:start}
.caixa-esq,.caixa-dir{display:flex;flex-direction:column;gap:8px;min-width:0}
.caixa-esq .grade{max-height:max(300px,52vh)}
.info-aluno{background:#f6f9ff;border:1px solid var(--borda2);padding:8px 10px;line-height:1.5}
.receber{border:1px solid var(--borda2);background:#fafbfc;padding:10px}
.valor-grande output{display:block;font-size:20px;font-weight:600;color:var(--marinho);min-width:120px;padding:2px 0}
.valor-grande output.neg{color:#c0161c}
.grade td input[type=checkbox]{width:16px;height:16px}
@media (max-width:900px){.caixa{grid-template-columns:1fr}}
/* financeiro: geracao de parcelas */
.abas-js .aba{font:inherit;cursor:pointer}
.abas .aba.atual{background:#fff;color:var(--texto);position:relative;z-index:1;padding-bottom:5px;font-weight:600}
.grupos-dup{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.grupos-dup fieldset{flex-direction:column;align-items:stretch}
.lista-alunos{max-height:240px}
.lista-alunos label[hidden]{display:none}
.escolha-alunos{display:flex;flex-direction:column;gap:6px}
@media (max-width:1100px){.grupos-dup{grid-template-columns:1fr}}
/* financeiro: boletos */
.grade tr.alerta td{color:#b26a00}
.tab-config{border-collapse:collapse}
.tab-config th{text-align:left;font-weight:600;padding:4px 10px 4px 0;color:var(--suave)}
.tab-config td{padding:3px 10px 3px 0}
.remessas-recentes summary{cursor:pointer;color:var(--sel);padding:4px 0}
/* financeiro: NFS-e */
.nfse-info{margin:0;padding:6px 10px;border:1px solid var(--borda2);background:#fafbfc}
.nfse-info.erro{color:#c0161c}.nfse-info.teste{color:#b26a00}.nfse-info.prod{color:#147a2e}
.grade tr.forte td{font-weight:700}
.det-nfse summary{cursor:pointer;max-width:520px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.det-nfse div{white-space:normal;padding:4px 0;font-size:12px}
.grade tr.sel .det-nfse div{color:#fff}
.cfg-grupo{border:1px solid var(--borda2);padding:10px;display:flex;flex-direction:column;gap:8px}
.cfg-grupo h3{margin:0;font-size:14px;color:var(--marinho)}
.cert-ok{color:#147a2e}.cert-alerta{color:#b26a00}.cert-erro{color:#c0161c}
.lista-eventos{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:2px 12px}