.member-title {
  text-align: center;
  margin-top: 0.3em;
  margin-bottom: 0.5em;
}

.member-title-align .member-title {
  text-align: center;
}
/* Styling for the member-login row */


/* Fonts */
.tfg-id-input,
.tfg-password-input,
.tfg-login-button {
    font-family: 'Urbanist', sans-serif !important;
    font-size: 16px !important;
    font-weight: 400;
    line-height: 1.5;
}







/* Flex container for inline layout */
        .tfg-login-row {
            display: flex;
            align-items: flex-end; /* ⬅️ Aligns all children to bottom */
            flex-wrap: nowrap;
            gap: 12px;
            width: 100%;
            }

        /* Two-column layout (for login page with 2 inputs) */
        .tfg-login-row .child-1 { flex: 0 0 48%; }
        .tfg-login-row .child-2 { flex: 0 0 48%; }
        .tfg-login-row .child-3 { flex: 0 0 auto; }

        /* Three-column layout override when button is in row */
        .tfg-login-row.has-button .child-1 { flex: 0 0 40%; }
        .tfg-login-row.has-button .child-2 { flex: 0 0 40%; }
        .tfg-login-row.has-button .child-3 { flex: 0 0 20%; }

        /* Input styles - 20% larger */
        .tfg-id-input {
            width: 100%;
            padding: 0 1.2em;
            font-size: 1.2em;
            border-radius: 4px;
            border: 1px solid #ccc;
            box-sizing: border-box;
            line-height: 48px;
            height: 48px;
        }

        /* Password input for login page - standalone, no button */
        .tfg-password-wrapper .tfg-password-input {
            width: 100%;
            padding: 0 1.2em;
            font-size: 1.2em;
            border: 1px solid #ccc;
            border-radius: 4px; /* All corners rounded */
            box-sizing: border-box;
            line-height: 48px;
            height: 48px;
        }

        /* Password input in combo - no right padding, rounded left only */
        .tfg-password-combo .tfg-password-input {
            flex: 1;
            padding: 0 1.2em;
            font-size: 1.2em;
            border: 1px solid #ccc;
            border-right: none; /* Remove right border to connect with button */
            border-radius: 4px 0 0 4px; /* Rounded left (4px), straight right */
            box-sizing: border-box;
            line-height: 48px;
            height: 48px;
        }

        .tfg-login-button {
            height: 48px;
            box-sizing: border-box;
        }

        /* Password combo container - flexbox to connect input and button */
        .tfg-password-combo {
            display: flex;
            align-items: stretch;
            width: 100%;
        }

        /* Eye toggle button - directly abutting the input field */
        .tfg-toggle-password {
            background: #f5f5f5;
            border: 1px solid #ccc;
            border-left: none; /* Remove left border to connect with input */
            border-radius: 0 4px 4px 0; /* Straight left, rounded right (4px) */
            cursor: pointer;
            padding: 0;
            margin: 0;
            color: #333;
            width: 56px; /* Wider for better click target */
            height: 48px;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: background-color 0.3s ease;
        }

        .tfg-toggle-password svg {
            width: 24px !important;
            height: 24px !important;
            max-width: 24px;
            max-height: 24px;
            stroke: #333;  /* Dark gray stroke */
            stroke-width: 2;
            display: block;
            flex-shrink: 0;
        }

        .tfg-toggle-password:hover {
            background-color: #e8e8e8;
        }

        .tfg-toggle-password:hover svg {
            stroke: #000;
        }

        .tfg-toggle-password:focus {
            outline: 2px solid #0E94FF;
            outline-offset: 2px;
            border-radius: 4px;
        }

        /* Button styling */
        .tfg-login-button {
            padding: 7px 20px;
            border-radius: 20px;
            background-color: #0E94FF;
            color: #fff;
            border: 1px solid #ffffff;
            cursor: pointer;
            font-weight: 500;
            transition: all 0.3s ease;
            box-shadow: 5px 5px 0 rgba(0, 0, 0, 0.1);
        }

        .tfg-login-button:hover {
            background-color: #295CFF;
        }

        /* Mobile responsiveness */
        @media (max-width: 600px) {
            .tfg-login-row {
                flex-wrap: wrap;
            }

            .child-1,
            .child-2,
            .child-3 {
                flex: 1 1 100%;
                max-width: 100%;
            }

            .tfg-toggle-password {
                margin-left: -35px;
            }
        }

        .tfg-stub-summary {
        background-color: #f0f4fa;
        border: 1px solid #d9e2ef;
        border-radius: 12px;
        padding: 20px 24px;
        margin-bottom: 32px;
        max-width: 640px;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
        font-size: 17px;
        line-height: 1.6;
        }

        .tfg-stub-summary p {
        margin: 8px 0;
        }