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


/* ===== COLOR VARIABLES ===== */
:root {
    /* Primary Colors */
    --frontend-primary: #0d6efd;
    --frontend-secondary: #6c757d;
    --frontend-accent: #198754;
    
    /* Status Colors */
    --frontend-success: #28a745;
    --frontend-danger: #dc3545;
    --frontend-warning: #ffc107;
    --frontend-info: #17a2b8;
    
    /* Background Colors */
    --frontend-body-bg: #ffffff;
    --frontend-card-bg: #ffffff;
    --frontend-footer-bg: #2c3e50;
    --frontend-header-bg: #003e33;
    
    /* Navbar Colors */
    --frontend-navbar-bg: #003e33;
    --frontend-navbar-text: #ffffff;
    --frontend-navbar-link-hover: #ff6e14;
    
    /* Text Colors */
    --frontend-text-primary: #333333;
    --frontend-text-secondary: #6c757d;
    --frontend-text-muted: #999999;
    --frontend-link-color: #ff6e14;
    --frontend-link-hover-color: #ff8c42;
    --frontend-header-text: #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(13, 110, 253, 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(13, 110, 253, 0.15); }
.category-card:hover, .brand-card:hover { box-shadow: 0 4px 12px rgba(13, 110, 253, 0.15); }

/* ===== TYPOGRAPHY ===== */
body { font-family: 'Inter', sans-serif; font-size: 16px; font-weight: 400; line-height: 1.5; }
strong, b, .fw-bold { font-weight: 700; }
h1, .h1 { font-size: 2.5rem; font-weight: 700; }
h2, .h2 { font-size: 2rem; font-weight: 700; }
h3, .h3 { font-size: 1.75rem; font-weight: 700; }
h4, .h4 { font-size: 1.5rem; font-weight: 700; }
h5, .h5 { font-size: 1.25rem; font-weight: 700; }
h6, .h6 { font-size: 1rem; font-weight: 700; }