*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Poppins',sans-serif;
}

body{
background:#f4f6f9;
}

/* Login Section */

.login-section{
min-height:100vh;
display:flex;
justify-content:center;
align-items:center;
padding:40px 15px;
}

/* Login Card */

.login-card{
width:100%;
max-width:450px;
background:#ffffff;
padding:40px 35px;
border-radius:12px;
box-shadow:0 10px 30px rgba(0,0,0,0.08);
}

/* Title */

.login-card h2{
text-align:center;
color:#001f3f;
font-weight:700;
font-size:28px;
letter-spacing:1px;
margin-bottom:8px;
}

/* Subtitle */

.login-card p{
text-align:center;
font-size:14px;
color:#555;
margin-bottom:25px;
}

/* Form */

.form-group{
margin-bottom:20px;
}

.form-group label{
font-size:14px;
font-weight:600;
margin-bottom:6px;
display:block;
color:#001f3f;
}

/* Input with icon */

.input-group-text{
background:#ffffff;
border-right:none;
}

.form-control{
height:45px;
border-left:none;
border-radius:0 6px 6px 0;
}

.form-control:focus{
border-color:#0d3b66;
box-shadow:0 0 0 2px rgba(13,59,102,0.1);
}

/* Captcha */

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

.captcha-box{
background:#f1f3f6;
color:#001f3f;
padding:10px 16px;
font-weight:600;
letter-spacing:4px;
border-radius:6px;
border:1px solid #d0d7e2;
min-width:120px;
text-align:center;
font-size:16px;
}

.refresh-btn{
background:#e9ecef;
border:1px solid #ced4da;
padding:8px 10px;
border-radius:6px;
cursor:pointer;
}

.refresh-btn:hover{
background:#d6d6d6;
}

/* Login Button */

.login-btn{
width:100%;
height:48px;
background:#001f3f;
border:none;
border-radius:8px;
color:#fff;
font-size:16px;
font-weight:600;
cursor:pointer;
transition:0.3s;
}

.login-btn:hover{
background:#012a55;
}

/* Error */

.error-msg{
color:red;
font-size:13px;
margin-top:8px;
}

/* Forgot Password */

.forgot-text{
text-align:center;
margin-top:15px;
font-size:14px;
}

.forgot-text a{
color:#001f3f;
font-weight:600;
text-decoration:none;
}

.forgot-text a:hover{
text-decoration:underline;
}



/* ===================== */
/* Responsive Design */
/* ===================== */

@media (max-width:576px){


.login-card h2{
font-size:22px;
}

.form-control{
height:42px;
}

.login-btn{
height:44px;
}

.captcha-box{
font-size:14px;
padding:8px 12px;
}
.icon-circle {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: #f1f3f5;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto;
}