/* @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Arabic:wght@100..900&display=swap'); */
@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@200;300;400;500;700;800;900&display=swap');

html,body,body div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,figure,footer,header,menu,nav,section,time,mark,audio,video,details,summary{margin:0;padding:0;border:0;font-family: "Tajawal", sans-serif;font-size:100%;vertical-align:baseline;background:transparent;color:#FFF;}
article,aside,figure,footer,header,nav,section,details,summary{display:block;}
html {-webkit-box-sizing:border-box;box-sizing:border-box;scroll-behavior:smooth;}
*,*:before,*:after{-webkit-box-sizing:inherit;box-sizing:inherit;}
img {max-width: 100%;height: auto;}
a {margin: 0;padding: 0;text-decoration: none;vertical-align: baseline;background: transparent;}
a:focus,a:hover {text-decoration: none;vertical-align: baseline;background: transparent;}
p{margin-bottom: 0;}
body{position: relative;font-family: "Tajawal", sans-serif;}
/* RTL input alignment */
form[dir="rtl"] input.form-control {
    text-align: right;
}

.login_form{display:block;width:100%;height:100vh;background:transparent;position:relative;margin: 0;padding: 0;}
.login_form #bg-video{display:block;max-width:1920px;max-height:100vh;width:100%;height:100%;position:fixed;top:0;left:0;object-fit:cover;object-position:center center;z-index: -1;}
.login_form .login_box {display: block;width: 100%;margin: 0;padding:40px 40px;border-radius:10px;border:1px solid rgba(255, 255, 255, 0.2);background-color:rgba(255,255,255,0.3);}
.login_form .login_box .icon{display: block;width: 100%;margin: 0 auto 20px;padding: 0;}
.login_form .login_box .icon svg {display: block;margin:0 auto;width:80px;height:80px;}
.login_form .login_box h2{display: block;width: 100%;margin:0 0 30px;padding:0;font-weight:700;font-size:30px;color: #FFF;text-align:center;line-height:1.4;}
.login_form .login_box .form_group{display: block;width:100%;margin:0 0 20px;position:relative;}
.login_form .login_box .form_group i{color:hsl(135, 86%, 22%);position:absolute;top:60%;left:20px;}
.login_form .login_box .form_group .label{display: block;width: 100%;margin:0 0 10px;padding: 0;font-size:18px;font-weight:600;line-height:1.2;color:#082567;text-align:right;}
.login_form .login_box .form_group .form-control{background-color:rgba(255, 255, 255,1);border-radius:0px;padding:10px 15px;font-size:18px;line-height:1.2;border:2px solid #FFF;margin-bottom:0;color:#000;}
.login_form .login_box .form_group .form-control:hover,
.login_form .login_box .form_group .form-control:active,
.login_form .login_box .form_group .form-control:focus {border-color:#174fa3;background-color: #fff;box-shadow:none;}
.login_form .login_box .action_btn{display:flex;justify-content:flex-start;align-items:center;width: 100%;margin-bottom:20px;}
.login_form .login_box .action_btn a{display:inline-block;width: auto;font-size:16px;font-weight:500;color:#082567;text-decoration:none;}
.login_form .login_box .action_btn a:hover,
.login_form .login_box .action_btn a:focus,
.login_form .login_box .action_btn a:active{text-decoration:underline;color:#FFF;}
.login_form .login_box .register_link{display:inline-block;width: auto;margin:10px 0 0; font-size:16px;font-weight:500;color:#FFF;text-align:right;}
.login_form .login_box .register_link a{display:inline-block;width: auto;margin-left:2px;font-size:16px;font-weight:700;color:#082567;text-decoration:none;}
.login_form .login_box .register_link a:hover,
.login_form .login_box .register_link a:focus,
.login_form .login_box .register_link a:active{text-decoration:underline;color:#FFF;}

.login_form .divider{display:flex;justify-content:center;align-items:center;margin:0 auto;padding:0 0;width:2px;background-color:rgba(255,255,255, 0.9);height:80vh;}

/* Submit button styling */
.submit-btn {display:block;width:100%;background-color:#082567;color:#FFF;border:0;padding:14px 20px;    border-radius:10px;font-size:18px;line-height: 1.2;font-weight:600;transition: background-color 0.3s;outline:none;box-shadow:none;}
.submit-btn:focus,
.submit-btn:active,
.submit-btn:hover{background-color:rgba(8, 37, 103,0.8);outline:none;box-shadow:none;}

.right_content{display:flex;flex-direction:column;align-items:center;gap:0px;}
.right_content h2{display: block;width: 100%;margin:0 auto 20px;font-size:46px;line-height:1.4;color:#FFF;font-weight:700;text-align:right;text-transform: uppercase;}
.right_content span{display: block;width: 100%;margin:0 auto 16px;font-size:30px;line-height:1.2;color:#FFF;font-weight:500;text-align:right;}
.right_content p{display: block;width: 100%;margin:0 auto;font-size:22px;line-height:1.2;color:#FFF;text-align:right;}


@media only screen and (max-width: 991px){
    .login_form{height:auto;padding:100px 0;}
    .login_form .divider{display: none;}
}
@media only screen and (max-width: 479px){
    .login_form .login_box{padding:20px 20px;}
    .login_form .login_box .form_group .label{font-size: 16px;margin:0 0 4px;}
    .login_form .login_box .form_group .form-control{font-size: 16px;}
    .right_content h2{font-size:30px;}
    .right_content span{font-size:24px;}
    .right_content p{font-size:16px;}
}





.otp_form{display:block;width:100%;height:100vh;background:transparent;position:relative;margin: 0;padding: 0;}
.otp_form #bg-video{display:block;max-width:1920px;max-height:100vh;width:100%;height:100%;position:fixed;top:0;left:0;object-fit:cover;object-position:center center;z-index: -1;}
.otp_form .otp_box {display: block;width: 100%;margin: 0;padding:40px 40px;border-radius:10px;border:1px solid rgba(255, 255, 255, 0.2);background-color:rgba(255,255,255,0.3);}
.otp_form .otp_box h2{display: block;width: 100%;margin:0 0 30px;padding:0;font-weight:700;font-size:35px; margin-top:10px;color:#FFF;text-align:center;line-height:1.4}
.otp_form .otp_box .form_group{display: block;width:100%;margin:0 0 20px;position:relative;}
.otp_form .otp_box .form-group .otp-input {background-color:#fff;border-radius:8px;width:50px;height:50px;font-size:20px;text-align:center;border:2px solid #fff;color:#000;margin-bottom:0;padding:0;}
.otp_form .otp_box .form-group .otp-input:hover,
.otp_form .otp_box .form-group .otp-input:active
.otp_form .otp_box .form-group .otp-input:focus {border-color: #174fa3;background-color: #fff;box-shadow: none;}
.otp_form .otp_box .action_btn{display:flex;align-items:center;margin-top: 20px;width: 100%;margin-bottom:20px;}
.otp_form .otp_box .action_btn a{display:inline-block;width: auto;font-size:20px;font-weight:500;color:#082567;text-decoration:none;}
.otp_form .otp_box .action_btn a:hover,
.otp_form .otp_box .action_btn a:focus,
.otp_form .otp_box .action_btn a:active{text-decoration:underline;color:#FFF;}
.otp_form .otp_box .form-group .form-navigation{display: flex; gap:10px;}
.otp_form .divider{display:flex;justify-content:center;align-items:center;margin:0 auto;padding:0 0;width:2px;background-color:rgba(255,255,255, 0.9);height:80vh;}
.form-check-input:checked{background-color: #082567; color: #FFF; box-shadow: none;}
.form-check-label{margin: 0 0 10px; width: 100%;padding: 0; right:0; font-size: 18px;text-align: right;line-height: 1.2;font-weight: 600;color:#082567} 
   

  


   

/* Submit button styling */
.submit-btn {display:block;width:100%;background-color:#082567;color:#FFF;border:0;padding:14px 20px;    border-radius:10px;font-size:18px;line-height: 1.2;font-weight:600;transition: background-color 0.3s;outline:none;box-shadow:none;}
.submit-btn:focus,
.submit-btn:active,
.submit-btn:hover{background-color:rgba(8, 37, 103,0.8);outline:none;box-shadow:none;}
.right_content{display:flex;flex-direction:column;align-items:center;gap:0px;}
.right_content h2{display: block;width: 100%;margin:0 auto 20px;font-size:46px;line-height:1.4;color:#FFF;font-weight:700;text-align:right;text-transform: uppercase;}
.right_content span{display: block;width: 100%;margin:0 auto 16px;font-size:30px;line-height:1.2;color:#FFF;font-weight:500;text-align:right;}
.right_content p{display: block;width: 100%;margin:0 auto;font-size:22px;line-height:1.2;color:#FFF;text-align:right;}


@media only screen and (max-width: 991px){
    .otp_form{height:auto;padding:100px 0;}
    .otp_form .divider{display: none;}
}
@media only screen and (max-width: 479px){
    .otp_form .otp_box{padding:20px 20px;}
    .otp_form .otp_box .form_group .label{font-size: 16px;margin:0 0 4px;}
    .otp_form .otp_box .form_group .form-control{font-size: 16px;}
    .right_content h2{font-size:30px;}
    .right_content span{font-size:24px;}
    .right_content p{font-size:16px;}
}