/*- Daterangepicker -*/

.daterangepicker {
	position:        absolute;
	color:           inherit;

	backdrop-filter: var(--popup-blur-filter);
	box-shadow:      var(--popup-shadow);
	background:      var(--overlay-color);
	border-radius:   var(--bdr-3);
	border:          var(--container-border);
	padding:         0;
	margin-top:      1px;
	top:             100px;
	left:            20px;
	z-index:         51;
	display:         none;
	font-size:       0.833rem;
	line-height:     1em;
	max-width:       calc(100cqw - 10px);

	&.drop-up {
		margin-top: -1px;
	}

	.h-style-3 & {
		border-radius: 16px;
	}
}

.daterangepicker.single .daterangepicker .ranges, .daterangepicker.single .drp-calendar {
	float: none;
}

.daterangepicker.single .drp-selected {
	display: none;
}

.daterangepicker.show-calendar .drp-calendar {
	display: block;
}

.daterangepicker.show-calendar .drp-buttons {
	display: flex;
}

.daterangepicker.auto-apply .drp-buttons {
	display: none;
}

.daterangepicker .drp-calendar {
	display: none;
}

.daterangepicker .drp-calendar.left:not(.single) {
	padding:            30px 40px 30px 40px;
	padding-inline-end: 0;
}

.daterangepicker .drp-calendar.single {
	padding: 15px;
}

.daterangepicker .drp-calendar.right {
	padding: 30px 40px 30px 35px;
}

.daterangepicker .drp-calendar.single .calendar-table {
	border: none;
}

.daterangepicker .calendar-table .next span, .daterangepicker .calendar-table .prev span {
	color:         var(--white-color);
	border:        solid black;
	border-width:  0 2px 2px 0;
	border-radius: 0;
	display:       inline-block;
	padding:       3px;
}

.daterangepicker .calendar-table .next span {
	transform:         rotate(-45deg) scale(var(--direction));
	-webkit-transform: rotate(-45deg) scale(var(--direction));
}

.daterangepicker .calendar-table .prev span {
	transform:         rotate(135deg) scale(var(--direction));
	-webkit-transform: rotate(135deg) scale(var(--direction));
}

.daterangepicker .calendar-table th, .daterangepicker .calendar-table td {
	white-space:    nowrap;
	text-align:     center;
	vertical-align: middle;
	min-width:      32px;
	width:          32px;
	height:         32px;
	line-height:    1;
	border-radius:  var(--bdr-2);
	border:         1px solid transparent;
	cursor:         pointer;
}

.daterangepicker td {
	background-color: var(--white-color);
}

.daterangepicker .calendar-table table {
	margin:          0;
	border-collapse: separate;
	border-spacing:  1px;

}

.daterangepicker td.available:hover, .daterangepicker th.available:hover {
	background-color: #eee;
	border-color:     transparent;
	color:            inherit;
}

.daterangepicker td.week, .daterangepicker th.week {
	font-size: 80%;
	color:     #ccc;
}

.daterangepicker td.off, .daterangepicker td.off.in-range, .daterangepicker td.off.start-date, .daterangepicker td.off.end-date {
	background-color: var(--white-color);
	border-color:     transparent;
	color:            #999;
}

.daterangepicker td.in-range {
	background-color: var(--accent-color-light);
	border-color:     transparent;
	color:            #000;
	border-radius:    var(--bdr-2);
}

.daterangepicker td.start-date {
	border-start-start-radius: 2px;
	border-end-start-radius:   2px;
	border-start-end-radius:   2px;
	border-end-end-radius:     2px;
}

.daterangepicker td.end-date {
	border-start-end-radius:   2px;
	border-end-end-radius:     2px;
	border-start-start-radius: 2px;
	border-end-start-radius:   2px;
}

.daterangepicker td.start-date.end-date {
	border-radius: var(--bdr-2);
}

.daterangepicker td.active,
.daterangepicker td.active:hover {
	background-color: var(--accent-color);
	border-color:     transparent;
	color:            var(--white-color);
}

.daterangepicker th.month {
	width: auto;
}

.daterangepicker td.disabled,
.daterangepicker option.disabled {
	color:           #999;
	cursor:          not-allowed;
	text-decoration: line-through;
}

.daterangepicker select.monthselect,
.daterangepicker select.yearselect {
	padding: 1px;
	height:  auto;
	margin:  0;
	cursor:  default;
}

.daterangepicker select.monthselect {
	margin-right: 2%;
	width:        56%;
}

.daterangepicker select.yearselect {
	width: 40%;
}

.daterangepicker select.hourselect, .daterangepicker select.minuteselect, .daterangepicker select.secondselect, .daterangepicker select.ampmselect {
	width:      50px;
	margin:     0 auto;
	background: #eee;
	border:     1px solid #eee;
	padding:    2px;
	outline:    0;
}

.daterangepicker .calendar-time {
	text-align:  center;
	margin:      4px auto 0 auto;
	line-height: 30px;
	position:    relative;
}

.daterangepicker .calendar-time select.disabled {
	color:  #ccc;
	cursor: not-allowed;
}

.daterangepicker .drp-buttons {
	margin-top:  -10px;
	padding:     0 40px 30px 40px;
	gap:         5px;
	display:     none;
	clear:       both;
	align-items: center;
}

.daterangepicker .drp-selected {
	flex: 1 1 auto;
}

.daterangepicker .drp-buttons .btn {
	min-width: 112px !important;
}

.daterangepicker .drp-buttons .btn.btn-default {
}

.daterangepicker .drp-buttons .btn.btn-primary {
}


.daterangepicker.show-ranges.single.rtl .drp-calendar.left {
	border-right: 1px solid #ddd;
}

.daterangepicker.show-ranges.single.ltr .drp-calendar.left {
	border-left: 1px solid #ddd;
}

.daterangepicker.show-ranges.rtl .drp-calendar.right {
	border-right: 1px solid #ddd;
}

.daterangepicker.show-ranges.ltr .drp-calendar.left {
	border-left: 1px solid #ddd;
}

.daterangepicker .ranges {
	float:      none;
	text-align: left;
	margin:     0;
}

.daterangepicker .ranges ul {
	list-style: none;
	margin:     0 auto;
	padding:    0;
	width:      100%;
}

.daterangepicker .ranges li {
	padding: 8px 12px;
	cursor:  pointer;
}

.daterangepicker .ranges li:hover {
	background-color: #eee;
}

.daterangepicker .ranges li.active {
	background-color: #08c;
	color:            var(--white-color);
}

/*-- Daterangepicker (Mobile) --*/

.daterangepicker td.av i {
	position:         absolute;
	right:            3px;
	left:             3px;
	bottom:           3px;
	display:          block;
	height:           3px;
	border-radius:    var(--bdr-1);
	overflow:         hidden;
	background-color: #ddd;
}

.daterangepicker td.av i:after {
	content:          '';
	display:          block;
	position:         absolute;
	left:             0;
	top:              0;
	bottom:           0;
	background-color: #68c466;
}

.daterangepicker td.av-X i {
	background-color: #ff0000;
}

.daterangepicker td.av-1 i:after {
	width: 10%;
}

.daterangepicker td.av-2 i:after {
	width: 20%;
}

.daterangepicker td.av-3 i:after {
	width: 30%;
}

.daterangepicker td.av-4 i:after {
	width: 40%;
}

.daterangepicker td.av-5 i:after {
	width: 50%;
}

.daterangepicker td.av-6 i:after {
	width: 60%;
}

.daterangepicker td.av-7 i:after {
	width: 70%;
}

.daterangepicker td.av-8 i:after {
	width: 80%;
}

.daterangepicker td.av-9 i:after {
	width: 90%;
}

.daterangepicker td.av-10 i:after {
	width: 100%;
}

/*- Daterangepicker Theme -*/

.daterangepicker td {
	position: relative;
	border:   none !important;
}

.daterangepicker.type-night td.start-date {
	border-start-start-radius: 50%;
	border-end-start-radius:   50%;
	border-start-end-radius:   2px;
	border-end-end-radius:     2px;
}

.daterangepicker.type-night td.end-date {
	border-start-end-radius:   50%;
	border-end-end-radius:     50%;
	border-start-start-radius: 2px;
	border-end-start-radius:   2px;
}

.daterangepicker.type-night td.start-date.end-date {
	border-radius: 50% !important;
}

.c-room-details__booking-calendar .daterangepicker.type-night .calendar-table th,
.c-room-details__booking-calendar .daterangepicker.type-night .calendar-table td {
	cursor: auto !important;
}

.daterangepicker td.holiday:after,
.daterangepicker td.cleaning:after,
.daterangepicker td.first:before,
.daterangepicker td.last:before,
.daterangepicker td.full:before,
.daterangepicker td.first-order:after,
.daterangepicker td.last-order:after,
.daterangepicker td.full-order:after,
.daterangepicker td.split-order:after,
.daterangepicker td.split-order:before,
.daterangepicker td.not-avail:before {
	content:       '';
	display:       block;
	position:      absolute;
	left:          0;
	right:         0;
	top:           0;
	bottom:        0;
	opacity:       0.5;
	border-radius: var(--bdr-2);
}

.daterangepicker td.cleaning {
	background-image: var(--stretch-bar-gray);
}

.daterangepicker .not-avail:not(.active):not(.in-range) {
	background-color: var(--background-color);
	border-radius:    2px !important;
}

.daterangepicker td.first:before,
.daterangepicker td.last:before,
.daterangepicker td.full:before {
	background-color: rgba(255, 0, 0, 0.5);
}

.daterangepicker td.first-order:after,
.daterangepicker td.last-order:after,
.daterangepicker td.full-order:after,
.daterangepicker td.split-order:after,
.daterangepicker td.split-order:before {
	background-color: rgba(0, 255, 214, 0.4);
}

.daterangepicker td.holiday:after {
	opacity:          1;
	background-color: rgba(170, 170, 170, 0.4) !important
}

.daterangepicker.type-night td.first:before,
.daterangepicker.type-night td.first-order:after,
.daterangepicker.type-night td.split-order:before {
	inset-inline-start:        50%;
	border-start-start-radius: 16px;
	border-end-start-radius:   16px;
	border-start-end-radius:   2px;
	border-end-end-radius:     2px;
}

.daterangepicker.type-night td.last:before,
.daterangepicker.type-night td.last-order:after,
.daterangepicker.type-night td.split-order:after {
	inset-inline-end:          50%;
	border-start-end-radius:   16px;
	border-end-end-radius:     16px;
	border-start-start-radius: 2px;
	border-end-start-radius:   2px;
}

.daterangepicker .timeselect {
	font-size:   0.833rem;
	font-weight: 600;
	margin:      0 auto;
	background:  #eee;
	border:      1px solid #eee;
	padding:     2px;
	outline:     0;
}

.daterangepicker .calendar-time {
	opacity:    0 !important;
	visibility: hidden !important;
	position:   absolute !important;
	z-index:    -1;
}

.daterangepicker .calendar-time-range {
	margin:   20px auto 0 auto;
	position: relative;
}

.daterangepicker .table-condensed thead tr:last-child {
	font-size: 0.778rem;
}

/*-- Daterangepicker Theme (Desktop) --*/
@media (width >= 1190px) {
}

@media (width >= 600px) {
	.daterangepicker {
		width: max-content;
	}

	.daterangepicker .ranges ul {
		width: 140px;
	}

	.daterangepicker.single .ranges ul {
		width: 100%;
	}

	.daterangepicker.single .drp-calendar.left {
		clear: none;
	}

	.daterangepicker.single .ranges, .daterangepicker.single .drp-calendar {
		float: inline-start;
	}

	.daterangepicker {
		text-align: start;
	}

	.daterangepicker .drp-calendar.left {
		clear:        inline-start;
		margin-right: 0;
	}

	.daterangepicker .drp-calendar.left .calendar-table {
		border-right:               none;
		border-top-right-radius:    0;
		border-bottom-right-radius: 0;
	}

	.daterangepicker .drp-calendar.right {
		margin-left: 0;
	}

	.daterangepicker .drp-calendar.right .calendar-table {
		border-left:               none;
		border-top-left-radius:    0;
		border-bottom-left-radius: 0;
	}

	.daterangepicker .ranges, .daterangepicker .drp-calendar {
		float: inline-start;
	}
}

@media (width >= 730px) {
	.daterangepicker .ranges {
		width: auto;
	}

	.daterangepicker .ranges {
		float: inline-start;
	}

	.daterangepicker .drp-calendar.left {
		clear: none !important;
	}
}


/*-- Daterangepicker Theme (Mobile) --*/

@media (width < 600px) {
	.daterangepicker {
		left:      50% !important;
		transform: translateX(-50%);
		width:     370px;
		padding:   30px 0 40px 0;
	}

	.daterangepicker .drp-calendar.left,
	.daterangepicker .drp-calendar.right {
		padding:        0 !important;
		display:        flex;
		flex-direction: column;
		align-items:    center;
	}

	.daterangepicker .drp-calendar.left {
		margin-bottom: 20px;
	}

	.daterangepicker .drp-selected {
		max-width:      80px;
		vertical-align: middle;
		text-align:     left;
	}
}

@media (width < 481px) {
	.daterangepicker {
		width: 100%;
	}
}