/* Add custom CSS styles below */ 
/* =========================================================
   ⚜️ تصميم احترافي لعرض المنتجات بشكل كبير + ملء الشاشة
   ⚜️ مناسب لمتاجر الذهب والسبائك (سلة)
   ========================================================= */

/* --- جعل الصفحة عريضة بدون حدود --- */
.container,
.section,
.wrapper,
.page-content {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 20px !important;
}

/* --- شبكة منتجات عريضة 4 أعمدة على الشاشات الكبيرة --- */
.products-grid,
.products,
.collection-products,
.row.products {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)) !important;
    gap: 25px !important;
    margin-top: 20px !important;
}

/* --- بطاقة ال*


/* ============================
   ⚜️ GOLD HERO SECTION
   ============================ */

.hero-gold {
    width: 100%;
    height: 420px;
    background: url('YOUR-BANNER-IMAGE') center/cover no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 40px;
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: 40px;
}

.hero-gold h1 {
    font-size: 3rem;
    color: #d4a334;
    font-weight: 900;
    text-shadow: 0px 4px 20px rgba(0,0,0,0.4);
}

.hero-gold p {
    font-size: 1.3rem;
    color: #fff;
    margin-top: 10px;
}

.hero-gold .hero-btn {
    margin-top: 25px;
    background: linear-gradient(135deg, #b88d15, #e6c45a);
    color: #fff;
    padding: 14px 30px;
    border-radius: 10px;
    font-size: 1.2rem;
    font-weight: bold;
    transition: 0.3s;
}

.hero-gold .hero-btn:hover {
    background: #d4a334;
}


/* =========================================================
   ⚜️ GOLD PRODUCT GRID — FULL WIDTH
   ========================================================= */

.container, .section, .wrapper, .page-content {
    max-width: 100% !important;
    padding: 0 20px !important;
}

/* شبكة عريضة */
.products-grid,
.products,
.collection-products,
.row.products {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)) !important;
    gap: 28px !important;
    width: 100% !important;
}

/* البطاقات */
.product, .product-card, .product-item, .product-box, .ss-product {
    background: #fff;
    padding: 22px;
    border-radius: 18px;
    box-shadow: 0 10px 35px rgba(0,0,0,0.08);
    transition: 0.35s ease;
    border: 1px solid #eee;
}

/* حركة hover */
.product:hover, .product-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 18px 40px rgba(0,0,0,0.15);
}

/* الصور */
.product img, .product-card img {
    width: 100% !important;
    height: 320px !important;
    object-fit: contain !important;
    margin-bottom: 15px;
    transition: 0.3s;
}

.product:hover img {
    transform: scale(1.03);
}

/* اسم المنتج */
.product-title, .product-name {
    font-size: 1.4rem !important;
    font-weight: 800 !important;
    color: #222 !important;
    margin-bottom: 8px !important;
}

/* السعر */
.product-price {
    font-size: 1.7rem !important;
    font-weight: 900 !important;
    color: #d4a334 !important;
}

/* زر الشراء */
.add-to-cart-btn, .product-btn, button.add-to-cart {
    width: 100% !important;
    padding: 15px !important;
    background: linear-gradient(135deg, #c49b34, #e3c15c) !important;
    color: #fff !important;
    border-radius: 12px !important;
    border: none !important;
    font-size: 1.15rem !important;
    font-weight: bold !important;
    transition: 0.3s;
}

.add-to-cart-btn:hover {
    background: #d4a334 !important;
}
 .,.,.