.solidres-avail-horizontal, .solidres-avail-default {
	.datefield {
		height: auto;
		line-height: inherit;
		box-shadow: none;
		background: #ffffff;
		border: solid 1px $base-border-color;
		color: $base-text-color;
		font-size: $fontsizes-body-font-size;
		height: 42px;
		line-height: 40px;
		margin-bottom: 0;
		padding: 0 18px;
		cursor: text;
		@include breakpoint(tablet-range) {
			padding: 0 10px;
			font-size: 90%;
		}
		&:hover {
			border-color: darken($base-border-color, 5%);
		}
		&.disabledCalendar {
			background: #fbfbfb !important;
			cursor: not-allowed;
		}
	}
	.action {
		.btn {
			margin-top: 30px;
			text-transform: uppercase;
			padding: 0 !important;
			height: 42px;
			line-height: 40px;
			color: $white !important;
			background: $accent-color-1 !important;
			border: none !important;
			box-shadow: 0 -1px 0 0 rgba(0, 0, 0, 0.14) inset !important;
			&:hover, &:active, &:focus {
				background: $base-title-color !important;
				color: $white;
			}
			@include breakpoint(tablet-range) {
				margin-top: 26px;
			}
		}
	}
	.checkin_datepicker_inline_module, .checkout_datepicker_inline_module {
		position: absolute;
		z-index: 3;
	}
	.checkin_module, .checkout_module {
		position: relative;
		&:after {
			content: '\f073';
			font-family: "FontAwesome";
			pointer-events: none;
			position: absolute;
			right: 10px;
			@include breakpoint(tablet-range) {
				display: none;
			}
		}
	}
	form {
		margin-bottom: 5px;
	}
	label {
		text-transform: uppercase;
		margin-bottom: 10px;
		margin-left: 2px;
		font-family: get-font-family($fonts-heading-font);
		color: $base-title-color;
		@include breakpoint(tablet-range) {
			font-size: 80%;
		}
	}

	// Fix for styling changes introduced in Solidres 1.9+
	.room_num_row {
		> div {
			> div {
				&:nth-child(1) {
					font-style: inherit;
					font-weight: inherit;
					margin-top: 0;
					text-align: left;
				}
			}
		}
	}

}

.no-pull-up {
	.solidres-avail-horizontal {
		margin-top: 0;
	}
}

.solidres-avail-horizontal {
	background: #ffffff;
	padding: 10px;
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.07);
	border: 1px solid lighten($base-border-color, 2%);
	position: relative;
	z-index: 25;
	margin-top: -($content-margin + $content-padding + $section-padding + rem(75px));
	border-radius: 2px;
	@include breakpoint(mobile-only) {
		margin-top: 0;
	}
	.g-row-container {
		@include breakpoint(mobile-only) {
			margin-bottom: 10px;
		}
	}
}

.solidres-avail-default {
	.g-row-container {
		margin-bottom: 20px;
	}
	.action {
		.btn {
			margin-top: 20px;
		}
	}
}

// jQuery DatePicker
.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {
	border-radius: 2px;
}

.ui-widget-content {
	background: #ffffff;
	border: 1px solid lighten($base-border-color, 2%);
	color: $base-text-color;
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.07);
	border: 1px solid $base-border-color;
	margin-top: 3px;
}

.ui-widget {
	font-family: get-font-family($fonts-body-font);
	font-size: $fontsizes-body-font-size;
	padding: 15px;
}

.ui-datepicker .ui-datepicker-header {
	padding: 0;
}

.ui-widget-header {
	background: #ffffff;
	border: none;
	color: $base-text-color;
}

.ui-datepicker .ui-datepicker-next {
	right: 0;
	color: $base-text-color;
	text-shadow: none;
	top: 4px;
	font-weight: normal;
	cursor: pointer;
	span {
		display: none;
	}
	&:after {
		content: '\f054';
		font-family: "FontAwesome";
		position: absolute;
		right: 0;
		text-shadow: none;
		font-size: 12px;
	}
}

.ui-datepicker .ui-datepicker-prev {
	right: 0;
	color: $base-text-color;
	text-shadow: none;
	top: 4px;
	font-weight: normal;
	cursor: pointer;
	span {
		display: none;
	}
	&:after {
		content: '\f053';
		font-family: "FontAwesome";
		position: absolute;
		left: 0;
		text-shadow: none;
		font-size: 12px;
	}
}

.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus {
	background: none;
	border: none;
}

table.ui-datepicker-calendar {
	border: none;
	th {
		background: none;
	}
}

.ui-datepicker td span, .ui-datepicker td a {
	text-align: center;
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
	background: none;
	border: none;
	color: $base-text-color;
}

.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight, .ui-datepicker-current-day .ui-state-active {
	color: $accent-color-1;
}

// Box 3 and 4
.box3, .box4 {
	.solidres-avail-horizontal, .solidres-avail-default {
		label {
			color: #ffffff;
		}
	}
}

.box3 {
	.solidres-avail-horizontal, .solidres-avail-default {
		.btn {
			background: $base-title-color !important;
			&:hover {
				background: lighten($base-title-color, 10%) !important;
			}
		}
	}
}

.box4 {
	.solidres-avail-horizontal, .solidres-avail-default {
		.btn {
			&:hover {
				background: darken($accent-color-1, 10%) !important;
			}
		}
	}
}

// Solidres - Main Component
#solidres {
	.datefield {
		height: auto;
		line-height: inherit;
		box-shadow: none;
		border: solid 1px $base-border-color;
		color: $base-text-color;
		font-size: $fontsizes-body-font-size;
		height: 42px;
		line-height: 40px;
		margin-bottom: 0;
		padding: 0 18px;
		cursor: text;
		@include breakpoint(tablet-range) {
			padding: 0 10px;
			font-size: 90%;
		}
		&:hover {
			border-color: darken($base-border-color, 5%);
		}
		&.disabledCalendar {
			background: #fbfbfb !important;
			cursor: not-allowed;
		}
	}
	.checkin_datepicker_inline, .checkout_datepicker_inline {
		position: absolute;
		z-index: 3;
	}
	.row-fluid {
		> .asset-main-title {
			margin-top: -5px;
		}
		.after-asset-name {
			min-height: 0;
		}
		> .span12 {
			> h3 {
				margin-top: 40px;
				margin-bottom: 30px;
				text-align: center;
			}
		}
	}
	.asset-rating {
		margin-left: 15px;
		font-size: 1rem;
	}
	.asset-details {
		margin-bottom: 30px;
	}
	.reservation_asset_item {
		img {
			padding: 0;
		}

		.sr-user-info {
			margin-bottom: 20px;
			.btn-default {
				margin-left: 25px;
			}
		}

		// Fix for styling changes introduced in Solidres 1.9+
		.tab-content {
			border-color: $base-border-color;
		}
	}
	.other-photos {
		margin-left: 0;
		.sr-photo {
			margin: 0 4px 4px 0;
			img {
				margin: 0;
				@include transition(all 0.3s);
			}
			&:hover {
				img {
					@include transform(scale(1.15));
				}
			}
			.uk-overlay-panel {
				z-index: 4;
			}
			.uk-overlay-background {
				background: rgba(255, 255, 255, 0.6);
			}
		}
		.uk-overlay-area:empty::before, .uk-overlay-icon::before {
			font-size: 16px;
			height: 40px;
			width: 40px;
			line-height: 40px;
			margin-left: -20px;
			margin-top: -20px;
		}
	}
	.nav-tabs {
		margin-top: 30px;
		border-color: $base-border-color;
		> .active {
			> a {
				border-color: $base-border-color $base-border-color transparent;
				&:hover, &:focus {
					border-color: $base-border-color $base-border-color transparent;
				}
			}
		}
	}
	.wizard {
		margin-bottom: 30px;
		border-radius: 3px;
		border: 1px solid $base-border-color;
		background: $base-element-color;
		ul {
			li {
				@include breakpoint(tablet-range) {
					display: block;
					width: 100%;
					margin-left: 0;
				}
				&.active {
					color: $accent-color-1;
				}
				.badge {
					position: relative;
					top: -2px;
				}
				.chevron {
					&:before {
						border-color: transparent $base-border-color transparent $base-element-color;
					}
					@include breakpoint(mobile-only) {
						display: none;
					}
					@include breakpoint(tablet-range){
						display: none;
					}
				}
			}
		}
	}
	div.even, div.odd {
		background: $base-element-color;
		padding: 20px;
		margin-bottom: 30px;
		border-radius: 3px;
		.inner {
			> .btn-group {
				@include breakpoint(mobile-only) {
					display: block;
				}
			}
		}
		.toggle_more_desc {
			margin-right: 25px;
			background: none;
			box-shadow: none;
			color: $accent-color-1;
			padding: 0;
			outline: none;
			border: none !important;
			@include transition(all 0.2s);
			&:hover {
				color: $base-title-color;
			}
			@include breakpoint(mobile-only) {
				display: block;
				width: 100%;
				margin-right: 0;
				margin-bottom: 20px;
			}
		}
		.load-calendar {
			background: none;
			box-shadow: none;
			color: $accent-color-1;
			padding: 0;
			outline: none;
			border: none !important;
			@include transition(all 0.2s);
			&:hover {
				color: $base-title-color;
			}
			@include breakpoint(mobile-only) {
				display: block;
				width: 100%;
			}
		}
		.toggle-tariffs {
			margin-left: 25px;
			background: none !important;
			box-shadow: none;
			color: $accent-color-1;
			padding: 0;
			outline: none;
			border: none !important;
			@include transition(all 0.2s);
			&:hover {
				color: $base-title-color;
			}
			@include breakpoint(mobile-only) {
				display: block;
				width: 100%;
				margin-left: 0;
			}
		}
	}
	.reservation-single-step-holder {
		background: none;
	}
	.label-info, .badge-info {
		background-color: $accent-color-1;
		text-shadow: none;
	}
	.roomtype_name {
		font-size: 1.2rem;
		.label {
			margin-right: 10px;
			position: relative;
			top: -2px;
		}
	}
	.carousel {
		@include breakpoint(mobile-only) {
			margin-top: 20px;
			display: block;
			.room_type_details {
				display: block;
				img {
					width: 100%;
				}
			}
		}
	}
	.carousel-control {
		border: none;
		font-size: 25px;
		line-height: 20px;
		@include transition(all 0.2s);
	}
	.roomtype_desc {
		p {
			&:first-child {
				margin-top: 0;
			}
		}
	}
	.availability-calendar {
		padding: 10px;
		@include breakpoint(tablet-range) {
			padding: 0;
			position: absolute;
			width: 700px;
			z-index: 9;
			background: $base-element-color;
		}
		.row-fluid{
			margin-top: 15px;
			table {
				background: #ffffff;
				@include breakpoint(mobile-only) {
					margin-bottom: 15px;
				}
				th {
					background: #ffffff;
					text-align: center;
					border-bottom: none;
				}
				.row-week-day {
					background: #fcfcfc;
				}
			}
		}
	}
	.tariff-box {
		background: #fcfcfc;
		border-color: $base-border-color;
		border-left-color: $accent-color-1;
		margin-top: 15px;
		padding: 15px;
		select {
			height: 42px;
		}
		.nice-select {
			float: none;
		}
		.btn {
			margin-top: 6px;
			color: $white !important;
			background: $accent-color-1 !important;
			border: none !important;
			box-shadow: 0 -1px 0 0 rgba(0, 0, 0, 0.14) inset !important;
			&:hover, &:active, &:focus {
				background: $base-title-color !important;
				color: $white;
			}
		}
		.min_tariff {
			color: $accent-color-1;
		}
		.span5 {
			> strong {
				margin-left: 10px;
				display: block;
				margin-top: 23px;
			}
			> p {
				margin-left: 10px;
			}
		}
		.roomtype-quantity-selection {
			margin-bottom: 0;
		}
		.room_index_form_heading {
			border-color: $base-border-color;
			margin-bottom: 20px;
		}
		.normal_tariff {
			margin-top: 8px;
		}
		.checkinoutform {
			label {
				margin-top: 15px;
				margin-left: 2px;
			}
			.btn {
				margin-top: 20px;
			}
		}
	}
	.reservation-single-step-holder {
		&.guestinfo {
			select {
				height: 42px;
			}
		}
		&.confirmation {
			#termsandconditions {
				margin-top: -4px;
				margin-right: 5px;
			}
		}
		#payment_method_paylater {
			margin-top: -4px;
			margin-right: 5px;
		}
	}
	form {
		margin-bottom: 0;
	}
	.custom-field-row {
		.info-heading {
			color: $base-title-color;
		}
	}
	.coupon {
		padding: 15px;
		margin-bottom: 30px;
		.input-append {
			margin-bottom: 0;
			display: block;
			width: 100%;
			#coupon_code {
				width: 80%;
			}
			#coupon_code_check {
				width: 20%;
				padding: 10px;
				border: none !important;
				color: $white !important;
				background: $accent-color-1 !important;
				border: none !important;
				box-shadow: 0 -1px 0 0 rgba(0, 0, 0, 0.14) inset !important;
				&:hover, &:active, &:focus {
					background: $base-title-color !important;
					color: $white;
				}
			}
		}
	}
	.availability-search-info, .button-row-top {
		margin-bottom: 30px;
	}
	.button-row-top, .button-row-bottom {
		border: none;
		padding: 10px;
		.btn {
			margin-top: 5px;
			@include breakpoint(tablet-range) {
				margin-top: 18px;
				display: block;
			}
		}
		.span3 {
			text-align: right;
			@include breakpoint(mobile-only) {
				.btn-group {
					display: block;
					width: 100%;
					.btn {
						display: block;
						width: 100%;
						margin-top: 0;
					}
				}
			}
		}
		.span4 {
			text-align: right;
			@include breakpoint(mobile-only) {
				.btn-group {
					display: block;
					width: 100%;
					.btn {
						display: block;
						width: 100%;
						margin-top: 0;
					}
				}
			}
			.reservation-navigate-back {
				margin-right: 15px;
				@include breakpoint(mobile-only) {
					margin-right: 0;
					margin-bottom: 15px;
				}
			}
		}
	}
}

// Map popup
.contentpane.modal {
	padding: 0;
}