Date Time Picker

const today = new Date();
const currentYear = today.getFullYear();
const currentMonth = today.getMonth();

new ac.calendars.DateTimePicker(
	{
		min: new Date(currentYear, currentMonth, 7, 11, 0, 0),
		max: new Date(currentYear, currentMonth, 19, 12, 30, 0),
		value: new Date(currentYear, currentMonth, 11, 11, 0, 0)
	},
	"#cntlRangeDateTimePicker"
);

<input id="cntlDateTimePicker" />

new ac.calendars.DateTimePicker({ renderDayCell: renderDayCell }, "#cntlDateTimePicker");

function renderDayCell(args) {
	if (args.date.getDate() === 7) {
		let span = document.createElement("span");
		span.setAttribute("class", "a-icons a-highlight doctor");
		args.element.firstElementChild.setAttribute("title", "Doctors Appointment");
		args.element.setAttribute("title", "Doctors Appointment");
		args.element.appendChild(span);
	}
	if (args.date.getDate() === 11) {
		let span = document.createElement("span");
		span.setAttribute("class", "a-icons a-highlight pto");
		args.element.firstElementChild.setAttribute("title", "PTO");
		args.element.setAttribute("title", "PTO");
		args.element.appendChild(span);
	}
	if (args.date.getDate() === 23) {
		let span = document.createElement("span");
		span.setAttribute("class", "a-icons a-highlight vacation");
		args.element.firstElementChild.setAttribute("title", "Vacation");
		args.element.setAttribute("title", "Vacation");
		args.element.appendChild(span);
	}
}

<input id="cntlDateTimePicker" />

span.a-icons.a-highlight.doctor:before {
	color: #ff5b57;
}
span.a-icons.a-highlight.pto:before {
	color: #8753de;
}
span.a-icons.a-highlight.vacation:before {
	color: #f59c1a;
}