/* Product-only purchase controls: the desktop purchase area remains the source of truth. */
.mobile-purchase,
.mobile-purchase[hidden] {
    display: none;
}

@media (max-width: 700px) {
    .mobile-purchase:not([hidden]) {
        position: fixed;
        inset: auto 0 0;
        z-index: 910;
        display: grid;
        gap: 8px;
        padding: 10px max(14px, env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));
        border-top: 1px solid #dce7ec;
        background: #fff;
        box-shadow: 0 -4px 22px #09263d14;
    }

    .mobile-purchase-summary {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 3px 10px;
        min-width: 0;
    }

    .mobile-purchase-price {
        display: flex;
        align-items: baseline;
        flex-wrap: wrap;
        gap: 5px;
    }

    .mobile-purchase-price strong {
        color: #09263d;
        font-size: 18px;
        font-weight: 800;
        line-height: 1.25;
    }

    .mobile-purchase-price small {
        color: #657784;
        font-size: 9px;
    }

    .mobile-purchase-stock {
        color: #137565;
        font-size: 10px;
        font-weight: 700;
    }

    .mobile-purchase-stock.is-out {
        color: #ac3b44;
    }

    .mobile-purchase-variant {
        grid-column: 1 / -1;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: #657784;
        font-size: 10px;
        line-height: 1.4;
    }

    .mobile-purchase-actions {
        display: grid;
        grid-template-columns: 116px minmax(0, 1fr);
        gap: 10px;
    }

    .mobile-purchase-quantity {
        display: grid;
        grid-template-columns: 40px minmax(0, 1fr) 40px;
        align-items: center;
        border: 1px solid #dce7ec;
        border-radius: 10px;
        overflow: hidden;
        color: #09263d;
    }

    .mobile-purchase-quantity button {
        min-height: 44px;
        padding: 0;
        border: 0;
        background: #f5f8fa;
        color: #09263d;
        font: inherit;
        font-size: 20px;
        cursor: pointer;
        touch-action: manipulation;
    }

    .mobile-purchase-quantity output {
        text-align: center;
        font-size: 13px;
        font-weight: 800;
    }

    .mobile-purchase-actions > .btn {
        min-height: 46px;
        margin: 0;
        padding: 10px;
        border-radius: 10px;
        font-size: 13px;
        touch-action: manipulation;
    }

    .mobile-purchase button:disabled {
        opacity: .45;
        cursor: default;
    }

    .mobile-purchase button:focus-visible {
        outline: 3px solid #127fbd;
        outline-offset: -3px;
    }

    body.mobile-purchase-visible {
        padding-bottom: var(--mobile-purchase-height, 116px);
    }

    body.store-enterprise.mobile-purchase-visible .store-floating-actions {
        bottom: calc(var(--mobile-purchase-height, 116px) + 12px);
    }

    body.mobile-purchase-visible .compare-dock.open {
        bottom: calc(var(--mobile-purchase-height, 116px) + 12px);
    }

    body.store-enterprise.mobile-purchase-visible .toast {
        bottom: calc(var(--mobile-purchase-height, 116px) + 12px);
    }

    body.store-enterprise.mobile-purchase-visible.mobile-purchase-compare-open .store-floating-actions {
        bottom: calc(var(--mobile-purchase-height, 116px) + 76px);
    }

    body.store-enterprise.mobile-purchase-visible.mobile-purchase-compare-open .toast {
        bottom: calc(var(--mobile-purchase-height, 116px) + 76px);
    }
}