.careers {
  &-table {
    $min-rows-size: $grid-unit-y * 45;
    &.table > tbody > tr > td,
    &.table > tbody > tr > th {
      border-top: none;
      border-bottom: none;
    }

    &.table > thead > tr > th {
      min-width: $min-rows-size;
    }

    &.table > tbody > tr > td {
      min-width: $min-rows-size;
      height: $grid-unit-x * 10;
      @include themes(background-color, panel-bg);

      .popover {
        z-index: $zindex-fixed;
      }

      &.progression-row-focused,
      &.progression-row-active {
        @include themes(background-color, color-bg-grey);
      }
    }
  }

  .progression {
    .table-responsive {
      // overflow-x: visible;
      overflow: auto;
      overflow: initial;
    }

    &-table {
      &-spacer {
        min-height: 57px;
      }
    }

    &-backdrop {
      backdrop-filter: blur(4px);
      -webkit-backdrop-filter: blur(4px);
      position: fixed;
      width: 100%;
      height: 100%;
      // super hacky, tying to make sure
      // you can see the bottom scrollbar
      left: $layout-fixed-sidenav-width;
      top: $grid-unit-y * -2;
      z-index: 100;
      cursor: not-allowed;
      @include opacity($modal-backdrop-opacity);

      @each $theme, $map in $themes {
        .#{$theme} & {
          $layout-fixed-sidebar-backdrop-bg: map-get($map, modal-backdrop-bg);

          background: $layout-fixed-sidebar-backdrop-bg
            0
            0
            no-repeat
            padding-box;
        }
      }
    }

    &-career {
      cursor: pointer;
      position: relative;

      .panel-heading,
      .panel-body {
        @include themes(background-color, table-bg-default);
      }

      &-active {
        .panel-heading,
        .panel-body {
          @include themes(background-color, table-bg-active);
        }
      }

      &-volitile {
        .panel-heading,
        .panel-body {
          @include themes(background-color, table-bg-volitile);
        }
      }

      &-selected {
        .panel-heading,
        .panel-body {
          background-color: $color-grey-4;
        }
      }

      &-elevate {
        z-index: 101;
      }

      &-assigned {
        cursor: not-allowed;
        pointer-events: none;

        @include opacity(0.4);
      }

      &-inaction {
        cursor: not-allowed;
      }
    }
  }
}
