/* ============================================================
   auth.css — telas de login/cadastro/recuperação e painel admin
   (Fase 11). Reusa as variáveis de tema de ui.css (dark + âmbar).
   ============================================================ */

/* ---------- Boot / gate de autenticação (nada protegido renderiza antes) ---------- */
#boot{position:fixed;inset:0;z-index:60;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:var(--bg)}
.boot-logo{font-family:var(--cond);font-size:1.6rem;font-weight:700;letter-spacing:.08em;color:var(--amber)}
.boot-logo span{color:var(--text);font-weight:400}
.boot-msg{font-family:var(--mono);font-size:11px;color:var(--muted)}

/* ---------- Login ---------- */
.auth-body{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:24px;background:radial-gradient(1200px 600px at 50% -10%,rgba(240,165,0,.06),transparent),var(--bg)}
.auth-card{width:100%;max-width:380px;background:rgba(22,27,34,.94);border:1px solid var(--border);border-radius:14px;padding:28px 26px;backdrop-filter:blur(6px)}
.auth-logo{font-family:var(--cond);font-size:1.7rem;font-weight:700;letter-spacing:.08em;color:var(--amber);text-align:center}
.auth-logo span{color:var(--text);font-weight:400}
.auth-tag{text-align:center;color:var(--muted);font-size:.8rem;margin:2px 0 22px}
.auth-form{display:flex;flex-direction:column;gap:13px}
.auth-form label{display:flex;flex-direction:column;gap:5px;font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.auth-form input{background:var(--surface);border:1px solid var(--border);border-radius:8px;color:var(--text);padding:10px 11px;font-family:var(--sans);font-size:14px}
.auth-form input:focus{outline:none;border-color:var(--amber)}
.auth-btn{margin-top:4px;font-family:var(--cond);font-weight:700;font-size:1rem;letter-spacing:.06em;padding:11px;background:var(--amber);color:#0d1117;border:none;border-radius:8px;cursor:pointer;text-transform:uppercase;transition:filter .15s}
.auth-btn:hover{filter:brightness(1.08)}
.auth-links{display:flex;justify-content:space-between;margin-top:6px}
.auth-links a{color:var(--muted);font-family:var(--mono);font-size:11px;text-decoration:none}
.auth-links a:hover{color:var(--amber)}
.auth-sub{color:var(--muted);font-size:.82rem;line-height:1.45;margin-bottom:4px}
.auth-msg{font-family:var(--mono);font-size:11px;line-height:1.45;padding:9px 11px;border-radius:8px;margin-bottom:14px;border:1px solid var(--border);color:var(--muted)}
.auth-msg.err{border-color:var(--red);color:#ff9b9b;background:rgba(239,68,68,.08)}
.auth-msg.ok{border-color:var(--green);color:#86efac;background:rgba(34,197,94,.08)}
.auth-aviso{font-family:var(--sans);font-size:.82rem;line-height:1.5;color:var(--muted);background:rgba(88,166,255,.08);border:1px solid rgba(88,166,255,.4);border-radius:8px;padding:11px 13px;margin-bottom:16px}
.auth-aviso a{color:var(--amber);text-decoration:none}
.auth-aviso code{font-family:var(--mono);font-size:.92em;color:var(--text)}

/* ---------- Header / botão de usuário no hub ---------- */
.hub-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
/* bloco do usuário autenticado (canto superior direito) */
#user-area{display:flex;flex-direction:column;align-items:flex-end;gap:7px;font-family:var(--mono)}
#user-area:empty{display:none}
.u-info{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);line-height:1}
.u-saud b{color:var(--text);font-weight:600}
.u-perfil{font-size:9px;letter-spacing:.12em;padding:2px 7px;border-radius:5px;border:1px solid var(--border);color:var(--muted)}
.u-perfil.is-admin{color:var(--amber);border-color:rgba(240,165,0,.5)}
.u-acoes{display:flex;gap:8px}
.u-btn{font-family:var(--mono);font-size:11px;text-decoration:none;color:var(--muted);padding:6px 13px;border:1px solid var(--border);border-radius:8px;background:rgba(22,27,34,.7);cursor:pointer;transition:color .15s,border-color .15s}
.u-btn:hover{color:var(--amber);border-color:var(--amber)}

/* ---------- Painel admin ---------- */
.admin-top{position:sticky;top:0;z-index:5;border-bottom:1px solid var(--border);background:rgba(13,17,23,.95);padding:14px 22px}
.admin-actions{display:flex;gap:10px}
.admin-actions .hub-volta{margin-bottom:0;cursor:pointer}
.admin-wrap{max-width:1100px;margin:0 auto;padding:24px 18px 50px}
.admin-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin:14px 0 24px}
.admin-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px 18px}
.admin-card-v{font-family:var(--cond);font-weight:700;font-size:1.9rem;color:var(--amber);line-height:1}
.admin-card-r{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-top:6px}
.admin-tabela-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:12px}
.admin-tabela{width:100%;border-collapse:collapse;font-size:13px;min-width:760px}
.admin-tabela th{text-align:left;font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:12px 14px;border-bottom:1px solid var(--border);background:rgba(13,17,23,.4)}
.admin-tabela td{padding:11px 14px;border-bottom:1px solid var(--border);color:var(--text);vertical-align:middle}
.admin-tabela tr:last-child td{border-bottom:none}
.admin-email{font-family:var(--mono);font-size:12px;color:var(--muted)}
.admin-num{font-family:var(--mono);text-align:center}
.admin-perfil{font-family:var(--mono);font-size:11px;padding:2px 8px;border-radius:5px;border:1px solid var(--border);color:var(--muted)}
.admin-perfil.is-admin{color:var(--amber);border-color:rgba(240,165,0,.5)}
.admin-status{font-family:var(--mono);font-size:11px;font-weight:600}
.admin-status.on{color:var(--green)}
.admin-status.off{color:var(--red)}
.admin-row-acoes{display:flex;gap:6px;white-space:nowrap}
.admin-mini{font-family:var(--mono);font-size:10px;padding:5px 9px;border:1px solid var(--border);border-radius:6px;background:rgba(22,27,34,.7);color:var(--muted);cursor:pointer}
.admin-mini:hover{color:var(--amber);border-color:var(--amber)}
.admin-mini:disabled{opacity:.5;cursor:default}
.admin-vazio{text-align:center;color:var(--muted);font-family:var(--mono);font-size:12px;padding:22px}
/* abas (Usuários / Auditoria) */
.admin-tabs{display:flex;gap:8px;margin:4px 0 18px;flex-wrap:wrap}
.admin-tab{font-family:var(--mono);font-size:12px;color:var(--muted);padding:8px 16px;border:1px solid var(--border);border-radius:8px;background:rgba(22,27,34,.7);cursor:pointer}
.admin-tab:hover{color:var(--amber);border-color:var(--amber)}
.admin-tab.is-on{color:#0d1117;background:var(--amber);border-color:var(--amber);font-weight:600}
/* badges de evento de auditoria */
.ev{font-family:var(--mono);font-size:10px;padding:2px 7px;border-radius:5px;border:1px solid var(--border);white-space:nowrap}
.ev-ok{color:var(--green);border-color:rgba(34,197,94,.4)}
.ev-err{color:var(--red);border-color:rgba(239,68,68,.4)}
.ev-warn{color:var(--amber);border-color:rgba(240,165,0,.4)}
.ev-info{color:#58a6ff;border-color:rgba(88,166,255,.4)}
.ev-muted{color:var(--muted)}
/* níveis de risco (Fase 11C) */
.risco{font-family:var(--mono);font-size:10px;padding:2px 7px;border-radius:5px;border:1px solid var(--border);white-space:nowrap}
.risco-normal{color:var(--green);border-color:rgba(34,197,94,.4)}
.risco-atencao{color:var(--amber);border-color:rgba(240,165,0,.45)}
.risco-suspeito{color:#ff8c42;border-color:rgba(255,140,66,.5)}
.risco-critico{color:var(--red);border-color:rgba(239,68,68,.5);background:rgba(239,68,68,.08)}
/* situação de licença / vigência (Fase 11D) — verde/amarelo/vermelho/cinza */
.lic{font-family:var(--mono);font-size:10px;padding:2px 7px;border-radius:5px;border:1px solid var(--border);white-space:nowrap}
.lic-vigente{color:var(--green);border-color:rgba(34,197,94,.45)}
.lic-proxima{color:var(--amber);border-color:rgba(240,165,0,.5);background:rgba(240,165,0,.08)}
.lic-expirada{color:var(--red);border-color:rgba(239,68,68,.5);background:rgba(239,68,68,.08)}
.lic-suspensa{color:var(--muted);border-color:var(--border);background:rgba(139,148,158,.10)}
/* destaque de linhas suspeitas na auditoria */
.admin-tabela tr.aud-conflito td{background:rgba(239,68,68,.10)}
.admin-tabela tr.aud-substituida td{background:rgba(240,165,0,.10)}
.admin-tabela tr.aud-bloqueio td{background:rgba(239,68,68,.16)}
.aud-tag{font-family:var(--mono);font-size:9px;padding:1px 5px;border-radius:4px;margin-left:5px;border:1px solid var(--border);color:var(--muted)}
.aud-tag.alerta{color:var(--amber);border-color:rgba(240,165,0,.45)}

/* ---------- Responsivo (tablet + celular): tabelas do admin viram cards ----------
   Elimina o scroll horizontal — cada linha vira um card "rótulo: valor". */
@media(max-width:1024px){
  .admin-tabela-wrap{overflow-x:visible;border:none;background:none}
  .admin-tabela{min-width:0}
  .admin-tabela thead{display:none}
  .admin-tabela tr{display:block;background:var(--surface);border:1px solid var(--border);border-radius:10px;margin-bottom:10px;padding:5px 14px}
  .admin-tabela td{display:flex;align-items:baseline;justify-content:space-between;gap:14px;border:none;padding:8px 0;text-align:right;word-break:break-word}
  .admin-tabela td+td{border-top:1px solid rgba(48,54,61,.5)}
  .admin-tabela td::before{content:attr(data-label);flex:0 0 40%;text-align:left;color:var(--muted);font-family:var(--mono);font-size:9.5px;letter-spacing:.05em;text-transform:uppercase}
  .admin-tabela td.admin-num{text-align:right}
  .admin-tabela td.admin-row-acoes{justify-content:flex-end;flex-wrap:wrap;gap:8px}
  .admin-tabela td[colspan]{display:block;text-align:center}
  .admin-tabela td[colspan]::before{content:none}
  .admin-email{text-align:right}
}

@media(max-width:540px){
  .auth-card{padding:22px 18px}
  .admin-wrap{padding:16px 12px 40px}
  /* hub autenticado: cabeçalho empilha sem quebrar */
  .hub-top{flex-wrap:wrap;gap:8px;padding:12px 16px}
  #user-area{align-items:flex-end;margin-left:auto}
}