/**
 * @package     Joomla.Module
 * @subpackage  Site.mod_codedesign_responsive_locations
 * @version     Joomla! 6.0+ / PHP 8.3+
 * @date        2026-08
 * @file        /modules/mod_codedesign_responsive_locations/assets/css/locations_hotel_rooms_room_details.css
 *
 * @copyright   Copyright (C) 2006 - 2026 Open Source Matters, Inc. All rights reserved.
 *              Copyright (C) 2026 Milos Mandic | codeDESIGN
 * @license     GNU General Public License version 2 or later; see LICENSE.txt
 * @author      Milos Mandic <milos.mandic@filterverlag.de> - https://www.filterverlag.de
 */

/* codeDESIGN - locations_hotel_rooms_room_details.css */
@charset "utf-8";

/* LOCATIONS HOTEL ROOMS ROOM DETAILS */
div.locations_hotel_rooms_room_details_view {
	width: 100%;
	margin: 0px 0px 0px 0px;
	padding: 30px 0px 50px 0px;
}
div.locations_hotel_rooms_room_details_layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
	gap: 50px;
	align-items: start;
}
div.locations_hotel_rooms_room_details_main,
aside.locations_hotel_rooms_room_details_sidebar {
	min-width: 0;
}
div.locations_hotel_rooms_room_details_claim {
	margin: -10px 0px 28px 0px;
	padding: 0px 0px 0px 0px;
	font-size: 15px;
	line-height: 24px;
	font-weight: 600;
}



/* LOCATIONS HOTEL ROOMS ROOM DETAILS - FACTS */
div.locations_hotel_rooms_room_details_facts {
	margin: 0px 0px 34px 0px;
	padding: 0px 0px 30px 0px;
	border-bottom: 1px solid rgba(36, 36, 36, 0.18);
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 24px;
}
div.locations_hotel_rooms_room_details_fact {
	min-width: 0;
	text-align: center;
}
div.locations_hotel_rooms_room_details_fact_icon {
	width: 48px;
	height: 48px;
	margin: 0px auto 12px auto;
	padding: 0px 0px 0px 0px;
	font-size: 36px;
	line-height: 48px;
	color: var(--ci_color_text, #2a2a2a);
}
div.locations_hotel_rooms_room_details_fact_value {
	margin: 0px 0px 2px 0px;
	padding: 0px 0px 0px 0px;
	font-size: 14px;
	line-height: 20px;
	font-weight: 700;
}
div.locations_hotel_rooms_room_details_fact_label {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	font-size: 13px;
	line-height: 19px;
}
div.locations_hotel_rooms_room_details_section {
	margin: 0px 0px 38px 0px;
	padding: 0px 0px 0px 0px;
}
div.locations_hotel_rooms_room_details_section h3,



/* LOCATIONS HOTEL ROOMS ROOM DETAILS - OVERVIEW BOX */
div.locations_hotel_rooms_room_details_overview_box h3 {
	margin: 0px 0px 22px 0px;
	padding: 0px 0px 9px 0px;
	border-bottom: 1px solid rgba(36, 36, 36, 0.18);
	font-size: 22px;
	line-height: 30px;
	font-weight: 400;
	text-transform: uppercase;
}
div.locations_hotel_rooms_room_details_section h3:after,
div.locations_hotel_rooms_room_details_overview_box h3:after {
	content: "";
	background: var(--ci_color_accent_2, #2c2c2c);
	width: 58px;
	height: 2px;
	margin: 9px 0px -11px 0px;
	display: block;
}



/* LOCATIONS HOTEL ROOMS ROOM DETAILS - AMENITIES */
div.locations_hotel_rooms_room_details_amenities {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px 24px;
}
div.locations_hotel_rooms_room_details_amenity {
	min-width: 0;
	display: flex;
	align-items: center;
	font-size: 14px;
	line-height: 21px;
}
div.locations_hotel_rooms_room_details_amenity i {
	width: 26px;
	margin: 0px 10px 0px 0px;
	flex: 0 0 26px;
	font-size: 22px;
	line-height: 24px;
	text-align: center;
	color: var(--ci_color_text, #2a2a2a);
}



/* LOCATIONS HOTEL ROOMS ROOM DETAILS - GALLERY */
div.locations_hotel_rooms_room_details_gallery {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
}
a.locations_hotel_rooms_room_details_gallery_item {
	background: #f4f4f4;
	position: relative;
	overflow: hidden;
	display: block;
}
a.locations_hotel_rooms_room_details_gallery_item img,
a.locations_hotel_rooms_room_details_gallery_item picture {
	width: 100%;
	height: 100%;
	aspect-ratio: 16 / 9;
	display: block;
	object-fit: cover;
}
span.locations_hotel_rooms_room_details_gallery_item_overlay {
	background: rgba(255, 255, 255, 0.4);
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 2;
	display: block;
	opacity: 0;
	pointer-events: none;
	-moz-transition: all 0.33s ease-in-out;
	-webkit-transition: all 0.33s ease-in-out;
	-o-transition: all 0.33s ease-in-out;
	transition: all 0.33s ease-in-out;
}
span.locations_hotel_rooms_room_details_gallery_item_overlay_icon {
	background: rgba(255, 255, 255, 0.0);
	width: 58px;
	height: 58px;
	border: 4px solid rgba(255, 255, 255, 0.6);
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 3;
	overflow: visible;
	display: block;
	opacity: 0;
	pointer-events: none;
	text-align: center;
	color: #ffffff;
	-moz-transition: all 0.33s ease-in-out;
	-webkit-transition: all 0.33s ease-in-out;
	-o-transition: all 0.33s ease-in-out;
	transition: all 0.33s ease-in-out;
	-moz-transform: translate(-50%, -50%) scale(0.85);
	-webkit-transform: translate(-50%, -50%) scale(0.85);
	-o-transform: translate(-50%, -50%) scale(0.85);
	-ms-transform: translate(-50%, -50%) scale(0.85);
	transform: translate(-50%, -50%) scale(0.85);
}
span.locations_hotel_rooms_room_details_gallery_item_overlay_icon i {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 2;
	font-size: 23px;
	color: #ffffff;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
span.locations_hotel_rooms_room_details_gallery_item_overlay_icon:before,
span.locations_hotel_rooms_room_details_gallery_item_overlay_icon:after {
	content: '';
	width: 100%;
	height: 100%;
	border: 1px solid #ffffff;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 1;
}
span.locations_hotel_rooms_room_details_gallery_item_overlay_icon:before {
	-webkit-animation: locations_hotel_rooms_room_details_gallery_item_signal_1 3s infinite;
	animation: locations_hotel_rooms_room_details_gallery_item_signal_1 3s infinite;
}
span.locations_hotel_rooms_room_details_gallery_item_overlay_icon:after {
	-webkit-animation: locations_hotel_rooms_room_details_gallery_item_signal_2 3s infinite;
	animation: locations_hotel_rooms_room_details_gallery_item_signal_2 3s infinite;
}
a.locations_hotel_rooms_room_details_gallery_item:hover span.locations_hotel_rooms_room_details_gallery_item_overlay,
a.locations_hotel_rooms_room_details_gallery_item:focus span.locations_hotel_rooms_room_details_gallery_item_overlay {
	opacity: 1;
}
a.locations_hotel_rooms_room_details_gallery_item:hover span.locations_hotel_rooms_room_details_gallery_item_overlay_icon,
a.locations_hotel_rooms_room_details_gallery_item:focus span.locations_hotel_rooms_room_details_gallery_item_overlay_icon {
	opacity: 1;
	-moz-transform: translate(-50%, -50%) scale(1);
	-webkit-transform: translate(-50%, -50%) scale(1);
	-o-transform: translate(-50%, -50%) scale(1);
	-ms-transform: translate(-50%, -50%) scale(1);
	transform: translate(-50%, -50%) scale(1);
}
@-webkit-keyframes locations_hotel_rooms_room_details_gallery_item_signal_1 {
	0% {
		opacity: 0.9;
		-moz-transform: scale(1);
		-webkit-transform: scale(1);
		-o-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	}
	100% {
		opacity: 0;
		-moz-transform: scale(1.5);
		-webkit-transform: scale(1.5);
		-o-transform: scale(1.5);
		-ms-transform: scale(1.5);
		transform: scale(1.5);
	}
}
@keyframes locations_hotel_rooms_room_details_gallery_item_signal_1 {
	0% {
		opacity: 0.8;
		-moz-transform: scale(1);
		-webkit-transform: scale(1);
		-o-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	}
	100% {
		opacity: 0;
		-moz-transform: scale(1.5);
		-webkit-transform: scale(1.5);
		-o-transform: scale(1.5);
		-ms-transform: scale(1.5);
		transform: scale(1.5);
	}
}
@-webkit-keyframes locations_hotel_rooms_room_details_gallery_item_signal_2 {
	0% {
		-moz-transform: scale(1);
		-webkit-transform: scale(1);
		-o-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	}
	100% {
		opacity: 0;
		-moz-transform: scale(1.9);
		-webkit-transform: scale(1.9);
		-o-transform: scale(1.9);
		-ms-transform: scale(1.9);
		transform: scale(1.9);
	}
}
@keyframes locations_hotel_rooms_room_details_gallery_item_signal_2 {
	0% {
		-moz-transform: scale(1);
		-webkit-transform: scale(1);
		-o-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	}
	100% {
		opacity: 0;
		-moz-transform: scale(1.9);
		-webkit-transform: scale(1.9);
		-o-transform: scale(1.9);
		-ms-transform: scale(1.9);
		transform: scale(1.9);
	}
}



/* LOCATIONS HOTEL ROOMS ROOM DETAILS - SPECIAL FEATURES */
div.locations_hotel_rooms_room_details_special_features {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 26px 34px;
}
div.locations_hotel_rooms_room_details_special_feature {
	min-width: 0;
	display: grid;
	grid-template-columns: 54px minmax(0, 1fr);
	gap: 18px;
}
div.locations_hotel_rooms_room_details_special_feature_icon {
	font-size: 36px;
	line-height: 44px;
	color: var(--ci_color_text, #2a2a2a);
}
div.locations_hotel_rooms_room_details_special_feature_title {
	margin: 0px 0px 5px 0px;
	padding: 0px 0px 0px 0px;
	font-size: 16px;
	line-height: 23px;
	font-weight: 700;
}
div.locations_hotel_rooms_room_details_special_feature_text {
	font-size: 14px;
	line-height: 22px;
}
div.locations_hotel_rooms_room_details_special_feature_text p {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
}
div.locations_hotel_rooms_room_details_overview_box {
	background: var(--ci_color_light_brown);
	margin: 0px 0px 0px 0px;
	padding: 20px 20px 20px 20px;
	position: sticky;
	top: 120px;
	z-index: 3;
}
div.locations_hotel_rooms_room_details_overview_items {
	margin: 0px 0px 30px 0px;
	padding: 0px 0px 0px 0px;
}
div.locations_hotel_rooms_room_details_overview_item {
	margin: 0px 0px 0px 0px;
	padding: 6px 0px 6px 0px;
	border-bottom: 1px solid rgba(36, 36, 36, 0.16);
	display: grid;
	grid-template-columns: minmax(110px, 44%) minmax(0, 1fr);
	gap: 16px;
	font-size: 14px;
	line-height: 21px;
}
div.locations_hotel_rooms_room_details_overview_item:last-child {
	border-bottom: 0px none;
}
div.locations_hotel_rooms_room_details_overview_label {
	font-weight: 600;
}
a.locations_hotel_rooms_room_details_booking_button {
	width: 100%;
	margin: 24px 0px 16px 0px;
	display: block;
	text-align: center;
}
a.locations_hotel_rooms_room_details_direct_booking_link {
	padding: 0px 18px 0px 0px;
	position: relative;
	display: none;
	font-size: 14px;
	line-height: 22px;
	color: var(--ci_color_text, #2a2a2a);
}
a.locations_hotel_rooms_room_details_direct_booking_link:after {
	content: "\f105";
	position: absolute;
	top: 0px;
	right: 0px;
	font-family: "Font Awesome 5 Pro";
	font-weight: 300;
}



/* LOCATIONS HOTEL ROOMS ROOM DETAILS - RESPONSIVE */
@media only screen and (max-width: 1199px) {
	div.locations_hotel_rooms_room_details_layout {
		grid-template-columns: minmax(0, 1fr) minmax(260px, 320px);
		gap: 34px;
	}
	div.locations_hotel_rooms_room_details_amenities {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}
@media only screen and (max-width: 991px) {
	div.locations_hotel_rooms_room_details_layout {
		grid-template-columns: 1fr;
	}
	div.locations_hotel_rooms_room_details_overview_box {
		position: static;
	}
}
@media only screen and (max-width: 767px) {
	div.locations_hotel_rooms_room_details_view {
		padding: 20px 0px 34px 0px;
	}
	div.locations_hotel_rooms_room_details_facts,
	div.locations_hotel_rooms_room_details_amenities,
	div.locations_hotel_rooms_room_details_gallery,
	div.locations_hotel_rooms_room_details_special_features {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	div.locations_hotel_rooms_room_details_overview_box {
		padding: 26px 24px 28px 24px;
	}
}
@media only screen and (max-width: 480px) {
	div.locations_hotel_rooms_room_details_facts,
	div.locations_hotel_rooms_room_details_amenities,
	div.locations_hotel_rooms_room_details_gallery,
	div.locations_hotel_rooms_room_details_special_features {
		grid-template-columns: 1fr;
	}
	div.locations_hotel_rooms_room_details_special_feature {
		grid-template-columns: 42px minmax(0, 1fr);
	}
	div.locations_hotel_rooms_room_details_overview_item {
		grid-template-columns: 1fr;
		gap: 3px;
	}
}



/* LOCATIONS HOTEL ROOMS ROOM DETAILS - CONTAINER */
div.locations_hotel_rooms_room_details div[class^="col-"],
div.locations_hotel_rooms_room_details div[class*=" col-"],
div.locations_hotel_rooms_room_details div.container {
	padding-right: 0px;
	padding-left: 0px;
}



/* LOCATIONS HOTEL ROOMS ROOM DETAILS - HEADINGS */
div.locations_hotel_rooms_room_details_view h3 {
	margin: 0px 0px 20px 0px;
	padding: 0px 0px 15px 0px;
	border-bottom: var(--border_bottom-headings);
	position: relative;
	letter-spacing: -1px;
	text-transform: none;
	color: var(--ci_color_black);
	font: var(--font-h3);
}
@media only screen and (max-width: 991px) {
	div.locations_hotel_rooms_room_details_view h3 {
		letter-spacing: 0px;
	}
}
div.locations_hotel_rooms_room_details_view h3:after {
	content: '';
	background: var(--ci_color_black);
	width: 82px;
	height: 2px;
	margin: 0px 0px 0px 0px;
	position: absolute;
	bottom: -1px;
	left: 0%;
	-moz-transition: all 0.33s ease-in-out;
	-webkit-transition: all 0.33s ease-in-out;
	-o-transition: all 0.33s ease-in-out;
	transition: all 0.33s ease-in-out;
}
div.locations_hotel_rooms_room_details_view h3:hover:after {
	background: var(--ci_color_black);
	width: 180px;
}
body.website_01 div.locations_hotel_rooms_room_details_view h3:after {
	background: var(--ci_color_accent_0);
}
body.website_01 div.locations_hotel_rooms_room_details_view h3:hover:after {
	background: var(--ci_color_accent_0_hover);
}
body.website_02 div.locations_hotel_rooms_room_details_view h3:after {
	background: var(--ci_color_accent_2);
}
body.website_02 div.locations_hotel_rooms_room_details_view h3:hover:after {
	background: var(--ci_color_accent_2_hover);
}



/* LOCATIONS HOTEL ROOMS ROOM DETAILS - OTHER ROOMS */
div.locations_hotel_rooms_room_details_other_rooms_box {
	background: var(--ci_color_light_brown);
	margin: 30px 0px 0px 0px;
	padding: 20px 20px 20px 20px;
	transition: opacity 180ms ease-in-out;
}
div.locations_hotel_rooms_room_details_other_rooms_box.locations_hotel_rooms_room_details_other_rooms_box_overlapped {
	opacity: 0;
	pointer-events: none;
}
div.locations_hotel_rooms_room_details_other_rooms_box ul {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	list-style: none;
}
div.locations_hotel_rooms_room_details_other_rooms_box ul li {
	margin: 0px 0px 0px 0px;
	padding: 6px 0px 6px 0px;
	border-bottom: 1px solid rgba(36, 36, 36, 0.16);
}
div.locations_hotel_rooms_room_details_other_rooms_box ul li:last-child {
	border-bottom: 0px none;
}
div.locations_hotel_rooms_room_details_other_rooms_box ul li a,
div.locations_hotel_rooms_room_details_other_rooms_box ul li a:link,
div.locations_hotel_rooms_room_details_other_rooms_box ul li a:visited {
	padding: 0px 20px 0px 0px;
	position: relative;
	display: block;
	font-size: 14px;
	line-height: 22px;
	text-decoration: none;
	color: var(--ci_color_text, #2a2a2a);
}
div.locations_hotel_rooms_room_details_other_rooms_box ul li a:after {
	content: "\f105";
	position: absolute;
	top: 0px;
	right: 0px;
	font-family: "Font Awesome 5 Pro";
	font-weight: 300;
}



/* LOCATIONS HOTEL ROOMS ROOM DETAILS - BOOKING BOX */
div.locations_hotel_rooms_room_details_booking_box {
	background: var(--ci_color_light_brown);
	margin: 46px 0px 0px 0px;
	padding: 30px 34px 30px 34px;
	border: 0px none;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 24px;
	align-items: center;
}
div.locations_hotel_rooms_room_details_booking_box h3 {
	margin-bottom: 12px;
}
div.locations_hotel_rooms_room_details_booking_box_text {
	font-size: 15px;
	line-height: 24px;
}
div.locations_hotel_rooms_room_details_booking_box_module div.codedesign_responsive_quick_contact_wrapper,
div.locations_hotel_rooms_room_details_booking_box_module div.quick_contact_booking_horizontal_advanced,
div.locations_hotel_rooms_room_details_booking_box_module div.quick_contact_booking_horizontal_advanced_backround {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
}
div.locations_hotel_rooms_room_details_booking_box_module div.codedesign_responsive_quick_contact_wrapper div.container,
div.locations_hotel_rooms_room_details_booking_box_module div.quick_contact_booking_horizontal_advanced div.container,
div.locations_hotel_rooms_room_details_booking_box_module div.quick_contact_booking_horizontal_advanced div[class^="col-"],
div.locations_hotel_rooms_room_details_booking_box_module div.quick_contact_booking_horizontal_advanced div[class*=" col-"] {
	width: 100%;
	max-width: none;
	padding-right: 0px;
	padding-left: 0px;
}



/* LOCATIONS HOTEL ROOMS ROOM DETAILS - ADJUSTMENTS */
div.locations_hotel_rooms_room_details_special_features {
	grid-template-columns: 1fr;
}
@media only screen and (max-width: 991px) {
	div.locations_hotel_rooms_room_details_other_rooms_box,
	div.locations_hotel_rooms_room_details_other_rooms_box ul li a:after {
		display: none;
	}
	div.locations_hotel_rooms_room_details_booking_box {
		grid-template-columns: 1fr;
		gap: 20px;
	}
}