File: /home/imensosw/www/imenso.co/demo/mps-com/scheduled.php
<!doctype html>
<html lang="en-US" >
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Millennial Platform</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/datepicker.min.css">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.21/css/dataTables.bootstrap4.min.css">
<link rel='stylesheet' href='css/style.css' media='all' />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" media="all">
</head>
<body>
<aside class="menubar">
<ul class="menubar-list">
<li class="brand">
<a class="" href="#"><img src="images/logo-sm.png" width="50"></a>
</li>
<li class="">
<a class="" href="dashboard.php">
<div class="menu-icon">
<img src="images/dashboard.png" class="img-fluid">
</div>
<span>Dashboard</span>
</a>
</li>
<li class="active">
<a class="" href="scheduled.php">
<div class="menu-icon">
<img src="images/scheduled.png" class="img-fluid">
</div>
<span>Scheduled</span>
</a>
</li>
<li class="">
<a class="" href="#">
<div class="menu-icon"><img src="images/on-demand.png" class="img-fluid"></div>
<span>On-Demand</span>
</a>
</li>
<li class="">
<a class="" href="#">
<div class="menu-icon"><img src="images/logs.png" class="img-fluid"></div>
<span>Logs</span>
</a>
</li>
<li class="">
<a class="" href="#">
<div class="menu-icon"><img src="images/patients.png" class="img-fluid"></div>
<span>Patients</span>
</a>
</li>
<li class="userlog dropdown">
<div class="dropdown show">
<a class="dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<img src="images/patient.png" class="img-fluid circled">
</a>
<div class="dropdown-menu" aria-labelledby="dropdownMenuLink">
<a class="dropdown-item" href="#">Profile</a>
<a class="dropdown-item" href="#">Setting</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Logout</a>
</div>
</div>
</li>
</ul>
</aside>
<main class="ground">
<div class="top-bar">
<div class="sidebar-header border-bottom">
<div class="sidebar-search">
<input class="search" placeholder="Search here..">
<div class="dropdown show">
<a class="dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fa fa-bars"></i>
</a>
<div class="dropdown-menu" aria-labelledby="dropdownMenuLink">
<h6 class="dropdown-header">Status</h6>
<a class="dropdown-item" href="#">Pending</a>
<a class="dropdown-item" href="#">Confirmed</a>
<a class="dropdown-item" href="#"></a>
<div class="dropdown-divider"></div>
<h6 class="dropdown-header">Text</h6>
<a class="dropdown-item" href="#">Delivered</a>
<a class="dropdown-item" href="#">Viewed</a>
<div class="dropdown-divider"></div>
<h6 class="dropdown-header">Mode</h6>
<a class="dropdown-item" href="#">SMS</a>
<a class="dropdown-item" href="#">Email</a>
</div>
</div>
</div>
<ul class="sub-menu">
<li class="active all"><a href="">All (200)</a></li>
<li class="orange"><a href="">Actions Needed (04)</a></li>
<li class="green"><a href="">Confirmed (120)</a></li>
<li class="orange"><a href="">Cancelled (02)</a></li>
</ul>
</div>
</div>
<div class="panel">
<table class="table" id="scheduled">
<thead>
<tr>
<th>Patient</th>
<th>Appt Date</th>
<th>Appt Name</th>
<th class="text-center">Mode</th>
<th>Provider</th>
<th>Delivery</th>
<th>Response</th>
<th class="text-center">Status</th>
</tr>
</thead>
<tbody>
<tr>
<td onclick="$('#patientInfo').toggle();">
<strong class="appt-title green"> Jane Austin <i class="">ID-520</i></strong>
</td>
<td><span class="datetime"><date>08.25.20</date><time> 10:25 PM</time></span></td>
<td>Appointment Schedule</td>
<td class="text-center"><img src="images/sms.png" width="20"> </td>
<td>Dr. Samantha Jones</td>
<td><span class="capsule" data-toggle="tooltip" data-placement="top" title="" data-original-title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Sent</span></td>
<td>Yes</td>
<td class="text-center"><span class="status-btn canceled">Cancelled</span></td>
</tr>
<tr>
<td onclick="$('#patientInfo').toggle();">
<strong class="appt-title orange">Will Smith<i class="">ID-520</i></strong>
</td>
<td><span class="datetime"><date>08.06.20</date><time> 10:25 PM</time></span></td>
<td>Follow up</td>
<td class="text-center"><img src="images/email.png" width="20"></td>
<td>Dr. Samantha Jones</td>
<td><span class="capsule done" data-toggle="tooltip" data-placement="top" title="" data-original-title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read</span></td>
<td>No</td>
<td class="text-center"><span class="status-btn canceled">Cancelled</span></td>
</tr>
<tr>
<td onclick="$('#patientInfo').toggle();">
<strong class="appt-title green"> Bruce Willis <i class="">ID-520</i></strong>
</td>
<td><span class="datetime"><date>08.20.20</date><time> 10:25 PM</time></span></td>
<td>Insurance Vefification</td>
<td class="text-center"><img src="images/sms.png" width="20"> </td>
<td>Dr. Samantha Jones</td>
<td><span class="capsule" data-toggle="tooltip" data-placement="top" title="" data-original-title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Sent</span></td>
<td>Yes</td>
<td class="text-center"><span class="status-btn confirmed">Confirmed</span></td>
</tr>
<tr>
<td onclick="$('#patientInfo').toggle();">
<strong class="appt-title orange">Chistopher Nolan<i class="">ID-520</i></strong>
</td>
<td><span class="datetime"><date>08.20.20</date><time> 10:25 PM</time></span></td>
<td>Survey</td>
<td class="text-center"><img src="images/email.png" width="20"></td>
<td>Dr. Samantha Jones</td>
<td><span class="capsule done" data-toggle="tooltip" data-placement="top" title="" data-original-title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read</span></td>
<td>No</td>
<td class="text-center"><span class="status-btn canceled">Cancelled</span></td>
</tr>
<tr>
<td onclick="$('#patientInfo').toggle();">
<strong class="appt-title green"> Jammie Fox <i class="">ID-520</i></strong>
</td>
<td><span class="datetime"><date>08.20.20</date><time> 10:25 PM</time></span></td>
<td>Payment Estimation</td>
<td class="text-center"><img src="images/sms.png" width="20"> </td>
<td>Dr. Samantha Jones</td>
<td><span class="capsule" data-toggle="tooltip" data-placement="top" title="" data-original-title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Sent</span></td>
<td>Yes</td>
<td class="text-center"><span class="status-btn confirmed">Confirmed</span></td>
</tr>
<tr>
<td onclick="$('#patientInfo').toggle();">
<strong class="appt-title orange">Felicity Jonas<i class="">ID-520</i></strong>
</td>
<td><span class="datetime"><date>08.20.20</date><time> 10:25 PM</time></span></td>
<td>Instructions</td>
<td class="text-center"><img src="images/email.png" width="20"></td>
<td>Dr. Samantha Jones</td>
<td><span class="capsule done" data-toggle="tooltip" data-placement="top" title="" data-original-title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read</span></td>
<td>No</td>
<td class="text-center"><span class="status-btn canceled">Cancelled</span></td>
</tr>
<tr>
<td onclick="$('#patientInfo').toggle();">
<strong class="appt-title green"> Anny Hathway <i class="">ID-520</i></strong>
</td>
<td><span class="datetime"><date>08.20.20</date><time> 10:25 PM</time></span></td>
<td>First Appt</td>
<td class="text-center"><img src="images/sms.png" width="20"> </td>
<td>Dr. Samantha Jones</td>
<td><span class="capsule" data-toggle="tooltip" data-placement="top" title="" data-original-title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Sent</span></td>
<td>Yes</td>
<td class="text-center"><span class="status-btn confirmed">Confirmed</span></td>
</tr>
<tr>
<td onclick="$('#patientInfo').toggle();">
<strong class="appt-title orange">Justin Timberlake<i class="">ID-520</i></strong>
</td>
<td><span class="datetime"><date>08.20.20</date><time> 10:25 PM</time></span></td>
<td>Follow up</td>
<td class="text-center"><img src="images/email.png" width="20"></td>
<td>Dr. Samantha Jones</td>
<td><span class="capsule done" data-toggle="tooltip" data-placement="top" title="" data-original-title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read</span></td>
<td>No</td>
<td class="text-center"><span class="status-btn canceled">Cancelled</span></td>
</tr>
<tr>
<td onclick="$('#patientInfo').toggle();">
<strong class="appt-title green"> Jane Austin <i class="">ID-520</i></strong>
</td>
<td><span class="datetime"><date>08.20.20</date><time> 10:25 PM</time></span></td>
<td>Appointment Schedule</td>
<td class="text-center"><img src="images/sms.png" width="20"> </td>
<td>Dr. Samantha Jones</td>
<td><span class="capsule" data-toggle="tooltip" data-placement="top" title="" data-original-title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Sent</span></td>
<td>Yes</td>
<td class="text-center"><span class="status-btn confirmed">Confirmed</span></td>
</tr>
<tr>
<td onclick="$('#patientInfo').toggle();">
<strong class="appt-title orange">John Doe<i class="">ID-520</i></strong>
</td>
<td><span class="datetime"><date>08.20.20</date><time> 10:25 PM</time></span></td>
<td>Follow up</td>
<td class="text-center"><img src="images/email.png" width="20"></td>
<td>Dr. Samantha Jones</td>
<td><span class="capsule done" data-toggle="tooltip" data-placement="top" title="" data-original-title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read</span></td>
<td>No</td>
<td class="text-center"><span class="status-btn canceled">Cancelled</span></td>
</tr>
<tr>
<td onclick="$('#patientInfo').toggle();">
<strong class="appt-title green"> Jane Austin <i class="">ID-520</i></strong>
</td>
<td><span class="datetime"><date>08.20.20</date><time> 10:25 PM</time></span></td>
<td>Appointment Schedule</td>
<td class="text-center"><img src="images/sms.png" width="20"> </td>
<td>Dr. Samantha Jones</td>
<td><span class="capsule" data-toggle="tooltip" data-placement="top" title="" data-original-title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Sent</span></td>
<td>Yes</td>
<td class="text-center"><span class="status-btn confirmed">Confirmed</span></td>
</tr>
<tr>
<td onclick="$('#patientInfo').toggle();">
<strong class="appt-title orange">John Doe<i class="">ID-520</i></strong>
</td>
<td><span class="datetime"><date>08.20.20</date><time> 10:25 PM</time></span></td>
<td>Follow up</td>
<td class="text-center"><img src="images/email.png" width="20"></td>
<td>Dr. Samantha Jones</td>
<td><span class="capsule done" data-toggle="tooltip" data-placement="top" title="" data-original-title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read</span></td>
<td>No</td>
<td class="text-center"><span class="status-btn canceled">Cancelled</span></td>
</tr>
<tr>
<td onclick="$('#patientInfo').toggle();">
<strong class="appt-title green"> Jane Austin <i class="">ID-520</i></strong>
</td>
<td><span class="datetime"><date>08.20.20</date><time> 10:25 PM</time></span></td>
<td>Appointment Schedule</td>
<td class="text-center"><img src="images/sms.png" width="20"> </td>
<td>Dr. Samantha Jones</td>
<td><span class="capsule" data-toggle="tooltip" data-placement="top" title="" data-original-title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Sent</span></td>
<td>Yes</td>
<td class="text-center"><span class="status-btn confirmed">Confirmed</span></td>
</tr>
<tr>
<td onclick="$('#patientInfo').toggle();">
<strong class="appt-title orange">John Doe<i class="">ID-520</i></strong>
</td>
<td><span class="datetime"><date>08.20.20</date><time> 10:25 PM</time></span></td>
<td>Follow up</td>
<td class="text-center"><img src="images/email.png" width="20"></td>
<td>Dr. Samantha Jones</td>
<td><span class="capsule done" data-toggle="tooltip" data-placement="top" title="" data-original-title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read</span></td>
<td>No</td>
<td class="text-center"><span class="status-btn canceled">Cancelled</span></td>
</tr>
<tr>
<td onclick="$('#patientInfo').toggle();">
<strong class="appt-title green"> Jane Austin <i class="">ID-520</i></strong>
</td>
<td><span class="datetime"><date>08.20.20</date><time> 10:25 PM</time></span></td>
<td>Appointment Schedule</td>
<td class="text-center"><img src="images/sms.png" width="20"> </td>
<td>Dr. Samantha Jones</td>
<td><span class="capsule" data-toggle="tooltip" data-placement="top" title="" data-original-title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Sent</span></td>
<td>Yes</td>
<td class="text-center"><span class="status-btn confirmed">Confirmed</span></td>
</tr>
<tr>
<td onclick="$('#patientInfo').toggle();">
<strong class="appt-title orange">John Doe<i class="">ID-520</i></strong>
</td>
<td>08.20.20, 10:25PM</td>
<td>Follow up</td>
<td class="text-center"><img src="images/email.png" width="20"></td>
<td>Dr. Samantha Jones</td>
<td><span class="capsule done" data-toggle="tooltip" data-placement="top" title="" data-original-title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read</span></td>
<td>No</td>
<td class="text-center"><span class="status-btn canceled">Cancelled</span></td>
</tr>
</tbody>
</table>
</div>
<section class="sidebar" style="display: none;">
<div class="sidebar-list">
<div class="container-fluid">
<div class="row list-row">
<div class="col-2">
<div class="sch-date pending" data-toggle="tooltip" data-placement="top" title="Pending">
<span class="big">23</span>
<span class="sml">Jul</span>
</div>
</div>
<div class="col-8">
<span class="sch-name">
John Doe
</span>
<span class="sch-type">
<i class="fa fa-comment-o"></i> Appointment Schedule sent
</span>
</div>
<div class="col-2">
<div class="pie-wrapper progress-60 style-2">
<span class="label">60<span class="smaller">%</span></span>
<div class="pie">
<div class="left-side half-circle"></div>
<div class="right-side half-circle"></div>
</div>
<div class="shadow"></div>
</div>
</div>
</div>
<div class="row list-row active">
<div class="col-2">
<div class="sch-date confirmed" data-toggle="tooltip" data-placement="top" title="Confirmed">
<span class="big">23</span>
<span class="sml">Jul</span>
</div>
</div>
<div class="col-8">
<span class="sch-name">
Jane Doe
</span>
<span class="sch-type">
<i class="fa fa-comment-o"></i> Appointment Schedule sent
</span>
</div>
<div class="col-2">
<div class="pie-wrapper progress-90 style-2">
<span class="label">90<span class="smaller">%</span></span>
<div class="pie">
<div class="left-side half-circle"></div>
<div class="right-side half-circle"></div>
</div>
<div class="shadow"></div>
</div>
</div>
</div>
<div class="row list-row">
<div class="col-2">
<div class="sch-date canceled" data-toggle="tooltip" data-placement="top" title="Canceled">
<span class="big">23</span>
<span class="sml">Jul</span>
</div>
</div>
<div class="col-8">
<span class="sch-name">
John Doe
</span>
<span class="sch-type">
<i class="fa fa-envelope-o"></i> Appointment Schedule sent
</span>
</div>
<div class="col-2">
<div class="pie-wrapper progress-40 style-2">
<span class="label">40<span class="smaller">%</span></span>
<div class="pie">
<div class="left-side half-circle"></div>
<div class="right-side half-circle"></div>
</div>
<div class="shadow"></div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="focal" style="display: none;">
<article class="messaging">
<div class="messaging-header">
<h2>Jane Doe</h2>
<div class="pie-wrapper progress-90 style-2">
<span class="label">90<span class="smaller">%</span></span>
<div class="pie">
<div class="left-side half-circle"></div>
<div class="right-side half-circle"></div>
</div>
<div class="shadow"></div>
</div>
</div>
<div class="messaging-progress">
<ul class="stage-bar mt2">
<li class="completed"> <span>Appointment</span></li>
<li class="completed"><span>Insurance</span> </li>
<li class="completed"><span>Payment</span></li>
<li class="completed"><span>Follow-up </span></li>
<li class="sent"><span>Survey</span> </li></ul>
</div>
<div class="messaging-content">
<div class="mesgs">
<div class="msg-history">
<!-- <div class="outgoing_msg">
<div class="sent_msg">
<div class="msg-body">
<p>Hello Jane.</p>
<p> You have an upcoming procedure with Dr. Smith at ABC Surgical Center on June 24th, 2020 at 10am.</p>
<p>Does the appointment still work for you? Reply Y/N.</p>
<p> Y - Yes. I will be there. <br>
N - No. I need to reschedule.</p>
</div>
<span class="time_date"> 11:01 AM | June 20 <i class="fa fa-check read" data-toggle="tooltip" data-placement="top" title="Read at 12:00 PM"></i> Read by Jane at 27 Jul 20,12:00 PM</span>
</div>
</div> -->
<div class="chat-divider"><span>Appointment</span></div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>Hello Jane! You have an upcoming procedure with Dr. Smith at ABC Surgical Center on June 24th, 2020 at 10am. Does the appointment still work for you? Reply Y/N. Y - Yes. I will be there.
N - No. I need to reschedule.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read by Jane</span></span>
</div>
</div>
</div>
</div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/avatar-2.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Jane Doe (Patient)</h5>
<div class="received_withd_msg">
<p>Y - Yes. I will be there.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status confirmed"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Appointment Confirmed</span></span>
</div>
</div>
</div>
</div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>Thank you. Your appointment has been confirmed. Please be sure to follow any pre-appointment instructions prior to your visit and arrive at least 30 minutes prior to your scheduled appointment.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read by Jane</span></span>
</div>
</div>
</div>
</div>
<div class="chat-divider"><span>Instructions</span></div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>Hello Jane. You have an upcoming procedure with Dr. Smith at ABC Surgical Center on June 24th, 2020 at 10am. To prepare for this appointment, please follow the instructions provided to you at your last appointment. This includes not eating or drinking 24 hours prior to the appointment and to finish all medication provided according to the instructions given. If you have any questions at all, please call our clinical team at 555-555-5555.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read by Jane</span></span>
</div>
</div>
</div>
</div>
<div class="chat-divider"><span>Insurance</span></div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>Hello Jane. You have an upcoming procedure with Dr. Smith at ABC Surgical Center on June 24th, 2020 at 10am. The insurance we have on file is Blue Cross Blue Shields with member # ending in 1234. Is this the insurance we are to bill for this appointment? Y - Yes. That is the correct insurance. N - No. I need to provide updated insurance.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read by Jane</span></span>
</div>
</div>
</div>
</div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/avatar-2.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Jane Doe (Patient)</h5>
<div class="received_withd_msg">
<p>No. I need to provide updated insurance.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
</div>
</div>
</div>
</div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>To update your insurance, please <a href="">click here</a>.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read by Jane</span></span>
</div>
</div>
</div>
</div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/avatar-2.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Jane Doe (Patient)</h5>
<div class="received_withd_msg">
<p>
<img src="images/insurance-card.png" class="img-fluid">
</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
</div>
</div>
</div>
</div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>Thank you for confirming your insurance. If you have any questions prior to your appointment, please feel free to call us at 555-555-5555.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status confirmed"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Insurance Verified</span></span>
</div>
</div>
</div>
</div>
<div class="chat-divider"><span>Payment</span></div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>Hello John. You have an upcoming procedure with Dr. Smith at ABC Surgical Center on June 24th, 2020 at 10am. Does the appointment still work for you? Reply Y/N.Y - Yes. I will be there.
N - No. I need to reschedule. Your estimated amount due for this appointment is $156.25. If you would like to view or pay your estimate, click here.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read by Jane</span></span>
</div>
</div>
</div>
</div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>Payment of $156.25 recieved on 26 Jul 20. If you have any questions prior to your appointment, please feel free to call us at 555-555-5555.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status confirmed"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Payment Completed</span></span>
</div>
</div>
</div>
</div>
<div class="chat-divider"><span>Follow Up</span></div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>Hello John. This is ABC Ortho. Dr. Smith asked us to reach out and help schedule you for a follow-up visit.
Please call our office at 555-555-5555 to schedule.
Otherwise, let us know of your appointment status:
Reply 1 if you already scheduled
Reply 2 if you do not wish to schedule a follow-up</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read by Jane</span></span>
</div>
</div>
</div>
</div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/avatar-2.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Jane Doe (Patient)</h5>
<div class="received_withd_msg">
<p>
1. Follow-up already scheduled
</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
</div>
</div>
</div>
</div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>Thank you. We have updated our system to indicate you have already scheduled your follow-up.
Please do not hesitate to call us at 555-555-5555 if you have any questions.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status confirmed"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Follow-up Scheduled</span></span>
</div>
</div>
</div>
</div>
<div class="chat-divider"><span>Survey</span></div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>Hello John. You recently visited ABC Ortho on June 24th, 2020 and were seen by Dr. Smith.
In an effort to ensure we are providing the best possible care and experience, would you mind completing this 2-minute survey? If so, please <a href=""> click here</a>
</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read by Jane</span></span>
</div>
</div>
</div>
</div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/avatar-2.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Jane Doe (Patient)</h5>
<div class="received_withd_msg">
<p>
Survey Completed
<i class="fa fa-star"></i><i class="fa fa-star"></i><i class="fa fa-star"></i><i class="fa fa-star"></i><i class="fa fa-star"></i> <br>
<a href="">View Feedback</a>
</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status confirmed"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Survey Completed</span></span>
</div>
</div>
</div>
</div>
</div><!--/history-->
</div>
</div>
</div>
<div class="messaging-chat">
<div class="d-flex align-items-center justify-content-between">
<form class="mb-1 msg-form">
<textarea placeholder="Type your message.."></textarea>
<button class="msg-send"><i class="fa fa-paper-plane"></i></button>
<div class="dropdown msg-type show">
<a class="dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
SMS
</a>
<div class="dropdown-menu" aria-labelledby="dropdownMenuLink">
<a class="dropdown-item" href="#">SMS</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Email</a>
</div>
</div>
</form>
<ul class="msg-actions">
<li>
<div class="dropdown show">
<a class="dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fa fa-edit"></i>
</a>
<div class="dropdown-menu" aria-labelledby="dropdownMenuLink">
<a class="dropdown-item" href="#">Reschedule</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Appointment Reminder</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Payment Estimate</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Insurance Verification</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Instructions</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Follow-up</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Survey</a>
</div>
</div>
</li>
<li>
<a href=""><i class="fa fa-paperclip"></i></a>
</li>
</ul>
</div>
</div>
</article>
<aside class="infobar">
<div class="infobar-header">
<div class="user-image">
<img src="images/avatar-2.png" class="img-fluid">
</div>
<h2>Jane Doe</h2>
<span class="user-status mt-2">Confirmed</span>
</div>
<div class="infobar-section">
<h3>Appointment Details</h3>
<table class="table borderless">
<tr>
<td width="100">Date</td>
<td>25 July 2020, 9:00 PM</td>
</tr>
<tr>
<td>ID</td>
<td>235-555</td>
</tr>
<tr>
<td>Appt Name</td>
<td>ABC</td>
</tr>
</table>
</div>
<div class="infobar-section">
<h3>Providers</h3>
<ul class="list-group mt-4">
<li class="list-group-item d-flex justify-content-between align-items-center">
<img src="images/mps-avtar.png" class="circled" alt="" width="30"> Dr. Samantha Jones
<span class="badge"><i class="fa fa-trash"></i></span>
</li>
</ul>
<div class="sml-btn-group text-center mt-4">
<a href="" class="btn btn-bordered"><i class="fa fa-plus"></i> New Provider</a>
</div>
</div>
<div class="infobar-section">
<h3 class="">Contact Details</h3>
<table class="table borderless">
<tr>
<td width="100">Phone</td>
<td>+1 9988774400</td>
</tr>
<tr>
<td>Email</td>
<td>jane@yahoo.com</td>
</tr>
</table>
</div>
</aside>
</section>
</main>
<!-- Modal -->
<div class="custom-modal" id="patientInfo" style="display: none;">
<ul class="nav nav-tabs" id="myTab" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true">Appointments</a>
</li>
<li class="nav-item">
<a class="nav-link" id="profile-tab" data-toggle="tab" href="#profile" role="tab" aria-controls="profile" aria-selected="false">Messages</a>
</li>
<li class="nav-item">
<a class="nav-link" id="contact-tab" data-toggle="tab" href="#contact" role="tab" aria-controls="contact" aria-selected="false">Account Summary</a>
</li>
</ul>
<div class="tab-content" id="myTabContent">
<div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">
<div class="focal">
<div class="profile-personal container-fluid">
<div class="row list-row">
<div class="col-1">
<div class="sch-date pending" data-toggle="tooltip" data-placement="top" title="" data-original-title="Pending">
<span class="big">23</span>
<span class="sml">Jul</span>
</div>
</div>
<div class="col-2">
<span class="sch-name">
10:00 AM
</span>
<span class="sch-type">
ID - 503
</span>
</div>
<div class="col-9">
<ul class="stage-bar mt2">
<li class="completed"> <span><i class="fa fa-check"></i> Appointment</span></li>
<li class="sent"><span>Insurance</span> </li>
<li class="sent"><span>Payment</span></li>
<li class="sent"><span>Follow-up </span></li>
<li class="sent"><span>Survey</span> </li></ul>
</div>
</div>
<div class="row list-row">
<div class="col-1">
<div class="sch-date pending" data-toggle="tooltip" data-placement="top" title="" data-original-title="Pending">
<span class="big">23</span>
<span class="sml">Feb</span>
</div>
</div>
<div class="col-2">
<span class="sch-name">
4:00 PM
</span>
<span class="sch-type">
ID - 003
</span>
</div>
<div class="col-9">
<ul class="stage-bar mt2">
<li class="completed"> <span><i class="fa fa-check"></i> Appointment</span></li>
<li class="completed"><span><i class="fa fa-check"></i> Insurance</span> </li>
<li class="completed"><span><i class="fa fa-check"></i> Payment</span></li>
<li class="completed"><span><i class="fa fa-check"></i> Follow-up </span></li>
<li class="sent"><span>Survey</span> </li></ul>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="profile" role="tabpanel" aria-labelledby="profile-tab">
<section class="focal" style="display: block;">
<article class="messaging">
<div class="messaging-content">
<div class="mesgs">
<div class="msg-history">
<div class="chat-divider"><span>Appointment</span></div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>Hello Jane! You have an upcoming procedure with Dr. Smith at ABC Surgical Center on June 24th, 2020 at 10am. Does the appointment still work for you? Reply Y/N. Y - Yes. I will be there.
N - No. I need to reschedule.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read by Jane</span></span>
</div>
</div>
</div>
</div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/avatar-2.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Jane Doe (Patient)</h5>
<div class="received_withd_msg">
<p>Y - Yes. I will be there.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status confirmed"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Appointment Confirmed</span></span>
</div>
</div>
</div>
</div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>Thank you. Your appointment has been confirmed. Please be sure to follow any pre-appointment instructions prior to your visit and arrive at least 30 minutes prior to your scheduled appointment.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read by Jane</span></span>
</div>
</div>
</div>
</div>
<div class="chat-divider"><span>Instructions</span></div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>Hello Jane. You have an upcoming procedure with Dr. Smith at ABC Surgical Center on June 24th, 2020 at 10am. To prepare for this appointment, please follow the instructions provided to you at your last appointment. This includes not eating or drinking 24 hours prior to the appointment and to finish all medication provided according to the instructions given. If you have any questions at all, please call our clinical team at 555-555-5555.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read by Jane</span></span>
</div>
</div>
</div>
</div>
<div class="chat-divider"><span>Insurance</span></div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>Hello Jane. You have an upcoming procedure with Dr. Smith at ABC Surgical Center on June 24th, 2020 at 10am. The insurance we have on file is Blue Cross Blue Shields with member # ending in 1234. Is this the insurance we are to bill for this appointment? Y - Yes. That is the correct insurance. N - No. I need to provide updated insurance.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read by Jane</span></span>
</div>
</div>
</div>
</div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/avatar-2.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Jane Doe (Patient)</h5>
<div class="received_withd_msg">
<p>No. I need to provide updated insurance.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
</div>
</div>
</div>
</div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>To update your insurance, please <a href="">click here</a>.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read by Jane</span></span>
</div>
</div>
</div>
</div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/avatar-2.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Jane Doe (Patient)</h5>
<div class="received_withd_msg">
<p>
<img src="images/insurance-card.png" class="img-fluid">
</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
</div>
</div>
</div>
</div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>Thank you for confirming your insurance. If you have any questions prior to your appointment, please feel free to call us at 555-555-5555.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status confirmed"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Insurance Verified</span></span>
</div>
</div>
</div>
</div>
<div class="chat-divider"><span>Payment</span></div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>Hello John. You have an upcoming procedure with Dr. Smith at ABC Surgical Center on June 24th, 2020 at 10am. Does the appointment still work for you? Reply Y/N.Y - Yes. I will be there.
N - No. I need to reschedule. Your estimated amount due for this appointment is $156.25. If you would like to view or pay your estimate, click here.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read by Jane</span></span>
</div>
</div>
</div>
</div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>Payment of $156.25 recieved on 26 Jul 20. If you have any questions prior to your appointment, please feel free to call us at 555-555-5555.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status confirmed"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Payment Completed</span></span>
</div>
</div>
</div>
</div>
<div class="chat-divider"><span>Follow Up</span></div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>Hello John. This is ABC Ortho. Dr. Smith asked us to reach out and help schedule you for a follow-up visit.
Please call our office at 555-555-5555 to schedule.
Otherwise, let us know of your appointment status:
Reply 1 if you already scheduled
Reply 2 if you do not wish to schedule a follow-up</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read by Jane</span></span>
</div>
</div>
</div>
</div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/avatar-2.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Jane Doe (Patient)</h5>
<div class="received_withd_msg">
<p>
1. Follow-up already scheduled
</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
</div>
</div>
</div>
</div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>Thank you. We have updated our system to indicate you have already scheduled your follow-up.
Please do not hesitate to call us at 555-555-5555 if you have any questions.</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status confirmed"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Follow-up Scheduled</span></span>
</div>
</div>
</div>
</div>
<div class="chat-divider"><span>Survey</span></div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/mps-avtar.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Dr. Samantha Jones (Provider)</h5>
<div class="received_withd_msg">
<p>Hello John. You recently visited ABC Ortho on June 24th, 2020 and were seen by Dr. Smith.
In an effort to ensure we are providing the best possible care and experience, would you mind completing this 2-minute survey? If so, please <a href=""> click here</a>
</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Read by Jane</span></span>
</div>
</div>
</div>
</div>
<div class="incoming_msg">
<div class="incoming_msg_img"> <img src="images/avatar-2.png" class="circled" alt=""> </div>
<div class="received_msg">
<h5>Jane Doe (Patient)</h5>
<div class="received_withd_msg">
<p>
Survey Completed
<i class="fa fa-star"></i><i class="fa fa-star"></i><i class="fa fa-star"></i><i class="fa fa-star"></i><i class="fa fa-star"></i> <br>
<a href="">View Feedback</a>
</p>
<div class="msg-meta">
<span class="time_date"> 11:01 AM | June 21</span>
<span class="meta-status confirmed"><span data-toggle="tooltip" data-placement="top" title="At 28 July 20, 12:20 PM"><i class="fa fa-check"></i> Survey Completed</span></span>
</div>
</div>
</div>
</div>
</div><!--/history-->
</div>
</div>
<div class="messaging-chat">
<div class="d-flex align-items-center justify-content-between">
<ul class="msg-actions">
<li>
<div class="dropdown show">
<a class="dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fa fa-edit"></i>
</a>
<div class="dropdown-menu" aria-labelledby="dropdownMenuLink">
<div class="text-center">
<a class="btn btn-alpha" href="javascript:;" data-toggle="modal" data-target="#newTemplate">Create New Template</a>
</div>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Reschedule</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Appointment Reminder</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Payment Estimate</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Insurance Verification</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Instructions</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Follow-up</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Survey</a>
</div>
</div>
</li>
<li>
<a href=""><i class="fa fa-paperclip"></i></a>
</li>
</ul>
<form class="mb-1 msg-form">
<textarea placeholder="Type your message.."></textarea>
<button class="msg-send"><i class="fa fa-paper-plane"></i></button>
<div class="dropdown msg-type show">
<a class="dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
SMS
</a>
<div class="dropdown-menu" aria-labelledby="dropdownMenuLink">
<a class="dropdown-item" href="#">SMS</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Email</a>
</div>
</div>
</form>
</div>
</div>
</div>
</article>
</section>
<div class="tab-pane fade" id="contact" role="tabpanel" aria-labelledby="contact-tab">
<div class="focal">
<div class="msg-history">
<h5 class="my-4">Account Summary</h5>
<table class="table table-bordered table-bill">
<thead>
<tr>
<th width="130">Service Date</th>
<th width="110">Invoice #</th>
<th width="250">Charge Description</th>
<th>Provider</th>
<th>Location</th>
<th width="150">Amount</th>
</tr>
</thead>
<tbody>
<tr class="highlighted">
<td>6/18/2010</td>
<td>3492719</td>
<td>Outpatient/Office consult</td>
<td>Dr. John Smith</td>
<td>Onsite Imaging Ctr</td>
<td>$290.00</td>
</tr>
<tr class="highlighted">
<td></td>
<td>3492719</td>
<td>Exam – 30 minute</td>
<td>Dr. Jim Bezamat</td>
<td>Medical Ctr East</td>
<td>$59.00</td>
</tr>
<tr class="highlighted">
<td></td>
<td>3492719</td>
<td>Xray Shoulder 2+ Views</td>
<td>Dr. John Smith</td>
<td>Onsite Imaging Ctr</td>
<td>$290.00</td>
</tr>
<tr class="highlighted">
<td></td>
<td>3492719</td>
<td>Exam – 30 minute</td>
<td>Dr. Jim Bezamat</td>
<td>Medical Ctr East</td>
<td>$59.00</td>
</tr>
<tr class="">
<td>1/4/2020</td>
<td>3497238</td>
<td>Xray Shoulder 2+ Views</td>
<td>Dr. John Smith</td>
<td>Onsite Imaging Ctr</td>
<td>$290.00</td>
</tr>
<tr class="">
<td></td>
<td>3497238</td>
<td>Exam – 30 minute</td>
<td>Dr. Jim Bezamat</td>
<td>Medical Ctr East</td>
<td>$59.00</td>
</tr>
</tbody>
</table>
<table class="table table-summary">
<tbody>
<tr>
<td width="100"></td>
<td colspan="3">Charges/Credits/Payments</td>
<td width="150"><strong>$349.00</strong></td>
</tr>
<tr>
<td></td>
<td colspan="3">Account Credit Balance <i class="fa fa-question info" data-toggle="tooltip" data-placement="top" title="" data-original-title="A pending credit on the account. Please note that credits may be intended for specific charges that have not been transferred to patient responsibility yet."></i></td>
<td><strong> ($223.04)</strong></td>
</tr>
<tr>
<td></td>
<td colspan="3">Total Amount Due</td>
<td><strong>$125.96</strong></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div><!--Message ends-->
<aside class="infobar">
<div class="infobar-header">
<div class="user-image">
<img src="images/avatar-2.png" class="img-fluid">
</div>
<h2>Jane Austin</h2>
<span class="user-status mt-2">Confirmed</span>
</div>
<div class="infobar-section">
<h3>Guarantor Details</h3>
<table class="table borderless">
<tbody><tr>
<td width="100">Name</td>
<td>Jane Austin</td>
</tr>
<tr>
<td>Phone</td>
<td>+1-987-235-555</td>
</tr>
<tr>
<td>Email</td>
<td>jane@mps.com</td>
</tr>
</tbody></table>
</div>
<div class="infobar-section">
<h3>Providers</h3>
<ul class="list-group mt-4">
<li class="list-group-item d-flex justify-content-between align-items-center">
<img src="images/mps-avtar.png" class="circled" alt="" width="30"> Dr. Samantha Jones
<span class="badge"><i class="fa fa-trash"></i></span>
</li>
</ul>
<div class="sml-btn-group text-center mt-4">
<a href="" class="btn btn-bordered"><i class="fa fa-plus"></i> New Provider</a>
</div>
</div>
<div class="infobar-section">
<h3 class="">Contact Details</h3>
<table class="table borderless">
<tbody><tr>
<td width="100">Phone</td>
<td>+1 9988774400</td>
</tr>
<tr>
<td>Email</td>
<td>jane@yahoo.com</td>
</tr>
</tbody></table>
</div>
</aside>
</div>
</div>
<!-- Modal -->
<div class="modal fade" id="newTemplate" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="">Create New Template</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="template-wrapper">
<div class="modal-form">
<form>
<div class="form-group">
<label for="exampleInputEmail1">Template Name</label>
<input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email">
</div>
<div class="form-group">
<label for="exampleInputPassword1">Message</label>
<textarea class="form-control" rows="8">Hello {Guarantor_First_Name}, </textarea>
</div>
<div class="form-group">
<label>Insert Placeholders</label><br>
<span class="capsule">{Guarantor_First_Name}</span>
<span class="capsule"> {Guarantor_DOB}</span>
<span class="capsule"> {Guarantor_Last_Name}</span>
<span class="capsule"> {Guarantor_Instruction_Link}</span>
</div>
</form>
</div>
<div class="modal-preview">Hello Jane, </div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div> <!-- / Template ends -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script src="js/script.js"></script>
<script type="text/javascript" src="js/datepicker.min.js"></script>
<script>$('#datepicker').datepicker({uiLibrary: 'bootstrap4'});</script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.21/js/dataTables.bootstrap4.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/fixedheader/3.1.7/js/dataTables.fixedHeader.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/fixedheader/3.1.7/css/fixedHeader.bootstrap4.min.css">
<script type="text/javascript">
$(document).ready(function() {
$('#scheduled').DataTable( {
"paging": false,
"info": false,
"fixedHeader": true
} );
} );
</script>
</body>
</html>