@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700&display=swap');:root {
    --color-primary: #312a71;
    --color-primary-dark: #0b044b;
    --color-primary-light: #575097;
    --color-primary-v-light: #8a83ca;
    --color-primary-reverse: #fdf6ff;
    --font-primary: 'Tajawal',sans-serif;
    --color-lux-background: #f8f9fa;
    --color-lux-text: #2c3e50;
    --card-shadow: 0 8px 25px rgba(44,62,80,0.1);
    --card-hover-shadow: 0 12px 35px rgba(44,62,80,0.15)
}

body,#app {
    font-family: var(--font-primary)!important;
    background-color: var(--color-lux-background)!important;
    color: var(--color-lux-text)
}

custom-salla-product-card.product-block {
    background-color: #ffffff;
    border: 1px solid #f0f0f0;
    border-radius: 15px;
    box-shadow: var(--card-shadow);
    transition: all 0.3s ease-in-out;
    overflow: hidden
}

custom-salla-product-card.product-block:hover {
    transform: translateY(-10px);
    box-shadow: var(--card-hover-shadow)
}

.product-block .badge--primary {
    background: #f26420!important;
    color: var(--color-primary-reverse)!important;
    border-radius: 0 0 10px 0!important;
    /* font-size: 13px; */
    font-weight: 500;
    padding: 6px 12px;
    clip-path: none!important;
    right: 0!important;
    left: auto!important;
}

.product-block salla-add-product-button button {
    background: linear-gradient(45deg,var(--color-primary),var(--color-primary-light))!important;
    border: none!important;
    border-radius: 10px!important;
    font-weight: 700!important;
    color: var(--color-primary-reverse)!important;
    transition: all 0.3s ease!important;
    box-shadow: 0 4px 15px rgba(49,42,113,0.2)
}

.product-block salla-add-product-button button:hover {
    transform: scale(1.05);
    filter: brightness(1.1)
}

.s-block .s-slider-block__title h2,.s-block h3 {
    position: relative;
    /* padding-bottom: 15px; */
}

.salla-advertisement {
    background-color: var(--color-primary)!important;
    color: var(--color-primary-reverse)!important;
    font-weight: 500
}

.store-header {
    box-shadow: 0 2px 10px rgba(0,0,0,0.05)
}

.store-footer {
    background-color: #ffffff!important;
    border-top: 1px solid #f0f0f0
}

.s-block--tabs-produtcs .tabs {
    justify-content: center
}

footer.store-footer {
    background-color: var(--color-primary-dark)!important;
    color: #e0e0e0;
    padding-top: 50px!important;
    padding-bottom: 20px!important;
    border-top: 5px solid var(--color-primary)
}

.footer-links h3,.footer-social-outer h3,.footer-payment-title {
    font-size: 1.25rem!important;
    font-weight: 700!important;
    margin-bottom: 20px!important;
    padding-bottom: 10px!important;
    position: relative;
    border-bottom: 2px solid var(--color-primary-light);
    display: inline-block
}

.footer-list__item a {
    transition: all 0.2s ease-in-out;
    padding: 6px 0;
    display: inline-block
}

.footer-list__item a:hover {
    transform: translateX(-5px);
    text-decoration: none!important
}

.footer-social-item {
    margin-bottom: 10px
}

.footer-social-item a {
    display: flex!important;
    align-items: center;
    background-color: rgba(255,255,255,0.05)!important;
    padding: 10px;
    border-radius: 8px;
    transition: background-color 0.3s ease;
    width: 100%
}

.footer-social-item a:hover {
    background-color: var(--color-primary)!important
}

.footer-social-item .icon-contact,.footer-social-item i {
    font-size: 22px!important;
    color: var(--color-primary-v-light)!important
}

.footer-social-item .support-value {
    margin-right: 12px;
    color: #ffffff
}

footer.store-footer span.line {
    display: none
}

footer.store-footer > span.text-sm {
    border-top: 1px solid rgba(255,255,255,0.1);
    padding-top: 25px!important;
    margin-top: 30px!important;
    color: #a0a0a0!important
}

footer.store-footer > span.text-sm a {
    color: #ffffff!important;
    font-weight: 500
}

.footer-is-dark .store-footer .text-gray-400 {
    color: #ffffff
}

@media only screen and (max-width: 492px) {
    .s-products-slider-card {
        max-width: 50vw;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
}

section#featured-products-style2-2 {
    padding: 0;
}

section.s-block.s-block--fixed-banner.wide-placeholder {
    margin-top: 12px;
}

/* --- الخطوة 6: تحسين النص أسفل الأيقونة --- */
.aali-categs .aali-categ-item h3 {
    margin-top: 12px;
    font-size: 12px;
    font-weight: 500;
    /* جعل الخط أسمك قليلاً */
}

@media only screen and (max-width: 1024px) {
    .index .app-inner .container {
        padding-left: 15px;
        padding-right: 15px;
        padding-top: 0;
        padding-bottom: 0;
    }
}

.s-block {
    margin-top: 0rem;
}

.top-navbar {
    padding: 0;
}

h3.title.title--primary.title--small.my-2.pc-t {
    font-weight: 600;
    font-size: .7rem;
    padding: 0;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 700;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
}

body.p-sub-last custom-salla-product-card .product-title p.product-subtitle {
    font-size: .7rem;
    margin-bottom: initial !important;
    font-size: .75rem !important;
    line-height: 1rem !important;
}

body.p-border-on custom-salla-product-card.product-block {
    background: #382e860d;
}

body.xl-price custom-salla-product-card .price-wrapper span.pc-t:not(.color-danger), body.xl-price custom-salla-product-card .price-wrapper .color-danger {
    font-size: 1.3rem;
    font-weight: bold;
    color: var(--color-primary);
}

section#featured-products-style2-2,section.s-block.s-block--best-offers.container.overflow-hidden.dm-text-main {
    margin-top: 1rem;
}

.s-button-element:not(:disabled):not([loading]) {
    border-radius: 10px!important;
}

@media (min-width: 1024px) {
    .aali-categs-wrapper.source-theme-settings.grid.grid-cols-4.dynamic-font-size.dynamic-gap.lg\:grid-cols-4.gap-4.lg\:gap-10.rounded-xl {
        gap: 3.5rem;
        display: grid;
        width: 50%;
        margin: auto;
    }
}

 

.navbar-brand img {
    max-height: 4.5rem;
    width: auto;
    max-width: 170px;
}