.pa-payment-demo,
.pa-payment-demo * {
    box-sizing: border-box;
}




.pa-payment-demo {

    width: 100%;
    max-width: 100%;

    color: #fff;

    font-family:
        Inter,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

}




.pa-payment-demo-header {

    display: flex;
    align-items: center;

    gap: 9px;

    margin-bottom: 14px;

}


.pa-payment-back {

    width: 28px;
    height: 28px;

    flex: 0 0 28px;

    display: grid;
    place-items: center;

    padding: 0;

    border: 0;

    background: transparent;

    color: #9eacc0;

    font-size: 26px;

    line-height: 1;

    cursor: pointer;

    transition:
        color .2s ease,
        transform .2s ease;

}


.pa-payment-back:hover {

    color: #fff;

    transform: translateX(-2px);

}


.pa-payment-heading h2 {

    margin: 0;

    color: #edf3fa;

    font-size: 16px;

    line-height: 1.2;

    font-weight: 700;

    letter-spacing: -.2px;

}


.pa-payment-heading p {

    margin: 3px 0 0;

    color: #718198;

    font-size: 8px;

    line-height: 1.4;

}




.pa-payment-demo-grid {

    width: 100%;

    display: grid;

    grid-template-columns:
        minmax(0, 1.12fr)
        minmax(310px, .88fr);

    gap: 9px;

}




.pa-demo-form-panel,
.pa-demo-preview-panel {

    min-width: 0;

    border: 1px solid rgba(72,96,128,.28);

    border-radius: 7px;

    background:
        linear-gradient(
            145deg,
            rgba(7,19,32,.98),
            rgba(4,13,24,.99)
        );

}


.pa-demo-form-panel {

    padding: 13px 12px;

}


.pa-demo-preview-panel {

    padding: 16px 14px 12px;

    display: flex;

    flex-direction: column;

}




.pa-demo-block + .pa-demo-block {

    margin-top: 15px;

}


.pa-demo-section-title {

    margin-bottom: 8px;

    color: #cbd5e3;

    font-size: 9px;

    font-weight: 700;

}




.pa-demo-method {

    position: relative;

    min-height: 54px;

    width: 100%;

    display: flex;

    align-items: center;

    gap: 8px;

    padding: 8px;

    border: 1px solid #2678c6;

    border-radius: 6px;

    background:
        linear-gradient(
            120deg,
            rgba(13,39,67,.95),
            rgba(6,18,31,.98)
        );

    cursor: pointer;

}


.pa-demo-method input {

    position: absolute;

    opacity: 0;

    pointer-events: none;

}


.pa-demo-radio {

    width: 14px;
    height: 14px;

    flex: 0 0 14px;

    border: 2px solid #5b9fe2;

    border-radius: 50%;

    position: relative;

}


.pa-demo-radio::after {

    content: "";

    position: absolute;

    width: 6px;
    height: 6px;

    left: 2px;
    top: 2px;

    border-radius: 50%;

    background: #54a8ff;

}


.pa-demo-method-icon {

    width: 31px;
    height: 24px;

    flex: 0 0 31px;

    display: grid;
    place-items: center;

    border: 1px solid #7592b9;

    border-radius: 4px;

    color: #91acd1;

}


.pa-demo-method-icon svg {

    width: 19px;
    height: 19px;

}


.pa-demo-method-info {

    min-width: 0;

    display: flex;

    flex-direction: column;

    gap: 2px;

}


.pa-demo-method-info strong {

    color: #e6edf6;

    font-size: 8px;

    font-weight: 600;

}


.pa-demo-method-info small {

    color: #6e8098;

    font-size: 6.5px;

}


.pa-demo-brands {

    margin-left: auto;

    display: flex;

    align-items: center;

    gap: 4px;

}


.pa-demo-brand {

    font-size: 5px;

    font-weight: 800;

}


.pa-demo-brand.visa {

    color: #72a8ff;

}


.pa-demo-brand.mastercard {

    color: #ff725f;

}


.pa-demo-brand.amex {

    color: #6cc5ff;

}


.pa-demo-brand.discover {

    color: #d8d8d8;

}




.pa-demo-field {

    margin-bottom: 9px;

}


.pa-demo-field label {

    display: block;

    margin-bottom: 4px;

    color: #8998ad;

    font-size: 7px;

    font-weight: 500;

}


.pa-demo-input-wrap {

    width: 100%;
    height: 33px;

    display: flex;

    align-items: center;

    overflow: hidden;

    border: 1px solid #19334d;

    border-radius: 6px;

    background: #071625;

    transition:
        border-color .2s ease,
        box-shadow .2s ease,
        background .2s ease;

}


.pa-demo-input-wrap:focus-within {

    border-color: #328fe7;

    background: #081928;

    box-shadow:
        0 0 0 2px rgba(50,143,231,.08),
        0 0 22px rgba(37,125,224,.07);

}


.pa-demo-input-icon {

    width: 31px;

    flex: 0 0 31px;

    display: grid;
    place-items: center;

    color: #5d7590;

}


.pa-demo-input-icon svg {

    width: 15px;
    height: 15px;

}


.pa-demo-input-wrap input {

    width: 100%;
    min-width: 0;
    height: 100%;

    padding: 0 7px 0 0;

    border: 0 !important;
    outline: 0 !important;

    background: transparent !important;

    color: #e1eaf5 !important;

    font-family: inherit;

    font-size: 8px;

    box-shadow: none !important;

}


.pa-demo-input-wrap input::placeholder {

    color: #50647b;

}


.pa-demo-mini-brand {

    margin-right: 7px;

    padding: 3px 5px;

    border-radius: 3px;

    background: #2055b7;

    color: #fff;

    font-size: 5px;

    font-weight: 800;

    transition: .2s ease;

}


.pa-demo-cvc-info {

    width: 12px;
    height: 12px;

    flex: 0 0 12px;

    margin-right: 7px;

    display: grid;
    place-items: center;

    border: 1px solid #536b85;

    border-radius: 50%;

    color: #8ea1b8;

    font-size: 7px;

}




.pa-demo-fields-row {

    display: grid;

    grid-template-columns:
        1fr
        1fr;

    gap: 8px;

}




.pa-demo-save {

    display: flex;

    align-items: center;

    gap: 6px;

    color: #8191a6;

    font-size: 7px;

    cursor: pointer;

}


.pa-demo-save input {

    position: absolute;

    opacity: 0;

}


.pa-demo-checkbox {

    width: 13px;
    height: 13px;

    flex: 0 0 13px;

    display: grid;
    place-items: center;

    border: 1px solid #526a83;

    border-radius: 3px;

    background: #071522;

}


.pa-demo-save input:checked
+ .pa-demo-checkbox {

    border-color: #3c96eb;

    background: #358fe9;

}


.pa-demo-save input:checked
+ .pa-demo-checkbox::after {

    content: "✓";

    color: #fff;

    font-size: 9px;

    line-height: 1;

}




@keyframes cardFlipToBack {

    0% {

        transform: rotateY(0deg);

    }

    100% {

        transform: rotateY(180deg);

    }

}


@keyframes cardFlipToFront {

    0% {

        transform: rotateY(180deg);

    }

    100% {

        transform: rotateY(0deg);

    }

}




.pa-demo-card-scene {

    width: 100%;

    display: flex;

    justify-content: center;

    padding:
        20px
        0
        18px;

    perspective: 1200px;

}




.pa-demo-card {

    position: relative;

    width: min(100%, 285px);

    aspect-ratio: 1.72;

    transform-style: preserve-3d;

    transition:
        transform 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55);

}




.pa-demo-card.flip-to-back {

    animation: cardFlipToBack 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;

}




.pa-demo-card.flip-to-front {

    animation: cardFlipToFront 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;

}




.pa-demo-card.is-flipped {

    transform: rotateY(180deg);

}


.pa-demo-card-face {

    position: absolute;

    inset: 0;

    overflow: hidden;

    border-radius: 17px;

    backface-visibility: hidden;

    -webkit-backface-visibility: hidden;

}


.pa-demo-card-front {

    background:
        linear-gradient(
            125deg,
            #0789d4 0%,
            #078fd0 44%,
            #292f91 100%
        );

    box-shadow:
        0 25px 45px rgba(0,0,0,.4),
        0 0 35px rgba(0,137,255,.14);

}


.pa-demo-card-back {

    transform: rotateY(180deg);

    background:
        linear-gradient(
            135deg,
            #09233b,
            #101d43
        );

    box-shadow:
        0 25px 45px rgba(0,0,0,.4);

}




.pa-demo-card-glow {

    position: absolute;

    width: 180px;
    height: 180px;

    right: -80px;
    bottom: -75px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(255,255,255,.18),
            transparent 68%
        );

}


.pa-demo-card-pattern {

    position: absolute;

    width: 190px;
    height: 190px;

    right: -50px;
    bottom: -70px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(255,255,255,.19) 1px,
            transparent 1.5px
        );

    background-size: 6px 6px;

    opacity: .65;

}




.pa-demo-chip {

    position: absolute;

    top: 20px;
    left: 20px;

    width: 40px;
    height: 28px;

    overflow: hidden;

    border-radius: 6px;

    background:
        linear-gradient(
            135deg,
            #ffd45c,
            #eda900
        );

}


.pa-demo-chip span {

    position: absolute;

    background: rgba(80,54,0,.3);

}


.pa-demo-chip span:nth-child(1) {

    width: 1px;
    height: 100%;

    left: 50%;
    top: 0;

}


.pa-demo-chip span:nth-child(2) {

    width: 100%;
    height: 1px;

    left: 0;
    top: 50%;

}


.pa-demo-chip span:nth-child(3) {

    width: 1px;
    height: 100%;

    left: 13px;
    top: 0;

}




.pa-demo-contactless {

    position: absolute;

    top: 22px;
    right: 52px;

    width: 15px;
    height: 15px;

    transform: rotate(90deg);

}


.pa-demo-contactless span {

    position: absolute;

    border: 1.2px solid rgba(255,255,255,.72);

    border-left-color: transparent;
    border-bottom-color: transparent;

    border-radius: 50%;

    transform: rotate(45deg);

}


.pa-demo-contactless span:nth-child(1) {

    width: 6px;
    height: 6px;

    top: 5px;
    left: 5px;

}


.pa-demo-contactless span:nth-child(2) {

    width: 10px;
    height: 10px;

    top: 3px;
    left: 3px;

}


.pa-demo-contactless span:nth-child(3) {

    width: 14px;
    height: 14px;

    top: 1px;
    left: 1px;

}




.pa-demo-card-brand {

    position: absolute;

    top: 23px;
    right: 20px;

    color: #fff;

    font-size: 10px;

    font-weight: 900;

    letter-spacing: .8px;

}




.pa-demo-card-number {

    position: absolute;

    left: 20px;
    right: 20px;

    top: 90px;

    color: #fff;

    font-family:
        "Courier New",
        monospace;

    font-size: 14px;

    letter-spacing: .7px;

    white-space: nowrap;

    text-shadow:
        0 1px 1px rgba(0,0,0,.12);

}




.pa-demo-card-valid {

    position: absolute;

    left: 20px;
    bottom: 31px;

    display: flex;

    align-items: center;

    gap: 6px;

}


.pa-demo-card-valid span {

    color: rgba(255,255,255,.68);

    font-size: 4px;

    line-height: 1.1;

}


.pa-demo-card-valid strong {

    color: #fff;

    font-family:
        "Courier New",
        monospace;

    font-size: 9px;

    font-weight: 500;

}




.pa-demo-card-holder {

    position: absolute;

    left: 20px;
    bottom: 14px;

    max-width: 62%;

    overflow: hidden;

    color: #fff;

    font-size: 7px;

    font-weight: 600;

    letter-spacing: .8px;

    text-overflow: ellipsis;

    white-space: nowrap;

}




.pa-demo-card-network {

    position: absolute;

    right: 20px;
    bottom: 14px;

    color: #fff;

    font-size: 8px;

    font-weight: 800;

    letter-spacing: .5px;

}




.pa-demo-magstripe {

    position: absolute;

    top: 28px;
    left: 0;
    right: 0;

    height: 39px;

    background: #05080e;

}


.pa-demo-cvc-strip {

    position: absolute;

    top: 88px;
    left: 22px;
    right: 22px;

    height: 28px;

    display: flex;

    align-items: center;

    justify-content: flex-end;

    padding-right: 9px;

    background: #e8e9ed;

    color: #111;

}


.pa-demo-cvc-strip span {

    position: absolute;

    left: -1px;

    transform: translateY(-20px);

    color: rgba(255,255,255,.55);

    font-size: 5px;

}


.pa-demo-cvc-strip strong {

    font-family:
        "Courier New",
        monospace;

    font-size: 10px;

    letter-spacing: 2px;

}


.pa-demo-back-text {

    position: absolute;

    left: 22px;
    right: 22px;

    top: 133px;

    color: rgba(255,255,255,.42);

    font-size: 6px;

}


.pa-demo-back-logo {

    position: absolute;

    left: 22px;
    bottom: 17px;

    color: rgba(255,255,255,.65);

    font-size: 8px;

    font-weight: 800;

}




.pa-demo-divider {

    width: 100%;
    height: 1px;

    background:
        rgba(75,103,136,.25);

    margin-bottom: 12px;

}




.pa-demo-benefits h3 {

    margin: 0 0 9px;

    color: #d0d9e7;

    font-size: 9px;

    font-weight: 700;

}


.pa-demo-benefits ul {

    display: flex;

    flex-direction: column;

    gap: 6px;

    margin: 0;

    padding: 0;

    list-style: none;

}


.pa-demo-benefits li {

    display: flex;

    align-items: center;

    gap: 6px;

    color: #78889e;

    font-size: 7px;

}


.pa-demo-benefits li span {

    width: 11px;
    height: 11px;

    flex: 0 0 11px;

    display: grid;
    place-items: center;

    border-radius: 50%;

    background: #438fdc;

    color: #fff;

    font-size: 7px;

}




.pa-demo-actions {

    margin-top: auto;

    padding-top: 15px;

}


.pa-demo-submit {

    width: 100%;
    height: 34px;

    display: flex;

    align-items: center;
    justify-content: center;

    gap: 7px;

    border: 0;

    border-radius: 6px;

    background:
        linear-gradient(
            100deg,
            #328fe9,
            #4c9df4
        );

    color: #fff;

    font-family: inherit;

    font-size: 8px;

    font-weight: 700;

    cursor: pointer;

    box-shadow:
        0 8px 25px rgba(39,126,224,.2);

    transition:
        transform .2s ease,
        box-shadow .2s ease;

}


.pa-demo-submit svg {

    width: 13px;
    height: 13px;

}


.pa-demo-submit:hover {

    transform: translateY(-1px);

    box-shadow:
        0 12px 30px rgba(39,126,224,.28);

}


.pa-demo-cancel {

    width: 100%;
    height: 31px;

    margin-top: 6px;

    border: 1px solid #24415e;

    border-radius: 6px;

    background: transparent;

    color: #8495aa;

    font-family: inherit;

    font-size: 8px;

    cursor: pointer;

    transition:
        border-color .2s ease,
        color .2s ease;

}


.pa-demo-cancel:hover {

    border-color: #3b6387;

    color: #d5deea;

}




@media (max-width: 850px) {

    .pa-payment-demo-grid {

        grid-template-columns: 1fr;

    }

    .pa-demo-preview-panel {

        min-height: auto;

    }

}


@media (max-width: 560px) {

    .pa-payment-demo-header {

        margin-bottom: 11px;

    }

    .pa-payment-heading h2 {

        font-size: 15px;

    }

    .pa-payment-heading p {

        font-size: 7px;

    }

    .pa-demo-form-panel,
    .pa-demo-preview-panel {

        padding: 11px;

    }

    .pa-demo-card {

        width: min(100%, 300px);

    }

}


@media (max-width: 390px) {

    .pa-demo-method-info strong {

        font-size: 7px;

    }

    .pa-demo-method-info small {

        font-size: 6px;

    }

    .pa-demo-brands {

        display: none;

    }

    .pa-demo-fields-row {

        grid-template-columns: 1fr;

        gap: 0;

    }

}


.pa-real-payment-form {
    width:100%;
    min-width:0;
}
.pa-real-payment-form #add_payment_method,
.pa-real-payment-form .woocommerce,
.pa-real-payment-form .woocommerce-page,
.pa-real-payment-form .woocommerce-MyAccount-content {
    width:100% !important;
    max-width:100% !important;
    margin:0 !important;
    padding:0 !important;
    float:none !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
}
.pa-real-payment-form form#add_payment_method,
.pa-real-payment-form #add_payment_method form {
    width:100% !important;
}
.pa-real-payment-form .woocommerce-info,
.pa-real-payment-form .woocommerce-message,
.pa-real-payment-form .woocommerce-error {
    font-size:11px !important;
    line-height:1.45 !important;
    margin:0 0 12px !important;
    padding:10px 12px !important;
    border-radius:6px !important;
}
.pa-real-payment-form #payment,
.pa-real-payment-form .woocommerce-Payment,
.pa-real-payment-form .woocommerce-PaymentMethods,
.pa-real-payment-form .payment_methods {
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    padding:0 !important;
    margin:0 !important;
    list-style:none !important;
}

.pa-real-payment-form .payment_box,
.pa-real-payment-form .woocommerce-PaymentBox {
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    border-radius:0 !important;
}
.pa-real-payment-form .form-row,
.pa-real-payment-form .form-row-wide,
.pa-real-payment-form p.form-row {
    margin:0 0 12px !important;
    padding:0 !important;
}
.pa-real-payment-form label {
    display:block !important;
    margin:0 0 5px !important;
    color:#aeb7c3 !important;
    font-size:9px !important;
    font-weight:500 !important;
}
.pa-real-payment-form input[type="text"],
.pa-real-payment-form input[type="tel"],
.pa-real-payment-form input[type="email"],
.pa-real-payment-form input[type="number"],
.pa-real-payment-form select,
.pa-real-payment-form textarea {
    width:100% !important;
    min-height:38px !important;
    border:1px solid #292f37 !important;
    border-radius:10px !important;
    background:#080a0d !important;
    color:#f7f9fc !important;
    padding:8px 10px !important;
    font-size:11px !important;
    box-shadow:none !important;
}
.pa-real-payment-form input:focus,
.pa-real-payment-form select:focus,
.pa-real-payment-form textarea:focus {
    border-color:#8fa8c8 !important;
    outline:none !important;
    box-shadow:0 0 0 1px rgba(143,168,200,.16) !important;
}
.pa-real-payment-form .wc-stripe-upe-element,
.pa-real-payment-form .wc-stripe-upe-form,
.pa-real-payment-form .wc-upe-form {
    width:100% !important;
    min-height:56px !important;
    margin:0 0 12px !important;
}
.pa-real-payment-form .wc-stripe-upe-element iframe,
.pa-real-payment-form .wc-stripe-upe-form iframe {
    max-width:100% !important;
}
.pa-real-payment-form .woocommerce-terms-and-conditions-wrapper {
    margin:10px 0 !important;
    color:#6f7987 !important;
    font-size:9px !important;
}
.pa-real-payment-form .woocommerce-Button,
.pa-real-payment-form button[type="submit"],
.pa-real-payment-form input[type="submit"] {
    width:100% !important;
    min-height:40px !important;
    margin:12px 0 0 !important;
    padding:0 14px !important;
    border:0 !important;
    border-radius:9px !important;
    background:#8fa8c8 !important;
    color:#080a0d !important;
    font-size:11px !important;
    font-weight:700 !important;
    cursor:pointer !important;
}
.pa-real-payment-form .woocommerce-Button:hover,
.pa-real-payment-form button[type="submit"]:hover,
.pa-real-payment-form input[type="submit"]:hover {
    background:#a8bcd3 !important;
}
.pa-real-payment-form .pa-demo-real-heading {
    margin:0 0 9px;
    color:#f1f3f5;
    font-size:9px;
    font-weight:700;
}
.pa-real-payment-form input[type="checkbox"] {
    width:13px !important;
    height:13px !important;
    min-height:0 !important;
    margin:0 6px 0 0 !important;
    accent-color:#8fa8c8 !important;
    background:#080a0d !important;
    border:1px solid #292f37 !important;
    box-shadow:none !important;
    cursor:pointer;
}
.pa-real-payment-form .form-row label:has(input[type="checkbox"]),
.pa-real-payment-form label.checkbox {
    display:flex !important;
    align-items:center !important;
    gap:2px;
    color:#aeb7c3 !important;
    font-size:9px !important;
    font-weight:400 !important;
    cursor:pointer;
}
.pa-real-payment-form .pa-demo-method-live {
    margin-bottom:14px;
}

.pa-real-payment-form .payment_methods > .wc_payment_method > input.input-radio,
.pa-real-payment-form .payment_methods > .wc_payment_method > label {
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    padding:0 !important;
    margin:-1px !important;
    overflow:hidden !important;
    clip:rect(0,0,0,0) !important;
    white-space:nowrap !important;
    border:0 !important;
}
.pa-real-payment-form .pa-demo-actions-real {
    margin-top:12px;
}
.pa-real-payment-form .pa-demo-cancel-real {
    width:100%;
    min-height:36px;
    margin-top:7px;
    border:1px solid #292f37;
    border-radius:9px;
    background:transparent;
    color:#aeb7c3;
    font:500 10px/1 inherit;
    cursor:pointer;
}
.pa-real-payment-form .pa-demo-cancel-real:hover { color:#f7f9fc; border-color:#424b57; }
.pa-real-payment-form .pa-demo-secure-note {
    margin-top:10px;
    color:#687280;
    font-size:8px;
    line-height:1.45;
}
.pa-payment-native-page .pa-demo-preview-panel { min-height:100%; }
@media (max-width:850px){
    .pa-payment-demo-grid{grid-template-columns:1fr !important;}
    .pa-demo-preview-panel{order:-1;}
}



.pa-payment-native-page,
.pa-payment-native-page * {
    box-sizing: border-box;
}


.pa-payment-flatten {
    display: contents !important;
}

.pa-payment-native-page {
    color: #edf3fa !important;
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.pa-payment-native-page .pa-payment-demo-header {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0 0 14px;
    padding: 0;
}

.pa-payment-native-page .pa-payment-heading h2 {
    margin: 0 !important;
    color: #edf3fa !important;
    font-size: 16px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
}

.pa-payment-native-page .pa-payment-heading p {
    margin: 3px 0 0 !important;
    color: #718198 !important;
    font-size: 8px !important;
    line-height: 1.4 !important;
}

.pa-payment-native-page .woocommerce-MyAccount-content,
.pa-payment-native-page #add_payment_method {
    border: 1px solid rgba(72,96,128,.28) !important;
    border-radius: 7px !important;
    background: linear-gradient(145deg, rgba(7,19,32,.98), rgba(4,13,24,.99)) !important;
    padding: 16px !important;
}

.pa-payment-native-page #payment,
.pa-payment-native-page .woocommerce-PaymentMethods,
.pa-payment-native-page .woocommerce-PaymentMethod,
.pa-payment-native-page .payment_methods {
    background: transparent !important;
}

.pa-payment-native-page .wc-stripe-upe-element {
    min-height: 56px !important;
}

.pa-payment-native-page .wc-stripe-upe-element iframe {
    width: 100% !important;
    max-width: 100% !important;
}

.pa-payment-native-page .woocommerce-PaymentBox {
    padding: 14px 0 !important;
}

.pa-payment-native-page .woocommerce-Button,
.pa-payment-native-page button[type="submit"],
.pa-payment-native-page input[type="submit"] {
    border-radius: 6px !important;
}


.pa-payment-native-page {
    display:grid !important;
    grid-template-columns:minmax(0,1.12fr) minmax(310px,.88fr) !important;
    
    grid-template-rows:auto minmax(0,1fr) !important;
    gap:9px !important;
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
}
.pa-payment-native-page #pa-payment-visual-header {
    grid-column:1 / -1 !important;
    grid-row:1 !important;
}
.pa-payment-native-page .pa-real-payment-form,
.pa-payment-native-page .woocommerce-MyAccount-content {
    grid-column:1 !important;
    grid-row:2 !important;
    min-width:0 !important;
    min-height:0 !important;
    border:1px solid rgba(72,96,128,.28) !important;
    border-radius:7px !important;
    background:linear-gradient(145deg,rgba(7,19,32,.98),rgba(4,13,24,.99)) !important;
    padding:13px 12px !important;
    
    overflow-y:auto !important;
    overflow-x:hidden !important;
    scrollbar-width:none !important;
    -ms-overflow-style:none !important;
}
.pa-payment-native-page .pa-real-payment-form::-webkit-scrollbar,
.pa-payment-native-page .woocommerce-MyAccount-content::-webkit-scrollbar {
    display:none !important;
    width:0 !important;
    height:0 !important;
}
.pa-payment-native-page #pa-payment-preview-panel {
    grid-column:2 !important;
    grid-row:2 !important;
    min-width:0 !important;
    height:100% !important;
    min-height:0 !important;
    border:1px solid rgba(72,96,128,.28) !important;
    border-radius:7px !important;
    background:linear-gradient(145deg,rgba(7,19,32,.98),rgba(4,13,24,.99)) !important;
    padding:16px 14px 12px !important;
    display:flex !important;
    flex-direction:column !important;
    
    overflow-y:auto !important;
    overflow-x:hidden !important;
    scrollbar-width:none !important;
    -ms-overflow-style:none !important;
}
.pa-payment-native-page #pa-payment-preview-panel::-webkit-scrollbar {
    display:none !important;
    width:0 !important;
    height:0 !important;
}
.pa-payment-native-page #pa-payment-preview-panel .pa-payment-actions {
    width:100% !important;
    margin-top:auto !important;
    padding-top:14px !important;
    display:flex !important;
    flex-direction:column !important;
    gap:8px !important;
}
.pa-payment-native-page #pa-payment-preview-panel .pa-payment-actions #place_order,
.pa-payment-native-page #pa-payment-preview-panel .pa-payment-actions #pa-payment-real-cancel {
    width:100% !important;
    margin:0 !important;
    box-sizing:border-box !important;
}
.pa-payment-native-page .pa-real-payment-form .pa-demo-block:first-child {
    margin-top:0 !important;
}
.pa-payment-native-page .pa-real-payment-form .pa-demo-real-heading {
    margin:15px 0 8px !important;
}
.pa-payment-native-page .pa-real-payment-form .pa-demo-secure-note {
    margin-top:5px !important;
}
.pa-payment-native-page .pa-real-payment-form .woocommerce-PaymentBox {
    padding-top:10px !important;
}
.pa-payment-native-page .pa-real-payment-form .woocommerce-PaymentBox > p:first-child,
.pa-payment-native-page .pa-real-payment-form .woocommerce-PaymentBox > label:first-child {
    color:#8998ad !important;
    font-size:9px !important;
}
.pa-payment-native-page .pa-real-payment-form .woocommerce-error {
    margin:12px 0 !important;
}
.pa-payment-native-page .pa-demo-preview-panel .pa-demo-card-scene {
    flex:0 0 auto !important;
}
.pa-payment-native-page .pa-demo-preview-panel .pa-demo-card {
    transform-style:preserve-3d !important;
}
.pa-payment-native-page .pa-demo-preview-panel .pa-demo-card.is-flipped {
    transform:rotateY(180deg) !important;
}

@media (max-width:850px){
    
    html, body { overflow-y:auto !important; }
    .pa-payment-native-page {
        display:flex !important;
        flex-direction:column !important;
        gap:9px !important;
        height:auto !important;
        min-height:100% !important;
        overflow:visible !important;
    }
    .pa-payment-native-page #pa-payment-visual-header,
    .pa-payment-native-page .pa-real-payment-form,
    .pa-payment-native-page .woocommerce-MyAccount-content,
    .pa-payment-native-page #pa-payment-preview-panel {
        grid-column:auto !important;
        grid-row:auto !important;
        height:auto !important;
        max-height:none !important;
        overflow:visible !important;
    }
    .pa-payment-native-page #pa-payment-preview-panel { order:-1 !important; }
    .pa-payment-native-page #pa-payment-preview-panel .pa-payment-actions {
        width:100% !important;
        margin-top:12px !important;
        padding-top:12px !important;
    }
}


.pa-payment-native-page #pa-payment-real-heading { display:none !important; }




.pa-payment-native-page .pa-demo-preview-panel .pa-demo-card { cursor: pointer; }


html.pa-cu-payment-frame,
html.pa-cu-payment-frame body,
.pa-payment-native-page {
    height: 630px !important;
    min-height: 630px !important;
    max-height: 630px !important;
}

html.pa-cu-payment-frame,
html.pa-cu-payment-frame body {
    width: 100% !important;
    overflow: hidden !important;
}

.pa-payment-native-page {
    display: grid !important;
    grid-template-columns: minmax(0,1.12fr) minmax(310px,.88fr) !important;
    grid-template-rows: auto minmax(0,1fr) !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

.pa-payment-native-page #pa-payment-visual-header {
    min-height: 42px !important;
    height: auto !important;
}

.pa-payment-native-page .pa-real-payment-form,
.pa-payment-native-page .woocommerce-MyAccount-content,
.pa-payment-native-page #pa-payment-preview-panel {
    min-height: 0 !important;
    height: 100% !important;
    max-height: none !important;
}


.pa-payment-native-page .pa-real-payment-form,
.pa-payment-native-page .woocommerce-MyAccount-content {
    overflow-y: auto !important;
    overflow-x: hidden !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
}
.pa-payment-native-page .pa-real-payment-form::-webkit-scrollbar,
.pa-payment-native-page .woocommerce-MyAccount-content::-webkit-scrollbar {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
}

@media (max-width:850px) {
    html.pa-cu-payment-frame,
    html.pa-cu-payment-frame body,
    .pa-payment-native-page {
        height: 630px !important;
        min-height: 630px !important;
        max-height: 630px !important;
    }
    .pa-payment-native-page {
        display: flex !important;
        flex-direction: column !important;
        overflow: hidden !important;
    }
    .pa-payment-native-page #pa-payment-visual-header {
        flex: 0 0 auto !important;
    }
    .pa-payment-native-page .pa-real-payment-form,
    .pa-payment-native-page .woocommerce-MyAccount-content,
    .pa-payment-native-page #pa-payment-preview-panel {
        flex: 1 1 auto !important;
        width: 100% !important;
        height: auto !important;
        max-height: none !important;
        min-height: 0 !important;
    }
}