/* Dynamic Frontend CSS - Generated from Admin Settings */


/* ===== FONT IMPORTS ===== */
@import url("https://api.fontshare.com/v2/css?f[]=satoshi@400,500,700&display=swap");


/* ===== COLOR SETTINGS ===== */
:root {
    --frontend-primary: #f26822;
    --frontend-primary-rgb: 242, 104, 34;
    --frontend-secondary: #231f20;
    --frontend-secondary-rgb: 35, 31, 32;
    --frontend-accent: #ffc107;
    --frontend-success: #28a745;
    --frontend-danger: #dc3545;
    --frontend-warning: #ffc107;
    --frontend-info: #17a2b8;
    --frontend-body-bg: #ffffff;
    --frontend-card-bg: #ffffff;
    --frontend-footer-bg: #2c3e50;
    --frontend-header-bg: #ffffff;
    
    /* Navbar Colors */
    --frontend-navbar-bg: #ffffff;
    --frontend-navbar-text: #ff0000;
    --frontend-navbar-link-hover: #f26822;
    
    /* Text Colors */
    --frontend-text-primary: #231f20;
    --frontend-text-secondary: #6c757d;
    --frontend-text-muted: #999999;
    --frontend-link-color: #f26822;
    --frontend-link-hover-color: #231f20;
    --frontend-header-text: #ff0000;
    
    /* Footer-specific Link Colors */
    --frontend-footer-link-color: #d1d5db;
    --frontend-footer-link-hover-color: #ffffff;
    
    /* Border & Radius */
    --frontend-border-color: #e9ecef;
    --frontend-border-radius: 0.5rem;
    
    /* Button Colors */
    --frontend-btn-primary-bg: #FF6E14;
    --frontend-btn-primary-text: #ffffff;
}

/* ===== GLOBAL STYLES ===== */
body { background-color: var(--frontend-body-bg); color: var(--frontend-text-primary); }
a { color: var(--frontend-link-color); }
a:hover { color: var(--frontend-link-hover-color); }
.text-primary { color: var(--frontend-primary) !important; }
.text-secondary { color: var(--frontend-text-secondary) !important; }
.text-muted { color: var(--frontend-text-muted) !important; }

/* ===== BUTTONS ===== */
.btn-primary { background-color: var(--frontend-btn-primary-bg); border-color: var(--frontend-btn-primary-bg); color: var(--frontend-btn-primary-text); }
.btn-primary:hover { background-color: var(--frontend-secondary); border-color: var(--frontend-secondary); }
.btn-outline-primary { color: var(--frontend-primary); border-color: var(--frontend-primary); }
.btn-outline-primary:hover { background-color: var(--frontend-primary); color: white; }

/* ===== CARDS ===== */
.card { background-color: var(--frontend-card-bg); border-color: var(--frontend-border-color); border-radius: var(--frontend-border-radius); }
.product-card { border-color: var(--frontend-border-color); }
.category-card:hover, .brand-card:hover { border-color: var(--frontend-primary); }

/* ===== HEADER & FOOTER ===== */
header, .header { background-color: var(--frontend-header-bg); color: var(--frontend-header-text); }
footer, .footer { background-color: var(--frontend-footer-bg); }

/* ===== NAVBAR ===== */
.header-sticky { background: var(--frontend-navbar-bg) !important; }
.header-logo-primary, .header-logo-secondary { color: var(--frontend-navbar-text) !important; }
.header-nav-link { color: var(--frontend-navbar-text) !important; }
.header-nav-link:hover { color: var(--frontend-navbar-link-hover) !important; }
.header-dropdown-toggle { color: var(--frontend-navbar-text) !important; }
.header-dropdown-toggle:hover { color: var(--frontend-navbar-link-hover) !important; }
.header-mobile-toggle { color: var(--frontend-navbar-text) !important; }
.header-mobile-toggle:hover { color: var(--frontend-navbar-link-hover) !important; }
.header-nav-list a { color: var(--frontend-navbar-text) !important; }
.header-nav-list a:hover, .header-nav-list a.active { color: var(--frontend-navbar-link-hover) !important; }
.header-nav-list a.active { border-bottom-color: var(--frontend-navbar-link-hover) !important; }

/* ===== BADGES & ALERTS ===== */
.badge-primary { background-color: var(--frontend-primary); }
.badge-success { background-color: var(--frontend-success); }
.badge-danger { background-color: var(--frontend-danger); }
.badge-warning { background-color: var(--frontend-warning); }
.badge-info { background-color: var(--frontend-info); }
.alert-success { background-color: rgba(40, 167, 69, 0.1); border-color: #28a745; color: #28a745; }
.alert-danger { background-color: rgba(220, 53, 69, 0.1); border-color: #dc3545; color: #dc3545; }
.alert-warning { background-color: rgba(255, 193, 7, 0.1); border-color: #ffc107; color: #ffc107; }
.alert-info { background-color: rgba(23, 162, 184, 0.1); border-color: #17a2b8; color: #17a2b8; }

/* ===== FORMS ===== */
.form-control:focus { border-color: var(--frontend-primary); box-shadow: 0 0 0 0.2rem rgba(242, 104, 34, 0.25); }
.form-check-input:checked { background-color: var(--frontend-primary); border-color: var(--frontend-primary); }

/* ===== CUSTOM COMPONENTS ===== */
.contact-icon { background: var(--frontend-primary); }
.hover-shadow:hover { box-shadow: 0 8px 25px rgba(242, 104, 34, 0.15); }
.category-card:hover, .brand-card:hover { box-shadow: 0 4px 12px rgba(242, 104, 34, 0.15); }

/* ===== PRODUCT CARDS ===== */
.product-price { color: var(--frontend-primary) !important; }
.flash-price { color: var(--frontend-primary) !important; }
.product-card:hover { border-color: var(--frontend-primary); }
.badge-sale { background: var(--frontend-primary) !important; }
.badge-new { background: var(--frontend-success) !important; }
.badge-featured { background: var(--frontend-primary) !important; }
.add-to-cart-btn { background-color: var(--frontend-primary) !important; border-color: var(--frontend-primary) !important; }
.add-to-cart-btn:hover { background-color: var(--frontend-secondary) !important; border-color: var(--frontend-secondary) !important; }
.select-options-btn { border-color: var(--frontend-primary) !important; color: var(--frontend-primary) !important; }
.select-options-btn:hover { background-color: var(--frontend-primary) !important; border-color: var(--frontend-primary) !important; color: white !important; }
.product-card .btn-primary { background-color: var(--frontend-primary) !important; border-color: var(--frontend-primary) !important; }
.product-card .btn-primary:hover { background-color: var(--frontend-secondary) !important; border-color: var(--frontend-secondary) !important; }

/* ===== CATEGORIES & BRANDS ===== */
.category-card { border: 1px solid var(--frontend-border-color); background: var(--frontend-card-bg); }
.category-card:hover { border-color: var(--frontend-primary) !important; box-shadow: 0 4px 12px rgba(242, 104, 34, 0.15) !important; }
.category-card h3, .category-card .category-name { color: var(--frontend-text-primary); }
.category-card:hover h3, .category-card:hover .category-name { color: var(--frontend-primary) !important; }
.brand-card { border: 1px solid var(--frontend-border-color); }
.brand-card:hover { border-color: var(--frontend-primary) !important; box-shadow: 0 4px 12px rgba(242, 104, 34, 0.15) !important; }
.category-badge { background: var(--frontend-primary); }
.view-all-categories { color: var(--frontend-primary) !important; }
.view-all-categories:hover { color: var(--frontend-secondary) !important; }

/* ===== TITLES & HEADINGS ===== */
.page-title, .section-title { color: var(--frontend-text-primary); }
.page-title .highlight, .section-title .highlight { color: var(--frontend-primary); }
h1, h2, h3, h4, h5, h6 { color: var(--frontend-text-primary); }
.title-accent { color: var(--frontend-primary); }
.section-header { border-bottom: 2px solid var(--frontend-primary); }
.section-header::after { background: var(--frontend-primary); }

/* ===== FORMS - COMPREHENSIVE ===== */
.form-control:focus, .form-select:focus { border-color: var(--frontend-primary) !important; box-shadow: 0 0 0 0.2rem rgba(242, 104, 34, 0.25) !important; }
.form-check-input:checked { background-color: var(--frontend-primary) !important; border-color: var(--frontend-primary) !important; }
.form-check-input:focus { border-color: var(--frontend-primary) !important; box-shadow: 0 0 0 0.2rem rgba(242, 104, 34, 0.25) !important; }
.form-switch .form-check-input:checked { background-color: var(--frontend-primary) !important; }
.input-group-text { border-color: var(--frontend-border-color); }
.was-validated .form-control:valid, .form-control.is-valid { border-color: var(--frontend-success) !important; }
.was-validated .form-control:invalid, .form-control.is-invalid { border-color: var(--frontend-danger) !important; }
.contact-submit-btn:hover { box-shadow: 0 6px 20px rgba(242, 104, 34, 0.3) !important; }

/* ===== BUTTONS - ALL VARIATIONS ===== */
.btn-primary, button.btn-primary, a.btn-primary { background-color: var(--frontend-primary) !important; border-color: var(--frontend-primary) !important; }
.btn-primary:hover, .btn-primary:focus { background-color: var(--frontend-secondary) !important; border-color: var(--frontend-secondary) !important; box-shadow: 0 4px 12px rgba(35, 31, 32, 0.4) !important; }
.btn-outline-primary { color: var(--frontend-primary) !important; border-color: var(--frontend-primary) !important; }
.btn-outline-primary:hover { background-color: var(--frontend-primary) !important; border-color: var(--frontend-primary) !important; color: white !important; }
.btn-link { color: var(--frontend-primary) !important; }
.btn-link:hover { color: var(--frontend-secondary) !important; }
.btn-success { background-color: var(--frontend-success) !important; border-color: var(--frontend-success) !important; }
.btn-danger { background-color: var(--frontend-danger) !important; border-color: var(--frontend-danger) !important; }
.btn-warning { background-color: var(--frontend-warning) !important; border-color: var(--frontend-warning) !important; }
.btn-info { background-color: var(--frontend-info) !important; border-color: var(--frontend-info) !important; }
.contact-submit-btn:hover { box-shadow: 0 6px 20px rgba(242, 104, 34, 0.4) !important; }
.btn-add-to-cart-flash { box-shadow: 0 2px 8px rgba(242, 104, 34, 0.3) !important; }
.btn-add-to-cart-flash:hover { box-shadow: 0 4px 12px rgba(242, 104, 34, 0.4) !important; }
.thumbnail-image.active { box-shadow: 0 2px 8px rgba(242, 104, 34, 0.3) !important; }
.sticky-add-to-cart-btn { box-shadow: 0 2px 8px rgba(242, 104, 34, 0.3) !important; }
.sticky-add-to-cart-btn:hover { box-shadow: 0 4px 12px rgba(242, 104, 34, 0.4) !important; }
.product-add-to-cart-btn { box-shadow: 0 2px 8px rgba(242, 104, 34, 0.3) !important; }
.product-add-to-cart-btn:hover { box-shadow: 0 4px 12px rgba(242, 104, 34, 0.4) !important; }
.footer-newsletter-btn { box-shadow: 0 2px 4px rgba(242, 104, 34, 0.2) !important; }
.footer-newsletter-btn:hover { box-shadow: 0 2px 8px rgba(35, 31, 32, 0.3) !important; }

/* Cart, Checkout & Account Pages - Override Hardcoded Styles */
.cart-checkout-container .btn-primary, .success-container .btn-primary, .pending-container .btn-primary, .payment-container .btn-primary { background: var(--frontend-primary) !important; border: none !important; box-shadow: 0 4px 15px rgba(242, 104, 34, 0.3) !important; }
.cart-checkout-container .btn-primary:hover, .success-container .btn-primary:hover, .pending-container .btn-primary:hover, .payment-container .btn-primary:hover { background: var(--frontend-secondary) !important; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(35, 31, 32, 0.4) !important; }
.bg-primary { background: var(--frontend-primary) !important; }
.text-primary, a.text-primary { color: var(--frontend-primary) !important; }
.border-primary { border-color: var(--frontend-primary) !important; }

/* ===== PAGINATION ===== */
.pagination .page-link { color: var(--frontend-primary); border-color: var(--frontend-border-color); }
.pagination .page-link:hover { background-color: var(--frontend-primary); border-color: var(--frontend-primary); color: white; }
.pagination .page-item.active .page-link { background-color: var(--frontend-primary); border-color: var(--frontend-primary); }
.pagination .page-item.disabled .page-link { color: var(--frontend-text-muted); }

/* ===== TAGS & LABELS ===== */
.tag, .label { background: rgba(242, 104, 34, 0.1); color: var(--frontend-primary); border: 1px solid var(--frontend-primary); }
.tag:hover, .label:hover { background: var(--frontend-primary); color: white; }
.product-tag { background: rgba(242, 104, 34, 0.1); color: var(--frontend-primary); }

/* ===== LINKS & NAVIGATION ===== */
a:not(.btn) { color: var(--frontend-link-color); }
a:not(.btn):hover { color: var(--frontend-link-hover-color); }
.breadcrumb-item.active { color: var(--frontend-primary); }
.breadcrumb-item a { color: var(--frontend-link-color); }
.breadcrumb-item a:hover { color: var(--frontend-primary); }
.nav-tabs .nav-link.active { border-color: var(--frontend-border-color) var(--frontend-border-color) white; color: var(--frontend-primary); }
.nav-pills .nav-link.active { background-color: var(--frontend-primary); }

/* ===== ICONS & ACCENTS ===== */
.icon-primary { color: var(--frontend-primary); }
.bg-primary-light { background-color: rgba(242, 104, 34, 0.1); }
.border-primary { border-color: var(--frontend-primary) !important; }
.text-accent { color: var(--frontend-primary) !important; }
.feature-icon { background: var(--frontend-primary); color: white; }

/* ===== CART & CHECKOUT ===== */
.cart-item { border-color: var(--frontend-border-color); }
.cart-total { color: var(--frontend-primary); }
.checkout-step.active { background: var(--frontend-primary); color: white; }
.checkout-step.completed { background: var(--frontend-success); }
.order-summary { border: 1px solid var(--frontend-border-color); }
.price-highlight { color: var(--frontend-primary); font-weight: bold; }

/* ===== FILTERS & SORTING ===== */
.filter-option:hover { background: rgba(242, 104, 34, 0.1); }
.filter-option.active { background: var(--frontend-primary); color: white; }
.sort-option:hover { color: var(--frontend-primary); }
.price-range-slider .ui-slider-range { background: var(--frontend-primary); }
.price-range-slider .ui-slider-handle { border-color: var(--frontend-primary); background: var(--frontend-primary); }

/* ===== REVIEWS & RATINGS ===== */
.rating-star.filled { color: var(--frontend-warning); }
.review-helpful:hover { color: var(--frontend-primary); }
.review-verified { color: var(--frontend-success); }

/* ===== WISHLISTS & FAVORITES ===== */
.btn-wishlist.active { color: var(--frontend-danger) !important; }
.wishlist-count { background: var(--frontend-primary); color: white; }

/* ===== OFFERS & PROMOTIONS ===== */
.offer-badge { background: var(--frontend-primary); color: white; }
.promo-banner { background: linear-gradient(135deg, var(--frontend-primary), var(--frontend-secondary)); }
.discount-tag { background: var(--frontend-danger); color: white; }

/* ===== SEARCH ===== */
.search-results-item:hover { border-color: var(--frontend-primary); }
.search-highlight { background: rgba(242, 104, 34, 0.2); }


/* ===== TYPOGRAPHY ===== */
body, html { font-family: Satoshi, sans-serif !important; font-size: 16px; font-weight: 400; line-height: 1.5; }
p, div:not([class*='icon']), span:not(.iconify):not([class*='icon']):not([class*='fa-']), section, article, aside { font-family: Satoshi, sans-serif !important; }
svg, svg *, i[class*='icon'], i[class*='fa-'], .iconify { font-family: inherit !important; }
strong, b, .fw-bold, .font-weight-bold { font-weight: 700 !important; }
h1, .h1 { font-size: 2rem !important; font-weight: 700 !important; font-family: Satoshi, sans-serif !important; }
h2, .h2 { font-size: 1.5rem !important; font-weight: 700 !important; font-family: Satoshi, sans-serif !important; }
h3, .h3 { font-size: 1.2rem !important; font-weight: 700 !important; font-family: Satoshi, sans-serif !important; }
h4, .h4 { font-size: 1rem !important; font-weight: 700 !important; font-family: Satoshi, sans-serif !important; }
h5, .h5 { font-size: 0.95rem !important; font-weight: 700 !important; font-family: Satoshi, sans-serif !important; }
h6, .h6 { font-size: 0.85rem !important; font-weight: 700 !important; font-family: Satoshi, sans-serif !important; }

/* Navigation Typography */
.navbar, .nav-link, .navbar-nav, .navbar-brand { font-family: Satoshi, sans-serif !important; font-weight: 400; }
.nav-link { font-size: 16px; }
.navbar-brand { font-weight: 700 !important; }

/* Button Typography */
.btn, button, input[type='button'], input[type='submit'] { font-family: Satoshi, sans-serif !important; font-weight: 700 !important; }
.btn-lg { font-size: calc(16px * 1.25); }
.btn-sm { font-size: calc(16px * 0.875); }

/* Form Typography */
input, textarea, select, .form-control, .form-select { font-family: Satoshi, sans-serif !important; font-size: 16px; font-weight: 400; }
label, .form-label { font-family: Satoshi, sans-serif !important; font-weight: 700; }
::placeholder { font-family: Satoshi, sans-serif !important; }

/* Product Card Typography */
.product-name, .product-title { font-family: Satoshi, sans-serif !important; font-weight: 700 !important; font-size: 0.85rem !important; }
.product-price { font-family: Satoshi, sans-serif !important; font-weight: 700 !important; }
.product-description { font-family: Satoshi, sans-serif !important; font-weight: 400; }

/* Category & Brand Typography */
.category-name, .category-title { font-family: Satoshi, sans-serif !important; font-weight: 700 !important; font-size: 0.95rem !important; }
.brand-name { font-family: Satoshi, sans-serif !important; font-weight: 700 !important; font-size: 0.85rem !important; }

/* Footer Typography */
.footer-container, .footer-content, .footer-text { font-family: Satoshi, sans-serif !important; font-size: 16px; font-weight: 400; }
.footer-section-title { font-family: Satoshi, sans-serif !important; font-weight: 700 !important; font-size: 0.95rem !important; }
.footer-link { font-family: Satoshi, sans-serif !important; }

/* Links & Breadcrumbs */
a { font-family: Satoshi, sans-serif !important; font-weight: 400; }
.breadcrumb, .breadcrumb-item { font-family: Satoshi, sans-serif !important; font-size: calc(16px * 0.875); }

/* Table Typography */
table, .table, th, td { font-family: Satoshi, sans-serif !important; }
th { font-weight: 700 !important; }
td { font-weight: 400; }

/* Card Typography */
.card, .card-body, .card-text { font-family: Satoshi, sans-serif !important; }
.card-title { font-family: Satoshi, sans-serif !important; font-weight: 700 !important; font-size: 0.95rem !important; }

/* Badges & Tags */
.badge, .tag, .label { font-family: Satoshi, sans-serif !important; font-weight: 700; font-size: calc(16px * 0.875); }

/* Alerts & Messages */
.alert, .message, .notification { font-family: Satoshi, sans-serif !important; font-size: 16px; }

/* Pagination */
.pagination, .page-link { font-family: Satoshi, sans-serif !important; font-weight: 400; }

/* Dropdown & Modals */
.dropdown-menu, .dropdown-item { font-family: Satoshi, sans-serif !important; font-size: 16px; }
.modal, .modal-body { font-family: Satoshi, sans-serif !important; }
.modal-title { font-family: Satoshi, sans-serif !important; font-weight: 700 !important; font-size: 1rem !important; }


/* ===== LAYOUT SETTINGS ===== */
:root {
    --frontend-max-width: 1200px;
}

/* Container Max Width */
.container, .container-fluid { max-width: var(--frontend-max-width) !important; }
.container-xxl { max-width: var(--frontend-max-width) !important; }
.container-xl { max-width: var(--frontend-max-width) !important; }
.container-lg { max-width: var(--frontend-max-width) !important; }

/* Header & Footer Content */
header .container, header .container-fluid { max-width: var(--frontend-max-width) !important; }
footer .container, footer .container-fluid { max-width: var(--frontend-max-width) !important; }
.header .container, .header .container-fluid { max-width: var(--frontend-max-width) !important; }
.footer .container, .footer .container-fluid { max-width: var(--frontend-max-width) !important; }
.header-sticky .container, .header-sticky .container-fluid { max-width: var(--frontend-max-width) !important; }
nav .container, nav .container-fluid { max-width: var(--frontend-max-width) !important; }

/* Page Wrappers */
.page-wrapper, .main-content, .content-wrapper { max-width: var(--frontend-max-width); margin-left: auto; margin-right: auto; }
.checkout-progress-wrapper { max-width: var(--frontend-max-width); }
.sticky-cart-content { max-width: var(--frontend-max-width); }

/* Cart, Checkout & Account Pages */
.cart-checkout-container, .success-container, .pending-container, .payment-container, .account-container, .orders-container { max-width: var(--frontend-max-width) !important; margin: 0 auto; }
.dashboard-container, .profile-container, .address-container, .security-container, .wishlist-container { max-width: var(--frontend-max-width) !important; margin: 0 auto; }
.account-sidebar, .account-content, .order-details-container { font-family: Satoshi, sans-serif !important; }
.account-nav-link:hover { background-color: rgba(242, 104, 34, 0.05) !important; color: var(--frontend-primary) !important; }
.account-nav-link.active { background-color: rgba(242, 104, 34, 0.1) !important; color: var(--frontend-primary) !important; border-left: 3px solid var(--frontend-primary) !important; }
.account-sidebar .nav-link.active { background-color: var(--frontend-primary) !important; color: white !important; }
.account-sidebar .nav-link:hover { background-color: rgba(242, 104, 34, 0.1) !important; color: var(--frontend-primary) !important; }

/* Static Pages */
.page-header .container, .page-content .container { max-width: var(--frontend-max-width) !important; }
div.container[style*='max-width'] { max-width: var(--frontend-max-width) !important; }

/* Simple Checkout Progress */
.simple-checkout-progress { max-width: var(--frontend-max-width) !important; }
.progress-step.active .step-indicator { border-color: var(--frontend-primary) !important; color: var(--frontend-primary) !important; box-shadow: 0 0 0 4px rgba(242, 104, 34, 0.1) !important; }
.progress-step.active .step-label { color: var(--frontend-primary) !important; }


/* ===== FOOTER VARIABLES ===== */
:root {
    --footer-bg: #231f20;
    --footer-text: #ffffff;
    --footer-link: #d1d5db;
    --footer-link-hover: #f26822;
}

