/* Add custom CSS styles below */ 
/* ========== Google Fonts ========== */
@import url('https://fonts.googleapis.com/css2?family=Almarai:wght@300;400;700;800&display=swap');

/* ========== Font and Color Variables ========== */
body{
font-family: 'Almarai', sans-serif;
}
a.product-card-content-meta-title {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1; /* number of lines to show */
    line-clamp: 1;
    -webkit-box-orient: vertical;
}

button.product-card-actions-add-to-cart {
    background-image: linear-gradient(270deg, #691BA9 , #B527DC ) !important;
    color: #ffffff;
}
.product-card
{
    box-shadow: 0px 0px 3px 1px #B527DC;
}
strong {
        color: #fff !important;

}
span {
    color: #fff !important;
}
.mb-5 {
    background: #fff !important;
    border-radius: 10px !important;
}

@media (max-width: 768px) {
:nth-child(1 of section.static-banners.bg-\[var\(--bg-primary\)\]) {
  margin-top: 6rem;
}
}
.image-gategory img {
    margin-inline: auto;
    margin-bottom:30px;
    width:90%
}
@media screen and (min-width: 1025px) {
    .image-gategory img {
        width:70%
    }
}
body:has(.image-gategory) .main-content  , body:has(.image-gategory-second) .main-content{
    display:none
}
.cart .shadow-default h4 , .cart .shadow-default span , .cart .shadow-default b{
    color:#000 !important;
}
.cart button.undefined.s-button-element.s-button-btn.s-button-solid.s-button-wide.s-button-primary.s-button-loader-center span{
    color:#fff !important;
}
.cart .shadow-default h4 , .cart .shadow-default span , .cart .shadow-default b , .cart-item  a , .cart-item  span{
    color:#000 !important;
}
.cart button.undefined.s-button-element.s-button-btn.s-button-solid.s-button-wide.s-button-primary.s-button-loader-center span{
    color:#fff !important;
}
.cart button.btn--delete.s-button-element.s-button-icon.s-button-solid.s-button-small.s-button-primary.s-button-loader-center span{
    color:#fff !important;
}
section.static-banners:nth-of-type(1) .container {
    padding:0px;
    max-width:100%;
    margin-top:100px
}
.image-gategory-second {
    display:grid;
    grid-template-columns: repeat(5, 1fr);
    gap:20px;
    margin-block:50px;
}
.image-gategory-second div {
    text-align: center;
    background: #343444;
    border-radius: 10px;
    border: 1px solid #be01fa;
    padding:25px;
}
.image-gategory-second div:hover {
    background: #1f1f2c;
    transition:0.5s;
    border: 1px solid #1f1f2c;
}
.image-gategory-second div img {
    margin:auto;
}
.image-gategory-second div p {
    margin-top:10px;
}
    .image-gategory-second.container{
        padding-top:0px !important;
    }
@media (max-width: 767px) {
    .image-gategory-second {
        grid-template-columns: repeat(2, 1fr);
        margin-block:0px 25px;
    }
}
.image-gategory-second div:hover img {
    scale:1.1;
    transition:0.5s
}
#contact-slot:nth-of-type(1) span.s-contacts-icon {
  background: #33B846 !important;
  border: none;
  color: #FFFFFF;
}

#contact-slot:nth-of-type(2) span.s-contacts-icon {
  background: #27a6dc !important;
  border: none;
  color: #fff;
}

#contact-slot:nth-of-type(3) span.s-contacts-icon {
  background: #980E11 !important;
  border: none;
  color: #FFFFFF;
}

li.s-social-link a[href*="instagram"] {
  background-image: linear-gradient(150deg, #f9ce34, #ee2a7b, #6228d7);
  border: none;
  color: #FFFF;
}

li.s-social-link a[href*="whatsapp"] {
  background: #33B846 !important;
  border: none;
  color: #FFFFFF;
}

li.s-social-link a[href*="tiktok"] {
  background-image: linear-gradient(150deg, #00f2ea, #000, #ff0050);
  border: none;
  color: #FFFFFF;
}

li.s-social-link a[href*="snapchat"] {
  background: #FEFB00 !important;
  border: none;
  color: #333;
}

li.s-social-link a[href*="facebook"] {
  background: #2561AD !important;
  border: none;
  color: #FFFFFF;
}