#ms-coupon-popup:empty {
  display: block;
}
.coupon-popup_wrapper {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
}
.coupon-popup_cover:empty {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  background: rgba(0, 0, 0, 0.45);
}
.coupon-popup_main {
  background-image: linear-gradient(var(--coupon_background_start_color, #FF0000), var(--coupon_background_end_color, #FF6E4F));
  border: 1px solid #797979;
  width: auto;
  max-width: 82rem;
  margin: 0 auto;
  padding: 4rem 0;
  position: relative;
  z-index: 9999;
}
.coupon-popup_close {
  padding: 1.5rem;
  line-height: 1;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 99;
  cursor: pointer;
}
.coupon-popup_close svg {
  width: 2rem;
  height: 2rem;
  color: var(--coupon_item_background_color, #FFFBF2);
}
.coupon-popup_list {
  padding: 0 5rem;
  max-height: calc(90vh - 4rem);
  overflow-y: auto;
}
.coupon-popup_list div:empty {
  display: initial;
}
/* width */
.coupon-popup_list::-webkit-scrollbar {
  width: .4rem;
  /* border-radius: .2rem; */
}

/* Track */
.coupon-popup_list::-webkit-scrollbar-track {
  background: rgba(255,255,255,0.2); 
  /* border-radius: .2rem; */
}

/* Handle */
.coupon-popup_list::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,0.6); 
  border:none;
  /* border-radius: .2rem; */
}

/* Handle on hover */
.coupon-popup_list::-webkit-scrollbar-thumb:hover {
  background: rgba(255,255,255,0.6); 
}
.coupon-popup_list-wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.coupon-popup_item {
  text-align: center;
  width: 32rem;
  margin: 0 1rem 1rem;
}
.coupon-popup_item-top {
  padding: 2rem 6rem 0;
  background: var(--coupon_item_background_color, #FFFBF2);
  border-top: 1rem solid var(--coupon_button_color, #EC01B6);
}
.coupon-popup_item-title {
  width: 100%;
  font-size: 22px;
  color: var(--coupon_title_color, #000);
  line-height: 1.5;
  font-weight: bold;
  text-align: center;
  /* white-space: nowrap; */
  /* overflow: hidden;
  text-overflow: ellipsis; */
}
.coupon-popup_item-desc {
  font-size: 1.6rem;
  color: var(--coupon_desc_color, #000);
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.coupon-popup_item-code {
  font-size: 1.6rem;
  color: var(--coupon_code_color, #EC01B6);
  line-height: 1.5;
  word-break: break-all;
}
.coupon-popup_item-middle {
  width: 100%;
}
.coupon-new-midd {
  width: 100%;
  height: 3.2rem;
  margin: 0 auto;
  position: relative;
  display: flex;
  align-items: center;
}

.coupon-new-midd .coupon-midd-bg {
  position: absolute;
  top: -0.2rem;
  bottom: -0.2rem;
  background: var(--coupon_item_background_color, #FFFBF2);
  left: 1.6rem;
  right: 1.6rem;
}

.coupon-new-midd .coupon-midd-edge {
  -webkit-box-flex: 0;
  flex: 0 0 1.6rem;
  height: 3.2rem;
  overflow: hidden;
  position: relative;
}

.coupon-new-midd .coupon-corner {
  width: 1.6rem;
  height: 1.6rem;
  overflow: hidden;
  position: relative;
  z-index: 1;
}

.coupon-new-midd .coupon-corner div {
  display: block;
  width: 200%;
  height: 200%;
  position: absolute;
  border-radius: 50%;
}

.coupon-new-midd .coupon-corner.coupon-corner-tr div {
  top: 0;
  right: 0;
  box-shadow: 0.8rem -0.8rem 0 0 var(--coupon_text_background_color, var(--coupon_item_background_color, #FFFBF2));
}

.coupon-new-midd .coupon-midd-circle {
  position: absolute;
  width: 3.2rem;
  height: 3.2rem;
  top: 0;
  border-radius: 50%;
}

.coupon-new-midd .coupon-midd-edge .coupon-midd-circle-left {
  right: 0;
}

.coupon-new-midd .coupon-corner.coupon-corner-br div {
  right: 0;
  bottom: 0;
  box-shadow: .8rem .8rem 0 0 var(--coupon_item_background_color, #FFFBF2);
}

.coupon-new-midd .coupon-midd-center {
  position: relative;
  -webkit-box-flex: 1;
  flex: 1;
  height: 3.2rem;
  display: flex;
  align-items: center;
  padding: 0 .8rem;
  background: var(--coupon_item_background_color, #FFFBF2);
}

.coupon-new-midd .coupon-midd-center div {
  -webkit-box-flex: 1;
  flex: 1;
  height: .2rem;
  background-size: .6rem .1rem;
  background-repeat: repeat-x;
  background-image: linear-gradient(90deg, #EFEFEF 0, #EFEFEF 50%, transparent 0);
}

.coupon-new-midd .coupon-corner.coupon-corner-tl div {
  top: 0;
  left: 0;
  box-shadow: -0.8rem -0.8rem 0 0 var(--coupon_item_background_color, #FFFBF2);
}

.coupon-new-midd .coupon-midd-edge .coupon-midd-circle-right {
  left: 0;
}

.coupon-new-midd .coupon-corner.coupon-corner-bl div {
  left: 0;
  bottom: 0;
  box-shadow: -0.8rem .8rem 0 0 var(--coupon_item_background_color, #FFFBF2);
}
.coupon-popup_item-bottom {
  padding: .4rem 0 2rem;
  background: var(--coupon_item_background_color, #FFFBF2);
  margin-top: -1px;
  position: relative;
}
.coupon-popup_item-btn {
  max-width: 80%;
  min-width: 17rem;
  line-height: 2.1rem;
  padding: .8rem 1rem;
  font-size: 1.4rem;
  background: var(--coupon_button_color, #EC01B6);
  color: var(--coupon_button_text_color, #fff);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin: 0 auto;
}
.coupon_popup-input-code {
  width: 100%;
  height: 1px;
  overflow: hidden;
  opacity: 0;
  padding: 0;
  margin: 0;
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
}
/* .coupon-popup_item-disabled {
  filter: grayscale(.65);
  -webkit-filter: grayscale(.65);
  pointer-events: none;
  cursor: no-drop;
} */
.coupon-popup_item-disabled .coupon-popup_item-top{
  background: #FFFBF2;
  border-top-color: #797979;
  
}
.coupon-popup_item-disabled .coupon-popup_item-title, 
.coupon-popup_item-disabled .coupon-popup_item-desc, 
.coupon-popup_item-disabled .coupon-popup_item-code {
  color: #797979;
}
.coupon-popup_item-disabled .coupon-new-midd .coupon-midd-bg, 
.coupon-popup_item-disabled .coupon-popup_item-bottom {
 background: #FFFBF2;
}
.coupon-popup_item-disabled .coupon-popup_item-btn {
  background: #797979;
  color: #fff;
  pointer-events: none;
  cursor: not-allowed;
}
.coupon-popup_item-disabled .coupon-new-midd .coupon-corner.coupon-corner-tr div {
 box-shadow: 0.8rem -0.8rem 0 0 #FFFBF2;
}


/*优惠券轮播*/
.coupon-popup_list[data-trigger_type="2"] {
  width: 34rem;
  height: auto;
  padding: 0;
  margin: 0 4rem;
}
.coupon-popup_list[data-trigger_type="2"] .coupon-popup_list-wrapper{
  width: 100%;
  flex-wrap: nowrap;
  justify-content: flex-start;
}
.coupon-popup_list[data-trigger_type="2"] .coupon-popup_list-wrapper .coupon-popup_item {
  min-width: 34rem;
  margin: 0;
}

.coupon-popup_list-controls[data-trigger_type="0"],
.coupon-popup_list-controls[data-trigger_type="1"] {
  display: none;
}
.coupon-popup_list-controls .swiper-pagination .swiper-pagination-bullet {
  background: none;
  border: 1px solid #fff;
  opacity: 1;
}
.coupon-popup_list-controls .swiper-pagination .swiper-pagination-bullet-active {
  background: #fff;
}

@media screen and (max-width: 750px) {
  .coupon-popup_main {
    max-width: 32rem;
  }
  .coupon-popup_close {
    padding: 1rem;
  }
  .coupon-popup_list {
    padding: 0;
    height: auto;
    margin: 0 2rem;
  }
  .coupon-popup_list-wrapper {
    flex-wrap: nowrap;
    justify-content: flex-start;
  }
  .coupon-popup_item {
    width: 28rem;
    margin: 0;
  }
  .coupon-popup_item-top {
    padding: 1rem 2rem 0;
  }
  .coupon-popup_item-bottom {
    padding-bottom: 1.5rem;
  }
  .coupon-popup_list-controls[data-trigger_type="0"],
  .coupon-popup_list-controls[data-trigger_type="1"] {
    display: block;
  }
  .coupon-popup_list[data-trigger_type="2"] .coupon-popup_list-wrapper .coupon-popup_item {
    min-width: 28rem;
  }
  
}