/* Add custom CSS styles below */ 
/* ===== AFAQ BRAND — SALLA CUSTOM CSS ===== */

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

/* Override Salla's built-in color variables — cascades into all components */
:root {
    --font-main: 'Nunito', 'PingARLT', sans-serif;
    --color-primary: #C43A8E;
    --color-primary-dark: #3D1A6E;
    --color-primary-light: #e05cb5;
    --color-primary-reverse: #fff0f8;
}

/* ===== GLOBAL FONT ===== */
body, h1, h2, h3, h4, h5, h6, p, a, span, button, input, label {
    font-family: 'Nunito', 'PingARLT', sans-serif !important;
}

/* ===== TAILWIND UTILITY OVERRIDES ===== */
.text-primary { color: #C43A8E !important; }
.bg-primary { background-color: #C43A8E !important; }
.border-primary { border-color: #C43A8E !important; }
.hover\:text-primary:hover { color: #C43A8E !important; }

/* ===== TOP NAVBAR (dark strip) ===== */
.top-navbar {
    background: #3D1A6E !important;
}
.top-navbar * {
    color: #fff !important;
}

/* ===== MAIN NAV ===== */
.main-nav-container {
    background: #ffffff !important;
    border-bottom: 2px solid #f0e0f8 !important;
    box-shadow: 0 2px 12px rgba(61,26,110,0.08) !important;
}

custom-main-menu a,
.main-nav-container a {
    color: #3D1A6E !important;
    font-weight: 700 !important;
}

custom-main-menu a:hover,
.main-nav-container a:hover {
    color: #C43A8E !important;
}

/* ===== HERO SLIDER ===== */
.home-slider__content h2 {
    color: #ffffff !important;
    font-weight: 900 !important;
    text-shadow: 0 2px 20px rgba(0,0,0,0.45) !important;
}

.home-slider__content .description {
    color: rgba(255,255,255,0.9) !important;
    font-weight: 600 !important;
}

.swiper-button-next,
.swiper-button-prev {
    background: #C43A8E !important;
    border-radius: 50% !important;
    width: 44px !important;
    height: 44px !important;
    color: #fff !important;
}

/* ===== SECTION TITLES ===== */
.s-block__title h2,
.s-block__title h3 {
    color: #3D1A6E !important;
    font-weight: 800 !important;
}

.s-block__display-all {
    color: #C43A8E !important;
    font-weight: 700 !important;
}

.s-block__display-all:hover {
    color: #3D1A6E !important;
}

/* ===== BRANDS SECTION ===== */
.s-block--logos-slider {
    background: #f8f0fd !important;
}

.brand-item {
    background: #ffffff !important;
    border-radius: 16px !important;
    border: 2px solid #f0e0f8 !important;
    padding: 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.2s ease !important;
}

.brand-item:hover {
    border-color: #C43A8E !important;
    box-shadow: 0 8px 24px rgba(196,58,142,0.15) !important;
    transform: translateY(-2px) !important;
}

/* ===== PRODUCT CARDS (shadow DOM parts) ===== */
salla-product-card::part(card) {
    border-radius: 16px !important;
    border: 1px solid #f0e0f8 !important;
    overflow: hidden !important;
    transition: box-shadow 0.2s ease !important;
}

salla-product-card::part(card):hover {
    box-shadow: 0 8px 30px rgba(196,58,142,0.2) !important;
}

salla-product-card::part(price),
salla-product-card::part(special-price) {
    color: #C43A8E !important;
    font-weight: 800 !important;
}

salla-product-card::part(add-to-cart),
salla-add-product-button::part(button) {
    background: linear-gradient(135deg, #C43A8E, #3D1A6E) !important;
    border-radius: 50px !important;
    border: none !important;
    color: #fff !important;
    font-weight: 700 !important;
}

/* ===== REVIEWS ===== */
.s-reviews-header {
    color: #3D1A6E !important;
    font-weight: 800 !important;
}

.s-reviews-testimonial__icon svg {
    fill: #C43A8E !important;
}

.s-reviews-testimonial__name_wrapper h2 {
    color: #3D1A6E !important;
}

/* ===== FOOTER ===== */
.store-footer,
.store-footer__inner {
    background: #3D1A6E !important;
}

.store-footer h3 {
    color: #ffffff !important;
    font-weight: 800 !important;
}

.store-footer p,
.store-footer span,
.store-footer li,
.store-footer a {
    color: rgba(255,255,255,0.75) !important;
}

.store-footer a:hover,
.store-footer .hover\:text-primary:hover {
    color: #E91E8C !important;
}

.copyright-text a:hover {
    color: #E91E8C !important;
}

/* ===== CART + ICON ACCENTS ===== */
.sicon-shopping-bag,
.sicon-menu {
    color: #C43A8E !important;
}

/* ===== GENERAL LINKS ===== */
a:hover {
    color: #C43A8E !important;
}