/*
  SUA LINDA — Placar de Acertos RC7
  Objetivo: fazer a área privada seguir exatamente o shell e o sistema de botões
  já utilizados na Fase Regular, sem alterar regras, endpoints ou lógica do placar.
*/

/* O cabeçalho antigo nunca deve permanecer visível quando o shell privado é criado. */
body.sl-scoreboard.sl-app > .navbar-fixed,
body.sl-scoreboard.sl-app > .navbar-fixed.sl-legacy-header{
  display:none !important;
}

/* O conteúdo usa o mesmo eixo e largura visual da Fase Regular. */
body.sl-scoreboard.sl-app .container{
  width:min(1680px,calc(100% - 44px)) !important;
  max-width:none !important;
  margin:0 auto !important;
  padding:28px 0 54px !important;
}

/* Ações do placar: exatamente o mesmo sistema base .sl-btn das áreas privadas. */
body.sl-scoreboard .controls{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:10px !important;
  margin:0 !important;
  flex-wrap:wrap !important;
}

body.sl-scoreboard .controls .sl-scoreboard-action{
  min-height:46px !important;
  padding:11px 18px !important;
  border-radius:11px !important;
  font-family:var(--sl-font-body) !important;
  font-size:14px !important;
  line-height:1.2 !important;
  font-weight:850 !important;
  white-space:nowrap !important;
  cursor:pointer !important;
}

/* Atualizar = ação principal privada (verde), igual à Fase Regular. */
body.sl-scoreboard #atualizar.sl-btn.primary{
  background:linear-gradient(135deg,var(--sl-green),var(--sl-green-2)) !important;
  border:1px solid rgba(81,255,190,.48) !important;
  color:#03140d !important;
  box-shadow:0 12px 26px rgba(19,207,135,.14) !important;
}

/* Ver palpites = ação secundária privada, navy, igual ao padrão do portal. */
body.sl-scoreboard #toggleView.sl-btn{
  background:linear-gradient(180deg,#0b2941,#071c2f) !important;
  border:1px solid var(--sl-line-strong) !important;
  color:#edf6fc !important;
  box-shadow:0 8px 20px rgba(0,0,0,.14) !important;
}

body.sl-scoreboard .controls .sl-scoreboard-action:hover{
  transform:translateY(-1px) !important;
  border-color:rgba(91,178,235,.5) !important;
}

body.sl-scoreboard #atualizar.sl-btn.primary:hover{
  border-color:rgba(81,255,190,.7) !important;
}

body.sl-scoreboard .controls .sl-scoreboard-action:focus-visible{
  outline:3px solid rgba(76,181,255,.26) !important;
  outline-offset:2px !important;
}

body.sl-scoreboard .controls .sl-scoreboard-action:disabled{
  opacity:.58 !important;
  cursor:wait !important;
  transform:none !important;
}

/* No mobile não há navegação fixa antiga nem botões apertados. */
@media (max-width:900px){
  body.sl-scoreboard.sl-app{
    padding:60px 0 0 !important;
  }
  body.sl-scoreboard.sl-app > .sl-app-sidebar{
    display:none !important;
  }
  body.sl-scoreboard.sl-app .container{
    width:calc(100% - 20px) !important;
    padding:16px 0 30px !important;
  }
  body.sl-scoreboard .controls{
    justify-content:stretch !important;
    margin-top:16px !important;
  }
  body.sl-scoreboard .controls .sl-scoreboard-action{
    flex:1 1 180px !important;
    width:auto !important;
  }
}

@media (max-width:520px){
  body.sl-scoreboard .controls{
    display:grid !important;
    grid-template-columns:1fr !important;
  }
  body.sl-scoreboard .controls .sl-scoreboard-action{
    width:100% !important;
    min-width:0 !important;
  }
}
