@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300..700&display=swap');

body, * {
    font-family: "Quicksand", sans-serif;
    font-size: 16px;
    line-height: 1.4;
    color: #000;
    font-weight: 400;
}

header {display: flex; justify-content: space-between; color: #fff; background-color: #000; padding: 12px 15px; align-items: center;}
header button.fa {background: transparent; border: 0px; color: #fff; font-size: 22px; padding: 0px;}
header h4 {color: #fff; font-size: 18px; margin-bottom: 0px;}
.userlogged {color: #fff;font-weight: 600;font-size: 22px;}
div#splashscreen {position: fixed;background: #fff;height: 100vh;z-index: 99;}
.splash-logo img {width: 80%;}

.container {max-width: 1024px;}
.page-logo img {max-width: 250px;}
.form-check {display: flex; align-items: center; padding-left: 0px;}
.form-check-input:checked {background-color: #000000;border-color: #000000;}
.form-check .form-check-input {width: 1.7em;height: 1.7em;margin-left: 0px;margin-right: 7px;border-radius: 0;margin-top: 0px;}
.form-group {margin-bottom: 20px;}
.form-group label {display: block; margin-bottom: 7px; font-weight: 500;}
.form-check-label {margin-bottom: 0px !important;}
.container {padding-left: 15px; padding-right: 15px;}
.vehicle-card.card {background: #F4F6F9; border: 1px solid #9C9FB3; border-radius: 15px;}
.form-control, .form-select {border-radius: 0px; height: 44px; border-color: #000;}
.btn-primary {background-color: #000;color: #fff;font-weight: 600;height: 44px;border-color: #000;border-radius: 0;padding: 9px 15px;}
.btn-primary:active, .btn-primary:focus {background-color: #000;border-color: #000;box-shadow: none;outline: none;}
.btn-primary:hover {background-color: #fff; border-color: #000; color: #000;}
.btn-success {background-color: #4FD859;color: #fff;font-weight: 600;height: 44px;border-color: #4FD859;border-radius: 0;padding: 9px 15px;}
.btn-success:hover {background-color: #fff; border-color: #4FD859; color: #4FD859;}
.btn-primary.disabled, .btn-primary:disabled {color: #fff;background-color: #757575;border-color: #757575;}
.btn-secondary {background-color: #757575;color: #fff !important;font-weight: 600;height: 44px;border-color: #757575;border-radius: 0;padding: 9px 15px;}
.btn-secondary:hover {background-color: #fff; border-color: #000; color: #000;}
.back-btn {color: #000;text-decoration: none;font-size: 14px;display: flex;align-items: center;}
.back-btn i {margin-right: 5px;}
.vehicle-details h5 {font-size: 20px; font-weight: 700;}
.vehicle-details ul li {margin: 7px 0;}
.small-text {font-size: 14px; line-height: 20px;}
.mobile-number {max-width:570px; margin-left: auto; margin-right: auto;}
.otp-number {max-width: 150px; margin-left: auto; margin-right: auto;}
.offcanvas-title {font-size: 18px;}
.vehicleview-img img {width: 100%; position: absolute; top: 0; left: 0; width: 100%;}
.vehicle-img-box {margin-bottom: 15px;}
.vehicle-img-box .vehicleview-img {height: 215px; overflow: hidden; position: relative; display: flex; align-items: center; justify-content: center; border: 1px solid #000;}
.vehicle-img-box .vehicleview-img h5 {padding: 0 15px;}
.input-group-prepend{    width: 32%;}

.tab-container {
    display: flex;
    justify-content: space-around;
    background-color: #000;
    color: #fff;
    padding: 10px 0;
}
.tab {
    cursor: pointer;
    padding: 10px 20px;
    color: #fff;                           
}
.tab.active {
    border-bottom: 2px solid #fff;
}
.list-container {
    padding: 20px;
}
.vehicle-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: 1px solid #000;
    padding: 10px;
    margin-bottom: 10px;
}
.vehicle-item .btn {
    padding: 5px 15px;
    border: none;
    cursor: pointer;
    color: #fff;
}
.btn-open {
    background-color: #000;
}
.btn-sent {
    background-color: #28a745;
}