@charset "utf-8";
/* ***********************************************************************
 *
 *  File:   tables.css
 *
 *  Brief:  Styles for football league standings tables with zone highlighting.
 *
 *  Author: Jomar Hønsi, 2026
 *
 * ************************************************************************/

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

/* Header */
div.header-container {
  margin: 15px;

  & span {
    font-size: 18px;
    font-weight: bold;
    padding: 5px 30px;
  }

  #league-select {
    margin-bottom: 10px;
    padding: 4px 8px;
    font-size: 1em;
  }

  & div#loader {
    margin-left: 30px;
    border: 5px solid #075519;
    border-top: 5px solid #e7ddda;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    animation: spin 2s linear infinite;
    display: inline-block;
    vertical-align: middle;
    visibility: visible;
  }
}

/* Current Table */
table#current-table {
  width: 70%;
  margin: 0 auto;
  margin-bottom: 20px;
  background-color: #999;
  font-size: 0.9em;

  & th:nth-child(2),
  & td:nth-child(2) {
    text-align: left;
  }

  & td {
    background-color: #fff;
    padding: 5px 8px;
  }

  & tr.promoted td {
    background-color: #cbe2cb;
  }

  & tr.first-place td {
    background-color: #cbe2cb;
    font-weight: bold;
  }

  & tr.playoff-1 td {
    background-color: #fffacc;
  }

  & tr.playoff-2 td {
    background-color: #f7f1e4;
  }

  & tr.relegation-playoff td {
    background-color: #ffebcc;
  }

  & tr.relegated td {
    background-color: #ecbcbc;
  }
}

@media (max-width: 700px) {
  table#current-table {
    width: 100%;
  }
}