/* Ultra-comprehensive override for all #f7858d color usage in the entire site */
:root {
    --theme-color: #f7858d; /* Default fallback - will be dynamically set */
}

/* === 1. INLINE STYLE OVERRIDES === */
/* These will be caught by JavaScript as well */
*[style*="color: #f7858d" i],
*[style*="color:#f7858d" i] {
    color: var(--theme-color) !important;
}

*[style*="background: #f7858d" i],
*[style*="background:#f7858d" i],
*[style*="background-color: #f7858d" i],
*[style*="background-color:#f7858d" i] {
    background-color: var(--theme-color) !important;
}

*[style*="border-color: #f7858d" i],
*[style*="border-color:#f7858d" i] {
    border-color: var(--theme-color) !important;
}

*[style*="border: 1px solid #f7858d" i],
*[style*="border:1px solid #f7858d" i],
*[style*="border-bottom: 1px solid #f7858d" i],
*[style*="border-bottom:1px solid #f7858d" i] {
    border-color: var(--theme-color) !important;
}

/* === 2. SVG FILL OVERRIDES === */
svg[fill="#f7858d"],
*[fill="#f7858d"],
path[fill="#f7858d"],
ellipse[fill="#f7858d"] {
    fill: var(--theme-color) !important;
}

/* === 3. MAIN.CSS CLASS OVERRIDES === */
/* All classes from main.css that use #f7858d */

/* Buttons */
.btn-primary,
.btn-theme,
.btn-theme-info,
.btn-theme-checkout,
.product-card .add-to-cart,
.page-link-next,
.submit-search,
.site-search .submit-search,
.site-search .page-link,
.order-detail .btn-theme {
    background-color: var(--theme-color) !important;
    background: var(--theme-color) !important;
    border-color: var(--theme-color) !important;
    color: #ffffff !important; /* Force white text on buttons */
}

/* Text colors */
.text-primary,
.red-text,
.price-red,
.cart-page .price-red,
.cart-page .total-price,
.product-single .price-red,
.cart-page .btn-link,
.cart-page .btn-number,
.account-header .red-text,
.fa-comments-o:before {
    color: var(--theme-color) !important;
}

/* Header specific elements */
.header-cover {
    background-color: var(--theme-color) !important;
}

header.main-header .nav-link span.count {
    background-color: var(--theme-color) !important;
    color: #ffffff !important; /* Ensure white text on count badge */
}

/* Pagination */
.pagination .page-link,
.pagination li a {
    background-color: var(--theme-color) !important;
    background: var(--theme-color) !important;
    color: #ffffff !important; /* Force white text on pagination */
}

/* Order and cart summaries */
.order-summary .order-total,
.cart-summary .summary-total {
    background-color: var(--theme-color) !important;
    color: #ffffff !important; /* Force white text on summaries */
}

/* Form elements */
.form-control:focus,
.site-search .submit-search input {
    border-color: var(--theme-color) !important;
}

.cart-page .delivery-info label {
    color: var(--theme-color) !important;
    border-bottom-color: var(--theme-color) !important;
}

/* === 4. UNIVERSAL CSS RULE OVERRIDE === */
/* This is a nuclear option to catch everything */
* {
    /* CSS custom properties for any element that might use the color */
    --primary-color: var(--theme-color);
    --accent-color: var(--theme-color);
    --highlight-color: var(--theme-color);
}

/* === 5. COMPREHENSIVE MAIN.CSS OVERRIDES === */
/* Override all remaining hardcoded #f7858d in main.css */

/* Direct CSS injection to override main.css rules */
.header-cover,
header.main-header .nav-link span.count,
*[style*="background-color: #f7858d" i],
*[style*="background: #f7858d" i],
*[style*="color: #f7858d" i],
*[style*="border-color: #f7858d" i] {
    background-color: var(--theme-color) !important;
    border-color: var(--theme-color) !important;
}

/* Ensure proper text color for background elements */
.header-cover,
header.main-header .nav-link span.count {
    color: #ffffff !important;
}

/* === 5. SPECIFIC OVERRIDES FOR KNOWN PATTERNS === */
/* Any element with class containing 'theme' or 'primary' */
*[class*="theme"],
*[class*="primary"] {
    /*background-color: var(--theme-color) !important;*/
    border-color: var(--theme-color) !important;
}

*[class*="red"] {
    color: var(--theme-color) !important;
}

/* === 6. BOOTSTRAP OVERRIDES === */
.btn-primary,
.bg-primary,
.text-primary,
.border-primary,
.alert-primary {
    /*background-color: var(--theme-color) !important;*/
    border-color: var(--theme-color) !important;
    color: var(--theme-color) !important;
}

/* === 7. DYNAMIC JAVASCRIPT FALLBACK === */
/* For any remaining hardcoded instances, JavaScript will handle them */

/* === 8. MEDIA QUERIES === */
@media (max-width: 768px) {
    /* Ensure mobile responsiveness maintains theme color */
    * {
        --theme-color: var(--theme-color, #f7858d);
    }
}

/* === 9. TEXT CONTRAST AND READABILITY === */
/* Ensure all elements with theme background have proper white text */
*[style*="background-color: var(--theme-color)"],
*[style*="background: var(--theme-color)"],
.btn[style*="background"],
button[style*="background"],
a[style*="background"] {
    color: #ffffff !important;
}

/* Specific button and link text fixes */
.btn-primary *,
.btn-theme *,
.btn-primary span,
.btn-theme span,
.btn-primary a,
.btn-theme a {
    color: #ffffff !important;
}

/* Pagination link text */
.pagination .page-link *,
.pagination li a *,
.page-link-next *,
.pagination .page-link span,
.pagination li a span {
    color: #ffffff !important;
}

/* Form submit buttons */
input[type="submit"],
button[type="submit"],
.submit-search,
.site-search .submit-search {
    color: #ffffff !important;
}

/* Cart and order elements */
.order-summary .order-total *,
.cart-summary .summary-total *,
.order-summary .order-total span,
.cart-summary .summary-total span {
    color: #ffffff !important;
}

/* General utility for theme-colored backgrounds */
.bg-primary,
.bg-theme,
*[class*="theme"][style*="background"],
*[class*="primary"][style*="background"] {
    color: #ffffff !important;
}

/* Links inside theme-colored elements */
.btn-primary a,
.btn-theme a,
.pagination a,
*[style*="background: var(--theme-color)"] a,
*[style*="background-color: var(--theme-color)"] a {
    color: #ffffff !important;
    text-decoration: none !important;
}

/* Hover states to maintain white text */
.btn-primary:hover,
.btn-theme:hover,
.pagination .page-link:hover,
.pagination li a:hover {
    color: #ffffff !important;
}

/* === 10. PRINT STYLES === */
@media print {
    * {
        --theme-color: #000 !important; /* Black for printing */
    }
}