.loading-screen { opacity:1; } .loading-screen.is-inactive { opacity: 0; } @media screen and (max-width: 991px) .sticky_bar.is-active { display: block; z-index: 9999999; } } .text-block-188 { padding-left: .25rem; padding-right: .25rem; font-size: .5rem; padding-top: 0.05rem; } .gift-title_text { font-size: .55rem; line-height: 1.25; } .gift_card { padding: 0; } @media screen and (max-width: 479px) { .gift-title_text { font-size: 2vw; } } html.wf-loading * { opacity: 0; } body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-smoothing: antialiased; text-rendering: optimizeLegibility; } *[tabindex]:focus-visible, input[type="file"]:focus-visible { outline: 0.125rem solid #4d65ff; outline-offset: 0.125rem; } .w-richtext > :not(div):first-child, .w-richtext > div:first-child > :first-child { margin-top: 0 !important; } .w-richtext>:last-child, .w-richtext ol li:last-child, .w-richtext ul li:last-child { margin-bottom: 0 !important; } .pointer-events-off { pointer-events: none; } /* Enables all click and hover interaction with an element */ .pointer-events-on { pointer-events: auto; } /* Create a class of .div-square which maintains a 1:1 dimension of a div */ .div-square::after { content: ""; display: block; padding-bottom: 100%; } /* Make sure containers never lose their center alignment */ .container-medium,.container-small, .container-large { margin-right: auto !important; margin-left: auto !important; } .text-style-3lines { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } .text-style-2lines { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .display-inlineflex { display: inline-flex; } /* These classes are never overwritten */ .hide { display: none !important; } @media screen and (max-width: 991px), @media screen and (max-width: 767px), @media screen and (max-width: 479px){ .hide, .hide-tablet{ display: none !important; } } @media screen and (max-width: 767px) .hide-mobile-landscape{ display: none !important; } } @media screen and (max-width: 479px) .hide-mobile{ display: none !important; } } .margin-0 { margin: 0rem !important; } .padding-0 { padding: 0rem !important; } .spacing-clean { padding: 0rem !important; margin: 0rem !important; } .margin-top { margin-right: 0rem !important; margin-bottom: 0rem !important; margin-left: 0rem !important; } .padding-top { padding-right: 0rem !important; padding-bottom: 0rem !important; padding-left: 0rem !important; } .margin-right { margin-top: 0rem !important; margin-bottom: 0rem !important; margin-left: 0rem !important; } .padding-right { padding-top: 0rem !important; padding-bottom: 0rem !important; padding-left: 0rem !important; } .margin-bottom { margin-top: 0rem !important; margin-right: 0rem !important; margin-left: 0rem !important; } .padding-bottom { padding-top: 0rem !important; padding-right: 0rem !important; padding-left: 0rem !important; } .margin-left { margin-top: 0rem !important; margin-right: 0rem !important; margin-bottom: 0rem !important; } .padding-left { padding-top: 0rem !important; padding-right: 0rem !important; padding-bottom: 0rem !important; } .margin-horizontal { margin-top: 0rem !important; margin-bottom: 0rem !important; } .padding-horizontal { padding-top: 0rem !important; padding-bottom: 0rem !important; } .margin-vertical { margin-right: 0rem !important; margin-left: 0rem !important; } .padding-vertical { padding-right: 0rem !important; padding-left: 0rem !important; } :-moz-selection { color: #fff; background: #2a2552;} ::selection { color: #fff; background: #2a2552;} /* *:focus { outline: none; } */ [bshadow-01] { box-shadow: 0 0 0 1px #2b1a701f, 0 1px 2px #351a701f, 0 8px 16px #3c1a7014, 0 3px 8px #1a687033, 0 -3px #efeff0 inset; } video { width:100%; } .w-nav-overlay { overflow: auto!important; } .javy-banner { background: linear-gradient(-45deg, #3d348b, #3d348b, #e95383, #948ec9); background-size: 400% 400%; animation: gradient 15s ease infinite; } .horizontal-scroll::-webkit-scrollbar { display: none; } /* Hide scrollbar for IE, Edge and Firefox */ .horizontal-scroll { -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; /* Firefox */ } /* Scrollbar height */ .horizontal-scroll::-webkit-scrollbar { height: 5px; } /* Track */ .horizontal-scroll::-webkit-scrollbar-track { background: rgba(70, 73, 109, 0.15); margin: 1.25rem; border-radius: 5px; } /* Handle */ .horizontal-scroll::-webkit-scrollbar-thumb { background: black; border-radius: 5px; } .is-inactive { pointer-events: none!important; } .bg-animate-overlay { background: linear-gradient(-45deg, #fff, #ffe9bc, #fff9e6, #fff9e6); background-size: 400% 400%; animation: gradient 15s ease infinite; } .green-circle{ animation:fade 1s ease-in-out infinite } /* CUSTOM GRADIENTS */ .primary-gradient { background: linear-gradient(45deg, #3D348B, #3D348B, #9E388B, #DF4F79, #DF4F79); background-size: 400% 400%; animation: primaryGradient 5s ease infinite; } .cream-gradient { background: linear-gradient(45deg, #fff9e6, #fff9e6, #fdf5dc, #fdf5dc, #fff9e6); background-size: 400% 400%; animation: primaryGradient 3s ease infinite; } .gift-gd_01 { background: linear-gradient(45deg, #3D348B, #3D348B, #9E388B, #DF4F79, #DF4F79); background-size: 400% 400%; animation: primaryGradient 5s ease infinite; } .free-gift-item { background: linear-gradient(45deg, #e4f2f8, #e4f2f8, #fff9e6, #fff9e6, #fff9e6); background-size: 400% 400%; animation: primaryGradient 5s ease infinite; } .w-tab-link.w--current .check-white-3 { display: block; } .cta1_inner.submitting #cta_text { display: none; } .cta2_inner.submitting #cta_text { display: none; } .cta1_inner.submitting a#submit_flavors { pointer-events: none; } .cta2_inner.submitting a#proceed_checkout { pointer-events: none; } .cta1_inner.submitting .loading-spinner { display: flex; } .cta2_inner.submitting .loading-spinner { display: flex; } .lottie_confetti { pointer-events:none; } .qty2_box.current-qty{ pointer-events:none!important; } #button_hold_pointer { pointer-events: none; } a#select-flavors { pointer-events: all!important; } a#atc-btn { pointer-events: all!important; } @media (max-width: 1024px) { #button-bundles.is-active { bottom: 0; animation: slide-up 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94); } } .section-newzera { background: linear-gradient(270deg, #e4f2f8, #fff9e6); background-size: 400% 400%; animation: magicGradient 8s ease infinite; } .magic-gd-vanilla { background: linear-gradient(270deg, #e0fafa, #fffcd9); background-size: 400% 400%; animation: magicGradient 8s ease infinite; } .magic-gd-golden { background: linear-gradient(270deg, #ffd700, #f8b500, #ffcb00, #f8b500, #ffd700); background-size: 400% 400%; animation: magicGradient 8s ease infinite; } .magic-gd-caramel { background: linear-gradient(270deg, #ffecc8, #ffd78a); background-size: 400% 400%; animation: magicGradient 8s ease infinite; } .menu-icon1_line-top, .menu-icon1_line-middle, .menu-icon1_line-bottom { transition: transform 0.3s ease, opacity 0.3s ease; } .menu-icon1.open .menu-icon1_line-top { transform: translateY(11px) rotate(45deg); } .menu-icon1.open .menu-icon1_line-middle { opacity: 0; } .menu-icon1.open .menu-icon1_line-bottom { transform: translateY(-5px) rotate(-45deg); } .cart_overlay { pointer-events: none; } .cart2_spinner { pointer-events: none; } .cart_line-items-static { overflow-x: hidden; } .scroll-lock .cart_line-items-static { overflow-y: scroll!important!important; pointer-events:all!important; } .cart_qty1-handler.left_handler.is-active { background-color:#fff!important; color:#000!important; } .cart_qty1-handler.left_handler { background-color:#fff!important; } .cart_qty1-handler.left_handler.is-active { background: #fff!important; } .confetti-burster { pointer-events: none; } #cart-spinner { pointer-events: none; } /* Width when is-active class is present on any child */ .button-quick-add .is-active ~ .button-quick-add { width: 9rem; /* example increased width */ } .button-quick-add.is-active .quick-action-qty.decrease { display:flex; } .button-quick-add.is-active .quick-add-qty { display:flex; } .product-hero_photo-container { max-height: calc(100vh - 110px); } .javy_nav_inner { overflow-x: auto; white-space: nowrap; scrollbar-width: none; /* For Firefox */ -ms-overflow-style: none; /* For Internet Explorer and Edge */ } .javy_nav_inner::-webkit-scrollbar { display: none; /* For Chrome, Safari, and Opera */ } /* HORIZONTAL SCROLL */ .track-horizontal { position: absolute; white-space: nowrap; will-change: transform; animation: marquee-horizontal 40s linear infinite; /* manipulate the speed of the marquee by changing "40s" line above*/ } @keyframes marquee-horizontal { from { transform: translateX(0); } to { transform: translateX(-50%); } } /* BADGE ROTATOR */ .star-rotator{ animation:rotate 10s linear infinite } @keyframes rotate{ 0%{ transform:rotate(00deg) } 100%{ transform:rotate(360deg) } } /* CART SPINNER */ .spinner { --spinner-size: 2; --line-color: #ffffff; --line-alpha: 1; --ring-color: #ffffff; --ring-alpha: 0.05; --ring-size: 6; font-size: calc(var(--spinner-size) * 1em); width: 1em; height: 1em; border-radius: 50%; } .spinner .line { fill: none; stroke: var(--line-color); stroke-width: var(--ring-size); opacity: var(--line-alpha); stroke-linecap: round; transform-origin: 50% 50%; transform: rotate3d(0, 0, 1, 0deg); animation: 2156ms spinner-arc ease-in-out infinite, 1829ms spinner-rotate linear infinite; } .spinner .ring { fill: none; stroke: var(--ring-color); stroke-width: var(--ring-size); opacity: var(--ring-alpha); } @keyframes spinner-rotate { to { transform: rotate3d(0, 0, 1, 360deg); } } @keyframes spinner-arc { from { stroke-dasharray: 0 150; stroke-dashoffset: 0; } to { stroke-dasharray: 100 150; stroke-dashoffset: -140; } } --spinner-size: 2em --ring-size: 6 --line-color: #ffffff --line-alpha: 1 --ring-color: #ffffff --ring-alpha: 0.05 /* PLYR VIDEO MODAL REVIEWS */ html { --plyr-color-main: white; --plyr-tab-focus-color: transparent; --plyr-video-control-color-hover: black; --plyr-control-icon-size: 1.5em; --plyr-range-thumb-height: 0px; --plyr-range-track-height: 0.6em; } .plyr__control--overlaid { color: black; } .plyr__volume { width: auto; min-width: auto; max-width: auto; } .plyr { width: 100%; height: 100%; } .plyr video { object-fit: cover; } .contain-video video { object-fit: contain; } .hide-cover .plyr_cover { opacity: 0; pointer-events: none; } .hide-cover .plyr_cover-img { transform: scale(1.4); } .plyr-modal { aspect-ratio: 9 / 16; } .video-container { aspect-ratio: 9 / 16; } .plyr-modal video { position: absolute; left: 0px; width: 100%; height: 100%; object-fit: cover; object-position: center top; } @keyframes swipeUp { 0% { transform: translateY(100%); opacity: 0; } 100% { transform: translateY(0); opacity: 1; } } .plyr-modal.is-active { animation: swipeUp 0.5s ease-in-out; } .video-modal { pointer-events:none; } .video-modal.is-active { pointer-events:all; } .plyr_component { aspect-ratio: 9 / 16; } .odometer { --time: 2s; --odometer-easing: ease; vertical-align: middle; } .odometer .odometer-inside { gap: 0.5rem; } @media (max-width: 479px) { .odometer .odometer-inside { gap: 0.2rem; } } .odometer .odometer-digit { display: inline-block; vertical-align: middle; } .odometer .odometer-digit .odometer-digit-spacer { display: block; vertical-align: middle; visibility: hidden; } .odometer .odometer-digit .odometer-value.odometer-last-value { position: absolute; left: 0; right: 0; } .odometer-ribbon-inner { -webkit-backface-visibility: hidden; } .odometer.odometer-animating-up .odometer-ribbon-inner { -webkit-transition: -webkit-transform var(--time); -moz-transition: -moz-transform var(--time); -ms-transition: -ms-transform var(--time); -o-transition: -o-transform var(--time); transition: transform var(--time); } .odometer.odometer-animating-up.odometer-animating .odometer-ribbon-inner { -webkit-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); } .odometer.odometer-animating-down .odometer-ribbon-inner { -webkit-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); } .odometer.odometer-animating-down.odometer-animating .odometer-ribbon-inner { -webkit-transition: -webkit-transform var(--time); -moz-transition: -moz-transform var(--time); -ms-transition: -ms-transform var(--time); -o-transition: -o-transform var(--time); transition: transform var(--time); -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); } .odometer.odometer-animating-down.odometer-animating .odometer-ribbon-inner, .odometer.odometer-animating-up .odometer-ribbon-inner { -webkit-transition-timing-function: var(--odometer-easing); -moz-transition-timing-function: var(--odometer-easing); -ms-transition-timing-function: var(--odometer-easing); -o-transition-timing-function: var(--odometer-easing); transition-timing-function: var(--odometer-easing); } .odometer .odometer-digit .odometer-value { -webkit-transform: translateZ(0); } .odometer._4 .odometer-inside:before { content: "$"; display: inline-block; vertical-align: sup; opacity: 1; font-size: inherit; margin-right: 0.12em; } .odometer._5 { display: inline-block; --odometer-easing: ease; } .odometer._5 .odometer-digit { padding: 0; background-color: transparent; } .odometer._5 .odometer-inside { gap: 0; } .preloader_odometer { gap: 0.5rem; } .ctc-wrap { pointer-events: none; } .ctc-button { pointer-events: auto; } .odometer-html-structure p a { position: relative; display: inline-block; margin-right: 0.9em; color: #676f00; transition: 0.2s ease all; box-shadow: 0 1px 0 0 #676f00; } .odometer-html-structure p a::after { content: "↗"; position: absolute; right: -0.8em; bottom: -0.05em; } .odometer-html-structure p a:hover { box-shadow: 0 0 0 0 #676f00; } ponent.inline { text-align: center; display: block; } .odometer { line-height: 1.3; position: relative; } .odometer._2 { font-size: 3rem; } .odometer._5 { padding: 0; line-height: 1; position: relative; top: -.4rem; } .odometer-inside { display: flex; } .odometer-digit { background-color: #e8e6e0; border-radius: .5rem; padding-left: .4rem; padding-right: .4rem; display: inline-block; position: relative; } .odometer-digit-spacer { display: block; } .odometer-digit-inner { text-align: center; display: block; position: absolute; top: 0%; bottom: 0%; left: 0%; right: 0%; overflow: hidden; } .odometer-ribbon { text-align: center; justify-content: center; align-items: center; display: block; position: absolute; top: 0%; bottom: 0%; left: 0%; right: 0%; overflow: hidden; } .odometer-ribbon-inner, .odometer-value { display: block; } .odometer-formatting-mark { display: inline-block; } @keyframes slide-up { 0% { transform: translateY(-100%); } 100% { transform: translateY(0); } } @keyframes slide-up { 0% { transform: translateY(100%); } 100% { transform: translateY(0); } } @keyframes magicGradient { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } @keyframes primaryGradient { 0% { background-position: 0% 50% } 50% { background-position: 100% 50% } 100% { background-position: 0% 50% } } @keyframes rotateP { 0% { transform: rotate(0) } 50% { transform: rotate(180deg) } 100% { transform: rotate(180deg) } } @keyframes rotate { 0% { transform: rotate(00deg) } 100% { transform: rotate(360deg) } } @keyframes fade { 0% { opacity: 100%; } 50% { opacity: 30%; } 70% { opacity: 100%; } 100% { opacity: 100%; } } @keyframes gradient { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } .swiper, swiper-container { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1; display: block; } .swiper-vertical > .swiper-wrapper { flex-direction: column; } .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: flex; transition-property: transform; transition-timing-function: var( --swiper-wrapper-transition-timing-function, initial ); box-sizing: content-box; } .swiper-android .swiper-slide, .swiper-wrapper { transform: translateZ(0); } .swiper-horizontal { touch-action: pan-y; } .swiper-vertical { touch-action: pan-x; } .swiper-slide, swiper-slide { flex-shrink: 0; width: 100%; height: 100%; position: relative; transition-property: transform; display: block; } .swiper-slide-invisible-blank { visibility: hidden; } .swiper-autoheight, .swiper-autoheight .swiper-slide { height: auto; } .swiper-autoheight .swiper-wrapper { align-items: flex-start; transition-property: transform, height; } .swiper-backface-hidden .swiper-slide { transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; } :root { --grey-50: 249, 250, 251; --grey-500: 107, 114, 128; --blue-800: 42, 37, 82; } .swiper-slide_image-wrap { aspect-ratio: 4 / 3; } @media screen and (max-width: 996px) { .swiper-slide_image-wrap { aspect-ratio: 4 / 3; } .product-hero_photo-container { aspect-ratio: 4 / 3!important; } } @media screen and (max-width: 767px) { } @media screen and (max-width: 479px) { .swiper-slide_image-wrap { aspect-ratio: 4 / 3; } } .swiper-button.is-v4.swiper-button-disabled, .swiper-button.is-v4.swiper-button-disabled:hover, .swiper-button.is-v4.swiper-button-disabled:active { background: rgba(var(--grey-50), 1); color: rgba(var(--grey-500), 1); cursor: auto; border-color: rgba(var(--grey-50), 1); box-shadow: 0 0 1rem rgba(var(--blue-800), 0); } .swiper-navigation.is-v4 { bottom: calc(100% -6px); z-index: 5; } /* .swiper-navigation.is-v4 .swiper-scrollbar.swiper-scrollbar-horizontal { position: relative; left: 0; bottom: 0; top: 0; z-index: 1; height: 6px; width: 100%; border-radius:0px!important; background-color:rgba(var(--blue-800), 0.2) } .swiper-navigation.is-v4 .swiper-scrollbar-drag { background-color:rgba(var(--blue-800), 1) } span.swiper-pagination-progressbar-fill { height: 2px!important; } */ .swiper-horizontal>.swiper-pagination-progressbar, .swiper-pagination-progressbar.swiper-pagination-horizontal, .swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite, .swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite { height: var(--swiper-pagination-progressbar-size,2px)!important; } .product-hero_photo-container { max-height: calc(100vh - 110px); } .product-hero_photo-container.is-sticky.is-85 { max-height: calc(100vh - 85px); } .swiper-pagination.is-product_hero.swiper-pagination-progressbar.swiper-pagination-horizontal { top: auto; bottom: 0px; } .swiper-navigatio .swiper-pagination.swiper-pagination-bullets.swiper-pagination-horizontal { position: relative; bottom: 0; top: 0; width: auto; } .swiper-navigation .swiper-pagination.swiper-pagination-bullets.swiper-pagination-horizontal .swiper-pagination-bullet { width: 10px; height: 10px; opacity: 1; background: rgba(var(--blue-800), 0.2); transition: background 0.4s ease; } .swiper-navigation .swiper-pagination.swiper-pagination-bullets.swiper-pagination-horizontal .swiper-pagination-bullet.swiper-pagination-bullet-active { background: rgba(var(--blue-800), 1); } span.swiper-pagination-bullet { width: 6px!important; height: 6px!important; } /* Initially hide the spinner and content */ [data-checkout-button="spinner"] { display: none; } [data-checkout="loading"] { display: none; } /* When the "is-submitting" class is added to the button */ [data-checkout-button="submit"].is-submitting { /* Display the spinner and hide the content */ [data-checkout-button="spinner"] { display: flex; } [data-checkout="loading"] { display: flex; } [data-checkout-button="content"] { display: none; } [data-checkout-button="arrow"] { display: none; } } [data-qty-component="card"].current-qty [data-qty-component="radio"] { border: 6px solid #2a2552; background-color: #fff; } .gift_image.is-active { background: linear-gradient(270deg, #e0fafa, #fffcd9); background-size: 400% 400%; animation: magicGradient 8s ease infinite; } .star-rotator { color: linear-gradient(90deg, #ffa9a9, #64a1e0, #ffa9a9, #64a1e0); -webkit-animation: gradientBG 7s ease infinite forwards; animation: gradientBG 7s ease infinite forwards; } /** Code By Webdevtrick ( https://webdevtrick.com ) **/ .jv-magic { background: linear-gradient(90deg, #ffa9a9, #64a1e0, #ffa9a9, #64a1e0); background-size: 400% 400%; -webkit-animation: gradientBG 7s ease infinite forwards; animation: gradientBG 7s ease infinite forwards; } @-webkit-keyframes gradientBG { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } @keyframes gradientBG { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } .icon-increase { pointer-events: none; } .icon-decrease { pointer-events: none; } /* Set the default background color to white for all items */ .bundle_line { background-color: white; } /* Set the background color to gray for even-numbered items */ .bundle_line:nth-child(even) { background-color: #fdfdfd; /* Light gray color; adjust as needed */ } .button-text { pointer-events: none; } /* flavor modal styles */ [data-modal="content"] { pointer-events:none; } [data-modal="content"] .is-active { pointer-events:all; } [data-modal="container"] { pointer-events:none; } [data-modal="container"] .is-active { pointer-events:all; } [data-modal="backdrop"] { pointer-events:none; } [data-modal="backdrop"] .is-active { pointer-events:all; } [data-modal="membership-backdrop"] { pointer-events:none; } [data-modal="membership-backdrop"].is-active { pointer-events:all; } @media screen and (min-width: 1024px) { [data-bundle-summary] { height: calc(100vh - 12.75rem); } } [data-bundle="gift-block"].is-active .gift-texts { color: var(--primary-purple); } .is-compare-price { &:after { content: ""; position: absolute; top: 50%; left: 0; right: 0; height: 0.8px; background-color: #000; width: 100%; transform: rotate(-13deg); } } .button-toggle-m { transition: transform 0.3s ease; /* Animation for the toggle */ } /* Position the toggle when 'is-membership' class is present */ .is-membership .button-toggle-m { transform: translateX(20px); } .toggle-button-fill-m { transition: background-color 0.3s ease; /* Animation for the background color change */ /* Set the initial background color for when is-membership is not active */ background-color: #ccc; /* Light grey, for example */ /* Other styles for positioning and size, border-radius, etc. */ } .is-membership .toggle-button-fill-m { background-color: var(--primary-purple); /* Dark grey as specified */ } .tooltip { display: inline-block; background: #ffffff; color: var(--primary-purple); font-weight: 400; padding: 5px 10px; font-size: 0.7rem; border-radius: 4px; visibility: hidden; /* Initially hidden */ } .arrow, .arrow::before { position: absolute; width: 8px; height: 8px; background: inherit; } .arrow { visibility: hidden; } .arrow::before { visibility: visible; content: ''; transform: rotate(45deg); } .tooltip[data-popper-placement^='top'] > .arrow { bottom: -4px; } .tooltip[data-popper-placement^='bottom'] > .arrow { top: -4px; } .tooltip[data-popper-placement^='left'] > .arrow { right: -4px; } .tooltip[data-popper-placement^='right'] > .arrow { left: -4px; } .gift_image { pointer-events: none; } @keyframes pulse-border { 0% { box-shadow: 0 0 0 0 rgba(0, 123, 255, 0.7); } 70% { box-shadow: 0 0 0 10px rgba(0, 123, 255, 0); } 100% { box-shadow: 0 0 0 0 rgba(0, 123, 255, 0); } } .gift-blocks.is-active::after { content: ''; position: absolute; top: -5px; /* adjust as needed */ left: -5px; /* adjust as needed */ width: calc(100% + 10px); /* adjust as needed */ height: calc(100% + 10px); /* adjust as needed */ border-radius: 10px; /* adjust as needed */ animation: pulse-border 1.5s infinite; z-index: -1; } .gift-blocks { position: relative; /* ensure this is set for pseudo-elements to position correctly */ } [data-gift].is-active .gift_image { opacity: 1; } [data-gift].is-active .gift-overlay { opacity: 1; width: 100%; height: 100%; } [data-modal="container"] [data-quantity="add"] { pointer-events: none; } [data-modal="container"].is-active [data-quantity="add"] { pointer-events: all; } .sticky-footer.is-active { transform: translate(0); } .button-holder.is-sticky.is-active { transform: translate(0); } [badge-gd="01"] { background: linear-gradient(45deg, rgba(185, 205, 255, 0.40) 0%, rgba(201, 182, 255, 0.40) 33.33%, rgba(239, 184, 255, 0.40) 66.67%, rgba(255, 210, 177, 0.40) 100%); } .current-qty .card_ag-content { opacity: 1; } [data-card="select"].is-selected [data-qty-component="radio"] { border: 6px solid #2a2552; background-color: #fff; }