/* ============================================================
   TEMA — HiperBet
   Painel branco; a identidade da casa vive na logo animada.
   ============================================================ */
:root{
  --marca:#145AB3;          /* azul HiperBet */
  --marca-forte:#145AB3;    /* 6.68:1 sobre branco */
  --marca-hover:#0E4489;    /* 9.52:1 */
  --marca-suave:rgba(20,90,179,.10);
  --marca-contraste:#ffffff;

  --logo-a:#EC1C24;         /* vermelho HiperBet */
  --logo-b:#172079;         /* navy HiperBet */

  --sombra-marca:0 8px 16px 0 rgba(20,90,179,.24);
}

/* ---------- marca HiperBet ----------
   No painel antigo "Hiper" era branco porque o fundo era escuro.
   Em fundo branco isso ficaria invisível: passa a usar o navy da casa. */
.marca-hiper{
  font-weight:900;font-style:italic;letter-spacing:-.6px;
  font-size:24px;line-height:1;color:var(--texto);
  display:inline-block;
}
.marca-hiper .hiper{color:#172079}   /* navy HiperBet */
.marca-hiper .bet{color:#EC1C24}     /* vermelho HiperBet */
.marca-hiper .sufixo{font-style:normal;font-size:10px}
.caixa-login .marca-hiper{font-size:34px;text-align:center;display:block;margin-bottom:14px}

/* ---- semáforo do custo por FTD ----
   verde = dentro da meta; vermelho = acima. Só pinta quando há gasto lançado. */
.cartao.metrica.bom  { border-color: rgba(34,197,94,.55); }
.cartao.metrica.bom  .valor { color: #22c55e; }
.cartao.metrica.ruim { border-color: rgba(236,28,36,.55); }
.cartao.metrica.ruim .valor { color: #ff5964; }