/* ============================================================
   Luz da Sorte — Ferramentas (Gerador/Desdobramento/Testador/etc)
   Reaproveita as variáveis de cor/raio/sombra do site.css principal
   e as classes fm-*/fw-* já usadas nos simuladores e no fechamento.
   ============================================================ */

.ferr-tabs{
  display:flex;gap:8px;flex-wrap:wrap;margin:28px 0 30px;
  border-bottom:1px solid var(--line);padding-bottom:14px;
}
.ferr-tab-btn{
  font-family:'Inter',sans-serif;font-size:13.5px;font-weight:700;
  padding:9px 16px;border-radius:999px;border:1px solid var(--line);
  background:var(--panel);color:var(--text-soft);cursor:pointer;transition:.15s ease;
}
.ferr-tab-btn:hover{border-color:var(--gold)}
.ferr-tab-btn.ativa{background:var(--navy);border-color:var(--navy);color:#fff}

.ferr-painel{display:none}
.ferr-painel.ativa{display:block}
.ferr-painel h2{font-family:'Poppins','Inter',sans-serif;font-size:22px;margin:0 0 10px}

.ferr-subtabs{display:flex;gap:8px;margin-bottom:16px}
.ferr-subtab-btn{
  font-size:13px;font-weight:700;padding:7px 14px;border-radius:10px;
  border:1px solid var(--line);background:var(--panel-soft);color:var(--text-soft);cursor:pointer;
}
.ferr-subtab-btn.ativa{background:var(--gold);border-color:var(--gold);color:var(--navy)}
.ferr-sub{display:none}
.ferr-sub.ativa{display:block}

.ferr-linha{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap;margin:12px 0}
.ferr-linha label,
.ferr-grid-filtros label{
  display:flex;flex-direction:column;gap:5px;font-size:12.5px;color:var(--text-soft);font-weight:600;
}
.ferr-linha input, .ferr-linha select,
.ferr-grid-filtros input, .ferr-grid-filtros select{
  padding:9px 10px;border:1px solid var(--line);border-radius:10px;
  font-size:14px;font-family:'Inter',sans-serif;background:var(--panel);color:var(--text);min-width:140px;
}

.ferr-grid-filtros{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin:14px 0 18px;
}

.ferr-textarea{
  width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:var(--radius-md);
  font-family:'Inter',sans-serif;font-size:14px;color:var(--text);background:var(--panel);
  resize:vertical;margin-bottom:12px;
}

.ferr-saida{margin-top:20px}

.ferr-raiox-card{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-md);
  padding:16px;margin-bottom:16px;box-shadow:var(--shadow-xs);
}
.ferr-raiox-jogo{
  font-family:'Poppins','Inter',sans-serif;font-weight:700;font-size:16px;
  color:var(--navy);margin-bottom:10px;letter-spacing:.02em;
}

/* ---------- Blocos de coluna (Super Sete) / partida (Loteca) ---------- */
.ferr-colunas, .ferr-loteca-partidas{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;
}
.ferr-coluna-bloco{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-md);
  padding:12px;box-shadow:var(--shadow-xs);
}
.ferr-coluna-tit{font-size:12px;font-weight:700;color:var(--text-soft);margin-bottom:8px;text-align:center}
.ferr-coluna-digitos{display:grid;grid-template-columns:repeat(5,1fr);gap:4px}
.ferr-digito{
  aspect-ratio:1;border:1px solid var(--line);border-radius:8px;background:var(--panel-soft);
  color:var(--text-soft);font-family:'Inter',sans-serif;font-weight:700;font-size:12.5px;cursor:pointer;
}
.ferr-digito:hover{border-color:var(--gold)}
.ferr-digito.ativo{background:var(--gold);border-color:var(--gold);color:var(--navy)}
.ferr-digito-loteca{aspect-ratio:auto;padding:10px 0;font-size:14px}
.ferr-loteca-partidas .ferr-coluna-digitos{grid-template-columns:repeat(3,1fr)}

/* ---------- Lista de jogos adicionados (Raio-X/Testador/Otimizador) ---------- */
.ferr-jogos-lista{display:flex;flex-direction:column;gap:6px;margin-top:12px}
.ferr-jogo-chip{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  background:var(--panel-soft);border:1px solid var(--line);border-radius:10px;
  padding:8px 12px;font-family:'Inter',sans-serif;font-size:13.5px;font-weight:600;color:var(--text);
}
.ferr-jogo-remove{
  background:none;border:1px solid var(--line);border-radius:8px;color:var(--red);
  font-size:12px;font-weight:700;cursor:pointer;padding:3px 8px;flex:none;
}
.ferr-jogo-remove:hover{background:var(--red-soft)}

/* ---------- Opções do simulador de orçamento ---------- */
.ferr-opcoes-orc{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-top:10px}
.ferr-opcao-orc{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-md);
  padding:16px;box-shadow:var(--shadow-xs);
}
.ferr-opcao-orc b{display:block;font-family:'Poppins','Inter',sans-serif;font-size:15px;color:var(--navy);margin-bottom:6px}
.ferr-opcao-orc span{font-size:13px;color:var(--text-soft);line-height:1.4}
.ferr-opcao-orc-aviso{border-color:var(--gold);background:#FFF9EC}

/* ---------- Chamada pra Bolões (fim de cada página de ferramenta) ---------- */
.ferr-cta-bolao{
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  background:var(--navy);color:#fff;border-radius:var(--radius-lg);padding:22px 24px;
  margin:44px 0 20px;box-shadow:var(--shadow-md);
}
.ferr-cta-bolao span{font-size:15px;font-weight:600;max-width:60ch}
.ferr-cta-bolao .fm-btn-cta{flex:none}

@media (max-width:640px){
  .ferr-tabs{gap:6px}
  .ferr-tab-btn{font-size:12.5px;padding:8px 12px}
  .ferr-linha{flex-direction:column;align-items:stretch}
  .ferr-linha input, .ferr-linha select{width:100%}
}

/* ============================================================
   Classes que o JS dos geradores usa (renderListaJogos, placares,
   avisos) e que só existiam no fechamento.css — replicadas aqui
   pra funcionar em toda página que carrega ferramentas.css.
   ============================================================ */
.fw-contador{
  font-size:12.5px;font-weight:700;color:var(--navy);background:var(--panel-soft);
  border:1px solid var(--line);border-radius:999px;padding:5px 12px;
}
.fw-resultado{margin-top:16px}
.fw-aviso{
  font-size:13.5px;color:var(--muted);background:var(--panel-soft);
  border-radius:var(--radius-sm);padding:12px 14px;margin:0;
}
.fw-aviso-grande{
  font-size:13.5px;color:#8A5A00;background:#FFF4D6;border:1px solid var(--gold);
  border-radius:var(--radius-sm);padding:12px 14px;margin:12px 0 0;
}
.fw-placar{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius-md);overflow:hidden}
.fw-placar > div{background:var(--panel);padding:16px}
.fw-k{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);display:block;margin-bottom:6px}
.fw-v{font-family:'Poppins',sans-serif;font-weight:700;font-size:clamp(22px,4.4vw,30px);line-height:1;display:block;color:var(--navy)}
.fw-v-gold{color:#B8860B}
@media(max-width:480px){.fw-placar{grid-template-columns:1fr}}

.fw-lista-wrap{margin-top:18px}
.fw-lista-tit{font-family:'Poppins',sans-serif;font-size:16px;margin:0 0 10px}
.fw-lista-acoes{display:flex;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.fw-btn-baixar{padding:9px 18px;font-size:13.5px}
.fw-lista-grade{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;
  max-height:480px;overflow-y:auto;padding:4px 4px 4px 0;
}
.fw-jogo{
  display:flex;align-items:center;gap:10px;background:var(--panel-soft);
  border:1px solid var(--line);border-radius:10px;padding:8px 12px;
}
.fw-jogo-n{
  font-family:'Poppins',sans-serif;font-weight:700;font-size:11px;color:#fff;
  background:var(--navy);border-radius:6px;padding:2px 6px;flex:none;min-width:20px;text-align:center;
}
.fw-jogo-dz{font-family:'Inter',sans-serif;font-weight:600;font-size:13.5px;letter-spacing:.02em;color:var(--text)}