<div id="profile">
    <div style="padding-top: 50px; display: flex; justify-content:center;">
        <p style="width: 10rem; height: 10rem; padding: 2rem; background-color: grey; font-size: 3rem; text-align: center; color:rgba(105, 105, 105, 0.601);">IMG</p>
        <div style="margin-left: 30px;">
            <p>
                <span class="text-muted"><strong><%= `${user.firstname} ${user.lastname}` %></strong></span><br>
                <span class="text-muted"><%= user.emailAddress %></span><br>
                <span class="text-muted"><%= user.phone %> </span><br>
                <span class="text-muted"><%= user.licenseNumber %> </span><br>
                <span class="text-muted"><%= `${user.address} ${user.zipcode}` %> </span><hr>
                <% if (user.status.toLowerCase() === 'suspended') { %>
                    <span style="color: red; font-weight:700; font-size: 0.8rem;"><%= user.status %></span>
                <% } else if (user.status.toLowerCase() === 'active') { %>
                    <span style="color: green; font-weight:700; font-size: 0.8rem;"><%= user.status %></span>
                <% } else { %>
                    <span style="color: gray; font-weight:700; font-size: 0.8rem;"><%= user.status %></span>
                <% } %>
                 
            </p>
        </div>
    </div>
    <center><button class="switch-3" data-toggle="userUpdate" style="margin: 0.6rem auto;">Update profile</button></center>
    <%- include('partials/updateDriver.ejs') %> 
</div>