/*
 * SPDX-FileCopyrightText: 2026 fsmhj <fsmhj@mailfence.com>
 *
 * SPDX-License-Identifier: AGPL-3.0-or-later
 */

:root {
  --riichi-scoring-table-mangan-background: #5d345a;
  --riichi-scoring-table-mangan-text-color: #ffffff;
  --riichi-scoring-table-narrow-1-han-fu-cell: #ccdae4;
  --riichi-scoring-table-narrow-2-han-fu-cell: #d1eadd;
  --riichi-scoring-table-narrow-3-han-fu-cell: #f0d5d1;
  --riichi-scoring-table-narrow-4-han-fu-cell: #ebedb5;
}

table {
  & th {
    font-weight: bold;
  }

  &.riichi-scoring-table {
    max-width: 1024px;

    & td {
      text-align: center;
      width: calc(100% / 11);
    }
  }
}

.riichi-scoring-table-container-sm {
  & table.riichi-scoring-table {
    position: relative;

    & thead {
      position: sticky;
      top: 0;

      & tr:first-child {
        /* 1 Han label */
        & th:nth-child(2) {
          background: #2d396c;
          color: #fff
        }

        /* 2 Han label */
        & th:nth-child(3) {
          background: #2c5f2e;
          color: #fff;
        }

        /* 3 Han label */
        & th:nth-child(4) {
          background: #a9372d;
          color: #fff;
        }

        /* 4 Han label */
        & th:nth-child(5) {
          background: #d59334;
          color: #fff;
        }

        /* Non-East label */
        & th:nth-child(6) {
          background: #e0d6ea;
          color: #604c78;
        }

        /* East label */
        & th:nth-child(7) {
          background: #efe0ec;
          color: #633258;
        }
      }

      & tr:nth-child(2) {
        /* Non-East Ron label */
        & th:first-child,
        & th:last-child {
          background: #8c5a84;
          color: #fff;
        }

        /* Tsumo label */
        & th:nth-child(2) {
          background: #403050;
          color: #fff;
        }
      }
    }

    & tbody {
      /* 1 Han 30 Fu row */
      & tr:first-child,
      /* 3 Han 60 Fu, 4 Han 30 Fu */
      & tr:nth-last-child(6) {
        /* 1 Han Fu column */
        & td:nth-child(2) {
          background: var(--riichi-scoring-table-narrow-1-han-fu-cell);
        }

        /* 2 Han Fu column */
        & td:nth-child(3) {
          background: var(--riichi-scoring-table-narrow-2-han-fu-cell);
        }

        /* 3 Han Fu column */
        & td:nth-child(4) {
          background: var(--riichi-scoring-table-narrow-3-han-fu-cell);
        }

        /* 4 Han Fu column */
        & td:nth-child(5) {
          background: var(--riichi-scoring-table-narrow-4-han-fu-cell);
        }
      }

      & tr:not(:nth-last-child(-n + 5)):not(:first-child):not(:nth-last-child(6)) {
        /* 1 Han Fu column */
        & td:nth-child(1) {
          background: var(--riichi-scoring-table-narrow-1-han-fu-cell);
        }

        /* 2 Han Fu column */
        & td:nth-child(2) {
          background: var(--riichi-scoring-table-narrow-2-han-fu-cell);
        }

        /* 3 Han Fu column */
        & td:nth-child(3) {
          background: var(--riichi-scoring-table-narrow-3-han-fu-cell);
        }

        /* 4 Han Fu column */
        & td:nth-child(4) {
          background: var(--riichi-scoring-table-narrow-4-han-fu-cell);
        }
      }

      /* 3 Han 60 Fu, 4 Han 30 Fu */
      & tr:nth-last-child(6) {
        & th:first-child {
          background: var(--riichi-scoring-table-mangan-background);
          color: var(--riichi-scoring-table-mangan-text-color);
        }
      }

      & tr {
        /* East payout columns */
        & td:nth-last-child(-n + 2) {
          background: #dfb4c788;
        }
      }

      /* Mangan row */
      & tr:nth-last-child(5) {
        /* Mangan label */
        & th:first-child {
          background: #5d345a;
          color: #fff;
        }

        /* 3 Han Fu column */
        & td:nth-child(2) {
          background: #e2b1a988;
        }

        /* 4 Han Fu column */
        & td:nth-child(3) {
          background: #dadd7488;
        }
      }

      /* Haneman row */
      & tr:nth-last-child(4) {
        & th:first-child {
          background: #36794c;
          color: #fff;
        }
      }

      /* Baiman row */
      & tr:nth-last-child(3) {
        & th:first-child {
          background: #763827;
          color: #fff;
        }
      }

      /* Sanbaiman row */
      & tr:nth-last-child(2) {
        & th:first-child {
          background: #422a28;
          color: #fff;
        }
      }

      /* Yakuman row */
      & tr:last-child {
        & th:first-child {
          background: #d77f3d;
          color: #fff;
        }
      }
    }

    & tfoot {
      & tr:first-child {
        & td:first-child {
          background: var(--riichi-scoring-table-mangan-background);
          color: var(--riichi-scoring-table-mangan-text-color);
        }
      }
    }
  }
}

/* .riichi-scoring-table-container-md, */
/* .riichi-scoring-table-container-lg { */
  /* display: none; */
/* } */

.riichi-scoring-table-container-lg {
  & table.riichi-scoring-table {
    & thead {
      & tr:first-child {
        /* East label */
        & th:first-child {
          background: #ff8c40;
        }

        /* Fu column */
        & th:nth-child(2) {
          background: #a3c7c1;
        }

        /* Non-East label */
        & th:last-child {
          background: #0080ff;
        }
      }

      & tr:nth-child(2) {
        /* Han label row */
        & th {
          background: #acb8c4;
        }
      }
    }

    & tbody {
      /* Fu column */
      & th {
        background: #a3c7c1;
      }
    }

    & tfoot {
      & tr {
        & th {
          background: #acb8c4;
        }
      }
    }
  }
}

.riichi-scoring-fu-container {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;

  & table {
    & th,
    & td {
      padding: 0.2rem;
      text-align: right;
    }

    &.riichi-scoring-fu-base {
      & caption {
        background: #3a4977;
        color: #fff;
        font-weight: bold;
      }
    }

    &.riichi-scoring-fu-sets {
      & caption {
        background: #345738;
        color: #fff;
        font-weight: bold;
      }

      & tbody {
        & tr:first-child {
          & th:first-child {
            background: #7d9756;
            color: #fff;
          }
        }

        & tr:nth-child(3) {
          & th:first-child {
            background: #365430;
            color: #fff;
          }
        }
      }
    }

    &.riichi-scoring-fu-tenpai {
      & caption {
        background: #8f3d35;
        color: #fff;
        font-weight: bold;
      }
    }
  }
}

@media(min-width: 640px) {
  /* .riichi-scoring-table-container-sm { */
    /* display: none; */
  /* } */

  /* .riichi-scoring-table-container-lg { */
    /* display: block; */
  /* } */
}