@media screen and (max-width: 479px) {
  .concerts__container {
    padding-left: 5px;
    padding-right: 5px;
  }
}
.concerts__table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid var(--border-cl);
  border-radius: 15px;
  overflow: hidden;
  background-color: var(--bg-table-cl);
  color: var(--txt-cl-white);
  text-align: left;
}

.concerts__table caption {
  caption-side: top;
  padding: 12px 15px;
  font-weight: 700;
  font-size: 20px;
  line-height: calc(29 / 20);
  text-align: left;
  background-color: var(--bg-thead-cl);
  color: var(--txt-cl-white);
}

.concerts__table thead th {
  padding: 5px;
  background-color: var(--bg-thead-cl);
  font-weight: 400;
  letter-spacing: 0.5px;
  color: var(--txt-cl-gray);
  font-size: 10px;
  line-height: calc(20 / 10);
  border-bottom: 1px solid var(--border-cl);
}
@media screen and (min-width: 480px) {
  .concerts__table thead th {
    font-size: 12px;
    line-height: calc(22 / 12);
    padding: 10px;
  }
}
.concerts__table th,
.concerts__table td {
  font-size: 10px;
  line-height: calc(20 / 10);
  font-weight: 500;
  color: var(--default-txt-cl);
  padding: 2px;
  border-bottom: 1px solid var(--border-cl);
}
@media screen and (min-width: 480px) {
  .concerts__table th,
  .concerts__table td {
    padding: 10px;
    font-size: 14px;
    line-height: calc(24 / 14);
  }
}
.concerts__table tbody tr:last-child th,
.concerts__table tbody tr:last-child td {
  border-bottom: none;
}
.concerts__table tbody tr {
  transition: all 250ms ease;
}
.concerts__table tbody tr:hover {
  background-color: var(--table-row-accent-cl);
}

.table__btn {
  font-size: 9px;
  line-height: calc(19 / 9);
  font-weight: 500;
  width: 85px;
  padding: 2px;
  transition: all 250ms ease;
}
@media screen and (min-width: 480px) {
  .table__btn {
    font-size: 12px;
    line-height: calc(22 / 12);
    width: 130px;
    padding: 5px 0;
  }
}
