/* ========================================
   GREEN THEME OVERRIDE CSS
   Add this file after main.css in head-css.php
   ======================================== */

/* ===== PRIMARY COLOR VARIABLES ===== */
:root {
    /* Main Green Colors */
    --vtc-bg-main1: #03C343;
    --vtc-bg-main2: #03C343;
    --vtc-bg-main7: #03C343;
    --vtc-bg-main12: #03C343;
    --vtc-bg-main14: #03C343;
    --vtc-bg-main15: #03C343;
    --vtc-bg-main18: #03C343;

    /* Dark Green Variants */
    --vtc-bg-main5: #02A036;
    --vtc-bg-main6: #02A036;
    --vtc-bg-main8: #01853B;
    --vtc-bg-main16: #02A036;
    --vtc-bg-main17: #01853B;

    /* Green Gradients */
    --vtc-bg-main3: linear-gradient(90deg, #02A036 1.1%, #03C343 100%);
    --vtc-bg-main4: linear-gradient(90deg, #03C343 1.1%, #02A036 100%);
    --vtc-bg-main9: linear-gradient(268deg, rgba(3, 195, 67, 0.10) 0.24%, rgba(2, 160, 54, 0.10) 98.24%);
    --vtc-bg-main10: linear-gradient(90deg, #02A036 0%, #03C343 100%);
    --vtc-bg-main11: linear-gradient(90deg, #03C343 0%, #02A036 100%);
    --vtc-bg-main13: linear-gradient(180deg, #03C343 0%, #02A036 100%);

    /* Text Colors */
    --vtc-text-title2: #03C343;

    /* Common Background Colors */
    --vtc-bg-common-1: rgba(3, 195, 67, 0.10);
    --vtc-bg-common-5: rgba(3, 195, 67, 0.10);
    --vtc-bg-common-7: #01853B;
    --vtc-bg-common-12: #D5F5E0;
    --vtc-bg-common-13: #C8F7D6;
    --vtc-bg-common-14: #E6F9EC;
    --vtc-bg-common-15: #F0FDF4;
    --vtc-bg-common-16: #E8F9EE;

    /* Border Colors */
    --vtc-border-5: #B8F0CB;
}

/* ===== BUTTONS ===== */
.theme-btn1,
.theme-btn2,
.theme-btn3,
.theme-btn4,
.theme-btn5,
.theme-btn6,
.theme-btn7,
.theme-btn8,
.theme-btn9,
.theme-btn10,
.theme-btn11,
.theme-btn12,
.theme-btn13,
.theme-btn14,
.theme-btn15,
.theme-btn16 {
    background: #03C343 !important;
    border-color: #03C343 !important;
}

.theme-btn1:hover,
.theme-btn2:hover,
.theme-btn3:hover,
.theme-btn4:hover,
.theme-btn5:hover,
.theme-btn6:hover,
.theme-btn7:hover,
.theme-btn8:hover,
.theme-btn9:hover,
.theme-btn10:hover,
.theme-btn11:hover,
.theme-btn12:hover,
.theme-btn13:hover,
.theme-btn14:hover,
.theme-btn15:hover,
.theme-btn16:hover {
    background: #02A036 !important;
    border-color: #02A036 !important;
}

/* Outline Button Variants */
.theme-btn2,
.theme-btn14 {
    background: transparent !important;
    color: #03C343 !important;
    border: 2px solid #03C343 !important;
}

.theme-btn2:hover,
.theme-btn14:hover {
    background: #03C343 !important;
    color: #ffffff !important;
}

/* ===== LINKS & TEXT ===== */
a:hover,
.vl-main-menu ul li a:hover {
    color: var(--vtc-bg-main5) !important;
}

a:hover,
.theme-btn13 ul li a:hover {
    color: #ffffff !important;
}

.sub-title,
.span-title {
    color: #03C343 !important;
}

/* ===== ICONS & BADGES ===== */
.icon-box,
.icon-area,
.badge {
    background-color: rgba(3, 195, 67, 0.10) !important;
    color: #03C343 !important;
}

/* ===== PRICING CARDS ===== */
.pricing-box.active,
.pricing-card.featured {
    border-color: #03C343 !important;
}

.pricing-box .price,
.pricing-card .amount {
    color: #03C343 !important;
}

.pricing-box .btn,
.pricing-card .button a {
    background: #03C343 !important;
}

.pricing-box .btn:hover,
.pricing-card .button a:hover {
    background: #02A036 !important;
}

/* ===== FORMS ===== */
input:focus,
textarea:focus,
select:focus {
    border-color: #03C343 !important;
    outline-color: #03C343 !important;
}

.form-control:focus {
    border-color: #03C343 !important;
    box-shadow: 0 0 0 0.2rem rgba(3, 195, 67, 0.25) !important;
}

/* ===== TABS & NAVIGATION ===== */
.nav-tabs .nav-link.active,
.nav-pills .nav-link.active {
    background-color: #03C343 !important;
    border-color: #03C343 !important;
}

/* ===== PROGRESS BARS ===== */
.progress-bar,
.skill-bar .skill-fill {
    background-color: #03C343 !important;
}

/* ===== TESTIMONIALS ===== */
.testimonial-box .quote-icon,
.testimonial-card .stars i {
    color: #03C343 !important;
}

/* ===== SERVICES & FEATURES ===== */
.service-box:hover,
.feature-box:hover {
    border-color: #03C343 !important;
}

.service-box .icon,
.feature-box .icon {
    background: rgba(3, 195, 67, 0.10) !important;
    color: #03C343 !important;
}

/* ===== COUNTERS & STATISTICS ===== */
.counter-box .number,
.stats-number {
    color: #03C343 !important;
}

/* ===== BLOG & POSTS ===== */
.blog-card .category,
.post-meta .category-badge {
    background: #03C343 !important;
}

.blog-card:hover .title,
.post-title:hover {
    color: #03C343 !important;
}

/* ===== SOCIAL ICONS ===== */
.social-icons a:hover,
.vl-footer-social a:hover {
    background: #03C343 !important;
    border-color: #03C343 !important;
}

/* ===== PAGINATION ===== */
.pagination .page-item.active .page-link {
    background-color: #03C343 !important;
    border-color: #03C343 !important;
}

.pagination .page-link:hover {
    color: #03C343 !important;
}

/* ===== BREADCRUMBS ===== */
.breadcrumb-item.active {
    color: #03C343 !important;
}

/* ===== ALERTS & NOTIFICATIONS ===== */
.alert-success {
    background-color: rgba(3, 195, 67, 0.10) !important;
    border-color: #03C343 !important;
    color: #01853B !important;
}

/* ===== MODALS ===== */
.modal-header {
    border-bottom-color: rgba(3, 195, 67, 0.10) !important;
}

/* ===== TOOLTIPS ===== */
.tooltip-inner {
    background-color: #03C343 !important;
}


/* ===== HEADER & NAVIGATION ===== */
.vl-header-area1 .vl-main-menu ul li.current-menu-item>a,
.vl-header-area6 .vl-main-menu ul li.current-menu-item>a {
    color: #03C343 !important;
}

/* Mobile Menu - Desktop Active State */
.vl-mobile-menu-active .has-dropdown.active>a {
    color: #ffffff !important;
}

/* Mobile Menu - Fix touch/click green color issue */
@media (max-width: 991px) {

    /* Disable tap highlight color on mobile */
    .vl-offcanvas-menu nav a,
    .mobile-nav li a,
    .vl-mobile-menu-active a {
        -webkit-tap-highlight-color: transparent !important;
    }

    /* Keep menu items white on touch/click/active states */
    .vl-offcanvas-menu nav a,
    .vl-offcanvas-menu nav a:active,
    .vl-offcanvas-menu nav a:focus,
    .mobile-nav li a,
    .mobile-nav li a:active,
    .mobile-nav li a:focus,
    .vl-mobile-menu-active a,
    .vl-mobile-menu-active a:active,
    .vl-mobile-menu-active a:focus {
        color: #fff !important;
    }

    /* Override the active dropdown color for mobile */
    .vl-mobile-menu-active .has-dropdown.active>a,
    .vl-mobile-menu-active .has-dropdown.active>a:active,
    .vl-mobile-menu-active .has-dropdown.active>a:focus {
        color: #fff !important;
    }
}

/* ===== FOOTER ===== */
.vl-footer-area1 a:hover,
.vl-footer-area1 .vl-footer-list ul li a:hover {
    color: #03C343 !important;
}

/* Footer area 6 - Override link hover colors but not social icons */
.vl-footer-area6 .vl-footer-list ul li a:hover,
.vl-footer-area6 .vl-copyright6 a:hover {
    color: var(--vtc-bg-main1) !important;
}

/* Keep social media icons unchanged on hover */
.vl-footer-area6 .vl-footer-social6 a:hover {
    background: transparent !important;
    border-color: transparent !important;
}

.vl-footer-area6 .vl-footer-social6 a:hover i {
    color: inherit !important;
}

/* ===== SLIDERS & CAROUSELS ===== */
.slick-dots li.slick-active button,
.owl-dot.active,
.swiper-pagination-bullet-active {
    background: #03C343 !important;
}

/* ===== ACCORDIONS ===== */
.accordion-button:not(.collapsed) {
    background-color: rgba(3, 195, 67, 0.10) !important;
    color: #03C343 !important;
}

/* ===== TABLES ===== */
.table-striped tbody tr:hover {
    background-color: rgba(3, 195, 67, 0.05) !important;
}

/* ===== SHADOWS & EFFECTS ===== */
.box-shadow-green {
    box-shadow: 0 10px 30px rgba(3, 195, 67, 0.15) !important;
}

/* ===== SCROLL TO TOP ===== */
.scroll-top:hover {
    background: #03C343 !important;
}

/* ===== LOADER ===== */
.loader-circle,
.spinner-border {
    border-color: #03C343 !important;
    border-right-color: transparent !important;
}

/* ===== CUSTOM ANIMATIONS ===== */
@keyframes pulse-green {
    0% {
        box-shadow: 0 0 0 0 rgba(3, 195, 67, 0.7);
    }

    70% {
        box-shadow: 0 0 0 10px rgba(3, 195, 67, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(3, 195, 67, 0);
    }
}

.pulse-animation {
    animation: pulse-green 2s infinite;
}

/* ===== RESPONSIVE ADJUSTMENTS ===== */
@media (max-width: 991px) {

    .mobile-menu .theme-btn1,
    .mobile-menu .theme-btn13 {
        background: #03C343 !important;
    }
}

/* ===== DOMAIN SEARCH ===== */
.domain-search-form button,
.hero6-form-area .button button {
    background: #03C343 !important;
}

.domain-search-form button:hover,
.hero6-form-area .button button:hover {
    background: #02A036 !important;
}

/* ===== PRICING TOGGLE ===== */
.pricing-toggle .switch input:checked+.slider {
    background-color: #03C343 !important;
}

/* ===== FAQ SECTION ===== */
.faq-box.active .faq-title {
    color: #03C343 !important;
}

/* ===== CONTACT FORM ===== */
.contact-form .form-group input:focus,
.contact-form .form-group textarea:focus {
    border-color: #03C343 !important;
}

/* ===== MOBILE BUTTON FIXES ===== */
@media (max-width: 767px) {

    .theme-btn13,
    .theme-btn14 {
        padding: 16px 28px !important;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        line-height: 1.2 !important;
        height: auto !important;
    }
}

/* ===== END OF GREEN THEME OVERRIDE ===== */

/* ===== DROPDOWN MENU WIDTH FIX ===== */
.vl-main-menu ul li .sub-menu {
    width: 280px !important;
}

/* Ensure text doesn't wrap unnecessarily if it fits */
.vl-main-menu ul li .sub-menu li a {
    white-space: nowrap !important;
}