@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');
:root {
    --main-color: #12B6D1;
}


@font-face {
    font-family: 'DIN Next Arabic';
    src: url('https://res.cloudinary.com/dyyxhm3uc/raw/upload/v1781789467/ArbFONTS-DINNextLTArabic-Regular-2_xs4pyd.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'DIN Next Arabic';
    src: url('https://res.cloudinary.com/dyyxhm3uc/raw/upload/v1781789466/ArbFONTS-DINNextLTArabic-Medium-2_pjuewu.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'DIN Next Arabic';
    src: url('https://res.cloudinary.com/dyyxhm3uc/raw/upload/v1781789465/ArbFONTS-DINNextLTArabic-Bold-2_qekdtt.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'DIN Next Arabic';
    src: url('https://res.cloudinary.com/dyyxhm3uc/raw/upload/v1781789466/ArbFONTS-DINNextLTArabic-Heavy-1_tvllgk.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
}

body { 
    background:#fff;
    font-family: 'DIN Next Arabic',"Rubik", sans-serif !important;
}

.container {
    max-width: 100%;
    padding-inline: 112px;
}

.s-block--testimonials.container {
    max-width: 100%;
    padding-inline: 112px;
}

@media (max-width: 640px) {
    .container {
        padding-inline: 16px;
}

.s-block--testimonials.container {
    padding-inline: 16px;
}
}

@media (min-width: 640px) {
    .s-block {
        margin-top: 7rem !important;
    }
}

@media (max-width: 640px) {
    .s-block {
        margin-top: 2.5rem !important;
    }
}

@media (min-width: 640px) {
    .store-footer {
        margin-top: 7rem !important;
    }
}

@media (max-width: 640px) {
    .store-footer {
        margin-top: 2.5rem !important;
    }
}
/*****************Navbar*****************/
.main-nav-container {
    background: var(--main-color) !important;
    color: #fff;
}
.top-navbar {
    border:  0px;
    color: var(--main-color)
}

.topnav-link-item {
    border: none !important;
    color: var(--main-color);
}

span.s-cart-summary-count {
    background: white;
    color: var(--main-color);
}


.main-menu li.root-level > a {
    color: #fff;
    font-size: 16px;
    font-weight: 400;
} 


.main-menu li>a:hover {
    font-size: 18px;
    font-weight: 700;
}


@media (max-width: 786px) {
    ul.hidden.lg\:flex.items-center.rtl\:pl-4.ltr\:pr-4.whitespace-nowrap.ltr\:mr-\[35px\].rtl\:ml-\[35px\] {
    display: block !important
}
}
/*****************Navbar*****************/
/*****************Categories*****************/

/* @media (min-width: 768px) {
    .md\:grid-cols-5 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.col-span-2.sm\:col-span-1.md\:col-span-1.h-auto.md\:h-full.flex.flex-col {
    display: none
}

.col-span-2.sm\:col-span-1.md\:col-span-2:nth-of-type(2) {
    display: grid;
    grid-template-areas:
        "item2""item1";
        gap: 20px;
}

a.group.relative.flex.flex-col.overflow-hidden.px-4.h-\[300px\].md\:h-\[250px\].mb-4 {
    grid-area: item1;
    margin-bottom: 0px;
}

.grid.gap-4.grid-cols-2.sm\:grid-cols-2.lg\:grid-cols-2 {
    grid-area: item2;
}

section.s-block.s-block--images-grid a.group {
    border-radius: 24px;
}

.group:hover .group-hover\:scale-105 {
    transform: none !important;
} */



/**********************************/
/*****************Categories title*****************/
.box-title {
    margin-bottom: 40px;
    text-align: center
}

.box-title h2 {
    color: #064049;
    font-size: 40px;
    font-weight: 700;
}

.box-title p {
    font-size: 14px;
    font-weight: 600;
    color: #12B6D1;
    background-color: rgba(18, 182, 209, 0.2);
    border: 1px solid rgba(18, 182, 209, 0.3);
    width: fit-content;
    margin: auto;
    padding-inline: 12px;
    padding-block: 4px;
    margin-bottom: 16px;
    border-radius: 24px
}

@media (max-width: 768px) {
    .box-title h2 {
        font-size: 26px;
    }

    .box-title p {
    font-size: 12px;
    padding-inline: 8px;
    margin-bottom: 12px;
    padding-block: 2px;
}
}
/*****************Categories title*****************/
/*****************Categories*****************/
section.s-block.s-block--square-links.square-links-1 .auto-fit-grid , section.s-block.s-block--square-links.square-links-2 .auto-fit-grid, section.s-block.s-block--square-links.square-links-3 .auto-fit-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-template-areas:
        "item1 item2 item3 item3";
}

section.s-block.s-block--square-links.square-links-1 .auto-fit-grid  {
    grid-template-areas:
        "item1 item2 item3 item3";
}

section.s-block.s-block--square-links.square-links-1 li.text-center.group:nth-of-type(1) {
    grid-area: item1;
}
section.s-block.s-block--square-links.square-links-1 li.text-center.group:nth-of-type(2) {
    grid-area: item2;
}
section.s-block.s-block--square-links.square-links-1 li.text-center.group:nth-of-type(3) {
    grid-area: item3;
}

section.s-block.s-block--square-links.square-links-1 li.text-center.group:nth-of-type(1) .aspect-\[14\/13\], section.s-block.s-block--square-links.square-links-1 li.text-center.group:nth-of-type(2) .aspect-\[14\/13\] {
    aspect-ratio: 19 / 13;
}

section.s-block.s-block--square-links.square-links-1 li.text-center.group:nth-of-type(3) .aspect-\[14\/13\] {
    aspect-ratio: 39 / 13;
}

.mx-auto.max-w-7xl.px-6.lg\:px-8 {
    max-width: 100%;
    padding-inline: 112px;
} 

.group:hover .group-hover\:scale-110 {
    transform: none !important;
}

.overflow-hidden.rounded-2xl {
    border-radius: 24px;
}

section.s-block.s-block--square-links.square-links-2, section.s-block.s-block--square-links.square-links-3 {
    margin-top: 0px !important;
}


section.s-block.s-block--square-links.square-links-2 .auto-fit-grid {
    grid-template-areas:
        "item1 item1 item2 item3";
}

section.s-block.s-block--square-links.square-links-2 li.text-center.group:nth-of-type(1) {
    grid-area: item1;
}
section.s-block.s-block--square-links.square-links-2 li.text-center.group:nth-of-type(2) {
    grid-area: item2;
}
section.s-block.s-block--square-links.square-links-2 li.text-center.group:nth-of-type(3) {
    grid-area: item3;
}

section.s-block.s-block--square-links.square-links-2 li.text-center.group:nth-of-type(2) .aspect-\[14\/13\], section.s-block.s-block--square-links.square-links-2 li.text-center.group:nth-of-type(3) .aspect-\[14\/13\] {
    aspect-ratio: 18 / 13;
}

section.s-block.s-block--square-links.square-links-2 li.text-center.group:nth-of-type(1) .aspect-\[14\/13\] {
    aspect-ratio: 37 / 13;
} 

section.s-block.s-block--square-links.square-links-3 .auto-fit-grid  {
    grid-template-areas:
        "item1 item2 item3 item3";
}

section.s-block.s-block--square-links.square-links-3 li.text-center.group:nth-of-type(1) {
    grid-area: item1;
}
section.s-block.s-block--square-links.square-links-3 li.text-center.group:nth-of-type(2) {
    grid-area: item2;
}
section.s-block.s-block--square-links.square-links-3 li.text-center.group:nth-of-type(3) {
    grid-area: item3;
}

section.s-block.s-block--square-links.square-links-3 li.text-center.group:nth-of-type(1) .aspect-\[14\/13\], section.s-block.s-block--square-links.square-links-3 li.text-center.group:nth-of-type(2) .aspect-\[14\/13\] {
    aspect-ratio: 19 / 13;
}

section.s-block.s-block--square-links.square-links-3 li.text-center.group:nth-of-type(3) .aspect-\[14\/13\] {
    aspect-ratio: 39 / 13;
}


@media (max-width: 992px) {
    section.s-block.s-block--square-links.square-links-1, section.s-block.s-block--square-links.square-links-2, section.s-block.s-block--square-links.square-links-3 {
        display: none;
    }

    .mx-auto.max-w-7xl.px-6.lg\:px-8 {
       padding-inline: 16px;
} 
section.s-block.s-block--square-links.square-links-4 .aspect-\[14\/13\] {
    aspect-ratio: 17 / 13;
} 
}

@media (min-width: 992px) {
    section.s-block.s-block--square-links.square-links-4 {
        display: none;
    }
}
/*****************Categories*****************/
/*****************Banners*****************/
section.s-block.s-block--fixed-banner.wide-placeholder .container  {
    width: 100%;
    max-width: 100%;
    padding: 0px
}


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

section.s-block.s-block--fixed-banner.wide-placeholder.fixed-banner--12 {
    margin-top: 0px !important
}
/*****************Banners*****************/
/*****************Products*****************/
.home-block-title {
    text-align: right !important
}

.text-store-text-primary {
    color: #064049 !important;
}

.text-store-text-secondary {
    color: #064049 !important;
    font-size: .875rem;
}


.my-2.mx-auto.w-28.h-0.border-2.border-primary {
    border-radius: 20px;
    margin-inline: 0
}

custom-salla-product-card {
    box-shadow: -1px 1px 5px rgba(54, 54, 54, 0.12), -1px 1px 5px rgba(54, 54, 54, 0.12);
    border-radius: 12px;
    border: 2px solid transparent;
    border-color: #12B6D1 #12B6D1 #fff #fff;
}

.product-card__content-wrapper {
    text-align: right
}

.product-card__content-wrapper {
    text-align: start
}

.fit-slider-products .s-slider-swiper-wrapper .swiper-slide custom-salla-product-card {
    justify-content: start !important;
}

.index .s-slider-v-centered .s-slider-block__title-nav {
    display: none;
}

.product-card__promotion{
    background-color: var(--main-color) !important;
    border-radius: 8px;
}

.product-card__price .total-price {
    color: #12B6D1 !important;
    font-size: 1.25rem;
}

.product-card__price {
    justify-content: start !important;
}

p.product-card__subtitle.text-sm.text-store-text-secondary.leading-6.mb-2\.5 {
    color: #0E899D !important
}

.product-card__title a {
    color: #064049 !important;
    display: block;
    font-size: 1.25rem;
    font-weight: 500;
    line-height: 30px;
}

.product-card__addToCart__btn salla-button button {
    background-color: var(--main-color) !important;
    border-radius: 12px;
}

salla-add-product-button.product-card__addToCart__btn.hydrated {
    width: 90%;
    display: block;
    margin: auto;
}

.product-card__addToCart__btn salla-button {
    background: transparent;
}

@media (max-width: 768px) {
    .product-card__price .total-price {
    font-size: 1rem;
}
.product-card__title a {
    display: block !important;
    font-size: 1rem;
}
}

@media (max-width: 991px) {
    .simplified-products .offer-slide, .simplified-products .s-products-slider-card {
        width: 180px;
    }
}
/* custom-salla-product-card {
    box-shadow: -1px 1px 5px rgba(54, 54, 54, 0.12), -1px 1px 5px rgba(54, 54, 54, 0.12);
    border-radius: 12px !important;
    border-width: 2px;
  border-style: solid;
  padding: 2px;
    border-image: linear-gradient(to left, #3acfd5 0%, #fff 100%, #3acfd5 0%) 1;
} */

.swiper-wrapper {
    padding-block: 20px; 
}

.advanced-slider .swiper-wrapper {
    padding-block: 0px !important; 
}
/*****************Products*****************/
/*****************tabs Products*****************/
.btn-tabs-container {
    justify-content: end !important;
}

button.btn-tab-primary.product-tab.active {
    color: white !important;
    font-weight: 700 !important;
}

button.btn-tab-primary.product-tab {
    color: var(--main-color);
    border-color: var(--main-color);
     border-radius: 12px;
    padding-block: 10px;
    padding-inline: 16px

}

@media (max-width: 786px) {
    .btn-tabs-container {
    justify-content: start !important;
}
}
/*****************tabs Products*****************/
/*****************features*****************/
section.px-4.s-block.s-block--stats {
    background: var(--main-color);
    padding-block: 40px;
    margin-top: 0px !important
}

p.stats-number.text-4xl.font-bold {
    color: #ffF !important 
}

section.px-4.s-block.s-block--stats p.mb-2.text-2xl.font-bold.text-md.text-store-text-primary {
    color: #fff !important;
    opacity: .75;
    font-weight: 400;
    font-size: 18px;
}

.flex.items-center.justify-center.w-10.h-10.mx-auto.mb-3.rounded-full.sm\:w-12.sm\:h-12 {
    background: #FFFFFF26 !important;
    border-radius: 16px
}


section.s-block.s-block--enhanced-features.container.mini-features {
    /* margin-top: 0px !important; */
    background: #DBF4F8;
    padding-block: 40px;
}

@media (min-width: 768px) {
    section.s-block.s-block--enhanced-features.container.mini-features .md\:grid-cols-\[repeat\(4\2c minmax\(0\2c 1fr\)\)\] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.s-block--enhanced-features__item.group.overflow-hidden {
    border-radius: 12px;
    border: 0px;
    text-align: right !important;
    align-items: start;
}

.s-block--enhanced-features__item:hover {
    transform: none !important;
    box-shadow: none !important;
    border: 0px !important;
    scale: 1 !important;
}

.group:hover .group-hover\:scale-x-100, .group:hover .group-hover\:scale-y-100 {
    display: none;
}

.s-block--enhanced-features__item .feature-icon {
    margin-bottom: 0px;
}

.s-block--enhanced-features__item h2 {
    color: #064049;
}

.s-block--enhanced-features__item p {
    color: #0B6D7D;
}

@media (max-width: 991px) {
    .s-block--enhanced-features.mini-features [data-length="4"] {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .s-block--enhanced-features.mini-features .s-block--enhanced-features__item {
        padding: 20px !important;
    }
}
/*****************features*****************/
/*****************Questions*****************/
@media (min-width: 768px) {
    .md\:grid-cols-2 {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
}


section.s-block.relative.s-block--faq .my-2.mx-auto.w-28.h-0.border-2.border-primary {
    margin-inline: auto !important
}

section.s-block.relative.s-block--faq .grid.items-start.grid-cols-1.md\:grid-cols-2.gap-4{
    width: 66%;
    margin: auto;
    gap: 1.5rem;
        margin-top: 40px;

}

.single-faq {
  border-color: #DBF4F8;
  padding-block: 20px
}

i.sicon-keyboard_arrow_down.bg-primary.text-primary-reverse.rounded-full.text-base.p-\[4px\], .sicon-keyboard_arrow_up {
  background: #E7F8FA
}

.sicon-keyboard_arrow_down:before, .sicon-keyboard_arrow_up:before  {
    color: #12B6D1;
}

section.s-block.relative.s-block--faq .text-store-text-primary {
    color: #064049;
    font-weight: 700;
}

@media (max-width: 768px) {
    section.s-block.relative.s-block--faq .grid.items-start.grid-cols-1.md\:grid-cols-2.gap-4{
    width: 100%;
}
p.text-base.text-store-text-primary.rtl\:text-right.ltr\:text-left {
  font-size: 14px
}

.single-faq {
    margin-bottom: 20px;
}
}
/*****************Questions*****************/
/*****************loacation*****************/
section.s-block.s-block--store-branches.s-block--store-branches--buttons .max-w-7xl {
    max-width: 96rem;
}

section.s-block.s-block--store-branches.s-block--store-branches--buttons .my-2.mx-auto.w-28.h-0.border-2.border-primary {
    display: none !important;
}

.s-block--store-branches .btn-tab-secondary.active, .s-block--store-branches .btn-tab-secondary.active i {
    color: #fff !important;
    background-color: #12B6D1 !important;
    border-color: #12B6D1 !important;
}

.s-block--store-branches .btn-tab-secondary.active i {
    color: #fff !important;
}
/*****************loacation*****************/
/*****************footer*****************/
@media (min-width: 1024px) {
    footer .lg\:grid-cols-5 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.store-footer.basic-footer .footer-description+p {
    font-size: 18px;
    font-weight: 300 !important;
    line-height: 30px
}

.user-contacts .links-contact .links-icon {
    border: 0px;
    opacity: 1;
}

.footer-list a {
    font-weight: 300;
    font-size: 18px;
}

.store-footer h3 {
    font-size: 1.5rem; 
    margin-bottom: .75rem;
}

footer .py-2\.5.lg\:py-0 {
    color: var(--main-color) !important;
}

.footer-is-custom .store-footer .footer-rights p {
    color: var(--main-color);
}

footer li.s-social-link a {
    border: 0px
}

@media (max-width: 768px) {
    footer .grid.grid-cols-2.lg\:grid-cols-5.lg\:gap-6 {
        display: flex;
        flex-direction: column;
        gap: 20px;
    } 

    .footer-badges.flex.items-center.justify-center.lg\:justify-start {
    justify-content: start
}
.store-footer.basic-footer .footer-description+p {
    text-align: right;
}

footer img.img-fluid.mx-auto.lg\:mx-\[unset\] {
    margin-inline: 0px
} 
}
/*****************footer*****************/