*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: inherit;
}

html {
    /* This defines what 1rem is */
    font-size: 62.5%;
    /* default font size of the browser is 16px === 100%  */
    /* 10px / 16 px = 0.625 === 62.5% */
}

/* Main paige Choose a vehicle */
.progress-section {
    flex-direction: row;
}

.select-vehicle-img {
    margin-right: 80px;
}

.select-vehicle-search {
    margin-left: 80px;
}

.select-vehicle {
    display: flex;
    justify-content: center;
    margin-top: 150px;
}

.input-content {
    display: flex;
    flex-direction: column;
}

.input-car-number {
    width: 450px;
    height: 54px;
    border: none;
    border-radius: 18px;
    background-color: #ffffff;
    padding-left: 15px;
}

.search-box-btn {
    display: none;
    width: 450px;
    height: 54px;
    border: none;
    border-radius: 18px;
    background-color: #ffffff;
    margin: 25px 0;
}

#choose_file_sm {
    display: none;
    font-size: 2rem;
    width: 100%;
    padding: 10px 45px;
}

/* overwrite default style */
.dropzone.dz-clickable {
    border: none;
}

.drag-drop-container {
    width: 450px;
    min-height: 190px;
    border-radius: 18px;
    background-color: #ffffff;
    border: none;
    display: flex;
    justify-content: center;
    align-items: center;
}

.drag-drop-field {
    display: flex;
    justify-content: center;
    align-items: center;
}

#select_vehicle .dropzone {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 25px;
}

/* class .ui-widget overwrite default dropdown style */
.ui-widget,
.select-cars-container {
    position: absolute;
    background-color: white;
    padding-bottom: 20px;
    padding-top: 20px;
    border-radius: 18px;
    border: none;
    display: none;
}

.select-cars {
    width: 100%;
    background-color: var(--clr-primary-btn);
    color: white;
}

.input-search-vehicle {
    /* width: 210px; */
    width: 50%;
    height: 38px;
    border-radius: 18px;
    border: none;
    background-color: #ffffff;
    padding-left: 14px;
}

.filter-collapsed {
    width: 100%;
}

.apply-btn,
.filter-btn {
    background-color: var(--clr-primary-btn);
    height: 38px;
    border-radius: 18px;
    font-family: 'Eina03-SemiBold', sans-serif;
    font-size: 1.8rem;
    color: #ffffff;
    transition: .3s;
}

.apply-btn {
    width: 180px;
}

.filter-btn {
    width: 250px;
}

.filter-btn:hover {
    background-color: var(--clr-primary-hov);
    color: #ffffff;
}

.apply-btn:hover {
    background-color: #bfbfbf;
    color: #ffffff;
}

.apply-btn {
    background-color: #ffffff;
    border: none;
    color: var(--clr-primary-btn);
}

.filter-section {
    height: 78px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--clr-primary-btn);
}

.select-engine,
.power-input {
    width: 120px;
    height: 38px;
    border-radius: 18px;
    border: none;
    background-color: #ffffff;
    font-family: 'Eina03-SemiBold', sans-serif;
    font-size: 1.8rem;
    color: #898989;
    text-align: center;
}

.select-engine {
    padding-left: 12px;
    text-align: left;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.price-input {
    width: 120px;
    height: 38px;
    border-radius: 18px;
    border: none;
    background-color: #ffffff;
    font-family: 'Eina03-SemiBold', sans-serif;
    font-size: 1.8rem;
    color: #898989;
    text-align: center;
}

.filter-section label {
    color: white;
}

/* NEW STYLE LISTED CARS TABLE */
.table > thead > tr > th {
    vertical-align: middle;
    border-bottom: 0;
}

.th-first-child,
.td-last-child {
    width: 8%;
}

.th-last-child,
.td-last-child {
    width: 6%;
}

.table-header-row {
    background-color: #bfbfbf;
    height: 50px;
    font-family: 'Eina03-SemiBold', sans-serif;
    font-size: 1.8rem;
    color: white;  
}

.table > tbody > tr > td {
    border: none;
    padding: 12px 0 12px 0;
    vertical-align: middle;
}

.table-body-row {
    font-family: 'Eina03-SemiBold', sans-serif;
    font-size: 1.8rem;
    color: #aab4b4;
    vertical-align: middle;
}

.table-body-row-btn {
    text-align: center;
}

.table > tbody > tr:hover {
    background-color: var(--clr-primary-hov);
    color: #ffffff;
}

.table > tbody > tr:hover > td .select-btn {
    background-color: #ffffff;
    color: var(--clr-primary-hov);
}
/* !END NEW STYLE*/

/* OLD STYLE LISTED CARS TABLE */
.table-listed-cars {
    display: grid;
    grid-template-columns: 10% 36% 20% 12% 12% 10%;
    margin: 25px 0;
}

.table-listed-cars-header {
    background-color: #bfbfbf;
    height: 50px;
    font-family: 'Eina03-SemiBold', sans-serif;
    font-size: 1.8rem;
    display: flex;
    align-items: center;
    color: white;
}

.table-listed-cars-header-rows {
    margin-top: 25px;
    font-family: 'Eina03-SemiBold', sans-serif;
    font-size: 1.8rem;
    color: #aab4b4;
    align-items: center;
}
/* !END OLD STYLE*/

.select-btn {
    width: 100%;
    padding: 0 10px;
    height: 32px;
    border-radius: 18px;
    background-color: #aab4b4;
    color: white;
    border: none;
    font-family: 'Eina03-SemiBold', sans-serif;
    font-stretch: normal;
}

.select-btn span {
    padding: 0 5px 0 5px;
}

/* LANGUAGE */
.horizontal-group-btns:last-child {
    margin-left: 25px;
}

.input-search-vehicle,
.input-content,
.input-car-number,
.extras-input,
.holder-inputs,
.holder-info-inputs,
.evn-inputs {
    font-size: 1.6rem;
    font-weight: bold;
    color: #000;
}

.ui-menu-item {
    font-size: 1.6rem;
    font-weight: bold;
}

/* QUESTIONS LABEL AND BTNS (YES/NO) STYLING */
.title-panel {
    font-family: 'Eina03-SemiBold', sans-serif;
    font-size: 1.8rem;
    text-align: center;
    color: var(--clr-font-tl);
    margin: 0;
}

.questions,
.questions-txt-error {
    width: 62vw;
    min-height: 54px;
    border: none;
    border-radius: 18px;
    background-color: #ffffff;
    align-self: center;
    justify-content: space-between;
    padding: 10px 0 10px 0;
}

.questions-txt-error {
    background-color: transparent;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.questions-txt-error label {
    margin-right: 15px;
}

.questions-error {
    border: solid 1px #d6221c;
}

.question-btns-wrapper > button {
    margin-right: 19px;
}

.proceed-btn-start,
.proceed-btns,
.col-proceed-btns,
.per-proceed-btns {
    display: flex;
    justify-content: space-between;
    align-self: center;
    margin-top: 80px;
    margin-bottom: 145px;
}

#evn_details > .proceed-btns {
    margin-top: 40px;
}

.proceed-btn-start {
    justify-content: flex-end;
}

.proceed-btn-start,
.proceed-btns {
    width: 62vw;
}

.col-proceed-btns {
    justify-self: center; 
}

.per-proceed-btns {
    margin-left: 30px;
    margin-right: 30px;
    width: 94%;
}

.questions-header {
    height: 50px;
    margin: 5.5rem 0;
}

.def-btn,
.no-btn {
    width: 106px;
    height: 32px;
    border: none;
    border-radius: 8px;
    border: solid 1px #d2d2d2;
    background-color: #ffffff;
    font-size: 1.8rem;
    font-weight: bold;
    color: var(--clr-font-tl);
}

.yes-btn {
    width: 106px;
    height: 32px;
    border-radius: 8px;
    border: none;
    color: white;
    background-color: var(--clr-primary-btn);
    font-size: 1.8rem;
    font-weight: bold;
  
}

.chf-label {
    font-size: 1.6rem;
    font-weight: bold;
    color: var(--clr-font-tl);
    margin-top: 0px;
    margin-bottom: 0px;
}

.question-label-wrapper {
    width: 60%;
}

.question-label {
    margin-left: 27px;
    width: 100%;
    text-align: left;
    margin-bottom: 0;
}

#issue_ami_certificate_lp .question-label {
    padding: 8px 0;
}

.col-accept-gc-lp {
    float: right;
}

.gc-accept-qn {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.gc-accept-wrapper,
.gc-accept-wrapper-lp {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
    width: 100%;
    background-color: #ffffff;
    border-radius: 18px;
    min-height: 54px;
}

.gc-accept-wrapper-lp {
    justify-content: space-between;
}

.question-link,
.question-link-lp {
    font-size: 1.8rem;
    font-weight: 500;
    /* color: var(--clr-secondary-btn); */
    /* color: var(--clr-primary-btn); */
    color: var(--clr-font-tl);
    text-decoration: underline;
}
.question-link {
    margin: 0 20px;
}

input[type=checkbox].gc-accept-checkbox {
    border-radius: 2px;
    border: solid 1px #898989;
    height: 25px;
    width: 25px;
    margin: 0 20px 0 20px;
}

.search-btn,
.blue-btn,
.orange-btn,
.def-grey-btn,
.grey-btn,
.blue-btn-pick,
.grey-btn-pick,
.dk-blue-btn-pick,
.dk-blue-btn-pick-40,
.blue-btn-pick-40,
.select-btn,
.see-more-btn-40 {
    font-size: 1.8rem;
    /* transition: .3s; */
}

.next-btn,
.back-btn,
.alert-btn {
    font-size: 1.8rem;
}

/* .search-btn:hover, */
.select-btn:hover {
    background-color: var(--clr-primary-hov);
}

.grey-btns-group,
.blue-btns-group {
    font-size: 1.6rem;
    transition: .3s;
}

.no-btn:hover,
.yes-btn:hover {
    transition: .3s;
}

.no-btn:hover,
.yes-btn:hover,
.see-more-btn:hover,
.blue-btn-pick:hover,
.grey-btn:hover,
.grey-btns-group:hover,
.see-more-btn-40:hover {
    background-color: var(--clr-primary-btn);
    color: white;
}

.grey-btns-group:hover,
.grey-btn:hover,
.no-btn:hover {
    border: solid 1px var(--clr-primary-btn);
}

/* EVN DETAILS */
.questions-evn {
    width: 100%;
    height: 54px;
    border: none;
    border-radius: 18px;
    background-color: #ffffff;
    align-items: center;
    /* justify-content: space-between; */
}

.evn-inputs {
    text-align: center;
    /* width: 100%; */
    width: 237px;
    height: 41px;
    border:none;
    border-radius: 18px;
    border: solid 1px #898989;
}

.progress-section-evn {
    min-height: 79vh;
    background-color: #f2f2f2;
    display: flex;
    flex-direction: column;
}

.col-evn-details {
    float: none;
    margin: 0 auto;
    min-height: 35rem;
}

@media (hover: hover) {
    .dk-blue-btn-pick:hover,
    .dk-blue-btn-pick-40:hover {
        background-color: var(--clr-primary-btn);
        border: solid 1px var(--clr-primary-btn);
        color: white;
    }
}