﻿body {
}
/* ---- Generic mobile polish ---- */
@media (max-width: 768px) {
    html, body {
        -webkit-text-size-adjust: 100%;
    }

    body {
        line-height: 1.45;
    }

    .container {
        padding-left: 12px;
        padding-right: 12px;
    }

    .card {
        border-radius: 14px;
    }

    .card-body {
        padding: 16px;
    }

    .h1, .h2, .h3, .h4, .h5 {
        margin-bottom: .75rem;
    }

    .btn {
        padding: 12px 16px;
        font-size: 16px;
    }
    /* ~44px tap target */
    label {
        margin-bottom: 6px;
    }

    input[type="text"], input[type="email"], input[type="tel"],
    select, textarea {
        font-size: 16px;
    }
    /* avoid iOS zoom */
}

/* ---- Checkout specifics ---- */
#payment-element {
    width: 100%;
}

@media (max-width: 768px) {
    #payment-element iframe {
        min-height: 280px;
    }
    /* breathing room for Stripe */
    .alert, .validation-summary-errors {
        margin-top: 8px;
    }

    .list-unstyled > li {
        padding: .5rem 0;
    }
}

/* ---- Downloads list on Thanks ---- */
#downloads-list a {
    word-break: break-word;
}

/* ---- Utility tweaks ---- */
.text-small {
    font-size: 13px;
}

.text-muted {
    color: #6c757d;
}

/* Sticky Pay bar (mobile only) */
@media (max-width: 768px) {
    #payActions.sticky-pay {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 1040;
        background: #fff;
        border-top: 1px solid #e5e5e5;
        padding: 12px env(safe-area-inset-right) calc(12px + env(safe-area-inset-bottom)) env(safe-area-inset-left);
        box-shadow: 0 -6px 18px rgba(0,0,0,.06);
    }

    .sticky-spacer {
        height: 72px;
    }
    /* keep content above the bar */
}

/* Sticky header on small screens */
@media (max-width: 768px) {
    #siteHeader {
        position: sticky;
        top: env(safe-area-inset-top);
        z-index: 1050;
        background: #fff;
        border-bottom: 1px solid #e5e5e5;
    }
    /* prevent content from tucking under the header if your layout needs it */
    #mainWrapper {
        padding-top: 8px;
    }
}


