/* =====================================
   BMM HEALTH BOOKING SYSTEM
   MAIN CONTAINER
===================================== */

.medbook-container {

    background: #ecf7eb !important;

    padding: 40px !important;

    border-radius: 24px !important;

    max-width: 700px !important;

    width: 100% !important;

    margin: 40px auto !important;

    border: 1px solid #dce6dc !important;

    box-sizing: border-box !important;

    overflow:hidden !important;

}



/* TITLE */

.medbook-container h2 {

    color:#092216 !important;

    text-align:center !important;

    font-size:32px !important;

    margin-bottom:30px !important;

    font-weight:700;

}



/* STEP SECTIONS */

.medbook-step {

    background:#ffffff !important;

    padding:25px !important;

    margin-bottom:25px !important;

    border-radius:18px !important;

    border:1px solid #dce6dc !important;

    box-sizing:border-box !important;

}



/* STEP HEADINGS */

.medbook-step h3 {

    color:#092216 !important;

    margin-bottom:20px !important;

    font-size:22px !important;

}



/* LABELS */

.medbook-container label {

    color:#435449 !important;

    font-weight:600;

    display:block;

    margin-bottom:8px;

}



/* INPUTS */

.medbook-container input,
.medbook-container select,
.medbook-container textarea {


    width:100% !important;

    max-width:100% !important;

    padding:14px !important;

    margin-bottom:15px !important;

    border-radius:10px !important;

    border:1px solid #dce6dc !important;

    background:#ffffff !important;

    color:#092216 !important;

    font-size:15px !important;

    box-sizing:border-box !important;


}



/* INPUT FOCUS */

.medbook-container input:focus,
.medbook-container select:focus,
.medbook-container textarea:focus {


    outline:none !important;

    border-color:#71916d !important;


}



/* =====================================
   IPHONE DATE INPUT FIX
===================================== */


.medbook-container input[type="date"] {


    width:100% !important;

    height:52px !important;

    min-height:52px !important;

    padding:0 14px !important;

    display:block !important;

    font-size:16px !important;

    line-height:52px !important;

    border-radius:10px !important;

    box-sizing:border-box !important;

    -webkit-appearance:none !important;

    appearance:none !important;


}



/* Safari date text */

.medbook-container input[type="date"]::-webkit-date-and-time-value {


    text-align:left !important;

    width:100% !important;

    line-height:normal !important;


}



/* Calendar icon */

.medbook-container input[type="date"]::-webkit-calendar-picker-indicator {


    margin-right:5px;


}



/* TEXTAREA */

.medbook-container textarea {


    min-height:120px !important;

    resize:vertical;


}



/* MEDICAL AID BOX */

#medical_aid_fields {


    background:#ecf7eb !important;

    padding:20px !important;

    border-radius:15px !important;

    margin-top:15px;


}



/* BUTTON */

.medbook-container button {


    width:100% !important;

    background:#71916d !important;

    color:#ffffff !important;

    border:none !important;

    padding:16px !important;

    border-radius:12px !important;

    font-size:18px !important;

    font-weight:600;

    cursor:pointer;

    transition:0.3s ease;


}



/* BUTTON HOVER */

.medbook-container button:hover {


    background:#f8c800 !important;

    color:#092216 !important;


}



/* SUCCESS MESSAGE */

#medbook-message {


    margin-top:20px;

    color:#092216;

    font-weight:600;


}



/* =====================================
   MOBILE
===================================== */


@media(max-width:600px){



    .medbook-container {


        padding:20px !important;

        margin:20px auto !important;

        width:100% !important;


    }



    .medbook-container h2 {


        font-size:24px !important;


    }



    .medbook-step {


        padding:18px !important;

        width:100% !important;


    }



    .medbook-container input,
    .medbook-container select,
    .medbook-container textarea {


        font-size:16px !important;

        width:100% !important;


    }



    .medbook-container input[type="date"] {


        height:55px !important;

        min-height:55px !important;

        font-size:16px !important;


    }



}



/* =====================================
   PREVENT MOBILE OVERFLOW
===================================== */


html,
body {


    max-width:100% !important;

    overflow-x:hidden !important;


}


* {


    box-sizing:border-box !important;


}