Consolidate responsive table rules

[robsonsobral]

To make easier to write exceptions on the <table> element.

@media screen and (max-width: #{map.get(my.$breakpoints, 'toggle-table-layout') - 0.01}) {
  table:not(.no-responsive) {
    tbody,
    tr,
    th,
    td {
      display: block;
    }

    thead,
    tfoot {
      display: none;
    }

    tbody td {
      text-align: left;

      &[aria-label] {
        text-align: right;

        &::before {
          float: left;

          font-style: italic;

          content: attr(aria-label) ': ';
        }
      }
    }

    tbody tr:nth-of-type(odd) > th,
    tbody tr:nth-of-type(odd) > td {
      background-color: transparent;
    }

    tr {
      @include my.fallback('margin', 0 0 1.5rem);

      &:last-child {
        margin-bottom: 0;
      }
    }

    td {
      &:empty {
        display: none;
      }
    }
  }
}