/**
 * Mobile Layout Fixes
 * Zoom IA — zoom-ia theme
 * Rewritten: 2026-04-02 — clean cascade, minimal !important
 *
 * Loaded AFTER style.css — same selectors override naturally.
 * Root cause: generated article content (TrendCuration) contains
 * tables, images, and embeds exceeding viewport width on mobile.
 */

/* ===================== Global overflow guard ===================== */
html, body {
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
}

/* ===================== Mobile < 768px ===================== */
@media (max-width: 768px) {

    body {
        overflow-x: hidden;
        width: 100%;
    }

    /* -- Media: images, videos, embeds -- */
    img, video, iframe, embed, object, svg {
        max-width: 100%;
        height: auto;
    }

    /* -- Tables: scrollable wrapper -- */
    table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        max-width: 100%;
    }

    .wp-block-table {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* -- Code blocks -- */
    pre, code {
        overflow-x: auto;
        word-break: break-word;
        white-space: pre-wrap;
        max-width: 100%;
    }

    /* -- Entry content: aggressive containment -- */
    .entry-content table,
    .entry-content img,
    .entry-content iframe,
    .entry-content pre,
    .entry-content .wp-block-table,
    article table,
    article img,
    article iframe,
    .zoomia-article-content table,
    .zoomia-article-content img,
    .zoomia-article-content iframe {
        max-width: 100%;
        width: 100%;
        height: auto;
        overflow-x: auto;
        display: block;
    }

    /* -- Content containers -- */
    .entry-content,
    .post-content,
    article,
    .zoomia-article-content,
    .single-content {
        overflow-x: hidden;
        word-wrap: break-word;
        overflow-wrap: break-word;
    }

    /* -- Container overflow guard -- */
    .container,
    .site-main,
    .site-content,
    .zoomia-container {
        overflow-x: hidden;
        max-width: 100vw;
    }

    /* -- WordPress blocks -- */
    .wp-block-image img,
    .wp-block-cover img,
    .wp-block-media-text img {
        max-width: 100%;
        height: auto;
    }

    .wp-block-columns {
        flex-wrap: wrap;
    }

    /* -- Grid layouts: single column -- */
    .zoomia-grid,
    .cards-grid,
    .articles-grid {
        grid-template-columns: 1fr;
    }
}