/* Stack */

.tablesaw-cell-label-top {
  text-transform: uppercase;
  // font-size: .9em;
  font-weight: $font-weight-normal;
}

.tablesaw-cell-label {
  // font-size: .65em;
  text-transform: uppercase;
  // color: #888;
  // font-family: sans-serif;
}

@media (min-width: 40em) {
  .tablesaw td {
    line-height: 1.5em;
  }
}

/*
 Styles for the table stack mode
*/

/* Table rows have a gray bottom stroke by default */
.tablesaw-stack tbody tr {
  // border-bottom: 1px solid #dfdfdf;
}

.tablesaw-stack td .tablesaw-cell-label,
.tablesaw-stack th .tablesaw-cell-label {
  display: none;
}

/* Mobile first styles: Begin with the stacked presentation at narrow widths */
@media only all {
  /* Show the table cells as a block level element */
  .tablesaw-stack td,
  .tablesaw-stack th {
    text-align: left;
    display: block;
  }
  .tablesaw-stack tr {
    clear: both;
    display: table-row;
  }
  /* Make the label elements a percentage width */
  .tablesaw-stack td .tablesaw-cell-label,
  .tablesaw-stack th .tablesaw-cell-label {
    // display: block;
    padding: 0 .6em 0 0;
    width: 30%;
    display: inline-block;
  }
  /* For grouped headers, have a different style to visually separate the levels by classing the first label in each col group */
  .tablesaw-stack th .tablesaw-cell-label-top,
  .tablesaw-stack td .tablesaw-cell-label-top {
    display: block;
    padding: .4em 0;
    margin: .4em 0;
  }
  .tablesaw-cell-label {
    display: block;
  }
  /* Avoid double strokes when stacked */
  .tablesaw-stack tbody th.group {
    margin-top:-1px;
  }
  /* Avoid double strokes when stacked */
  .tablesaw-stack th.group b.tablesaw-cell-label {
    display: none !important;
  }
}