﻿.lada-telefono input.form-control {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.lada-telefono .form-outline .form-control ~ .form-notch .form-notch-trailing {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.was-validated .input-group-text.invalid {
    border-color: #dc4c64;
}

.was-validated .input-group-text.valid {
    border-color: #14a44d;
}

.input-group {
    position: relative;
}

.input-group i:not(.btn-i) {
    position: absolute;
    top: 50%;
    left: 10px;
    transform: translateY(-50%);
    color: var(--avis-color-red);
    z-index: 9;
}

#form-booking-engine .form-control:not(.input-codigo-promocion, .select-input) {
    padding-left: 2.3rem !important;
}
#selectLada {
    line-height: 2.5;
}
#autocomplete-sucursal-renta .input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
    margin-left: 2rem !important;
}

.form-control.is-invalid, .was-validated .form-control:invalid {
    border-color: var(--avis-color-red);
    border-width: 2px;
}

.form-control.is-valid, .was-validated .form-control:valid {
    border-color: #14a44d;
    border-width: 2px;
}

.form-check-input[type=checkbox]:checked {
    background-color: var(--avis-color-red) !important;
}

.form-check-input:checked:focus, .form-check-input:checked {
    border-color: var(--avis-color-red) !important;
}

.form-check-input:checked:focus:before {
    box-shadow: 0 0 0 13px var(--avis-color-red);
}

#form-booking-engine .form-check {
    margin-bottom: 0 !important; 
}

.form-check-input.is-valid ~ .form-check-label, .was-validated .form-check-input:valid ~ .form-check-label {
    margin-bottom: 0 !important;
}

.form-check-input.is-valid[type=radio]:checked:after, .was-validated .form-check-input:valid[type=radio]:checked:after {
    border-color: var(--avis-color-red);
    background-color: var(--avis-color-red);
}

.datepicker-toggle-button {
    right: var(--mdb-datepicker-toggle-left);
}

#form-booking-engine .form-outline .form-control.form-control-lg, #form-booking-engine .form-control {
    font-size: 0.875rem !important;
}

#form-booking-engine .select-input.form-control {
    color: var(--avis-color-dark);
    font-weight: bold;
}

.form-outline .form-control.select-input:focus ~ .select-label, .select-input.focused ~ .select-label {
    color: var(--avis-color-red);
}

.select-arrow {
    color: #494D51 !important;
    font-size: 0.875rem !important;
    top: 50% !important;
    transform: translateY(-40%);
    font-family: "Font Awesome 6 Free";
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    font-weight: 900;
}

.select-arrow::after {    
    content: "\f078";
    border-top: 0;
}

.form-outline .select-label.active ~ .form-notch .form-notch-middle {
    border-top: none;
}

.input-group .invalid-feedback:not(.input-group.input-tarjeta-bancaria .invalid-feedback, .input-group.input-tarjeta-bancaria .valid-feedback, .was-validated .input-group.input-tarjeta-bancaria .invalid-feedback, .was-validated .input-group.input-tarjeta-bancaria .valid-feedback), .input-group .valid-feedback:not(.input-group.input-tarjeta-bancaria .invalid-feedback, .input-group.input-tarjeta-bancaria .valid-feedback, .was-validated .input-group.input-tarjeta-bancaria .invalid-feedback, .was-validated .input-group.input-tarjeta-bancaria .valid-feedback), .was-validated .input-group .invalid-feedback:not(.input-group.input-tarjeta-bancaria .invalid-feedback, .input-group.input-tarjeta-bancaria .valid-feedback, .was-validated .input-group.input-tarjeta-bancaria .invalid-feedback, .was-validated .input-group.input-tarjeta-bancaria .valid-feedback), .was-validated .input-group .valid-feedback:not(.input-group.input-tarjeta-bancaria .invalid-feedback, .input-group.input-tarjeta-bancaria .valid-feedback, .was-validated .input-group.input-tarjeta-bancaria .invalid-feedback, .was-validated .input-group.input-tarjeta-bancaria .valid-feedback) {
    margin-top: 2.8rem;
}

.invalid-feedback {
    margin-top: -.9rem;
}

.form-control.is-valid, .was-validated .form-control:valid {
    margin-bottom: 0;
}

.input-group > .form-control:focus {
    border-color: var(--avis-color-red) !important;
    box-shadow: inset 0 0 0 1px var(--avis-color-red);
}

.autocomplete-loader.spinner-border {
    display: inline-block;
    width: 1.6rem;
    height: 1.6rem;
    vertical-align: text-bottom;
    border: .2em solid;
    border-color: var(--avis-color-red);
    border-right: .2em solid transparent;
    border-radius: 25px !important;
    -webkit-animation: spinner-border .75s linear infinite;
    animation: spinner-border .75s linear infinite;
}

.icon-blank {
    width: 20px;
    height: 20px;
    display: inline-block;
    background-color: transparent;
    content: "";
}

/* #region custom datepicker */
.datepicker-header {
    background-color: var(--avis-color-red);
}

.datepicker-cell.current .datepicker-cell-content {
    border: var(--mdb-datepicker-cell-border-width) solid var(--avis-color-red);
}

.datepicker-footer-btn {
    color: var(--avis-color-dark);
}

.datepicker-cell.selected .datepicker-cell-content {
    background-color: var(--avis-color-red)
}
/*#endregion*/

.form-outline .form-control:focus ~ .form-label {
    color: var(--avis-color-red);
}

.form-outline {
    --mdb-form-outline-select-notch-border-color: var(--avis-color-red) !important;
}

.form-outline .form-control:focus ~ .form-notch .form-notch-leading {
    border-color: var(--avis-color-red);
    box-shadow: -1px 0 0 0 var(--avis-color-red),0 1px 0 0 var(--avis-color-red),0 -1px 0 0 var(--avis-color-red);
}

.form-outline .form-control:focus ~ .form-notch .form-notch-trailing {
    border-color: var(--avis-color-red);
    box-shadow: 1px 0 0 0 var(--avis-color-red),0 -1px 0 0 var(--avis-color-red),0 1px 0 0 var(--avis-color-red);
}

.form-outline .form-control:focus ~ .form-notch .form-notch-middle {
    border-color: var(--avis-color-red);
    box-shadow: 0 1px 0 0 var(--avis-color-red);
    border-top: 0;
}

.form-control:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
    border-color: var(--avis-color-red);
    -webkit-box-shadow: inset 0 0 0 1px var(--avis-color-red);
    box-shadow: inset 0 0 0 1px var(--avis-color-red);
}
/*#region radio button*/
.form-check-input[type=radio]:checked:after {
    border-color: var(--avis-color-red);
    background-color: var(--avis-color-red);
}
/*endregion*/

.selects-nacimiento .select-wrapper:first-child .form-outline .form-control ~ .form-notch .form-notch-trailing, .selects-nacimiento .select-wrapper:nth-child(2) .form-outline .form-control ~ .form-notch .form-notch-trailing {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.selects-nacimiento .select-wrapper:last-child .form-outline .form-control ~ .form-notch .form-notch-leading, .selects-nacimiento .select-wrapper:nth-child(2) .form-outline .form-control ~ .form-notch .form-notch-leading {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

input.fechas {
    padding-left: 30px !important;
}

label.form-label {
    color: var(--avis-color-dark)
}

button[data-mdb-toggle="datepicker"] {
    z-index: 9;
}

#form-booking-engine .form-control:not(.input-codigo-promocion,.select-input) {
    padding-left: 2.3rem !important;
}

.select-input.form-control {
    background-color: var(--avis-color-white) !important;
}

input.form-control:read-only {
    background-color: var(--avis-color-gray);
}

.form-outline-select .select-wrapper .form-control {
    min-height: calc(2.8rem) !important;
    line-height: initial !important;
}

.select-wrapper .select-fake-value {
    top: 50% !important;
    transform: translateY(-50%) !important;
    margin-top: 0;
}

.selects-nacimiento-2 .select-wrapper .select-label:not(.selects-nacimiento-2 .select-wrapper .select-label.active) {
    top: 50% !important;
    transform: translateY(-60%) !important;
}
