/* https://salla.sa/Pearl-2030-2026/category/DXZjqz */



.custom-bar > div > div > salla-social-share > div > slot-fb > salla-button > button {
background: var(--color-background)  !important ;
color:  var(--color-primary) !important ;
}
.kayan-faq.kayan-faq-3> div > div.accordion-container{
border: none !important;	
}
.kayan-faq > div > div.accordion-container.flex.flex-col.justify-center > div {
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px !important;
margin: 0.8rem auto !important;
background: #000 !important ;
color: var(--color-background) !important ;
border-radius: 0.6rem !important;
}
.kayan-features  > div > div.flex {
display: grid !important;
grid-template-columns: repeat(2, 1fr) !important;
gap: 1rem !important; 
}
.kayan-features > div > div.flex > *:first-child {
grid-column: 1 / -1;
}
custom-salla-product-card > div > div.overflow-hidden.relative > a  > img , .s-products-list-vertical-cards > custom-salla-product-card > div > div.overflow-hidden.relative > a> img{
aspect-ratio: 12/18 !important;
object-fit: cover !important;
}
#comments-filter ,  salla-comments > div > div > div.s-comments-header.has-total > div , form > salla-product-options > salla-conditional-fields > div  > div > div > div > label  > div, .main-content  > form > salla-product-options{
background: var(--color-background)  !important;
}
.custom-bar > div > h3 {
color:  var(--color-background)  !important ;	
}
salla-products-list > div.s-products-list-wrapper.s-products-list-vertical-cards > custom-salla-product-card  > div > div.overflow-hidden  > a.block  > span , .kayan-promotion_title , .banner-label{
background: var(--color-primary) !important ;
color: var(--color-background) !important ;
}
.separator-wave {
background: linear-gradient(90deg, transparent,var(--color-primary) , transparent) !important ;
} 
.kayan-features.kayan-features-5, .separator-wave {
border-color:  var(--color-primary)  !important ;
}
#app > div.app-inner.flex.flex-col.min-h-full > div.kayan-features.kayan-features-0.px-10.py-10.border-y-2.border-black.overflow-hidden.block.block{
border-color:  var(--color-primary)  !important ;
}
#app > div.app-inner.flex.flex-col.min-h-full > section > div > div.accordion-container.flex.flex-col.justify-center.items-center.w-full  , #app > div.app-inner.flex.flex-col.min-h-full > section > div , .kayan-faq{
border: none !important;
}

/* **freelance** */

#app > div.app-inner.flex.flex-col.min-h-full > footer > div > div  > div > div.flex {
    position: relative !important;
    padding-bottom: 110px !important;
}

#app > div.app-inner.flex.flex-col.min-h-full > footer > div > div  > div > div.flex.flex-col.gap-4::after{
    content: "FL-835308063";
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;

    background-image: url("https://asas-tools.com/u/uploads/sara_craffo/%D8%A7%D9%84%D8%B9%D9%85%D9%84_%D8%A7%D9%84%D8%AD%D8%B1_%D8%B1%D9%85%D8%B2_%D9%88%D8%AB%D9%8A%D9%82%D8%A9-removebg-preview.png");
    background-repeat: no-repeat;
    background-size: 70px;
    background-position: top center;
    padding-top: 44px;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    font-size: 14px;
    font-weight: bold;
    color: var(--color-background) !important;
    text-align: center;
}

/* ***** */


@media (max-width: 767px){

.relative.px-10.py-10.container.mx-auto.craffo-components-statistics{
margin: 0 !important;
}
#app > div.app-inner.flex.flex-col.min-h-full > div.kayan-banners.py-10.overflow-hidden{
margin-top: 0 !important;
padding-top: 0 !important;
}
.kayan-header  > div > div > div.flex-1 > div.w-24 > a > img{
display: none !important ;
width: 4rem !important;
max-width: 4rem !important;
}
.craffo-components-statistics > div{
display: grid !important;
grid-template-columns: auto auto auto !important;	
}
.mx-auto.craffo-components-statistics > div > div > div.mt-1{
font-size: 1.6rem !important;	
}
#app > div.app-inner.flex.flex-col.min-h-full > div.relative.px-10.py-10.container.mx-auto.craffo-components-statistics > div > div> div.mt-1.text-lg{
font-size: 0.8rem !important;
}
.custom-bar > div > div > salla-social-share > div > slot-fb > salla-button > button {
background: var(--color-background)  !important ;
color:  var(--color-primary) !important ;
}

}


@media (min-width: 767px){
#app > div.app-inner.flex.flex-col.min-h-full > div.relative.px-10.py-10.container.mx-auto.craffo-components-statistics{
margin: 11rem auto 1rem auto !important;
}
.app-inner.flex.flex-col.min-h-full > div.navbar.invisible{
margin: 2rem auto !important;
}

}