/**
 * GBI Farms — Site-Wide Mobile Responsiveness
 * Consolidated responsive overrides for all pages
 */

/* ─── GLOBAL SECTION PADDING ─────────────────────────────────────────────── */
@media (max-width: 991px) {
    .section { padding: 3.5rem 0; }
    :root { --gbi-section-padding: 3.5rem; }
}

@media (max-width: 767px) {
    .section { padding: 2.75rem 0; }
    :root { --gbi-section-padding: 2.75rem; }
    .section-header { margin-bottom: 1.75rem; }
    .section-title { font-size: 1.5rem; }
    .lead { font-size: 1rem; }
}

@media (max-width: 480px) {
    .section { padding: 2.25rem 0; }
    :root { --gbi-section-padding: 2.25rem; }
}


/* ─── NAVBAR / HEADER ────────────────────────────────────────────────────── */
@media (max-width: 991px) {
    .navbar-gbi .navbar-collapse {
        background: var(--gbi-white);
        padding: 1rem;
        border-radius: var(--gbi-radius-lg);
        box-shadow: var(--gbi-shadow-lg);
        margin-top: 0.5rem;
    }

    .navbar-gbi .nav-link { padding: 0.6rem 0.5rem; }
    .navbar-gbi .nav-link::after { display: none; }

    .navbar-gbi .btn-nav-cta {
        display: inline-block;
        margin: 0.25rem 0;
        width: 100%;
        text-align: center;
    }

    /* Cart button & account in mobile collapse */
    .nav-cart-btn { width: 100%; justify-content: center; margin: 0.3rem 0; }
}

@media (max-width: 767px) {
    .navbar-gbi { padding: 0.6rem 0; }
    .navbar-gbi .navbar-brand img { height: 40px; }
}


/* ─── HOMEPAGE ───────────────────────────────────────────────────────────── */
@media (max-width: 991px) {
    /* Pillar row — 2 per row */
    .hp-pillar-row {
        grid-template-columns: repeat(2, 1fr) !important;
        display: grid;
        gap: 1rem;
    }

    /* Metric grid — 2×2 */
    .hp-metric-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 0.75rem;
    }

    /* Trust grid — 2-col */
    .hp-trust-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 1rem;
    }

    /* Impact row — 2-col */
    .hp-impact-row {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 1rem;
    }

    /* Fund bar — 3+2 */
    .hp-fund-bar {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr);
        gap: 0.75rem;
    }
}

@media (max-width: 767px) {
    /* Pillar row — scrollable or single col */
    .hp-pillar-row {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 0.75rem;
    }

    .hp-pillar { padding: 1.25rem 1rem; }
    .hp-pillar i { font-size: 1.5rem; }
    .hp-pillar h5 { font-size: 0.95rem; }
    .hp-pillar p { font-size: 0.82rem; }

    /* Fund bar */
    .hp-fund-bar { grid-template-columns: repeat(2, 1fr) !important; gap: 0.6rem; }
    .hp-fund-item { padding: 0.75rem 0.5rem; }
    .hp-fund-item .fi-val { font-size: 1.1rem; }

    /* Metric */
    .hp-metric { padding: 1rem; }
    .hp-metric .m-val { font-size: 1.5rem; }

    /* Trust grid */
    .hp-trust-grid { grid-template-columns: 1fr !important; }
    .hp-trust-item { gap: 0.75rem; }
    .hp-trust-item i { font-size: 1.75rem; margin-top: 0.15rem; }

    /* Impact */
    .hp-impact-row { grid-template-columns: repeat(2, 1fr) !important; gap: 0.75rem; }
    .hp-impact-card { padding: 1.25rem 1rem; }
    .hp-impact-card i { font-size: 1.75rem; }

    /* Product strip — scrollable */
    .hp-prod-strip {
        display: flex !important;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x mandatory;
        gap: 0.75rem;
        padding-bottom: 0.5rem;
    }

    .hp-prod-strip::-webkit-scrollbar { height: 4px; }
    .hp-prod-strip::-webkit-scrollbar-thumb { background: var(--gbi-gray-300); border-radius: 2px; }

    .hp-prod-item {
        flex-shrink: 0;
        scroll-snap-align: start;
        width: 130px;
        padding: 1rem;
    }

    /* CTA section stack */
    #hp-cta .row { flex-direction: column; }

    /* Quick Enquiry form */
    .about-mini-form { margin-top: 1.5rem; }

    /* Exit popup */
    .hp-exit-box { padding: 1.5rem; margin: 1rem; }

    /* Contact card */
    .gf-contact-card { padding: 1.25rem; }
    .gf-contact-card .c-item a { font-size: 0.88rem; }
}

@media (max-width: 480px) {
    .hp-pillar-row { grid-template-columns: 1fr !important; }
    .hp-fund-bar { grid-template-columns: repeat(2, 1fr) !important; }
    .hp-impact-row { grid-template-columns: 1fr !important; }
}


/* ─── ABOUT PAGE ──────────────────────────────────────────────────────────── */
@media (max-width: 767px) {
    .about-stats-row {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 1rem;
    }

    .about-team-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .about-values-grid {
        grid-template-columns: 1fr !important;
    }
}


/* ─── FARM PAGE ───────────────────────────────────────────────────────────── */
@media (max-width: 767px) {
    .farm-stats { grid-template-columns: repeat(2, 1fr) !important; gap: 0.75rem; }
    .farm-crops-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 0.75rem; }
    .farm-process-steps { grid-template-columns: 1fr !important; }
    .farm-highlight-list li { font-size: 0.9rem; }
}

@media (max-width: 480px) {
    .farm-crops-grid { grid-template-columns: 1fr !important; }
}


/* ─── REAL ESTATE PAGE ────────────────────────────────────────────────────── */
@media (max-width: 991px) {
    .re-plot-grid { grid-template-columns: repeat(2, 1fr) !important; }
    .re-features { grid-template-columns: repeat(2, 1fr) !important; }
    .re-how-steps { grid-template-columns: repeat(2, 1fr) !important; }
}

@media (max-width: 767px) {
    .re-plot-grid { grid-template-columns: 1fr !important; }
    .re-features { grid-template-columns: 1fr !important; gap: 0.75rem; }
    .re-how-steps { grid-template-columns: 1fr !important; }
    .re-price-block { padding: 1.25rem 1rem; }
    .re-price-block .price-amount { font-size: 1.5rem; }

    /* Make property tables scrollable */
    .re-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}


/* ─── FOOD HUB PAGE ───────────────────────────────────────────────────────── */
@media (max-width: 991px) {
    .fh-products-grid { grid-template-columns: repeat(3, 1fr) !important; gap: 1rem; }
    .fh-services-grid { grid-template-columns: repeat(2, 1fr) !important; }
}

@media (max-width: 767px) {
    .fh-products-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 0.75rem; }
    .fh-services-grid { grid-template-columns: 1fr !important; }
    .fh-cta-row { flex-direction: column; gap: 0.75rem; }
}

@media (max-width: 480px) {
    .fh-products-grid { grid-template-columns: 1fr !important; }
}


/* ─── GATEWAY FUND PAGE ───────────────────────────────────────────────────── */
@media (max-width: 767px) {
    .gf-steps { grid-template-columns: 1fr !important; }
    .gf-benefits-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 0.75rem; }
    .gf-faqs-layout { grid-template-columns: 1fr !important; }
    .gf-roi-stats { grid-template-columns: repeat(2, 1fr) !important; }
}

@media (max-width: 480px) {
    .gf-benefits-grid { grid-template-columns: 1fr !important; }
    .gf-roi-stats { grid-template-columns: 1fr !important; }
}


/* ─── BLOG PAGE ───────────────────────────────────────────────────────────── */
@media (max-width: 991px) {
    .blog-grid { grid-template-columns: repeat(2, 1fr) !important; }
    .blog-layout { grid-template-columns: 1fr !important; }
    .blog-sidebar { display: none; }
}

@media (max-width: 767px) {
    .blog-grid { grid-template-columns: 1fr !important; }
}


/* ─── CONTACT PAGE ────────────────────────────────────────────────────────── */
@media (max-width: 767px) {
    .contact-layout { grid-template-columns: 1fr !important; }
    .contact-info-items { grid-template-columns: 1fr !important; }
    .ct-map { height: 250px !important; }
}


/* ─── FAQ PAGE ────────────────────────────────────────────────────────────── */
@media (max-width: 767px) {
    .faq-cats { gap: 0.5rem; flex-wrap: wrap; }
    .faq-cat-btn { font-size: 0.8rem; padding: 0.4rem 0.9rem; }
}


/* ─── ACCOUNT PAGE ────────────────────────────────────────────────────────── */
@media (max-width: 767px) {
    .auth-container { padding: 1.25rem; }
    .auth-tabs .nav-link { font-size: 0.88rem; padding: 0.6rem 1rem; }
}


/* ─── FOOTER ──────────────────────────────────────────────────────────────── */
@media (max-width: 991px) {
    .footer-gbi .row > [class*="col-"] { margin-bottom: 2rem; }
    .footer-description { max-width: 100%; }
}

@media (max-width: 767px) {
    .footer-gbi { padding: 2.5rem 0 0; }
    .footer-title { font-size: 1rem; }
    .footer-links li { margin-bottom: 0.5rem; }
    .footer-bottom { padding: 1rem 0; }
    .footer-bottom .row { text-align: center; }
    .footer-bottom .row > div:first-child { margin-bottom: 0.5rem; }
    .footer-social { justify-content: flex-start; }
}


/* ─── GENERAL UTILITY FIXES ────────────────────────────────────────────────── */
/* Prevent horizontal scroll on all mobile */
@media (max-width: 767px) {
    .container, .container-fluid { padding-left: 1rem; padding-right: 1rem; }

    /* Button groups: stack on mobile */
    .d-flex.gap-2:not(.flex-row-mobile):not(.shop-search-bar):not(.cart-summary-line):not(.trust-item) {
        flex-wrap: wrap;
    }

    /* Full-width buttons on mobile */
    .btn-mobile-full { width: 100% !important; }

    /* Show/hide helpers */
    .hide-mobile { display: none !important; }
    .show-mobile { display: block !important; }

    /* Tables: force scrollable */
    .table-responsive-mobile { overflow-x: auto; -webkit-overflow-scrolling: touch; display: block; width: 100%; }
}

/* Fix for images overflow on small screens */
img { max-width: 100%; height: auto; }

/* Fix for any overflowing flex/grid content */
@media (max-width: 575px) {
    .row { margin-left: -0.75rem; margin-right: -0.75rem; }
    .row > * { padding-left: 0.75rem; padding-right: 0.75rem; }
}


/* ─── MOBILE MENU IMPROVEMENTS ────────────────────────────────────────────── */
.mobile-menu .btn-cart-mobile {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 0;
    color: var(--gbi-primary);
    font-weight: 600;
    border-bottom: 1px solid var(--gbi-gray-100);
}

.mobile-menu .mobile-cart-badge {
    background: var(--gbi-secondary);
    color: #fff;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    font-size: 0.72rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Better touch targets on mobile */
@media (max-width: 767px) {
    .filter-pill, .filter-btn, .cat-list a { min-height: 40px; }
    .qty-btn { min-width: 36px; min-height: 36px; }
    .btn { min-height: 44px; }
}

/* Sticky add-to-cart for product detail on mobile */
@media (max-width: 767px) {
    .sticky-add-bar {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        background: var(--gbi-white);
        padding: 0.9rem 1rem;
        box-shadow: 0 -4px 20px rgba(0,0,0,0.12);
        z-index: 1000;
        display: flex;
        gap: 0.75rem;
        align-items: center;
    }

    .sticky-add-bar .sticky-price {
        font-weight: 800;
        color: var(--gbi-secondary);
        font-size: 1.05rem;
        flex-shrink: 0;
    }

    .sticky-add-bar .btn-add-cart { flex: 1; height: 46px; font-size: 0.92rem; }
}