.bganycombi_rib1, .bganycombi_rib2, .bganycombi_rib3, .bganycombi_rib4{width:120px;height:25px;line-height:25px;position:absolute;background:#ff0000; color:#fff; text-align:center;font-weight:bold; font-size:10px; left:-0;}
.bganycombi_rib1:after, .bganycombi_rib2:after, .bganycombi_rib3:after, .bganycombi_rib4:after{content:"";top: 0px !important;position:absolute;height:0;width:0;right:-14.5px;border-top:10px solid transparent;border-bottom:15px solid transparent; border-left:15px solid #ff0000}

.bganycombi_rib5, .bganycombi_rib6, .bganycombi_rib7, .bganycombi_rib8{width:120px;height:25px;line-height:25px;position:absolute;background:#ff0000; color:#fff; text-align:center;font-weight:bold; font-size:10px; right:-0;}
.bganycombi_rib5:after, .bganycombi_rib6:after, .bganycombi_rib7:after, .bganycombi_rib8:after{content:"";position:absolute;height:0;width:0;left:-14.5px;border-top:10px solid transparent;border-bottom:15px solid transparent; border-right:15px solid #ff0000}

.bganycombi_rib1, .bganycombi_rib5{top:-20px;}
.bganycombi_rib2, .bganycombi_rib6{top:40px;}
.bganycombi_rib3, .bganycombi_rib7{top:70px;}
.bganycombi_rib4, .bganycombi_rib8{top:100px;}

.product-thumb{overflow:hidden !important;position:inherit;}
ul.thumbnails li { position: relative; overflow: hidden; }

/* Product Offer Banner Responsive */
.product-offer-banner,
.cart-offer-banner {
  margin-bottom: 18px;
}

@media (max-width: 767px) {
  .product-offer-banner > div,
  .cart-offer-banner > div {
    flex-direction: column !important;
    text-align: center;
    gap: 15px !important;
  }
  .product-offer-banner > div > div:first-child,
  .cart-offer-banner > div > div:first-child {
    min-width: 100% !important;
  }
  .product-offer-banner .btn,
  .cart-offer-banner .btn {
    width: 100%;
  }
}

/* Modal Responsive */
@media (max-width: 767px) {
  #showofferat2_bganycombi .modal-dialog {
    margin: 10px;
  }
  #showofferat2_bganycombi .modal-body > div {
    padding: 15px !important;
  }
  #showofferat2_bganycombi .modal-body h5 {
    font-size: 14px !important;
  }
  #showofferat2_bganycombi .modal-body dl dt {
    font-size: 13px !important;
  }
  #showofferat2_bganycombi .modal-body dl dd {
    margin-left: 10px !important;
    font-size: 13px !important;
  }
  #showofferat2_bganycombi .modal-body .btn-lg {
    padding: 10px 20px !important;
    font-size: 14px !important;
  }
}

/* Modal CTA buttons responsive */
@media (max-width: 480px) {
  [id^="showofferat2_bganycombi"] .modal-body > div:last-child > div {
    flex-direction: column !important;
    gap: 10px !important;
  }
  [id^="showofferat2_bganycombi"] .modal-body > div:last-child .btn {
    width: 100%;
  }
}

/* Fix: Ensure modal and backdrop have proper z-index and positioning */
[id^="showofferat2_bganycombi"].modal {
  z-index: 1050 !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

/* Ensure modal dialog is positioned correctly */
[id^="showofferat2_bganycombi"] .modal-dialog {
  position: relative !important;
  margin: 30px auto !important;
  pointer-events: auto !important;
}

/* Ensure modal content receives pointer events */
[id^="showofferat2_bganycombi"] .modal-content {
  position: relative !important;
  pointer-events: auto !important;
  background-color: #fff !important;
}

/* Backdrop styling */
[id^="showofferat2_bganycombi"] + .modal-backdrop,
.modal-backdrop.bganycombi-backdrop,
.modal-backdrop.bganycombi-backdrop-handled {
  z-index: 1040 !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
}

/* Ensure close button is always clickable */
[id^="showofferat2_bganycombi"] .modal-header .close {
  position: relative !important;
  z-index: 1 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}