.login-section {
     padding: 200px 0;
     background: #F2F5F7;
}

.login-section .auth-img {
     width: 100%;
     display: flex;
     justify-content: center;
     align-items: center;
}

.login-section .auth-img img {
     width: 100%;
}

.login-section .auth-box {
     border-radius: 15px;
     background: var(--white);
     box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.15);
     padding: 25px;
}

.login-section .auth-box form h2 {
     font-weight: bold;
}

.login-section .auth-box form h2 span {
     color: var(--primary-color);
}

.login-section .auth-box form .input-group {
     padding: 30px 0 10px 0;
     display: flex;
     flex-direction: column;
     width: 100%;
     gap: 20px;
}

.login-section .auth-box form .input-group .form-control {
     width: 100%;
     padding: 10px;
     border-radius: 5px;
     border: 1px solid var(--primary-color);
     /* background: var(--white); */
     color: #757575;
}

.login-section .input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
     margin-left: unset;
     border-top-left-radius: 5px;
     border-bottom-left-radius: 5px;
}

.login-section .auth-box form .forget-pw {
     text-align: end;
}

.login-section .auth-box form .forget-pw a {
     font-weight: 600;
     text-decoration: none;
     color: var(--primary-color);
}

.login-section .auth-box form button {
     display: flex;
     align-items: center;
     justify-content: center;
     padding: 10px;
     color: var(--white);
     font-weight: 600;
     width: 100%;
     border-radius: 5px;
     background: var(--primary-color);
     border: none;
     margin: 20px 0;
}

.login-section .auth-box .other-action {
     text-align: center;
}

.login-section .auth-box .other-action span {
     font-weight: 500;
     color: var(--black);
}

.login-section .auth-box .other-action span a {
     font-weight: 600;
     text-decoration: none;
     color: var(--primary-color);
}

.login-section .register-form .row {
     margin-left: 0;
}

.login-section .register-form .row .col,
.login-section .register-form .row .col-6,
.login-section .register-form .row .col-2 {
     padding-left: 0px;
}

.login-section .register-form .iti {
     width: 100%;
}

.login-section .register-form .iti--separate-dial-code .iti__selected-flag {
     background: var(--white);
     border-right: 1px solid var(--primary-color);
     border-radius: 5px 0px 0px 5px;
}

.login-section .register-form .checkbox-input {
     display: flex;
     align-items: center;
     gap: 10px;
}

.login-section .register-form .checkbox-input label a {
     text-decoration: none;
}

.login-section .register-form .checkbox-input input[type="checkbox"] {
     appearance: none;
     width: 20px;
     height: 20px;
     border: 2px solid var(--primary-color);
     border-radius: 4px;
     cursor: pointer;
     transition: background-color 0.2s ease, border-color 0.2s ease;
}

.login-section .register-form .checkbox-input input[type="checkbox"]:checked {
     background-color: var(--primary-color);
     border-color: var(--primary-color);
}

.login-section .register-form .checkbox-input input[type="checkbox"]:checked::after {
     content: '✓';
     color: var(--white);
     font-size: 14px;
     display: flex;
     justify-content: center;
     align-items: center;
     width: 100%;
     height: 100%;
}

.login-section .register-form .checkbox-input label {
     color: #757575;
}

.login-section .register-form .form-control.select {
     background-image: url('data:image/svg+xml;charset=UTF-8,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 6"%3E%3Cpath fill="%23888888" d="M0 0l5 6 5-6z"/%3E%3C/svg%3E');
     background-repeat: no-repeat;
     background-position: right 10px center;
     background-size: 10px;
}