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

/* ===== هدر ===== */
[data-style="colorful-youth"] .main-header {
    border-bottom: none !important;
    box-shadow: var(--shadow-sm) !important;
}

[data-style="colorful-youth"] .main-header__search {
    border-radius: var(--radius-pill) !important;
}

[data-style="colorful-youth"] .main-header__search-btn {
    border-radius: 50% !important;
}

/* ===== هیروی تبلیغات ===== */
[data-style="colorful-youth"] .advertisement-slider {
    background: linear-gradient(135deg, var(--primary) 0%, var(--accent, var(--primary)) 100%) !important;
    border-radius: var(--radius-xl) !important;
    padding: 0.75rem !important;
    overflow: hidden;
}

[data-style="colorful-youth"] .slide-image {
    border-radius: var(--radius-lg) !important;
}

[data-style="colorful-youth"] .slider-nav {
    background: rgba(255, 255, 255, 0.9) !important;
    border-radius: 50% !important;
}

[data-style="colorful-youth"] .dot.is-active {
    background: #ffffff !important;
}

/* ===== میان‌برهای دسته‌بندی: دایره‌ای پاستلی ===== */
[data-style="colorful-youth"] .cat-shortcuts__img-wrap {
    border-radius: 50% !important;
    background: color-mix(in srgb, var(--primary) 14%, #ffffff) !important;
    border: none !important;
}

[data-style="colorful-youth"] .cat-shortcuts__item:hover .cat-shortcuts__img-wrap {
    transform: translateY(-4px) !important;
    box-shadow: var(--shadow-md) !important;
}

[data-style="colorful-youth"] .cat-shortcuts__label {
    font-weight: 600 !important;
}

/* ===== کارت محصول: خیلی گرد و نرم ===== */
[data-style="colorful-youth"] .product-card {
    border-radius: var(--radius-xl) !important;
    border: none !important;
    box-shadow: var(--shadow-sm) !important;
    transition: box-shadow 0.2s ease, transform 0.2s ease !important;
}

    [data-style="colorful-youth"] .product-card:hover {
        box-shadow: var(--shadow-md) !important;
        transform: translateY(-3px) !important;
    }

[data-style="colorful-youth"] .product-card__img-wrap {
    border-radius: var(--radius-xl) var(--radius-xl) 0 0 !important;
}

[data-style="colorful-youth"] .product-card__badge {
    background: var(--accent, var(--primary)) !important;
    color: #fff !important;
    border-radius: var(--radius-pill) !important;
    font-weight: 700 !important;
}

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

/* ===== عنوان بخش‌ها (پرفروش‌ترین‌ها، جدیدترین‌ها) ===== */
[data-style="colorful-youth"] .product-carousel__title {
    font-weight: 700 !important;
    background: linear-gradient(90deg, var(--primary), var(--accent, var(--primary)));
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

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

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

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

[data-style="colorful-youth"] .amazing-offers__side {
    background: linear-gradient(160deg, var(--primary) 0%, var(--accent, var(--primary)) 100%) !important;
    border-radius: var(--radius-xl) 0 0 var(--radius-xl) !important;
}

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

[data-style="colorful-youth"] .offer-card__ribbon-label {
    background: var(--accent, var(--primary)) !important;
    border-radius: var(--radius-pill) !important;
    font-weight: 700 !important;
}

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

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

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

/* ===== فوتر ===== */
[data-style="colorful-youth"] .site-footer {
    background: linear-gradient(160deg, var(--footer-bg, #221a3d), #150f28) !important;
    border-radius: var(--radius-xl) var(--radius-xl) 0 0 !important;
}

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

[data-style="colorful-youth"] .slide-overlay__title,
[data-style="colorful-youth"] .slide-overlay__subtitle {
    max-width: 100% !important;
    align-self: center !important;
}

[data-style="colorful-youth"] .slide-overlay__cta {
    align-self: center !important;
    background: #fff !important;
    color: var(--primary) !important;
}

/* ===== هدر: لوگو وسط، سرچ و اکشن‌ها دو طرف (الگوی اپ‌های موبایل مدرن) ===== */
@media (min-width: 992px) {
    [data-style="colorful-youth"] .main-header__inner {
        display: grid !important;
        grid-template-columns: 1fr auto 1fr !important;
        grid-template-areas: "search logo actions" !important;
        align-items: center !important;
    }

    [data-style="colorful-youth"] .main-header__logo {
        grid-area: logo !important;
        justify-self: center !important;
    }

    [data-style="colorful-youth"] .main-header__search {
        grid-area: search !important;
        max-width: 320px !important;
    }

    [data-style="colorful-youth"] .main-header__actions {
        grid-area: actions !important;
        justify-self: start !important;
    }
}