/*
 Theme Name:  PIXELROME
 Theme URI:   https://pixelrome.com
 Description: Custom child theme for the PIXELROME website.
 Author:      PIXELROME
 Author URI:  https://pixelrome.com
 Text Domain: pixelrome
 Version:     1.0.0
 Template:    Divi
*/


/*****Add any custom CSS below this line*****/

/* ==========================================================
   PIXELROME CUSTOM CHECKOUT
   ========================================================== */

.woocommerce-checkout .content-area,
.woocommerce-checkout #main{
    padding-top:60px;
    padding-bottom:80px;
}

/* ==========================================================
   LAYOUT
   ========================================================== */

.pr-checkout-layout{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:40px;
    max-width:1400px;
    margin:0 auto;
    align-items:start;
    padding: 50px 0;
    padding-top: 40px;
}

.pr-checkout-left,
.pr-checkout-right{
    width:100%;
}

/* ==========================================================
   CARD
   ========================================================== */

.pr-card{
    background:#fff;
    border-radius:22px;
    padding:36px;
    box-shadow:0 20px 55px rgb(40 61 59 / 4%);
}

/* Sticky order summary */

.pr-checkout-right .pr-card{
    position:sticky;
    top:40px;
}

/* ==========================================================
   REMOVE WOOCOMMERCE FLOATS
   ========================================================== */

#customer_details{
    width:100%;
}

#customer_details .col-1,
#customer_details .col-2{
    float:none;
    width:100%;
}

/* Hide shipping column */

#customer_details .col-2{
    display:none;
}

/* ==========================================================
   HEADINGS
   ========================================================== */

#customer_details h3,
#order_review_heading{

    font-family: Poppins, Helvetica, Arial, Lucida, sans-serif;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.1;
    color: #283d3b;
    margin: 0 0 30px;
}

/* ==========================================================
   FORM ROWS
   ========================================================== */

.woocommerce form .form-row{
    margin-bottom:22px;
}

.woocommerce form .form-row label{

    display:block;
    margin-bottom:8px;

    font-family:Poppins,sans-serif;
    font-size:16px;
    font-weight:400;

    color:#283d3b;
}

/* ==========================================================
   INPUTS
   ========================================================== */

.woocommerce form .input-text,
.woocommerce form select{

    height:56px;

    border:1px solid #ececec;
    border-radius:10px;

    background:#f7f7f7;

    padding:0 18px;

    transition:.25s;
}

.woocommerce form textarea{

    border:1px solid #ececec;
    border-radius:10px;

    background:#f7f7f7;

    padding:16px 18px;

    min-height:140px;
}

.woocommerce form .input-text:focus,
.woocommerce form textarea:focus,
.woocommerce form select:focus{

    border-color:#719d41;

    box-shadow:0 0 0 4px rgba(113,157,65,.12);

    outline:none;
}

/* ==========================================================
   TWO COLUMN NAME
   ========================================================== */

#billing_first_name_field,
#billing_last_name_field{

    width:48%;

}

#billing_first_name_field{

    float:left;

}

#billing_last_name_field{

    float:right;

}

/* ==========================================================
   ORDER TABLE
   ========================================================== */

.shop_table{

    border-collapse:collapse;

    border-radius:10px;

    overflow:hidden;

    margin-bottom:30px;

}

.shop_table th{

    background:#fafafa;

    font-weight:700;

    color:#283d3b;

}

.shop_table td,
.shop_table th{

    padding:16px;

}

.shop_table tr.cart-subtotal th, .shop_table tr.order-total th {
    background-color: transparent;
}

/* ==========================================================
   PAYMENT BOX
   ========================================================== */

#payment{

    background:#f5f2fa;

    border-radius:10px;

    border:none;

    overflow:hidden;

}

#payment ul.payment_methods{

    border:none;

    padding:18px;

}

#payment div.payment_box{

    background:#ece8f6;

    border-radius:8px;

    margin-top:15px;

}

#payment div.payment_box::before{

    display:none;

}

/* ==========================================================
   PRIVACY
   ========================================================== */

.woocommerce-privacy-policy-text{

    margin-top:30px;

    font-size:15px;

    line-height:1.8;

}

/* ==========================================================
   BUTTON
   ========================================================== */

#place_order{

    font-family: Poppins, Helvetica, Arial, Lucida, sans-serif !important;
    background: #719d41 !important;
    color: #fff !important;
    border: none;
    border-radius: 10px;
    padding: 15px 30px;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .6px;
    box-shadow: 0 12px 30px rgba(113, 157, 65, .35);
    transition: .25s;

}

#place_order:hover{

    background:#638a39 !important;

    transform:translateY(-2px);

}

/* ==========================================================
   REQUIRED STAR
   ========================================================== */

.required{

    color:#d63638;

}

/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media(max-width:980px){

    .pr-checkout-layout{

        grid-template-columns:1fr;

        gap:30px;

    }

    .pr-checkout-right .pr-card{

        position:static;

    }

    #billing_first_name_field,
    #billing_last_name_field{

        width:100%;

        float:none;

    }

    .pr-card{

        padding:25px;

    }

    #customer_details h3,
    #order_review_heading{

        font-size:34px;

    }

}