$border-header: 1px solid $state-info-border;

.cux-lms-list {
  margin: $margin-normal (- $margin-normal);

  .lms-header {
    display: none;
  }

  .lms-row {
    @extend %flexbox-column;
    position: relative;
    background: $color-beige-200;
    color: $text-color;
    padding: $margin-double;

    &:nth-child(2n-1) {
      background: $color-beige-100;
    }
  }

  a,
  a:nth-child(2n-1) {
    &:hover,
    &:active,
    &:focus {
      text-decoration: none;
    }
  }

  p {
    margin: 0;
  }

  .accomody {
    order: 1;

    :nth-child(1) {
      color: $color-link-blue;
      font-weight: bold;
    }

    :nth-child(2) {
      display: none;
    }
  }

  .destiny {
    order: 2;
    margin-bottom: $margin-normal;

    p {
      display: inline;
      font-weight: bold;

      &:nth-child(1):nth-last-child(2):after,
      &:nth-child(2):nth-last-child(2):after {
        content: ',';
      }
    }
  }

  .departy {
    order: 3;
  }

  .timey {
    order: 4;
    margin-bottom: $margin-double;
  }

  .hurry {
    order: 5;
    color: $color-red-400;
  }

  .pricey {
    position: absolute;
    bottom: $margin-double;
    right: $margin-double;
    text-align: right;

    .normal-price {
      font-weight: normal;
      text-decoration: line-through;
    }

    .current-price {
      @include font-size(24);
      font-weight: bold;
      color: $color-red-400;
      line-height: 1;
    }

    .desc {
      @include font-size(14);
      font-weight: bold;
    }
  }

  .rating {
    font-weight: normal;
  }

  @include breakpoint(md) {
    display: table;
    width: 100%;
    margin: $margin-double 0;

    .lms-header,
    .lms-row {
      display: table-row;

      > * {
        display: table-cell;
        padding: $margin-double;
        vertical-align: middle;
      }
    }

    .lms-header {
      @include font-size(14);
      text-transform: uppercase;
      font-weight: bold;
      padding: $margin-normal $margin-double;

      > * {
        border-top: $border-header;
        padding: ($margin-normal + $margin-half) $margin-double;
      }

      :first-child {
        border-left: $border-header;
      }

      :last-child {
        text-align: right;
        border-right: $border-header;
      }
    }

    p {
      &:nth-last-child(2) {
        font-weight: bold;
      }
    }

    .pricey {
      position: static;

      .desc {
        display: none;
      }
    }

    .destiny {
      margin-bottom: 0;

      p {
        display: block;
        font-weight: normal;
        /* stylelint-disable max-nesting-depth */
        &:nth-child(1):nth-last-child(2),
        &:nth-child(2):nth-last-child(2) {
          font-weight: bold;

          &:after {
            content: '';
          }
        }
        /* stylelint-enable */
      }
    }

    .accomody {
      order: 1;

      :nth-child(2) {
        display: block;
      }
    }
  }
}
