<?php if ( ! defined( 'ABSPATH' ) ) exit; ?>
<?php if ( !isset($_GET['user_nonce']) || !wp_verify_nonce(sanitize_text_field(wp_unslash($_GET['user_nonce'])), 'DialBunny') ) { echo 'Sorry, we couldn’t verify your request due to a security check failure.'; return; } ?>

<div class="content d-flex flex-column flex-column-fluid" id="content">
  <div class="container-xxl" id="content_container">

        <div class="card mb-8">
      <div class="card-body flex-column p-5">
        <div class="d-flex align-items-center h-lg-300px p-5 p-lg-15">
          <div class="d-flex flex-column align-items-start justift-content-center flex-equal me-5">
            <div class="d-flex flex-wrap flex-sm-nowrap">
              <div class="d-flex flex-center flex-shrink-0 bg-light rounded w-100px h-100px w-lg-150px h-lg-150px me-7 mb-4">
                <div class="d-flex justify-content-center align-items-center p-10">
                    <span class="menu-bullet">
                        <span class="fas fa-user text-dark display-1"></span>
                    </span>
                </div>
              </div>
              <div class="flex-grow-1">
                <div class="d-flex justify-content-between align-items-start flex-wrap mb-2">
                  <div class="d-flex flex-column">
                    <div class="d-flex align-items-center mb-1">
                      <a class="text-gray-800 fs-2 fw-bold me-3"><?php echo esc_html($current_user->display_name); ?></a>
                    </div>
                    <div class="d-flex flex-wrap fw-semibold mb-4 fs-5 text-gray-400">Welcome to your profile page <?php echo esc_html(ucfirst($current_user->display_name)); ?>.</div>
                  </div>
                </div>
                <div class="d-flex flex-wrap justify-content-start">
                  <div class="d-flex flex-wrap">
                    <ul class="nav nav-tabs nav-line-tabs nav-line-tabs-2x fs-6 fw-semibold mt-6 mb-8 gap-2">
                      <li class="nav-item">
                        <p class="d-flex flex-wrap fw-semibold mb-4 fs-5 text-gray-400">
                          <i class="fs-5 me-2"><span class="fas fa-clock"></span></i>You Joined: <?php echo esc_html(gmdate( 'F j, Y', strtotime( $current_user->user_registered ) )); ?></a>
                        </p>
                      </li>
					</ul>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="card-rounded bg-light d-flex flex-stack flex-wrap p-5">
          <ul class="nav flex-wrap border-transparent fw-bold">
            <li class="nav-item my-1">
              <a class="btn btn-color-gray-600 btn-active-secondary btn-active-color-primary fw-bolder fs-8 fs-lg-base nav-link px-3 px-lg-8 mx-1 text-uppercase active" href="<?php echo esc_url(wp_nonce_url($dialbunnyDashboardUrl.'&dashboardpage=profile', 'DialBunny', 'user_nonce')); ?>">Profile</a>
            </li>
          </ul>
        </div>
      </div>
    </div>

    <div class="card mb-5 mb-xl-10" id="profile_details_view">
        <div class="card-header cursor-pointer">
            <div class="card-title m-0">
            <h3 class="fw-bold m-0">Profile Details</h3>
            </div>
        </div>
        <div class="card-body p-9">
            <div class="row mb-7">
            <label class="col-lg-4 fw-semibold text-muted">Username</label>
            <div class="col-lg-8">
                <span class="fw-bold fs-6 text-gray-800"><?php echo esc_html($current_user->user_login); ?></span>
            </div>
            </div>
            <div class="row mb-7">
            <label class="col-lg-4 fw-semibold text-muted">Display Name</label>
            <div class="col-lg-8">
                <span class="fw-semibold text-gray-800 fs-6"><?php echo esc_html($current_user->display_name); ?></span>
            </div>
            </div>
            <div class="row mb-7">
            <label class="col-lg-4 fw-semibold text-muted">Email</label>
            <div class="col-lg-8">
                <a href="#" class="fw-semibold fs-6 text-gray-800 text-hover-primary"><?php echo esc_html($current_user->user_email) ?? '-'; ?></a>
            </div>
            </div>
            <div class="row mb-7">
            <label class="col-lg-4 fw-semibold text-muted">First Name</label>
            <div class="col-lg-8 fv-row">
                <span class="fw-semibold text-gray-800 fs-6"><?php echo esc_html($current_user->first_name) ?? '-'; ?></span>
            </div>
            </div>
            <div class="row mb-7">
            <label class="col-lg-4 fw-semibold text-muted">Last Name</label>
            <div class="col-lg-8 d-flex align-items-center">
                <span class="fw-semibold text-gray-800 fs-6"><?php echo esc_html($current_user->last_name) ?? '-'; ?></span>
            </div>
            </div>
        </div>
        </div>

    </div>
</div>