/* Add custom CSS styles below */ 

/* Mobile devices */
@media (max-width: 767px) {
    .px-2\.5 {
        padding-left: 0.625rem;
        padding-right: 0.625rem;
    }
}

/* Between mobile and 1440px */
@media (min-width: 768px) and (max-width: 1439px) {
    .px-2\.5 {
        padding-left: calc(5vw); /* Adjust based on screen width */
        padding-right: calc(5vw);
    }
}

/* 1440px and up */
@media (min-width: 1440px) {
    .px-2\.5 {
        padding-left: 7.5rem;
        padding-right: 7.5rem;
    }
}


/* Define the specific styles for .product-card--fit-height .product-card__image */
.product-card--fit-height .product-card__image {
    
    /* Override the --product-image-height variable only for this selector */
    /* Setting it to 'auto' allows the image to adjust its height dynamically */
    /* This will not affect other elements that use --product-image-height */
    --product-image-height: auto;

    /* Set the height property using the updated variable */
    /* Because --product-image-height is now 'auto', the height will adjust automatically */
    height: var(--product-image-height);

    /* Set the max-height property using the updated variable */
    /* Ensures the maximum height of the image is also dynamically set to 'auto' */
    /* This allows the image to scale without being restricted by a max height */
    max-height: var(--product-image-height);
}

/* Define styles for images with the 'lazy loaded' class */
img.lazy.loaded {
    
    /* Set the opacity to fully visible */
    opacity: 1;

    /* Adjust the scale to 0.9 for a slight zoom-out effect */
    /* This will make the image appear slightly smaller */
    transform: scale(0.9);

    /* Add a rounded border radius for smooth corners */
    /* This gives the image a rounded appearance with a 10px radius on all sides */
    border-radius: 10px;
}


/* Hiding quick view button */
.quickview-btn {
display: none;
}

.product-card__actions {
position: absolute;
top: 10px;
right: 10px;
z-index: 1;
opacity: 0.5;
}


.product-card {
position: relative;
display: flex;
overflow: hidden;
background-color: var(--product-bg);
text-align: center;
transition-property: box-shadow;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 300ms;
box-shadow: 0px 8px 16px rgba(212, 165, 154, 0.08), 0px 4px 8px rgba(168, 178, 155, 0.06);
}


/* Apply styles for devices larger than mobile */
@media (min-width: 768px) {
    .s-button-btn {
        position: relative;
        display: inline-flex;
        flex: 1 1 0%;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: center;
        white-space: nowrap;
        border-radius: 0.25rem;
        border-style: solid;
        padding-left: 1.5rem;
        padding-right: 1.5rem;
        padding-bottom: 0.625rem;
        padding-top: 0.5rem;
        font-size: 0.875rem;
        line-height: 1.25rem;
        font-weight: 700;
        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 300ms;
        background: #D4A59A;
        color: #FDFDFD !important;
        border-radius: 10px;
        width: 90% !important;
    }
}




@media (max-width: 768px) {
    /* Remove padding on mobile */
.px-\[15px\] {
        padding-left: 0;
        padding-right: 0;
    }

    /* Apply border-radius and box-shadow only on mobile */
    .object-cover {
        border-radius: 5px;
    }
    
        /* Selecting the element and moving it up by 10% of the viewport height */
#app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > div.container > div.product-single.thumbnails > div > div > div > div.product-single__info.col-lg-5.col-md-12.col-12.lg\:\!w-2\/4.md\:w-full.w-full.ltr\:md\:pl-\[15px\].rtl\:md\:pr-\[15px\].mt-5.sm\:mt-0 > div.flex.items-center.justify-between.mb-5 {
transform: translateY(clamp(-350px, -60vh, -460px)); /* Moves up between 30px, 30vh, and 180px */
        position: relative; /* Enables z-index to work*/
        z-index: 10 !important;
    }
    
    /* Targeting only when the specified div with the flex, space-x-3 classes exists */
.product-single .product-single__info button.s-social-share-btn, .product-single .product-single__info button.btn--wishlist {
    border-width: 0px;
    background-color: var(--bg-secondary);
    color: var(--store-text-primary);
    border-radius: 20px !important;
    opacity: 0.5;
}


/* Targeting only mobile screens */
#app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > div.container > div.product-single.thumbnails > div > div > div > div.product-single__info.col-lg-5.col-md-12.col-12.lg\:\!w-2\/4.md\:w-full.w-full.ltr\:md\:pl-\[15px\].rtl\:md\:pr-\[15px\].mt-5.sm\:mt-0 {
        /* Responsive margin-top for mobile */
        margin-top: clamp(-3.50rem, -5.55rem, -4.30rem);
    }
    
    /* Buy now mobile sticky card */
    
    .hydrated .is-sticky-product-bar .sticky-product-bar, .hydrated .is-sticky-product-bar .sticky-product-bar__quantity, .hydrated .is-sticky-product-bar .sticky-product-bar salla-add-product-button {
    /* From https://css.glass */
    background: rgba(255, 255, 255, 0.2);
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    }
    
    .is-sticky-product-bar .sticky-product-bar__quantity salla-quantity-input .s-quantity-input-container {
    border-radius: 5px !important;
    border: none !important;
    }
    
    .s-add-product-button-main {
    background: none !important;
    }
    
    .s-add-product-button-mini-checkout.s-mini-checkout.hide-scroll.hydrated {
    background: #28A745 !important;
    color: #fff !important;
    border: none;
    }
    .s-add-product-button-mini-checkout-content {
    color: #fff !important;
    }
    
    .s-add-product-button-main {
    border-radius: 20px !important;
    }
    .is-sticky-product-bar .sticky-product-bar salla-add-product-button {
    background: none !important;
    border: none !important;
    }
    
    .s-add-product-button-main .s-add-product-button-mini-checkout {
    border-radius: 10px !important;
    border: none !important;
    }
    
    .is-sticky-product-bar .sticky-product-bar salla-add-product-button button {
    border-radius: 10px !important;
    }

}

.main-menu li>a:hover{
color: #414042 !important;
}




.product-card__promotion {
    position: absolute;
    top: 1rem;
    left: 1rem;
    z-index: 1;
    max-width: 100%;
    padding-left: 0.625rem;
    padding-right: 0.625rem;
    padding-top: 0.375rem;
    padding-bottom: 0.375rem;
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 700;
    --tw-text-opacity: 1;
    color: rgba(255, 255, 255, var(--tw-text-opacity));
    border-radius: 8px 0px 8px 0px; /* Default for larger screens */
    background-color: rgba(168, 178, 155, 0.7) !important;
}

/* Mobile-specific styles */
@media (max-width: 768px) {
    .product-card__promotion {
        border-radius: 8px 0px 0px 8px; /* For mobile screens */
    }
    .swiper-wrapper .rounded-2xl img.w-full.lazy.loaded {
      width: 75% !important;
    }
    
    .mt-6.text-base.font-semibold.leading-7.tracking-tight.text-store-text-primary {
  font-size: 0.9rem !important;
  margin-top: 0.1rem;
  }
  
  .s-block.s-block--square-links.square-links-1.s-block--animate {
  margin-top: -25px;
}
  
  .enhanced-title-border {
  display:none;
  }
  
  #app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > section.s-block.s-block--fixed-banner.s-block--dynamic-banner.wide-placeholder.dynamic-banner--0 {
margin-top: 2rem !important;
  }
    #app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > div.s-block.s-block--square-links.square-links-1.s-block--animate {
  margin-top: -30px !important;
  }
  
  #app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > div.s-block.s-block--square-links.square-links-1.s-block--animate > div > div.container.mt-12 {
  margin-top: 0.5rem;
  }
  
  #app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > div.s-block.s-block--square-links.square-links-1.s-block--animate {
  margin-top: 5px !important;
  }
  
}


.product-card__subtitle{
color: #D4A59A !important;
}

h4.text-red-400.font-bold.text-sm.inline-block{
font-weight: bold !important;
}



#app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > section.s-block.s-block--fixed-banner.s-block--dynamic-banner.wide-placeholder.dynamic-banner--0 {
margin-top: 0px;
}



  #app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > div.s-block.s-block--square-links.square-links-1.s-block--animate {
  margin-top: 0px;
  }
  


/*
div#trustpilot-gtm-floating-wrapper {
height: 10px !important;
}
*/