/* Payment modal spacing and official payment-brand presentation. */
#buyform .modal-body {
    padding-top: 22px;
}

#buyform .modal-split {
    gap: 26px;
    align-items: flex-start;
}

#buyform .modal-left {
    justify-content: flex-start;
    gap: 16px;
}

#buyform .modal-left > .input-block,
#buyform .modal-left > #perioded,
#buyform .modal-left > #amounted,
#buyform .modal-left > #perioded > .input-block,
#buyform .modal-left > #amounted > .input-block {
    margin: 0;
}

#buyform .modal-left > #perioded,
#buyform .modal-left > #amounted {
    width: 100%;
}

#buyform .product-details:not([hidden]) {
    margin: 0 0 2px;
}

#buyform .modal-right {
    padding-left: 26px;
}

#buyform .payment-label {
    margin-bottom: 12px;
}

#buyform .platega-capabilities {
    gap: 9px;
    margin-top: 12px;
}

#buyform .platega-capability {
    grid-template-columns: 112px minmax(0, 1fr);
    gap: 12px;
    min-height: 58px;
    padding: 10px 11px;
}

#buyform .platega-capability.crypto-capability {
    background: rgba(255, 255, 255, 0.045);
}

#buyform .payment-brand-stack {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 9px;
    min-width: 0;
}

#buyform .method-card .payment-brand-stack img,
#buyform .method-card .payment-brand-stack img + img {
    display: block !important;
    flex: 0 0 auto;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    border-radius: 0 !important;
    object-fit: contain;
    background: transparent !important;
    box-shadow: none !important;
    filter: none;
}

#buyform .payment-logo--sbp {
    width: 62px !important;
    height: 31px !important;
}

#buyform .payment-logo--mir {
    width: 58px !important;
    height: 24px !important;
}

#buyform .payment-logo--coin {
    width: 29px;
    height: 29px;
}

#buyform .capability-copy strong {
    font-size: 11px;
}

#buyform .capability-copy small {
    font-size: 9px;
}

@media (max-width: 768px) {
    #buyform .modal-body {
        padding-top: 18px;
    }

    #buyform .modal-split {
        gap: 10px;
    }

    #buyform .modal-left {
        gap: 14px;
    }

    #buyform .modal-right {
        margin-top: 0;
        padding-top: 15px;
        padding-left: 0;
    }

    #buyform .payment-label {
        margin-bottom: 10px;
    }
}

@media (max-width: 480px) {
    #buyform .modal-left {
        gap: 13px;
    }

    #buyform .platega-card {
        padding: 13px;
    }

    #buyform .platega-capability {
        grid-template-columns: 100px minmax(0, 1fr);
        gap: 9px;
        min-height: 54px;
        padding: 9px;
    }

    #buyform .payment-brand-stack {
        gap: 7px;
    }

    #buyform .payment-logo--sbp {
        width: 56px !important;
        height: 28px !important;
    }

    #buyform .payment-logo--mir {
        width: 52px !important;
        height: 21px !important;
    }

    #buyform .payment-logo--coin {
        width: 27px;
        height: 27px;
    }
}

/* Final overrides: no tiles, borders or shadows around payment logos. */
#buyform .payment-brand-stack,
#buyform .payment-brand-stack--bank,
#buyform .payment-brand-stack--crypto {
    padding: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

#buyform .payment-logo {
    border: none !important;
    outline: none !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
}

/* Payment card overflow fix — keep the provider content inside the purchase modal. */
.modal[data-id="paymodal"] > .wrapper {
    max-width: 780px;
}

#buyform,
#buyform .modal-body,
#buyform .modal-split,
#buyform .modal-left,
#buyform .modal-right,
#buyform .payment-selection,
#buyform .payment-methods,
#buyform .payment-method,
#buyform .method-card,
#buyform .platega-capabilities,
#buyform .platega-capability,
#buyform .capability-copy {
    min-width: 0;
    max-width: 100%;
}

#buyform .method-card,
#buyform .platega-capability {
    width: 100%;
}

#buyform .method-card {
    overflow: hidden;
}

#buyform .platega-capability {
    grid-template-columns: minmax(0, 112px) minmax(0, 1fr);
}

#buyform .payment-brand-stack {
    width: 100%;
    max-width: 100%;
}

#buyform .payment-brand-stack--bank {
    display: grid;
    grid-template-columns: minmax(0, 1.06fr) minmax(0, 1fr);
    gap: 6px;
    width: 100%;
    max-width: 112px;
}

#buyform .payment-brand-stack--bank .payment-logo--sbp,
#buyform .payment-brand-stack--bank .payment-logo--mir {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    justify-self: center;
}

#buyform .payment-brand-stack--crypto {
    max-width: 72px;
}

#buyform .capability-copy strong,
#buyform .capability-copy small {
    overflow-wrap: anywhere;
}

@media (max-width: 768px) {
    .modal[data-id="paymodal"] > .wrapper {
        max-width: 100%;
    }
}

@media (max-width: 480px) {
    #buyform .platega-capability {
        grid-template-columns: minmax(0, 100px) minmax(0, 1fr);
    }

    #buyform .payment-brand-stack--bank {
        max-width: 100px;
        gap: 5px;
    }
}

@media (max-width: 360px) {
    #buyform .platega-capability {
        grid-template-columns: minmax(0, 1fr);
    }

    #buyform .payment-brand-stack--bank {
        max-width: 112px;
    }
}
