/* Bootstrap Override Styles for Waves */

/* Override Bootstrap's default anchor styles */
a {
    color: var(--primary, #00b2e0);
    text-decoration: none;
}

a:hover {
    color: var(--primary-dark, #0088b0);
    text-decoration: none;
}

/* Ensure custom container max-width */
.container {
    max-width: 1400px !important;
}

.container-fluid {
    padding-left: 40px !important;
    padding-right: 40px !important;
}

/* Responsive container-fluid padding */
@media (max-width: 768px) {
    .container-fluid {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}

@media (max-width: 480px) {
    .container-fluid {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
}

/* Products Grid - Let Bootstrap handle layout */
.products-grid {
    /* Bootstrap row classes will handle grid */
}

/* Features Grid - Let Bootstrap handle layout */
.features-grid {
    /* Bootstrap row classes will handle grid */
}

/* Hero Stats - Remove flex, Bootstrap will handle */
.hero-stats {
    margin-top: 80px;
}

/* Steps Timeline - Let Bootstrap handle layout */
.steps-timeline {
    max-width: 900px;
    margin: 0 auto 60px;
}

/* Trust Features - Let Bootstrap handle layout */
.trust-features {
    margin-top: 60px;
}

/* Testimonials Grid - Let Bootstrap handle layout */
.testimonials-grid {
    /* Bootstrap row classes will handle grid */
}

/* Ensure product cards maintain proper height with Bootstrap */
.product-card.h-100 {
    display: flex;
    flex-direction: column;
}

.product-card.h-100 .product-info {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.product-card.h-100 .product-footer {
    margin-top: auto;
}

/* Feature items maintain proper styling */
.feature-item {
    height: 100%;
}

/* Testimonial cards with Bootstrap */
.testimonial-card.h-100 {
    display: flex;
    flex-direction: column;
}

/* Fix any Bootstrap conflicts with custom components */
.hero-stat-item {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px 30px;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    border-radius: 12px;
    transition: all 0.3s ease;
}

/* Ensure gap utilities work with Bootstrap */
.gap-2 {
    gap: 0.5rem !important;
}

.gap-4 {
    gap: 1.5rem !important;
}

/* Bootstrap column adjustments for consistent spacing */
.row.g-4 {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 1.5rem;
}

.row.g-3 {
    --bs-gutter-x: 1rem;
    --bs-gutter-y: 1rem;
}

/* Maintain header flexibility with Bootstrap utilities */
.header-content.d-flex {
    gap: 32px;
    padding: 16px 0;
}

.main-nav.d-flex {
    gap: 28px;
    margin-right: 32px;
}

.header-actions.d-flex {
    gap: 16px;
    flex-shrink: 0;
}
