/* ============================
   Mobile: top actions (Reset/Search)
   ============================ */
@media (max-width: 980px){
  /* on repasse en 2 colonnes juste pour la rangée des boutons */
  .rs-shell{
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto 1fr;
    gap: 10px;
  }

  /* rails en haut */
  .rs-rail{
    position: sticky;
    top: 0;
    z-index: 200;
    padding: 8px 6px;
  }

  .rs-rail-left{
    grid-column: 1;
    grid-row: 1;
    justify-content: flex-start;
  }

  .rs-rail-right{
    grid-column: 2;
    grid-row: 1;
    justify-content: flex-end;
  }

  .replay-search-page
  {
   padding:0;
  }

  .container
  {
  padding:2%;
  }

  .rs-embed-slot
  {
  width:100%;
  }

  /* centre (form + résultats) sous la rangée des boutons */
  .rs-center{
    grid-column: 1 / span 2;
    grid-row: 2;
  }

  /* IMPORTANT: on neutralise les marges qui cassent tout sur mobile */
  .btn-glow-green,
  .btn-glow-red{
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* ============================
   Mobile: results take full width
   ============================ */
@media (max-width: 900px){
  .rs-results{
    padding: 8px 6px; /* moins de padding pour gagner de la place */
  }

  .rs-list.rs-list-cards{
    width: 99%;
    margin: 0 auto;
  }

  .rs-item-v2{
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding:1%;
  }

  .rs-head.rs-head-v2{
    width: 100%;
    box-sizing: border-box;
  }
}

/* ============================
   Mobile: players same row, teams below centered
   ============================ */
@media (max-width: 900px){
  .rs-teams-3col{
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto auto;
    column-gap: 10px;
    row-gap: 10px;
    align-items: center;
  }

  /* players row */
  .rs-teams-3col .rs-left{
    grid-column: 1;
    grid-row: 1;
    justify-self: start;
  }
  .rs-teams-3col .rs-right{
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
  }

  /* teams rows span both columns */
  .rs-teams-3col .rs-tcell:nth-of-type(1){
    grid-column: 1 / span 2;
    grid-row: 2;
    justify-self: stretch;
  }
  .rs-teams-3col .rs-tcell:nth-of-type(2){
    grid-column: 1 / span 2;
    grid-row: 3;
    justify-self: stretch;
  }

  /* team icons centered */
  .rs-teams-3col .rs-teamicons-center{
    justify-content: center !important;
  }

  /* blanks always hidden (safety) */
  .rs-teams-3col .rs-blank{ display:none !important; }

  /* --- Teams: keep 6 icons on one centered row (desktop/tablet) --- */
.rs-teams-3col .rs-tcell{
  display: flex;
  justify-content: center;
}

/* 1 ligne centrée */
.rs-teams-3col .rs-teamicons-center{
  flex-wrap: nowrap;
  justify-content: center;
  width: 100%;
}

/* Si ça déborde, on autorise un petit scroll horizontal plutôt que casser la ligne */
.rs-teams-3col .rs-teamicons-center{
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
}
.rs-teams-3col .rs-teamicons-center::-webkit-scrollbar{
  height: 6px;
}

/* --- Meta: tournament on its own line, then round/date/views on one line --- */
.rs-meta-row{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

/* 1) Le nom du tournoi prend toute la ligne */
.rs-meta-row .tournament_name{
  flex: 0 0 100%;
  text-align: center;
  display: block;
}

/* 2) Round + date + views restent sur la même ligne (si possible) */
.rs-meta-row .round_name,
.rs-meta-row .upload_mmyyyy,
.rs-meta-row .views_count{
  white-space: nowrap;
}

/* 3) Fix le tier badge qui était en "full width + margin-left:44%" */
.rs-meta-row .tier_badge{
  width: auto !important;
  margin-left: 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}



}

/* ============================
   Mobile: players on same row, teams below centered
   ============================ */
@media (max-width: 900px){

  /* 2 colonnes pour les joueurs, puis teams en dessous */
  .rs-teams-3col{
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: auto auto auto !important;
    column-gap: 10px;
    row-gap: 10px;
    align-items: center;
    width: 100%;
  }

  /* joueurs */
  .rs-teams-3col .rs-left{
    grid-column: 1;
    grid-row: 1;
    justify-self: start;
  }
  .rs-teams-3col .rs-right{
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
  }

  /* teams sous les joueurs */
  .rs-teams-3col .rs-tcell:nth-of-type(1){
    grid-column: 1 / span 2;
    grid-row: 2;
    width: 100%;
    display: flex;
    justify-content: center;
  }
  .rs-teams-3col .rs-tcell:nth-of-type(2){
    grid-column: 1 / span 2;
    grid-row: 3;
    width: 100%;
    display: flex;
    justify-content: center;
  }

  /* pas de blanks */
  .rs-teams-3col .rs-blank{ display:none !important; }

  /* IMPORTANT: centre la rangée d'icônes (et empêche le débordement sur le joueur2) */
  .rs-teams-3col .rs-teamicons-center{
    width: max-content;          /* le contenu prend sa largeur naturelle */
    max-width: 100%;
    margin: 0 auto;              /* centré dans la ligne */
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;           /* 1 ligne */
    gap: 6px;
    overflow-x: auto;            /* si trop serré, scroll plutôt que casser */
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
  }

  /* un petit "confort" pour éviter le shrink bizarre des images */
  .rs-teams-3col .rs-monico{
    flex: 0 0 auto;
  }

  /* players align */
  .rs-teams-3col .rs-player-left{ justify-content:flex-start; }
  .rs-teams-3col .rs-player-right{ justify-content:flex-end; text-align:right; }
}


@media (max-width: 900px){

  /* grille mobile: 2 colonnes pour la rangée joueurs */
  .rs-teams-3col{
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    column-gap: 10px;
    row-gap: 10px;
    align-items: center;
    width: 100%;
  }

  /* joueurs sur la même ligne (row 1) */
  .rs-teams-3col .rs-left{
    grid-column: 1;
    grid-row: 1;
    justify-self: start;
  }
  .rs-teams-3col .rs-right{
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
  }

  /* IMPORTANT: les deux rs-tcell prennent TOUJOURS toute la largeur, sans cibler 1/2 */
  .rs-teams-3col > .rs-tcell{
    grid-column: 1 / -1;     /* span full width */
    justify-self: stretch;
    width: 100%;

    display: flex;
    justify-content: center;
  }

  /* les blanks ne prennent plus de place */
  .rs-teams-3col > .rs-blank{
    display: none !important;
  }

  /* centre les icônes */
  .rs-teams-3col .rs-teamicons-center{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 6px;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .rs-teams-3col .rs-monico{
    flex: 0 0 auto;
  }

    .tr-replay-list
  {
    font-size:1.1rem;
  }

  .rs-player-name
  {
  font-size:1rem;
  }
}