/* Table styling */
table {
  width: 100%;
  border-collapse: separate; /* Allows for border radius */
  border-spacing: 0; /* Removes gaps between cells */
  border-radius: 12px; /* Adjust for the desired rounding */
  overflow: hidden; /* Ensures content respects rounded corners */
}

/* Optional styling for individual cells */
th,
td {
  padding: 10px;
  border: 1px solid #ddd;
}

/* Rounded corners for the first and last rows */
thead tr:first-child th:first-child {
  border-top-left-radius: 12px;
}
thead tr:first-child th:last-child {
  border-top-right-radius: 12px;
}
tbody tr:last-child td:first-child {
  border-bottom-left-radius: 12px;
}
tbody tr:last-child td:last-child {
  border-bottom-right-radius: 12px;
}
.modal-content {
  justify-content: center;
  align-content: center;
  align-items: center;
  max-height: 90vh;
}

/* Scores Modal */
#scores-header {
  color: #febe38;
  background-color: #5f5687;
  font-family: "Chango", sans-serif;
  font-weight: 400;
  font-size: 200%;
  width: 100%;
}

#scores {
  font-family: "Chango", sans-serif;
  font-weight: 400;
  font-style: normal;
  background-color: #352870;
  color: white;
  font-size: 80%;
  margin: 5px;
  padding: 0px;
  border-radius: 12px;
  overflow-x: hidden;
  overflow-y: scroll;
  border: solid #eb5497 3px;
}

#scores table {
  border-collapse: collapse;
}

#scores tr,
#scores td,
#scores th {
  border: none;
}

#scores-head {
  text-align: center;
}

.big {
  font-size: 170%;
}
.dark {
  background: #282865;
}

#scores .pos {
  font-size: 200%;
  font-weight: 700;
  font-style: normal;
  font-family: "Barriecito", system-ui;
  color: #f5ce45;
  border: none;
}

.player-container {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.player {
  display: inline-block;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  text-overflow: ellipsis; 
  white-space: nowrap; 
  overflow: hidden;
  max-width: 110px;
}

.final-score,
.number-of-words {
  text-align: center;
  font-size: 160%;
  font-weight: 100;
}

.one-shot-time{
    text-align: center;
}

.modal-header{
    display:flex;
    flex-direction: column;
    justify-content: center;
}

#total-points, #total-points-label{
  
}

@media screen and (max-width:578px){
    #scores{
        font-size:70%;  
    }
}