/*
 * BloomForte Brand Colors - FINAL VERSION
 * 
 * Colors extracted from the updated BloomForte logo with professional
 * blue-green-yellow palette for humanitarian and business services
 */

/* Root color variables - Professional brand palette */
:root {
    /* Primary brand colors extracted from updated logo */
    --theme-color: #2E7FBF;           /* Primary Blue - main brand color */
    --secondary-color: #4CAF50;       /* Vibrant Green - growth and prosperity */
    --accent-color: #FFC107;          /* Golden Yellow - optimism and energy */
    
    /* Extended blue palette */
    --brand-blue: #2E7FBF;
    --brand-blue-light: #5BA3D4;
    --brand-blue-dark: #1B5F8F;
    --brand-blue-extra-light: #E3F2FD;
    
    /* Extended green palette */
    --brand-green: #4CAF50;
    --brand-green-light: #81C784;
    --brand-green-dark: #388E3C;
    --brand-green-extra-light: #E8F5E8;
    
    /* Extended yellow palette */
    --brand-yellow: #FFC107;
    --brand-yellow-light: #FFD54F;
    --brand-yellow-dark: #F57C00;
    --brand-yellow-extra-light: #FFF8E1;
    
    /* Logo-inspired gradients */
    --gradient-flow: linear-gradient(135deg, #2E7FBF 0%, #4CAF50 50%, #FFC107 100%);
    --gradient-blue-green: linear-gradient(90deg, #2E7FBF 0%, #4CAF50 100%);
    --gradient-green-yellow: linear-gradient(90deg, #4CAF50 0%, #FFC107 100%);
    --gradient-blue-yellow: linear-gradient(90deg, #2E7FBF 0%, #FFC107 100%);
    
    /* Neutral colors */
    --text-primary: #1a1a1a;
    --text-secondary: #74777c;
    --text-light: #7f8388;
    --background-light: #f8fbff;
    --border-light: #e8f2ff;
}

/* Updated gradient backgrounds to use BloomForte logo colors */
.qu_btn {
    background: var(--gradient-blue-green) !important;
    transition: all 0.3s ease;
}

.qu_btn:hover {
    background: var(--gradient-flow) !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(46, 127, 191, 0.3);
}

/* Alternative button styles with different logo color combinations */
.qu_btn.btn-secondary {
    background: var(--gradient-green-yellow) !important;
}

.qu_btn.btn-accent {
    background: var(--gradient-blue-yellow) !important;
}

.qu_btn.green {
    background: var(--brand-green) !important;
}

.qu_btn.yellow {
    background: var(--brand-yellow) !important;
    color: var(--text-primary) !important;
}

.qu_btn.green:before,
.qu_btn.yellow:before {
    background: var(--text-primary) !important;
}

.qu_btn.yellow:hover {
    color: #fff !important;
}

/* Update all elements that previously used red gradients with logo colors */
.spIcon i,
.tm_social a:after,
.expCounter:before,
.galleryShots a:after,
.SubsrcribeForm .yikes-easy-mc-form .yikes-easy-mc-submit-button,
.icon_box_05 .ib_box:after,
.icon_box_08 .ib_box:after,
.icon_box_08 .ib_box span,
.priceItem .ib_box,
.priceItem .ib_box::before,
.priceItem .ib_box::after,
.priceItem .pshape,
.priceItem .pshape::before,
.priceItem .pshape::after,
.popup_video,
.folioItem01 .fm i,
.help_area,
.help_area:after,
.chooseSlider.owl-carousel,
.quAccordion .card .card-header h2 button span,
.filter_menu li:after {
    background: var(--gradient-blue-green) !important;
}

/* Single color elements using logo colors */
.single_skill .ss_child,
.hpAuthor .signAuthor,
.phone,
.pprice,
.fact_01 h2,
.fact_02 h2,
.cusRating,
.tstRating,
.testiItem02 .ts_author span,
.folioContent .cat,
.folioItem03 .folioContent .cat,
.team_01 p,
.support p span,
.bmeta a:hover,
.menu li a:hover:after,
.pp_post_item a:hover,
.copyMenu ul li a:hover,
.footer_02 .aboutWidget a:hover,
.abSocial a,
.ctaText > i,
.ctaText a,
.breadcrumbs a:hover,
.historyContent span,
.historyItem:hover h2,
.subTitle,
.secTitle span,
.qu_link a,
.prcolor {
    color: var(--theme-color) !important;
}

/* Back to top button with white arrow */
#backtotop {
    background: var(--theme-color) !important;
    color: #ffffff !important;
}

#backtotop:hover {
    background: var(--secondary-color) !important;
    color: #ffffff !important;
}

/* Preloader text - keep white */
.loaderO span {
    color: #ffffff !important;
    font-weight: 700 !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5) !important;
}

/* Rotating loader shape with website colors */
.bloomforteLoader:after {
    filter: hue-rotate(180deg) saturate(1.5) brightness(1.2) !important;
    opacity: .7 !important;
}

/* Background colors using logo blue */
.header01:after,
.funfactArea,
.accessNav a.userBtn,
.header01SearchBar button,
.fact_02:hover,
.folioItem02:before,
.priceItem:hover,
.wpProcess .IconImage::after,
.wpProcess .IconImage::before,
.circle-skill strong,
.orcta,
.orcta:after,
.pin1:after,
.pin2:after,
.abSocial a:hover {
    background: var(--theme-color) !important;
}

/* Border colors using logo blue */
.mainMenu > ul > li:before,
.accessNav a.userBtn,
.subTitle span,
.qu_link a,
.support p span,
.aboutWidget a,
.footer_02 .aboutWidget a,
.ssQuote,
.funfactArea,
.fact_02:hover,
.filter_menu li:hover:after,
.filter_menu li.active:after,
.icon_box_07:hover,
.icon_box_03:hover .ib_box,
.priceItem:hover .qu_btn:before {
    border-color: var(--theme-color) !important;
}

/* Text stroke for history items */
.historyItem:hover h2 {
    -webkit-text-stroke: 1px var(--theme-color) !important;
}

/* Special gradient updates for consistent branding */
.expCounter:before {
    background: var(--gradient-blue-green) !important;
    opacity: .8;
}

.SubsrcribeForm .yikes-easy-mc-form .yikes-easy-mc-submit-button {
    background: var(--gradient-blue-green) !important;
}

.SubsrcribeForm .yikes-easy-mc-form .yikes-easy-mc-submit-button:hover {
    background: var(--gradient-flow) !important;
}

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

.popup_video:hover {
    background: var(--gradient-flow) !important;
}

/* Update icon box hover effects with logo accent colors */
.icon_box_01:hover .sm {
    color: var(--accent-color) !important;
}

.icon_box_01 .sm:hover {
    color: var(--accent-color) !important;
}

/* Update skill bar with green from logo */
.single_skill .ss_parent {
    background: var(--secondary-color) !important;
}

/* Update rating colors with yellow from logo */
.tstRating,
.cusRating {
    color: var(--accent-color) !important;
}

/* Background light areas using logo-inspired colors */
.header01,
.icon_box_01,
.icon_box_07 {
    background-color: var(--brand-blue-extra-light) !important;
}

.icon_box_01,
.icon_box_07,
.icon_box_03 .ib_box {
    border-color: var(--border-light) !important;
}

/* Logo container background */
.logo {
    background: transparent;
}

/* Update preloader - keep original black background */

/* Footer background */
.footer_01 {
    background-color: var(--text-primary);
}

/* Update any remaining color classes */
.prcolor {
    color: var(--theme-color) !important;
}

/* Social media icon updates */
.abSocial a {
    background: var(--brand-blue-extra-light);
    border: 2px solid var(--brand-blue-light);
    color: var(--theme-color);
}

.abSocial a:hover {
    background: var(--theme-color);
    color: #fff;
}

/* Ensure proper contrast and accessibility */
.high-contrast-blue {
    background: var(--theme-color);
    color: white;
}

.high-contrast-green {
    background: var(--secondary-color);
    color: white;
}

.high-contrast-yellow {
    background: var(--accent-color);
    color: var(--text-primary);
}

/* Service cards with rotating logo colors */
.service-card:nth-child(3n+1) {
    border-top: 4px solid var(--theme-color);
}

.service-card:nth-child(3n+2) {
    border-top: 4px solid var(--secondary-color);
}

.service-card:nth-child(3n+3) {
    border-top: 4px solid var(--accent-color);
}

/* Icon boxes with logo color rotation */
.icon-box.blue {
    background: var(--brand-blue-extra-light);
    border: 2px solid var(--brand-blue-light);
}

.icon-box.green {
    background: var(--brand-green-extra-light);
    border: 2px solid var(--brand-green-light);
}

.icon-box.yellow {
    background: var(--brand-yellow-extra-light);
    border: 2px solid var(--brand-yellow-light);
}

/* Navigation improvements */
.mainMenu > ul > li > a:hover {
    color: var(--theme-color) !important;
}

.mainMenu > ul > li.current-menu-item > a {
    color: var(--secondary-color) !important;
}

/* Remove any chevron indicators where not needed */
.mainMenu ul li.no-submenu > a:after {
    display: none !important;
}

/* Footer improvements */
.footer_01 a:hover {
    color: var(--accent-color) !important;
}

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

/* Enhanced button variations */
.qu_btn.btn-flow {
    background: var(--gradient-flow) !important;
    position: relative;
    overflow: hidden;
}

.qu_btn.btn-blue {
    background: var(--theme-color) !important;
}

.qu_btn.btn-green {
    background: var(--secondary-color) !important;
}

.qu_btn.btn-yellow {
    background: var(--accent-color) !important;
    color: var(--text-primary) !important;
}

.qu_btn.btn-blue:hover,
.qu_btn.btn-green:hover {
    background: var(--gradient-flow) !important;
}

.qu_btn.btn-yellow:hover {
    background: var(--brand-yellow-dark) !important;
    color: #fff !important;
}