@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@200;300;400;500;700;800;900&display=swap');

:root {
    --main-color: #4B5563
}

body {
    font-family: "Tajawal", sans-serif;
}

/****************Navbar****************/
.main-nav-container .inner {
    background: linear-gradient(0deg, #EDEEEF00, #89888842) !important;
    padding: 25px
}

.main-menu li:hover>.sub-menu {
    background-color: var(--main-color);
}

/* body.trans_header.slider_has_overlay .store-header .main-nav-container.fixed-header *:not(custom-salla-product-card *) {
    background: linear-gradient(0deg, #EDEEEF00, #89888842) !important;
} */

.main-nav-container.fixed-pinned.animated.fixed-header .inner.bg-inherit {
        background: black !important;
    color: white;
}

.main-nav-container.fixed-pinned.animated.fixed-header a.navbar-brand {
    background-image: url("https://i.ibb.co/NgKy0BTr/Screenshot-2025-01-13-223704-2.webp");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 90%;
    width: 100px;
    height: 100px;
}

.main-nav-container.fixed-pinned.animated.fixed-header a.navbar-brand img {
    display: none
}


.main-nav-container {
    color: #080808;
}


@media(max-width: 600px) {
.navbar-brand img {
    width: 80px !important;
    height: 50px !important;
}
}

@media (max-width: 600px) {
        body.trans_header.slider_has_overlay .store-header *:not(custom-salla-product-card *), body.trans_header.slider_has_overlay .store-header .s-cart-summary-wrapper .sicon-cart:not(custom-salla-product-card *)
    {
        color: #292929;
    }
}

nav.breadcrumbs .text-primary {
    color: black !important
}
/****************Navbar****************/

/****************Banner****************/
section.s-block.s-block--fixed-banner.wide-placeholder.s-block--animate.fixed-banner--0 {
    margin-top: 0px;
    padding: 0px;
}

section.s-block.s-block--fixed-banner.wide-placeholder.s-block--animate.fixed-banner--0 img {
    border-radius:0px
}

section.s-block.s-block--fixed-banner.wide-placeholder.s-block--animate.fixed-banner--0 .container {
    padding: 0px;
    max-width: 100%;
}

@media (max-width: 600px) {
    section.s-block.s-block--fixed-banner.wide-placeholder.s-block--animate.fixed-banner--0 {
    margin-top: 90px;
}
}
/****************Banner****************/

/****************brands****************/
section.s-block.s-block--animated-brands.s-block--animate.grayscale {
    margin-top: 1rem;
}

.s-block--animated-brands--brand {
    background: transparent;
    border-radius: 10px;
}

section.s-block.s-block--animated-brands.s-block--animate .mx-auto.max-w-7xl.lg\:px-8 {
    max-width: 100%;
}

.s-block--animated-brands--brand img {
    width: 150px;
}

section.s-block.s-block--animated-brands.s-block--animate:nth-of-type(3) .marquee__group{
    animation: scroll-reverse 60s linear infinite !important;
}

@keyframes scroll-reverse{
    0% {
    transform: translateX(0);
}
    100% {
    transform: translateX(calc(100% - clamp(10rem, 1rem + 40vmin, 30rem) / 14));
}
}

@media (max-width: 600px) {
    .s-block--animated-brands--brand img {
    width: 70px;
}

.s-block--animated-brands--marquee {
    margin-block: -24px; 
}
}
/****************brands****************/
/****************public****************/
.border-primary {
    border-color: #1A1E23;
}
/****************public****************/
/****************Products****************/
body.products-has-border .product-card {
    box-shadow: 1px 1px 4px rgba(54, 53, 53, 0.12), -1px 1px 4px rgba(54, 53, 53, 0.12);
}

.product-card__addToCart__btn salla-button button {
    background-color: var(--main-color) !important;
    color: white !important;
}

.product-card__price .total-price {
    color: #C82222;
}

.s-product-card-overlay {
background: linear-gradient(177deg, transparent, #666, #000) !important;
}

@media (max-width: 600px) {
    .product-card--primary-buttons salla-button {
    margin-right: 10px
    
    }

    .product-card__content {
        height: 160px;
    }
}


/****************Products****************/
/****************special Products****************/
@media (min-width: 766px) {
    section.s-block--special-products-slider--8.s-block--special-products-slider  .lg\:flex-row {
    flex-direction: row-reverse;
}
}


section.s-block.s-block--special-products-slider--7.s-block--special-products-slider .s-block--special-products-slider .s-slider-container:where([dir="rtl"], [dir="rtl"] *) {
    margin-left: 20px;
}

.s-block--special-products-slider  .has-overlay--opacity-option.has-overlay--before:before {
    background-color: transparent;
}

@media (max-width: 766px) {
    .s-block--special-products-slider img.lazy.w-full.h-full.object-cover.object-center.min-h-\[250px\].max-h-\[350px\].lg\:max-h-\[700px\].loaded { 
        object-fit: contain;
    }

    .lg\:w-1\/3.flex.items-center.justify-center.bg-cover.bg-no-repeat.text-center.relative.min-h-\[250px\].max-h-\[350px\].md\:max-h-\[700px\].has-overlay--before.has-overlay--opacity-option.has-overlay--opacity-80 {
        background-color: white !important
    }

}

@media (min-width: 1024px) {
    section.s-block--special-products-slider--8.s-block--special-products-slider .lg\:space-x-10 > :not([hidden]) ~ :not([hidden]) {
        margin-left: calc(2.5rem * var(--tw-space-x-reverse)) !important;
    }
}
/****************special Products****************/
/****************Testimonial****************/
salla-slider#reviews-8-slider {
    padding-block: 25px;
}
section.s-block.s-block--testimonials.overflow-hidden.s-block--animate.relative.enhanced {
    background-image: none !important;
}

--faq-bg {
    background-image: none !important;
}

.review.anime-item.swiper-slide > div {
    border-radius: 12px !important;
    box-shadow: 1px 1px 4px rgba(54, 53, 53, 0.12), -1px 1px 4px rgba(54, 53, 53, 0.12);
}

section.s-block.s-block--map.s-block--animate .border-primary {
    border-color: #1A1E23;
}

/****************Testimonial****************/
/****************map****************/
section.s-block.s-block--map.s-block--animate .mx-auto.max-w-7xl.px-6.lg\:px-8 {
    padding: 0px;
    max-width: 100%;
}

.text-store-text-secondary {
    color: #1A1E23;
}

section.s-block.s-block--map.s-block--animate .border-primary {
    border-color: #1A1E23;
}
/****************map****************/
/****************Footer****************/
footer .lg\:-mt-\[45px\].relative.z-\[1\].lg\:col-\[2\] img {
    width: 140px;
    height: 90px;
}
.footer-is-custom .store-footer .store-footer__curve {
display: none
}
.footer-is-custom .store-footer .store-footer__inner {
    background-color: var(--main-color) !important;
    text-align: center !important;
    border: none;
}
.footer-is-custom .store-footer .store-footer__contacts-row {
background-color: var(--main-color) !important;
}
footer img.img-fluid.mx-auto.md\:mx-\[unset\] {
    margin: auto;
}

a.flex.items-center.border.p-1\.5.md\:p-2.text-sm.leading-none.enhanced-contact-item.anime-item {
    border: none;
}

footer a {
    transition: .5s ease-in-out
}

.hover\:text-primary:hover {
    color: #4b5563;
}

.footer-is-custom .store-footer .footer-bottom {
color: #1E1E1E
}

.footer-is-custom .store-footer .footer-rights p {
    color: #1E1E1E;
    font-weight:700
}

.footer-is-custom .store-footer .social-link, .footer-is-custom .store-footer .contact-social, .footer-is-custom .store-footer .contact-icon {
    border: none !important
}

footer .container.grid.grid-col-1.lg\:grid-cols-3.gap-4.lg\:gap-6 div:last-child {
    display: none;
}
/****************Footer****************/
/****************pages***************/
nav#mobile-menu .main-menu li.root-level>a {
    color: var(--main-color);
}

nav#mobile-menu .sub-menu .main-menu li>a span {
    color: white !important;
}

.main-nav-container .inner {
    background-color: var(--main-color);
    padding: 20px;
} 

.s-cart-summary-count {
    background-color: white;
    color: var(--main-color);
}
.product-single .sticky-product-bar salla-add-product-button salla-button .s-button-btn {
background-color: var(--main-color) !important;
color: white !important
}
/****************pages****************/
/****************Buy button****************/
.s-add-product-button-main .s-add-product-button-mini-checkout {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.s-add-product-button-mini-checkout-content:where([dir="rtl"], [dir="rtl"] *) {
color: white !important
}
/****************Buy button****************/