﻿.ndp-container {
	padding: 5px;
	border-radius: 4px;
	display: inline-block;
	overflow: hidden;
	position: absolute;
	max-width: 266px;
	z-index: 1000;
	font-family: "Open Sans",sans-serif;
	border: 1px solid #ccc;
	box-shadow: 0 4px 12px rgba(0,0,0,.15)
}

	.ndp-container.ndp-inline {
		position: relative;
		z-index: unset
	}

	.ndp-container.fade {
		opacity: 0;
		transition: opacity .3s ease-in-out
	}

		.ndp-container.fade.in {
			opacity: 1
		}

	.ndp-container.slide {
		opacity: 0;
		transform: translateY(20px);
		transition: transform .3s ease,opacity .3s ease
	}

		.ndp-container.slide.in {
			opacity: 1;
			transform: translateY(0)
		}

	.ndp-container .ndp-table {
		border-collapse: separate;
		border-spacing: 2px
	}

	.ndp-container.ndp-light {
		background: #fff;
		color: #000
	}

		.ndp-container.ndp-light .ndp-table {
			background: #fff
		}

	.ndp-container.ndp-dark, .ndp-container.ndp-dark .ndp-table {
		background: #16171a;
		color: #fff
	}

	.ndp-container a {
		text-decoration: none
	}

.ndp-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-bottom: 5px
}

.ndp-container.ndp-light .ndp-header {
	border-bottom: 1px solid #efefef
}

.ndp-container.ndp-dark .ndp-header {
	border-bottom: 1px solid #868e96
}

.ndp-header .ndp-header-link {
	padding: 9px 10px;
	cursor: pointer;
	width: 50%;
	text-align: center;
	border-radius: 5px;
	display: grid;
	max-height: 32px
}

.ndp-container.ndp-light .ndp-header .ndp-header-link {
	color: #4a4a4a
}

.ndp-container.ndp-dark .ndp-header .ndp-header-link {
	color: #fff
}

.ndp-header button:disabled {
	background: #ccc;
	color: #666;
	cursor: not-allowed
}

.ndp-header-display {
	font-size: 14px;
	line-height: 14px
}

.ndp-header .ndp-header-link:has(.ndp-header-display-english) {
	padding-top: 2px;
	padding-bottom: 0;
	height: 32px
}

.ndp-header-display-english {
	font-size: 10px;
	line-height: 10px;
	opacity: .5
}

.ndp-table th {
	font-weight: 600
}

.ndp-container.ndp-light .ndp-table td:nth-child(7), .ndp-container.ndp-light .ndp-table th:nth-child(7) {
	color: #fa5252
}

.ndp-container.ndp-dark .ndp-table td:nth-child(7), .ndp-container.ndp-dark .ndp-table th:nth-child(7) {
	color: #f87171
}

.ndp-table td, .ndp-table th {
	text-align: center;
	height: 34px;
	width: 34px;
	font-size: 14px;
	padding: 0;
	border-radius: 5px;
	cursor: pointer
}

	.ndp-table td .ndp-mini-english-date {
		font-size: 10px;
		vertical-align: sub;
		padding-left: 2px;
		opacity: .5
	}

.ndp-container.ndp-dark .ndp-table th, .ndp-container.ndp-light .ndp-table th {
	color: #979797
}

.ndp-container.ndp-light .ndp-table {
	color: #000
}

	.ndp-container.ndp-light .ndc-nav-button.ndp-disabled, .ndp-container.ndp-light .ndp-month-button.ndp-disabled, .ndp-container.ndp-light .ndp-table td.ndp-disabled {
		color: #ccc;
		cursor: not-allowed
	}

.ndp-container.ndp-dark .ndc-nav-button.ndp-disabled, .ndp-container.ndp-dark .ndp-month-button.ndp-disabled, .ndp-container.ndp-dark .ndp-table td.ndp-disabled {
	color: #8e8e8e;
	cursor: not-allowed
}

.ndp-container.ndp-light .ndp-header-link:hover, .ndp-container.ndp-light .ndp-table td:hover {
	background: #f0f0f0
}

.ndp-container.ndp-dark .ndp-header-link:hover, .ndp-container.ndp-dark .ndp-table td:hover {
	background: #484848
}

.ndp-month-selection, .ndp-year-selection {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	min-height: 190px;
	align-content: start
}

.ndp-month-button, .ndp-year-button {
	margin: 5px;
	padding: 10px;
	border-radius: 4px;
	cursor: pointer;
	font-size: 14px;
	width: 29%;
	text-align: center;
	box-sizing: border-box;
	height: 40px
}

.ndp-container.ndp-light .ndp-month-button, .ndp-container.ndp-light .ndp-year-button {
	color: #4a4a4a
}

.ndp-container.ndp-dark .ndp-month-button, .ndp-container.ndp-dark .ndp-year-button {
	color: #fff
}

	.ndp-container.ndp-dark .ndp-month-button.ndp-current, .ndp-container.ndp-dark .ndp-year-button.ndp-current, .ndp-container.ndp-light .ndp-month-button.ndp-current, .ndp-container.ndp-light .ndp-year-button.ndp-current {
		color: #4eb5e6
	}

.ndp-container.ndp-light .ndp-month-button.ndp-selected, .ndp-container.ndp-light .ndp-year-button.ndp-selected {
	background-color: #4eb5e6;
	color: #fff
}

.ndp-container.ndp-dark .ndp-month-button.ndp-selected, .ndp-container.ndp-dark .ndp-year-button.ndp-selected {
	background-color: #005cb2;
	color: #fff
}

.ndp-container.ndp-light .ndp-month-button:hover:not(.ndp-selected), .ndp-container.ndp-light .ndp-year-button:hover:not(.ndp-selected) {
	background: #f0f0f0
}

.ndp-container.ndp-dark .ndp-month-button:hover:not(.ndp-selected), .ndp-container.ndp-dark .ndp-year-button:hover:not(.ndp-selected) {
	background: #484848
}

.ndp-container.ndp-dark .ndp-table td.ndp-today, .ndp-container.ndp-light .ndp-table td.ndp-today {
	color: #5abae8;
	font-weight: 700
}

	.ndp-container.ndp-dark .ndp-table td.ndp-today.ndp-disabled, .ndp-container.ndp-light .ndp-table td.ndp-today.ndp-disabled {
		opacity: .7
	}

.ndp-table td.ndp-selected {
	border-radius: 5px;
	font-weight: 700
}

.ndp-container.ndp-light .ndp-table td.ndp-selected {
	background: #45bced;
	color: #fff
}

.ndp-container.ndp-dark .ndp-table td.ndp-selected {
	background: #005cb2;
	color: #fff
}

.ndc-chevron {
	line-height: 18px
}

	.ndc-chevron::before {
		border-style: solid;
		border-width: .15em .15em 0 0;
		content: "";
		display: inline-block;
		height: .4em;
		left: .15em;
		position: relative;
		top: 5px;
		transform: rotate(-45deg);
		vertical-align: top;
		width: .4em;
		border-color: #9c9c9c;
		box-sizing: initial
	}

	.ndc-chevron.ndc-left:before {
		left: 1px;
		transform: rotate(-135deg)
	}

	.ndc-chevron.ndc-right:before {
		left: -1px;
		transform: rotate(45deg)
	}

	.ndc-chevron.ndc-down:before {
		left: 1px;
		transform: rotate(135deg)
	}

	.ndc-chevron.ndc-up:before {
		left: 1px;
		top: 8px;
		transform: rotate(-45deg)
	}

.ndc-nav-button {
	width: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center
}

	.ndc-nav-button:hover {
		background: #f0f0f0;
		border-radius: 5px
	}

.ndp-light .ndp-range-hover {
	background-color: #e0f3ff
}

.ndp-dark .ndp-range-hover {
	background-color: #444
}
