﻿/* ==========================================================================
   استایل «مدرن بنفش» — الهام‌گرفته از اپ‌های خرید موبایل مدرن:
   هدر سبک و سفید، هیروی گرادیانت بنفش با تایپوگرافی سفید پررنگ، کارت‌های
   گرد و سبک با سایه‌ی خیلی ظریف، فاصله‌ی زیاد بین المان‌ها.
   ========================================================================== */

/* ===== هدر ===== */
[data-style="modern-purple"] .main-header {
    background: #ffffff !important;
    box-shadow: 0 1px 0 var(--border) !important;
}

[data-style="modern-purple"] .main-header__logo {
    font-weight: 700 !important;
}

[data-style="modern-purple"] .main-header__search {
    border-radius: var(--radius-pill) !important;
    background: var(--bg-secondary) !important;
    border: none !important;
}

[data-style="modern-purple"] .main-header__search-btn {
    border-radius: 50% !important;
    background: var(--primary) !important;
    color: #fff !important;
}

/* ===== هیروی تبلیغات ===== */
[data-style="modern-purple"] .advertisement-slider {
    background: linear-gradient(135deg, var(--primary) 0%, color-mix(in srgb, var(--primary) 60%, #7c3aed) 100%) !important;
    border-radius: var(--radius-xl) !important;
    padding: 1.25rem !important;
    overflow: hidden;
}

[data-style="modern-purple"] .slide-image {
    border-radius: var(--radius-lg) !important;
    object-fit: contain !important;
}

[data-style="modern-purple"] .slider-nav {
    background: rgba(255, 255, 255, 0.25) !important;
    border: none !important;
    color: #fff !important;
}

[data-style="modern-purple"] .dot.is-active {
    background: #fff !important;
}

/* ===== میان‌برهای دسته‌بندی: آیکون گرد و سبک ===== */
[data-style="modern-purple"] .cat-shortcuts__img-wrap {
    border-radius: 50% !important;
    background: var(--bg-secondary) !important;
    border: none !important;
}

[data-style="modern-purple"] .cat-shortcuts__item:hover .cat-shortcuts__img-wrap {
    box-shadow: var(--shadow-sm) !important;
    transform: translateY(-3px) !important;
}

[data-style="modern-purple"] .cat-shortcuts__label {
    font-weight: 500 !important;
    color: var(--text-muted) !important;
}

/* ===== کارت محصول: سبک، گرد، سایه‌ی ظریف ===== */
[data-style="modern-purple"] .product-card {
    border-radius: var(--radius-lg) !important;
    border: none !important;
    box-shadow: var(--shadow-sm) !important;
    background: var(--bg) !important;
}

[data-style="modern-purple"] .product-card__img-wrap {
    border-radius: var(--radius-lg) var(--radius-lg) 0 0 !important;
    aspect-ratio: 1 / 1 !important;
    background: var(--bg-secondary) !important;
}

[data-style="modern-purple"] .product-card__badge {
    background: var(--primary) !important;
    color: #fff !important;
    border-radius: var(--radius-pill) !important;
    font-weight: 600 !important;
}

[data-style="modern-purple"] .product-card__price {
    font-weight: 700 !important;
    color: var(--primary) !important;
}

[data-style="modern-purple"] .product-card__add-btn {
    border-radius: 50% !important;
    background: var(--primary) !important;
    box-shadow: var(--shadow-sm) !important;
}

/* ===== عنوان بخش‌ها ===== */
[data-style="modern-purple"] .product-carousel__title {
    font-weight: 700 !important;
    color: var(--text) !important;
}

[data-style="modern-purple"] .product-carousel__see-all {
    color: var(--primary) !important;
    font-weight: 600 !important;
}

[data-style="modern-purple"] .product-carousel__nav {
    border-radius: 50% !important;
    box-shadow: var(--shadow-sm) !important;
    border: none !important;
}

/* ===== پیشنهادهای شگفت‌انگیز ===== */
[data-style="modern-purple"] .amazing-offers {
    border-radius: var(--radius-xl) !important;
}

[data-style="modern-purple"] .amazing-offers__side {
    background: linear-gradient(160deg, var(--primary) 0%, color-mix(in srgb, var(--primary) 60%, #7c3aed) 100%) !important;
}

[data-style="modern-purple"] .offer-card {
    border-radius: var(--radius-lg) !important;
    border: none !important;
    box-shadow: var(--shadow-sm) !important;
}

[data-style="modern-purple"] .offer-card__ribbon-label {
    background: #fff !important;
    color: var(--primary) !important;
    border-radius: var(--radius-pill) !important;
    font-weight: 600 !important;
}

[data-style="modern-purple"] .offer-card__percent-badge {
    background: var(--primary) !important;
    color: #fff !important;
    border-radius: var(--radius-pill) !important;
}

/* ===== پرفروش‌ترین‌ها ===== */
[data-style="modern-purple"] .best-sellers-grid__rank {
    background: var(--primary) !important;
    color: #fff !important;
    border-radius: 50% !important;
    font-weight: 600 !important;
}

[data-style="modern-purple"] .best-sellers-grid__thumb-wrap {
    border-radius: var(--radius-lg) !important;
}

/* ===== دکمه‌های اصلی سایت ===== */
[data-style="modern-purple"] .btn-primary {
    border-radius: var(--radius-pill) !important;
    font-weight: 600 !important;
}

/* ===== فوتر ===== */
[data-style="modern-purple"] .site-footer {
    background: var(--footer-bg, #f5f3ff) !important;
    border-top: 1px solid var(--border) !important;
}

/* ===== هیروی متنی ===== */
[data-style="modern-purple"] .slide-overlay {
    display: flex !important;
    align-items: center !important;
    text-align: right !important;
    padding: 2rem !important;
}

[data-style="modern-purple"] .slide-overlay__cta {
    background: #fff !important;
    color: var(--primary) !important;
    border-radius: var(--radius-pill) !important;
}

/* ===== هدر: فشرده و سبک — سرچ کوچیک‌تر و کنار لوگو، فاصله‌ی کمتر (الگوی اپ موبایل) ===== */
@media (min-width: 992px) {
    [data-style="modern-purple"] .main-header__inner {
        display: grid !important;
        grid-template-columns: auto auto 1fr auto !important;
        grid-template-areas: "logo search . actions" !important;
        column-gap: 0.9rem !important;
        padding-top: 0.5rem !important;
        padding-bottom: 0.5rem !important;
    }

    [data-style="modern-purple"] .main-header__logo {
        grid-area: logo !important;
    }

    [data-style="modern-purple"] .main-header__search {
        grid-area: search !important;
        max-width: 280px !important;
    }

    [data-style="modern-purple"] .main-header__actions {
        grid-area: actions !important;
    }
}
