/**
 * Sitewide mobile: prevent horizontal page overflow, enlarge tap targets,
 * stack dense action rows. Loaded after theme CSS on dashboard, marketing, pay, funnel.
 */

html {
    overflow-x: hidden;
    max-width: 100%;
}

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

img,
video,
svg,
iframe,
canvas {
    max-width: 100%;
    height: auto;
}

/* Expand tap area without breaking inline text flow */
a,
button,
[role="button"],
input[type="submit"],
input[type="button"],
input[type="reset"],
label.btn,
.btn,
.pay-cta-btn,
.plf-cta-btn {
    touch-action: manipulation;
    -webkit-tap-highlight-color: rgba(15, 23, 42, 0.08);
}

.dash-inline-link,
a.dash-inline-link {
    position: relative;
    z-index: 0;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.dash-inline-link::after,
a.dash-inline-link::after {
    content: "";
    position: absolute;
    inset: -10px -6px;
    z-index: -1;
}

@media (max-width: 992px) {
    .financial-records-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* ── Dashboard shell ─────────────────────────────────────────────────────── */
.dash-shell,
.dash-main,
.dash-main--embed,
.dash-main--partial {
    max-width: 100%;
    overflow-x: hidden;
}

.dash-main pre,
.dash-main .mono-text,
.dash-main code,
.tx-item p .mono-text {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.chart-card,
.tx-log,
.tx-item,
.pl-open-by-id-form,
.dash-module-history {
    max-width: 100%;
    min-width: 0;
}

/* Wallet label: full on desktop, short on mobile */
@media (max-width: 768px) {
    .dash-topbar-bal-label__full {
        display: none;
    }

    .dash-topbar-bal-label__short {
        display: inline;
    }
}

/* Financial band: avoid edge bleed scroll on narrow phones */
@media (max-width: 900px) {
    .dash-fin-summary {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .dash-main .dash-topbar {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

/* Action button rows (payment link history, escrow, etc.) */
.action-inline form button {
    min-height: 44px !important;
    padding: 10px 14px !important;
    font-size: 14px !important;
    line-height: 1.25 !important;
    cursor: pointer;
    box-sizing: border-box;
}

@media (max-width: 768px) {
    .action-inline {
        display: grid !important;
        grid-template-columns: 1fr;
        gap: 8px !important;
        align-items: stretch !important;
        max-width: 100%;
    }

    .action-inline form {
        width: 100% !important;
        margin: 0 !important;
    }

    .action-inline form button {
        width: 100% !important;
        min-height: 44px !important;
    }

    /* Destructive / long labels span full width */
    .action-inline form:has(button[style*="dc2626"]),
    .action-inline form:has(button[style*="#dc2626"]) {
        grid-column: 1 / -1;
    }
}

.tx-header a,
.topbar-quick-action,
.support-hub-btn {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

.pl-open-by-id-form input[type="number"],
.pl-open-by-id-form input[type="text"] {
    min-height: 44px;
    box-sizing: border-box;
}

.pl-open-by-id-form button,
.pl-open-by-id-form .btn {
    min-height: 44px !important;
    padding: 10px 16px !important;
}

.tx-item > a.btn,
.tx-item a.btn.btn-primary {
    min-height: 44px !important;
    padding: 10px 16px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}

@media (max-width: 640px) {
    .tx-item {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .tx-item > strong {
        align-self: flex-end;
    }
}

.dash-table-scroll,
.escrow-table-wrap,
.cbl-tbl-wrap,
.cpl-tbl-wrap,
.table-scroll {
    max-width: 100%;
    -webkit-overflow-scrolling: touch;
}

/* ── Pay / checkout / landing ──────────────────────────────────────────── */
.pay-funnel-body,
.pay-landing-body,
.auth-standalone-page {
    overflow-x: hidden;
}

.plf-wrap,
.pco-wrap,
.pay-landing-shell {
    max-width: 100%;
    min-width: 0;
    overflow-x: hidden;
}

.plf-cta-btn,
.pay-cta-btn,
a.pay-cta-btn,
a.plf-cta-btn {
    min-height: 48px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
}

@media (max-width: 760px) {
    .plf-cta-btn,
    .pay-cta-btn {
        font-size: 16px !important;
        padding: 14px 18px !important;
    }
}

.pco-wrap input,
.pco-wrap select,
.pco-wrap textarea,
.pco-wrap button[type="submit"],
.pco-btn-pay,
.pco-btn-primary,
.pco-btn-secondary,
.pco-btn-ghost,
.pco-wrap .pay-submit-btn {
    min-height: 48px;
    font-size: 16px;
    box-sizing: border-box;
    max-width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

a.pco-btn-primary,
a.pco-btn-secondary,
a.pco-btn-ghost {
    text-decoration: none;
}

/* Premium / business blocks */
.plf-blk-wrap,
.plf-blk-text,
.plf-blk-img {
    max-width: 100%;
    min-width: 0;
    overflow-wrap: anywhere;
}

/* ── Marketing / public site ───────────────────────────────────────────── */
.mh-body,
.mh-body--public-shell,
.page-shell,
main.container {
    overflow-x: clip;
    max-width: 100%;
}

.mhfx-trustsec__motion-bleed,
[class*="motion-bleed"] {
    max-width: 100%;
    overflow-x: clip;
}

@media (max-width: 980px) {
    .site-header .mega-wrap {
        width: 100% !important;
        max-width: 100% !important;
        left: 0 !important;
        margin-left: 0 !important;
    }
}

/* ── African launch funnel ─────────────────────────────────────────────── */
.al-body,
body.al-lp-body {
    overflow-x: clip;
}

@media (max-width: 900px) {
    .nav-links a:not(.btn) {
        white-space: normal;
    }
}

@media (max-width: 768px) {
    .al-lp-final-btn,
    .btn-primary,
    .btn-ghost,
    .funnel-cta,
    .al-btn {
        min-height: 48px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
    }
}

/* Launch module invite row */
.lm-invite-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: stretch;
    max-width: 100%;
}

.lm-invite-row input[readonly] {
    flex: 1 1 100%;
    min-width: 0 !important;
    max-width: 100%;
    min-height: 44px;
    box-sizing: border-box;
}

.lm-invite-row .btn {
    flex: 1 1 auto;
    min-height: 44px;
}

@media (min-width: 480px) {
    .lm-invite-row input[readonly] {
        flex: 1 1 12rem;
    }
}

/* Store / my-store grids */
@media (max-width: 720px) {
    .mst-pro-stage-row {
        grid-template-columns: 1fr !important;
    }

    .mst-tpl-topbar {
        grid-template-columns: 1fr !important;
    }

    .mst-tpl-products {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

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

/* Forms: prevent iOS zoom + full-width fields on narrow screens */
@media (max-width: 768px) {
    .dash-main input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
    .dash-main select,
    .dash-main textarea,
    .pco-wrap input:not([type="hidden"]),
    .pco-wrap select,
    .pco-wrap textarea {
        font-size: 16px;
        max-width: 100%;
    }
}

/* ═══════════════════════════════════════════════════════════════════════════
   Mobile containment — no page-level horizontal overflow (all dashboard modules)
   ═══════════════════════════════════════════════════════════════════════════ */

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

.dash-shell {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

.dash-main,
.dash-main--embed,
.dash-main--partial,
body:has(.dash-launch-mobile-view) .dash-main {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    box-sizing: border-box;
}

.dash-main,
.dash-main--embed,
.dash-launch-m-container,
.cbl-page,
.cpl-page {
    box-sizing: border-box;
}

.dash-main img,
.dash-main video,
.dash-main iframe,
.dash-main svg,
.dash-main canvas,
.cbl-page img,
.cpl-page img {
    max-width: 100%;
    height: auto;
}

/* Flex/grid children must shrink */
.dash-main .chart-card,
.dash-main .tx-log,
.dash-main .tx-item,
.dash-main .tx-header,
.dash-main .dash-module-history,
.dash-main .dash-launch-module,
.dash-main .dash-launch-module-links,
.dash-main .dash-launch-module-links__row,
.dash-main .dash-launch-module-links__main,
.dash-main .dash-launch-module-links__actions,
.dash-main .pl-open-by-id-form,
.dash-main .support-hub-split,
.dash-main .support-topic-grid,
.cbl-page,
.cpl-page,
.cbl-card,
.cpl-card,
.funnel-row,
.funnel-row__panel,
.funnel-row__actions {
    min-width: 0;
    max-width: 100%;
}

@media (max-width: 768px) {
    /* Topbar: stay inside viewport (no bleed / scroll) */
    .dash-main .dash-topbar,
    .dash-main .dash-topbar.dash-topbar--fin {
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 100%;
        overflow: visible;
        flex-wrap: wrap !important;
        row-gap: 8px;
    }

    .dash-topbar-balance-cluster {
        max-width: calc(100% - 52px);
        min-width: 0;
        flex: 1 1 auto;
    }

    .dash-topbar--fin .topbar-actions {
        flex: 0 0 auto;
        max-width: 100%;
    }

    .dash-topbar--fin .dash-nav-hamburger {
        flex: 0 0 auto;
    }

    /* Chips / badges in history lists */
    .tx-item h4,
    .legend-chip,
    .trust-chip,
    .escrow-chip,
    .wallet-chip {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
        align-items: center;
        white-space: normal;
        word-break: break-word;
        max-width: 100%;
    }

    .tx-header {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .tx-header a {
        width: 100%;
        text-align: center;
    }

    .pl-open-by-id-form {
        flex-direction: column;
        align-items: stretch !important;
    }

    .pl-open-by-id-form input,
    .pl-open-by-id-form button,
    .pl-open-by-id-form label,
    .pl-open-by-id-form span {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* Business / personal editor pages (embedded in launch modules) */
    .cbl-page,
    .cpl-page {
        padding-left: max(10px, env(safe-area-inset-left));
        padding-right: max(10px, env(safe-area-inset-right));
        overflow-x: hidden;
    }

    .cbl-card,
    .cpl-card {
        padding-left: 14px;
        padding-right: 14px;
    }

    .cbl-list-toolbar,
    .cpl-list-toolbar {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .cbl-list-toolbar .cbl-btn-outline,
    .cpl-list-toolbar .cpl-btn-outline {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    .cbl-urlbox__row,
    .cpl-urlbox__row {
        flex-direction: column;
        align-items: stretch;
    }

    .cbl-ucopy,
    .cpl-ucopy {
        width: 100%;
        justify-content: center;
        white-space: normal;
    }

    .cbl-offer-chips,
    .cbl-offer-chip {
        max-width: 100%;
        white-space: normal;
        word-break: break-word;
    }

    .cbl-tbl-wrap,
    .cpl-tbl-wrap,
    .cbl-funnel-stack,
    .cpl-funnel-stack {
        max-width: 100%;
        overflow-x: hidden;
    }

    /* Launch module workspace + iframes */
    .dash-launch-module__host,
    .dash-launch-module__host--framed,
    .dash-launch-module__sales-wrap,
    .dash-launch-module__service-frame,
    .dash-launch-module__sales-frame {
        max-width: 100%;
        overflow: hidden;
    }

    .dash-launch-module__service-frame,
    .dash-launch-module__sales-frame,
    .dash-launch-module__service-frame iframe,
    .dash-launch-module__sales-frame iframe {
        width: 100% !important;
        max-width: 100% !important;
    }

    #dash-upgrade-root,
    #dash-premium-templates-root,
    .upg-shell {
        max-width: 100%;
        overflow-x: hidden;
    }

    .upg-grid,
    .upg-bundle-cards {
        grid-template-columns: 1fr !important;
    }

    /* Premium templates / page flow inside business editor */
    .lpt-section-card,
    .lpt-flow-toolbar,
    .cbl-page-flow-toolbar {
        max-width: 100%;
        overflow-x: hidden;
    }

    .lpt-flow-toolbar,
    .cbl-page-flow-toolbar {
        flex-wrap: wrap;
        gap: 8px;
    }

    /* Bank / financial tables */
    .dash-fin-summary {
        max-width: 100%;
        overflow: hidden;
    }

    .dash-fin-summary__grid {
        max-width: 100%;
    }

    .dash-bank-submissions__item,
    .dash-bank-submissions__item-actions {
        flex-wrap: wrap;
        max-width: 100%;
    }

    /* Live sales toast — keep inside screen */
    .dash-lcv-live-sales {
        left: max(8px, env(safe-area-inset-left)) !important;
        right: max(8px, env(safe-area-inset-right)) !important;
        max-width: calc(100vw - 16px) !important;
        width: auto !important;
    }

    body:has(.dash-launch-mobile-view) .dash-launch-m-header {
        max-width: 100%;
    }

    .dash-launch-m-container {
        max-width: 100%;
        overflow-x: hidden;
        padding-left: max(10px, env(safe-area-inset-left));
        padding-right: max(10px, env(safe-area-inset-right));
    }

    /* Sticky bottom CTA bar */
    .dash-launch-m-cta {
        max-width: 100%;
        box-sizing: border-box;
    }

    /* customize-payment-link hub */
    .customize-payment-link-form .form-grid,
    .pl-tool-tabs,
    .pl-links-pagination {
        max-width: 100%;
        flex-wrap: wrap;
    }

    /* Selling-point bullet rows (✓ input ×) — keep × inside viewport */
    .cbl-bullets,
    .cpl-bullets,
    .cbl-offer-bullets {
        max-width: 100%;
        overflow: hidden;
        padding-right: 0;
    }

    .cbl-bitem,
    .cpl-bitem {
        display: grid !important;
        grid-template-columns: auto minmax(0, 1fr) 32px !important;
        gap: 6px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .cbl-bitem input,
    .cpl-bitem input {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .cbl-bremove,
    .cpl-bremove {
        width: 32px !important;
        min-width: 32px !important;
        max-width: 32px !important;
        height: 32px !important;
        min-height: 32px !important;
        padding: 0 !important;
        margin: 0 !important;
        justify-self: end;
    }
}

@media (max-width: 380px) {
    .funnel-history-actions-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .funnel-history-actions-row .funnel-history-act-link:nth-child(1),
    .funnel-history-actions-row .funnel-history-act-form:nth-of-type(1) {
        order: 0;
    }
}