/*----------------------------
         Add CSS file
----------------------------*/
@import "../plugins/bootstrap/css/bootstrap.min.css";
@import "../plugins/fontawesome/css/all.min.css";
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

/*----------------------------
   element      
----------------------------*/

:root {
   --black:#000000;
   --gray:#374151;
   --lightgray:#9CA3AF;
   --orange:#F47409;
   --red:#F50008;
   --green:#22C55E;
   --blue:#3B82F6;
   --purple:#A855F7;
   --cyan:#2DAC89;
   --cyan1:#B7F6FB;
    --yellow:#DFFF00;
    --white:#ffffff;
    --border:#CED4DA;
    --body:#F4F4F4;

    --lightblue:#ECF3FF;
    --lightgreen:#E9FAEF;
    --lightred:#FEE6E7;
    --lightorange:#FEF2E7;
    --lightpurple:#F7EEFF;
  
}

* {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
html { text-rendering: optimizeLegibility !important;-webkit-font-smoothing: antialiased !important;}
*{margin:0; padding:0}
a{ text-decoration:none;}
a:hover{ text-decoration:none !important;}
header, nav, section, article, aside, footer { display:block;}
html {font-size: 100%;}
body {font-size: 12px;background:var(--body);  font-family: "Inter", sans-serif;line-height: 26px;color:#455A64;-webkit-font-smoothing: antialiased;font-weight: normal;}
h1, h2, h3, h4, h5, h6 {padding: 5px 0 15px 0;color: #455A64;-webkit-font-smoothing: antialiased;}
:-ms-input-placeholder{color: #000;}



.wd10{width: 10%;}
.wd20{width: 20%;}
.wd30{width: 30%;}
.wd40{width: 40%;}
.wd50{width: 50%;}
.wd60{width: 60%;}
.wd70{width: 70%;}
.wd80{width: 80%;}
.wd90{width: 90%;}
.wd100{width:100%;}



/*----------------------------
   auth      
----------------------------*/
.auth-section{ background:url(../images/auth-bg.jpg); position: relative; padding: 1rem 0;background-size: cover;background-repeat: no-repeat;}

.auth-form {background: hsl(0deg 0% 100% / 75%); box-shadow: 0px 8px 13px rgb(0 0 0 / 8%); border-radius: 15px; position: relative; padding:2rem 5rem; backdrop-filter: blur(12px); }
.brand-logo{text-align: center; margin-bottom: 1rem;}
.brand-logo img{height:120px}

.auth-form  h2 {font-size:24px;font-weight: 600;color:var(--black);margin: 0;padding: 0; text-align: center;}
.auth-form  p {font-size:14px; font-weight: normal; color:var(--black); margin: 0; padding: 0;text-align: center; }

.auth-form .form-group{margin-bottom: 1rem;}
.auth-form .form-group h4 {color:var(--black); font-size: 14px; font-weight: 600; margin:0; padding:0; }

.form-group-input{position: relative;}
.auth-form input.form-control {background: var(--white); border-radius: 5px; font-size: 13px; border: 1px solid var(--border); font-weight: 400; height: auto; padding:12px 15px;   box-shadow: 0 5px 13px rgb(240 240 241 / 46%); outline: 0; width: 100%; display: inline-block;color:var(--gray);}
.auth-form input.form-control:focus {border: 1px solid var(--orange); }
.form-group-input .form-control{padding:12px 35px 12px 35px !important }
.email-icon{position: absolute; top: 10px; left: 10px; color: var(--orange);}
.password-icon{position: absolute; top: 10px; left: 10px; color: var(--orange);}
.eye-icon{position: absolute; top: 10px; right: 10px; color: var(--orange);}

button.auth-form-btn {outline: none;border: none;background:var(--orange);width: 100%; padding: 12px 40px;display: inline-block;color: #fff;font-size: 16px;font-weight: 600;border-radius: 5px;box-shadow: 0 8px 13px rgb(9 84 149 / 10%);}


a.Forgottext{font-size:14px; font-weight: 500; color:var(--orange); margin: 0 0 0rem 0; padding: 0; }


/*----------------------------
   Checkbox    
----------------------------*/
.fwscheckbox label {padding-left: 31px; position: relative;color:var(--orange); display: inline-block; padding: 0 0 0 2em; margin-bottom: 10px;  line-height: 1.5; cursor: pointer; font-size: 14px;}
.fwscheckbox label::before,
.fwscheckbox label::after {position: absolute; top: 0; left: 0; display: block; width: 24px; height: 24px; }
.fwscheckbox label::before {content: " ";border: 1px solid var(--orange);-webkit-border-radius: 3px;-moz-border-radius: 3px;-ms-border-radius: 3px;-o-border-radius: 3px;border-radius: 3px;}
.fwscheckbox input[type="checkbox"]{position: absolute; opacity: 0; z-index: -1; margin: 0; }
.fwscheckbox input[type="checkbox"] + label::after {content: "\2714"; color: #FFF; line-height: 1.9; text-align: center; border: none; }
.fwscheckbox input[type="checkbox"]:checked + label::before {background: var(--orange);border-color: var(--orange);}
.fwscheckbox input[type="checkbox"] + label::after{-webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); }
.fwscheckbox input[type="checkbox"]:checked + label::after{-webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); }


/*----------------------------
   Footer    
----------------------------*/

.site-footer {position: relative; width: 100%; text-align: center; padding: 15px 0; font-size: 13px; }
.site-footer a {color: var(--gray); text-decoration: none; margin: 0 5px; } 
.site-footer a:hover {text-decoration: underline; }
.site-footer span {color:  var(--gray); }
.copyright-text {margin-top: 5px; font-size: 12px; opacity: 0.8; }