/* ChatBotGold Green Theme - Custom Color Override */

/* ============================================
   GREEN COLOR SCHEME VARIABLES
   Primary Green: #00C853 (Bright Green)
   Secondary Green: #00E676 (Light Green)
   Dark Green: #00A847 (Darker shade)
   Light Green: #69F0AE (Lighter shade)
   Gold Accent: #FFD700 (Gold)
============================================ */

/* Top Header Bar - Like ibots.app */
.top-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;
}

.top-header a:hover {
    text-decoration: underline;
}

/* Navigation adjustments for fixed top bar */
.navbar.navbar-fixed-top {
    top: 35px !important;
}

/* Footer Links Styling */
.footer-links-list li a {
    transition: all 0.3s ease;
}

.footer-links-list li a:hover {
    color: #00C853 !important;
    padding-right: 5px;
}

/* Links */
a,
a:link,
a:visited,
a:hover,
a:active {
    color: #00C853;
}

/* Text Colors */
.text-blue,
.text-green {
    color: #00C853 !important;
}

/* Background Colors - Override to Green */
.bg-blue {
    background-color: #00C853 !important;
}

.bg-green {
    background-color: #00C853 !important;
}

.bg-light {
    background-color: #e8f5e9 !important;
}

/* Gradient Background for Hero and Sections */
.insta-bg {
    background: linear-gradient(135deg, #00C853 0%, #00E676 50%, #00A847 100%) !important;
}

/* Button Styles - Green Theme */
.btn-blue,
a.inverse.btn-blue,
.inverse a.btn-blue {
    background-color: #00C853 !important;
}

.btn.btn-blue {
    background-color: #00C853 !important;
    border: 3px solid #00C853 !important;
}

.btn.btn-blue:hover {
    background-color: #00A847 !important;
    border-color: #00A847 !important;
}

.btn-green,
a.inverse.btn-green,
.inverse a.btn-green {
    background-color: #FFD700 !important;
    color: #000 !important;
}

.btn.btn-green {
    background-color: #FFD700 !important;
    border: 3px solid #FFD700 !important;
    color: #000 !important;
}

.btn.btn-green:hover,
.btn-nav.btn-green:hover,
.btn.btn-green:focus,
.btn-nav.btn-green:focus {
    background-color: #e6c200 !important;
    border-color: #e6c200 !important;
}

/* Navigation Button Green */
.cta-header .active .btn-blue.btn-nav {
    background-color: #00C853 !important;
}

.cta-header .active .btn-nav.btn-green {
    background-color: #FFD700 !important;
}

/* Border Button */
.btn-border.btn-blue,
a.btn-border.btn-blue {
    color: #00C853 !important;
}

.btn-border.btn-green,
a.btn-border.btn-green {
    color: #00C853 !important;
}

/* Shadow Button */
.btn-shadow.btn-blue {
    -webkit-box-shadow: 0 4px 0 #008838 !important;
    -moz-box-shadow: 0 4px 0 #008838 !important;
    box-shadow: 0 4px 0 #008838 !important;
}

.btn-shadow.btn-green {
    -webkit-box-shadow: 0 4px 0 #008838 !important;
    -moz-box-shadow: 0 4px 0 #008838 !important;
    box-shadow: 0 4px 0 #008838 !important;
}

/* Top Button (Scroll to top) */
.top {
    background-color: #00C853 !important;
}

.no-touch .top:hover {
    background-color: #00E676 !important;
}

/* Caption Overlay */
.h.caption-3 figcaption {
    background-color: #00C853 !important;
}

.h.caption-5 figcaption {
    background-color: rgba(0, 200, 83, 0.85) !important;
}

/* Success Message */
.success {
    background-color: #00C853 !important;
}

/* Green Check Icon */
.fa-check-circle.green,
.green {
    color: #00C853 !important;
}

/* Pricing Section */
.pricing-3po .info {
    border-color: #00C853 !important;
}

.pricing-3po .info:hover {
    border-color: #00E676 !important;
}

/* Form Focus */
.form-control:focus {
    border-color: #00C853 !important;
    box-shadow: 0 0 5px rgba(0, 200, 83, 0.3) !important;
}

/* Navigation Active State */
.navbar-nav>.active>a,
.navbar-nav>.active>a:hover,
.navbar-nav>.active>a:focus {
    background-color: #e8f5e9 !important;
    color: #00C853 !important;
}

/* Tab Navigation */
.nav-tabs>li.active>a,
.nav-tabs>li.active>a:focus,
.nav-tabs>li.active>a:hover {
    border-bottom: 3px solid #00C853 !important;
    color: #00C853 !important;
}

/* Video Play Button */
.popup-box .popup-button a i.fa-play,
.big-popup a i.fa-play-circle {
    background-color: #00C853 !important;
}

/* Feature Icons */
.icon-left img {
    filter: hue-rotate(90deg);
}

/* Accordion */
.panel-default>.panel-heading {
    background-color: #e8f5e9 !important;
}

.panel-title>a:hover,
.panel-title>a:focus {
    color: #00C853 !important;
}

/* Social Media Section Colors */
.choose li.active a,
.choose li a:hover {
    background-color: #00C853 !important;
}

/* CTA Section */
#cta4 .btn-blue {
    background-color: #00C853 !important;
    border-color: #00C853 !important;
}

/* Hero Section Overlay */
#hero6.hero-devices {
    background: linear-gradient(135deg, rgba(0, 200, 83, 0.1) 0%, rgba(0, 230, 118, 0.1) 100%);
}

/* Footer */
footer .btn-blue {
    background-color: #00C853 !important;
}

/* Selection Color */
::selection {
    background-color: #00C853;
    color: #fff;
}

::-moz-selection {
    background-color: #00C853;
    color: #fff;
}

/* Loader */
.loader.bg-white .loader-inner>div,
.loader.bg-grey .loader-inner>div,
.loader.bg-light .loader-inner>div {
    border-color: #00C853 !important;
}

/* Scrollbar */
::-webkit-scrollbar-thumb {
    background-color: #00C853;
}

/* Progress Bar */
.progress-bar {
    background-color: #00C853 !important;
}

/* Alert Boxes */
.alert-success {
    background-color: #e8f5e9 !important;
    border-color: #00C853 !important;
    color: #00A847 !important;
}

/* Table */
.table>thead>tr>th {
    background-color: #00C853 !important;
    color: #fff !important;
}

/* Badge */
.badge-success,
.label-success {
    background-color: #00C853 !important;
}

/* Box Shadows with Green Tint */
.shadow:hover {
    box-shadow: 0 8px 25px rgba(0, 200, 83, 0.2) !important;
}

/* Card Hover Effects */
.features-panels:hover {
    box-shadow: 0 5px 20px rgba(0, 200, 83, 0.15);
}

/* Pricing Hover */
.pricing-3po .info:hover .price {
    color: #00C853 !important;
}

/* Quote Border */
.quote-border {
    border-left-color: #00C853 !important;
}

/* Carousel Indicators */
.carousel-indicators .active {
    background-color: #00C853 !important;
    border-color: #00C853 !important;
}

/* Responsive Styles */
@media (max-width: 768px) {

    .btn.btn-blue,
    .btn.btn-green {
        font-size: 14px;
    }

    .navbar-nav>.active>a {
        border-left: 3px solid #00C853 !important;
    }
}

/* Animation Glow Effect for Buttons */
.btn.btn-blue:hover,
.btn.btn-green:hover {
    box-shadow: 0 5px 20px rgba(0, 200, 83, 0.4) !important;
    transform: translateY(-2px);
}

/* Gold Accent Highlights */
.gold-accent {
    color: #FFD700 !important;
}

.bg-gold {
    background-color: #FFD700 !important;
}

/* Section Dividers */
.section-divider {
    border-bottom: 2px solid #00C853;
}

/* Footer Links Hover */
footer a:hover {
    color: #00E676 !important;
}

/* Testimonial Stars */
.fa-star {
    color: #FFD700 !important;
}

/* Feature Box Hover */
.features-list li:hover h5 {
    color: #00C853 !important;
}

/* Input Focus Ring */
input:focus,
textarea:focus,
select:focus {
    outline-color: #00C853 !important;
}

/* Custom Green Gradient Text */
.gradient-text {
    background: linear-gradient(135deg, #00C853, #00E676);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Animated Border */
.animated-border {
    border: 2px solid transparent;
    background-image: linear-gradient(white, white), linear-gradient(135deg, #00C853, #FFD700);
    background-origin: border-box;
    background-clip: padding-box, border-box;
}

/* Pulse Animation for CTA */
@keyframes pulse-green {
    0% {
        box-shadow: 0 0 0 0 rgba(0, 200, 83, 0.7);
    }

    70% {
        box-shadow: 0 0 0 15px rgba(0, 200, 83, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(0, 200, 83, 0);
    }
}

.pulse {
    animation: pulse-green 2s infinite;
}