@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');
:root {
    --primary: #f59e0b;
    --primary-rgb: 245, 158, 11;
    --secondary: #FFB300;
    --bg: #0c0802;
    --bg-card: #1a1208;
    --text: #fffbeb;
    --btn-bg: #f59e0b;
    --btn-text: #000000;
    --link-color: #fbbf24;
    --navbar-bg: #1a1208;
    --nav-text: #fffbeb;
    --hero-text: #f59e0b;
    --success-color: #f59e0b;
    --radius: 12px;
    --font: 'Poppins', sans-serif;
    --font-size: 16px;
    --font-weight: 400;
    --letter-spacing: 0px;
    --logo-height: 100px;
    --hero-bg: linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)), url('http://localhost/fivemarket/public/uploads/tenants/reactionrp/hero_bg_1771526719.png');
    /* Border Color Override if set, else auto calc */
    --border-override: #000000;
}

body { 
    font-family: var(--font) !important; 
    font-size: var(--font-size) !important;
    font-weight: var(--font-weight) !important;
    letter-spacing: var(--letter-spacing) !important;
}
.hero { background: var(--hero-bg) no-repeat center 31% !important; background-size: cover !important; }
.hero-title, .hero-subtitle, .hero h1, .hero p { color: var(--hero-text) !important; }

/* Glassmorphism & Card Elevation */
.product-card, .plan-card, .adm-card, .cart-sidebar {
    background: var(--bg-card) !important;
    border: 1px solid rgba(255,255,255,0.05) !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.3) !important;
    transition: all 0.2s ease-in-out !important;
}

.product-card:hover {
    transform: translateY(-4px);
    border-color: var(--primary) !important;
}

/* Solid Buttons - NO GRADIENTS */
.btn-primary, .btn-buy, .buy-btn, .adm-btn-primary {
    background: var(--btn-bg) !important;
    color: var(--btn-text) !important;
    border: 1px solid rgba(0,0,0,0.1) !important;
    box-shadow: 0 4px 0 rgba(0,0,0,0.1) !important; /* Flat design depth */
    font-weight: 800 !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    transition: all 0.2s ease !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.btn-primary *, .btn-buy *, .buy-btn *, .adm-btn-primary * {
    color: inherit !important; /* Force icons and text to follow button contrast */
}

.btn-primary:hover, .btn-buy:hover, .buy-btn:hover {
    filter: brightness(1.1);
    transform: translateY(-1px);
    box-shadow: 0 5px 0 rgba(0,0,0,0.1) !important;
}

.featured-badge {
    background: var(--primary) !important;
    color: var(--btn-text) !important;
    font-weight: 900 !important;
    text-transform: uppercase;
    font-size: 0.6rem !important;
    padding: 3px 8px !important;
    border-radius: 4px !important;
}

.price-val, .plan-price .price-val, .product-card .product-price, .product-price, .price-value {
    color: var(--success-color) !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

.product-category { 
    color: var(--primary) !important; 
    font-weight: 800 !important; 
    opacity: 0.9;
    text-transform: uppercase;
    font-size: 0.7rem;
}
.product-name { 
    color: var(--text) !important; 
    font-weight: 700 !important;
    line-height: 1.2;
}
.product-desc { 
    color: var(--text) !important; 
    opacity: 0.85; 
    font-size: 0.85rem !important;
    line-height: 1.6;
}

/* Premium Navbar */
header, .navbar {
    background: rgba(var(--primary-rgb), 0.02) !important;
    backdrop-filter: blur(20px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
    border-bottom: 1px solid rgba(255,255,255,0.05) !important;
    position: sticky;
    top: 0;
    z-index: 1000;
}

/* Scrollbar Style */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { 
    background: rgba(var(--primary-rgb), 0.2);
    border-radius: 10px;
    border: 3px solid var(--bg);
    background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover { background: var(--primary); }

.category-item.active .category-link, .cat-link.active {
    background: var(--primary) !important;
    color: #000 !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}

/* Price Highlight */
.price-val, .plan-price .price-val, .product-card span, .product-price, .price-value {
    color: var(--success-color) !important;
    font-weight: 800 !important;
}

.category-item.active .category-link, .cat-link.active, .category-link.active {
    background: var(--primary) !important;
    color: #000 !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}

