/*Checkout Layout*/
.wm-e-checkout-fileds {
    margin: 25px 0 50px;
}

.wm-e-form-half {
    display: grid;
    grid-template-columns: repeat(2, 48%);
    justify-content: space-between;
}

.wm-e-input-container {
    margin-bottom: 20px;
}

/*Checkout-Fonts*/
.wm-e-checkout-subheading {
    margin: 25px 0 15px;
}

/*Checkout Navigation*/
.wm-e-editbutton.wm-e-checkoutbar>* {
    width: 100%;
    display: block;
}

.wm-e-navigation-container {
    display: flex;
    justify-content: space-between;
}

.wm-e-flex-text {
    display: flex;
    gap: 5px;
}

/*Checkout Bar*/
h3.wm-e-checkout-bar-heading {
    margin-bottom: 10px;
}

.wm-e-checkout-bardata-inner {
    display: grid;
    grid-template-columns: repeat(2, 30%);
    gap: 2%;
}

.wm-e-checkout-bar-completed:not(.wm-e-hide) {
    display: grid;
    grid-template-columns: 70% 28%;
    justify-content: space-between;
    padding-bottom: 25px;
    margin-bottom: 25px;
    border-bottom: 1px solid;
}

.wm-e-checkout-bar-open:not(.wm-e-hide) {
    padding-top: 25px;
    margin-top: 25px;
    border-top: 1px solid;
}

/*Validation*/
.woocommerce-page form .wm-e-payment-fields .form-row label {
    display: inline;
}

span.woocommerce-gzd-legal-checkbox-text.wm-e-notvalid {
    color: var(--red);
}

/*Single Page*/
.wm-e-checkout-column {
    display: grid;
    grid-template-columns: repeat(2, 48%);
    justify-content: space-between;
}

@media only screen and (max-width: 1200px){
    .wm-e-checkout-bardata-inner {
        grid-template-columns: repeat(2, 48%);
        gap: 0;
        justify-content: space-between;
    }
}

@media only screen and (max-width: 980px){
    .wm-e-checkout-bar-completed:not(.wm-e-hide) {
        grid-template-columns: 57% 40%;
    }

    .wm-e-checkout-bardata-inner {
        grid-template-columns: 100%;
        gap: 20px;
    }
}

/*Phone*/
@media only screen and (max-width: 768px){
    .wm-e-navigation-container {
       flex-direction: column;
       gap: 15px;
    }

    .wm-e-checkout-bar-completed:not(.wm-e-hide) {
        grid-template-columns: 100%;
        gap: 50px;
    }

    .wm-e-checkout-bardata-inner {
        grid-template-columns: 57% 40%;
        gap: 0px;
    }
}   

/*Phone*/
@media only screen and (max-width: 480px){   
    .wm-e-form-half {
        display: block;
    }

    .wm-e-checkout-bardata-inner {
        grid-template-columns: 100%;
        gap: 20px;
    }    
}