

.help-block{
	color:red !important;
    
}
.error{
	color:red !important;
    
}


.userIcon{

    height: 50px;
}
    


.captchWidth{

  width: 336px;
}
.captchHeight{

 height: 47px;
}

.forgot-wrapper {
    min-height: 650px;
    width: 100%;
    display: flex;
    justify-content: center;
   
}

   .forgot-card {
    width: 100%;
    max-width: 500px;
    background: rgba(255, 255, 255, 0.96);
    border-radius: 18px;
    padding: 35px 40px;
    box-shadow: 0 15px 50px rgba(0, 0, 0, 0.25);
}
    .step-title {
        text-align: center;
        color: #47b2e4;
        font-weight: 600;
        margin-bottom: 8px;
    }

    .step-subtitle {
        text-align: center;
        color: #6c757d;
        margin-bottom: 30px;
    }

    /* Progress */
    .steps {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 35px;
    }

    .step {
        width: 38px;
        height: 38px;
        border-radius: 50%;
        background: #e9eef5;
        color: #6c757d;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 600;
        position: relative;
    }

    .step.active {
        background: #47b2e4;
        color: #fff;
    }

    .step-line {
        height: 3px;
        flex: 1;
        background: #e9eef5;
    }

    .step-line.active {
        background: #47b2e4;
    }

    .noteMobile{
        color:red;
        font-size: 12px;;
    }

    

    .captcha-row {
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .captcha-image {
        border: 1px solid #d9e0e8;
        border-radius: 8px;
        height: 52px;
        overflow: hidden;
        background: #fff;
    }

    .captcha-image img {
        height: 50px;
        width: auto;
    }

    .refresh-btn {
        width: 50px;
        height: 50px;
        border: 1px solid #d9e0e8;
        border-radius: 50%;
        background: #fff;
        color: #ed2525;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .send-btn {
        width: 100%;
        height: 52px;
        border-radius: 9px;
        border: 0;
        background: #47b2e4;
        color: #fff;
        font-size: 16px;
        font-weight: 600;
    }

    .send-btn:hover {
        background: #b7dce4;
        color: #fff;
    }

    #LoginForm .forgetpass {
    background: #47b2e4 !important;
    border-color: #47b2e4 !important;
  }


   .forgot-pages {
        position: relative;
      
        background:
            radial-gradient(circle at 15% 20%, rgba(13, 110, 253, 0.25) 0%, transparent 45%),
            radial-gradient(circle at 85% 80%, rgba(13, 110, 253, 0.30) 0%, transparent 50%),
            linear-gradient(135deg, #eaf2ff 0%, #d6e6ff 50%, #eaf2ff 100%);
        background-attachment: fixed;
        overflow: hidden;
    }

    /* subtle diagonal texture overlay */
    .forgot-pages::before {
        content: "";
        position: absolute;
        inset: 0;
        background-image: repeating-linear-gradient(
            45deg,
            rgba(13, 110, 253, 0.05) 0px,
            rgba(13, 110, 253, 0.05) 2px,
            transparent 2px,
            transparent 14px
        );
        pointer-events: none;
    }

    .forgot-wrapper {
        position: relative;
        z-index: 1;
        display: flex;
        justify-content: center;
    }

    .forgot-card {
        background: #ffffff;
        box-shadow: 0 15px 40px rgba(30, 40, 70, 0.12);
        border-radius: 14px;
    }

    .forgot-success {
        height: 320px;
    }

    

    .security-box {
        margin-top: 25px;
        padding: 14px;
        background: #eef6ff;
        border: 1px solid #d5e8ff;
        border-radius: 9px;
        color: #4d6380;
        font-size: 14px;
    }
    

    .otp-title {
        text-align: center;
        color: #162a43;
        font-weight: 700;
        margin-top: 25px;
    }

    .otp-subtitle {
        text-align: center;
        color: #6c757d;
        margin-bottom: 30px;
    }

    .otp-boxes {
        display: flex;
        justify-content: center;
        gap: 10px;
        margin: 25px 0;
    }

    .otp-box {
        width: 58px;
        height: 58px;
        border: 1px solid #d9e0e8;
        border-radius: 9px;
        text-align: center;
        font-size: 22px;
        font-weight: 600;
        outline: none;
    }

    .otp-box:focus {
        border-color: #47b2e4;
        box-shadow: 0 0 0 2px rgba(13,110,253,.1);
    }

    .verify-btn {
        width: 100%;
        height: 52px;
        background: #47b2e4;
        color: white;
        border: 0;
        border-radius: 9px;
        font-weight: 600;
        font-size: 16px;
    }

    .timer {
        text-align: center;
        margin: 20px 0;
        color: #5c6b7a;
    }

    .timer span {
        background: #e9f3ff;
        color: #47b2e4;
        padding: 7px 10px;
        border-radius: 6px;
        font-weight: 600;
    }

    .resend {
        text-align: center;
        margin-top: 20px;
    }

    .resend a {
        color: #47b2e4;
        text-decoration: none;
        font-weight: 500;
    }

   

     .password-title {
        text-align: center;
        color: #162a43;
        font-weight: 700;
        margin-top: 25px;
    }

    .password-subtitle {
        text-align: center;
        color: #6c757d;
        margin-bottom: 30px;
    }

   

    .password-wrapper {
        position: relative;
    }

    .password-wrapper .form-control {
        height: 52px;
        padding-right: 45px;
        border: 1px solid #47b2e4;
        border-radius: 9px;
    }

    .password-eye {
        position: absolute;
        right: 15px;
        top: 50%;
        transform: translateY(-50%);
        cursor: pointer;
        color: #6c757d;
    }

   

    .password-rules {
        background: #eef6ff;
        border: 1px solid #d5e8ff;
        border-radius: 9px;
        padding: 15px;
        margin-top: 15px;
        font-size: 14px;
    }

    .password-rule {
        margin-bottom: 7px;
        color: #4d6380;
    }

    .password-rule:last-child {
        margin-bottom: 0;
    }

    .reset-btn {
        width: 100%;
        height: 52px;
        background: #47b2e4;
        color: #fff;
        border: 0;
        border-radius: 9px;
        font-weight: 600;
        font-size: 16px;
        margin-top: 25px;
    }
 .back-login {
        text-align: center;
        margin-top: 20px;
    }

    .back-login a {
        color: #47b2e4;
        text-decoration: none;
    }

    .password-rule { color: #dc3545; /* red */ margin-bottom: 5px; }
     .password-rule.valid { color: #198754; /* green */ font-weight: 500; }
    
