
// @require core/reset/reset.scss
// @require core/widget/widget.scss

//TODO: Add horizontally scrollable tables support
//TODO: Add .reflow (see bootstrap v4)
// We are using the `table` class so that if someone need a plain basic table he/she can

/* TABLE */

.table {

  @extend %widget;
  @include color ( $table-color, $table-color-force, $table-color-basic );
  width: 100%;
  border-collapse: separate;
  border-radius: $table-border-radius;

  /* ROWS */

  tr {

    /* CELLS */

    > * {
      padding: $table-cell-padding-y $table-cell-padding-x;
      text-align: left;
    }

    /* THEAD CELLS */

    > th {
      vertical-align: middle;
    }

    /* TBODY CELLS */

    > td {
      vertical-align: top;
    }

  }

  /* ROW EMPTY */ //TODO: Maybe move it to its own module

  .table-row-empty:not(:only-child) {
    display: none;
  }

  /* THEAD */

  thead {

    @include border-top-radius ( inherit );
    background-color: $table-header-bg-color;

    tr:first-child {

      @include border-top-radius ( inherit );

      th {

        &:first-child {
          border-top-left-radius: inherit;
        }

        &:last-child {
          border-top-right-radius: inherit;
        }

      }

    }

  }

  /* TBODY */

  tbody {

    border-radius: inherit;

    tr {

      &.table-row-empty td {
        height: $table-row-empty-height;
        text-align: center;
        vertical-align: middle;
      }

      &:first-child,
      &.table-row-empty + tr {

        @include border-top-radius ( inherit );

        td {

          &:first-child {
            border-top-left-radius: inherit;
          }

          &:last-child {
            border-top-right-radius: inherit;
          }

        }

      }

      &:last-child {

        @include border-bottom-radius ( inherit );

        td {

          &:first-child {
            border-bottom-left-radius: inherit;
          }

          &:last-child {
            border-bottom-right-radius: inherit;
          }

        }

      }

    }

  }

  thead ~ tbody tr:first-child td,
  thead ~ tbody .table-row-empty + tr td {

    &:first-child {
      border-top-left-radius: 0;
    }

    &:last-child {
      border-top-right-radius: 0;
    }

  }

  tfoot ~ tbody tr:last-child td {

    &:first-child {
      border-bottom-left-radius: 0;
    }

    &:last-child {
      border-bottom-right-radius: 0;
    }

  }

  /* TFOOT */

  tfoot {

    @include border-bottom-radius ( inherit );
    background-color: $table-footer-bg-color;

    tr:last-child {

      @include border-bottom-radius ( inherit );

      td {

        &:first-child {
          border-bottom-left-radius: inherit;
        }

        &:last-child {
          border-bottom-right-radius: inherit;
        }

      }

    }

  }

}
