I am working on WordPress website and using the following code for registration and login.

<?php
        $c_user = wp_get_current_user();
        if( !is_user_logged_in( $c_user->ID ) ) :
        echo '<a href="' . esc_url( wp_login_url() ) . '" alt="' . esc_attr( 'Login', 'textdomain' ) . '">';
        echo _e( 'Login', 'textdomain' );
        echo '</a>';
        wp_register(' / ', '');
        else :
            echo 'Hello ' . $c_user->display_name . ', ';
            echo ' <a href="' . esc_url( wp_logout_url( home_url() ) ) . '" alt="' . esc_attr( 'Logout', 'textdomain' ) . '">';
        echo _e( 'Logout', 'textdomain' );
        echo '</a>';

        endif;
?>

I want to use login after register link and after login, it shows “Hello Imtango30, Logout”. Is there a way to hyperlink “Imtango30” with a custom link, e.g example.com? and assign a different CSS class to register/username and login/logout button so I could add a few CSS too?