html body { /* Restore original mobile layout - single image per row */ @media (max-width: 768px) { .col-md-6, .col-lg-6, .col-sm-6, .col-md-4, .col-lg-4, .col-sm-4, .col-md-3, .col-lg-3, .col-sm-3 { width: 100% !important; float: none !important; } .row.products .col, .row.products [class*="col-"] { width: 100% !important; flex: 0 0 100% !important; max-width: 100% !important; } } /* Quick view modal backdrop styling */ .modal-backdrop { background-color: rgba(0, 0, 0, 0.5) !important; opacity: 1 !important; z-index: 1040 !important; } .modal { z-index: 1050 !important; } .modal.show { display: block !important; } .modal.fade.show { opacity: 1 !important; } .modal-backdrop.show { opacity: 0.5 !important; } /* Ensure backdrop is visible */ .modal-backdrop { position: fixed !important; top: 0 !important; left: 0 !important; width: 100vw !important; height: 100vh !important; background-color: rgba(0, 0, 0, 0.5) !important; z-index: 1040 !important; }  /* Comprehensive backdrop fixes */ .modal-backdrop { display: block !important; opacity: 0.5 !important; background-color: rgba(0, 0, 0, 0.5) !important; } .modal-backdrop.fade { opacity: 0 !important; } .modal-backdrop.show { opacity: 0.5 !important; } .modal-backdrop.fade.show { opacity: 0.5 !important; } /* Force backdrop visibility */ body.modal-open { overflow: hidden !important; } .modal-backdrop { position: fixed !important; top: 0 !important; left: 0 !important; z-index: 1040 !important; width: 100vw !important; height: 100vh !important; background-color: rgba(0, 0, 0, 0.5) !important; } /* Quick view specific backdrop */ #quickViewModel + .modal-backdrop, .modal[id*="quickView"] + .modal-backdrop { background-color: rgba(0, 0, 0, 0.5) !important; opacity: 0.5 !important; z-index: 1040 !important; } }