/* =============================================================================
   Área admin — estilos sobre o design system do site (tokens do /links).
   Carregado depois do Bootstrap para sobrescrever.
   ============================================================================= */
:root{
  --brand:#212529;
  --brand-hover:#1a1e21;
  --link:#0d6efd;
  --verified:#0095f6;
  --ink:#16181b;
  --muted:#6b7075;
  --muted-soft:#9a9ea3;
  --line:rgba(16,18,20,.10);
  --page-bg:#e8eaed;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{ -webkit-tap-highlight-color:transparent; }
body{
  font-family:var(--sans);
  color:var(--ink);
  background:var(--page-bg);
  -webkit-font-smoothing:antialiased;
}
/* Evita flash de conteúdo antes do guard resolver */
body[hidden]{ display:none !important; }
a{ color:var(--link); text-decoration:none; }
a:hover{ text-decoration:underline; }

.brand{ font-weight:700; font-size:1.05rem; letter-spacing:-.01em; color:var(--ink); }
.muted{ color:var(--muted); }
.muted-soft{ color:var(--muted-soft); }

/* Botão primário = igual ao .btn-header do site */
.btn-brand{
  background:var(--brand); color:#fff; border:1px solid transparent;
  border-radius:.55rem; font-weight:600; padding:.6rem 1rem;
  transition:background .15s ease, filter .15s ease;
}
.btn-brand:hover{ background:var(--brand-hover); color:#fff; }
.btn-brand:disabled{ opacity:.6; }

/* ---------------------------------------------------------- Cartão auth ----- */
.auth-wrap{ min-height:100dvh; display:flex; align-items:center; justify-content:center;
  padding:clamp(1rem,4vw,2.5rem); }
.auth-card{
  width:100%; max-width:420px; background:#fff; border-radius:18px;
  box-shadow:0 10px 30px rgba(16,18,20,.08); padding:clamp(1.5rem,5vw,2.5rem);
}
.auth-card h1{ font-size:1.4rem; letter-spacing:-.02em; margin:.15rem 0 .35rem; }
.auth-card .sub{ font-size:.9rem; color:var(--muted); margin-bottom:1.3rem; }
.auth-card .form-label{ font-size:.82rem; font-weight:600; }
.auth-card .foot-links{ font-size:.85rem; margin-top:1rem; }
.form-msg{ font-size:.85rem; min-height:1.1rem; }
.form-msg.err{ color:#dc3545; }
.form-msg.ok{ color:#198754; }

/* Olho de mostrar/ocultar senha */
.pw-wrap{ position:relative; }
.pw-wrap > input{ padding-right:2.7rem; }
.pw-eye{ position:absolute; top:50%; right:.55rem; transform:translateY(-50%);
  background:none; border:none; color:var(--muted); padding:.15rem; line-height:0;
  cursor:pointer; display:flex; }
.pw-eye:hover{ color:var(--ink); }

/* QR do MFA */
.qr-box{ background:#fff; border:1px solid var(--line); border-radius:12px; padding:1rem;
  display:inline-block; }
.qr-box svg, .qr-box img{ width:200px; height:200px; display:block; }
.mfa-secret{ font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.85rem; background:#f4f5f7; border-radius:.5rem; padding:.5rem .7rem;
  word-break:break-all; }
.code-input{ letter-spacing:.5em; text-align:center; font-size:1.3rem; font-weight:600; }

/* ------------------------------------------------------- Layout painel ------ */
.admin-topbar{ background:#fff; border-bottom:1px solid var(--line); }
.admin-topbar .brand{ font-size:1rem; }
.admin-wrap{ max-width:1180px; margin:0 auto; padding:clamp(1rem,3vw,2rem); }
.hub-card{
  display:block; background:#fff; border:1px solid var(--line); border-radius:16px;
  padding:1.5rem; box-shadow:0 6px 18px rgba(16,18,20,.06); color:var(--ink);
  transition:transform .12s ease, box-shadow .12s ease;
}
.hub-card:hover{ transform:translateY(-2px); box-shadow:0 12px 26px rgba(16,18,20,.12);
  text-decoration:none; color:var(--ink); }
.hub-card .ico{ width:44px; height:44px; border-radius:12px; background:#f2f4f7;
  display:inline-flex; align-items:center; justify-content:center; font-size:1.2rem; color:var(--brand); }
.hub-card h2{ font-size:1.05rem; margin:.7rem 0 .2rem; }
.hub-card p{ font-size:.85rem; color:var(--muted); margin:0; }

/* ---------------------------------------------------------- Tabelas ---------- */
.panel{ background:#fff; border:1px solid var(--line); border-radius:16px;
  box-shadow:0 6px 18px rgba(16,18,20,.06); overflow:hidden; }
.filters{ padding:1rem; border-bottom:1px solid var(--line); }
.filters .form-control, .filters .form-select{ font-size:.9rem; }
.table-scroll{ overflow-x:auto; }
table.data{ width:100%; font-size:.88rem; border-collapse:separate; border-spacing:0; }
table.data thead th{
  position:sticky; top:0; background:#f7f8fa; color:var(--muted); font-weight:600;
  font-size:.72rem; text-transform:uppercase; letter-spacing:.04em;
  padding:.6rem .8rem; text-align:left; white-space:nowrap; border-bottom:1px solid var(--line);
}
table.data tbody td{ padding:.65rem .8rem; border-bottom:1px solid #eef0f2; vertical-align:top; }
table.data tbody tr:hover{ background:#fafbfc; }
table.data td.nowrap, table.data th.nowrap{ white-space:nowrap; }
.cell-strong{ font-weight:600; color:var(--ink); }
.cell-sub{ font-size:.78rem; color:var(--muted); }
.cell-clip{ max-width:22rem; overflow:hidden; text-overflow:ellipsis; }
.wa-link{ color:var(--ink); text-decoration:none; white-space:nowrap; }
.wa-link:hover{ text-decoration:underline; }
.wa-link i{ color:#25D366; margin-left:.25rem; }
.badge-status{ font-size:.72rem; font-weight:600; padding:.25rem .55rem; border-radius:999px; }
.st-new{ background:#e7f1ff; color:#0d6efd; }
.st-read{ background:#eceef1; color:#4b5158; }
.st-replied{ background:#e6f4ea; color:#198754; }
.st-archived{ background:#e9e9ea; color:#6b7075; }
.table-foot{ padding:.8rem 1rem; border-top:1px solid var(--line); display:flex;
  align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; font-size:.85rem; }
.empty-state{ padding:3rem 1rem; text-align:center; color:var(--muted); }
.spin{ display:inline-block; }