/**
 * Global Responsive Fixes
 * Added to ensure no horizontal overflow and consistent touch-friendly targets
 */

/* Prevent horizontal overflow globally */
html, body {
    overflow-x: hidden;
    max-width: 100vw;
}

/* Ensure images and videos scale appropriately */
img, video, iframe, object, embed {
    max-width: 100%;
    height: auto;
}

/* Base structural fixes */
.container, .container-fluid {
    width: 100%;
    padding-right: var(--bs-gutter-x, .75rem);
    padding-left: var(--bs-gutter-x, .75rem);
    margin-right: auto;
    margin-left: auto;
}

/* Adjust row negative margins to prevent overflow */
.row {
    margin-right: calc(var(--bs-gutter-x, .75rem) * -1);
    margin-left: calc(var(--bs-gutter-x, .75rem) * -1);
}

/* Touch-friendly interactive elements */
@media (max-width: 768px) {
    .btn, a.nav-link, button {
        min-height: 44px; /* Apple's recommended minimum touch target size */
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    /* Adjust typography for readability on small screens */
    h1, .h1 { font-size: 2rem; }
    h2, .h2 { font-size: 1.75rem; }
    h3, .h3 { font-size: 1.5rem; }
    h4, .h4 { font-size: 1.25rem; }
    h5, .h5 { font-size: 1.1rem; }
    h6, .h6 { font-size: 1rem; }
    
    body {
        font-size: 16px; /* Prevents auto-zoom on iOS when tapping inputs */
    }

    /* Forms */
    input, select, textarea {
        font-size: 16px !important;
    }
}

/* Product cards and grid tweaks for very small devices */
@media (max-width: 425px) {
    .product-card {
        margin-bottom: 1rem;
    }
    .product-card .card-body {
        padding: 0.75rem;
    }
}