/* ============================================================
 * PURPLE LEAK PREVENTION - GREEN PALETTE OVERRIDES
 * Override selectors from style-base-color.php that are not
 * covered by custom.css. Ensures no purple leaks regardless
 * of admin base_color setting.
 * ============================================================ */

/* -- CSS Custom Properties -- */
:root {
    --pp-primary: #7ab929 !important;
    --pp-primary-light: #8bc34a !important;
    --pp-primary-lighter: #a4d65e !important;
    --pp-primary-dark: #6aa522 !important;
}

/* -- Bootstrap pagination -- */
.page-item.active .page-link {
    background: linear-gradient(135deg, #7ab929, #8bc34a) !important;
    border-color: #7ab929 !important;
}

.page-link {
    color: #7ab929 !important;
}

.page-link:hover {
    color: #6aa522 !important;
}

/* -- Payment header -- */
.payment_header {
    background: linear-gradient(135deg, #7ab929, #8bc34a) !important;
}

/* -- Generic content links -- */
.content a {
    background: #7ab929 !important;
}

.content a:hover {
    color: #7ab929 !important;
}

/* -- Blog category list -- */
.blog-cat-list li.active {
    color: #7ab929 !important;
}

/* -- Base color utility -- */
.base-color {
    color: #7ab929 !important;
}

/* -- Error page CTA -- */
.error-txt a {
    background: linear-gradient(135deg, #7ab929, #8bc34a) !important;
    border: 1px solid #7ab929 !important;
}

.error-txt a:hover {
    color: #7ab929 !important;
}

/* -- Breadcrumb section -- */
.breadcrumbs-section {
    background-color: #1a2e1a !important;
}

.breadcrumbs-section::after {
    background: linear-gradient(135deg, rgba(26, 46, 26, 0.92) 0%, rgba(36, 56, 36, 0.88) 50%, rgba(26, 46, 26, 0.85) 100%) !important;
}

.breadcrumbs-section .breadcrumbs-content ul.breadcrumbs-link li a {
    color: #a4d65e !important;
}

.breadcrumbs-section .breadcrumbs-content ul.breadcrumbs-link li a:hover {
    color: #ffffff !important;
}

/* -- Back to top button -- */
.back-to-top {
    background: #7ab929 !important;
}

.back-to-top:hover {
    background: #6aa522 !important;
}

/* -- Preloader -- */
.preloader {
    background: linear-gradient(135deg, #1a2e1a, #243824) !important;
}

/* -- Section labels/spans -- */
.section-title-one span.span {
    color: #7ab929 !important;
}

.section-title-one span.span:before,
.section-title-one span.span:after {
    background: linear-gradient(135deg, #7ab929, #8bc34a) !important;
}

/* -- Transparent header nav colors on dark hero -- */
.transparent-header .main-menu > ul > li > a {
    color: #ffffff !important;
}

.transparent-header .main-menu > ul > li > a:hover,
.transparent-header .main-menu > ul > li.active > a {
    color: #7ab929 !important;
}

/* -- Dropdown caret (+) icon: inherit parent link color -- */
.header-navigation .nav-container .main-menu > ul > li.menu-item-has-children > a::after {
    color: inherit !important;
}

/* -- Header stacking context: dropdown appears above breadcrumbs/hero (inner pages only) -- */
header.header-area:not(.transparent-header) {
    position: relative;
    z-index: 100;
}

.transparent-header .brand_logo a,
.transparent-header .brand_logo img {
    filter: none;
}

/* ============================================================
 * LANGUAGE SWITCHER - Custom Dropdown
 * ============================================================ */
.lang-switcher {
    position: relative;
    display: inline-block;
}

.lang-switcher__toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 150px;
    height: 50px;
    padding: 0 20px;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 50px;
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    white-space: nowrap;
    line-height: 1;
    box-sizing: border-box;
}

.lang-switcher__toggle:hover {
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.4);
}

.lang-switcher__toggle .fa-globe {
    font-size: 14px;
    opacity: 0.7;
}

.lang-switcher__arrow {
    font-size: 10px;
    opacity: 0.6;
    transition: transform 0.3s ease;
}

.lang-switcher.is-open .lang-switcher__arrow {
    transform: rotate(180deg);
}

.lang-switcher__dropdown {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 150px;
    padding: 6px 0;
    margin: 0;
    list-style: none;
    background: #1a3526;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.25);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
    z-index: 1000;
    overflow: hidden;
}

.lang-switcher.is-open .lang-switcher__dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.lang-switcher__option {
    padding: 10px 16px;
    font-size: 13px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.7);
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: center;
}

.lang-switcher__option:hover {
    background: rgba(122, 185, 41, 0.15);
    color: #ffffff;
}

.lang-switcher__option.is-active {
    color: #7ab929;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.lang-switcher__option.is-active::before {
    content: '';
    position: static;
    transform: none;
    width: 5px;
    height: 5px;
    min-width: 5px;
    border-radius: 50%;
    background: #7ab929;
}

/* -- Sticky header variant -- */
.header-navigation.sticky .lang-switcher__toggle {
    border-color: rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
}

.header-navigation.sticky .lang-switcher__toggle:hover {
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.35);
}

/* -- Non-homepage (light header) variant -- */
.header-area:not(.transparent-header) .lang-switcher__toggle {
    color: #1a2e1a;
    border-color: rgba(26, 46, 26, 0.2);
    background: rgba(26, 46, 26, 0.04);
}

.header-area:not(.transparent-header) .lang-switcher__toggle:hover {
    background: rgba(26, 46, 26, 0.08);
    border-color: rgba(26, 46, 26, 0.3);
}

.header-area:not(.transparent-header) .lang-switcher__dropdown {
    background: #ffffff;
    border-color: rgba(0, 0, 0, 0.08);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12);
}

.header-area:not(.transparent-header) .lang-switcher__option {
    color: #3a3a3a;
}

.header-area:not(.transparent-header) .lang-switcher__option:hover {
    background: #f3f8ed;
    color: #1a2e1a;
}

.header-area:not(.transparent-header) .lang-switcher__option.is-active {
    color: #7ab929;
}

.transparent-header .navbar-toggler span {
    background: #ffffff !important;
}

/* Sticky header -- dark forest green background with white text */
.header-navigation.sticky {
    background: #1a3526 !important;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.15) !important;
    border-bottom: none !important;
}

.header-navigation.sticky .main-menu > ul > li > a {
    color: #ffffff !important;
}

.header-navigation.sticky .main-menu > ul > li > a:hover,
.header-navigation.sticky .main-menu > ul > li.active > a {
    color: #7ab929 !important;
}

.header-navigation.sticky .brand_logo a,
.header-navigation.sticky .brand_logo img {
    filter: none !important;
}

/* Old select removed -- using custom .lang-switcher dropdown */

.header-navigation.sticky .navbar-toggler span {
    background: #ffffff !important;
}

/* ============================================================
 * PRICING (.saas-pricing) - Purple-to-Green Overrides
 * Most extensive section -- covers tabs, cards, prices, buttons
 * Sources: style.css lines 1515-1650, style-base-color.php lines 66-80
 * ============================================================ */

/* -- Section ::before background: #F5F3FF purple tint -> green tint -- */
.saas-pricing::before {
    background: #f3f8ed !important;
}

/* -- Pricing page variant: ensure no purple leak on standalone page -- */
.pricing-page.saas-pricing::before {
    background: #ffffff !important;
}

/* -- Section eyebrow: scoped green overrides -- */
.saas-pricing .section-title-one span.span {
    color: #7ab929 !important;
}

.saas-pricing .section-title-one span.span::before {
    background: linear-gradient(90deg, #7ab929, #8bc34a) !important;
}

.saas-pricing .section-title-one span.span::after {
    background: linear-gradient(90deg, #8bc34a, #7ab929) !important;
}

/* ---- PRICING TABS ---- */

/* Tab container background: purple rgba(108,60,225,0.06) -> green */
.saas-pricing .pricing-tabs {
    background: rgba(122, 185, 41, 0.06) !important;
}

/* Individual tab link: reset any purple leaks on inactive state */
.saas-pricing .pricing-tabs .nav-tabs .nav-link {
    color: #3a3a3a !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Tab hover (inactive): subtle green background */
.saas-pricing .pricing-tabs .nav-tabs .nav-link:hover {
    color: #6aa522 !important;
    background: rgba(122, 185, 41, 0.06) !important;
}

/* Tab focus (inactive): accessible green focus ring */
.saas-pricing .pricing-tabs .nav-tabs .nav-link:focus {
    color: #6aa522 !important;
    box-shadow: 0 0 0 2px rgba(122, 185, 41, 0.25) !important;
}

/* Active tab: purple gradient -> green gradient */
.saas-pricing .pricing-tabs .nav-tabs .nav-link.active {
    background: linear-gradient(135deg, #7ab929, #8bc34a) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 15px rgba(122, 185, 41, 0.30) !important;
}

/* Active tab hover: slightly darker green */
.saas-pricing .pricing-tabs .nav-tabs .nav-link.active:hover {
    background: linear-gradient(135deg, #6aa522, #7ab929) !important;
    color: #ffffff !important;
    box-shadow: 0 6px 20px rgba(122, 185, 41, 0.40) !important;
}

/* Active tab focus: green ring on active */
.saas-pricing .pricing-tabs .nav-tabs .nav-link.active:focus {
    box-shadow: 0 4px 15px rgba(122, 185, 41, 0.30),
                0 0 0 2px rgba(122, 185, 41, 0.25) !important;
}

/* ---- PRICING CARDS ---- */

/* Card border: purple rgba(108,60,225,0.08) -> neutral */
.pricing-item {
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
}

/* Scoped card border (higher specificity to beat style.css) */
.saas-pricing .pricing-item {
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
}

/* Card hover: purple shadow -> green shadow + green border tint */
.saas-pricing .pricing-item:hover {
    border-color: rgba(122, 185, 41, 0.15) !important;
    box-shadow: 0 25px 60px rgba(122, 185, 41, 0.15) !important;
}

/* Card focus-within: accessible green ring for keyboard users */
.saas-pricing .pricing-item:focus-within {
    border-color: rgba(122, 185, 41, 0.20) !important;
    box-shadow: 0 0 0 3px rgba(122, 185, 41, 0.15),
                0 12px 40px rgba(122, 185, 41, 0.10) !important;
}

/* Active/popular card: ensure green, not purple */
.saas-pricing .pricing-item.active-item {
    border-color: #7ab929 !important;
    box-shadow: 0 3px 26px rgba(122, 185, 41, 0.12) !important;
}

/* Active card hover: stronger green shadow */
.saas-pricing .pricing-item.active-item:hover {
    border-color: #6aa522 !important;
    box-shadow: 0 25px 60px rgba(122, 185, 41, 0.20) !important;
}

/* Active card ::before accent bar: green gradient (reinforce custom.css) */
.saas-pricing .pricing-item.active-item::before {
    background: linear-gradient(90deg, #6aa522, #7ab929, #8bc34a) !important;
}

/* Pricing page variant: card border on standalone page */
.saas-pricing.pricing-page .pricing-item {
    border: 1px solid rgba(0, 0, 0, 0.10) !important;
}

/* Pricing page variant: wrapper border */
.saas-pricing.pricing-page .pricing-wrapper {
    border-color: transparent !important;
}

/* ---- PRICE DISPLAY ---- */

/* Price amount: purple #6C3CE1 -> green */
.saas-pricing .pricing-item .title h2.price {
    color: #7ab929 !important;
    /* Reset any gradient text tricks that style-base-color.php might inject */
    -webkit-background-clip: unset !important;
    -webkit-text-fill-color: unset !important;
    background-clip: unset !important;
    background: none !important;
}

/* Price currency/period span: inherit green, prevent purple */
.saas-pricing .pricing-item .title h2.price span {
    color: inherit !important;
    -webkit-text-fill-color: unset !important;
}

/* Price /month span: ensure no purple leak */
.saas-pricing .pricing-item .title h2.price span.month,
.saas-pricing .pricing-item .title h2.price .month {
    color: #666666 !important;
    -webkit-text-fill-color: unset !important;
}

/* ---- FEATURE LIST ---- */

/* Checked item checkmark: use green (was #00D4AA, but override for consistency) */
.saas-pricing .pricing-item .pricing-body ul.list li.checked::before {
    color: #7ab929 !important;
}

/* Unchecked item X: keep red, no purple leak */
.saas-pricing .pricing-item .pricing-body ul.list li.unchecked::before {
    color: #FF6B6B !important;
}

/* List item text and borders: ensure no purple tint */
.saas-pricing .pricing-item .pricing-body ul.list li {
    border-color: rgba(0, 0, 0, 0.06) !important;
}

/* ---- PRICING CTA BUTTONS ---- */

/* Pricing CTA button: override global .main-btn purple with scoped green */
.saas-pricing .pricing-item .pricing-button .main-btn {
    background: linear-gradient(135deg, #7ab929 0%, #8bc34a 50%, #a4d65e 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 20px rgba(122, 185, 41, 0.30) !important;
    border: 2px solid transparent !important;
}

/* Pricing CTA hover: darker green gradient */
.saas-pricing .pricing-item .pricing-button .main-btn:hover {
    background: linear-gradient(135deg, #6aa522 0%, #7ab929 50%, #8bc34a 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 10px 35px rgba(122, 185, 41, 0.45) !important;
    border-color: transparent !important;
}

/* Pricing CTA focus: accessible green ring */
.saas-pricing .pricing-item .pricing-button .main-btn:focus {
    background: linear-gradient(135deg, #6aa522 0%, #7ab929 50%, #8bc34a 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(122, 185, 41, 0.30),
                0 4px 20px rgba(122, 185, 41, 0.25) !important;
    outline: none !important;
}

/* Pricing CTA active (pressed): deepest green */
.saas-pricing .pricing-item .pricing-button .main-btn:active {
    background: linear-gradient(135deg, #5a9420 0%, #6aa522 50%, #7ab929 100%) !important;
    box-shadow: 0 2px 10px rgba(122, 185, 41, 0.30) !important;
    transform: translateY(-1px) !important;
}

/* Active/popular card button: stronger green treatment */
.saas-pricing .pricing-item.active-item .pricing-button .main-btn {
    background: linear-gradient(135deg, #6aa522 0%, #7ab929 50%, #8bc34a 100%) !important;
    box-shadow: 0 6px 25px rgba(122, 185, 41, 0.40) !important;
}

.saas-pricing .pricing-item.active-item .pricing-button .main-btn:hover {
    background: linear-gradient(135deg, #5a9420 0%, #6aa522 50%, #7ab929 100%) !important;
    box-shadow: 0 10px 40px rgba(122, 185, 41, 0.50) !important;
}

/* ---- GLOBAL .main-btn PURPLE OVERRIDE (affects pricing + all sections) ---- */
/* These override BOTH style.css hardcoded purple AND dynamic style-base-color.php */

.main-btn {
    background: linear-gradient(135deg, #7ab929 0%, #8bc34a 50%, #a4d65e 100%) !important;
    box-shadow: 0 4px 20px rgba(122, 185, 41, 0.30) !important;
}

.main-btn:hover,
.main-btn:focus {
    background: linear-gradient(135deg, #6aa522 0%, #7ab929 50%, #8bc34a 100%) !important;
    box-shadow: 0 10px 35px rgba(122, 185, 41, 0.45) !important;
}

/* Nav active button (Login/Dashboard): green gradient */
.header-navigation .nav-container .nav-push-item .navbar-btn .main-btn.active-btn {
    background: linear-gradient(135deg, #7ab929, #8bc34a) !important;
    color: #ffffff !important;
}

/* -- Wave 2 sections (Work Process, Featured Users, Testimonials):
   Full overrides moved to dedicated blocks at end of file -- */

/* -- Footer overrides (Dark Bookend) -- */
.saas-footer .footer-widget {
    background: linear-gradient(180deg, #1e3320 0%, #1a2e1a 40%, #162816 100%) !important;
}

/* Override all purple social link backgrounds from style.css lines 2432-2457 */
.saas-footer .footer-widget .widget.newsletter-widget .social-link li a,
.saas-footer .footer-widget .widget.newsletter-widget .social-link li a.facebook,
.saas-footer .footer-widget .widget.newsletter-widget .social-link li a.twitter,
.saas-footer .footer-widget .widget.newsletter-widget .social-link li a.youtube,
.saas-footer .footer-widget .widget.newsletter-widget .social-link li a.instagram {
    background: rgba(255, 255, 255, 0.06) !important;
    border-radius: 10px !important;
    color: rgba(255, 255, 255, 0.50) !important;
}

/* Override purple newsletter button from style.css line 2413 */
.saas-footer .footer-widget .widget.newsletter-widget form .form_gorup .newsletter-btn {
    background: linear-gradient(135deg, #6aa522 0%, #7ab929 50%, #8bc34a 100%) !important;
}

/* Override purple link hovers from style.css lines 2357, 2383 */
.saas-footer .footer-widget .widget.about-widget p.info a:hover {
    color: #7ab929 !important;
}

.saas-footer .footer-widget .widget.useful-link-widget ul.widget-link li a:hover {
    color: #7ab929 !important;
}

/* Override footer widget title colors (style-base-color.php may inject purple) */
.saas-footer .footer-widget .widget h4.widget-title {
    color: rgba(255, 255, 255, 0.40) !important;
}

/* Override copyright area (style-base-color.php may inject purple bg) */
.saas-footer .copyright-area {
    background: #131f13 !important;
}

/* -- Cookie consent -- */
.cookie-consent .cookie-consent__agree {
    background: #7ab929 !important;
    border-color: #7ab929 !important;
}

/* -- Navbar underline animation -- */
.header-navigation .nav-container .main-menu ul li > a::before {
    background: linear-gradient(135deg, #7ab929, #8bc34a) !important;
}

/* -- Nav login/dashboard button: match lang-switcher pill size -- */
.header-navigation .nav-container .nav-push-item .navbar-btn .main-btn {
    min-width: 150px;
    height: 50px;
    padding: 0 20px;
    border-radius: 50px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 500;
    box-sizing: border-box;
}

/* -- Align nav-push-item-container items -- */
.header-navigation .nav-push-item-container {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* -- nav-push-item: flex row for login + lang on desktop -- */
.header-navigation .nav-container .nav-push-item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.header-navigation .nav-container .nav-push-item .language {
    width: auto !important;
    margin-left: 0 !important;
}

/* -- Form focus -- */
.form_control:focus {
    border-color: #7ab929 !important;
    box-shadow: 0 0 0 3px rgba(122, 185, 41, 0.1) !important;
}

/* ============================================================
 * SAAS-ANALYSIS + SAAS-FEATURES - Purple-to-Green Overrides
 * Ensures no purple leaks from style.css or style-base-color.php
 * into the redesigned intro and features sections.
 * ============================================================ */

/* -- saas-analysis: list item checkmark color -- */
.saas-analysis .choose-content-box ul.list li:before {
    color: #7ab929 !important;
}

/* -- saas-features: card border (purple rgba -> neutral) -- */
.saas-features .features-item {
    border-color: rgba(0, 0, 0, 0.04) !important;
}

/* -- saas-features: card hover border (purple -> green) -- */
.saas-features .features-item:hover {
    border-color: rgba(122, 185, 41, 0.12) !important;
    box-shadow: 0 4px 8px rgba(26, 46, 26, 0.04),
                0 24px 64px rgba(122, 185, 41, 0.10) !important;
}

/* -- saas-features: card top accent bar (purple gradient -> green) -- */
.saas-features .features-item::before {
    background: linear-gradient(90deg, #6aa522, #7ab929, #8bc34a) !important;
}

/* -- saas-features: icon color (purple -> green) -- */
.saas-features .features-item i {
    color: #6aa522 !important;
    /* Reset any background-clip text tricks from style.css */
    -webkit-background-clip: unset !important;
    -webkit-text-fill-color: unset !important;
    background-clip: unset !important;
}

/* -- saas-features: icon hover (purple gradient text -> solid green bg with white) -- */
.saas-features .features-item:hover i {
    background: linear-gradient(135deg, #6aa522, #8bc34a) !important;
    color: #ffffff !important;
    -webkit-background-clip: unset !important;
    -webkit-text-fill-color: unset !important;
    background-clip: unset !important;
    animation: none !important;
}

/* ============================================================
 * TEMPLATES PREVIEW (.saas-features-2) - Purple-to-Green Overrides
 * The templates section uses class="saas-features saas-features-2"
 * so it inherits all .saas-features .features-item styles above.
 * These overrides handle templates-specific selectors only.
 * ============================================================ */

/* -- Template card border (inherits from .saas-features but reinforce) -- */
.saas-features.saas-features-2 .features-item {
    border-color: rgba(0, 0, 0, 0.04) !important;
}

/* -- Template card hover: green-tinted shadow instead of purple -- */
.saas-features.saas-features-2 .features-item:hover {
    border-color: rgba(122, 185, 41, 0.12) !important;
    box-shadow: 0 20px 60px rgba(122, 185, 41, 0.10) !important;
}

/* -- Template card top accent bar: green gradient -- */
.saas-features.saas-features-2 .features-item::before {
    background: linear-gradient(90deg, #6aa522, #7ab929, #8bc34a) !important;
}

/* -- Template overlay on hover: green-tinted dark overlay -- */
.saas-features.saas-features-2 .features-item .template-overlay {
    background: rgba(26, 46, 26, 0.55) !important;
}

/* -- Section eyebrow span: green text with green pill lines -- */
.saas-features.saas-features-2 .section-title-one span.span {
    color: #7ab929 !important;
}

.saas-features.saas-features-2 .section-title-one span.span::before {
    background: linear-gradient(90deg, #7ab929, #8bc34a) !important;
}

.saas-features.saas-features-2 .section-title-one span.span::after {
    background: linear-gradient(90deg, #8bc34a, #7ab929) !important;
}

/* ============================================================
 * BLOG (.saas-blog) - Purple-to-Green Overrides
 * Covers card borders, meta icons, heading hover, read button,
 * and box-shadow on hover.
 * ============================================================ */

/* -- Blog card border: purple rgba -> neutral -- */
.saas-blog .blog-item {
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
}

/* -- Blog card hover: green shadow + green border tint -- */
.saas-blog .blog-item:hover {
    box-shadow: 0 20px 60px rgba(122, 185, 41, 0.10) !important;
    border-color: rgba(122, 185, 41, 0.15) !important;
}

/* -- Blog meta icon: purple -> green -- */
.saas-blog .blog-item .entry-content .entry-meta ul li span i {
    color: #7ab929 !important;
}

/* -- Blog heading bottom border: purple tint #E8E0FF -> green tint -- */
.saas-blog .blog-item .entry-content h3 {
    border-bottom-color: #dbe8cc !important;
}

/* -- Blog heading hover/focus: purple -> green -- */
.saas-blog .blog-item .entry-content h3:hover,
.saas-blog .blog-item .entry-content h3:focus {
    color: #7ab929 !important;
}

/* -- Blog read button: normal state purple -> green -- */
.saas-blog .blog-item .entry-content a.read-btn {
    color: #7ab929 !important;
}

/* -- Blog read button hover: dark purple -> dark green (already existed, reinforce) -- */
.saas-blog .blog-item .entry-content a.read-btn:hover {
    color: #6aa522 !important;
}

/* -- Blog section eyebrow: green overrides (scoped to .saas-blog) -- */
.saas-blog .section-title-one span.span {
    color: #7ab929 !important;
}

.saas-blog .section-title-one span.span::before {
    background: linear-gradient(90deg, #7ab929, #8bc34a) !important;
}

.saas-blog .section-title-one span.span::after {
    background: linear-gradient(90deg, #8bc34a, #7ab929) !important;
}

/* -- Blog category sidebar: active item green -- */
.blog-cat-list li::before {
    color: #7ab929 !important;
}

/* ============================================================
 * MOBILE NAV - Purple leak fixes (global, not scoped)
 * ============================================================ */

/* Hamburger bars: override purple #6C3CE1 on ALL pages */
.header-navigation .navbar-toggler span {
    background-color: #7ab929 !important;
}

/* Close button: override purple #6C3CE1 background */
.header-navigation .navbar-close {
    background: #1a3526 !important;
}

/* Homepage transparent header: white hamburger bars */
.transparent-header .navbar-toggler span {
    background: #ffffff !important;
}

/* Sticky header: white hamburger bars */
.header-navigation.sticky .navbar-toggler span {
    background: #ffffff !important;
}

/* ============================================================
 * MOBILE MENU - Nav-pushed-item styles
 * ============================================================ */

/* Login/dashboard button inside mobile slide menu */
.nav-pushed-item .navbar-btn .main-btn {
    background: linear-gradient(135deg, #7ab929, #8bc34a) !important;
    color: #ffffff !important;
    border: none !important;
    display: block;
    text-align: center;
    margin: 15px 20px;
    padding: 12px 20px;
    border-radius: 6px;
}

/* Lang switcher inside mobile slide menu */
.nav-pushed-item .lang-switcher__toggle {
    color: #1a2e1a !important;
    border-color: rgba(26, 46, 26, 0.2) !important;
    background: rgba(26, 46, 26, 0.04) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    margin: 15px 20px;
    width: calc(100% - 40px);
    justify-content: center;
}

.nav-pushed-item .lang-switcher__toggle:hover {
    background: rgba(26, 46, 26, 0.08) !important;
    border-color: rgba(26, 46, 26, 0.3) !important;
}

.nav-pushed-item .lang-switcher__dropdown {
    background: #ffffff !important;
    border-color: rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
    position: relative !important;
    top: 8px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    transform: none !important;
    border-radius: 8px !important;
}

.nav-pushed-item .lang-switcher__option {
    color: #3a3a3a !important;
}

.nav-pushed-item .lang-switcher__option:hover {
    background: #f3f8ed !important;
    color: #1a2e1a !important;
}

.nav-pushed-item .lang-switcher__option.is-active {
    color: #7ab929 !important;
}

/* ============================================================
 * MOBILE MENU - Full-screen overlay redesign
 * ============================================================ */
@media (max-width: 1199px) {

    /* -- Full-screen overlay panel -- */
    .header-navigation .nav-container.breakpoint-on .nav-menu {
        width: 100vw !important;
        left: -100vw !important;
        height: 100vh !important;
        height: 100dvh !important;
        background: linear-gradient(170deg, #1a3526 0%, #162e20 50%, #122418 100%) !important;
        padding: 80px 0 32px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        box-shadow: none !important;
        display: flex !important;
        flex-direction: column !important;
    }

    .header-navigation .nav-container.breakpoint-on .nav-menu.menu-on {
        left: 0 !important;
    }

    /* -- Close button: top-right pill -- */
    .header-navigation .nav-container.breakpoint-on .navbar-close {
        background: rgba(255, 255, 255, 0.08) !important;
        border-radius: 50% !important;
        width: 40px !important;
        height: 40px !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        top: 20px !important;
        right: 20px !important;
        transition: background 0.2s ease !important;
    }

    .header-navigation .nav-container.breakpoint-on .navbar-close:hover {
        background: rgba(255, 255, 255, 0.15) !important;
    }

    .header-navigation .nav-container.breakpoint-on .navbar-close .cross-wrap span {
        background: #ffffff !important;
    }

    /* -- Mobile logo: centered at top -- */
    .header-navigation .nav-container.breakpoint-on .nav-menu .mobile-logo {
        text-align: center !important;
        margin-bottom: 32px !important;
        padding: 0 24px !important;
    }

    .header-navigation .nav-container.breakpoint-on .nav-menu .mobile-logo img {
        filter: brightness(0) invert(1) !important;
        max-height: 36px !important;
    }

    /* -- Nav items: centered, no borders, generous spacing -- */
    .header-navigation .nav-container.breakpoint-on .nav-menu .main-menu {
        flex: 1 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .header-navigation .nav-container.breakpoint-on .nav-menu .main-menu ul {
        width: 100% !important;
        text-align: center !important;
    }

    .header-navigation .nav-container.breakpoint-on .nav-menu .main-menu ul li {
        display: block !important;
        margin: 0 !important;
        border-bottom: none !important;
        text-align: center !important;
    }

    .header-navigation .nav-container.breakpoint-on .nav-menu .main-menu ul li > a {
        color: rgba(255, 255, 255, 0.85) !important;
        font-size: 18px !important;
        font-weight: 500 !important;
        letter-spacing: 0.02em !important;
        padding: 14px 24px !important;
        border: none !important;
        border-bottom: none !important;
        text-align: center !important;
        display: block !important;
        transition: color 0.2s ease, transform 0.2s ease !important;
    }

    .header-navigation .nav-container.breakpoint-on .nav-menu .main-menu ul li > a:hover {
        color: #7ab929 !important;
        transform: translateX(4px);
    }

    /* -- Sub-menu items: slightly smaller, indented feel -- */
    .header-navigation .nav-container.breakpoint-on .nav-menu .main-menu ul li .sub-menu {
        background: rgba(255, 255, 255, 0.03) !important;
        border-radius: 8px !important;
        margin: 4px 24px 8px !important;
        padding: 8px 0 !important;
    }

    .header-navigation .nav-container.breakpoint-on .nav-menu .main-menu ul li .sub-menu li a {
        color: rgba(255, 255, 255, 0.6) !important;
        font-size: 15px !important;
        padding: 10px 24px !important;
        text-align: center !important;
        line-height: 1.4 !important;
    }

    .header-navigation .nav-container.breakpoint-on .nav-menu .main-menu ul li .sub-menu li a:hover {
        color: #7ab929 !important;
    }

    /* -- Dropdown trigger arrow -- */
    .header-navigation .nav-container.breakpoint-on .nav-menu .main-menu ul li .dd-trigger {
        color: rgba(255, 255, 255, 0.5) !important;
        border-left: 1px solid rgba(255, 255, 255, 0.08) !important;
    }

    /* -- Nav-pushed-item: pinned to bottom -- */
    .header-navigation .nav-container.breakpoint-on .nav-pushed-item {
        margin-top: auto !important;
        padding: 24px !important;
        border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 12px !important;
    }

    /* -- Login/Dashboard button inside mobile menu -- */
    .nav-pushed-item .navbar-btn {
        width: 100% !important;
    }

    .nav-pushed-item .navbar-btn .main-btn {
        background: linear-gradient(135deg, #7ab929, #8bc34a) !important;
        color: #ffffff !important;
        border: none !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        text-align: center !important;
        margin: 0 !important;
        padding: 14px 24px !important;
        border-radius: 50px !important;
        font-size: 15px !important;
        font-weight: 600 !important;
        width: 100% !important;
        min-width: unset !important;
        height: 50px !important;
        box-shadow: 0 4px 20px rgba(122, 185, 41, 0.25) !important;
        transition: all 0.3s ease !important;
    }

    .nav-pushed-item .navbar-btn .main-btn:hover {
        box-shadow: 0 6px 28px rgba(122, 185, 41, 0.4) !important;
        transform: translateY(-1px) !important;
    }

    /* -- Lang switcher inside mobile menu -- */
    .nav-pushed-item .lang-switcher {
        width: 100% !important;
    }

    .nav-pushed-item .lang-switcher__toggle {
        color: rgba(255, 255, 255, 0.7) !important;
        border-color: rgba(255, 255, 255, 0.15) !important;
        background: rgba(255, 255, 255, 0.06) !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        margin: 0 !important;
        width: 100% !important;
        justify-content: center !important;
        height: 44px !important;
        min-width: unset !important;
        font-size: 13px !important;
    }

    .nav-pushed-item .lang-switcher__toggle:hover {
        background: rgba(255, 255, 255, 0.1) !important;
        border-color: rgba(255, 255, 255, 0.25) !important;
        color: #ffffff !important;
    }

    .nav-pushed-item .lang-switcher__dropdown {
        background: #1e4030 !important;
        border-color: rgba(255, 255, 255, 0.08) !important;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3) !important;
        position: relative !important;
        top: 8px !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        transform: none !important;
        border-radius: 12px !important;
    }

    .nav-pushed-item .lang-switcher__option {
        color: rgba(255, 255, 255, 0.6) !important;
        text-align: center !important;
    }

    .nav-pushed-item .lang-switcher__option:hover {
        background: rgba(122, 185, 41, 0.1) !important;
        color: #ffffff !important;
    }

    .nav-pushed-item .lang-switcher__option.is-active {
        color: #7ab929 !important;
    }

    /* -- Hide the d-xl-none login li since it's in nav-pushed-item now -- */
    .header-navigation .nav-container.breakpoint-on .nav-menu .main-menu ul li.d-xl-none {
        display: none !important;
    }

    /* -- Overlay backdrop when menu is open -- */
    .header-navigation .nav-container.breakpoint-on .nav-menu.menu-on::before {
        content: '';
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        background: rgba(0, 0, 0, 0.5);
        z-index: -1;
    }
}

/* ============================================================
 * WORK PROCESS (.saas-project) - Purple-to-Green Overrides
 * Covers: count badge, card border, hover states, eyebrow span
 * Sources: style.css lines 1341-1363, style-base-color.php line 132
 * ============================================================ */

/* -- Count badge text: purple #6C3CE1 -> green -- */
.saas-project .work-item .work-img a.count {
    color: #7ab929 !important;
}

/* -- Card info border: purple #E8E0FF -> green tint -- */
.saas-project .work-item .work-info {
    border: 1px solid #dbe8cc !important;
    border-top: none !important;
}

/* -- Card hover: green-tinted shadow + green border -- */
.saas-project .work-item:hover .work-info {
    border-color: rgba(122, 185, 41, 0.20) !important;
}

/* -- Card hover: subtle lift shadow (green tint) -- */
.saas-project .work-item:hover {
    box-shadow: 0 12px 40px rgba(122, 185, 41, 0.10) !important;
}

/* -- Section eyebrow: scoped green overrides -- */
.saas-project .section-title-one span.span {
    color: #7ab929 !important;
}

.saas-project .section-title-one span.span::before {
    background: linear-gradient(90deg, #7ab929, #8bc34a) !important;
}

.saas-project .section-title-one span.span::after {
    background: linear-gradient(90deg, #8bc34a, #7ab929) !important;
}

/* ============================================================
 * FEATURED USERS (.saas-featured-users) - Purple-to-Green Overrides
 * Covers: card border, hover states, photo border, button styles,
 * social links, meta dividers, eyebrow span
 * Sources: style.css lines 1393-1513, style-base-color.php lines 81, 188
 * ============================================================ */

/* -- User card border: purple rgba(108,60,225,0.08) -> neutral -- */
.saas-featured-users .user-item {
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
}

/* -- User card hover: green shadow + green border tint -- */
.saas-featured-users .user-item:hover {
    border-color: rgba(122, 185, 41, 0.15) !important;
    box-shadow: 0 20px 60px rgba(122, 185, 41, 0.12) !important;
}

/* -- User photo border: purple #E8E0FF -> green tint -- */
.saas-featured-users .user-item .title img {
    border: 2px solid #dbe8cc !important;
}

/* -- User button (main-btn): green gradient (reinforces global override) -- */
.saas-featured-users .user-item .user-button ul li .main-btn {
    background: linear-gradient(135deg, #7ab929 0%, #8bc34a 50%, #a4d65e 100%) !important;
    box-shadow: 0 4px 20px rgba(122, 185, 41, 0.30) !important;
}

/* -- User button hover: transparent bg + green border + green text -- */
.saas-featured-users .user-item .user-button ul li .main-btn:hover {
    background: transparent !important;
    border-color: #7ab929 !important;
    color: #7ab929 !important;
    box-shadow: none !important;
}

/* -- Social icons: dark green default (brand colors on hover are in custom.css via :has()) -- */
.saas-featured-users .user-item .social-box ul.social-link li a.facebook,
.saas-featured-users .user-item .social-box ul.social-link li a.twitter,
.saas-featured-users .user-item .social-box ul.social-link li a.youtube,
.saas-featured-users .user-item .social-box ul.social-link li a.instagram {
    border: none !important;
    color: #1a2e1a !important;
    background: rgba(26, 46, 26, 0.06) !important;
}

/* -- User meta top border: purple #E8E0FF -> green tint -- */
.saas-featured-users .user-item .user-meta {
    border-top: 2px solid #dbe8cc !important;
}

/* -- Meta box right divider: purple #E8E0FF -> green tint -- */
.saas-featured-users .user-item .user-meta .meta-box {
    border-right: 2px solid #dbe8cc !important;
}

/* -- Section eyebrow: scoped green overrides -- */
.saas-featured-users .section-title-one span.span {
    color: #7ab929 !important;
}

.saas-featured-users .section-title-one span.span::before {
    background: linear-gradient(90deg, #7ab929, #8bc34a) !important;
}

.saas-featured-users .section-title-one span.span::after {
    background: linear-gradient(90deg, #8bc34a, #7ab929) !important;
}

/* ============================================================
 * TESTIMONIALS (.saas-testimonial) - Purple-to-Green Overrides
 * Covers: card border, hover states, quote accent, eyebrow span
 * Sources: style.css lines 1658-1689
 * ============================================================ */

/* -- Testimonial card border: purple rgba(108,60,225,0.08) -> neutral -- */
.saas-testimonial .testimonial-item {
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
}

/* -- Testimonial card hover: green shadow + green border tint -- */
.saas-testimonial .testimonial-item:hover {
    border-color: rgba(122, 185, 41, 0.15) !important;
    box-shadow: 0 20px 60px rgba(122, 185, 41, 0.10) !important;
}

/* -- Quote accent mark (::before pseudo): purple -> green -- */
.saas-testimonial .testimonial-item .content::before {
    color: #7ab929 !important;
}

/* -- Section eyebrow: scoped green overrides -- */
.saas-testimonial .section-title-one span.span {
    color: #7ab929 !important;
}

.saas-testimonial .section-title-one span.span::before {
    background: linear-gradient(90deg, #7ab929, #8bc34a) !important;
}

.saas-testimonial .section-title-one span.span::after {
    background: linear-gradient(90deg, #8bc34a, #7ab929) !important;
}

/* ============================================================
 * INNER PAGES - Purple Leak Prevention
 * Overrides purple from style.css and style-base-color.php
 * for: FAQ, Contact, Blog Detail, Blog Sidebar, Dynamic pages
 * ============================================================ */

/* -- FAQ accordion: kill purple-tinted borders and backgrounds -- */
.faqs-section .faq-wrapper .card .card-header {
    border-color: rgba(122, 185, 41, 0.10) !important;
}

.faqs-section .faq-wrapper .card .card-body {
    background: #fff !important;
}

.faqs-section .faq-wrapper .card.card .card-header[aria-expanded="true"] {
    background: rgba(122, 185, 41, 0.04) !important;
    border-color: transparent !important;
}

/* FAQ sidebar form (if present) */
.faqs-section .faq-sidebar .widget.contact-widget form .form_group .form_control {
    border-color: rgba(122, 185, 41, 0.12) !important;
}

.faqs-section .faq-sidebar .widget.contact-widget form .form_group .form_control:focus {
    border-color: #7ab929 !important;
    box-shadow: 0 0 0 3px rgba(122, 185, 41, 0.1) !important;
}

.faqs-section .faq-sidebar .widget.contact-widget form .form_group i {
    color: #7ab929 !important;
}

.faqs-section .faq-sidebar .widget.contact-widget form .main-btn {
    background: linear-gradient(135deg, #7ab929 0%, #8bc34a 50%, #a4d65e 100%) !important;
}

/* -- Contact section: kill purple info title and form focus -- */
.contacts-section .contact-information .info-box ul.info-box-list li .contact-info-title {
    color: #1a2e1a !important;
}

.contacts-section .contact-information .info-box ul.info-box-list li .contact-info-title i {
    color: #7ab929 !important;
}

.contacts-section .contact-form form .form_group .form_control:focus {
    border-color: #7ab929 !important;
    box-shadow: 0 0 0 3px rgba(122, 185, 41, 0.1) !important;
}

/* -- Blog listing: kill purple borders/shadows on .blog-item -- */
/* (Reinforces custom.css overrides for blog-page context) */
.saas-blog.blog-page .blog-item {
    border-color: rgba(122, 185, 41, 0.08) !important;
}

.saas-blog.blog-page .blog-item:hover {
    box-shadow: 0 8px 30px rgba(122, 185, 41, 0.1) !important;
    border-color: rgba(122, 185, 41, 0.15) !important;
}

/* -- Blog details: kill any purple leaks -- */
.blog-details-area .blog-details-content a {
    color: #7ab929 !important;
}

.blog-details-area .blog-details-content a:hover {
    color: #6aa522 !important;
}

/* Blog social sharing icons: override purple */
.blog-social .shop-social a {
    border-color: rgba(122, 185, 41, 0.10) !important;
}

.blog-social .shop-social a:hover {
    background: #7ab929 !important;
    border-color: #7ab929 !important;
    color: #fff !important;
}

/* -- Blog sidebar: override potential base-color purple injection -- */
.blog-sidebar .blog-cat-list li::before {
    color: #7ab929 !important;
}

.blog-sidebar .blog-cat-list li a:hover {
    color: #7ab929 !important;
}

.blog-sidebar .blog-cat-list li.active a {
    color: #7ab929 !important;
}

/* -- Dynamic page links -- */
.faqs-section .summernote-content a {
    color: #7ab929 !important;
}

.faqs-section .summernote-content a:hover {
    color: #6aa522 !important;
}

/* -- style-base-color.php catch-all for inner page elements -- */
/* These selectors match common patterns that style-base-color.php generates */
.contacts-section .main-btn,
.faqs-section .main-btn,
.blog-details-area .main-btn {
    background: linear-gradient(135deg, #7ab929 0%, #8bc34a 50%, #a4d65e 100%) !important;
}

.contacts-section .main-btn:hover,
.faqs-section .main-btn:hover,
.blog-details-area .main-btn:hover {
    background: linear-gradient(135deg, #6aa522 0%, #7ab929 50%, #8bc34a 100%) !important;
}

/* Toggle button icon color (FAQ accordion) */
.faqs-section .faq-wrapper .card .card-header .toggle_btn::after {
    color: #7ab929 !important;
}

.faqs-section .faq-wrapper .card.card .card-header[aria-expanded="true"] .toggle_btn::after {
    color: #fff !important;
}

/* ---- BREADCRUMB PURPLE FIX ---- */
/* style.css line 1167 sets a purple overlay on breadcrumbs */
.breadcrumbs-section::before,
.breadcrumbs-section::after {
    background: linear-gradient(135deg, rgba(26, 46, 26, 0.85), rgba(36, 56, 36, 0.9)) !important;
}

/* Breadcrumb background overlay: ensure green tint not purple */
.breadcrumbs-section {
    background-color: #1a2e1a !important;
}

/* ---- PRICING PAGE NEW SECTIONS: GREEN OVERRIDES ---- */

/* FAQ section: ensure no purple on accordion focus/active */
.pricing-page-faq .faq-accordion .card-header button:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(122, 185, 41, 0.2) !important;
}

/* CTA section: override any base-color link colors */
.pricing-page-cta .cta-btn:focus {
    outline: 2px solid rgba(122, 185, 41, 0.5) !important;
    outline-offset: 2px;
}

/* Trial button: override any .main-btn green from base-color */
.saas-pricing .pricing-item .pricing-button .main-btn-trial {
    background: transparent !important;
    background-image: none !important;
}

.saas-pricing .pricing-item .pricing-button .main-btn-trial:hover {
    background: rgba(122, 185, 41, 0.08) !important;
}