/* ═══════════════════════════════════════════════════════════════════
   ROTTU · THEME v1.0 (B0 · 10/08/2026) — TOKENS OFICIAIS
   Fonte da verdade de cor/tipo/superfície de TODAS as páginas.
   Regra: nenhuma página declara hex próprio — só var(--token).
   Guia completo: GUIA_UX_ROTTU.md (project).
   Carga: <link rel="stylesheet" href="rottu-theme.css"> ANTES do CSS
   local da página (permite override consciente, nunca silencioso).
   ═══════════════════════════════════════════════════════════════════ */
:root{
  /* ── marca (Brandbook — imutáveis) ── */
  --verde-brasil:#05382A;
  --verde-aprovado:#22FF78;
  --verde-validado:#49B76F;
  --branco:#FFFFFF;
  --cinza-fundo:#F9F9F9;
  --preto:#000000;
  --verde-hover:#0E4A26;
  --verde-titulo:#021A12;

  /* ── semânticas (Guia §1 — substituem os hexes ad-hoc) ── */
  --erro:#C0392B;         --erro-fundo:#FBEAE8;
  --aviso:#B3701E;        --aviso-fundo:#FFF6E5;
  --sucesso:#49B76F;      --sucesso-fundo:#E9F6EE;
  --info:#2C6E8F;         --info-fundo:#EAF3F8;

  /* ── texto ── */
  --texto:#1F3D30;
  --texto-2:#5F6D65;
  --texto-3:#9AA39E;
  --texto-claro:rgba(255,255,255,.9);
  --texto-claro-2:rgba(255,255,255,.72);

  /* ── superfícies ── */
  --borda:#E7EAE8;
  --borda-2:#DDE3E0;
  --zebra:#FAFBFA;
  --sombra:0 6px 24px rgba(5,56,42,.10);
  --sombra-up:0 14px 38px rgba(5,56,42,.16);
  --glow:0 0 0 3px rgba(34,255,120,.25);

  /* ── geometria & motion (padrão validador) ── */
  --radius:14px;  --radius-s:10px;  --radius-pill:999px;
  --t-micro:.13s ease;      /* botões, chips, hovers  */
  --t-entrada:.28s ease;    /* fades/slides de conteúdo */
  --fonte-titulo:Garet,Inter,system-ui,sans-serif;
  --fonte-corpo:Inter,system-ui,-apple-system,sans-serif;
  --fonte-mono:'Roboto Mono',ui-monospace,monospace;
}

/* ── UTILITÁRIAS SEMÂNTICAS (uso direto no HTML) ── */
.t-erro{color:var(--erro)} .t-aviso{color:var(--aviso)}
.t-ok{color:var(--sucesso)} .t-info{color:var(--info)}
.t-2{color:var(--texto-2)} .t-3{color:var(--texto-3)}

.badge{display:inline-flex;align-items:center;gap:6px;font:600 12px/1 var(--fonte-corpo);
  padding:5px 10px;border-radius:var(--radius-pill);border:1px solid transparent}
.badge--ok{color:var(--sucesso);background:var(--sucesso-fundo);border-color:rgba(73,183,111,.35)}
.badge--erro{color:var(--erro);background:var(--erro-fundo);border-color:rgba(192,57,43,.3)}
.badge--aviso{color:var(--aviso);background:var(--aviso-fundo);border-color:rgba(179,112,30,.35)}
.badge--info{color:var(--info);background:var(--info-fundo);border-color:rgba(44,110,143,.3)}

.banner-atencao{padding:10px 14px;border:1px solid rgba(179,112,30,.4);
  background:var(--aviso-fundo);border-radius:var(--radius-s);
  font:400 12.5px/1.55 var(--fonte-corpo);color:#5F4B12}

/* ── TABELA INTERNA CANÔNICA (painel/admins) ── */
.tbl-interna{width:100%;border-collapse:collapse;font:400 12.5px/1.5 var(--fonte-corpo);color:var(--texto)}
.tbl-interna th{background:var(--verde-brasil);color:#fff;font:600 10.5px/1.2 var(--fonte-mono);
  text-transform:uppercase;letter-spacing:.06em;padding:9px 10px;text-align:left;position:sticky;top:0}
.tbl-interna td{padding:8px 10px;border-bottom:1px solid var(--borda)}
.tbl-interna tr:nth-child(even) td{background:var(--zebra)}
.tbl-interna tr:hover td{background:var(--sucesso-fundo);transition:background var(--t-micro)}

/* ── micro-fluidez universal (a receita do validador) ── */
button,.btn,a.btn,input,select,textarea{transition:all var(--t-micro)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--verde-validado)!important;box-shadow:var(--glow)}

/* ── entrada suave de conteúdo (aplicar .entra em blocos que surgem) ── */
@keyframes rt-entra{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.entra{animation:rt-entra var(--t-entrada)}
@media (prefers-reduced-motion:reduce){.entra{animation:none}}

/* ── skeleton (espera elegante universal) ── */
.skel{background:linear-gradient(90deg,#EEF1EF 25%,#F7FAF8 50%,#EEF1EF 75%);
  background-size:200% 100%;animation:rt-shimmer 1.4s infinite;border-radius:8px}
@keyframes rt-shimmer{to{background-position:-200% 0}}
