/**
 * Scrollbar Fix for Homepage Elements
 * 
 * Removes unwanted scrollbars from feature cards and other homepage sections
 * Ensures elements display at their natural height without scroll containers
 * 
 * @package IMG_Alt_Gen_Pro
 * @since 1.0.0
 */

/* ========================================
   CRITICAL FIX: Remove All Scrollbars
   ======================================== */

/* Feature Cards - Remove scrollbars and fixed heights */
.feature-card,
.glass-card,
.pricing-card,
.step-card,
.testimonial-card,
.tech-card {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

/* Feature Grid Container */
.features-grid {
    overflow: visible !important;
}

/* Feature Card Content */
.feature-card .feature-description,
.feature-card p,
.glass-card p {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
    white-space: normal !important;
}

/* Pricing Cards */
.pricing-features,
.pricing-card ul {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.pricing-feature,
.pricing-card li {
    overflow: visible !important;
    height: auto !important;
}

/* Step Cards */
.step-card p {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

/* Testimonial Cards */
.testimonial-card,
.testimonial-content,
.testimonial-text {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

/* Tech Cards */
.tech-card,
.tech-requirements,
.tech-performance-grid,
.tech-info-grid {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

/* Section Containers */
.section {
    overflow: visible !important;
}

.container {
    overflow: visible !important;
}

/* ========================================
   General Card Improvements
   ======================================== */

/* Ensure all cards expand to fit their content */
.glass-card {
    min-height: auto !important;
    display: flex;
    flex-direction: column;
}

/* Allow text to wrap naturally */
.feature-description,
.pricing-feature-text,
.step-card p,
.testimonial-text {
    word-wrap: break-word;
    overflow-wrap: break-word;
    hyphens: auto;
}

/* ========================================
   Responsive Adjustments
   ======================================== */

@media (max-width: 768px) {
    .feature-card,
    .glass-card,
    .pricing-card,
    .step-card {
        overflow: visible !important;
        height: auto !important;
    }
}

/* ========================================
   Remove Scrollbars Globally (Homepage Only)
   ======================================== */

/* Target homepage body */
body.home .feature-card *,
body.home .glass-card *,
body.home .pricing-card *,
body.home .step-card *,
body.home .testimonial-card * {
    overflow: visible !important;
}

/* Prevent any element on homepage from having scrollbars */
body.home section * {
    overflow-x: visible !important;
}

/* But keep overflow-x: hidden on body and html for horizontal scroll prevention */
body.home {
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

html {
    overflow-x: hidden !important;
}

/* ========================================
   Additional Fixes for Common Issues
   ======================================== */

/* Fix for flexbox children that might cause overflow */
.features-grid,
.pricing-grid,
.steps-grid,
.testimonials-grid {
    display: grid;
    overflow: visible !important;
}

/* Ensure icons don't cause overflow */
.feature-icon,
.step-icon,
.pricing-feature-icon,
.tech-icon {
    flex-shrink: 0;
    overflow: visible !important;
}

/* Fix for any hidden overflow on parents */
.section {
    overflow: visible !important;
}

.section .container {
    overflow: visible !important;
}

/* ========================================
   Debug Mode (optional - remove in production)
   ======================================== */

/* Uncomment these lines to visually debug which elements have overflow issues */
/*
.feature-card,
.glass-card,
.pricing-card {
    outline: 2px solid red !important;
}

*[style*="overflow: auto"],
*[style*="overflow: scroll"],
*[style*="overflow:auto"],
*[style*="overflow:scroll"] {
    outline: 3px solid yellow !important;
}
*/