/* ========================================
   GREEN SOLARTECH - Custom Color Theme
   ======================================== */

:root {
    /* Primary Green Colors - Solar/Eco Theme */
    --primary-green: #2d8a3e;        /* Main brand green */
    --primary-green-dark: #1e6b2f;   /* Darker green for hover states */
    --primary-green-light: #4caf50;  /* Lighter green for accents */
    
    /* Secondary Colors */
    --secondary-yellow: #ffc107;     /* Solar/Energy yellow */
    --secondary-orange: #ff9800;     /* Warm accent */
    
    /* Neutral Colors */
    --text-dark: #111;
    --text-gray: #444;
    --bg-light: #f5f5f5;
    --white: #ffffff;
}

/* ========================================
   PRIMARY BRAND COLOR REPLACEMENTS
   ======================================== */

/* Replace all blue (#3087c8, #3088c8) with green */
.bdr123 {
    border: 1px solid var(--primary-green) !important;
}

.paketler2__gorsel--1,
.paketler2__gorsel--2,
.paketler2__gorsel--3,
.paketler2__gorsel--4,
.paketler2__gorsel--5,
.paketler2__gorsel--6 {
    border: 1px solid var(--primary-green) !important;
}

.btn-danger {
    background-color: var(--primary-green) !important;
    border-color: var(--primary-green) !important;
}

.btn-danger:hover {
    background-color: var(--primary-green-dark) !important;
    border-color: var(--primary-green-dark) !important;
}

/* Gradient replacements - Blue to Green */
.h2-baslik-hizmetler-2,
.h2-baslik-hizmetler-21,
.h2-baslik-anasayfa-ozel,
.h2-baslik-anasayfa-ozel-21,
.h2-baslik-anasayfa-ozel-22,
.baslik-3,
.baslik-3-1,
.baslik-3-2,
.baslik-3-3,
.baslik-3-4,
.baslik-3-5,
.baslik-3-6,
.baslik-3-7 {
    background-image: linear-gradient(to right, var(--primary-green-light), var(--primary-green)) !important;
    -webkit-background-clip: text !important;
    color: transparent !important;
}

/* Button styles */
.buton--kirmizi::after,
.buton--kirmizislider::after,
.buton1--kirmizi::after,
.buton-contact--kirmizi::after,
.buton-contact--kirmizislider::after {
    background-color: var(--primary-green) !important;
}

.buton--kirmizislider,
.buton-contact--kirmizislider {
    background-color: var(--primary-green-light) !important;
}

.h-buton-link:hover {
    background-color: var(--primary-green) !important;
}

/* Package/Service boxes */
.paketler__on,
.paketler3__on,
.paketler4__on {
    background-color: var(--primary-green) !important;
}

/* Tabs and navigation */
.component-systemTabs .tabs-container ul.tabs li:hover,
.component-systemTabs .tabs-container ul.tabs li.current {
    color: var(--primary-green) !important;
}

.component-systemTabs .tabs-container ul.tabs li.current {
    border-bottom: 4px solid var(--primary-green) !important;
}

/* Forms */
.form__input:focus:invalid,
.form-popup__input:focus:invalid {
    border-bottom: 0.3rem solid var(--primary-green) !important;
}

.form-popup__input {
    border-bottom: .3rem solid var(--primary-green) !important;
}

input[type="radio"]:checked,
input[type="checkbox"]:checked {
    border: 6px solid var(--primary-green) !important;
}

.custom-button,
button[type="submit"],
input[type="submit"] {
    background: var(--primary-green) !important;
    border-color: var(--primary-green) !important;
}

.custom-button:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
    background: var(--primary-green-dark) !important;
    border-color: var(--primary-green-dark) !important;
}

/* Links */
a {
    color: var(--primary-green) !important;
}

a:hover {
    color: var(--primary-green-dark) !important;
}

/* Popup and modal elements */
.popup__kapat:hover {
    color: var(--primary-green) !important;
}

/* Icon backgrounds */
.icon-box {
}

/* Swiper pagination */
.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: var(--primary-green) !important;
}

/* ========================================
   ORANGE/RED ACCENT REPLACEMENTS
   ======================================== */

/* Replace orange (#fe7101, #ff6d00) with yellow/orange solar theme */
.vertical-tab .nav-tabs li a:hover,
.vertical-tab .nav-tabs li.active a {
    color: var(--secondary-orange) !important;
}

.vertical-tab .nav-tabs li.active a:hover,
.vertical-tab .nav-tabs li.active a {
    color: var(--secondary-yellow) !important;
}

.vertical-tab .nav-tabs li a:before {
    border-bottom: 3px solid var(--secondary-orange) !important;
}

.vertical-tab .tab-content {
    border-left: 2px solid var(--secondary-orange) !important;
}

.vertical-tab .tab-content h3 {
    color: var(--secondary-orange) !important;
}

h2 > span.main:before {
    background: var(--secondary-orange) !important;
}

/* ========================================
   WHATSAPP BUTTON - Keep Green
   ======================================== */
.back-to-Right,
.back-to-Right-up {
    background-color: #25d366 !important; /* WhatsApp green */
}

/* ========================================
   BACKGROUND COLOR FIXES
   ======================================== */

/* Fix blue backgrounds to green */
.footer,
footer {
    background: linear-gradient(135deg, #1e6b2f 0%, #2d8a3e 100%) !important;
}

.content-section {
    background: #f5f5f5 !important;
}

/* Fix any remaining blue backgrounds */
[style*="background: #0071b4"],
[style*="background-color: #0071b4"] {
    background: var(--primary-green) !important;
    background-color: var(--primary-green) !important;
}

/* Selection color */
::selection {
    background-color: var(--primary-green) !important;
    color: #fff !important;
}

::-webkit-scrollbar-thumb {
    background: var(--primary-green) !important;
}

/* Swiper pagination */
.swiper-pagination-bullet-active {
    background: var(--primary-green) !important;
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background: var(--primary-green) !important;
}

/* ========================================
   ADDITIONAL ENHANCEMENTS
   ======================================== */



/* Footer links */
footer a:hover {
    color: var(--primary-green-light) !important;
}

/* Service cards hover effect */
.paketler2:hover {
    border-color: var(--primary-green) !important;
    box-shadow: 0 5px 20px rgba(45, 138, 62, 0.3) !important;
}

/* Counter boxes */
.counter-box {
    color: var(--primary-green) !important;
}

/* Icon colors */
.icon i,
.iconw i {
    color: var(--primary-green) !important;
}

/* Contact info icons */
.iconpfooter {
    color: var(--secondary-yellow) !important;
}

/* Testimonial and client section accents */
.testimonial-card:hover {
    border-color: var(--primary-green) !important;
}

/* Page headers */
.page-header {
    background-blend-mode: overlay;
    background-color: rgb(0 14 3 / 71%) !important;
}

/* Breadcrumb active state */
.page-header p a:hover {
    color: var(--secondary-yellow) !important;
}

/* Social media icons - keep original colors but add hover effect */
.footer-social li a:hover {
    transform: scale(1.1);
    filter: brightness(1.2);
}

/* Custom button styles for solar theme */
.btn-solar {
    background: linear-gradient(135deg, var(--primary-green) 0%, var(--primary-green-light) 100%) !important;
    border: none !important;
    color: white !important;
    padding: 12px 30px !important;
    border-radius: 25px !important;
    transition: all 0.3s ease !important;
}

.btn-solar:hover {
    background: linear-gradient(135deg, var(--primary-green-dark) 0%, var(--primary-green) 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 5px 15px rgba(45, 138, 62, 0.4) !important;
}

/* Fix all button variants */
.btn-primary,
.btn-info,
.custom-button {
    background: var(--primary-green) !important;
    border-color: var(--primary-green) !important;
    color: white !important;
}

.btn-primary:hover,
.btn-info:hover,
.custom-button:hover {
    background: var(--primary-green-dark) !important;
    border-color: var(--primary-green-dark) !important;
}

/* LinkedIn icon - keep original but adjust if needed */
.fa-linkedin-in {
    background-color: #0077b5 !important;
}

/* Fix blue gradients in headings */
.h2-baslik-anasayfa,
.h2-baslik-hizmetler,
.baslik-1,
.baslik-2 {
    background-image: linear-gradient(to right, var(--primary-green-light), var(--primary-green)) !important;
    -webkit-background-clip: text !important;
    color: transparent !important;
}

/* Energy/Solar themed animations */
@keyframes solar-pulse {
    0%, 100% {
        box-shadow: 0 0 10px rgba(45, 138, 62, 0.5);
    }
    50% {
        box-shadow: 0 0 20px rgba(45, 138, 62, 0.8);
    }
}

.solar-pulse {
    animation: solar-pulse 2s infinite;
}

/* Responsive adjustments */
@media only screen and (max-width: 768px) {
    .btn-solar {
        padding: 10px 20px !important;
        font-size: 14px !important;
    }
}


/* ========================================
   FOOTER SPECIFIC FIXES
   ======================================== */

/* Override footer background - change from black to green gradient */
.footer {
    background-image: linear-gradient(to right bottom, #1e6b2f, #2d8a3e) !important;
    background: linear-gradient(135deg, #1e6b2f 0%, #2d8a3e 100%) !important;
}

/* Footer social media hover - change from blue to green */
.footer .footer-social li a:hover {
    background: var(--primary-green) !important;
    border-color: var(--primary-green) !important;
}

/* Footer 404 page */
.footer-404 {
    background-image: linear-gradient(to right bottom, var(--primary-green-light), var(--primary-green)) !important;
}

/* ========================================
   COMPREHENSIVE BLUE TO GREEN REPLACEMENTS
   ======================================== */

/* Replace all instances of #3087c8 (blue) with green */
[style*="#3087c8"],
[style*="#3088c8"],
[style*="#5290BE"],
[style*="#0071b4"],
[style*="#33c4e7"],
[style*="#0c52aa"] {
    color: var(--primary-green) !important;
}

/* Background replacements */
[style*="background: #3087c8"],
[style*="background-color: #3087c8"],
[style*="background: #5290BE"],
[style*="background-color: #5290BE"] {
    background: var(--primary-green) !important;
    background-color: var(--primary-green) !important;
}

/* Border replacements */
[style*="border-color: #3087c8"],
[style*="border: 1px solid #3087c8"] {
    border-color: var(--primary-green) !important;
}

/* ========================================
   SPECIFIC ELEMENT FIXES
   ======================================== */

/* Content section backgrounds */
.content-section[data-background] {
    background-color: #f5f5f5 !important;
}

/* Info boxes and cards */
.info-top,
.services1,
.services2,
.services3,
.services4 {
   
}

/* Team section */
.team-section {
    background: #f9f9f9 !important;
}

/* Form area - change blue gradient to green */
.form-alani {
    background-image: linear-gradient(to right bottom, var(--primary-green-light), var(--primary-green)) !important;
}

/* Counter section */
.count-bolumu {
    background-color: #1e6b2f !important;
}

/* ========================================
   BUTTON AND CTA COMPREHENSIVE FIXES
   ======================================== */

/* All button types */
button,
.button,
.btn,
input[type="button"],
input[type="submit"],
.custom-button,
.buton,
.buton--kirmizi {
   
}

button:hover,
.button:hover,
.btn:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
.custom-button:hover,
.buton:hover,
.buton--kirmizi:hover {
    background: var(--primary-green-dark) !important;
    border-color: var(--primary-green-dark) !important;
}

/* Specific button classes */
.btn-danger,
.btn-primary,
.btn-info,
.btn-success {
    background-color: var(--primary-green) !important;
    border-color: var(--primary-green) !important;
}

.btn-danger:hover,
.btn-primary:hover,
.btn-info:hover,
.btn-success:hover {
    background-color: var(--primary-green-dark) !important;
    border-color: var(--primary-green-dark) !important;
}

/* ========================================
   ICON AND ACCENT FIXES
   ======================================== */

/* Icon box backgrounds */
.icon-box,
.iconw,
.icon {
    color: var(--primary-green) !important;
}

.icon-box i,
.iconw i,
.icon i {
    color: var(--primary-green) !important;
}

/* Flaticon colors */
[class^="flaticon-"],
[class*=" flaticon-"] {
    color: var(--primary-green) !important;
}

/* ========================================
   HOVER AND ACTIVE STATES
   ======================================== */

/* Link hover states */
a:hover,
a:focus,
a:active {
    color: var(--primary-green-dark) !important;
}

/* ========================================
   RESPONSIVE FIXES
   ======================================== */

@media only screen and (max-width: 768px) {
    .footer {
        background: linear-gradient(135deg, #1e6b2f 0%, #2d8a3e 100%) !important;
    }
    
    .custom-button {
        background: var(--primary-green) !important;
        border-color: var(--primary-green) !important;
    }
}

/* ========================================
   ANIMATION AND TRANSITION ENHANCEMENTS
   ======================================== */

/* Smooth transitions for all green elements */
.btn,
.button,
.custom-button,
a,
.icon-box {
    transition: all 0.3s ease !important;
}

/* Pulse effect for important CTAs */
@keyframes green-pulse {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(45, 138, 62, 0.7);
    }
    50% {
        box-shadow: 0 0 0 10px rgba(45, 138, 62, 0);
    }
}

.pulse-green {
    animation: green-pulse 2s infinite;
}
