/* Main layout styles */
 body {
     background-color: var(--login-bg-body);
     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
 }

 .login-section {
     min-height: 100vh;
     display: flex;
     align-items: center;
     justify-content: center;
     padding: 2rem 1rem;
 }
 
 .login-card {
    background-color: var(--white-primary);
    border-radius: 8px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
    padding: 2.5rem; /* slightly more space inside */
    width: 100%;
    max-width: 520px; /* increased from default */
    min-height: 480px; /* taller card */
    margin: auto;
}


 .with-divider {
     border-right: 1px solid var(--txt-headings);
     /* Vertical line */
     padding-right: 10px;
     /* Add some spacing */
     margin-right: 10px;
     /* Optional, to separate from input */
 }

 /* Typography */
 .login-title {
     font-feature-settings: 'liga' off, 'clig' off;
     font-family: Poppins;
     font-size: 36px;
     font-style: normal;
     font-weight: 600;
     line-height: 20px;
     /* 55.556% */
     letter-spacing: -0.154px;
     color: var(--login-title);
     margin-bottom: 1rem;
     height: 28px;
     align-self: stretch;
 }

 .login-subtitle {
     font-family: Poppins;
     font-size: 18px;
     font-style: normal;
     font-weight: 400;
     line-height: 100%;
     /* 18px */
     color: var(--login-subtitle);
     margin-bottom: 2rem;
     align-self: stretch;
 }

 .form-label {
     font-size: 0.9rem;
     font-weight: 500;
     color: var(--login-form-label);
     margin-bottom: 0.5rem;
 }

 /* Input fields */
 .custom-input-group {
     position: relative;
     border-radius: 6px;
     overflow: hidden;
     box-shadow: none;
     background-color: var(--bg-body);

 }

 .custom-input-group .input-group-text {
     background-color: transparent;
     border-right: none;
     color: var(--custom-input);
     padding-right: 0;
 }

 .custom-input-group .form-control {
     border-left: none;
     padding-left: 0.85rem;
     height: 48px;
     background-color: transparent;
 }

 .custom-input-group .form-control:focus,
 .custom-input-group .input-group-text {
     box-shadow: none;
     border-color: var(--custom-input-text);
 }

 .custom-input-group .form-control::placeholder {
     color: var(--custom-input);
     font-size: 0.95rem;
 }


 .custom-input-group i {
     border-right: 1.5px solid;
     padding-right: 10px;
 }

 /* Checkbox */
 .custom-checkbox .form-check-input {
     width: 18px;
     height: 18px;
     margin-top: 0.2rem;
     border-color: var(--custom-input-text);
 }

 .custom-checkbox .form-check-label {
     padding-left: 0.25rem;
     color: var(--custom-input-label);
     font-size: 0.95rem;
 }

 .form-check-input:checked {
     background-color: var(--button-color-primary);
     border-color: var(--button-color-primary);
 }

 /* Button */
 .btn-login {
     background-color: var(--button-color-primary);
     border-color: var(--button-color-primary);
     color: var(--white-primary);
     font-weight: 500;
     padding: 0.75rem 1.5rem;
     border-radius: 6px;
     font-size: 1rem;
     height: 48px;
     transition: all 0.2s ease;
 }

 .btn-login:hover,
 .btn-login:focus {
     background-color: var(--btn-hover);
     border-color: var(--btn-hover);
     color: var(--white-primary);
 }

 .main-logo{
    width: 50%;
 }