@extends('layouts.redesigned-front-layout')
@section('content')

    <div class="container-fluid">
      <div class="row">
        <!-- SIDEBAR (desktop) -->
        <div class="col-lg-3 p-0 sidebar-container">
          <div class="sidebar">
            <div class="profile">
              <img src="assets/profile.jpg" alt="" />
              <h5>Alex Johnson</h5>
              <small>Member since 2023</small>
            </div>

            <div class="sidebar-nav d-flex flex-column gap-1">
              <a href="#" class="active"
                ><i class="fa-solid fa-gauge"></i>&nbsp; Dashboard</a
              >
              <a href="#"
                ><i class="fa-solid fa-user"></i>&nbsp; Account Details</a
              >
              <a href="#"
                ><i class="fa-solid fa-bag-shopping"></i>&nbsp; Orders</a
              >
              <a href="#"
                ><i class="fa-solid fa-wallet"></i>&nbsp; Payment Methods</a
              >
              <a href="#"
                ><i class="fa-solid fa-users"></i>&nbsp; Refer a Friend</a
              >
              <a href="#"><i class="fa-solid fa-lock"></i>&nbsp; Security</a>
              <a href="#"
                ><i class="fa-solid fa-arrow-right-from-bracket"></i>&nbsp;
                Logout</a
              >
            </div>
          </div>
        </div>

        <!-- MOBILE DASHBOARD MENU -->
        <div class="mobile-dashboard-menu">
          <a href="#"><i class="fa-solid fa-gauge"></i> Dashboard</a>
          <a href="#"><i class="fa-solid fa-user"></i> Account</a>
          <a href="#"><i class="fa-solid fa-bag-shopping"></i> Orders</a>
          <a href="#"><i class="fa-solid fa-wallet"></i> Payments</a>
          <a href="#"><i class="fa-solid fa-users"></i> Refer</a>
          <a href="#"><i class="fa-solid fa-lock"></i> Security</a>
          <a href="#"
            ><i class="fa-solid fa-arrow-right-from-bracket"></i> Logout</a
          >
        </div>

       @yield('user-dashboard-content')
      </div>
    </div>

@endsection