/* ======================================
   WooCommerce Payment Page
   Match Order Received Page Style
====================================== */

    .woocommerce-order-pay  body.woocommerce-order-received,
    .woocommerce-order-pay  body {
    background: #fff6e4;
}

.woocommerce-order-pay .woocommerce {
    max-width: 1100px;
    margin: 50px auto;
    padding: 0 20px;
    direction: rtl;
    color: #222;
}


/* Order summary */

.woocommerce-order-pay .woocommerce .order_details {
    background: #fff;
    border-radius: 10px;
    padding: 25px;
    margin: 30px 0;
    display: flex;
    justify-content: space-between;
    gap: 20px;
    box-shadow: 0 2px 10px rgba(0,0,0,.05);
    border: 1px solid #eee;
    list-style:none;
    padding: 1rem 1.25rem;
    background: #f5e9d2;
    border-radius: 1rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    /* flex-direction: column; */
    gap: .25rem;
    position: relative;
    margin-bottom: .75rem;
}
.woocommerce-order-pay  .woocommerce-notices-wrapper {
    background: url(/wp-content/uploads/2026/04/logo-black.svg);
    width: 100%;
    height: 4vw;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 10vw;
}

.woocommerce-order-pay .woocommerce .order_details li {
    flex:1;
    text-align:center;
    border:none;
    margin:0;
    padding:10px;

    color:#777;
    font-size:14px;
}


.woocommerce-order-pay .woocommerce .order_details strong {
    display:block;
    margin-top:8px;

    color:#111;
    font-size:18px;
    font-weight:600;
}


/* Message */

 .woocommerce-order-pay .woocommerce > p {
    background:#fff;
    border-radius:10px;
    padding:25px;
    text-align:center;
    border:1px solid #eee;
    box-shadow:0 2px 10px rgba(0,0,0,.04);
    font-size:17px;
    color:#333;
    background: #f5e9d2;
    border-radius: 1rem;
}



/* Payment area */

.w2t-tranzila-form-page {margin-top:30px;background:#fff;border-radius:12px;padding:30px;border:1px solid #eee;box-shadow:
        0 4px 15px rgba(0,0,0,.05);display:flex;gap:30px;align-items:flex-start;background: #f5e9d2;border-radius: 1rem;}



/* Hide empty form area */
#w2t_tranzila_payment_form {
    width:200px;
}


/* iframe */

#tranzila_iframe {

    width:100%;
    flex:1;

    border:1px solid #e5e5e5 !important;
    border-radius:8px;

    background:#fff;

    min-height:600px;
}



/* Cancel button */

.w2t-tranzila-form-page .button.cancel {

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

    height:45px;

    background:#fff;

    border:1px solid #ddd;
    border-radius:6px;

    color:#555;

    text-decoration:none;

    font-size:14px;

    transition:.2s;
}


.w2t-tranzila-form-page .button.cancel:hover {

    background:#f5f5f5;
}



/* Mobile */

@media(max-width:768px){

  .woocommerce-order-pay   .woocommerce{
        margin:25px auto;
        padding:0 15px;
    }


  .woocommerce-order-pay   .woocommerce .order_details{
        flex-direction:column;
    }


    .w2t-tranzila-form-page{

        padding:15px;

        flex-direction:column-reverse;
    }


    #w2t_tranzila_payment_form{
        width:100%;
    }


    #tranzila_iframe{
        min-height:550px;
    }
    .woocommerce-order-pay .woocommerce-notices-wrapper {
    background-size: 20vw;
    height: 8vw;
}

.woocommerce-order-pay .woocommerce .order_details li {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3.5vw;
}

.woocommerce-order-pay .woocommerce .order_details strong {
    margin: 0;
    padding-right: 2%;
    font-size: 3.5vw;
}

.woocommerce-order-pay .woocommerce > p {
    font-size: 3.5vw;
}
}