
/* Dynamic Frontend Color System - Generated CSS Variables */
/* DEBUG: Primary Color = #377dff */
/* DEBUG: Card Background = #ffffff */
/* DEBUG: Section Background = #f8f9fa */
/* DEBUG: URL Parameters = [] */
/* DEBUG: Timestamp = 2025-12-21 18:22:00 */
:root {
    /* Primary Colors */
    --primary-color: #377dff;
    --primary-hover: #2c64cc;
    --primary-light: rgba(55, 125, 255, 0.1);
    --primary-dark: #2c64cc;
    
    /* Secondary Colors */
    --secondary-color: #6c757d;
    --secondary-hover: #565d64;
    --secondary-light: rgba(108, 117, 125, 0.1);
    --secondary-dark: #565d64;
    
    /* Card Colors */
    --card-background-color: #ffffff;
    --card-border-color: #e9ecef;
    --card-hover-border-color: #377dff;
    
    /* Text Colors */
    --text-primary-color: #2c3e50;
    --text-secondary-color: #6c757d;
    --text-muted-color: #868e96;
    --text-light-color: #ffffff;
    
    /* Background Colors */
    --section-background-color: #f8f9fa;
    --bg-primary: #ffffff;
    --bg-secondary: #f8f9fa;
    --bg-tertiary: #e9ecef;
    --bg-dark: #343a40;
    
    /* Accent Colors */
    --accent-color: #28a745;
    --accent-hover: #208537;
    --accent-light: rgba(40, 167, 69, 0.1);
    --accent-dark: #208537;
    
    /* Status Colors */
    --success-color: #28a745;
    --warning-color: #ffc107;
    --danger-color: #dc3545;
    --info-color: #17a2b8;
    
    /* Border Colors */
    --border-color: #e9ecef;
    --border-light: #e9ecef;
    --border-dark: #6c757d;
    
    /* Shadow Colors */
    --shadow-light: rgba(0, 0, 0, 0.075);
    --shadow-medium: rgba(0, 0, 0, 0.15);
    --shadow-dark: rgba(0, 0, 0, 0.25);
}

/* Apply colors to all elements */
.btn-primary,
.btn,
.footer-social-links a,
.a2a_kit a,
.site-header .toolbar .toolbar-item > a > div > .compare-icon > .count-label,
.site-header .toolbar .toolbar-item > a > div > .cart-icon > .count-label,
.hero-slider > .owl-carousel.dots-inside .owl-dots .owl-dot,
.widget-title::after,
.scroll-to-top-btn:hover,
a.list-group-item::before,
.list-group-item-action::before,
.left-category-area .category-header h4,
.section-title h2::before,
.product-card .countdown span,
.flash-deal-slider.owl-carousel .owl-nav div:hover,
.features-slider.owl-carousel .owl-nav div:hover,
.newproduct-slider.owl-carousel .owl-nav div:hover,
.bestseller-slider.owl-carousel .owl-nav div:hover,
.toprated-slider.owl-carousel .owl-nav div:hover,
.pagination li a:hover,
.pagination li span:hover,
.pagination li.active span,
.pagination li.active a,
.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active,
.u-d-d i,
.details-page-top-right-content .countdown span,
.mm-heading-area,
.section-title .links a::before,
.flash-sell-area.theme2 .product-card .countdown,
.menu-top-area,
.product-card .product-button-group .product-button,
.deal-of-day-section .countdown,
.brand-slider.owl-carousel .owl-nav div:hover, 
.home-blog-slider.owl-carousel .owl-nav div:hover, 
.popular-category-slider.owl-carousel .owl-nav div:hover, 
.js-cookie-consent-agree
{
    background-color: var(--primary-color) !important;
}

/* Primary Text Colors (Links, Active States) */
.hero-slider .owl-carousel .owl-nav div,
.left-category-area .category-list .navi-link:hover span.text-gray-dark,
.site-header .navbar .nav-inner .right-info i,
.h-t-social-area ul li a:hover,
.menu-top-area .login-register:hover,
.t-h-dropdown a:hover,
.t-h-dropdown a.active,
.navi-link:hover,
.site-header .site-menu > ul > li:hover > a,
.widget-categories ul > li.active > a,
.widget-links ul > li.active > a,
.details-page-top-right-content  a,
.widget-categories ul > li > a:hover,
.widget-links ul > li > a:hover,
.product-card .product-title > a:hover,
.product-card .product-category > a:hover,
.nav-tabs .nav-link:hover,
.post-title > a:hover,
.post-meta > li > a:hover,
.widget-featured-posts > .entry .entry-title > a:hover,
.widget-featured-products > .entry .entry-title > a:hover,
.widget-cart > .entry .entry-title > a:hover,
.entry .entry-delete a,
.steps .step.active .step-title, .steps .step.active > i,
.text-primary,
.shopping-cart .product-item .product-title > a:hover,
.wishlist-table .product-item .product-title > a:hover,
.order-table .product-item .product-title > a:hover,
.list-group-item.active,
a.list-group-item:hover,
 a.list-group-item:focus, a.list-group-item:active,
 .list-group-item-action:hover,
 .list-group-item-action:focus,
 .list-group-item-action:active,
 .progress-steps li.active .icon,
 .comparison-table .comparison-item .comparison-item-title:hover,
 .site-header .site-menu > ul > li.active > a,
 .breadcrumbs > li > a:hover,
 .faq-box:hover .link,
 .left-category-area .category-list .sub-c-box .title:hover,
 .left-category-area .category-list .sub-c-box .child-category a:hover,
 .section-title .links a:hover, 
 .section-title .links a.active,
 #quick_filter li a:hover,
 #quick_filter li a.active,
 .section-title .right_link:hover,
 .popular-category.theme3 .links a.active,
 .popular-category.theme3 .links a:hover,
 .site-header .search-box-wrap .input-group .serch-result .bottom-area a:hover,
 .shop-view>a,
.text-base-color,
.text-base-color:hover
{
    color: var(--primary-color) !important;
}

/* Secondary Text Colors (Prices, Descriptions) */
.product-card .product-price,
.genius-banner .content .content-inner p,
 .genius-banner .inner-content p,
 .details-page-top-right-content .price-area .main-price,
.free-shippin-aa,
.section-subtitle,
.service-description,
.process-step
{
    color: var(--text-secondary-color) !important;
}

/* Primary Text Colors (Headings, Titles) */
.section-title,
.service-title,
.process-title,
.card-title,
h1, h2, h3, h4, h5, h6
{
    color: var(--text-primary-color) !important;
}

/* Muted Text Colors */
.text-muted,
.small,
small
{
    color: var(--text-muted-color) !important;
}

/* Border colors */
.btn-outline-primary,
.category-scroll::-webkit-scrollbar-thumb,
.t-h-dropdown .t-h-dropdown-menu,
.product-card:hover,
.brand-slider .slider-item a:hover,
.genius-banner:hover,
.form-control:focus,
.shop-view > a.active,
.custom-control .custom-control-input:checked ~ .custom-control-label::before,
.product-gallery .product-thumbnails > li.active > a,
.steps .step.active,
.quickFilter .quickFilter-title:hover,
#quick_filter
{
    border-color: var(--primary-color) !important;
}

.btn-outline-primary {
    color: var(--primary-color) !important;
    background: none !important;
}

.btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: #fff !important;
}

/* Scrollbar colors */
.category-scroll {
    scrollbar-color: var(--primary-color) #e4e4e4;
    scrollbar-width: thin;
}

/* Form focus colors */
.input-group .form-control:focus ~ .input-group-addon {
    color: var(--primary-color) !important;
}

/* Card Colors */
.card,
.service-card,
.process-card,
.product-card
{
    background-color: var(--card-background-color) !important;
    border-color: var(--card-border-color) !important;
}

.card:hover,
.service-card:hover,
.process-card:hover,
.product-card:hover
{
    border-color: var(--card-hover-border-color) !important;
    box-shadow: 0 10px 30px var(--shadow-medium) !important;
}

.card-header {
    background-color: var(--section-background-color) !important;
    border-bottom-color: var(--card-border-color) !important;
}

/* Section Background Colors */
.services-section,
.process-section,
.section-bg-light
{
    background-color: var(--section-background-color) !important;
}

/* Additional Service Section Specificity - Maximum Priority */
.services-section,
.services-section.py-5
{
    background-color: var(--section-background-color) !important;
}

.services-section .service-card,
.services-section .service-card.h-100,
.services-section .service-card.text-center,
.services-section .service-card.p-4,
.services-section .service-card.border,
.services-section .service-card.rounded-3,
.services-section .service-card.shadow-sm,
.services-section .col-lg-3 .service-card,
.services-section .col-md-6 .service-card
{
    background-color: var(--card-background-color) !important;
    border-color: var(--card-border-color) !important;
}

.services-section .service-title,
.services-section .service-title.h5,
.services-section .service-title.mb-3,
.services-section h5.service-title,
.services-section h5.service-title.mb-3
{
    color: var(--text-primary-color) !important;
}

.services-section .service-description,
.services-section .service-description.text-muted,
.services-section p.service-description,
.services-section p.service-description.text-muted
{
    color: var(--text-secondary-color) !important;
}

.services-section .section-title,
.services-section h2.section-title
{
    color: var(--text-primary-color) !important;
}

/* Bootstrap Override Rules for Services */
.services-section .text-center.service-card,
.services-section .p-4.service-card,
.services-section .border.service-card,
.services-section .rounded-3.service-card,
.services-section .shadow-sm.service-card
{
    background-color: var(--card-background-color) !important;
    border-color: var(--card-border-color) !important;
}

.services-section .text-muted.service-description,
.services-section .mb-3.service-title
{
    color: var(--text-secondary-color) !important;
}

.services-section .mb-3.service-title,
.services-section .h5.service-title
{
    color: var(--text-primary-color) !important;
}

/* Force override for any remaining Bootstrap styles */
.services-section * {
    box-sizing: border-box;
}

.services-section .service-card {
    background-color: var(--card-background-color) !important;
    border: 1px solid var(--card-border-color) !important;
}

.services-section .service-title {
    color: var(--text-primary-color) !important;
}

/* DEBUGGING: Force all services section styles with fallbacks */
section.services-section {
    background-color: var(--section-background-color, #2FFA00) !important;
    background: var(--section-background-color, #2FFA00) !important;
}

section.services-section .service-card {
    background-color: var(--card-background-color, #FF4118) !important;
    background: var(--card-background-color, #FF4118) !important;
    border: 1px solid var(--card-border-color, #E9ECEF) !important;
}

section.services-section .service-title {
    color: var(--text-primary-color, #000000) !important;
}

section.services-section .service-description {
    color: var(--text-secondary-color, #5A6268) !important;
}

section.services-section .section-title {
    color: var(--text-primary-color, #000000) !important;
}

section.services-section .section-subtitle {
    color: var(--text-secondary-color, #5A6268) !important;
}

/* OVERRIDE ALL HARDCODED COLORS FROM styles.min.css */
/* These rules have maximum specificity to override any hardcoded colors */

/* Override all primary color instances */
.left-category-area .category-header h4,
.section-title h2::before,
.product-card .countdown span,
.flash-deal-slider.owl-carousel .owl-nav div:hover,
.features-slider.owl-carousel .owl-nav div:hover,
.newproduct-slider.owl-carousel .owl-nav div:hover,
.bestseller-slider.owl-carousel .owl-nav div:hover,
.toprated-slider.owl-carousel .owl-nav div:hover,
.pagination li a:hover, .pagination li span:hover,
.pagination li.active span, .pagination li.active a,
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active,
.u-d-d i,
.details-page-top-right-content .countdown span,
.mm-heading-area,
.section-title .links a::before,
.flash-sell-area.theme2 .product-card .countdown,
.menu-top-area,
.product-card .product-button-group .product-button,
.deal-of-day-section .countdown,
.bestseller-slider.owl-carousel .owl-nav div:hover, 
.brand-slider.owl-carousel .owl-nav div:hover, 
.features-slider.owl-carousel .owl-nav div:hover, 
.flash-deal-slider.owl-carousel .owl-nav div:hover, 
.home-blog-slider.owl-carousel .owl-nav div:hover, 
.newproduct-slider.owl-carousel .owl-nav div:hover, 
.popular-category-slider.owl-carousel .owl-nav div:hover, 
.toprated-slider.owl-carousel .owl-nav div:hover,
.btn,
.footer-social-links a,
.a2a_kit a
{
    background: var(--primary-color, #B14493) !important;
}

.site-header .toolbar .toolbar-item > a > div > .compare-icon > .count-label, 
.site-header .toolbar .toolbar-item > a > div > .cart-icon > .count-label,
.btn-primary,
.hero-slider > .owl-carousel.dots-inside .owl-dots .owl-dot,
.widget-title::after,
.scroll-to-top-btn:hover,
a.list-group-item::before, .list-group-item-action::before
{
    background-color: var(--primary-color, #B14493) !important;
}

.hero-slider .owl-carousel .owl-nav div,
.left-category-area .category-list .navi-link:hover span.text-gray-dark,
.site-header .navbar .nav-inner .right-info i,
.h-t-social-area ul li a:hover,
.menu-top-area .login-register:hover,
.t-h-dropdown a:hover,
.t-h-dropdown a.active,
.product-card .product-price,
.genius-banner .content .content-inner p,
.navi-link:hover,
.site-header .site-menu > ul > li:hover > a,
.widget-categories ul > li.active > a,
.widget-links ul > li.active > a,
.details-page-top-right-content  a,
.widget-categories ul > li > a:hover,
.widget-links ul > li > a:hover,
.product-card .product-title > a:hover,
.product-card .product-category > a:hover,
.nav-tabs .nav-link:hover,
.post-title > a:hover,
.post-meta > li > a:hover,
.widget-featured-posts > .entry .entry-title > a:hover,
.widget-featured-products > .entry .entry-title > a:hover,
.widget-cart > .entry .entry-title > a:hover,
.entry .entry-delete a,
.steps .step.active .step-title, .steps .step.active > i,
.text-primary,
.shopping-cart .product-item .product-title > a:hover,
.wishlist-table .product-item .product-title > a:hover,
.order-table .product-item .product-title > a:hover,
.list-group-item.active,
a.list-group-item:hover,
 a.list-group-item:focus, a.list-group-item:active,
 .list-group-item-action:hover,
 .list-group-item-action:focus,
 .list-group-item-action:active,
 .progress-steps li.active .icon,
 .comparison-table .comparison-item .comparison-item-title:hover,
 .site-header .site-menu > ul > li.active > a,
 .breadcrumbs > li > a:hover,
 .faq-box:hover .link,
 .left-category-area .category-list .sub-c-box .title:hover,
 .left-category-area .category-list .sub-c-box .child-category a:hover,
 .section-title .links a:hover, 
 .section-title .links a.active,
 #quick_filter li a:hover,
 #quick_filter li a.active,
 .section-title .right_link:hover,
 .popular-category.theme3 .links a.active,
 .popular-category.theme3 .links a:hover,
 .site-header .search-box-wrap .input-group .serch-result .bottom-area a:hover,
 .shop-view>a,
 .genius-banner .inner-content p,
 .details-page-top-right-content .price-area .main-price,
 .free-shippin-aa
{
    color: var(--primary-color, #B14493) !important;
}

.js-cookie-consent-agree{
    background: var(--primary-color, #B14493) !important;
}

.site-header .toolbar .toolbar-item > a > div > .compare-icon > .count-label,
.btn-primary:hover,
.scroll-to-top-btn:hover,
.pagination li a:hover,
.pagination li span:hover,
.pagination li.active span,
.pagination li.active a,
.nav-tabs .nav-link.active:hover,
.btn
{
    color: var(--text-light-color, #fff) !important;
}

.shop-view>a.active{
    color: var(--text-light-color, #fff) !important;
}

.text-base-color,
.text-base-color:hover
{
    color: var(--primary-color, #B14493) !important;
}

.category-scroll::-webkit-scrollbar-thumb {
    background-color: var(--primary-color, #B14493) !important;
}

.category-scroll {
    scrollbar-color: var(--primary-color, #B14493) #e4e4e4 !important;
    scrollbar-width: thin;
}

.btn-outline-primary {
    border-color: var(--primary-color, #B14493) !important;
    color: var(--primary-color, #B14493) !important;
    background: none;
}

.btn-outline-primary:hover {
    background-color: var(--primary-color, #B14493) !important;
    color: var(--text-light-color, #fff) !important;
}

.t-h-dropdown .t-h-dropdown-menu {
    border-top: 2px solid var(--primary-color, #B14493) !important;
}

.product-card:hover,
.brand-slider .slider-item a:hover,
.genius-banner:hover
{
    border-color: var(--primary-color, #B14493) !important;
}

.form-control:focus {
    border-color: var(--primary-color, #B14493) !important;
}

.input-group .form-control:focus ~ .input-group-addon {
    color: var(--primary-color, #B14493) !important;
}

.shop-view > a.active {
    border-color: var(--primary-color, #B14493) !important;
    background-color: var(--primary-color, #B14493) !important;
}

.custom-control .custom-control-input:checked ~ .custom-control-label::before {
    border-color: var(--primary-color, #B14493) !important;
    background-color: var(--primary-color, #B14493) !important;
}

.product-gallery .product-thumbnails > li.active > a,
.steps .step.active
{
    border-color: var(--primary-color, #B14493) !important;
}

.quickFilter .quickFilter-title:hover {
    border-color: var(--primary-color, #B14493) !important;
}

#quick_filter {
    border-color: var(--primary-color, #B14493) !important;
}

/* Footer Section Border */
.site-footer,
footer,
.footer-section,
.footer-area {
    border-top: 3px solid var(--primary-color, #B14493) !important;
}

/* Top Navigation Section Border */
.site-header,
header,
.navbar,
.navbar-nav,
.site-menu,
.menu-top-area,
.header-section,
.header-area {
    border-top: 3px solid var(--primary-color, #B14493) !important;
    border-bottom: 3px solid var(--primary-color, #B14493) !important;
}

/* Additional Navigation Border Styles */
.site-header .navbar,
.site-header .site-menu,
.menu-top-area .navbar {
    border-bottom: 2px solid var(--primary-color, #B14493) !important;
}

/* Footer Additional Border Styles */
.site-footer .footer-content,
.footer-section .footer-content,
footer .footer-content {
    border-top: 1px solid var(--primary-color, #B14493) !important;
}

/* How It Works Section - Larger Images */
.how-it-works-section img,
.process-section img,
.services-section .process-card img,
.process-card img,
.how-it-works .process-card img,
.process-step img {
    max-height: 120px !important;
    max-width: 240px !important;
    width: auto !important;
    height: auto !important;
}

/* Specific targeting for How It Works cards */
.how-it-works-section .process-card img,
.process-section .process-card img,
.services-section .process-card img {
    max-height: 120px !important;
    max-width: 240px !important;
    width: auto !important;
    height: auto !important;
}

/* Override any existing max-height constraints */
.how-it-works-section img[style*="max-height"],
.process-section img[style*="max-height"],
.process-card img[style*="max-height"] {
    max-height: 120px !important;
}

/* Cookie Consent Button Styling */
.cookie-consent__buttons {
    display: flex;
    gap: 10px;
    margin-top: 10px;
}

.cookie-consent__reject {
    background-color: transparent !important;
    border: 2px solid #fff !important;
    color: #fff !important;
    padding: 8px 20px !important;
    border-radius: 50px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    transition: all 0.3s ease !important;
}

.cookie-consent__reject:hover {
    background-color: rgba(255, 255, 255, 0.2) !important;
    border-color: #fff !important;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

/* Logo Size Improvements */
.site-header .site-branding .site-logo > img {
    width: 150px !important;
    height: auto !important;
    max-height: 60px !important;
}

.logo img.navbar-brand {
    height: 80% !important;
    width: auto !important;
    max-height: 60px !important;
}

.hero-logo {
    max-height: 120px !important;
    width: auto !important;
}

/* Custom shipping page colors */
.hero-section {
    background: linear-gradient(135deg, var(--primary-color), var(--primary-dark)) !important;
}

.service-card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 10px 30px var(--shadow-medium) !important;
}

.btn-outline-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 5px 15px var(--primary-light);
}

/* Navigation colors */
.navbar-brand,
.nav-link.active,
.nav-link:hover,
.site-header .site-menu > ul > li.active > a,
.site-header .site-menu > ul > li:hover > a
{
    color: var(--primary-color) !important;
}

/* Link colors */
a {
    color: var(--primary-color);
}

a:hover {
    color: var(--primary-hover);
}

/* Card colors */
.card-header {
    background-color: var(--bg-secondary);
    border-bottom-color: var(--border-color);
}

/* Alert colors */
.alert-primary {
    background-color: var(--primary-light);
    border-color: var(--primary-color);
    color: var(--primary-dark);
}

/* Progress bar colors */
.progress-bar {
    background-color: var(--primary-color);
}

/* Badge colors */
.badge-primary {
    background-color: var(--primary-color);
}

/* Footer colors */
.footer {
    background-color: var(--bg-dark);
    color: var(--text-light);
}

.footer a {
    color: var(--text-light);
}

.footer a:hover {
    color: var(--primary-light);
}

/* White text for buttons */
.site-header .toolbar .toolbar-item > a > div > .compare-icon > .count-label,
.btn-primary:hover,
.scroll-to-top-btn:hover,
.pagination li a:hover,
.pagination li span:hover,
.pagination li.active span,
.pagination li.active a,
.nav-tabs .nav-link.active:hover,
.btn,
.shop-view>a.active
{
    color: #fff !important;
}