/* Common app calendar */

.app-calendar-trigger
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	margin: 0;
	padding: 0;
	border: 1px solid #b8c3d4;
	border-radius: 4px;
	background: #ffffff;
	color: #4b5a74;
	cursor: pointer;
	vertical-align: middle;
}

.app-calendar-trigger:hover
{
	background: #eef3fa;
	border-color: #8ea4c5;
}

.app-calendar-popup
{
	display: none;
	position: absolute;
	z-index: 10001;
}

.app-calendar-popup.show
{
	display: block;
}

.app-calendar-panel
{
	width: 248px;
	padding: 10px;
	border: 1px solid #c7d2df;
	border-radius: 8px;
	background: #ffffff;
	box-shadow: 0 16px 30px rgba(32, 43, 62, 0.18);
	box-sizing: border-box;
}

.app-calendar-header
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	margin-bottom: 10px;
}

.app-calendar-title
{
	flex: 1;
	text-align: center;
	font-size: 14px;
	font-weight: 600;
	color: #2e3a4d;
}

.app-calendar-nav
{
	width: 30px;
	height: 30px;
	padding: 0;
	border: 1px solid #c8d2de;
	border-radius: 6px;
	background: #f7f9fc;
	color: #42526a;
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
}

.app-calendar-nav:hover
{
	background: #ecf2fa;
	border-color: #9bb0ca;
}

.app-calendar-weekdays,
.app-calendar-days
{
	display: grid;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	gap: 4px;
}

.app-calendar-weekdays
{
	margin-bottom: 6px;
}

.app-calendar-weekday
{
	height: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 11px;
	font-weight: 600;
	color: #687589;
}

.app-calendar-weekday.is-sunday
{
	color: #b34a43;
}

.app-calendar-weekday.is-saturday
{
	color: #3f6ea3;
}

.app-calendar-day
{
	height: 30px;
	padding: 0;
	border: 1px solid transparent;
	border-radius: 6px;
	background: #ffffff;
	color: #303845;
	font-size: 12px;
	cursor: pointer;
}

.app-calendar-day:hover
{
	background: #eef4fb;
	border-color: #bfd0e6;
}

.app-calendar-day.is-other-month
{
	color: #a0a9b7;
}

.app-calendar-day.is-sunday
{
	color: #b34a43;
}

.app-calendar-day.is-saturday
{
	color: #3f6ea3;
}

.app-calendar-day.is-today
{
	border-color: #7fa1d0;
	font-weight: 700;
}

.app-calendar-day.is-selected
{
	background: #2f6db3;
	border-color: #2f6db3;
	color: #ffffff;
}

.app-calendar-day.is-selected.is-sunday,
.app-calendar-day.is-selected.is-saturday
{
	color: #ffffff;
}