/* Copyright (c) 2026 Analla Sistemas - www.anallasistemas.com.br. Todos os direitos reservados. */
/* ==========================================================================
   Configuracoes (em secoes) + Painel do Desenvolvedor
   ========================================================================== */

/* visibilidade por perfil (classes postas no <body> por core.js) */
.so-admin, .so-dev { display: none !important; }
body.eh-admin .so-admin { display: revert !important; }
/* visibilidade por perfil das secoes e tratada pelas abas (JS) */
body.eh-admin .cfg-aviso-dev.so-admin { display: flex !important; }
body.eh-dev .so-dev { display: revert !important; }
body.eh-dev .cfg-atalhos a.so-dev { display: inline-flex !important; }
body.eh-admin .cfg-atalhos a.so-admin { display: inline-flex !important; }
body.eh-admin .cfg-abas .cfg-aba.so-admin { display: inline-flex !important; }
body.eh-dev .cfg-abas .cfg-aba.so-dev { display: inline-flex !important; }

/* ---------------- Configuracoes ---------------- */
.cfg-atalhos {
  display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px;
  position: sticky; top: 0; z-index: 5; padding: 6px 0;
  background: var(--bg-color);
}
.cfg-atalhos a {
  display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 999px;
  border: 1.5px solid var(--border-color); background: var(--card-bg); color: var(--text-main);
  font-size: 13px; font-weight: 600; text-decoration: none;
}
.cfg-atalhos a:hover { border-color: var(--primary); color: var(--primary); }
.cfg-secao { margin: 0 0 26px; scroll-margin-top: 70px; }
.cfg-secao > .custom-card { margin-bottom: 14px; }
.cfg-secao-tit {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
  font-size: 17px; font-weight: 800; color: var(--text-main); margin: 0 0 12px; letter-spacing: -.2px;
}
.cfg-secao-tit i { color: var(--primary); font-size: 21px; }
.cfg-secao-tit small { font-size: 12px; font-weight: 600; color: var(--text-muted); letter-spacing: 0; }
.cfg-aviso-dev {
  align-items: center; gap: 14px; padding: 14px 16px; border-radius: 14px;
  border: 1.5px dashed var(--border-color); color: var(--text-muted); margin-bottom: 24px;
}
.cfg-aviso-dev > i { font-size: 26px; color: var(--primary); flex-shrink: 0; }
.cfg-aviso-dev div { display: flex; flex-direction: column; gap: 2px; flex: 1; font-size: 13px; }
.cfg-aviso-dev strong { color: var(--text-main); font-size: 14px; }

/* ---------------- Painel do Desenvolvedor ---------------- */
.menu-item-dev i:first-child { color: var(--primary); }
.dev-faixa {
  display: flex; align-items: center; gap: 10px; padding: 12px 16px; margin-bottom: 16px; border-radius: 12px;
  background: var(--primary-light); color: var(--primary); font-size: 13px;
}
.dev-faixa i { font-size: 20px; flex-shrink: 0; }
.dev-card { margin-bottom: 16px; }
.dev-status { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; padding: 14px 16px 16px; }
.dev-st {
  display: grid; grid-template-columns: 34px 1fr; grid-template-rows: auto auto; column-gap: 10px; align-items: center;
  padding: 10px 12px; border-radius: 12px; background: var(--hover-bg);
}
.dev-st i { grid-row: 1 / span 2; width: 34px; height: 34px; border-radius: 10px; display: flex; align-items: center; justify-content: center;
            background: var(--card-bg); color: var(--primary); font-size: 17px; }
.dev-st-rot { font-size: 11.5px; color: var(--text-muted); font-weight: 600; }
.dev-st strong { font-size: 13.5px; color: var(--text-main); overflow-wrap: anywhere; }
.dev-st-alerta { background: var(--red-light); }
.dev-st-alerta i { color: var(--red); }

.dev-usuarios { display: flex; flex-direction: column; padding: 6px 8px 10px; }
.dev-usuario {
  display: grid; grid-template-columns: 40px minmax(0, 1fr) 16px; gap: 12px; align-items: center; text-align: left;
  padding: 10px; border: 0; border-radius: 12px; background: transparent; color: inherit; font: inherit; cursor: pointer;
}
.dev-usuario:hover { background: var(--hover-bg); }
.dev-usuario.inativo { opacity: .55; }
.dev-usuario-ini {
  width: 40px; height: 40px; border-radius: 12px; display: flex; align-items: center; justify-content: center;
  background: var(--primary-light); color: var(--primary); font-weight: 800; font-size: 16px;
}
.dev-usuario-txt { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.dev-usuario-txt strong { font-size: 14px; color: var(--text-main); }
.dev-usuario-txt span { font-size: 12px; color: var(--text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dev-usuario-mod { color: var(--primary) !important; font-weight: 600; }
.dev-usuario > i { color: var(--text-muted); }
.dev-selo { font-size: 9.5px; font-weight: 800; letter-spacing: .5px; padding: 2px 7px; border-radius: 999px; background: var(--hover-bg); color: var(--text-muted); vertical-align: middle; }
.dev-selo-dev { background: var(--primary); color: #fff; }
.dev-selo-adm { background: var(--yellow-light); color: var(--yellow); }
.dev-vazio { padding: 20px; text-align: center; color: var(--text-muted); font-size: 13px; }
.dev-check { display: flex; align-items: center; gap: 8px; font-size: 14px; margin: 4px 0 10px; cursor: pointer; }
.dev-modal-acoes { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; margin-top: 14px; }

/* indicador "aguardando envio" dos registros feitos sem internet */
.pendente-envio { display: inline-flex; align-items: center; gap: 4px; font-size: 10.5px; font-weight: 700;
  color: var(--yellow); background: var(--yellow-light); border-radius: 999px; padding: 1px 7px; margin-left: 6px; }

/* ---------------- Saudacao / despedida ---------------- */
.overlay-saudacao .saudacao-titulo { font-size: 20px; font-weight: 500; opacity: .95; }
.overlay-saudacao .saudacao-sistema {
  font-size: 42px; font-weight: 800; line-height: 1.08; letter-spacing: -.6px; margin: 6px 0 10px;
  overflow-wrap: anywhere;
}
.overlay-saudacao .saudacao-sub { font-size: 14px; opacity: .85; margin-bottom: 4px; }
.overlay-saudacao .saudacao-empresa-nome {
  font-size: 11px; font-weight: 600; letter-spacing: 1.6px; text-transform: uppercase; opacity: .62; margin-top: 2px;
}
@media (max-width: 600px) {
  .overlay-saudacao .saudacao-sistema { font-size: 32px; }
  .overlay-saudacao .saudacao-titulo { font-size: 17px; }
  .overlay-saudacao .saudacao-empresa-nome { font-size: 10px; letter-spacing: 1.3px; }
}

/* ---------------- Offline: operacao recusada e lista da fila ---------------- */
.indicador-offline.recusada { background: var(--red, #dc2626) !important; color: #fff !important; cursor: pointer; }
.fila-op { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px;
  border: 1px solid var(--border-color); border-radius: 12px; margin-bottom: 8px; }
.fila-op > div:first-child { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.fila-op strong { font-size: 14px; color: var(--text-main); }
.fila-op span { font-size: 12px; color: var(--text-muted); }
.fila-op-recusada { border-color: var(--red); background: var(--red-light); }
.fila-op-erro { color: var(--red) !important; font-weight: 600; }
.fila-op-bts { display: flex; flex-direction: column; gap: 6px; flex-shrink: 0; }

/* item de menu e atalhos do desenvolvedor: so aparecem para ele */
#menu-dev { display: none !important; }
body.eh-dev #menu-dev { display: flex !important; }
body.eh-dev #menu-dev.oculto-modulo { display: flex !important; }

/* ---------------- Acesso por módulo (multi-seleção) ---------------- */
.acs-usuario{border:1px solid var(--border-color);border-radius:14px;padding:12px 14px;margin-bottom:10px;background:var(--card-bg)}
.acs-usuario-cab{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.acs-ini{width:36px;height:36px;border-radius:11px;flex-shrink:0;display:flex;align-items:center;justify-content:center;
  background:var(--primary-light);color:var(--primary);font-weight:800;font-size:15px}
.acs-usuario-txt{display:flex;flex-direction:column;gap:1px;min-width:0}
.acs-usuario-txt strong{font-size:14px;color:var(--text-main)}
.acs-usuario-txt span{font-size:12px;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acs-chips{display:flex;flex-wrap:wrap;gap:8px}
.acs-chip{display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border-radius:999px;cursor:pointer;
  border:1.5px solid var(--border-color);background:var(--card-bg);color:var(--text-muted);
  font:inherit;font-size:13px;font-weight:600;transition:all .15s ease}
.acs-chip i{font-size:16px}
.acs-chip:hover{border-color:var(--primary);color:var(--primary)}
.acs-chip.on{background:var(--primary);border-color:var(--primary);color:#fff}
.acs-chip.on i{color:#fff}


/* ---------------- Configurações em abas (uma seção por vez) ---------------- */
.cfg-abas{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 20px;position:sticky;top:0;z-index:5;
  background:var(--bg-color);padding:8px 0}
.cfg-abas .cfg-aba{display:inline-flex;align-items:center;gap:7px;padding:9px 16px;border-radius:999px;cursor:pointer;
  border:1.5px solid var(--border-color);background:var(--card-bg);color:var(--text-main);
  font:inherit;font-size:13.5px;font-weight:600;transition:all .15s ease}
.cfg-abas .cfg-aba i{font-size:17px;color:var(--text-muted)}
.cfg-abas .cfg-aba:hover{border-color:var(--primary);color:var(--primary)}
.cfg-abas .cfg-aba:hover i{color:var(--primary)}
.cfg-abas .cfg-aba.ativa{background:var(--primary);border-color:var(--primary);color:#fff}
.cfg-abas .cfg-aba.ativa i{color:#fff}
/* mostra só a seção ativa */
#tela-configuracoes .cfg-corpo .cfg-secao{display:none !important;margin:0 0 20px;animation:cfgFade .2s ease}
#tela-configuracoes .cfg-corpo .cfg-secao.ativa{display:block !important}
@keyframes cfgFade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.cfg-aviso-dev{margin-top:4px}

/* ---------------- Leitura em lote ---------------- */
.qk-lote-faixa{display:flex;flex-direction:column;gap:12px;padding:14px 16px;margin:0 0 16px;border-radius:18px;
  background:rgba(22,163,74,.10);border:1.5px solid rgba(22,163,74,.35)}
.qk-lote-faixa-txt{display:flex;gap:12px;align-items:flex-start}
.qk-lote-faixa-txt > i{font-size:28px;color:#16a34a;flex-shrink:0}
.qk-lote-faixa-txt div{display:flex;flex-direction:column;gap:2px;min-width:0}
.qk-lote-faixa-txt strong{font-size:17px}
.qk-lote-faixa-txt span{font-size:14px;opacity:.8}
.qk-lote-faixa-bts{display:flex;gap:10px;flex-wrap:wrap}
.qk-lote-faixa-bts .qk-btn{flex:1;min-width:180px}
.qk-lote-lista{width:100%;max-width:520px;box-sizing:border-box;margin:14px auto 4px;padding:12px 16px;border-radius:16px;background:rgba(15,23,42,.05)}
.qk-lote-tit{font-weight:700;display:flex;align-items:center;gap:8px;margin-bottom:6px}
.qk-lote-lista ul{margin:0;padding-left:20px}
.qk-lote-lista li{padding:2px 0}
.qk-lote-lista small{opacity:.6}
.qk-lote-aviso{display:flex;align-items:center;gap:8px;font-weight:600;color:#16a34a;margin-bottom:6px}
.qk-btn.qk-btn-lote{background:#fff;color:#1e3a5f;border:2px dashed #2c5282;font-weight:700}
.qk-resultado.qk-parcial .qk-resultado-icone{color:#d97706}

.qr-lote-nota{width:100%;font-size:12.5px;color:var(--text-muted);display:flex;align-items:center;gap:6px;margin-bottom:4px}
.qr-lote-conflito{color:var(--yellow);font-weight:600}
.qr-lote-btn{border-style:dashed !important}
.qr-lote-faixa{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:12px 16px;margin:0 0 14px;border-radius:14px;background:var(--primary-light);border:1.5px solid var(--primary)}
.qr-lote-faixa-txt{display:flex;gap:10px;align-items:center;min-width:0}
.qr-lote-faixa-txt > i{font-size:22px;color:var(--primary)}
.qr-lote-faixa-txt div{display:flex;flex-direction:column;min-width:0}
.qr-lote-faixa-txt strong{font-size:14px;color:var(--text-main)}
.qr-lote-faixa-txt span{font-size:12px;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:60vw}
.qr-lote-faixa-bts{display:flex;gap:8px}
.lote-painel{border:1.5px solid var(--primary);background:var(--primary-light);border-radius:14px;padding:12px 14px;margin-bottom:16px}
.lote-painel-tit{font-weight:700;display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px;color:var(--text-main)}
.lote-painel-tit small{font-weight:600;color:var(--text-muted)}
.lote-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.lote-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 6px 5px 12px;border-radius:999px;background:var(--card-bg);
  border:1px solid var(--border-color);font-size:13px;font-weight:600;color:var(--text-main)}
.lote-chip button{border:0;background:var(--hover-bg);color:var(--text-muted);width:22px;height:22px;border-radius:50%;cursor:pointer;font-size:15px;line-height:1}
.lote-chip button:hover{background:var(--red-light);color:var(--red)}

/* ---------------- Painel do Desenvolvedor: abas e seções ---------------- */
.dev-abas{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px;position:sticky;top:0;z-index:5;background:var(--bg-color);padding:8px 0}
.dev-abas .dev-aba{display:inline-flex;align-items:center;gap:7px;padding:9px 15px;border-radius:999px;cursor:pointer;
  border:1.5px solid var(--border-color);background:var(--card-bg);color:var(--text-main);font:inherit;font-size:13.5px;font-weight:600;transition:all .15s ease}
.dev-abas .dev-aba i{font-size:17px;color:var(--text-muted)}
.dev-abas .dev-aba:hover{border-color:var(--primary);color:var(--primary)}
.dev-abas .dev-aba:hover i{color:var(--primary)}
.dev-abas .dev-aba.ativa{background:var(--primary);border-color:var(--primary);color:#fff}
.dev-abas .dev-aba.ativa i{color:#fff}
#tela-desenvolvedor .dev-sec{display:none}
#tela-desenvolvedor .dev-sec.ativa{display:block;animation:cfgFade .2s ease}

/* configurações */
.dev-cfg-linha{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 2px;border-bottom:1px solid var(--border-color)}
.dev-cfg-linha:last-child{border-bottom:none}
.dev-cfg-rot{font-size:14px;color:var(--text-main);font-weight:500}
.dev-cfg-ctrl input[type=text],.dev-cfg-ctrl input[type=number]{padding:8px 10px;border:1.5px solid var(--border-color);border-radius:10px;background:var(--input-bg);color:var(--text-main);font-size:14px}

/* erros */
.dev-ok-vazio{display:flex;align-items:center;gap:8px;justify-content:center;padding:28px;color:var(--green);font-weight:600}
.dev-erro-item{padding:11px 12px;border:1px solid var(--border-color);border-left:3px solid var(--red);border-radius:10px;margin-bottom:8px;background:var(--card-bg)}
.dev-erro-topo{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.dev-erro-msg{font-size:13.5px;font-weight:600;color:var(--text-main);word-break:break-word}
.dev-erro-quando{font-size:11.5px;color:var(--text-muted);white-space:nowrap;flex-shrink:0}
.dev-erro-meta{font-size:11.5px;color:var(--text-muted);margin-top:5px;display:flex;flex-wrap:wrap;gap:2px}

/* permissões */
.dev-perm-linha{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:11px 2px;border-bottom:1px solid var(--border-color);font-size:14px;cursor:pointer}
.dev-perm-linha:last-child{border-bottom:none}

/* atualização */
.dev-upd-aviso{display:flex;gap:10px;padding:12px 14px;border-radius:12px;background:var(--primary-light);color:var(--text-main);font-size:13px;margin-bottom:14px}
.dev-upd-aviso i{font-size:20px;color:var(--primary);flex-shrink:0}
.dev-upd-drop{display:flex;flex-direction:column;align-items:center;gap:10px;padding:26px 16px;border:2px dashed var(--border-color);border-radius:14px;margin-bottom:12px}
.dev-upd-drop > i{font-size:40px;color:var(--primary);opacity:.8}
#dev-upd-nome{font-size:13px;color:var(--text-muted)}
.dev-upd-prog{display:flex;align-items:center;gap:8px;color:var(--primary);font-weight:600}
.dev-upd-prog i{animation:frGira 1s linear infinite}
.dev-upd-ok{display:flex;align-items:center;gap:8px;color:var(--green);font-weight:600}
.dev-upd-ultima{font-size:12.5px;color:var(--text-muted);margin-bottom:10px;display:flex;align-items:center;gap:6px}
.dev-upd-bk{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border:1px solid var(--border-color);border-radius:10px;margin-bottom:8px;font-size:13.5px}