/*
 * BloomForte Background Color Fixes
 * 
 * This file specifically targets background sections that are still using
 * red/pink colors and replaces them with proper BloomForte brand colors
 */

/* Fix section backgrounds that are using red/pink colors */

/* About section backgrounds - replace pink with light blue */
.aboutSection01,
.aboutSection02,
.aboutSection03 {
    background-color: var(--brand-blue-extra-light) !important;
    background-image: linear-gradient(135deg, 
        var(--brand-blue-extra-light) 0%, 
        var(--brand-green-extra-light) 50%, 
        var(--brand-yellow-extra-light) 100%) !important;
}

/* Hero sections with flowing brand colors */
.hero-section,
.slider-section,
.banner-section {
    background: linear-gradient(135deg, 
        var(--brand-blue-extra-light) 0%, 
        var(--brand-green-extra-light) 50%, 
        var(--brand-yellow-extra-light) 100%) !important;
}

/* Service sections */
.serviceSection01,
.serviceSection02,
.serviceSection03 {
    background-color: var(--brand-blue-extra-light) !important;
}

/* Portfolio sections */
.portfolioSection01,
.portfolioSection02,
.portfolioSection03 {
    background-color: var(--brand-green-extra-light) !important;
}

/* Company sections */
.companySec01,
.companySec02 {
    background: linear-gradient(135deg, 
        var(--brand-blue-extra-light) 0%, 
        var(--brand-green-extra-light) 100%) !important;
}

/* Team sections */
.teamSection01,
.teamSection02 {
    background-color: var(--brand-blue-extra-light) !important;
}

/* Blog sections */
.blogSection01,
.blogSection02,
.blogSectiont03 {
    background-color: var(--brand-green-extra-light) !important;
}

/* Statistics/counter sections */
.funfactArea,
.counterSection,
.statsSection {
    background: var(--gradient-blue-green) !important;
}

/* Call to action sections */
.ctaSection,
.callToActionSection {
    background: linear-gradient(135deg, 
        var(--brand-blue-dark) 0%, 
        var(--brand-green-dark) 100%) !important;
}

/* Appointment sections */
.appoinmentSection01,
.appoinmentSection02,
.appoinmentSection03 {
    background: linear-gradient(135deg, 
        var(--brand-blue-extra-light) 0%, 
        var(--brand-yellow-extra-light) 100%) !important;
}

/* Why choose sections */
.chooseSection01,
.chooseSection02,
.chooseSection03 {
    background-color: var(--brand-green-extra-light) !important;
}

/* Fix any sections with background images that have red/pink overlays */
section[style*="background-color: #fff2f3"],
section[style*="background: #fff2f3"],
div[style*="background-color: #fff2f3"],
div[style*="background: #fff2f3"] {
    background-color: var(--brand-blue-extra-light) !important;
}

/* Fix sections with red background classes */
.bg-red,
.bg-pink,
.bg-light-red,
.bg-light-pink {
    background-color: var(--brand-blue-extra-light) !important;
}

/* Replace any CSS with old background colors */
*[style*="#fff2f3"] {
    background-color: var(--brand-blue-extra-light) !important;
}

*[style*="#ffeff0"] {
    background-color: var(--brand-blue-extra-light) !important;
}

*[style*="#ffe5e6"] {
    background-color: var(--brand-blue-extra-light) !important;
}

/* Header background improvements */
.header01 {
    background: var(--brand-blue-extra-light) !important;
}

.header01:after {
    background: var(--theme-color) !important;
}

/* Section decorative backgrounds */
.section-bg-light {
    background: linear-gradient(135deg, 
        var(--brand-blue-extra-light) 0%, 
        var(--brand-green-extra-light) 100%) !important;
}

.section-bg-primary {
    background: var(--gradient-blue-green) !important;
}

.section-bg-secondary {
    background: var(--gradient-green-yellow) !important;
}

/* Fix background shapes and decorative elements */
.bg-shape,
.decorative-bg,
.section-overlay {
    background: var(--brand-blue-extra-light) !important;
}

/* Ensure proper contrast for text on new backgrounds */
.section-bg-light h1,
.section-bg-light h2,
.section-bg-light h3,
.section-bg-light h4,
.section-bg-light h5,
.section-bg-light h6 {
    color: var(--text-primary) !important;
}

.section-bg-light p {
    color: var(--text-secondary) !important;
}

/* Fix any remaining pink/red background utilities */
.bg-light-theme {
    background: var(--brand-blue-extra-light) !important;
}

.bg-primary-theme {
    background: var(--theme-color) !important;
}

.bg-secondary-theme {
    background: var(--secondary-color) !important;
}

.bg-accent-theme {
    background: var(--accent-color) !important;
}

/* Gradient backgrounds for sections */
.gradient-bg-1 {
    background: var(--gradient-flow) !important;
}

.gradient-bg-2 {
    background: var(--gradient-blue-green) !important;
}

.gradient-bg-3 {
    background: var(--gradient-green-yellow) !important;
}

/* Fix specific sections that might be using old colors */
.slider_01,
.slider_02,
.slider_03 {
    background: linear-gradient(135deg, 
        rgba(46, 127, 191, 0.1) 0%, 
        rgba(76, 175, 80, 0.1) 50%, 
        rgba(255, 193, 7, 0.1) 100%) !important;
}

/* Service highlight sections */
.service-highlight {
    background: var(--brand-green-extra-light) !important;
}

/* Portfolio highlight sections */
.portfolio-highlight {
    background: var(--brand-yellow-extra-light) !important;
}

/* Testimonial sections */
.testimonialSection,
.testimonial-bg {
    background: var(--brand-blue-extra-light) !important;
}

/* Contact sections */
.contactSection {
    background: linear-gradient(135deg, 
        var(--brand-blue-extra-light) 0%, 
        var(--brand-green-extra-light) 100%) !important;
}

/* Fix any remaining background color references in specific components */
.icon_box_01,
.icon_box_02,
.icon_box_03,
.icon_box_07 {
    background-color: var(--brand-blue-extra-light) !important;
}

/* Ensure proper border colors to match new backgrounds */
.icon_box_01,
.icon_box_07,
.icon_box_03 .ib_box {
    border-color: var(--brand-blue-light) !important;
}

/* App store section */
.appStore {
    background: var(--gradient-blue-green) !important;
}

/* Newsletter section */
.newsletterSection {
    background: var(--brand-green-extra-light) !important;
}

/* Fix any section overlays */
section::before,
section::after {
    background: transparent !important;
}

/* Ensure readability on all new backgrounds */
.brand-blue-extra-light,
.brand-green-extra-light,
.brand-yellow-extra-light {
    color: var(--text-primary) !important;
}

.brand-blue-extra-light .subTitle,
.brand-green-extra-light .subTitle,
.brand-yellow-extra-light .subTitle {
    color: var(--theme-color) !important;
}

/* Fix any remaining red color references in data attributes */
[data-background="#fff2f3"],
[data-bg="#fff2f3"],
[data-background-color="#fff2f3"] {
    background-color: var(--brand-blue-extra-light) !important;
}

/* Counter and statistics sections with proper branding */
.counter-section {
    background: var(--gradient-blue-green) !important;
}

.stats-section {
    background: linear-gradient(135deg, 
        var(--brand-blue-dark) 0%, 
        var(--brand-green-dark) 100%) !important;
}

/* Video sections */
.video-section {
    background: var(--brand-blue-extra-light) !important;
}

/* Feature sections */
.feature-section {
    background: var(--brand-green-extra-light) !important;
}

/* Process sections */
.process-section {
    background: var(--brand-yellow-extra-light) !important;
}