/* ==========================================================================
   Golden Al Maruf - Royal Golden Luxury Theme for Front Storefront
   Ultra-luxurious Royal Gold & Midnight Obsidian Palette
   ========================================================================== */

:root {
    --store-gold: #cfa852;
    --store-gold-bright: #ffd875;
    --store-gold-dark: #b8860b;
    --store-gold-deep: #9a7424;
    --store-gold-light: #fdf9ee;
    --store-gold-subtle: #faf6ee;
    --store-obsidian: #091a24;
    --store-obsidian-card: #0e2433;
    --store-line-gold: rgba(207, 168, 82, 0.28);
}

/* 1. Header Styling */
.store-header {
    border-top: 3px solid #cfa852 !important;
    border-bottom: 1px solid rgba(207, 168, 82, 0.22) !important;
    background: rgba(255, 255, 255, 0.97) !important;
    box-shadow: 0 4px 20px rgba(9, 26, 36, 0.06) !important;
}

.brand-mark {
    background: linear-gradient(135deg, #091a24, #122f42) !important;
    border: 1.5px solid #cfa852 !important;
    color: #ffd875 !important;
    box-shadow: 0 4px 14px rgba(207, 168, 82, 0.3) !important;
}

.store-brand:hover strong {
    color: var(--store-gold-dark) !important;
}

/* Nav links */
.store-nav > a:hover {
    color: var(--store-gold-dark) !important;
    border-color: rgba(207, 168, 82, 0.3) !important;
    background: #fdfaf2 !important;
}

.store-nav > .account-trigger {
    border-color: rgba(207, 168, 82, 0.35) !important;
    color: #091a24 !important;
    background: #fdfaf2 !important;
    font-weight: 700 !important;
}

.store-nav > .account-trigger i {
    color: #cfa852 !important;
}

.store-nav > .account-trigger:hover {
    border-color: #cfa852 !important;
    background: #fbf3dc !important;
    color: #9a7424 !important;
}

/* Cart Trigger Buttons */
.store-nav > a.cart-trigger,
.store-nav > .store-nav-btn,
.store-nav-btn,
.cart-trigger {
    background: linear-gradient(135deg, #cfa852, #a67c2e) !important;
    border: 1px solid #ffd875 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(207, 168, 82, 0.35) !important;
    font-weight: 700 !important;
}

.store-nav > a.cart-trigger:hover,
.store-nav > .store-nav-btn:hover,
.store-nav-btn:hover,
.cart-trigger:hover {
    background: linear-gradient(135deg, #dfb76c, #b88f39) !important;
    box-shadow: 0 6px 20px rgba(207, 168, 82, 0.48) !important;
    transform: translateY(-2px) !important;
}

.cart-trigger span#cartCount,
.cart-trigger .cart-badge,
.cart-panel-header h2 span {
    background: #091a24 !important;
    color: #ffd875 !important;
    border: 1px solid rgba(255, 216, 117, 0.45) !important;
    font-weight: 800 !important;
}

.header-product-search button {
    background: linear-gradient(135deg, #cfa852, #a67c2e) !important;
}

.header-product-search button:hover {
    background: linear-gradient(135deg, #dfb76c, #cfa852) !important;
}

.header-product-search:focus-within {
    border-color: #cfa852 !important;
    box-shadow: 0 0 0 3px rgba(207, 168, 82, 0.18) !important;
}

/* 2. Majestic Store Hero */
.store-hero {
    background: radial-gradient(ellipse at 85% 30%, rgba(207, 168, 82, 0.28), transparent 45%),
                radial-gradient(ellipse at 20% 70%, rgba(212, 175, 55, 0.15), transparent 40%),
                linear-gradient(125deg, #07151e 0%, #0d222e 45%, #153344 100%) !important;
    color: #ffffff !important;
    border-bottom: 2px solid rgba(207, 168, 82, 0.3) !important;
}

.store-hero .hero-copy h1 em {
    color: #ffd875 !important;
    text-shadow: 0 2px 10px rgba(255, 216, 117, 0.25);
}

.store-slide:after {
    background: linear-gradient(90deg, rgba(7, 21, 30, 0.92) 0%, rgba(13, 34, 46, 0.78) 50%, rgba(13, 34, 46, 0.25) 100%) !important;
}

.hero-cta {
    background: linear-gradient(135deg, #ffd875 0%, #cfa852 100%) !important;
    color: #091a24 !important;
    font-weight: 800 !important;
    box-shadow: 0 6px 20px rgba(207, 168, 82, 0.4) !important;
    border: 1px solid #ffe699 !important;
}

.hero-cta:hover {
    background: linear-gradient(135deg, #ffffff 0%, #ffd875 100%) !important;
    color: #091a24 !important;
    box-shadow: 0 8px 26px rgba(207, 168, 82, 0.55) !important;
    transform: translateY(-2px) !important;
}

.hero-bag {
    background: linear-gradient(145deg, #ffd875, #cfa852) !important;
    box-shadow: 0 20px 50px rgba(207, 168, 82, 0.35) !important;
}

.slide-dot.active {
    background: #cfa852 !important;
    border-color: #ffd875 !important;
}

/* 3. Trust Strip */
.trust-icon {
    color: #b8860b !important;
    background: #fdf9ee !important;
    border: 1px solid rgba(207, 168, 82, 0.4) !important;
    box-shadow: 0 3px 10px rgba(207, 168, 82, 0.12) !important;
}

/* 4. Catalog & Category Filters */
.catalog-section {
    background: #faf8f5 !important;
    border: 1px solid #ece4d4 !important;
    box-shadow: 0 6px 25px rgba(207, 168, 82, 0.05) !important;
}

.catalog-search input:focus {
    border-color: #cfa852 !important;
    box-shadow: 0 0 0 3px rgba(207, 168, 82, 0.16) !important;
}

.filter-chip {
    border: 1px solid #e5ded2 !important;
    background: #ffffff !important;
    color: #4b5563 !important;
    transition: all 0.2s ease !important;
}

.filter-chip:hover {
    border-color: #cfa852 !important;
    color: #b8860b !important;
    background: #fdfaf2 !important;
}

.filter-chip.active {
    background: linear-gradient(135deg, #cfa852, #a67c2e) !important;
    border-color: #cfa852 !important;
    color: #ffffff !important;
    box-shadow: 0 3px 10px rgba(207, 168, 82, 0.3) !important;
}

/* 5. Product Cards */
.product-card {
    border: 1px solid #ebe5d8 !important;
    background: #ffffff !important;
    border-radius: 16px !important;
    transition: all 0.25s ease !important;
}

.product-card:hover {
    border-color: #cfa852 !important;
    box-shadow: 0 14px 34px rgba(207, 168, 82, 0.18), 0 2px 10px rgba(0, 0, 0, 0.04) !important;
    transform: translateY(-5px) !important;
}

.product-category {
    background: #fffdf9 !important;
    border: 1px solid rgba(207, 168, 82, 0.45) !important;
    color: #9a7424 !important;
    font-weight: 700 !important;
}

.product-price {
    color: #b8860b !important;
    font-size: 19px !important;
    font-weight: 800 !important;
    letter-spacing: -0.01em;
}

.add-to-cart,
.product-options-link,
.btn-choose-options,
.add-to-cart.btn-has-options {
    background: linear-gradient(135deg, #cfa852, #a67c2e) !important;
    border: 1px solid #cfa852 !important;
    color: #ffffff !important;
    box-shadow: 0 3px 10px rgba(207, 168, 82, 0.25) !important;
    font-weight: 700 !important;
}

.add-to-cart:hover:not(:disabled),
.product-options-link:hover,
.btn-choose-options:hover:not(:disabled),
.add-to-cart.btn-has-options:hover:not(:disabled) {
    background: linear-gradient(135deg, #dfb76c, #b88f39) !important;
    border-color: #dfb76c !important;
    box-shadow: 0 6px 18px rgba(207, 168, 82, 0.42) !important;
    transform: translateY(-1px) !important;
}

.catalog-load-more {
    background: linear-gradient(135deg, #cfa852, #a67c2e) !important;
    border: 1px solid #cfa852 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(207, 168, 82, 0.3) !important;
}

.catalog-load-more:hover:not(:disabled) {
    background: linear-gradient(135deg, #dfb76c, #b88f39) !important;
    box-shadow: 0 6px 18px rgba(207, 168, 82, 0.45) !important;
}

/* 6. Cart Panel & Checkout */
.cart-item-price {
    color: #b8860b !important;
    font-weight: 700 !important;
}

.cart-total strong,
.checkout-total strong {
    color: #b8860b !important;
    font-weight: 800 !important;
}

.checkout-button {
    background: linear-gradient(135deg, #cfa852, #a67c2e) !important;
    border: 1px solid #ffd875 !important;
    color: #ffffff !important;
    font-weight: 800 !important;
    box-shadow: 0 5px 16px rgba(207, 168, 82, 0.35) !important;
    letter-spacing: 0.02em;
}

.checkout-button:hover:not(:disabled) {
    background: linear-gradient(135deg, #dfb76c, #b88f39) !important;
    box-shadow: 0 7px 22px rgba(207, 168, 82, 0.48) !important;
}

.payment-note {
    background: #fdf9ee !important;
    border: 1px solid rgba(207, 168, 82, 0.3) !important;
    color: #9a7424 !important;
}

.checkout-field input:focus,
.checkout-field textarea:focus {
    border-color: #cfa852 !important;
    box-shadow: 0 0 0 3px rgba(207, 168, 82, 0.18) !important;
}

/* 7. Footer */
.store-footer {
    border-top: 2px solid rgba(207, 168, 82, 0.3) !important;
    background: #091a24 !important;
    color: #cbd5e1 !important;
}

.store-footer > span {
    color: #94a3b8 !important;
}