%btn-font {
  font-size: 15px;
}
%long {
  padding: 0px 7px;
}

%card-no-shadow {
  box-shadow: none;
}

.card-w {
  @extend %card-no-shadow;
  margin-bottom: 24px;

  div.card {
    @extend %card-no-shadow;
  }

  .card-img-top {
    padding: 0px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    min-height: 300px;
  }

  .absolute-button {
    $default-button-margin: 20px;
    $default-button-dimension: 40px;
    padding: 0px;
    position: absolute;
    top: $default-button-margin;
    height: $default-button-dimension;
    min-width: $default-button-dimension;

    &:hover {
      background: $color-dark-gray2;
    }

    i {
      @extend %btn-font;
    }

    &-1 {
      right: $default-button-margin;
      background: $color-dark-gray1;
    }
    &-2 {
      right: calc(
        #{$default-button-margin} + #{$default-button-dimension} + 15px
      );
      background-color: $color-blue;
      &:hover {
        padding: 0 15px;
        span {
          font-size: 0.81rem;
          text-transform: uppercase;
          white-space: normal;
          word-wrap: break-word;
          color: $color-white;
        }
        &:focus {
          outline: none;
        }
      }
    }
  }

  &-h {
    margin-bottom: 0px;
    &-left {
      padding-left: 0px;
    }
  }

  &-background {
    background-color: $color-dark-gray2;
    min-height: 358px;
    .space-right {
      margin-right: 0.375rem;
    }

    .empty-space-fill {
      height: 160px;
      margin-bottom: 23px;
    }

    .split-dropdown-button {
      height: 36px;
      margin-bottom: 0px;
      background: $color-dark-gray1;

      &:hover {
        background: $color-dark-gray2;
      }
    }

    .hr {
      margin-top: 30px;
      margin-bottom: 30px;
      border-top: 1px solid $color-dark-gray1;
    }

    .text-blue {
      color: $blue;
      margin-bottom: 24px;
    }

    .card-text:last-child {
      margin-bottom: 0px;
    }

    %innerSpan {
      color: $color-dark-gray1;
      font-size: 0.9rem;
      font-weight: 400;
    }

    .dealer-div {
      margin-top: 22px;
      margin-bottom: 0;
      span {
        @extend %innerSpan;
      }
    }

    .small-text-gray {
      &-hr {
        margin-top: 22px;
        margin-bottom: 0;
        span {
          @extend %innerSpan;
        }
      }

      span {
        @extend %innerSpan;
      }
      p {
        font-size: 20px;
        color: $color-white;
      }
    }
    .col-btn {
      .btn {
        margin-left: 0px;
        height: 40px;
        i {
          @extend %btn-font;
        }
        &-comment {
          width: 40px;
          padding: 0px;

          @extend %btn-font;
        }

        &-space-right {
          margin-right: 15px;
        }

        &-car {
          @extend %long;
          width: 160px;
        }

        &-checkout {
          @extend %long;
          width: 180px;
        }
      }
    }
  }

  &-text-gray {
    font-size: 22px;
    color: $color-dark-gray1;
  }

  &-title {
    margin-top: 30px;
  }
}
