/* GREEN REBRAND - Make it SICK! */

:root {
    --primary-green: #10b981; /* Emerald green - different from LendingTree */
    --primary-green-dark: #059669;
    --primary-green-light: #34d399;
    --accent-teal: #14b8a6;
    --accent-cyan: #06b6d4;
}

/* Update all red branding to green */
.logo-text-lt {
    color: #fff !important;
    background: none !important;
    -webkit-background-clip: unset !important;
    -webkit-text-fill-color: unset !important;
    background-clip: unset !important;
}

.logo-leaf-swoosh {
    color: #fff !important;
    position: relative;
    display: inline-block;
}

.logo-leaf-swoosh::after {
    content: '';
    position: absolute;
    bottom: 2px;
    left: 0;
    width: 100%;
    height: 2px;
    background: #10b981;
    border-radius: 1px;
    transform: skewX(-15deg);
}

/* Header button - green */
.btn-header-lt {
    background: linear-gradient(135deg, var(--primary-green) 0%, var(--primary-green-dark) 100%) !important;
    box-shadow: 0 4px 14px rgba(16, 185, 129, 0.4), 0 2px 4px rgba(0, 0, 0, 0.1) !important;
}

.btn-header-lt:hover {
    background: linear-gradient(135deg, var(--primary-green-dark) 0%, #047857 100%) !important;
    box-shadow: 0 6px 20px rgba(16, 185, 129, 0.5), 0 4px 8px rgba(0, 0, 0, 0.15) !important;
}

/* Hero title - green accent */
.hero-title-lt span {
    background: linear-gradient(135deg, var(--primary-green) 0%, var(--accent-teal) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Compare button - green */
button[id="compareBtn"] {
    background: linear-gradient(135deg, var(--primary-green) 0%, var(--primary-green-dark) 100%) !important;
    box-shadow: 0 4px 14px rgba(16, 185, 129, 0.4), 0 2px 4px rgba(0, 0, 0, 0.1) !important;
}

button[id="compareBtn"]:hover {
    background: linear-gradient(135deg, var(--primary-green-dark) 0%, #047857 100%) !important;
    box-shadow: 0 6px 20px rgba(16, 185, 129, 0.5), 0 4px 8px rgba(0, 0, 0, 0.15) !important;
}

/* Service tabs - green accent */
.service-tab-lt::before {
    background: linear-gradient(90deg, var(--primary-green), var(--accent-teal), var(--accent-cyan)) !important;
}

.service-tab-lt.active-tab-lt {
    background: linear-gradient(135deg, #f0fdf4 0%, #ffffff 100%);
    box-shadow: 0 4px 16px rgba(16, 185, 129, 0.15);
}

/* Trust stats icons - green gradient */
.trust-stat-lt i {
    background: linear-gradient(135deg, var(--primary-green), var(--accent-teal));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    filter: drop-shadow(0 2px 4px rgba(16, 185, 129, 0.3));
}

/* Why cards - green accents */
.why-card-lt::before {
    background: linear-gradient(90deg, var(--primary-green), var(--accent-teal), var(--accent-cyan), #8b5cf6);
}

.why-icon-lt {
    background: linear-gradient(135deg, var(--primary-green) 0%, var(--accent-teal) 100%) !important;
    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3) !important;
}

/* Keep other card colors for variety */
.why-card-lt:nth-child(2) .why-icon-lt {
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%) !important;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3) !important;
}

.why-card-lt:nth-child(3) .why-icon-lt {
    background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%) !important;
    box-shadow: 0 4px 12px rgba(139, 92, 246, 0.3) !important;
}

/* Featured rates cards - green primary */
.rate-card-lt {
    background-image: linear-gradient(white, white), linear-gradient(135deg, var(--primary-green), var(--accent-teal)) !important;
}

.rate-card-lt::after {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.03), rgba(20, 184, 166, 0.03));
}

.rate-number-lt {
    background: linear-gradient(135deg, var(--primary-green), var(--accent-teal));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    filter: drop-shadow(0 2px 4px rgba(16, 185, 129, 0.2));
}

/* Testimonial quote - green accent */
.testimonial-quote-lt {
    border-image: linear-gradient(135deg, var(--primary-green), var(--accent-teal)) 1 !important;
}

.quote-icon-lt {
    background: linear-gradient(135deg, var(--primary-green), var(--accent-teal));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* CTA Section - GREEN with better text contrast */
.cta-lt {
    background: linear-gradient(135deg, var(--primary-green) 0%, var(--primary-green-dark) 50%, #047857 100%) !important;
    box-shadow: 0 8px 32px rgba(16, 185, 129, 0.3);
}

/* FIX: CTA button text - make it WHITE and readable */
.btn-cta-lt {
    background: white !important;
    color: var(--primary-green) !important;
    box-shadow: 0 4px 14px rgba(255, 255, 255, 0.3), 0 2px 4px rgba(0, 0, 0, 0.1) !important;
    font-weight: 600 !important;
}

.btn-cta-lt:hover {
    background: #f9fafb !important;
    color: var(--primary-green-dark) !important;
    box-shadow: 0 6px 20px rgba(255, 255, 255, 0.4), 0 4px 8px rgba(0, 0, 0, 0.15) !important;
}

/* FIX: Trust bar text - better contrast */
.trust-bar-lt {
    background: linear-gradient(135deg, #1f2937 0%, #111827 100%);
}

.trust-stat-lt .stat-number-lt {
    color: white !important;
    font-weight: 700 !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.trust-stat-lt .stat-label-lt {
    color: #d1d5db !important;
    font-weight: 500 !important;
}

/* CTA trust indicators - better contrast */
.cta-trust-lt {
    color: white !important;
    opacity: 0.95 !important;
    font-weight: 500 !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.cta-trust-lt i {
    color: white !important;
    opacity: 1 !important;
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.2));
}

/* Hero gradient - green tint */
.hero-lt::before {
    background: radial-gradient(circle, rgba(16, 185, 129, 0.08) 0%, transparent 70%);
}

.hero-lt::after {
    background: radial-gradient(circle, rgba(20, 184, 166, 0.06) 0%, transparent 70%);
}

/* Primary button style */
.btn-primary {
    background: linear-gradient(135deg, var(--primary-green) 0%, var(--primary-green-dark) 100%) !important;
    box-shadow: 0 4px 14px rgba(16, 185, 129, 0.4), 0 2px 4px rgba(0, 0, 0, 0.1) !important;
    color: white !important;
}

.btn-primary:hover {
    background: linear-gradient(135deg, var(--primary-green-dark) 0%, #047857 100%) !important;
    box-shadow: 0 6px 20px rgba(16, 185, 129, 0.5), 0 4px 8px rgba(0, 0, 0, 0.15) !important;
}

/* Nav hover - green */
.nav-lt a:hover {
    color: var(--primary-green) !important;
}

.dropdown-menu-lt a:hover {
    color: var(--primary-green) !important;
}

/* Links - green */
a {
    color: var(--primary-green);
}

a:hover {
    color: var(--primary-green-dark);
}

/* CATEGORY PAGES - Override ALL red to green */

/* Hero CTA buttons on category pages */
.btn-cta-large,
.btn-secondary-large,
.cta-button,
.hero-cta-button {
    background: linear-gradient(135deg, var(--primary-green) 0%, var(--primary-green-dark) 100%) !important;
    color: white !important;
    box-shadow: 0 4px 14px rgba(16, 185, 129, 0.4), 0 2px 4px rgba(0, 0, 0, 0.1) !important;
    border: none !important;
}

.btn-cta-large:hover,
.btn-secondary-large:hover,
.cta-button:hover,
.hero-cta-button:hover {
    background: linear-gradient(135deg, var(--primary-green-dark) 0%, #047857 100%) !important;
    box-shadow: 0 6px 20px rgba(16, 185, 129, 0.5), 0 4px 8px rgba(0, 0, 0, 0.15) !important;
}

/* Calculator section - green accents */
.calculator-card {
    border: 2px solid var(--primary-green) !important;
}

.calculator-title {
    color: var(--primary-green) !important;
}

.calculator-result {
    background: linear-gradient(135deg, #f0fdf4 0%, #ffffff 100%) !important;
    border: 2px solid var(--primary-green) !important;
}

.calculator-amount {
    color: var(--primary-green) !important;
}

/* Range slider - green */
input[type="range"]::-webkit-slider-thumb {
    background: var(--primary-green) !important;
}

input[type="range"]::-moz-range-thumb {
    background: var(--primary-green) !important;
}

input[type="range"]::-webkit-slider-track {
    background: linear-gradient(to right, var(--primary-green) 0%, var(--primary-green) var(--value, 50%), #e5e7eb var(--value, 50%), #e5e7eb 100%) !important;
}

/* Checkmarks and icons - green */
.checkmark,
.check-icon,
.benefit-icon {
    color: var(--primary-green) !important;
}

/* Comparison table - green highlights */
.comparison-highlight {
    background: linear-gradient(135deg, #f0fdf4 0%, #ffffff 100%) !important;
    border-left: 4px solid var(--primary-green) !important;
}

/* Step numbers - green */
.step-number {
    background: linear-gradient(135deg, var(--primary-green) 0%, var(--accent-teal) 100%) !important;
    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3) !important;
}

/* FAQ section - green accents */
.faq-question:hover {
    border-left-color: var(--primary-green) !important;
}

.faq-icon {
    color: var(--primary-green) !important;
}

/* Success story cards - green borders */
.story-card {
    border-top: 4px solid var(--primary-green) !important;
}

.story-stat {
    color: var(--primary-green) !important;
}

/* Eligibility section - green */
.eligibility-cta {
    background: linear-gradient(135deg, #f0fdf4 0%, #ffffff 100%) !important;
    border: 2px solid var(--primary-green) !important;
}

/* All buttons site-wide - green by default */
button,
.button,
.btn {
    background: linear-gradient(135deg, var(--primary-green) 0%, var(--primary-green-dark) 100%) !important;
    color: white !important;
}

button:hover,
.button:hover,
.btn:hover {
    background: linear-gradient(135deg, var(--primary-green-dark) 0%, #047857 100%) !important;
}

/* Override specific red buttons */
.btn-red,
.btn-danger,
[style*="background: #dc2626"],
[style*="background: #ef4444"],
[style*="background-color: #dc2626"],
[style*="background-color: #ef4444"] {
    background: linear-gradient(135deg, var(--primary-green) 0%, var(--primary-green-dark) 100%) !important;
}

/* Breadcrumb - green */
.breadcrumb a {
    color: var(--primary-green) !important;
}

/* Hero title on category pages - green accent */
.hero-title,
h1 {
    color: #1f2937;
}

.hero-title span,
h1 span {
    color: var(--primary-green) !important;
}

/* Savings highlight - green */
.savings-highlight,
.discount-badge {
    background: var(--primary-green) !important;
    color: white !important;
}