@import "../helpers/index.scss";

.show-page {
  overflow: auto;

  &__tabs {
    .cm-tabs-bar {
      background-color: $white;
      width: 100%;
      .nav-pills {
        margin-left: 10px;
      }
      .nav-link {
        position: static;
        left: 0%;
        right: 0%;
        @include font($size: $t4-text, $color: $ink-lighter-clr);
        line-height: 22px;
        flex: none;
        order: 0;
        flex-grow: 0;
        background-color: $white;
        border-radius: 0px;
      }
      .nav-link.active {
        color: $brand-color;
        border-bottom: 3px $brand-color solid;
        background-color: $white;
      }
    }
  }

  &__inner {
    padding: 24px;
    .info-section {
      margin-bottom: 32px;

      .section-heading {
        @include font($size: $t3-text, $color: $primary-text-clr, $weight: 600);
        line-height: 24px;
        margin: 0 0 16px;
      }
      .paper {
        max-width: 752px;
        padding: 24px;
        background-color: $white;
        border: 1px solid $grey-light-clr;
        border-radius: $radius-4;
      }
      .info-split {
        display: grid;
        grid-template-columns: 140px 1fr;
        grid-column-gap: 24px;
        margin-bottom: 24px;
        &:nth-last-child(1) {
          margin-bottom: 0;
        }
        &__lhs {
          @include font($size: $t4-text, $color: $ink-lighter-clr);
          line-height: 22px;
        }
        &__rhs {
          @include font($size: $t4-text, $color: $primary-text-clr);
          line-height: 19px;
        }
      }
    }
  }
  .filters-bar {
    background-color: $grey-lightest-clr;
  }
}