/* Add custom CSS styles below *
/* =========================
   خلفية متجر بِك - لون كريمي دافئ
========================= */

/* الخلفية العامة */
body,
.store-body,
.main-content,
.app-content,
main {
    background-color: #f3ebe3 !important;
}

/* الهيدر */
header,
.site-header,
.header-wrapper {
    background-color: #f3ebe3 !important;
}

/* الفوتر */
footer,
.site-footer {
    background-color: #f3ebe3 !important;
}

/* الأقسام الرئيسية */
.section,
.section-wrapper,
.home-section,
.container {
    background-color: transparent !important;
}

/* كروت المنتجات والتصنيفات */
.product-card,
.category-card,
.card,
.product-item {
    background-color: #ffffff !important;
    border-radius: 16px !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.04) !important;
}

/* البنرات والسلايدر */
.banner,
.slider,
.hero-section {
    border-radius: 18px !important;
    overflow: hidden;
}

/* الأزرار */
button,
.btn,
.button,
a.btn {
    background-color: #6b4f3b !important;
    border-color: #6b4f3b !important;
    color: #ffffff !important;
    border-radius: 12px !important;
}

/* Hover للأزرار */
button:hover,
.btn:hover,
.button:hover,
a.btn:hover {
    background-color: #5a3f2d !important;
    border-color: #5a3f2d !important;
}

/* الحقول */
input,
textarea,
select {
    border-radius: 12px !important;
}

/* القائمة */
nav,
.navbar {
    background-color: transparent !important;
}

/* =========================
   تحويل النصوص والأسهم داخل العناصر البنية إلى أبيض
========================= */

/* النصوص داخل الأزرار */
button,
.btn,
.button,
a.btn,
button span,
.btn span,
.button span,
a.btn span {
    color: #ffffff !important;
}

/* الأيقونات والأسهم */
button i,
.btn i,
.button i,
a.btn i,
svg,
svg path {
    fill: #ffffff !important;
    color: #ffffff !important;
}

/* الأسهم داخل السلايدر */
.swiper-button-next,
.swiper-button-prev,
.s-slider-nav-arrow {
    color: #ffffff !important;
}

/* أيقونات السلة والحساب والمفضلة */
.icon,
i,
svg {
    color: #ffffff !important;
}