/**
 * Signup View Styles
 * Styles specific to the signup/registration page
 */

/* Style for input fields with validation errors */
input.error {
    border-color: red;
}

/* Additional styles specific to signup form */
.form-control.error {
    border-color: red;
}

.invalid-feedback {
    display: block;
}

/* Style for error messages */
label.error {
    color: red;
    font-size: 0.875em;
    margin-top: 0.25em;
    display: block;
}

/* Base styling for all OTP inputs */
.otp-input-container {
    margin: 20px 0;
}

.otp-input {
    width: 45px;
    height: 45px;
    text-align: center;
    font-size: 1.3rem;
    margin: 0 5px;
    border-radius: 5px;
    background-color: #fff !important;
    border: 1px solid #ced4da;
    transition: all 0.2s ease-in-out;
    -webkit-appearance: none;
    appearance: none;
}

/* Override browser autofill styling */
.otp-input:-webkit-autofill,
.otp-input:-webkit-autofill:hover,
.otp-input:-webkit-autofill:focus,
.otp-input:-webkit-autofill:active,
.otp-input:-internal-autofill-selected {
    -webkit-box-shadow: 0 0 0 30px white inset !important;
    box-shadow: 0 0 0 30px white inset !important;
    -webkit-text-fill-color: inherit !important;
    background-color: white !important;
    transition: background-color 5000s ease-in-out 0s;
}

/* Add a more specific filled style that will override browser defaults */
.otp-input.filled {
    background-color: #fff !important;
    border-color: #0d6efd !important;
    box-shadow: 0 0 0 0.15rem rgba(13, 110, 253, 0.15) !important;
}

/* More specific focus style */
.otp-input:focus {
    background-color: #fff !important;
    border-color: #0d6efd !important;
    box-shadow: 0 0 0 0.15rem rgba(13, 110, 253, 0.25) !important;
    outline: 0 !important;
}

a.disabled {
    pointer-events: none;
    opacity: 0.6;
    cursor: not-allowed;
}


/* account type card and step bar styles removed (simplified signup) */