#maincontent .bundle-options-container .bundle-options-wrapper, .bundle-options-container .product-options-wrapper{ float: right; } #maincontent .bundle-options-container .block-bundle-summary{ float: left; } #maincontent .bundle-options-container .product-add-form{ display: inline-block; } .options-list img { cursor: pointer; } .large { display: none; position: absolute; color: #FFFFFF; background: #fff; padding: 10px; z-index:10; box-shadow:0px 0px 3px rgba(0, 0, 0, 0.1) } .accodion-items .productShortDesc.margin-left-none{margin-left: 0px;} /****************add css by shiva*************/ .bundle-options-container .product-add-form .block-bundle-summary{margin:0px; padding:0px; box-shadow:0 1px 1px rgba(0, 0, 0, 0.05); border:1px solid #e4e4e4; width:100%; padding-bottom:15px; box-sizing:border-box } .is-sticky .block-bundle-summary{top:10px!important; width:370px!important; } .bundle-options-container .product-add-form .block-bundle-summary .bundle-summary{margin-top:0px; } .bundle-options-container .product-add-form .block-bundle-summary .content{padding-left:15px; padding-right:15px; margin-top: 15px;} .bundle-options-container .product-add-form .block-bundle-summary .bundle-summary .subtitle{padding:10px 15px; margin:0px 0px; width:inherit; margin-left:-15px; margin-right:-15px; background:linear-gradient(to bottom, #f9f9f9 0%, #eeeeee 100%); color:#333; margin-bottom:15px; font-weight:normal;} .bundle-options-container .product-add-form .block-bundle-summary .content .box-tocart{margin-bottom:0px;} .bundle-options-container .product-add-form .block-bundle-summary .box-tocart .action.primary{width:100%; margin-right:0px; } .bundle-options-container .product-add-form .block-bundle-summary .box-tocart .qty .label{padding:5px 0px 0px 0px; width:50px; float:left; } .bundle-options-container .product-add-form .block-bundle-summary .content .price-box .price-as-configured .price-wrapper .price{color:#1979c3; font-size:28px; } .bundle-options-container .product-add-form .bundle-options-wrapper{width:100%; padding-left:40px; box-sizing:border-box; } .bundle-options-container .product-add-form .bundle-options-wrapper .product-options-wrapper{width:100% } .bundle-options-container .product-options-wrapper .fieldset .fieldset-bundle-options .choice{margin-bottom:10px; padding:0px; border:0px; float:left; width:90%; padding-top:15px; } .product-add-form .product-options-wrapper .fieldset .field h3.bundle-toggle{ background:linear-gradient(to bottom, #f9f9f9 0%, #eeeeee 100%); color:#333; font-size:20px; border:1px solid #e4e4e4; padding:13px 15px; width:auto; display: block; margin:0px; box-sizing:border-box; font-weight:normal; position:relative; cursor:pointer;} .product-options-wrapper .fieldset .field h3.bundle-toggle:after{position:absolute; content:""; background:url(../images/accodion-arrow.png) no-repeat; width:14px; height:25px; right:18px; top:10px; } .product-options-wrapper .fieldset .control{border:1px solid #e4e4e4; border-top:0px; padding:0px; box-sizing:border-box; width:100%!important; float:left; } .advance-summery-container .subtitle{ background:linear-gradient(to bottom, #f9f9f9 0%, #eeeeee 100%); color:#333; font-size:20px; border:1px solid #e4e4e4; padding:13px 15px; width:auto; display: block; margin:0px; box-sizing:border-box; font-weight:normal; position:relative;} .bundle-options-wrapper .product-info-price{width:100%; position:relative; box-sizing:border-box; margin-bottom:20px; min-height:300px; border:1px #e4e4e4 solid; padding:75px 20px 20px 290px; } .bundle-options-wrapper .product-info-price p:empty{display:none } .bundle-options-wrapper .product-info-price .bundle-product-image{width:250px; position:absolute; left:0px; } .bundle-options-wrapper .product-info-price h1{background:linear-gradient(to bottom, #f9f9f9 0%, #eeeeee 100%); color:#333; font-size:20px; border:1px solid #e4e4e4; padding:13px 15px; width:100%; margin:0px; box-sizing:border-box; font-weight:normal; position:absolute; cursor:default; left:0px; top:0px; border:0px;} .bundle-options-wrapper .product-info-price p{font-size:15px; padding:0px 0px 10px 0px; } .bundle-options-wrapper .product-info-price ul{padding:0px 0px 15px 12px ; margin:0px; } .bundle-options-wrapper .product-info-price ul li{list-style:outside none circle; margin:0px 0px 6px 0px } .bundle-options-wrapper .product-info-price .price-box .price-container .price-wrapper .price{color:#1979c3; font-size:28px; } .accodion-items{box-sizing:border-box; width:100%; border-top:1px solid #eeeeee; margin-bottom:0px; padding:10px 15px ; float:left; } .choice .none-option{min-height:45px; } .options-list{float:left; width:100%; } .options-list .accodion-items:first-child{border-top:0px; } .accodion-items .image-thumb{width:10%; float:left; } .header-main{width:100%; position:relative; box-sizing:border-box; margin-bottom:0px; border:1px #e4e4e4 solid; text-align:center} .header-main .header-title{background:linear-gradient(to bottom, #f9f9f9 0%, #eeeeee 100%); color:#333; font-size:20px; border:1px solid #e4e4e4; padding:13px 15px; width:100%; margin:0px; box-sizing:border-box; font-weight:normal; border:0px;} .header-main .header-content{padding:25px 15px ; } .accodion-items .choice .label span a.opemmodalpopup{width:100%; display:block; background:url(../images/search-icon.png) no-repeat right center } .accodion-items .choice .label a.opemmodalpopup{width:100%; display:block; background:url(../images/search-icon.png) no-repeat right center } .accodion-items a.opemmodalpopup{width:100%; display:block; background:url(../images/search-icon.png) no-repeat right center } .accodion-items .bundle-view-item{display: inline-block; width: 15%; float: right; text-align: center;} .accodion-items .bundle-view-item a.opemmodalpopup{cursor: pointer;width:20px; height: 20px; display:inline-block; background:url(../images/search-icon.png) no-repeat right center } .accodion-items .bundle-view-item a.opemmodalpopup:hover{text-decoration: none;} .bundle-options-wrapper .bundle-options-container .product-options-bottom{border-top:0px; padding-top:0px; } .fieldset-bundle-options .field.option{width:100%; float:left; border:0px!important; padding:0px!important; } .accodion-items .short-disc{cursor: pointer;} .accodion-items .short-disc.margin-left{margin-left: 42px;} .accodion-items .short-disc:after{ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 12px; line-height: 12px; color: inherit; content: '\e622'; font-family: 'luma-icons'; vertical-align: middle; display: inline-block; font-weight: normal; overflow: hidden; speak: none; text-align: center; color: #8f8f8f; margin: 0 0 0 5px; position: static; } .accodion-items .short-disc.active:after{ content: '\e621'; } .accodion-items .productShortDesc{margin: 10px 0px 0px 42px;} select.multiselect.product.bundle{width: 100%;} /*******Popup css************/ .page-product-bundle .modal-inner-wrap .modal-header{border-bottom:1px solid #e5e5e5; width:100%; margin-bottom:25px; padding:20px 15px; box-sizing:border-box; } .page-product-bundle .modal-inner-wrap .modal-header h1.modal-title{border-bottom:0px; font-weight:normal; margin-bottom:0px; padding-bottom:0px; font-size:24px; } .page-product-bundle .modal-inner-wrap .modal-content .productName{width:100%; border-bottom:1px #ccc solid; padding-bottom:15px; } .page-product-bundle .modal-inner-wrap .modal-content .productImage{float:left; width:40%; } .page-product-bundle .modal-inner-wrap .modal-content .productDesc{float:right; width:60%; box-sizing:border-box; padding:0px 0px 0px 25px; text-align:left } .page-product-bundle .modal-inner-wrap .modal-content .addbutton{float:right; width:60%; box-sizing:border-box; padding:0px 0px 0px 25px; text-align:left } .modal-inner-wrap .modal-content .addbutton .addItem{background:#1979c3; color:#fff; padding:8px 15px; border:0px; border-radius:2px; font-size:16px; } .modal-inner-wrap .modal-content .addbutton .addItem2{background:#1979c3; color:#fff; padding:8px 15px; border:0px; border-radius:2px; font-size:16px; } .page-product-bundle .modal-inner-wrap .modal-content .productDesc ul{padding:0px 0px 15px 12px ; margin:0px; } .page-product-bundle .modal-inner-wrap .modal-content .productDesc ul li{list-style:outside none circle; } .page-product-bundle .modal-popup .modal-inner-wrap .modal-footer{padding:20px;border-top:1px solid #e5e5e5; } .bundle-options-container .product-add-form .center-summary{width: 100%;} .close-link a {background: rgba(0, 0, 0, 0) url("../images/close-btn.png") no-repeat scroll right center; display: block; width: 20px; height: 20px;} .close-link { float: right; width: auto;} .price-as-configured .price-wrapper .price { font-size: 28px; color: #1979c3;} .nested.options-list.btm-smry { padding:15px; box-sizing: border-box;} .block-bundle-summary .bundle.items > li { border-bottom: 1px dashed #ccc; padding-bottom: 8px;} .btm-smry .accodion-items { padding: 10px 0;} .btm-smry .action.primary.tocart { width: 100%;} .btm-smry .field .label { float: left;} .btm-smry .field .control { float: left; margin-left: 25px; width: auto!important;} .btm-smry .field.qty { width: 100%; display: inline-block; float: left;} .bundle-options-container .nested .field.qty > .label { padding-top: 4px;} .bundle-options-container .product-options-bottom {border-top: 0;} .bundle.items > li { position: relative;} .close-link {position: absolute; right: 0; top: 0;} .btm-smry .accodion-items {border-bottom: 1px solid #eee; margin-bottom: 12px; padding: 0 0 8px;} .btm-smry .accodion-items { border-top: 0;} .btm-smry .box-tocart { margin: 0;} .product-options-wrapper .fieldset .kit-smry h3.bundle-toggle::after { background: rgba(0, 0, 0, 0) none repeat scroll 0 0;} .smry-option { position: relative; margin-top: 3px; } .bundle-options-container .product-add-form .advance-summery-container .sticky-add-to-cart{display: none;} .fieldset > .field:last-child, .fieldset > .fields > .field:last-child { margin-bottom: 20px; } .product-options-wrapper .fieldset.fieldset-bundle-options { margin-bottom: 0; } .modal-form .itemAdded { float: right; font-size: 16px; font-weight: bold; padding-left: 25px; text-align: left; width: 60%; box-sizing: border-box; } .hideoption{display: none;} .advance-ext-option{ background-image:url("../images/image_unselected.png"); background-position:20px; background-size: 20px 20px; background-repeat: no-repeat; padding-left:42px; margin: 10px 0px; } .advance-ext-option.selected{background-image:url("../images/image_selected.png");} .modal-form .product-link { float: right; font-size: 16px; font-weight: bold; padding-left: 25px; text-align: left; width: 60%; box-sizing: border-box; padding-top:10px; } /* Added on 10-08-2018 */ .bundle-options-container .product-options-wrapper .fieldset .fieldset-bundle-options .choice label.label{display: inline-block; position: relative;} .modal-popup .modal-footer .advance_modal{display: none;} .inactive{display: none;} .advance-ext{ background-repeat: no-repeat; padding-left:50px; padding-top: 10px; padding-bottom: 10px; color: #006bb4; cursor: pointer; } #maincontent .bundle-options-container .advance-summery-container{ display: inline-block; width: 100%; } .blocks-promo .collection-eco{height: auto;} .productImage .owl-prev, .productImage .owl-next { position: absolute; top: 50%; transform: translateY(-50%); font-size: 36px !important; box-shadow: none !important; background: #1979c3 !important; height: 36px; width: 36px; border-radius: 100%; color: #fff !important; } .productImage .owl-prev { left: 1rem; } .productImage .owl-next { right: 1rem; } .productImage .owl-prev span, .productImage .owl-next span{ height: 100%; line-height: 28px; display: block; } @media only screen and (max-width: 1180px) { .is-sticky .block-bundle-summary{width:30%!important } } @media only screen and (max-width:768px) { .bundle-options-container .product-add-form .block-bundle-summary{width:100%!important; position:relative!important; top:0px!important; margin-bottom:15px; } .bundle-options-container .product-add-form .bundle-options-wrapper{padding-left:0px; width:100%; } /*#bundleSummary .content{display: none;}*/ .advance-summery-container .subtitle:after{cursor:pointer; position:absolute; content:""; background:url(../images/accodion-arrow.png) no-repeat; width:14px; height:25px; right:18px; top:10px; } #maincontent .bundle-options-container .block-bundle-summary{padding:0px; } } @media only screen and (max-width:767px) { .bundle-options-container{margin-top:15px; } .bundle-options-container .product-add-form .advance-summery-container .sticky-add-to-cart .box-tocart .qty{ display: none; } .bundle-options-container .product-add-form .advance-summery-container .sticky-add-to-cart{display: block;} .bundle-options-container .product-add-form .advance-summery-container .sticky-add-to-cart .box-tocart .action.primary{ position: fixed; bottom:0px; left: 0px; border-radius:0px; width: 100%; z-index: 50; margin-bottom:0px; } .bundle-options-container .product-add-form .advance-summery-container .sticky-add-to-cart .price-box .price-as-configured .price-wrapper .price{ position: fixed; right: 15px; bottom: 12px; color: #fff; z-index: 51; font-size: 18px; } .bundle-options-container .product-add-form .advance-summery-container .block-bundle-summary .box-tocart .action.primary{ display: none; } .bundle-options-container .product-add-form .advance-summery-container .mobile-summary-view{ display: none; } .bundle-options-container .product-add-form .advance-summery-container .block-bundle-summary .price-box .price-as-configured .price-wrapper .price{ display: none; } } @media only screen and (max-width:639px) { .bundle-options-wrapper .product-info-price{ padding-left: 20px; display: inline-block; float: left; } .bundle-options-wrapper .product-info-price .bundle-product-image { width: 100%; position: static; max-width: 250px; } .page-product-bundle .modal-inner-wrap .modal-content .productImage { width: 100%; margin-bottom: 20px; } .page-product-bundle .modal-inner-wrap .modal-content .productDesc { width: 100%; } .options-list .accodion-items .image-thumb{ width: auto; float: none; } .bundle-options-container .product-options-wrapper .fieldset .fieldset-bundle-options .choice{ width: 100%; float: none; position: relative; } .accodion-items .bundle-view-item{ position: absolute; top: -39px; right: 0; } } /* Defensive rule: force summary to be non-sticky in case another module instantiates StickySidebar */ .advance-summery-container .sticky-sidebar, .advance-summery-container.is-sticky, .advance-summery-container .block-bundle-summary.is-sticky { position: static !important; top: auto !important; } .bundle-option-wrapper .bundle-wizard-tabs, .bundle-options-wrapper .bundle-wizard-tabs, .bundle-wizard-tabs{ display:flex !important; flex-wrap:wrap !important; margin:0 0 15px !important; padding:0 !important; gap:8px !important; z-index: 2147483646 !important; } .bundle-option-wrapper .bundle-wizard-tab, .bundle-wizard-tab{ background:#f5f5f5 !important; border:1px solid #e4e4e4 !important; padding:8px 12px !important; border-radius:3px !important; cursor:pointer !important; box-shadow:none !important; } .bundle-option-wrapper .bundle-wizard-tab.active, .bundle-wizard-tab.active{ background:#1979c3 !important; color:#fff !important; border-color:#1979c3 !important; outline:none !important; z-index: 3 !important; } .bundle-wizard-tab .tab-label{font-size:14px !important} /* Gallery grid column helpers: 1..6. Uses float-based layout consistent with existing styles. */ .gallery-main.row-1g .field.choice{width:100%; float:none} .gallery-main.row-2g .field.choice{width:50%; float:left} .gallery-main.row-3g .field.choice{width:33.3333%; float:left} .gallery-main.row-4g .field.choice{width:25%; float:left} .gallery-main.row-5g .field.choice{width:20%; float:left} .gallery-main.row-6g .field.choice{width:16.6667%; float:left} @media only screen and (max-width:767px) { /* Always stack to single column on small viewports */ .gallery-main.row-1g .field.choice, .gallery-main.row-2g .field.choice, .gallery-main.row-3g .field.choice, .gallery-main.row-4g .field.choice, .gallery-main.row-5g .field.choice, .gallery-main.row-6g .field.choice{ width:100% !important; float:none !important; display:block !important; box-sizing:border-box; clear:both; } } /* Nav layout: strong specificity and important rules to resist theme overrides */ .bundle-option-wrapper .bundle-wizard-nav, .bundle-options-wrapper .bundle-wizard-nav, .bundle-wizard-nav{ margin-top:12px !important; display:flex !important; justify-content:space-between !important; align-items:center !important; padding:8px 12px !important; width:100% !important; box-sizing:border-box !important; } .bundle-wizard-nav .action{ background:#1979c3 !important; color:#fff !important; border:0 !important; padding:8px 14px !important; border-radius:3px !important; cursor:pointer !important; min-width:110px !important; } .bundle-wizard-nav .action.back{background:#f4f4f4 !important;color:#333 !important} .bundle-wizard-nav .left-actions{display:flex !important;gap:8px !important} .bundle-wizard-nav .right-actions{display:flex !important;gap:8px !important} .bundle-wizard-nav-placeholder{display:block !important;width:100% !important} /* Sticky state: fix nav to bottom of viewport with important flags */ .bundle-option-wrapper .bundle-wizard-nav.sticky, .bundle-options-wrapper .bundle-wizard-nav.sticky, .bundle-wizard-nav.sticky{ position:fixed !important; left:0 !important; right:0 !important; bottom:0 !important; z-index:2147483647 !important; /* max z-index to avoid being covered */ box-shadow:0 -2px 12px rgba(0,0,0,0.12) !important; background:#fff !important; padding:12px 18px !important; } /* Ensure tabs stay above nav and theme overlays */ .bundle-wizard-tabs{z-index:2147483646 !important} .wizard-step-error{color:#c00;margin-bottom:10px} /* Reduce flicker: ensure no transitions on position and keep rendering stable */ .bundle-wizard-nav, .bundle-wizard-nav.sticky{ -webkit-backface-visibility: hidden !important; backface-visibility: hidden !important; will-change: transform !important; transform: translateZ(0) !important; transition: none !important; } /* Arrow-step style for wizard tabs (inspired by CodePen ZbYxQo) */ .bundle-option-wrapper .bundle-wizard-tabs, .bundle-wizard-tabs{ display:flex !important; flex-wrap:wrap !important; /* allow wrapping on small screens */ align-items:stretch !important; gap:0 !important; } .bundle-option-wrapper .bundle-wizard-tab, .bundle-wizard-tab{ position:relative !important; padding:0 26px 0 18px !important; /* horizontal padding; vertical space via height */ margin-right:0 !important; color:inherit !important; display:inline-flex !important; align-items:center !important; height:var(--tab-h) !important; /* fixed height to keep triangle matched */ line-height:1 !important; transition: background-color .18s ease, color .18s ease, border-color .18s ease, transform .18s ease !important; } /* Arrow (single pseudo-element) for tabs. Use CSS variables so arrow height matches tab height. */ .bundle-option-wrapper .bundle-wizard-tab, .bundle-wizard-tab{ --tab-h: 44px !important; /* default tab height; matches min-height set earlier */ --tri-w: 18px !important; /* triangle width */ } .bundle-option-wrapper .bundle-wizard-tab:after, .bundle-wizard-tab:after{ content: '' !important; position: absolute !important; top: 50% !important; right: calc(var(--tri-w) * -0.5) !important; /* overlap half the triangle */ transform: translateY(-50%) !important; width: 0 !important; height: 0 !important; border-top: calc(var(--tab-h) / 2) solid transparent !important; border-bottom: calc(var(--tab-h) / 2) solid transparent !important; border-left: var(--tri-w) solid #f5f5f5 !important; /* same as tab bg */ z-index: 2 !important; transition: border-left-color .18s ease, transform .18s ease !important; } /* Active tab styling: change triangle color to match active bg */ .bundle-option-wrapper .bundle-wizard-tab.active:after, .bundle-wizard-tab.active:after{ border-left-color: #1979c3 !important; } /* When next tab is active, we also want the connecting triangle to match the active color. The next sibling's pseudo-element overlaps, so make sure the active state sets its own color. No additional :before element is used to avoid double-arrow effects. */ /* Hover/focus states */ .bundle-option-wrapper .bundle-wizard-tab:hover, .bundle-wizard-tab:hover, .bundle-option-wrapper .bundle-wizard-tab:focus, .bundle-wizard-tab:focus{ background:#e9f2fb !important; color:#1979c3 !important; border-color: transparent !important; outline: none !important; box-shadow: none !important; z-index: 3 !important; /* bring hovered/focused tab above neighbors to avoid visual double-arrow */ } /* Ensure the arrow matches hover background when hovering */ .bundle-option-wrapper .bundle-wizard-tab:hover:after, .bundle-wizard-tab:hover:after{ border-left-color: #e9f2fb !important; transform: translateY(-50%) scale(1.01) !important; /* tiny scale for subtle animation */ } /* Responsive: on small screens allow full-width stacked tabs and hide arrows */ @media only screen and (max-width: 767px) { .bundle-option-wrapper .bundle-wizard-tabs, .bundle-wizard-tabs{ display:block !important; } .bundle-option-wrapper .bundle-wizard-tab, .bundle-wizard-tab{ display:block !important; width:100% !important; padding:12px 16px !important; height:auto !important; /* allow stacked tabs to size to content */ } .bundle-option-wrapper .bundle-wizard-tab:after, .bundle-wizard-tab:after{ display:none !important; } } /* Modal that hosts the full-screen wizard when "Customize Your Jeans" is clicked */ /* Full-page loader overlay */ .advance-page-loader{ position:fixed; inset:0; background:#fff; display:flex; align-items:center; justify-content:center; z-index:2147483655; transition: opacity 240ms ease; opacity:1; } .advance-page-loader.hidden{opacity:0; pointer-events:none; display:none !important} .advance-loader-inner{ text-align:center; } .advance-loader-inner svg{ display:block; margin:0 auto 12px; } .advance-loader-inner .loader-caption{ font-size:14px; color:#333; } /* Simple full-screen modal (minimal, hosts an empty .modal-content) */ .noesis-simple-modal{ position:fixed; inset:0; display:none; align-items:center; justify-content:center; z-index:2147483650; } .noesis-simple-modal.open{display:flex;} .noesis-simple-modal__backdrop{ position:absolute; inset:0; background:rgba(0,0,0,0.6); } .noesis-simple-modal__panel{ position:relative; width:100%; height:100%; box-sizing:border-box; background:#fff; overflow:auto; } .noesis-simple-modal__close{ position:absolute; right:12px; top:12px; z-index:10; background:transparent; border:0; font-size:28px; line-height:1; cursor:pointer; } .noesis-simple-modal__content{ width:100%; height:100%; } /* When modal open prevent body scroll */ .noesis-modal-open{ overflow: hidden !important; } /* Ensure third-party/lightbox modals (e.g. the magnifier) render above our simple modal. Many lightbox libraries create an