@import 'css/master/settings/settings';

#contentWrapper.productResponsive .skuOverview .skuImage {
  position: relative;
  z-index: 10;
}

#imageViewer.s7mixedmediaviewer {
  height: 500px;

  [data-namespace='s7classic'].s7flyoutzoomview .s7flyoutzoom {
    margin-left: 465px;
    width: 498px !important;
    border: 1px solid $grayLight !important;
    z-index: 999 !important;
  }

  .s7container[mode='fullscreen'] {
    [data-namespace='s7classic'].s7flyoutzoomview .s7flyoutzoom {
      margin-left: 0;
      border: none !important;
      width: 100% !important;
    }
  }

  .s7container[mode='normal'] {
    .s7flyoutzoomview .s7highlight {
      background: $white !important;
      border: 1px solid $grayLight;
      opacity: .6 !important;
    }

    .s7staticimage {
      cursor: crosshair;
    }
  }

  .s7tooltip {
    display: none !important;
  }

  .s7swatches {
    .s7scrollleftbutton {
      background-size: auto;
      width: 22px !important;
      height: 54px !important;
      top: 24px !important;

      &[state="up"] {
        background: url('//media.officedepot.com/image/upload/f_auto,q_auto/gtools/images/od/new/carousel-btn-sprites.png') no-repeat -4px -48px !important;
      }
      &[state="over"], &[state="down"] {
        background: url('//media.officedepot.com/image/upload/f_auto,q_auto/gtools/images/od/new/carousel-btn-sprites.png') no-repeat -4px -96px !important;
      }
      &[state="disabled"] {
        background: url('//media.officedepot.com/image/upload/f_auto,q_auto/gtools/images/od/new/carousel-btn-sprites.png') no-repeat -4px 0 !important;
      }
    }

    .s7scrollrightbutton {
      background-size: auto;
      width: 20px !important;
      height: 54px !important;
      top: 24px !important;

      &[state="up"]{
        background: url('//media.officedepot.com/image/upload/f_auto,q_auto/gtools/images/od/new/carousel-btn-sprites.png') no-repeat -39px -48px !important;
      }
      &[state="over"], &[state="down"]{
        background: url('//media.officedepot.com/image/upload/f_auto,q_auto/gtools/images/od/new/carousel-btn-sprites.png') no-repeat -39px -96px !important;
      }
      &[state="disabled"]{
        background: url('//media.officedepot.com/image/upload/f_auto,q_auto/gtools/images/od/new/carousel-btn-sprites.png') no-repeat -39px 0 !important;
      }
    }
    .s7thumb[state="selected"] {
      border: 1px solid #dddddd !important;
    }

    .s7thumbcell.selected .s7thumb {
      border: 1px solid $gray !important;
    }
  }
}

.s7thumbcell {
  cursor: pointer;
}

#imageViewer_controls {
  display: none !important;
}

#imageViewer_videoPlayer {
  background-color: $white !important;
  & > div {
    display: none !important;
  }
}

#imageViewer_toolbarContainer {
  display: none !important;
}

#fullScreenImage {
  width: 100%;
  height: 100%;
  position: fixed;
  background: $white;
  z-index: 9999999;
  top: 0;
  left: 0;
  .s7fullscreenbutton {
    display: none !important;
  }
  .s7flyoutzoom {
    display: none !important;
  }
  .s7tip {
    display: none !important;
  }
}

#fullScreenImageClose {
  position: absolute;
  right: 20px;
  top: 20px;
  cursor: pointer;
  z-index: 9999999;
  svg {
    fill: $gray;
  }
}

#fullScreenButton {
  display: none;
  cursor: pointer;
  position: absolute;
  right: 0;
  z-index: 999;
  width: 36px;
  height: 36px;
  margin-top: -36px;

  svg {
    fill: $black;
  }
}


@include breakpoint-minmax(sm-md) {
  #fullScreenButton {
    margin-top: -100px;
  }
  #imageViewer_swatches.s7swatches {
    bottom: -15px;
  }
}


.main_sku_image {
  width: 450px;
  height: 450px;
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;

  .product_image_overlay {
    background: $white;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
  }
}

#imageViewer_container {
  z-index: 3;
}

//IE 9

.viewer-ie9 {
  .main_sku_image {
    .product_image_overlay {
      display: none !important;
    }
  }
  #imageViewer_container {
    z-index: 0;
  }
  [data-namespace='s7classic'].s7spinview {
    background-color: transparent !important;
  }
}