.sidebar {
	background: #343a40;
    flex-basis: 280px;
    flex-grow: 0;
    flex-shrink: 0;
	overflow-x: hidden;
	overflow-y: auto;
	scrollbar-gutter: stable;
	scrollbar-width: thin;
	width: 280px;
}

.sidebar ul {
	display: table;
	table-layout: fixed;
	text-align: left;
	width: 100%;
}

.sidebar li {
	display: table-row;
	width: 100%;
}

.sidebar i {
	display: table-cell;
	text-align: center;
	width: 40px;
}

.sidebar a {
	display: table-cell;
	padding-left: 10px;
	text-align: left;
}

.sidebar a:hover {
	background-color: #52575C;
}

.sidebar .colspan {
	display: block;
}

#notifications-bar {
	background: #FFF3CD;
	display: none;
	left: 0px;
	padding: 15px;
	position: fixed;
	top: 0px; 
	width: 100%;
	z-index: 999;
}

#patientsbar {
	background: #ffffff;
	border-bottom: solid 1px #c0c0c0;
	border-top: solid 1px #c0c0c0;
	height: calc(100vh - 275px);
	overflow-x: hidden;
	overflow-y: auto;
	scrollbar-gutter: stable;
	scrollbar-width: thin;
	width: 280px;
}

#patientsbar #patients-table {
	margin-top: -10px;
}

#patientsbar table.dataTable table {
	border: none !important;
	border-bottom-width: 0px !important;
}

#patientsbar table.dataTable td {
	border-bottom-width: 0px !important;
	padding-bottom: 6px;
}

#patientsbar table.dataTable tr {
	border-bottom-width: 0px !important;
	padding-bottom: 6px;
}

#patientsbar #patients-table_info {
	display: none;
}

#patientsbar .card {
	background-color: #F8F9FA !important;
	border-radius: 10px;
	color: #000000;
	height: 80px;
	padding: 6px;
	width: 250px;
}

#patientsbar .card:hover {
	background-color: #CFE2FF !important;
}

#patientsbar table.dataTable tbody tr.selected {
	box-shadow: none !important;
}

#patientsbar table.dataTable tbody tr.selected td {
	box-shadow: none !important;
}

#patientsbar table.dataTable tbody tr.selected .card {
	background-color: #CFE2FF !important;
	border-color: #0D6EFD;
	border-style: solid 2px;
}

#patientsbar .card .vibrate {
	background-color: #dc3545;
	border-color: #dc3545;
	border-radius: 6px;
	border-style: solid 2px;
	color: #ffffff;
	font-weight: bold;
	text-align: center;
	transform: scale(0.75);
	box-shadow: 0 0 0 rgba(0, 0, 0, 1);
	animation: anim-vibrate 2s infinite;
	margin-left: auto;
	margin-right: auto;
	margin-top: 6px;
	width: 140px;
	position: relative;
	z-index: 999;
}

#patientsbar .card .vibrate a {
	color: #ffffff;
	cursor: pointer;
	text-decoration: none;
}

@keyframes anim-vibrate {
	0% {
		transform: scale(0.75);
		box-shadow: 0 0 0 0 rgba(252, 3, 3, 0.7);
	}
	70% {
		transform: scale(0.90);
		box-shadow: 0 0 0 0.6rem rgba(0, 0, 0, 0);
	}
	100% {
		transform: scale(0.75);
		box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
	}
}

#patientsbar .card #photo {
	align-items: center;
	overflow-x: hidden;
	padding-left: 6px;
	padding-top: 6px;
	vertical-align: top;
	width: 48px;
}

#patientsbar .card #photo .smallphoto {
	max-width: 32px;
}

#patientsbar .card #user {
	overflow-x: hidden;
	padding-left: 0px;
	padding-top: 6px;
	vertical-align: top;
	width: 140px;
}

#patientsbar .card #user #name {
	width: 110px;
}

#patientsbar .card #actions {
	padding-left: 6px;
	width: 32px;
}

#patientsbar .view-link {
	cursor: pointer;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 1;
}

#patientsbar .phone-link {
	cursor: pointer;
	position: relative;
	z-index: 2;
}

#patientsbar .card [id$="-devices"] {
	display: inline-block;
	position: relative;
	z-index: 3;
}

#patientsbar #callsinfo {
	bottom: 10px;
	height: 200px;
	left: 10px;
	overflow-x: hidden;
	overflow-y: auto;
	position: absolute;
	scrollbar-width: thin;
	width: 270px;
}

#patientsbar #calls-table {
	margin-left: -6px;
	margin-top: -10px;
}

#patientsbar #calls-table_info {
	display: none;
}

#patientsbar #calls-table .dt-column-title {
	font-size: .75em;
    padding-bottom: 4px;
    padding-left: 2px;
    padding-right: 2px;
}

#patientsbar #calls-table thead th {
    padding-bottom: 0px;
    padding-left: 6px;
    padding-right: 2px;
    padding-top: 0px;
}

#patientsbar #calls-table tbody td {
	font-size: .75em;
    padding-bottom: 4px;
    padding-left: 2px;
    padding-right: 2px;
}

#patientsbar #calls-table tbody .dt-time {
	background: #EAEAEA;
	border: solid 1px #FFFFFF;
	width: 60px;
}

#patientsbar #calls-table tbody .dt-status {
	background: #EAEAEA;
	border: solid 1px #FFFFFF;
	width: 100px;
}

#patientsbar #calls-table tbody .dt-name {
	background: #EAEAEA;
	border: solid 1px #FFFFFF;
	width: 140px;
}

#patientsinfo {
	border-left: solid 1px #c0c0c0;
	border-bottom: solid 1px #c0c0c0;
	border-right: solid 1px #c0c0c0;
	border-top: solid 1px #c0c0c0;
	height: calc(100vh - 275px);
	overflow-x: hidden;
	overflow-y: auto;	
	scrollbar-gutter: stable;
	scrollbar-width: thin;
}

#patientsinfo .details {
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 20px;
}

#callscreen {
	background: #000000;
	border-bottom: solid 1px #c0c0c0;
	border-right: solid 1px #c0c0c0;
	border-top: solid 1px #c0c0c0;
	height: calc(100vh - 275px);
	overflow-x: hidden;
	overflow-y: hidden;
	position: relative;
}

#additionalinfo {
	border-bottom: solid 1px #c0c0c0;
	border-right: solid 1px #c0c0c0;
	border-top: solid 1px #c0c0c0;
	height: calc(100vh - 275px);
	padding: 0px;
	position: relative;
}

#historyinfo {
	height: -moz-calc(100% - 42px);
	height: -webkit-calc(100% - 42px);
	height: calc(100% - 42px);
	overflow-x: hidden;
	overflow-y: auto;	
	padding: 10px;
	position: absolute;
	scrollbar-gutter: stable;
	scrollbar-width: thin;
}

#historyinfo .details {
	padding-left: 20px;
	padding-right: 10px;
	padding-top: 10px;
}

#historyinfo .details .timeline {
	margin: 0px auto;
}

#historyinfo .details .outer {
	border-left: 4px solid #CED4DA;
	position: relative;
}

#historyinfo .details .outer .hideborder {
	background: #F8FAFC;
	left: -4px;
	height: 16px;
	position: absolute;
	top: 0px;
	width: 4px;
	z-index: 1;
}

#historyinfo .details .timeline .card {
	border-radius: 8px;
	margin: 0 0 20px 26px;
	max-width: 400px;
	padding-bottom: 10px;
	padding-left: 20px;
	padding-right: 20px;
	position: relative;
}

#historyinfo .details .timeline .info {
	display: flex;
	flex-direction: column;
	gap: 0px;
}

#historyinfo .details .timeline .title {
	color: #0D6EFD;
	position: relative;
}

#historyinfo .details .timeline .title::before {
	background: white;
	border: 4px solid #0D6EFD;
	border-radius: 999px;
	color: #0D6EFD;
	content: " ";
	font-size: 14px;
	font-weight: bold;
	height: 28px;
	left: -63px;
	margin-top: 15px;
	position: absolute;
	text-align: center;
	width: 28px;
}

#historyinfo .details .timeline .complete {
	color: #0D6EFD;
	position: relative;
}

#historyinfo .details .timeline .complete::before {
	background: #28A745;
	border: 4px solid #28A745;
	border-radius: 999px;
	color: white;
	content: "\2714";
	font-size: 14px;
	font-weight: bold;
	height: 28px;
	left: -63px;
	margin-top: 15px;
	position: absolute;
	text-align: center;
	width: 28px;
}

#historyinfo .details .timeline .arrow::before {
	border: medium solid #CED4DA;
	border-color: transparent #CED4DA transparent transparent;
	border-width: 10px 10px 10px 0;
	content: " ";
	height: 0;
	left: -10px;
	position: absolute;
	top: 20px;
	width: 0;
	z-index: 1;
}

#notesinfo {
	height: -moz-calc(100% - 42px);
	height: -webkit-calc(100% - 42px);
	height: calc(100% - 42px);
	overflow-x: hidden;
	overflow-y: auto;	
	padding: 10px;
	position: absolute;
	scrollbar-gutter: stable;
	scrollbar-width: thin;
}

#notesinfo .details {
	padding-left: 20px;
	padding-right: 10px;
	padding-top: 10px;
}

#prescriptionsinfo {
	border-left: solid 1px #c0c0c0;
	height: 220px;
	overflow-x: auto;
	overflow-y: auto;	
	scrollbar-gutter: stable;
	scrollbar-width: thin;
}

#prescriptionsinfo .details {
	padding-bottom: 0px;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 20px;
}

#calldialog #user-image {
	animation: pulse 1.5s infinite linear;
	background: #ffffff;
	box-shadow: 0 0 0 0 #0004;
	height: 256px;
	position: relative;
	width: 256px;

 }

#calldialog #user-image:before,
#calldialog #user-image:after {
	animation: inherit;
	animation-delay: -0.5s;
	border-radius: inherit;
	box-shadow: 0 0 0 0 #0004;
	content: "";
	inset: 0;
	position: absolute;
}

#calldialog #user-image:after {
	animation-delay: -1s;
}

@keyframes pulse {
	100% {box-shadow: 0 0 0 40px #0000}
}

#calldialog #card-header,
#calldialog #card-image,
#calldialog #card-info,
#calldialog #card-buttons {
	display: flex;
	justify-content: center;
	align-items: center;
}

.mainphoto {
	border: solid 1px #0094FF;
	height: 200px;
	margin: 10px;
	padding: 5px;
	width: 200px;
}

.photos {
	border: solid 1px #0094FF;
	height: 200px;
	margin: 10px;
	padding: 5px;
	width: 200px;
}

.smallphoto {
	border: none;
	height: 32px;
	width: auto;
}

.mediumphoto {
	border: none;
	height: 96px;
	width: auto;
}

th.dt-type-date, td.dt-type-date {
	text-align: left !important;
}

.dt-container .dt-layout-full > :only-child {
	width: 100% !important;
}

thead, tbody, tfoot, tr, td, th {
	border-top: none !important;
}

.card {
	background-color: white !important;
}

.card-body row {
	background-color: white !important;
}

.action_btn {
	cursor: pointer;
}

.btn-light {
	color: black !important;
}

.modal {
	background-color: rgb(0,0,0);
	background-color: rgba(0,0,0,0.4);
	display: none;
	height: 100%;
	left: 0;
	overflow: auto;
	padding: 100px;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 1;
}

.modal-content {
	background-color: #f8fafc;
	border: 1px solid #888;
	bottom: 'auto';
	left: '50%';
	margin: auto;
	padding: 20px;
	right: 'auto';
	top: '50%';
	transform: 'translate(-50%,-50%)';
	width: 480px;
}

.main-button {
	background-size: cover;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	height: 50px;
	margin-right: 12px;
	padding: 2px;
	width: 50px;
}

.participants-list {
	background-color: #373737;
	color: white;
	height: 100%;
	overflow-y: scroll;
	position: absolute;
	right: 0;
	top: 0;
	width: 300px;
}

.participants-header {
	border-bottom: 1px solid #626262;
	font-size: 18px;
	text-align: center;
}

.participant {
	align-items: center;
	border-bottom: 1px solid #626262;
	display: flex;
	height: 70px;
}

.participant-image {
	background-color: #ffffff;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	border: 1px solid #ccc;
	border-radius: 4px;
	height: 48px;
	margin: 0 10px;
	width: 48px;
}

.participant-button {
	background-size: cover;
	border-radius: 4px;
	cursor: pointer;
	height: 24px;
	margin-right: 8px;
	padding: 2px;
	width: 24px;
}

.status-online {
	background-color: lime;
	border-radius: 50%;
	height: 12px;
	margin-right: 8px;
	width: 12px;
}

.status-offline {
	background-color: #626262;
	border-radius: 50%;
	height: 12px;
	margin-right: 8px;
	width: 12px;
}

.modal-content .dropdown button {
	border: solid 1px #CCCCCC;
	border-radius: 4px;
	overflow: hidden;
	text-align: left;
	width: 100%;
}

.modal-content .dropdown-toggle::after {
	display: none !important;
}

.modal-content .caret {
	float: right;
	display: block;
}

.modal-content .dropdown-menu {
	border: solid 1px #A0A0A0;
	border-radius: 4px;
    -webkit-box-shadow: 0 0 1px #A0A0A0, 0 0 1px #A0A0A0;
    box-shadow: 0 0 1px #A0A0A0, 0 0 1px #A0A0A0;
    padding-left: 4px;
    padding-right: 4px;
}

.modal-content .dropdown-menu input[type=checkbox] {
	margin-left: -4px;
	margin-right: 10px;
}

.modal-content .dropdown-menu li:hover {
	background-color: #E0E0E6;
}

.dlg-box {
	font-family: Nunito !important;
	font-size: 11px !important;
	max-width: 480px !important;
}

.dlg-heading {
	font-weight: bold !important;
}

.dlg-icon-question::before,
.dlg-icon-question:before {
    content: "\3f";
	font: var(--fa-font-solid);
}

.fc-toolbar-title {
    text-transform: lowercase;
}

.fc-toolbar-title:first-letter {
    text-transform: uppercase;
}

.fc-col-header-cell {
	background: #000000;
}

.fc-col-header-cell-cushion {
	color: #FFFFFF;
	text-decoration: none;
    text-transform: lowercase;
}

.fc-col-header-cell-cushion:first-letter {
    text-transform: uppercase;
}

.fc-daygrid-day-number {
	text-decoration: none;
}

.fc-h-event .fc-event-main-frame {
	display: block;
}
