@import '../../../master/settings/settings';

#preLightbox {
  padding:0;

  .pre_lightbox_content {

    .bullet_list_style {
      @include font-size($baseFontSize - 2px);

      li {
        margin-bottom: 2px;
      }

    }

    .pre_lightbox_option {
      display: table;
      cursor: pointer;
      width: 100%;
      padding: 40px 0px;
      border-bottom: 1px solid $grayLight;
      transition: background 300ms ease-in-out;

      &:last-of-type {
        border-bottom: none;
      }

      & > div {
        display: table-cell;
        width: 33%;
      }

      &:hover {
        background: lighten($blue, 50%);
      }

      &.is_selected {
        .option_cta_btn.check {
          display: none;
        }
        .option_cta_btn.uncheck {
          display: inline-block !important;
        }
      }

      .option_cta {
        padding-right: 20px;

        .option_cta_btn {
          outline: 0;

          .svg, .plus_icon {
            pointer-events: none;
          }

          .svg {
          }

          .plus_icon {
            border: none;
            color: $blue;
            float: left;
            margin-top: 8px;
            margin-right: 10px;
            font-weight: normal;
            margin-left: -5px;
            @include font-size($baseFontSize + 15px);
          }

          &.uncheck {
            display: none;
          }
        }

      }

      .option_image {
        text-align: center;
        max-width: 250px;


        img {
          vertical-align: text-top;
          mix-blend-mode: multiply;
          margin-left: 10px;
          max-width: 100%;
        }
      }

      .option_description {
        h3 {
          @include font-size($baseFontSize - 4px);
        }

        .option_price {
          color: $pricingRed;
          font-weight: bold;
          margin-top: 10px;
          @include font-size($baseFontSize + 4px);

          span {
            font-weight: normal;
            @include font-size($baseFontSize);
          }
        }

        .option_description_text {
          margin-top: 3px;
          @include font-size($baseFontSize - 1px);
        }
      }

      .option_cta {
        text-align: right;
        vertical-align: middle;
      }

    }

    .pre_lightbox_banner {
      img {
        max-width: 100%;
      }
    }

    .pre_lightbox_footer {
      padding: 25px 20px;
      text-align: right;
      margin: 0px 0px -10px;
      border-top: 1px solid $grayMedium;

      .pre_lightbox_footer_continue {
        margin: -7px -5px 5px 0;
        padding-left: 30px;
        padding-right: 30px;

        span {
          display: inline-block;
          margin-left: 10px;
          transform: scaleX(0.5);
          font-size: 31px;
          margin-right: -10px;
          float: right;
        }
      }

    }
  }
}


#pppModal, #preLightbox {
  .bullet_list_style {
    list-style-type: disc;
    margin: 15px 0 25px 30px;
    list-style-image: url('//media.officedepot.com/image/upload/f_auto,q_auto/gtools/images/us/od/common/checkmark-green.png');
    display: block;
    @include font-size($baseFontSize);
    li {
      margin-bottom: 8px;
    }
  }
}


.pre_lightbox_container.ui-dialog.ui-widget-content {
  padding: 0;

  .ui-dialog-titlebar {
    margin: 10px 0 0;
    padding: 5px 20px 12px;
    font-weight: bold;
    color: #363636;
    background: none;
    border-bottom: 1px solid $grayMedium;

    .ui-dialog-titlebar-close {
      right: 10px;
      top: 0;
    }
  }
}