@import 'variables';
@import 'mixins';
@import 'px-table-row-sketch';


/// @group px-table-row
/// @access public
.table-row {
  @include noselect();
  @import 'elements/table-row__actions';

  min-height      : $table-row-min-height;
  line-height     : $table-row-line-height;

  color           : $table-row-color;
  font-size       : $table-row-font-size;
  background-color: $table-row-background-color;
  border-bottom-width:  $table-row-separator-width;
  border-bottom-style:  $table-row-separator-style;
  border-bottom-color:  $table-row-separator-color;

  &:active {
    transition: none;
  }

  ///------------------------------------------------------

  ///.table-row--selected
  &--selected {

    background-color: $table-row-selected-background-color;
    color           : $table-row-active-font-color;

    .table-row__body,
    .table-row__label,
    .table-row__label2,
    .table-row__subtitle,
    .table-row__title {
      color: $table-row-active-font-color;
    }

    .table-row:before {
      color: $table-row-active-font-color;
    }
  }
}

///------------------------------------------------------
///.table-row > a
.table-row > a {
  text-decoration: none;
  @include tableRowClickable($table-row-active-background-color, $table-row-active-font-color);
}

///------------------------------------------------------
///.table-row__title
.table-row__title {
  font-size: $table-row-title-font-size;
  color    : $table-row-title-font-color;
}

///------------------------------------------------------
///.table-row__subtitle
.table-row__subtitle {
  font-size: $table-row-subtitle-font-size;
  color    : $table-row-subtitle-font-color;
}

///------------------------------------------------------
///.table-row__body
.table-row__body {
  font-size: $table-row-body-font-size;
  color    : $table-row-body-font-color;
}

///------------------------------------------------------
///.table-row__label
.table-row__label {
  font-size: $table-row-label-font-size;
  color    : $table-row-label-font-color;
}

///------------------------------------------------------
.table-row--header {
  padding         : $table-row-header-padding;
  font-size       : $table-row-header-font-size;
  color           : $table-row-header-font-color;
  background-color: $table-row-header-background-color;
  text-transform  : $table-row-header-text-transform;
  min-height      : var(--px-table-row-header-min-height, 24px);
  line-height     : var(--px-table-row-header-line-height, 24px);
  border-top      : none;
  border-bottom   : none;
}