/* Vehica Plus - one time code forms. Logical properties: works in RTL and LTR. */
.tfvp-otp { margin-block-end: 18px; }
.tfvp-otp:not(.is-active) .tfvp-otp__box,
.tfvp-otp:not(.is-active) .tfvp-otp__switch:not(.tfvp-otp__switch--back),
.tfvp-otp.is-active .tfvp-otp__switch--back { display: none; }
/* While the code form is active, the Vehica password form that follows it is hidden. */
.tfvp-otp.is-active ~ * { display: none !important; }
.tfvp-otp[hidden], .tfvp-otp [hidden] { display: none !important; }

.tfvp-otp__label { display: block; margin-block-end: 6px; font-weight: 600; font-size: 14px; }
.tfvp-otp .vehica-fields { margin-block-end: 14px; }
.tfvp-otp input.tfvp-otp__phone,
.tfvp-otp input.tfvp-otp__code,
.tfvp-otp input.tfvp-otp__input {
	display: block; box-sizing: border-box; width: 100%; height: 53px; margin: 0; padding: 0 20px;
	border: 1px solid #e7edf3; border-radius: 10px; background: #fff; color: #2f3b48; font-size: 15px; line-height: 51px;
	box-shadow: 1px 1px 0 0 rgba(196, 196, 196, .24); font-family: inherit;
}
.tfvp-otp input.tfvp-otp__phone:focus,
.tfvp-otp input.tfvp-otp__code:focus,
.tfvp-otp input.tfvp-otp__input:focus { border-color: var(--primary, #ff4605); outline: none; box-shadow: 0 0 0 3px rgba(255, 70, 5, .12); }
.tfvp-otp .vehica-field + .vehica-field { margin-block-start: 12px; }
.tfvp-otp input.tfvp-otp__phone,
.tfvp-otp input.tfvp-otp__code { text-align: center; letter-spacing: 2px; font-size: 17px; }
.tfvp-otp input.tfvp-otp__code { letter-spacing: 8px; }
.tfvp-otp button.vehica-button.tfvp-otp__submit { display: flex; align-items: center; justify-content: center; width: 100%; }
.tfvp-otp .tfvp-otp__submit.is-busy { opacity: .7; cursor: progress; }

.tfvp-otp__sent { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; margin: 0 0 14px; padding: 10px 14px; border-radius: 10px; background: #f4f6fa; font-size: 13.5px; line-height: 1.8; }
.tfvp-otp__link,
.tfvp-otp__switch { background: none; border: 0; padding: 0; color: var(--primary, #ff4605); cursor: pointer; font: inherit; font-size: 14px; text-decoration: underline; text-underline-offset: 4px; }
.tfvp-otp__link:hover, .tfvp-otp__switch:hover { text-decoration-thickness: 2px; }
.tfvp-otp__resend { display: block; margin: 14px auto 0; font-size: 13.5px; }
.tfvp-otp__resend[disabled] { color: #7a8494; opacity: 1; cursor: default; text-decoration: none; font-variant-numeric: tabular-nums; }
.tfvp-otp__switch { display: block; margin: 16px auto 0; }

/* fields with an error */
.tfvp-otp input.is-invalid { border-color: #e5484d !important; box-shadow: 0 0 0 3px rgba(229, 72, 77, .12) !important; }

/* message: a soft box above the button of the visible step */
.tfvp-otp__message { display: flex; align-items: flex-start; gap: 8px; margin: -2px 0 14px; padding: 10px 14px; border-radius: 10px; font-size: 13.5px; line-height: 1.8; border: 1px solid transparent; }
.tfvp-otp__message:empty { display: none; }
.tfvp-otp__message::before { content: ""; flex: 0 0 18px; width: 18px; height: 18px; margin-top: 3px; border-radius: 50%; background: currentColor no-repeat center / 12px 12px; -webkit-mask: none; }
.tfvp-otp__message.is-error { color: #b42318; background: #fef3f2; border-color: #fecdca; }
.tfvp-otp__message.is-error::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M6 2.5v4.2M6 8.6v.9' stroke='%23fff' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E"); }
.tfvp-otp__message.is-success { color: #067647; background: #ecfdf3; border-color: #abefc6; }
.tfvp-otp__message.is-success::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 6.2l2 2 4-4.4' fill='none' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.tfvp-otp__message.is-info { color: #175cd3; background: #eff8ff; border-color: #b2ddff; }
.tfvp-otp__message.is-info::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M6 5.4v3.6M6 3v.4' stroke='%23fff' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E"); }

/* verification box (add listing and account pages) */
.tfvp-verify-wrap { margin-block: 24px; }
.tfvp-verify { max-width: 460px; margin-inline: auto; background: #fff; border: 1px solid #e7edf3; border-radius: 16px; padding: 28px 24px; box-shadow: 0 6px 24px rgba(15, 23, 42, .06); }
.tfvp-verify__title { margin: 0 0 8px; font-size: 20px; font-weight: 700; }
.tfvp-verify__text { margin: 0 0 18px; opacity: .8; font-size: 14px; line-height: 1.9; }
.tfvp-verify--done { max-width: none; margin-block: 16px; padding: 12px 18px; display: flex; align-items: center; gap: 10px; font-size: 14px; }
.tfvp-verify__check { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #16a34a; color: #fff; font-size: 13px; }
.tfvp-verify .tfvp-otp { margin: 0; }
.tfvp-verify--blocking ~ .vehica-car-form { display: none !important; }

/* account type and terms of a new user */
.tfvp-otp__choices { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-block-start: 14px; }
.tfvp-otp__terms { margin-block-start: 14px; }
.tfvp-otp__choice { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; cursor: pointer; line-height: 1.8; }
.tfvp-otp__choice input { width: 18px; height: 18px; margin: 0; flex: 0 0 auto; accent-color: var(--primary, #ff4605); }
.tfvp-otp__terms .tfvp-otp__choice { font-weight: 500; align-items: flex-start; }
.tfvp-otp__terms .tfvp-otp__choice input { margin-top: 4px; }
.tfvp-otp__terms a { color: var(--primary, #ff4605); }
.tfvp-otp input[type="checkbox"].is-invalid { outline: 2px solid #e5484d; outline-offset: 2px; }