/* ============================================================
   Futebol de Segunda — Estilos customizados
   ============================================================ */
:root {
  --color-primary: #198754;
  --color-primary-dark: #146c43;
}

/* Bloqueia scroll horizontal em qualquer tela */
html, body {
  overflow-x: hidden;
  max-width: 100%;
}

body { font-size: .9375rem; }

/* Garante que o container nunca estoure */
.container { max-width: 100%; }

/* Navbar */
.navbar-brand { letter-spacing: .5px; }

/* Cards de partida */
.partida-card {
  transition: transform .15s ease, box-shadow .15s ease;
  border-radius: 1rem !important;
}
.partida-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 .5rem 1.5rem rgba(0,0,0,.12) !important;
}

/* Vagas progress bar */
.vagas-bar { height: 8px; border-radius: 4px; }

/* Status badges */
.badge { font-size: .78rem; }

/* QR Code container */
.qr-container {
  background: #fff;
  border: 2px solid #dee2e6;
  border-radius: .75rem;
  padding: 1rem;
  text-align: center;
  max-width: 260px;
  margin: 0 auto;
}
.qr-container img { max-width: 220px; }

/* Pix key copy */
.pix-code {
  font-family: monospace;
  font-size: .8rem;
  background: #f8f9fa;
  border: 1px solid #dee2e6;
  border-radius: .5rem;
  padding: .5rem .75rem;
  word-break: break-all;
}

/* Lista de jogadores */
.jogador-row:hover { background-color: #f8f9fa; }

/* Notificação badge no sino */
#notif-badge { font-size: .65rem; }

/* Sidebar admin */
@media (min-width: 768px) {
  .admin-sidebar { min-height: calc(100vh - 56px); }
}

/* Countdown timer */
.countdown { font-variant-numeric: tabular-nums; }

/* Animação de entrada */
.fade-in { animation: fadeIn .3s ease; }
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Toast de notificação */
.toast-container { z-index: 1090; }

/* ============================================================
   MOBILE — sem scroll horizontal
   ============================================================ */

/* Touch target mínimo */
@media (max-width: 576px) {
  .btn { min-height: 44px; }
  .nav-link { padding: .6rem .5rem; }
}

/* Cabeçalhos com múltiplos botões: quebra em vez de estourar */
@media (max-width: 767px) {
  .page-header {
    flex-wrap: wrap;
    gap: .5rem !important;
  }
  .page-header .btn,
  .page-header a.btn {
    font-size: .8rem;
    padding: .3rem .6rem;
    min-height: 36px;
  }
  .page-header h2 {
    font-size: 1.2rem;
    width: 100%;
  }

  /* Tabelas admin: scroll interno (não estoura a página) */
  .table-responsive {
    -webkit-overflow-scrolling: touch;
    border: 0;
  }

  /* Tabela admin vira cards no celular */
  .table-mobile-cards thead { display: none; }
  .table-mobile-cards tbody tr {
    display: block;
    border: 1px solid #dee2e6;
    border-radius: .5rem;
    margin-bottom: .75rem;
    padding: .5rem;
    background: #fff;
  }
  .table-mobile-cards tbody td {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: none;
    padding: .25rem .5rem;
    font-size: .85rem;
  }
  .table-mobile-cards tbody td::before {
    content: attr(data-label);
    font-weight: 600;
    color: #6c757d;
    font-size: .75rem;
    margin-right: .5rem;
    white-space: nowrap;
  }
  .table-mobile-cards tbody td:empty { display: none; }

  /* Formulário de adicionar jogador: empilha no mobile */
  .form-add-jogador .col-md-6,
  .form-add-jogador .col-md-4,
  .form-add-jogador .col-md-2 {
    width: 100%;
  }

  /* Times: 1 coluna no mobile */
  .times-grid .col-md-6,
  .times-grid .col-xl-3 {
    width: 100%;
  }

  /* Seletor de posição (botões grandes) */
  .position-selector .flex-fill { min-width: 120px; }

  /* Estatísticas de posição: 3 colunas em linha */
  .stats-posicao .card { min-width: 0; }

  /* Dropdown de goleiro no mobile */
  .goleiro-row { flex-wrap: wrap; }
  .goleiro-row select { width: 100% !important; margin-top: .5rem; }
}

/* Star rating */
.star-rating input:checked ~ label,
.star-rating label:hover,
.star-rating label:hover ~ label {
  color: #ffc107 !important;
}