/**
 * Global mobile polish — all storefront pages, header, footer, modules
 */
:root {
    --ymm-bar-h: 62px;
    --yon-mobile-nav-h: var(--ymm-bar-h);
}

html, body {
    max-width: 100%;
    overflow-x: clip;
}
img, video, canvas, svg {
    max-width: 100%;
    height: auto;
}

/* Shell overflow guards */
.yon-content,
.yon-page-shell,
.mp-shell,
.cm-shell,
.yst-shell,
.gm-shell,
.gw-shell,
.cat-shell,
.pd-shell,
.yls,
.ychat-shell,
.ysc,
.yca-shell,
.yss-shell,
.ygw-shell,
.mp-create-shell,
.ypa-shell,
.yon-st,
.sp-shell {
    overflow-x: clip;
    max-width: 100vw;
}

/* ── Mobile layout (<768px) ── */
@media (max-width: 767px) {
    /* Content clearance for bottom bar */
    .yon-content,
    .yon-page-shell,
    main.yon-content {
        padding-bottom: calc(var(--ymm-bar-h) + env(safe-area-inset-bottom, 0px) + 16px) !important;
    }
    .yls.has-sticky-buy {
        padding-bottom: calc(88px + var(--ymm-bar-h) + env(safe-area-inset-bottom, 0px)) !important;
    }
    .yls-sticky-buy {
        bottom: calc(var(--ymm-bar-h) + env(safe-area-inset-bottom, 0px));
    }

    /* Header — yon-header.css mobile grid kullanılır; burada override yok */
    .yon-search-mega__input { font-size: 14px; }

    /* Footer */
    .ysf__inner { padding-inline: 14px; }
    .ysf__grid { grid-template-columns: 1fr !important; gap: 24px; }
    .ysf__trust-row { grid-template-columns: 1fr !important; gap: 10px; }
    .ysf__trust-item { padding: 12px; }
    .ysf__cta-row { flex-direction: column; text-align: center; gap: 14px; }
    .ysf__cta-btn { width: 100%; justify-content: center; }
    .ysf__bottom { flex-direction: column; gap: 12px; text-align: center; }
    .ysf__payments { justify-content: center; flex-wrap: wrap; }

    /* Account */
    .yon-account-layout,
    .yon-account-grid,
    .yon-account-shell {
        display: flex !important;
        flex-direction: column !important;
    }
    .yon-account-sidebar {
        width: 100% !important;
        max-width: 100% !important;
        position: static !important;
        margin-bottom: 12px;
    }
    .yon-account-main { min-width: 0; width: 100%; }

    /* Marketplace */
    .mp-wrap,
    .mp-layout {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px;
    }
    .mp-side,
    .mp-sidebar {
        position: static !important;
        width: 100% !important;
        max-width: 100% !important;
        top: auto !important;
    }
    .mp-grid,
    .mp-listings-grid {
        grid-template-columns: repeat(auto-fill, minmax(min(100%, 160px), 1fr)) !important;
        gap: 10px !important;
    }
    .mp-cat-rail-wrap--sticky { position: static !important; }
    .mp-hero--pro { padding: 20px 14px; }
    .mp-hero--pro h1 { font-size: 1.35rem; word-break: break-word; }

    /* Listing show */
    .yls-grid,
    .yls-layout {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }
    .yls-gallery { min-width: 0; }
    .yls-panel { min-width: 0; }

    /* Community / stores / giveaways / game money */
    .cm-wrap, .yst-wrap, .gw-wrap, .gm-wrap, .yca-wrap, .yss-wrap, .ysc-wrap {
        padding-left: 12px !important;
        padding-right: 12px !important;
        width: 100%;
        box-sizing: border-box;
    }
    .cm-grid, .yst-grid, .gw-grid, .gm-grid, .cm-topics, .yst-cards {
        grid-template-columns: 1fr !important;
    }
    .cm-hero, .yst-hero, .gw-hero, .gm-hero { padding: 28px 0 24px; }
    .cm-hero h1, .yst-hero h1, .gw-hero__title, .gm-hero__brand {
        word-break: break-word;
        font-size: clamp(1.4rem, 5vw, 2rem);
    }
    .gw-toolbar {
        position: static !important;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }
    .gw-hero__stats { flex-wrap: wrap; width: 100%; }
    .gw-hero__stats li { flex: 1 1 calc(50% - 6px); min-width: 0; }

    /* Chat */
    .ychat-shell { min-height: calc(100dvh - var(--ymm-bar-h) - 80px); }
    .ychat-layout { grid-template-columns: 1fr !important; }
    .ychat-sidebar { max-height: 40vh; border-right: 0; border-bottom: 1px solid var(--yc-border); }
    .ychat-main { min-height: 50vh; }

    /* Product / category */
    .pd-grid, .cat-grid, .pd-layout {
        grid-template-columns: 1fr !important;
    }
    .pd-buy, .pd-sidebar { position: static !important; }

    /* Forms */
    .yon-gc__form, .yon-gc__grid2, .ysc-form, .ysupport-form,
    .mp-create-shell form, .yca-form {
        width: 100% !important;
    }
    .yon-gc input, .yon-gc textarea, .yon-gc select,
    .ysc-field input, .ysc-field textarea,
    .yca-shell input, .yca-shell textarea, .yca-shell select {
        max-width: 100% !important;
        box-sizing: border-box;
    }

    /* Tables scroll */
    table, .yon-table, .yon-table-wrap, .adm-table-wrap {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* Modals / overlays */
    .yon-cart-modal__panel,
    .yon-cart-modal { padding: 10px; }
    .yon-cart-modal__panel { max-height: calc(100dvh - 20px); }
    .yon-btt {
        bottom: calc(var(--ymm-bar-h) + env(safe-area-inset-bottom, 0px) + 12px) !important;
    }

    /* Horizontal rails */
    .gw-spot__rail, .yon-h-giveaways__rail, .yst-rail, .cm-rail,
    .yon-section__tabs, .yon-vitrin, .mp-cat-rail {
        margin-inline: -4px;
        padding-inline: 4px;
        scrollbar-width: thin;
        -webkit-overflow-scrolling: touch;
    }

    /* Seller profile */
    .sp-hero, .sp-layout { flex-direction: column !important; }
    .sp-sidebar { width: 100% !important; position: static !important; }
    .sp-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 140px), 1fr)) !important; }

    /* Streamers */
    .yon-st-hero { padding: 32px 0 36px; }
    .yon-st-hero h1 { max-width: none; font-size: clamp(1.5rem, 5vw, 2rem); }
    .yon-st-grid { grid-template-columns: 1fr !important; }

    /* Search page */
    .yon-search-page__layout { flex-direction: column !important; }
    .yon-search-filters { width: 100% !important; position: static !important; }

    /* Cart / checkout */
    .yon-cart-layout, .yon-checkout-layout {
        grid-template-columns: 1fr !important;
    }
    .yon-cart-summary, .yon-checkout-summary {
        position: static !important;
        order: -1;
    }

    /* Touch targets */
    .gw-btn, .cm-btn, .yst-btn, .gm-btn, .pd-btn, .mp-btn,
    .yon-btn, button, .btn {
        min-height: 42px;
    }
    a, button, [role="button"], input, select, textarea {
        touch-action: manipulation;
    }
}

/* ── Small phones (<480px) ── */
@media (max-width: 480px) {
    input, select, textarea { font-size: 16px !important; }

    .gw-card__actions,
    .yon-search-listings,
    .ysp-wrap--list-compact .yon-search-listings {
        grid-template-columns: 1fr 1fr !important;
    }
    .gw-tab em { display: none; }
    .ysp-wrap .ysp-modes { gap: 3px; }
    .ysp-wrap .ysp-mode { padding: 6px 4px; font-size: 10px; }
    .ymm__grid { grid-template-columns: 1fr; }
    .ymm__quick { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .mp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .yon-site-stories { padding-inline: 10px; }
    .yon-logo { max-width: min(260px, 64vw) !important; }
}

/* Hide legacy bottom nav if present */
.yon-mobile-nav:not(.ymm-bar) { display: none !important; }

@media (min-width: 768px) {
    .ymm-bar { display: none !important; }
    .yon-content,
    .yon-page-shell {
        padding-bottom: 0 !important;
    }
}

html {
    transition: background-color .15s ease, color .15s ease;
}