@if ($wc-use-respond == 1 and $wc-use-respond-table == 1) {
  @include respond-phonelike {
    .wc-table.wc-respond {
      table,
      caption,
      thead,
      tfoot,
      tbody,
      tr,
      th,
      td {
        @include border-box;
        display: block;
        width: 100%;
      }

      caption {
        padding: $wc-gap-small 0;
      }

      tr {
        + tr {
          @include border($pos: top);
        }

        + [aria-level='1'],
        + tr:not([aria-level]) {
          margin-top: $wc-gap-small;
        }
      }

      .wc_table_sel_wrapper,
      .wc_table_rowexp_container {
        display: none;
      }

      .wc_table_rowexp_container[role='button'] {
        display: inline-block;
        padding: $wc-gap-small 0;
        width: auto;

        + .wc-th,
        + .wc-td {
          display: inline-block;
          padding-left: 0;
          width: calc(100% - #{$wc-icon-normal});
        }
      }

      @for $i from 2 to 6 {
        [aria-level='#{$i}'] {
          padding-left: $i * $wc-gap-normal;

          th,
          td {
            padding-left: 0;
          }
        }
      }

      .wc_table_top_controls {
        @include flex-direction(column);

        > div {
          @include flex-shrink(1);

          &:last-child {
            @include flex-justify-content(flex-start);
            text-align: left;
          }
        }
      }
    }
  }
}

@import 'wc.table.respond.color';
