MetaPhase-Consulting/State-TalentMAP

// set a min-width for the bid tracker card, since it is not optimized for mobile
$card-width: 775px;
$draft-icon-offset: 120px;
$register-icon-offset: 44%;
$register-hide-icon: 95%;

.bid-tracker-page {
  position: relative;

  .searches-top-section {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 1.2em;
  }

  .export-button-container {
    button {
      margin-top: 0;
    }
  }

  .results-dropdown-sort {
    float: right;
  }

  .search-as-client-button {
    float: right;
  }

  .bid-tracker-greeting {
    margin-bottom: 40px;
  }

  .bid-tracker-content-container {
    position: relative;
  }

  .bid-tracker-notifications {
    margin-bottom: 25px;
  }

  .bid-tracker-greeting-container {
    float: left;
    padding-right: 10px;
  }

  .bid-tracker-cdo-email-container,
  .bid-tracker-cdo-email {
    float: right;
  }

  .bid-tracker-cdo-button {
    font-weight: normal;
    margin-right: 0;
    margin-top: 0;

    .fa {
      margin-right: 10px;
    }
  }

  .bid-tracker-top-row {
    margin-bottom: 1em;
    .button-back-link {
      margin-bottom: 0;
    }
    .search-as-client-button {
      margin-right: -.1em;
    }
  }

  .padded-container-inner {
    padding: 15px;
  }

  .bid-status-stats {
    margin-bottom: 10px;
    .bid-stat {
      font-weight: bold;
    }
    div {
      display: inline;
      margin-right: 20px;
    }
  }
}

.bid-tracker-title--condensed {
  div {
    display: inline;
  }
  .dashboard-section-title {
    margin-bottom: 0;
  }
  .bid-status-stats--condensed {
    float: right;
    margin: 2px 20px 0 0;
    .bid-stat {
      font-weight: bold;
    }
    div:first-child {
      margin-right: 20px;
    }
    @media screen and (min-width: 1200px) and (max-width: 1299px) {
      font-size: 12px;
      margin: 5px 0 0 0;
      .bid-stat {
        font-weight: normal;
      }
      div:first-child {
        margin-right: 2px;
      }
    }
    @media screen and (min-width: 1300px) and (max-width: 1450px) {
      font-size: 14px;
      margin: 4px 0 0 0;
      div:first-child {
        margin-right: 5px;
      }
    }
  }
}

.bid-tracker-container {
  margin-bottom: 30px;
  position: relative;
}

.bid-tracker-ribbon-container {
  display: flex;
  position: absolute;
  right: 13px;
  top: 50px;
}

.bid-tracker-overlay-alert {
  background: $color-gray;
  color: $color-white;
  height: 100%;
  left: 0;
  min-width: $card-width;
  opacity: .95;
  position: absolute;
  top: 0;
  width: 100%;

  .fa {
    font-size: 25px;
  }

  .interactive-element {
    margin: 10px 0px -35px 20px;
  }

  .bid-tracker-overlay-alert-content-container {
    margin: 0 auto;
    position: relative;
    text-align: center;
    width: 70%;
  }

  .bid-tracker-overlay-alert-content {
    margin: 0 auto;
    text-align: center;

    .fa {
      font-size: 24px;
    }
  }
}

.bid-tracker-bid-steps-container--draft {
  overflow: hidden;
}

.bid-tracker-bid-steps-container--handshakeneedsregistered {
  overflow: hidden;
}

.bid-tracker-overlay-alert--success {
  background: $color-green-dark;
}

.bid-tracker-overlay-alert--pending {
  background: $tm-navy;
}

.bid-tracker-overlay-alert--closed {
  background: $color-gray;
}
.bid-tracker-overlay-alert--closed:hover {
  opacity: 50%;
  .top-text {
    display: none;
  }
}

.bid-tracker-overlay-alert--draft {
  background: $bg-blue-dark-2;
  color: $color-black;
  margin-left: $draft-icon-offset;

  .tm-button-transparent {
    box-shadow: 0 0 0 2px $color-black inset;
    color: $color-black;
  }

  .bid-tracker-overlay-alert-content-container {
    padding-right: $draft-icon-offset;
    width: 95%;
  }
}

.bid-tracker-overlay-alert--draft::after {
  border-bottom: 10px solid transparent;
  border-left: 10px solid $color-white;
  border-top: 10px solid transparent;
  clear: both;
  content: '';
  height: 0;
  left: 0;
  position: absolute;
  top: 43px;
  width: 0;
}

.bid-tracker-overlay-alert--register {
  background: $blue-primary;
  color: $color-white;
  margin-left: $register-icon-offset;

  .tm-button-transparent {
    box-shadow: 0 0 0 2px $color-white inset;
    color: $color-white;
  }

  .bid-tracker-overlay-alert-content-container {
    padding-right: $register-icon-offset;
    width: 95%;
  }
}

.collapse-overlay {
  margin-left: $register-hide-icon;
}

.bid-tracker-overlay-alert--register::after {
  border-bottom: 10px solid transparent;
  border-left: 10px solid $color-white;
  border-top: 10px solid transparent;
  clear: both;
  content: '';
  height: 0;
  left: 0;
  position: absolute;
  top: 43px;
  width: 0;
}

.bid-tracker-overlay-alert--unregister {
  background: $bg-blue-dark-0;

  .tm-button-submit-bid {
    &:not(:focus):not(:active):not(:hover) {
      background-color: $blue-primary;
    }
  }
}

.bid-tracker {

  background: $color-white;
  border: 1px solid $color-gray-light;
  font-size: 16px;
  margin-bottom: 20px;
  min-width: $card-width;
  overflow-x: hidden;

  .confetti-container {
    left: 17px;
    position: relative;
  }

  .hs-animation-bidtracker {
    margin-left: -36px;
    .left, .right, .hs-bidtracker {
      display: inline;
      position: relative;
      font-size: 20px;
    }
    .left {
      left: -10rem;
      transform: rotate(90deg);
      opacity: 0;
      color: $tertiary-gold-lighter;
    }
    .right {
      right: -17rem;
      transform: rotate(-90deg) scaleX(-1);
      opacity: 0;
      color: $tertiary-gold-lighter;
    }
    .hs-container {
      border-radius: 50%;
      background-color: $color-green-dark-opacity50;
      width: 36px;
      height: 36px;
      margin: auto;
      display: inline-block;
      .hs-bidtracker {
        margin-top: 8px;
        color: $color-white;
      }
    }
    .animate-left {
      animation: left-animation-bidtracker 2s linear;
    }
    .animate-right {
      animation: right-animation-bidtracker 2s linear;
    }
    .animate-hs-bidtracker {
      animation: hs-animation-bidtracker 4s linear;
    }
    .temp-transparent {
      animation: temp-transparent-animation 4s linear;
    }

    @keyframes left-animation-bidtracker {
      0% {left:-10rem; opacity: 100%;}
      100% {left:4rem; opacity: 100%;}
    }
    @keyframes right-animation-bidtracker {
      0% {right:-17rem; opacity: 100%;}
      100% {right:-3rem; opacity: 100%;}
    }
    @keyframes left-animation-max-1699 {
      0% {left:-8rem; opacity: 100%;}
      100% {left:4rem; opacity: 100%;}
    }
    @keyframes right-animation-max-1699 {
      0% {right:-15rem; opacity: 100%;}
      100% {right:-3rem; opacity: 100%;}
    }
    @keyframes left-animation-max-1499 {
      0% {left:-4rem; opacity: 100%;}
      100% {left:4rem; opacity: 100%;}
    }
    @keyframes right-animation-max-1499 {
      0% {right:-11rem; opacity: 100%;}
      100% {right:-3rem; opacity: 100%;}
    }
    @keyframes left-animation-max-1249 {
      0% {left:-1rem; opacity: 100%;}
      100% {left:4rem; opacity: 100%;}
    }
    @keyframes right-animation-max-1249 {
      0% {right:-8rem; opacity: 100%;}
      100% {right:-3rem; opacity: 100%;}
    }
    @keyframes hs-animation-bidtracker {
      0% {opacity: 0;}
      49% {opacity: 0;}
      50% {top:10px; opacity: 100%; color: $tertiary-gold-lighter;}
      65% {top:-10px;}
      70% {top:10px;}
      75% {top:-10px;}
      80% {top:10px;}
      85% {top:-10px;}
      90% {top:10px;}
      95% {top:-10px;}
      100% {top:0; color: $tertiary-gold-lighter;}
    }
    @keyframes temp-transparent-animation {
      0% {background-color: transparent;}
      100% {background-color: transparent;}
    }
    @media screen and (max-width: 1699px) {
      .left {
        left: -8rem;
      }
      .right {
        right: -15rem;
      }
      .animate-left {
        animation: left-animation-max-1699 2s linear;
      }
      .animate-right {
        animation: right-animation-max-1699 2s linear;
      }
    }
    @media screen and (max-width: 1499px) {
      .left {
        left: -4rem;
      }
      .right {
        right: -11rem;
      }
      .animate-left {
        animation: left-animation-max-1499 2s linear;
      }
      .animate-right {
        animation: right-animation-max-1499 2s linear;
      }
    }
    @media screen and (max-width: 1249px) {
      .left {
        left: -1rem;
      }
      .right {
        right: -8rem;
      }
      .animate-left {
        animation: left-animation-max-1249 2s linear;
      }
      .animate-right {
        animation: right-animation-max-1249 2s linear;
      }
    }
  }

  .fa-trash {
    color: $color-red;
    margin-right: .25em;
  }

  .bid-count-container {
    float: left;
  }

  .bid-tracker-bid-steps-container--prepanel {
    .bid-tracker-overlay-alert {
      display: none;
    }
  }

  .bid-stats {
    .bid-count-list {
      flex: 3;
      font-size: 90%;
    }
  }

  .bid-count-label {
    margin-top: .4em;
  }

  .step-title-sub-text {
    color: $color-gray;
    font-size: 13px;
  }

  .bid-tracker-card-bottom-section {
    border-right: 1px solid $color-gray-lighter;
    float: left;
    margin-right: 20px;
    max-width: 25%;
    padding-right: 20px;
    width: 25%;
  }

  .bid-tracker-card-bottom-section:last-child {
    border-right: 0;
    flex-grow: 1;
    margin-right: 0;
    padding-right: 0;
  }

  .bid-tracker-organization-container {
    float: left;
    width: 400px;
  }

  .bid-tracker-title-container {
    display: flex;
    margin-bottom: 0;
    padding-top: 18px;
  }

  .bid-tracker-title-content-container {
    flex: 5;
  }

  .bid-tracker-card-title-container-right {
    float: right;
  }

  .bid-tracker-cdo-submitted-container {
    float: left;
    font-size: 13px;
    margin: 3px 20px 0 0;

    .fa {
      color: $blue-primary;
      margin-right: 5px;
    }
  }

  .bid-tracker-actions-container {
    float: left;
  }

  .bid-tracker-bid-steps-container {
    padding-bottom: 25px;
    padding-right: 10%;
    padding-top: 40px;
    position: relative;
  }

  .bid-tracker-card-title-text {
    float: left;
    font-size: 19px;
    font-weight: bold;
    padding-right: 10px;
  }

  .bid-tracker-card-title-bottom {
    float: left;
    margin-right: .5em;
    margin-top: .6em;
  }

  .bid-tracker-card-title-bottom--full-width {
    width: 100%;
  }

  .bid-tracker-card-title-link {
    border-left: 1px solid $color-black;
    float: left;
    margin-top: 2px;
    padding-left: 5px;

    a {
      padding-left: 5px;
      text-decoration: none;
    }
  }

  .bid-tracker-card-bottom-container {
    border-top: 1px solid $color-gray-light;
  }

  .bid-tracker-card-bottom {
    display: flex;

    @media screen and (min-width: 0px) {
      .usa-width-one-sixth {
        display: block;
        float: left;
        margin-right: 2.35765%;
        width: auto;
      }

      .usa-width-one-half {
        display: block;
        float: left;
        margin-right: 2.35765%;
        width: 48.82117%;
      }
    }
  }

  .step-submitted {
    left: -3%;

    .rc-steps-item-tail {
      width: 147%;
    }
  }

  .step-in-panel {
    right: -3%;
  }

  .step-handshake-offered {
    right: -2%;

    .rc-steps-item-tail {
      width: 96%;
    }
  }

  .step-handshake-accepted {
    left: -2%;

    .rc-steps-item-tail {
      width: 147%;
    }
  }

  .icon-complete {
    .fa {
      background: $color-green-dark-opacity50;
      border: 1px solid $color-green-dark-opacity50;
      border-radius: 21px;
      color: $color-white;
      padding: 5px;
    }
  }

  .icon-container {
    position: relative;
  }

  .number-icon {
    background: $blue-primary;
    border: 1px solid $blue-primary;
    border-radius: 35px;
    color: $color-white;
    font-size: 16px;
    padding: 7px 12px;
  }

  .number-icon-incomplete {
    background: $color-gray-light;
    border-color: $color-gray-light;
  }

  .number-icon-needs-action {
    background: $color-green-dark;
    border-color: $color-green-dark;
  }

  .number-icon-is-current-no-action {
    background: $blue-primary;
    border-color: $blue-primary;
  }

  .pending-tooltip {
    color: $color-black;
    font-size: 13px;
    left: -13px;
    position: absolute;
    top: -35px;
    width: 100px;
  }

  .bid-tracker-pending-text-container {
    float: left;
  }

  .bid-tracker-pending-icon-container {
    float: left;
    margin-right: 5px;
  }

  .step-tooltip {
    background: $blue-primary;
    color: $color-white;
    font-size: 13px;
    left: -38px;
    padding: 10px 13px;
    position: absolute;
    top: -58px;
    width: 120px;
  }

  .step-tooltip::after {
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid $blue-primary;
    clear: both;
    content: '';
    height: 0;
    left: 48px;
    position: absolute;
    top: 33px;
    width: 0;
  }

  .preparing-tooltip-container {
    left: 50%;
    position: absolute;
  }

  .preparing-tooltip {
    height: 57px;
    left: -55%;
    position: relative;
    top: -71px;
    width: 170px;
  }

  .preparing-tooltip::after {
    left: 42%;
    top: 100%;
  }

  .bid-tracker-rescheduled-text-container {
    float: left;
  }

  .bid-tracker-rescheduled-icon-container {
    float: left;
    margin-right: 10px;
  }

  .bid-tracker-preparing-text-container {
    float: left;
    width: 80%;
  }

  .bid-tracker-preparing-icon-container {
    float: left;
    margin-right: 10px;
    margin-top: 5px;
  }

  .rc-steps-item-tail {
    left: -8px;
    width: 106%;
  }

  .rc-steps-item-tail::after {
    background: transparent;
    border: 1.5px dashed $color-green-dark-opacity50;
    color: $color-green-dark-opacity50;
    height: 0;
  }

  .step-complete {
    .rc-steps-icon {
      left: -3px;
      top: -3px;
    }

    .rc-steps-item-title {
      color: $color-black;
    }
  }

  .step-incomplete {
    .rc-steps-icon {
      left: -3px;
      top: 2px;
    }

    .rc-steps-item-content {
      margin-left: 2px;
      margin-top: 18px;
    }

    .rc-steps-item-tail::after {
      background: transparent;
      border: 1.5px solid $color-gray-light;
      color: $color-gray-light;
      height: 0;
    }
  }

  .pending-line {
    .rc-steps-item-tail::after {
      border: 1.5px dashed $blue-primary;
      color: $blue-primary;
    }
  }

  .register-with-another-bidder-bid-steps {
    .pending-line {
      .rc-steps-item-tail::after {
        border: 1.5px dashed $color-gray-light;
        color: $color-gray-light;
      }
    }
  }

  .step-current {
    .rc-steps-item-title {
      color: $color-black;
    }

    .rc-steps-item-content {
      margin-left: 6px;
    }

    .number-icon {
      font-size: 19px;
      padding: 8px 15px;
    }
  }

  .rc-steps-item-title {
    font-size: 16px;
    font-weight: normal;
    line-height: 19px;
  }
}

.bid-tracker--condensed {
  border: 0;
  border-top: 1px solid $color-gray-light;
  font-size: 1.2rem;
  margin-bottom: 0;
  min-width: 0;
  width: 100%;

  .fa-close {
    font-size: 1.1em;
  }

  .bid-count-container {
    align-items: center;
    border-left: 1px solid $color-gray-light;
    display: flex;
    float: initial;
    margin: 0;
    padding-left: .5em;

    .bid-count-label {
      flex: 1;
      font-size: 1rem;
      font-weight: normal;
      margin-top: 0;
      padding-top: 0;
    }
  }

  .bid-tracker-bottom-link-container {
    margin-top: .5em;

    div {
      margin-top: 0;
    }
  }

  .bid-tracker-stats {
    align-items: center;
    color: $color-gray;
    display: flex;
    font-size: 1rem;
    padding: 1em 1.5em;

    span:first-of-type:not(.bid-count-number) {
      border-right: 1px solid $color-gray-light;
      padding-right: .5em;
      text-transform: capitalize;
    }

    span:nth-of-type(2) {
      margin-right: .5em;
      padding-left: .5em;
    }
  }

  .bid-tracker-alert-container--closed,
  .bid-tracker-alert-container--declined,
  .bid-tracker-alert-container--handshake-declined,
  .bid-tracker-alert-container--handshake-offered {
    display: flex;

    button {
      margin: 0;
      padding: 1em .5em;
    }

    div:nth-of-type(2),
    div:nth-of-type(3) {
      flex: 1;

      a {
        padding: 1em .5em;
      }
    }

    .link-button {
      font-size: 1.2rem;
      margin: 0;
      padding: .75em;
    }

    .date-text,
    .sub-text {
      display: none;
    }

    .top-text {
      display: flex;
      flex: 2;
      flex-direction: column;
      justify-content: center;
      margin-right: 1em;
      text-align: left;
    }

    .tm-button-no-box {
      display: none;
    }
  }

  .draft-submission-container {
    display: flex;

    div {
      flex: 1;
    }
  }

  .register-submission-container {
    display: flex;

    div {
      flex: 1;
    }
  }

  .bid-tracker-alert-container--draft {
    margin-left: 1.5em;

    .draft-submission-container {
      border-right: 0;
    }

    .sub-submission-text {
      margin-bottom: 0;
      text-align: left;
    }
  }

  .bid-tracker-alert-container--register {
    margin-left: 1.5em;

    .register-submission-container {
      border-right: 0;
    }

    .sub-submission-text {
      margin-bottom: 0;
      text-align: left;
    }
  }

  .sub-submission-text,
  .draft-submission-buttons-container {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    justify-content: center;
    text-align: left;

    button {
      flex: 1;
    }

    // fix in IE11
    @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
      button {
        margin-left: 5px;
        min-height: 35px;
      }
    }
  }

  .sub-submission-text,
  .register-submission-buttons-container {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    justify-content: center;
    text-align: left;

    button {
      flex: 1;
    }

    // fix in IE11
    @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
      button {
        margin-left: 5px;
        min-height: 35px;
      }
    }
  }


  // fix in IE11
  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .bid-count-list {
      margin-left: 30px;
    }
  }

  .step-title-sub-text,
  .remove-bid-link {
    display: none;
  }

  .bid-tracker-overlay-alert {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    padding: 1em;
    width: 100%;

    .bid-tracker-overlay-alert-content-container {
      width: 100%;
    }
  }

  .bid-tracker--condensed {
    .bid-tracker-alert-container--draft {
      top: 0;
    }
    .bid-tracker-alert-container--register {
      top: 0;
    }
  }

  .bid-tracker-overlay-alert--register {
    margin-left: 0;
  }

  .bid-tracker-alert-container {
    top: 0;
    margin-top: 0;
  }

  .top-text {
    font-size: 1.2rem;
  }

  .bid-tracker-overlay-alert-content-container {
    width: 100%;
  }

  .draft-position-details {
    display: none;
  }

  .register-position-details {
    display: none;
  }

  .bid-tracker-bid-steps-container {
    padding: 0 1.5em;
  }

  .step-tooltip {
    display: none;
  }

  .bid-tracker-title-container {
    padding: 1em;
  }

  .rc-steps {
    min-height: 75px;
    padding: 10px 1em 0;
  }

  .bid-tracker-card-title-text {
    font-size: 1.5rem;
  }

  .bid-tracker-card-title-outer-container-right {
    flex: 3;

    .remove-bid-link {
      display: initial;
    }
  }

  .step-in-panel {
    .rc-steps-item-content {
      .step-title-main-text {
        left: -12px;
      }
    }
  }

  .rc-steps-item-content {

    .step-title-main-text {
      font-size: 1.2rem;
      left: -7px;
      line-height: 1.2rem;
      position: absolute;
      text-align: center;
    }
    
    .hs-needs-registered {
      left: -15px;
    }
  }

  .step-approval {
    .step-title-main-text {
      left: -18px;
    }
  }

  .rc-steps-item {
    left: 0;
    right: 0;

    .rc-steps-item-content {
      margin-left: 0;
      text-align: left;
    }
  }

  .rc-steps-item:not(.step-current) {
    .rc-steps-item-content {
      display: none;
    }
  }

  .bid-tracker-bid-steps-container--prepanel {
    .step-in-panel {
      .rc-steps-item-content {
        display: block;
      }
    }

    .step-in-panel.step-incomplete {
      .step-title-main-text {
        left: -11px;
      }
    }
  }

  .rc-steps-item-custom .rc-steps-item-icon > .rc-steps-icon {
    font-size: 1.2rem;
  }

  .rc-steps-item-icon {
    margin-left: 0;
  }

  .rc-steps-item-tail {
    margin-left: 15px;
  }

  .number-icon {
    font-size: 1.1rem;
    padding: 1px 5px;
  }

  .step-current {
    .number-icon {
      font-size: 1.5rem;
      padding: 3px 8px;
    }
  }

  .icon-complete {
    .fa {
      padding: 1px;
    }
  }

  .rc-steps-label-vertical {
    .rc-steps-item-tail {
      padding: 0;
    }

    .rc-steps-item-content {
      width: initial;
    }
  }

  .step-incomplete {
    .rc-steps-icon {
      left: 0;
      top: 7px;
    }
  }

  .step-complete {
    .rc-steps-icon {
      left: 0;
      top: -1px;
    }
  }

  .bid-tracker-overlay-alert--draft {
    margin-left: 75px;

    .bid-tracker-overlay-alert-content-container {
      padding-right: 80px;
    }
  }

  .bid-tracker-overlay-alert--register {
    margin-left: 0;

    .bid-tracker-overlay-alert-content-container {
      padding-right: 0;
    }
  }

  .pending-line > .rc-steps-item-tail,
  .rc-steps-item-tail {
    &::after {
      border-width: 1.5px;
    }
  }

  .bid-tracker-overlay-alert--draft::after {
    top: 13px;
  }

  .bid-tracker-overlay-alert--register::after {
    display: none;
  }

  .bid-tracker-bid-steps-container--handshakeaccepted {
    .step-in-panel {
      .rc-steps-item-content {
        display: block;
      }
    }
  }

  &.bid-tracker--priority-exists.bid-tracker--is-not-priority,
  &.bid-tracker--priority-exists.bid-tracker--is-priority {
    padding: 0;

    .bid-tracker-overlay-alert {
      display: none;
    }

    .bid-tracker-title-container {
      padding: 0;
    }

    .bid-tracker-bottom-link-container {
      margin-top: 1em;
      padding: 0 1.5em;
    }
  }

  &.bid-tracker--priority-exists.bid-tracker--is-priority {
    border: 2px solid $color-gold;

    .bid-tracker-card-title-container {
      background: $color-gold;
      padding: 1em .75em;
    }
  }

  &.bid-tracker--priority-exists.bid-tracker--is-priority.bid-tracker--is-priority--approved {
    border-color: $color-green-dark;

    .bid-tracker-card-title-container {
      background: $color-green-dark;
      color: $color-white;
    }
  }

  &.bid-tracker--priority-exists.bid-tracker--is-not-priority {
    border: 2px solid $blue-primary-darkest;

    .bid-tracker-card-title-container {
      background: $blue-primary-darkest;
      color: $color-white;
      padding: 1em;
    }

    .bid-tracker-card-title-text {
      font-weight: normal;
    }
  }
}

.bid-tracker-alert-container {
  position: relative;
  top: 65px;

  .fa {
    margin-bottom: 10px;
  }

  .sub-text {
    font-size: 13px;
    margin-top: 5px;
  }

  .top-text {
    margin-bottom: 5px;
  }

  button {
    margin-right: 0;
  }

  a {
    color: inherit;
  }
}

.bid-tracker-alert-container--approved {
  top: 35px;
}

.bid-tracker-alert-container--in-panel {
  top: 40px;
}

.bid-tracker-alert-container--handshake-offered {
  padding: 10px 30px;

  button {
    margin: 20px 30px 20px 0;
  }
  button:disabled {
    opacity: 75%;
  }
  .left-side {
    flex: 0.65;
    padding-right: 1em;
  }
  .link-button-wrapper {
    margin: auto;
  }
  .tm-button-no-box {
    text-decoration: underline;
  }
  .right-side {
    border-left: 1px solid $color-white;
    text-align: left;
    flex: 1;
    padding-left: 25px;
    margin-top: auto;
    span {
      font-weight: 500;
    }
    .hs-offered-date {
      font-size: small;
      text-align: right;
    }
    .flex {
      div {
        flex: 1;
      }
      div:first-of-type {
        padding-right: 1em;
      }
    }
  }
}

@media screen and (max-width: 1500px) {
  .bid-tracker-alert-container--handshake-offered {
    padding: 5px 15px;
    button {
      margin: 8px;
    }
    .right-half {
      padding-left: 10px;
    }
  }
}

@media screen and (max-width: 1300px) {
  .bid-tracker-alert-container--handshake-offered {
    padding: 5px;
    font-size: 14px;
    button {
      margin: 5px;
    }
  }
}

.bid-tracker-alert-container--draft {
  top: 35px;

  .remove-bid-link {
    cursor: pointer;
    float: left;
    margin-right: 10px;
    margin-top: 17px;
    text-decoration: underline;
  }

  .title {
    font-weight: bold;
  }

  .draft-submission-container {
    border-right: 1px solid $color-black;
  }

  .draft-submission-buttons-container {
    display: flex;
    margin: auto;
    max-width: 350px;
  }

  .draft-position-details {
    padding-left: 5%;
    text-align: left;
  }

  .sub-submission-text {
    margin-bottom: 15px;
  }

  .tm-button-submit-bid {
    float: left;
    margin: auto;
    padding-left: 16px;
    padding-right: 16px;

    .fa {
      font-size: 1em;
      margin-bottom: 0;
      margin-right: 5px;
    }
  }
}

.bid-tracker-alert-container--register-with-another-bidder {
  margin-top: 35px;
  top: 0;

  .register-with-another-bidder-position-details {
      padding-left: 27%;
      text-align: left;
    }
}

.bid-tracker-alert-container--register {
  margin-top: 35px;
  top: 0;

  .remove-bid-link {
    cursor: pointer;
    float: left;
    margin-right: 10px;
    margin-top: 17px;
    text-decoration: underline;
  }

  .title {
    font-weight: bold;
  }

  .register-submission-container {
    border-right: 1px solid $color-white;
  }

  .register-submission-buttons-container {
    display: flex;
    margin: auto;
    max-width: 350px;
  }

  .register-position-details {
    padding-left: 5%;
    text-align: left;
  }

  .sub-submission-text {
    margin-bottom: 15px;
  }

  .tm-button-submit-bid {
    float: left;
    margin: auto;
    padding-left: 16px;
    padding-right: 16px;

    .fa {
      font-size: 1em;
      margin-bottom: 0;
      margin-right: 5px;
    }
  }
}

.bid-tracker-priority-wrapper-container {
  border: 3px solid $color-gold;
  border-top: 0;
  min-width: $card-width;

  .priority-banner {
    padding-bottom: 10px;
    padding-top: 10px;
  }

  .priority-banner-container-left {
    float: left;
    font-weight: bold;
  }

  .priority-banner-container-right {
    float: left;
    font-size: 13px;
  }

  .priority-banner-question-text {
    float: right;
    margin-top: 3px;

    .fa {
      margin-right: 5px;
    }
  }

  .bid-tracker {
    border: 0;
  }

  .bid-tracker-priority-wrapper {
    background-color: $color-gold;
  }

  &.bid-tracker-priority-wraper--aproved {
    border-color: $color-green-dark;

    .priority-banner {
      color: $color-white;
    }

    .bid-tracker-priority-wrapper {
      background-color: $color-green-dark;
    }
  }
}

.bid-tracker-standby-container {
  $link-color: #2B4559;

  display: flex;
  opacity: .75; // lowest opacity without violating 4.5:1 contrast ratio

  a:link {
    color: $link-color; // opacity lightens normal link color below the required 4.5:1 ratio
  }

  .bid-tracker-standby-inner-container {
    display: flex;
    flex-direction: column;
  }

  .bid-tracker-standby-title {
    background-color: $tm-navy-dark;
    color: $color-white;
    display: flex;
    flex-direction: column;
    float: left;
    justify-content: space-around;
    padding: 13px 59px;
    text-align: center;
    width: 270px;
  }

  .bid-tracker-standby-title-top {
    font-size: 16px;
  }

  .bid-tracker-standby-title-bottom {
    font-size: 13px;
  }

  .bid-tracker-standby-content-container {
    flex-grow: 1;
    float: left;
  }
}

.tippy-popper {
  .tippy-tooltip.bidtracker-status-theme, .tippy-tooltip.bidtracker-status-long-theme {
    background-color: $color-white;
    color: $color-black;
    border: 2px solid $tm-gray;
    font-size: 14px;
    padding: 15px;
    text-align: left;
    box-shadow: $tm-gray 3px 14px 29px;
    .arrow-regular {
      border: none;
    }
    .tooltip-title {
      font-weight: bold;
    }
    .tooltip-text {
      padding: 15px 0 0 15px;
    }
  }
  .tippy-tooltip.bidtracker-status-long-theme {
    bottom: 140px!important;
  }
}

@keyframes glowing {
  0% { box-shadow: 0 0 -65px $color-dodger-blue; }
  40% { box-shadow: 0 0 65px $color-dodger-blue; }
  60% { box-shadow: 0 0 65px $color-dodger-blue; }
  100% { box-shadow: 0 0 -65px $color-dodger-blue; }
}

.number-icon-is-current-no-action {
  animation: glowing 2000ms infinite;
}

@media screen and (max-width: 1450px) {
  .bid-tracker-overlay-alert--register {
    margin-left: 0;

    .bid-tracker-overlay-alert-content-container {
      padding-right: 0;
    }
  }

  .bid-tracker-overlay-alert--register::after {
    display: none;
  }

  .collapse-overlay {
    margin-left: $register-hide-icon;
  }
}

.bid-tracker-inner-container {
  overflow: hidden;
}