.golazy-wrap[data-label=Popup] {
    max-width: 100%;
    max-height: 100%;
    background: #fff;
    position: fixed;
    top: 50%;
    left: 50%;
    display: none;
    width: 600px;
    height: 400px;
    transform: translate(-50%,-50%);
    z-index: 9999992;
}

@media (max-width: 767px){
    .golazy-wrap[data-label=Popup] {
        max-width: 86%;
        max-height: 80%;
    }
}

.golazy-wrap[data-label=Popup].showPopup {
    display: block!important;
}

.golazy-wrap[data-label=Popup][data-postion=center-center] {
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.golazy-wrap[data-label=Popup][data-postion=center-center][data-effects=fade] {
    -webkit-animation-name: stringdFadegfPopupCenterCenter;
    animation-name: stringdFadegfPopupCenterCenter;
    -webkit-animation-duration: .3s;
    animation-duration: .3s;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease;
    margin-left: 0;
    transform: translate(-50%,-50%) scale(1) rotateY(0);
}

.golazy-closePopup {
    width: 24px;
    height: 24px;
    fill: #414141;
    position: absolute;
    top: 4px;
    right: 4px;
    border-radius: 0;
    background-color: #fff;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999992;
}

.golazy-wrap[data-label=Popup]>.golazy-module {
    padding: 30px!important;
    overflow-y: auto;
    height: 100%;
}


.showPopup .container-toolbar {
    display: none;
}

.showPopup .container-toolbar-show {
    display: block !important;
}

.showPopup.module:hover {
    outline: #e82b71 solid 1px;
}

.showPopup .module:hover {
    outline: #e82b71 solid 1px;
}

.showPopup .block:hover {
    outline: #42c184 solid 1px;
    z-index: 1;
}

.showPopup .module.dynamic:hover {
    outline: #9900FF solid 1px;
    z-index: 1;
}

.production .showPopup.module:hover {
    outline: none;
}

.production .showPopup .block{
    outline: none;
}

.production .showPopup .module{
    outline: none;
}

.production .showPopup .module.dynamic{
    outline: none;
}




.golazy-popupOverlay {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 99999;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.2);
    display: none;
}

.golazy-popupOverlay[data-effects="3d-unfold"], .golazy-popupOverlay[data-effects=fade], .golazy-popupOverlay[data-effects=horizontal-move], .golazy-popupOverlay[data-effects=vertical-move], .golazy-popupOverlay[data-effects=zoom-out], .golazy-popupOverlay[data-effects=zoom] {
    -webkit-animation-name: sgPopupZoomInBg;
    animation-name: sgPopupZoomInBg;
    -webkit-animation-duration: .3s;
    animation-duration: .3s;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
}

.golazy-popupAnchorList {
    position: fixed;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    max-height: 95vh;
    z-index: 99999991;
    width: 40px;
    overflow-y: auto;
    
}

.golazy-popupAnchor {
    width: 40px;
    height: fit-content;
    padding: 8px 0px;
    background: orange;
    cursor: pointer;
    overflow: hidden;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    text-align: center;
    line-height: 40px;
    text-transform: uppercase;
    font-size: 12px;
    margin-bottom: 2px;
    color: #fff;
    font-weight: 600;
    letter-spacing: .4px;
    transition: box-shadow .2s,transform .2s,background .2s ease-in-out;
}

.golazy-popupAnchor.golazy-popupOff {
    opacity: .6;
}

.golazy-popupAnchor:hover {
    opacity: 1;
}

.golazy-popupAnchorList .golazy-popupAnchor {
    flex-grow: 1;
    flex-shrink: 3;
    overflow-x: hidden;
    flex-basis: 90px;
}


.golazy-popupAnchorList .golazy-popupAnchor:hover, .golazy-popupAnchorList .golazy-popupAnchor:not(.golazy-popupOff) {
    flex-shrink: 1;
    opacity: 1;
}

.golazy-popupAnchorList .golazy-popupAnchor span {
    display: inline-block;
    height: 100%;
    user-select: none;
}

.golazy-closePopup svg {
    width: 12px;
    height: 12px;
    fill: inherit;
    float: left;
}

.sg_featherlight {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2147483647;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
    background: #333;
}

.sg_featherlight * {
    box-sizing: border-box;
}

.sg_featherlight:last-of-type {
    background: rgba(0,0,0,.8);
}

#sg_featherlight-v4.sg_featherlight {
    background-color: rgba(51, 51, 51, 0.8);
}
.sg_featherlight:before {
    content: "";
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}


.sg_featherlight .sg_featherlight-content {
    position: relative;
    text-align: left;
    vertical-align: middle;
    display: inline-block;
    padding: 25px;
    margin-left: 5%;
    margin-right: 5%;
    max-height: 95%;
    background: #fff;
    cursor: auto;
    white-space: normal;
    min-width: 100px;
    min-height: 100px;
}

@media only screen and (max-width: 1024px){
    .sg_featherlight .sg_featherlight-content {
        margin-left: 0;
        margin-right: 0;
        max-height: 96%;
        padding: 10px 10px 0;
        border-bottom: 10px solid transparent;
    }

    #sg_featherlight-v4 .sg_featherlight-content {
        width: 100%;
    }
}


#sg_featherlight-v4.sg_featherlight .sg_featherlight-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-content: center;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
}


.sg_featherlight .sg_featherlight-close-icon {
    position: absolute;
    z-index: 9999;
    top: 0;
    right: 0;
    font-size: 30px;
    line-height: 40px;
    width: 40px;
    cursor: pointer;
    text-align: center;
    font-family: Arial,sans-serif;
    background: #fff;
    background: hsla(0,0%,100%,.3);
    color: #000;
    border: 0;
    padding: 0;
}


.sg_featherlight-next, .sg_featherlight-previous {
    display: block;
    position: absolute;
    top: 25px;
    right: 25px;
    bottom: 0;
    left: 80%;
    cursor: default;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    background: transparent;
}

.sg_featherlight-next span, .sg_featherlight-previous span {
    display: none;
    position: absolute;
    top: 50%;
    left: 5%;
    height: 90px;
    width: 90px;
    border-radius: 100%;
    margin-top: -40px;
    text-shadow: 0 0 5px #fff;
    color: #fff;
    font-style: normal;
    font-weight: 400;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

#sg_featherlight-v4 .sg_featherlight-next span, #sg_featherlight-v4 .sg_featherlight-previous span {
    display: flex;
    position: static;
    margin-top: -45px;
    background: rgba(214,214,214,.25);
    opacity: 0;
}

#sg_featherlight-v4 .sg_featherlight-next:hover span, #sg_featherlight-v4 .sg_featherlight-previous:hover span{
    opacity: 1;
}

.sg_featherlight-previous {
    left: 25px;
    right: 80%;
}

@media only screen and (max-width: 1024px){
    .sg_featherlight-next, .sg_featherlight-previous {
        top: 10px;
        right: 10px;
        left: 85%;
    }
    .sg_featherlight-previous {
        left: 10px;
        right: 85%;
    }

    #sg_featherlight-v4 .sg_featherlight-next span, #sg_featherlight-v4 .sg_featherlight-previous span {
        display: flex;
        height: 40px;
        width: 40px;
        margin-top: -20px;
        opacity: 1;
    }

    .sg_featherlight-next span, .sg_featherlight-previous span {
        font-size: 40px;
    }
    
}


#sg_featherlight-v4 .sg_featherlight-next, #sg_featherlight-v4 .sg_featherlight-previous {
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    left: auto;
    bottom: auto;
    z-index: 999;
}

#sg_featherlight-v4 .sg_featherlight-previous {
    right: auto;
    left: 0;
}


.sg_featherlight-loading {
    opacity: 0;
    visibility: hidden;
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 64px;
    height: 64px;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fff;
    transition: visibility 0s,opacity .3s;
}

.sg_featherlight .sg_featherlight-image {
    max-width: 100%;
    max-height: 100%;
}

#sg_featherlight-v4 .sg_featherlight-item {
    max-width: 100%;
}

#sg_featherlight-v4 video, #sg_featherlight-v4 iframe, #sg_featherlight-v4 img {
    max-width: 100%;
}

.sg_featherlight-next span svg, .sg_featherlight-previous span svg {
    width: 34px;
    fill: #9c9c9c;
}

@media only screen and (max-width: 1024px){
    .sg_featherlight-next span svg, .sg_featherlight-previous span svg {
        width: 26px;
        fill: #9c9c9c;
    }
}
@media only screen and (max-width: 769px){
    .sg_featherlight-next span svg, .sg_featherlight-previous span svg {
        width: 20px;
        fill: #9c9c9c;
    }
}


.cart-modal {
  position: fixed;
  background-color: rgba(0, 0, 0, 0.7);
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1050;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s;
}

.cart-modal.open {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

.cart-modal-container {
  position: fixed;
  bottom: 0px;
  top: 0px;
  right: 0px;
  height: 100%;
  width: 384px;
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 300ms;
  background-color: #fff;
  transform: translateX(100%);
}

@media (max-width: 480px) and (min-width: 321px) {
  .cart-modal-container {
    width: 95%;
  }
}

.cart-modal-container.open {
  transform: none;
}

.cart-header {
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0px 1rem;
  border-bottom: 1px solid #DDD;
}

.cart-header h4, .cart-header h5 {
    display: flex;
}

.cart-header .cart-number {
    margin-left: 12px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background-color: #C8CCD8;
    color: #fff;
    font-size: 12px;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cart-close-btn {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.cart-button {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background-color: black;
  cursor: pointer;
  position: fixed;
  bottom: 40px;
  right: 20px;
  z-index: 100;
  display: none;
}

.live-production .cart-button, .production .cart-button {
    display: block;
}

.cart-button-container {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 50%;
}

.cart-button .cart-number {
    position: absolute;
    top: 0px;
    right: -5px;
    background: #EB3223;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 500;
    color: #fff;
    border-radius: 50%;
}

.cart-button.hide {
    display: none;
}

.cart-body {
  height: calc(100% - 60px);
  display: flex;
  flex-direction: column;
}

.empty-cart {
  padding: 1rem;
  color: #AAA;
}

.empty-cart.hide {
    display: none;
}

.cart-info-wrapper {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.cart-content {
    padding: 0.75rem;
    flex: 1;
    overflow: auto;
    border-bottom: 1px solid #DDD;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    background-color: #DBDCDD;
}

.cart-footer {
    max-height: 120px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 1rem;
}

.cart-footer .cart-subtotal {
    display: flex;
    justify-content: space-between;
}

.cart-footer .cart-subtotal .subtotal-price {
    font-weight: 600;
    color: #EB3223;
    font-size: 18px;
}

.cart-footer .cart-subtotal .subtotal-text {
    color: #000;
    font-size: 16px;
    font-weight: 500;
}

.cart-footer .button-checkout {
    padding: 12px 16px;
    background-color: #000;
    color: #fff;
    font-weight: 500;
    font-size: 18px;
    text-decoration: none;
    text-align: center;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.cart-footer .button-checkout:hover {
    background-color: #3d4246;
    transition: all 0.3s ease;
    opacity: 1;
    color: #fff;
    font-size: 18px;
}

.cart-item {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    padding: 0.75rem;
    background: #F6F6F6;
    border-radius: 8px;
}

.cart-item img {
    width: 80px;
    aspect-ratio: 1 / 1;
    object-fit: contain;
    border-radius: 8px !important;
}

.cart-item .product-info {
    display: flex;
    flex-direction: column;
    flex: 1;
    position: relative;
}

.cart-item .product-info .product-title {
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    display: -webkit-box;
    word-wrap: break-word;
    font-size: 15px;
    font-weight: 500;
}

.cart-item .product-price-container {
    display: flex;
    justify-content: space-between;
}

.cart-item .product-price {
    font-size: 14px;
    color: #284a9e;
}

.cart-item .product-subtotal {
    font-size: 16px;
    color: #EB3223;
    font-weight: 500;
}

.cart-item .product-variant {
    font-size: 13px;
    color: #9c9c9c;
}

.cart-quantity {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 8px;
}

.button-quantity-wrapper {
    display: flex;
}

.button-minus {
  /* flex items-center justify-center px-2 py-1 border rounded-s-3xl border-r-0 border-[#919090] */
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px 8px;
    border: 1px solid #919090;
    border-right: none;
    border-radius: 4px 0 0 4px;
    cursor: pointer;
    background-color: #EEE;
    transition: all 0.3s ease;
}

.input-quantity {
  /* 'w-[60px] text-center text-[14px] text-black border border-l-0 border-r-0 border-[#919090] font-semibold' */
    width: 60px;
    text-align: center;
    font-size: 14px;
    color: #000;
    border: 1px solid #919090;
    border-left: none;
    border-right: none;
    font-weight: 600;
}

.button-plus {
  /* flex items-center justify-center px-2 py-1 border rounded-e-3xl border-l-0 border-[#919090] */
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px 8px;
    border: 1px solid #919090;
    border-left: none;
    border-radius: 0px 4px 4px 0px;
    cursor: pointer;
    background-color: #EEE;
    transition: all 0.3s ease;
}

.button-plus:hover, .button-minus:hover {
    background-color: #CCC;
    transition: all 0.3s ease;
}

.remove-item {
    width: 24px;
    height: 24px;
    background: rgba(210, 210, 210, 0.7);
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: absolute;
    bottom: -6px;
    right: -6px;
}

.remove-item:hover {
  text-decoration: underline;
}

body.lock-scroll {
    overflow: hidden;
}



