/* IOS Reservations grid */

.iosr_grid { margin:0; padding:0;position:relative; }

.iosr_grid_100 { margin:0; padding:0; }

.iosr_grid_73 { margin:0; padding:0; width:73%; float:left; }

.iosr_grid_50 { margin:0; padding:0; width:50%; float:left; }

.iosr_grid_49 { margin:0; padding:0; width:49%; float:left; }

.iosr_grid_32 { margin:0; padding:0; width:32%; float:left; }

.iosr_grid_25 { margin:0; padding:0; width:25%; float:left; }

.iosr_grid_24 { margin:0; padding:0; width:24%; float:left; }

.iosr_grid_23 { margin:0; padding:0; width:23%; float:left; }

/* debug */

.iosr_gridbug_100 { margin:0; padding:10px; text-align:center; background-color:#ddd; color:#000; font:normal 13px/16px tahoma, verdana, sans-serif; }

.iosr_gridbug_100:hover { background-color:#FAF792; }

/* extra classes */

.clear { clear:both; }

.iosr_grid_note { color:#666; direction:ltr; }

/* addon classes */

.dsspace { margin-bottom:5px; }

.dspace { margin-bottom:15px; }

.rspace { margin-right:2%; }



/* error page */

.iosr_errorpage { margin:0 0 20px 0; padding:0; font:normal 13px/16px tahoma, Geneva, sans-serif; color:#333; }

.iosr_errorpage h1 {

	margin:0 0 20px 0; padding:0; border:none; outline:none; vertical-align:baseline; background:transparent; font:normal 22px/28px Georgia, "Times New Roman", Times, serif; color:#454545; 

}

.iosr_errorpage p {

	margin:8px 0 20px 0; padding:12px; font:normal 13px/16px tahoma, Geneva, sans-serif; color:#333; background-color:#fdf6d4; border:1px solid #e1c95a;

	-moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;

}

.iosr_centlinks { margin:40px 0; padding:0; text-align:center; }

.iosr_centlinks a, .iosr_centlinks a:link, .iosr_centlinks a:visited, .iosr_centlinks a:hover, .iosr_centlinks a:active, .iosr_centlinks a:focus {

	margin:0 15px; padding:6px 15px; font:normal 13px/16px tahoma, arial, sans-serif; background-color:#4479BA; color:#FFF; text-decoration:none;

    border:1px solid #20538D; border-radius:5px;

}

.iosr_centlinks a:hover { background-color:#356094; border:1px solid #2A4E77; }



/* GENERIC CSS - used by modules */

.iosr_gmod_wrap { margin:5px 0 20px 0; padding:0;}

.iosr_gmod_wrap > h3 { margin:0 0 6px 0; padding:0 0 3px 0; text-decoration:none; background:none; border-bottom: 1px solid #E9E9E9; text-align:left; }

.iosr_gmod_wrap > h3 span.subnote { margin:0; padding:0; display:block; font-size:10px; }

.iosr_gmod_wrap > h3 span.rightnote { margin:0 0 0 10px; padding:0; float:right; display:block; font:normal 12px/15px tahoma, geneva, sans-serif; color:#666666; }

.iosr_gmod_box { margin:0 0 5px 0; padding:0; }

.iosr_gmod_thumb { margin:4px 0px; padding:0; width:50px; float:left; text-align:center; vertical-align:top; font:normal 11px/14px tahoma, arial, sans-serif; color:#666; }

.iosr_gmod_thumb img { width:45px; height:45px; border-radius: 4px; }

.iosr_gmod_thumb80 { margin:0; padding:0; width:85px; float:left; text-align:center; vertical-align:top; font:normal 11px/14px tahoma, arial, sans-serif; color:#666; }

.iosr_gmod_thumb80 img { margin:0; border-radius: 4px; width:80px; height:80px; }

.iosr_gmod_thumb120 { margin:0; padding:0; width:125px; float:left; text-align:center; vertical-align:top; font:normal 11px/14px tahoma, arial, sans-serif; color:#666; }

.iosr_gmod_thumb120 img { margin:0; padding:2px; width:120px; height:120px; border-radius: 6px; }

.iosr_gmod_contents { margin:0; padding:0; vertical-align:top; font-size:12px; }

.iosr_gmod_wrap a, .iosr_gmod_wrap a:hover, .iosr_gmod_wrap a:visited, .iosr_gmod_wrap a:link { text-decoration:none; }

.iosr_gmod_wrap a:hover {text-decoration:underline; }

.iosr_gmod_ul { margin:0; padding:0; text-indent:0; }

.iosr_gmod_ul li { margin:0 0 3px 0; padding: 3px 0 3px 6px; text-indent:0; list-style-type: none; font-size:13px; line-height:16px; display:block; background-color: #F3F3F3; }
.iosr_gmod_ul li:hover {background-color: #E6EDF6; }
.iosr_gmod_ul li.gmod_list { padding:1px 0 1px 21px; background:transparent url(tick16.png) 0 1px no-repeat; border:none !important; }

.iosr_gmod_ul li > a.ablock { display:block !important; overflow:hidden; }

.iosr_gmod_ul li .gmod_right { margin:0 0 0 10px; padding:0; float:right; display:block; }

.iosr_gmod_ulmenu { margin:0; padding:0; text-indent:0; }

.iosr_gmod_ulmenu li { margin:0; padding:0; text-indent:0; list-style-type:none; display:block; font:normal 13px/16px helvetica, arial, verdana, sans-serif; color:#333; }

.iosr_gmod_ulmenu li a.gmod_vmenu, .iosr_gmod_ulmenu li a.gmod_vmenu:hover, .iosr_gmod_ulmenu li a.gmod_vmenu:visited, .iosr_gmod_ulmenu li a.gmod_vmenu:link {

	margin:0; padding:4px 3px; font:normal 13px/16px helvetica, arial, verdana, sans-serif; display:block; border-bottom:1px solid #DDD; text-decoration:none; border-collapse:collapse;

	background: #eeeeee;

	background: -moz-linear-gradient(top,  #ffffff 0%, #eeeeee 100%);

	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#eeeeee));

	background: -webkit-linear-gradient(top,  #ffffff 0%,#eeeeee 100%);

	background: -o-linear-gradient(top,  #ffffff 0%,#eeeeee 100%);

	background: -ms-linear-gradient(top,  #ffffff 0%,#eeeeee 100%);

	background: linear-gradient(to bottom,  #ffffff 0%,#eeeeee 100%);

	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee',GradientType=0 );

}

.iosr_gmod_ulmenu li a.gmod_vmenu:first-child { border-top:1px solid #DDD; }

.iosr_gmod_ulmenu li a.gmod_vmenu:hover {

	background: #e2e2e2;

	background: -moz-linear-gradient(top,  #f2f2f2 0%, #e2e2e2 100%);

	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f2f2), color-stop(100%,#e2e2e2));

	background: -webkit-linear-gradient(top,  #f2f2f2 0%,#e2e2e2 100%);

	background: -o-linear-gradient(top,  #f2f2f2 0%,#e2e2e2 100%);

	background: -ms-linear-gradient(top,  #f2f2f2 0%,#e2e2e2 100%);

	background: linear-gradient(to bottom,  #f2f2f2 0%,#e2e2e2 100%);

	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#e2e2e2',GradientType=0 );

}

img.iosr_gmod_thumbnail { margin:3px; padding:2px; border:1px solid #E6E6E6; background-color:#ffffff; }
img.iosr_gmod_thumbnail:hover { border:1px solid #888;}
img.iosr_gmod_thumbnailfl { margin:0 3px 0 0; padding:2px; border:1px solid #E6E6E6; width:40px; height:40px; background-color:#ffffff; float:left; }
img.iosr_gmod_thumbnailfl:hover { border:1px solid #1A80B6;}
.iosr_gmod_note { margin:0; padding:0; font-size:12px; color:#666666; }



/* flexible boxes */

.iosr_gmod_flex25 { margin:0; padding:0; width:25%; display:block; float:left; }

.iosr_gmod_flex33 { margin:0; padding:0; width:33%; display:block; float:left;  }

.iosr_gmod_flex50 { margin:0; padding:0; width:50%; display:block; float:left;  }

.iosr_gmod_flex100 { margin:0; padding:0; display:block; }

.iosr_gmod_flex_in { margin:0 0 10px 0; padding:8px; font-size:12px; border:1px solid #F0F0F0; background-color:#FFF; }
.iosr_gmod_flex_in:hover { border:1px solid #B7DDF2; background-color: #EAFCFE;}

.iosr_gmod_flex_thumb { margin:0 0 2px 0; padding:0; text-align:center; }

.rightcolumn .iosr_gmod_flex_thumb img { margin:0; padding:0; width:98% !important; height:auto; max-width:600px;   }

.iosr_gmod_flex_thumb img { margin:0; padding:0; width:100% !important; height:auto; max-width:600px; border:none; }

.iosr_gmod_flex_in a, .iosr_gmod_flex_in a:visited, .iosr_gmod_flex_in a:link, .iosr_gmod_flex_in a:hover {

	margin:0; padding:0; display:block !important; overflow:hidden; text-decoration:none; font:bold 14px/18px helvetica, arial, verdana, sans-serif; 

}

.iosr_gmod_flex_in a:hover { text-decoration:underline; }

.iosr_gmod_flex_in .iosr_gmod_note a { font-weight:normal; font-size:11px; line-height:14px; color: #72A805; }

.gmod_flex_right { padding: 2px; float:right; display:block; position: absolute;
top: -30px;
right: 6px;
}



/* generic addon classes */

.gmodcont_thumb { margin:0 0 0 55px; padding:0;line-height: 1.2; }

.gmodcont_thumb80 { margin:0 0 0 90px; padding:0; }

.gmodcont_thumb120 { margin:0 0 0 130px; padding:0; }

.gmodwrap_yellow { background-color:#F8F7B6; border:1px solid #F4DC0D; -moz-border-radius:7px; -webkit-border-radius:7px; border-radius:7px; padding:8px; box-shadow: 3px 3px 3px #AAAAAA; }

.gmodwrap_gray { background-color:#F0F0F0; border:1px solid #CCCCCC; -moz-border-radius:7px; -webkit-border-radius:7px; border-radius:7px; padding:8px; box-shadow: 3px 3px 3px #AAAAAA; }

.gmodwrap_green { background-color:#d3f9b4; border:1px solid #8fd258; -moz-border-radius:7px; -webkit-border-radius:7px; border-radius:7px; padding:8px; box-shadow: 3px 3px 3px #AAAAAA; }

.gmodwrap_blue { background-color:#197cc9; border:1px solid #064a7a; -moz-border-radius:7px; -webkit-border-radius:7px; border-radius:7px; padding:8px; color:#ffffff !important; box-shadow: 3px 3px 3px #AAAAAA; }

.gmodwrap_red { background-color:#e63750; border:1px solid #ac0921; -moz-border-radius:7px; -webkit-border-radius:7px; border-radius:7px; padding:8px; color:#ffffff !important; box-shadow: 3px 3px 3px #AAAAAA; }

.gmodwrap_black { background-color:#333333; border:1px solid #666666; -moz-border-radius:7px; -webkit-border-radius:7px; border-radius:7px; padding:8px; color:#ffffff !important; box-shadow: 3px 3px 3px #AAAAAA; }

.gmodwrap_green > h3 { color:#587c3b !important; border-color:#a5d77c !important; }

.gmodwrap_green a, .gmodwrap_green a:hover, .gmodwrap_green a:visited, .gmodwrap_green a:link { color:#31600f !important; }

.gmodwrap_blue > h3, .gmodwrap_red > h3, .gmodwrap_black > h3 { color:#FFFFFF !important; }

.gmodwrap_blue a, .gmodwrap_blue a:hover, .gmodwrap_blue a:visited, .gmodwrap_blue a:link { color:#fdf75f !important; }

.gmodwrap_blue .iosr_gmod_thumb img, .gmodwrap_blue .iosr_gmod_thumb80 img, .gmodwrap_blue .iosr_gmod_thumb120 img, .gmodwrap_blue img.iosr_gmod_thumbnail { border-color:#064a7a !important; }

.gmodwrap_blue > h3 span.subnote, .gmodwrap_blue > h3 span.rightnote { color:#b3d4f2 !important; }

.gmodwrap_blue .iosr_gmod_note { color:#b3d4f2 !important; }

.gmodwrap_red a, .gmodwrap_red a:hover, .gmodwrap_red a:visited, .gmodwrap_red a:link { color:#fdf75f !important; }

.gmodwrap_red .iosr_gmod_thumb img, .gmodwrap_red .iosr_gmod_thumb80 img, .gmodwrap_red .iosr_gmod_thumb120 img, .gmodwrap_red img.iosr_gmod_thumbnail { border-color:#ac0921 !important; }

.gmodwrap_red > h3 span.subnote, .gmodwrap_red > h3 span.rightnote { color:#f9c4d7 !important; }

.gmodwrap_red .iosr_gmod_note { color:#f9c4d7 !important; }

.gmodwrap_black a, .gmodwrap_black a:hover, .gmodwrap_black a:visited, .gmodwrap_black a:link { color:#cccccc !important; }

.gmodwrap_black .iosr_gmod_thumb img, .gmodwrap_black .iosr_gmod_thumb80 img, .gmodwrap_black .iosr_gmod_thumb120 img, .gmodwrap_black img.iosr_gmod_thumbnail { border-color:#666666 !important; }

.gmodwrap_black > h3 span.subnote, .gmodwrap_black > h3 span.rightnote { color:#999999 !important; }

.gmodwrap_black .iosr_gmod_note { color:#999999 !important; }

.gmod_noshadow { -webkit-box-shadow:none !important; -moz-box-shadow:none !important; box-shadow:none !important; }

@media only screen and (max-width: 480px) {

	.gmod_hideportait { margin:0; padding:0; width:1px; height:1px; display:none; visibility:hidden; }

}

@media only screen and (max-width: 320px) {

	.gmod_hideportait { margin:0; padding:0; width:1px; height:1px; display:none; visibility:hidden; }

	.gmod_hidelandscape { margin:0; padding:0; width:1px; height:1px; display:none; visibility:hidden; }

}

/* ====================================================================
   eHolidayer roombox override — Google-material palette
   Loaded after ios.css via iosr.css (later in <head>).
   ==================================================================== */

:root {
	--ir-blue:   #4285F4;
	--ir-blue-70: #1A73E8;
	--ir-red:    #EA4335;
	--ir-yellow: #FBBC05;
	--ir-green:  #34A853;
	--ir-blue-50:  #E8F0FE;
	--ir-ink:    #0F1B2D;
	--ir-fog:    #DCE3EB;
	--ir-mist:   #F5F7FA;
	--ir-white:  #FFFFFF;
	--ir-radius: 6px;
	--ir-person: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2334A853'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M12 14c-6 0-8 3-8 5v1h16v-1c0-2-2-5-8-5z'/%3E%3C/svg%3E")
}

/* ---------------------------------------------------------------------
 * 1. Room box container — Google-yellow border, flex row, frosted details.
 * ------------------------------------------------------------------- */
.iosh_roombox {
	margin: 24px 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 0;
	border: 1px solid var(--ir-yellow);
	border-radius: var(--ir-radius);
	background: var(--ir-white);
	overflow: hidden
}

.iosh_roomboximg {
	float: none;
	flex: 0 0 140px;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	border-radius: 0;
	overflow: hidden
}

.iosh_roomimgwrap img {
	width: 100%;
	height: 100%;
	aspect-ratio: 1 / 1;
	-o-object-fit: cover;
	   object-fit: cover;
	border-radius: 0;
	image-rendering: -webkit-optimize-contrast;
	image-rendering: crisp-edges
}

.iosh_roomboxdetails {
	flex: 1 1 0;
	min-width: 0;
	margin: 0;
	padding: 16px 20px;
	background: var(--ir-white);
	border: none;
	border-radius: 0;
	box-sizing: border-box;
	line-height: 1.5
}

/* ---------------------------------------------------------------------
 * Room title (h3) — flex row, persons on the same line.
 * ------------------------------------------------------------------- */
.iosh_roomboxdetails h3 {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin: 0 0 8px;
	padding: 0;
	font: 600 18px / 1.3 'Figtree', 'Inter', system-ui, sans-serif;
	color: var(--ir-ink);
	white-space: normal;
	overflow: visible
}

/* ---------------------------------------------------------------------
 * iosh_persons — icon(s) + "Max" + number, inline beside title.
 * 1 person → single silhouette; 2 persons → two silhouettes via background.
 * ------------------------------------------------------------------- */
.iosh_persons,
h3 .iosh_persons {
	display: inline-flex;
	flex-direction: row;
	align-items: center;
	gap: 2px;
	padding: 0;
	background: none;
	color: var(--ir-green);
	font: 600 14px / 1.3 'Inter', system-ui, sans-serif;
	white-space: nowrap;
	direction: ltr;
	box-sizing: border-box;
	min-height: 20px;
	vertical-align: middle;
	position: relative
}

.iosh_persons::before,
h3 .iosh_persons::before {
	content: '';
	display: inline-block;
	width: 16px;
	height: 20px;
	background: var(--ir-person) left center no-repeat;
	background-size: 16px 20px;
	flex: 0 0 16px;
	order: 0
}

.iosh_persons[title*="2"]::before,
h3 .iosh_persons[title*="2"]::before {
	width: 34px;
	background-repeat: no-repeat;
	background-position: left center, 18px center;
	background-size: 16px 20px, 16px 20px;
	background-image: var(--ir-person), var(--ir-person)
}

.iosh_persons::after,
h3 .iosh_persons::after {
	content: 'Max';
	display: inline-block;
	margin: 0 3px 0 1px;
	font-size: 11px;
	font-weight: 600;
	color: #5A6A7A;
	text-transform: none;
	order: 2
}

/* ---------------------------------------------------------------------
 * iosh_zero — charge-type row on its own line below the title.
 * ------------------------------------------------------------------- */
.iosh_zero {
	margin: 0 0 4px;
	padding: 0;
	font: normal 13px / 1.4 'Inter', system-ui, sans-serif;
	color: #5A6A7A
}

.iosh_zero strong {
	color: var(--ir-ink);
	font-weight: 600
}

/* ---------------------------------------------------------------------
 * 2. Promo badge — G-Red pill for urgency (discounts/deals).
 * ------------------------------------------------------------------- */
.iosh_roompromo {
	display: inline-block;
	margin: 0 0 8px;
	padding: 5px 14px;
	font: 700 11px / 1 'Inter', system-ui, sans-serif;
	letter-spacing: 0.6px;
	text-transform: uppercase;
	color: var(--ir-white);
	background: var(--ir-red);
	border-radius: 100px;
	box-shadow: 0 2px 10px rgba(234, 67, 53, 0.35);
	vertical-align: middle
}

/* ---------------------------------------------------------------------
 * Meal info — G-Green for board, G-Yellow for half, G-Blue for AI.
 * ------------------------------------------------------------------- */
.iosh_meals_fullboard,
.iosh_meals_halfboard,
.iosh_meals_allinclusive {
	padding: 0 0 0 20px;
	margin: 0 0 4px;
	font: normal 13px / 1.5 'Inter', system-ui, sans-serif;
	background-position: left center;
	background-repeat: no-repeat
}

.iosh_meals_fullboard { color: var(--ir-green); }
.iosh_meals_halfboard { color: var(--ir-yellow); }
.iosh_meals_allinclusive { color: var(--ir-blue); }

/* "More" toggle link */
.iosh_morelink {
	display: inline-block;
	margin: 4px 0 0;
	font: 600 12px / 1.4 'Inter', system-ui, sans-serif;
	color: var(--ir-blue);
	text-decoration: none
}

.iosh_morelink:hover {
	color: var(--ir-blue-70);
	text-decoration: underline
}

/* ---------------------------------------------------------------------
 * 3. iosh_morebox (expanded area) — room details with proper spacing.
 * ------------------------------------------------------------------- */
.iosh_morebox {
	margin: 8px 0 0;
	padding: 0
}

.iosh_roomdbox {
	margin: 0 0 4px;
	padding: 14px 16px;
	background: var(--ir-mist);
	border: 1px solid var(--ir-fog);
	border-radius: var(--ir-radius)
}

.iosh_roomdbox p {
	margin: 0 0 12px;
	padding: 0;
	font: normal 13px / 1.5 'Inter', system-ui, sans-serif;
	color: var(--ir-ink)
}

.iosh_roomdbox p strong {
	color: var(--ir-ink);
	font-weight: 600
}

/* iosh_h4 — "Room facilities" section header with G-Yellow accent. */
.iosh_roomdbox h4,
.iosh_roomdbox h4.iosh_h4 {
	margin: 0 0 10px;
	padding: 0 0 6px;
	font: 600 13px / 1.4 'Inter', system-ui, sans-serif;
	color: var(--ir-ink);
	text-transform: uppercase;
	letter-spacing: 0.4px;
	border: none;
	border-bottom: 2px solid var(--ir-yellow)
}

/* 3-column bulleted list for room facilities (PHP emits <ul class="iosh_faclist">) */
.iosh_faclist {
	margin: 0 0 12px;
	padding: 0;
	list-style: none !important;
	list-style-type: none !important;
	column-count: 3;
	column-gap: 16px;
	column-rule: 1px solid var(--ir-fog);
	font: normal 13px / 1.6 'Inter', system-ui, sans-serif;
	color: var(--ir-ink)
}

.iosh_faclist li {
	margin: 0 0 4px;
	padding: 0 0 0 14px;
	position: relative;
	break-inside: avoid;
	list-style: none !important;
	list-style-type: none !important
}

.iosh_faclist li::before {
	content: '\2022';
	position: absolute;
	left: 0;
	color: var(--ir-green);
	font-weight: 700;
	font-size: 14px;
	line-height: 1.6
}

/* Calendar link */
.iosh_calelink {
	display: inline-block;
	margin: 10px 0 0;
	font: 600 12px / 1.4 'Inter', system-ui, sans-serif;
	color: var(--ir-blue);
	text-decoration: none
}

.iosh_calelink:hover {
	color: var(--ir-blue-70)
}

/* ---------------------------------------------------------------------
 * 4. iosh_roomboxbottom — card stack for promotions/discounts.
 *    G-Green left border for discounts, G-Red for non-refundable.
 * ------------------------------------------------------------------- */
.iosh_roomboxbottom {
	margin: 12px 0 0;
	padding: 0;
	background: none;
	border: none;
	border-top: none;
	display: flex;
	flex-direction: column;
	gap: 8px
}

.iosh_roomboxbottom > div {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 12px 16px;
	background: var(--ir-white);
	border: 1px solid var(--ir-fog);
	border-left: 3px solid var(--ir-green);
	border-radius: var(--ir-radius);
	font: normal 13px / 1.5 'Inter', system-ui, sans-serif;
	color: var(--ir-ink)
}

.iosh_roomboxbottom > div strong {
	color: var(--ir-green);
	font-weight: 700;
	margin-right: 4px
}

.iosh_roomboxbottom > div:has(abbr) {
	border-left-color: var(--ir-red);
	background: #FEF7F5
}

.iosh_roomboxbottom > div:has(abbr) strong {
	color: var(--ir-red)
}

.iosh_roomboxbottom abbr {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	margin-left: auto;
	font: 700 11px / 1 'Inter', system-ui, sans-serif;
	color: var(--ir-red);
	background: #FDECEA;
	border-radius: 50%;
	cursor: help;
	text-decoration: none;
	border: none;
	flex: 0 0 18px
}

.iosh_roomboxbottom abbr:hover {
	background: var(--ir-red);
	color: var(--ir-white)
}

/* ---------------------------------------------------------------------
 * 5. Hotel facilities (iosh_h2) — 3-column bulleted <ul>.
 * ------------------------------------------------------------------- */
#hotelfacilities.iosh_h2,
h2.iosh#hotelfacilities,
h2[id="hotelfacilities"] {
	margin: 32px 0 14px;
	padding: 0 0 8px;
	font: 700 18px / 1.3 'Figtree', 'Inter', system-ui, sans-serif;
	color: var(--ir-ink);
	border-bottom: 2px solid var(--ir-yellow);
	letter-spacing: -0.3px
}

.iosh_hotelfac {
	column-count: 3;
	column-gap: 24px
}

/* ---------------------------------------------------------------------
 * 6. #hotelrooms — heading, no columns for the summary <p>.
 * ------------------------------------------------------------------- */
#hotelrooms.iosh_h2,
h2[id="hotelrooms"] {
	margin: 24px 0 12px;
	padding: 0 0 8px;
	font: 700 18px / 1.3 'Figtree', 'Inter', system-ui, sans-serif;
	color: var(--ir-ink);
	border-bottom: 2px solid var(--ir-blue);
	letter-spacing: -0.3px
}

#hotelrooms + p,
h2[id="hotelrooms"] + p {
	margin: 0 0 12px;
	padding: 0;
	font: normal 13px / 1.5 'Inter', system-ui, sans-serif;
	color: #5A6A7A;
	columns: auto
}

/* ---------------------------------------------------------------------
 * 7. #hoteldates — availability form redesign.
 * ------------------------------------------------------------------- */
#hoteldates {
	margin: 16px 0;
	padding: 0
}

.iosh_formwrap_titled {
	margin: 0 0 16px;
	padding: 16px 20px;
	background: var(--ir-mist);
	border: 1px solid var(--ir-fog);
	border-left: 4px solid var(--ir-blue);
	border-radius: var(--ir-radius)
}

.iosh_formtitle {
	position: static;
	margin: 0 0 12px;
	padding: 0
}

.iosh_formtitle h4,
.iosh_formtitle h4.iosh_formh4 {
	margin: 0;
	padding: 0 0 10px;
	font: 600 13px / 1.3 'Inter', system-ui, sans-serif;
	color: var(--ir-ink);
	text-transform: capitalize;
	letter-spacing: 0.2px;
	border: none;
	border-bottom: 1px solid var(--ir-fog);
	background: none
}

.iosh_formrow {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 12px;
	margin: 0 0 12px;
	padding: 0;
	font: normal 13px / 1.5 'Inter', system-ui, sans-serif;
	color: #5A6A7A
}

/* Neutralize ios.css .iosh_formrow:after { clear: both } —
   the old float clearfix becomes a rogue flex item inside a flex container,
   pushing inputs apart. Force it to zero size. */
.iosh_formrow:after {
	display: none
}

.iosh_formrow > label {
	flex: 0 0 auto;
	margin: 0;
	padding: 10px 12px 10px 0;
	font: 600 12px / 1.4 'Inter', system-ui, sans-serif;
	color: var(--ir-ink);
	letter-spacing: 0.2px;
	text-transform: capitalize
}

.iosh_formrow > div {
	flex: 1 1 0;
	min-width: 0
}

input.iosh_indate,
input[type="text"].iosh_indate,
input.iosh_intext,
input[type="text"].iosh_intext {
	padding: 10px 14px;
	border: 1px solid var(--ir-fog);
	border-radius: var(--ir-radius);
	font: normal 14px / 1.4 'Inter', system-ui, sans-serif;
	color: var(--ir-ink);
	background: var(--ir-white);
	box-sizing: border-box;
	transition: border-color 0.15s, box-shadow 0.15s;
	width: 100%;
	min-width: 0;
	flex: 1 1 auto
}

input.iosh_indate:focus,
input[type="text"].iosh_indate:focus,
input.iosh_intext:focus,
input[type="text"].iosh_intext:focus {
	border-color: var(--ir-blue);
	outline: none;
	box-shadow: 0 0 0 3px rgba(66, 133, 244, 0.18)
}

select.iosh_select {
	padding: 10px 32px 10px 14px;
	border: 1px solid var(--ir-fog);
	border-radius: var(--ir-radius);
	font: normal 14px / 1.4 'Inter', system-ui, sans-serif;
	color: var(--ir-ink);
	background: var(--ir-white);
	box-sizing: border-box;
	transition: border-color 0.15s, box-shadow 0.15s;
	width: 100%;
	min-width: 0;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%235A6A7A' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	cursor: pointer
}

select.iosh_select:focus {
	border-color: var(--ir-blue);
	outline: none;
	box-shadow: 0 0 0 3px rgba(66, 133, 244, 0.18)
}

.iosh_checkboxlabel {
	font-size: 13px;
	color: var(--ir-ink);
	text-transform: capitalize
}

button.iosh_btn,
.iosh_btn {
	padding: 11px 28px;
	background: var(--ir-green);
	color: var(--ir-white);
	border: none;
	border-radius: var(--ir-radius);
	font: 600 14px / 1.4 'Inter', system-ui, sans-serif;
	cursor: pointer;
	letter-spacing: 0.2px;
	text-transform: capitalize;
	transition: background-color 0.18s, box-shadow 0.18s, transform 0.1s;
	min-width: 120px;
	min-height: 42px;
	flex: 0 0 auto;
	align-self: flex-end;
	box-shadow: 0 2px 10px rgba(52, 168, 83, 0.3)
}

button.iosh_btn:hover,
.iosh_btn:hover {
	background: #2E7D32;
	box-shadow: 0 4px 14px rgba(52, 168, 83, 0.4);
	transform: translateY(-1px)
}

button.iosh_btn:active,
.iosh_btn:active {
	transform: translateY(0);
	box-shadow: 0 1px 4px rgba(52, 168, 83, 0.3)
}

.iosh_tip {
	margin: 0 0 8px;
	padding: 0;
	font-size: 12px;
	color: #5A6A7A
}

.iosh_morebox {
	flex-direction: column;
	gap: 8px;
	align-items: stretch
}

.iosh_pickrowguests {
	display: flex;
	gap: 12px;
	font-size: 12px;
	color: #5A6A7A;
	padding: 0 0 4px;
	border-bottom: 1px solid var(--ir-fog);
	flex: 0 0 auto
}

.iosh_pickadults,
.iosh_pickchildren {
	padding: 0 4px
}

.iosh_pickrow {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 6px 0;
	border-bottom: 1px solid var(--ir-fog)
}

.iosh_pickrow:last-child {
	border-bottom: none
}

.iosh_pickboxroom {
	display: flex;
	align-items: center;
	gap: 4px
}

.iosh_pickroomnum {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	font: 700 12px / 1 'Inter', system-ui, sans-serif;
	color: var(--ir-white);
	background: var(--ir-blue);
	border-radius: 50%
}

.iosh_pickroomact {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	font: 700 14px / 1 'Inter', system-ui, sans-serif;
	color: var(--ir-white);
	background: var(--ir-red);
	border-radius: 50%;
	text-decoration: none;
	transition: background-color 0.15s
}

.iosh_pickroomact:hover {
	background: #C62828
}

.iosh_pickboxguests {
	display: flex;
	align-items: center;
	gap: 2px
}

.iosh_pickaction {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	font: 700 12px / 1 'Inter', system-ui, sans-serif;
	color: var(--ir-blue);
	background: var(--ir-mist);
	border-radius: 50%;
	text-decoration: none;
	transition: background-color 0.15s, color 0.15s
}

.iosh_pickaction:hover {
	background: var(--ir-blue);
	color: var(--ir-white)
}

input.iosh_inguests,
input[type="text"].iosh_inguests {
	width: 32px;
	padding: 4px;
	border: 1px solid var(--ir-fog);
	border-radius: 4px;
	font: 600 13px / 1 'Inter', system-ui, sans-serif;
	color: var(--ir-ink);
	background: var(--ir-white);
	text-align: center;
	box-sizing: border-box
}

/* Stack the form fields on small screens */
@media only screen and (max-width: 520px) {
	.iosh_formrow {
		flex-direction: column;
		align-items: stretch
	}

	button.iosh_btn,
	.iosh_btn {
		width: 100%;
		min-width: 0
	}

	.iosh_morebox {
		gap: 6px
	}
}

/* ---------------------------------------------------------------------
 * 8. iosh_highlightbox — bold banner with G-Yellow icon accent.
 * ------------------------------------------------------------------- */
.iosh_highlightbox {
	margin: 16px 0;
	padding: 16px 24px 16px 60px;
	position: relative;
	background: linear-gradient(90deg, #FFF9E6 0%, #FFF3CC 100%);
	border: 1px solid var(--ir-yellow);
	border-left: 4px solid var(--ir-yellow);
	border-radius: var(--ir-radius);
	font: normal 13px / 1.6 'Inter', system-ui, sans-serif;
	color: var(--ir-ink);
	overflow: hidden
}

.iosh_highlightbox::before {
	content: '\2713';
	position: absolute;
	left: 16px;
	top: 50%;
	transform: translateY(-50%);
	width: 30px;
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	font: 700 16px / 1 'Inter', system-ui, sans-serif;
	color: var(--ir-ink);
	background: var(--ir-yellow);
	border-radius: 50%;
	box-shadow: 0 2px 6px rgba(251, 188, 5, 0.35)
}

.iosh_highlightbox strong {
	color: var(--ir-ink);
	font-weight: 700
}

/* ---------------------------------------------------------------------
 * 9. iosh_nav — ghost tabs: bare inline links, minimal & airy.
 * ------------------------------------------------------------------- */
.iosh_nav {
	margin: 0 0 12px;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0;
	background: none;
	border: none;
	color: var(--ir-ink);
	position: relative
}

/* "Back to hotel" — breadcrumb-style bar above tabs */
a.iosh_navaback_off {
	display: none;
	visibility: hidden
}

a.iosh_navaback_on {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 12px;
	margin: 0 0 8px 0;
	font: 500 13px / 1.4 'Inter', system-ui, sans-serif;
	text-decoration: none;
	white-space: nowrap;
	color: var(--ir-blue);
	border: 1px solid #D2E3F8;
	border-left: 3px solid var(--ir-blue);
	border-radius: 3px;
	background: #F0F5FB;
	transition: background-color 0.2s ease, border-color 0.2s ease
}

a.iosh_navaback_on::before {
	content: '';
	display: inline-block;
	width: 14px;
	height: 14px;
	border-left: 2px solid var(--ir-blue);
	border-bottom: 2px solid var(--ir-blue);
	transform: rotate(45deg);
	flex-shrink: 0;
	margin-right: -2px
}

a.iosh_navaback_on:hover {
	background: #E3EFFB;
	border-color: var(--ir-blue);
	color: var(--ir-blue-70)
}

a.iosh_navaback_on:hover::before {
	border-left-color: var(--ir-blue-70);
	border-bottom-color: var(--ir-blue-70)
}

/* Tab links — bare text with vertical dividers */
.iosh_nav > a.iosh_nava,
.iosh_nav > a:not(.iosh_navaback_off):not(.iosh_navaback_on) {
	display: inline-flex;
	align-items: center;
	padding: 6px 14px;
	font: 500 13px / 1.4 'Inter', system-ui, sans-serif;
	color: #5A6A7A;
	text-decoration: none;
	white-space: nowrap;
	border: none;
	background: none;
	cursor: pointer;
	transition: color 0.15s;
	letter-spacing: 0.2px;
	position: relative
}

/* Remove stray leading space before first tab */
.iosh_nav > a.iosh_nava:first-of-type,
.iosh_nav > a:not(.iosh_navaback_off):not(.iosh_navaback_on):first-of-type {
	padding-left: 0
}

/* Vertical divider after each tab */
.iosh_nav > a.iosh_nava:not(:last-child)::after,
.iosh_nav > a:not(.iosh_navaback_off):not(.iosh_navaback_on):not(:last-child)::after {
	content: '';
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 1px;
	height: 14px;
	background: var(--ir-fog)
}

.iosh_nav > a.iosh_nava:hover,
.iosh_nav > a:not(.iosh_navaback_off):not(.iosh_navaback_on):hover {
	color: var(--ir-ink)
}

/* Active tab — bold G-Blue, no background */
.iosh_nav > a.iosh_nava:active,
.iosh_nav > a:not(.iosh_navaback_off):not(.iosh_navaback_on):active,
.iosh_nav > a.active {
	color: var(--ir-blue);
	font-weight: 700;
	background: none
}

/* "Reviews" tab — badge pill with score, remarkable */
.iosh_nav > a.iosh_nava:last-of-type,
.iosh_nav > a:not(.iosh_navaback_off):not(.iosh_navaback_on):last-of-type {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 12px 5px 14px;
	margin-left: 4px;
	font-weight: 600;
	color: var(--ir-white);
	background: var(--ir-blue);
	border-radius: 100px;
	font-size: 12px;
	letter-spacing: 0.2px
}

/* Score number — slightly bolder, no divider after */
.iosh_nav > a.iosh_nava:last-of-type::after,
.iosh_nav > a:not(.iosh_navaback_off):not(.iosh_navaback_on):last-of-type::after {
	display: none
}

.iosh_nav > a.iosh_nava:last-of-type:hover,
.iosh_nav > a:not(.iosh_navaback_off):not(.iosh_navaback_on):last-of-type:hover {
	color: var(--ir-white);
	background: var(--ir-blue-70)
}

.iosh_nav > a.iosh_nava:last-of-type:active,
.iosh_nav > a.active:last-of-type {
	color: var(--ir-white);
	background: var(--ir-blue);
	font-weight: 700
}

/* Nav title — hidden */
span.iosh_navtitle_off,
span.iosh_navtitle_on {
	display: none
}

/* Responsive — wrap naturally on small screens */
@media only screen and (max-width: 480px) {
	.iosh_nav {
		gap: 0
	}

	a.iosh_navaback_on {
		padding: 8px 10px;
		font-size: 12px;
		margin-bottom: 6px
	}

	.iosh_nav > a.iosh_nava,
	.iosh_nav > a:not(.iosh_navaback_off):not(.iosh_navaback_on) {
		padding: 8px 10px;
		font-size: 12px
	}

	.iosh_nav > a.iosh_nava:first-of-type,
	.iosh_nav > a:not(.iosh_navaback_off):not(.iosh_navaback_on):first-of-type {
		padding-left: 0
	}

	.iosh_nav > a.iosh_nava:last-of-type,
	.iosh_nav > a:not(.iosh_navaback_off):not(.iosh_navaback_on):last-of-type {
		padding: 4px 10px 4px 12px;
		font-size: 11px;
		margin-left: 2px
	}
}

/* Force nav visible on all screen sizes (override ios.css display:none) */
@media only screen and (max-width: 400px) {
	.iosh_nav {
		display: flex !important;
	}
}

/* ---------------------------------------------------------------------
 * 10. iosh_cornerscore — floating score badge over hero image.
 *    Same style as the homepage module (blue pill, white bold text).
 * ------------------------------------------------------------------- */
.iosh_strechimg {
	position: relative;
	overflow: visible !important
}

.iosh_cornerscore,
a.iosh_cornerscore,
a.iosh_cornerscore:link,
a.iosh_cornerscore:visited {
	position: absolute;
	top: 8px;
	right: 8px;
	z-index: 20;
	margin: 0;
	padding: 4px 8px;
	background-color: rgb(8, 150, 255);
	border-radius: 3px;
	font: 700 13px / 16px arial, Helvetica, sans-serif;
	color: rgb(255, 255, 255);
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.15s, transform 0.12s
}

a.iosh_cornerscore:hover {
	background-color: rgb(0, 110, 220);
	transform: scale(1.05);
	color: rgb(255, 255, 255);
	text-decoration: none
}

@media only screen and (max-width: 480px) {
	.iosh_cornerscore,
	a.iosh_cornerscore {
		top: 6px;
		right: 6px;
		padding: 3px 6px;
		font-size: 12px;
		line-height: 14px
	}
}

/* ---------------------------------------------------------------------
 * 10. iosh_bigrating — sidebar hotel rating badge.
 *    Blue circle score (matching iosh_hotelboxscorel) + muted label.
 * ------------------------------------------------------------------- */
.iosh_bigrating {
	margin: 2px 0;
	padding: 14px 0 8px 0;
	display: block;
	text-align: center;
	clear: both
}

.iosh_bigrating_num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background-color: var(--ir-blue);
	font: 700 22px / 1 'Inter', 'Roboto', arial, sans-serif;
	color: var(--ir-white);
	box-shadow: 0 4px 14px rgba(66, 133, 244, 0.35)
}

.iosh_bigrating > div {
	margin: 6px 0 0 0;
	font: 500 12px / 1.4 'Inter', 'Open Sans', Arial, Helvetica, sans-serif;
	color: #5A6A7A;
	text-align: center
}

/* ---------------------------------------------------------------------
 * 11. Zebra DatePicker — restyled to match Google-material palette.
 * ------------------------------------------------------------------- */
.Zebra_DatePicker {
	background: var(--ir-white);
	border: 1px solid var(--ir-fog);
	border-radius: var(--ir-radius);
	box-shadow: 0 8px 28px rgba(15, 27, 45, 0.12);
	font: normal 13px / 1.4 'Inter', system-ui, sans-serif;
	z-index: 9999;
	overflow: hidden
}

.Zebra_DatePicker * {
	font-family: inherit
}

/* Header — G-Blue band */
.Zebra_DatePicker .dp_header td {
	color: var(--ir-white);
	background: var(--ir-blue);
	padding: 10px 6px;
	border: none
}

.Zebra_DatePicker .dp_header .dp_caption {
	font: 600 14px / 1.4 'Inter', system-ui, sans-serif;
	letter-spacing: 0.2px
}

.Zebra_DatePicker .dp_header .dp_previous,
.Zebra_DatePicker .dp_header .dp_next {
	width: 32px;
	font-size: 18px;
	color: rgba(255, 255, 255, 0.85);
	cursor: pointer;
	transition: background-color 0.15s, color 0.15s
}

.Zebra_DatePicker .dp_header .dp_previous:hover,
.Zebra_DatePicker .dp_header .dp_next:hover {
	background: rgba(255, 255, 255, 0.15);
	color: var(--ir-white)
}

.Zebra_DatePicker .dp_header .dp_hover {
	background: rgba(255, 255, 255, 0.15);
	color: var(--ir-white);
	border-radius: var(--ir-radius)
}

.Zebra_DatePicker .dp_header .dp_blocked {
	color: rgba(255, 255, 255, 0.35);
	cursor: default
}

/* Day / month / year cells */
.Zebra_DatePicker .dp_daypicker td,
.Zebra_DatePicker .dp_daypicker th,
.Zebra_DatePicker .dp_monthpicker td,
.Zebra_DatePicker .dp_yearpicker td {
	width: 34px;
	padding: 6px 0;
	border: none;
	background: var(--ir-white);
	color: var(--ir-ink);
	font: 500 13px / 1.4 'Inter', system-ui, sans-serif;
	text-align: center;
	cursor: pointer;
	transition: background-color 0.12s, color 0.12s
}

.Zebra_DatePicker .dp_daypicker th {
	background: var(--ir-mist);
	color: #5A6A7A;
	font: 600 11px / 1.4 'Inter', system-ui, sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.4px;
	padding: 6px 0
}

.Zebra_DatePicker td.dp_week_number,
.Zebra_DatePicker .dp_daypicker th.dp_week_number {
	background: var(--ir-mist);
	color: #98A8B8;
	font-size: 10px;
	padding-top: 8px
}

/* Weekend columns — subtle mist tint */
.Zebra_DatePicker td.dp_weekend {
	background: var(--ir-mist);
	color: var(--ir-ink)
}

/* Adjacent-month days — faded */
.Zebra_DatePicker td.dp_not_in_month {
	background: var(--ir-white);
	color: #B8C4D0;
	cursor: default
}

/* Disabled dates */
.Zebra_DatePicker td.dp_disabled {
	background: var(--ir-white);
	color: #CDD5DE;
	cursor: default;
	text-decoration: line-through;
	-webkit-text-decoration-color: #E0E6ED;
	        text-decoration-color: #E0E6ED
}

.Zebra_DatePicker td.dp_weekend_disabled {
	background: var(--ir-mist);
	color: #CDD5DE;
	cursor: default
}

.Zebra_DatePicker td.dp_disabled_current {
	color: #E88;
	background: var(--ir-white)
}

/* Today — G-Red ring */
.Zebra_DatePicker td.dp_current {
	color: var(--ir-red);
	font-weight: 700;
	background: var(--ir-white)
}

/* Selected date — G-Blue filled */
.Zebra_DatePicker td.dp_selected {
	background: var(--ir-blue) !important;
	color: var(--ir-white) !important;
	font-weight: 700;
	border-radius: 50%
}

/* Hover on selectable cells */
.Zebra_DatePicker td.dp_hover {
	background: var(--ir-blue-50);
	color: var(--ir-blue);
	border-radius: 50%
}

/* Month / year picker cells */
.Zebra_DatePicker .dp_monthpicker td,
.Zebra_DatePicker .dp_yearpicker td {
	width: 33%;
	padding: 10px 0
}

.Zebra_DatePicker .dp_monthpicker td.dp_hover,
.Zebra_DatePicker .dp_yearpicker td.dp_hover {
	background: var(--ir-blue-50);
	color: var(--ir-blue)
}

.Zebra_DatePicker .dp_monthpicker td.dp_selected,
.Zebra_DatePicker .dp_yearpicker td.dp_selected {
	background: var(--ir-blue);
	color: var(--ir-white)
}

/* Footer — clear button */
.Zebra_DatePicker .dp_footer td {
	padding: 8px 6px;
	background: var(--ir-mist);
	border-top: 1px solid var(--ir-fog);
	color: #5A6A7A;
	font: 500 12px / 1.4 'Inter', system-ui, sans-serif;
	cursor: pointer;
	transition: background-color 0.12s, color 0.12s
}

.Zebra_DatePicker .dp_footer td:hover {
	background: var(--ir-fog);
	color: var(--ir-ink)
}

/* Calendar icon button */
button.Zebra_DatePicker_Icon,
button.Zebra_DatePicker_Icon_Inside {
	width: 16px;
	height: 16px;
	background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="%234285F4" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/></svg>') no-repeat center;
	border: none;
	cursor: pointer;
	margin: 0 0 0 6px;
	padding: 0;
	text-indent: -9999px;
	flex: 0 0 16px;
	opacity: 0.7;
	transition: opacity 0.15s
}

button.Zebra_DatePicker_Icon:hover,
button.Zebra_DatePicker_Icon_Inside:hover {
	opacity: 1
}

button.Zebra_DatePicker_Icon_Disabled {
	opacity: 0.35;
	cursor: default
}

/* Responsive — full-width on small screens */
@media only screen and (max-width: 400px) {
	.Zebra_DatePicker {
		left: 8px !important;
		right: 8px !important;
		width: auto !important
	}

	.Zebra_DatePicker .dp_daypicker td,
	.Zebra_DatePicker .dp_daypicker th,
	.Zebra_DatePicker .dp_monthpicker td,
	.Zebra_DatePicker .dp_yearpicker td {
		width: auto;
		padding: 8px 4px
	}
}

/* ---------------------------------------------------------------------
 * 11. iosh_notebox — G-Red tint for "no rooms available" warnings.
 * ------------------------------------------------------------------- */
.iosh_notebox {
	margin: 16px 0;
	padding: 14px 16px;
	background: #FEF7F5;
	border: 1px solid #F5C6C0;
	border-left: 4px solid var(--ir-red);
	border-radius: var(--ir-radius);
	font: normal 13px / 1.6 'Inter', system-ui, sans-serif;
	color: var(--ir-ink)
}

.iosh_notebox strong {
	color: var(--ir-red)
}

/* ---------------------------------------------------------------------
 * iosh_pickrowrooms — sit flush beside roomboxdetails.
 * ------------------------------------------------------------------- */
.iosh_pickrowrooms {
	margin: 0;
	padding: 0;
	float: none;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px
}

.iosh_pickrow {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 4px 8px;
	background: var(--ir-mist);
	border-radius: var(--ir-radius);
	font: 600 13px / 1.4 'Inter', system-ui, sans-serif;
	color: var(--ir-ink)
}

.iosh_pickrow:hover .iosh_pickroomnum {
	background-color: var(--ir-green)
}

.iosh_pickroomnum {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	background: var(--ir-green);
	color: var(--ir-white);
	border-radius: 50%;
	font: 700 12px / 1 'Inter', system-ui, sans-serif
}

.iosh_pickrowact {
	color: var(--ir-ink);
	text-decoration: none;
	font-weight: 700;
	padding: 0 4px
}

.iosh_pickrowact:hover {
	color: var(--ir-green)
}

.iosh_pickaction {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	color: var(--ir-green);
	text-decoration: none;
	font-size: 12px;
	border-radius: 50%
}

.iosh_pickaction:hover {
	background: #E8F5E9
}

.iosh_inguests {
	width: 28px;
	padding: 2px 4px;
	text-align: center;
	border: 1px solid var(--ir-fog);
	border-radius: 4px;
	font: 600 13px / 1 'Inter', system-ui, sans-serif;
	color: var(--ir-ink);
	background: var(--ir-white)
}

/* ---------------------------------------------------------------------
 * 10. iosh_pickbookwrap — complete redesign: card surface, dominant CTA.
 * ------------------------------------------------------------------- */
.iosh_pickbookwrap {
	margin: 16px 0 0;
	padding: 12px;
	background: var(--ir-mist);
	border: 1px solid var(--ir-fog);
	border-radius: var(--ir-radius);
	display: flex;
	flex-direction: column;
	gap: 10px;
	clear: both
}

.iosh_pickbookwrap .iosh_pickrowrooms {
	flex: 1 1 auto
}

.iosh_invisible2 {
	display: none
}

.iosh_pickbookwrap .iosh_pickrow {
	margin: 0;
	padding: 6px 8px;
	background: var(--ir-white);
	border: 1px solid var(--ir-fog);
	border-radius: var(--ir-radius)
}

.iosh_pickboxroom {
	display: flex;
	align-items: center;
	gap: 6px
}

.iosh_pickboxguests {
	display: flex;
	align-items: center;
	gap: 4px;
	font: normal 12px / 1.4 'Inter', system-ui, sans-serif;
	color: var(--ir-ink)
}

.iosh_pickbookroom {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 60px;
	padding: 2px 8px;
	background: var(--ir-blue-50);
	color: var(--ir-blue);
	border-radius: 4px;
	font: 600 12px / 1.4 'Inter', system-ui, sans-serif
}

/* ---------------------------------------------------------------------
 * 11. BOOK button — dominant full-width CTA in G-Green.
 * ------------------------------------------------------------------- */
.iosh_btnbook,
button.iosh_btnbook,
button[name^="bookpickedsub"],
input[name^="bookpickedsub"] {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	padding: 12px 20px;
	margin: 0;
	font: 700 15px / 1.3 'Inter', system-ui, sans-serif;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	color: var(--ir-white);
	background: var(--ir-green);
	border: none;
	border-radius: var(--ir-radius);
	cursor: pointer;
	transition: background-color 0.18s, box-shadow 0.18s, transform 0.12s;
	box-shadow: 0 2px 10px rgba(52, 168, 83, 0.35);
	-webkit-appearance: none;
	        appearance: none
}

.iosh_btnbook:hover,
button.iosh_btnbook:hover,
button[name^="bookpickedsub"]:hover {
	background: #2E7D32;
	box-shadow: 0 4px 16px rgba(52, 168, 83, 0.45);
	transform: translateY(-1px)
}

.iosh_btnbook:active,
button.iosh_btnbook:active,
button[name^="bookpickedsub"]:active {
	transform: translateY(0);
	box-shadow: 0 1px 4px rgba(52, 168, 83, 0.3)
}

.iosh_btnbook:disabled,
button.iosh_btnbook:disabled,
button[name^="bookpickedsub"]:disabled {
	background: var(--ir-fog);
	color: #98A8B8;
	cursor: not-allowed;
	box-shadow: none;
	transform: none
}

.iosh_btnbook div,
button.iosh_btnbook div,
button[name^="bookpickedsub"] div {
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
	opacity: 0.9
}

.iosh_invisible.iosh_paynownote {
	display: none;
	margin: 0 0 6px;
	padding: 6px 10px;
	background: var(--ir-blue-50);
	border-radius: 4px;
	font: normal 12px / 1.4 'Inter', system-ui, sans-serif;
	color: var(--ir-blue)
}

/* ---------------------------------------------------------------------
 * "Back to top" link — subtle.
 * ------------------------------------------------------------------- */
.iosh_goto {
	margin: 12px 0 0;
	padding: 0;
	font: normal 12px / 1.4 'Inter', system-ui, sans-serif;
	text-align: right
}

.iosh_goto a {
	color: var(--ir-blue);
	text-decoration: none
}

.iosh_goto a:hover {
	text-decoration: underline
}

/* ---------------------------------------------------------------------
 * Responsive — keep side-by-side down to 480px, stack only below.
 * ------------------------------------------------------------------- */
@media only screen and (max-width: 768px) {
	.iosh_roomboxdetails h3 {
		flex-direction: column;
		align-items: flex-start;
		gap: 6px
	}

	.iosh_pickbookwrap {
		padding: 10px
	}

	.iosh_faclist,
	.iosh_hotelfac {
		column-count: 2
	}
}

@media only screen and (max-width: 480px) {
	.iosh_roombox {
		flex-direction: column
	}

	.iosh_roomboximg {
		flex: none;
		width: 100%
	}

	.iosh_roomimgwrap img {
		aspect-ratio: 16 / 9
	}

	.iosh_roomboxdetails {
		padding: 12px 14px
	}

	.iosh_roomboxdetails h3 {
		flex-direction: column;
		align-items: flex-start;
		gap: 6px
	}

	.iosh_pickbookwrap {
		padding: 8px
	}

	.iosh_btnbook,
	button.iosh_btnbook,
	button[name^="bookpickedsub"] {
		padding: 10px 14px;
		font-size: 14px
	}

	.iosh_faclist,
	.iosh_hotelfac {
		column-count: 2
	}
}

/* ====================================================================
   12. Destination page — hotel listing cards, filters, room summaries.
   ==================================================================== */

/* ---------------------------------------------------------------------
 * Hotel card container — elevated surface, left accent border.
 * ------------------------------------------------------------------- */
.iosh_hotelbox {
	margin: 0 0 20px;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 0;
	background: var(--ir-white);
	border: 1px solid var(--ir-fog);
	border-left: 4px solid var(--ir-blue);
	border-radius: var(--ir-radius);
	box-shadow: 0 2px 12px rgba(15, 27, 45, 0.06);
	transition: box-shadow 0.2s, border-color 0.2s;
	overflow: hidden
}

.iosh_hotelbox:hover {
	box-shadow: 0 6px 24px rgba(15, 27, 45, 0.12);
	border-color: #B8C4D0
}

/* ---------------------------------------------------------------------
 * Right rail — score, price, map.
 * ------------------------------------------------------------------- */
.iosh_hotelboxright {
	flex: 0 0 160px;
	margin: 0;
	padding: 14px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	background: var(--ir-mist);
	border-left: 1px solid var(--ir-fog)
}

/* ---------------------------------------------------------------------
 * Left + center — image + details.
 * ------------------------------------------------------------------- */
.iosh_hotelboxleft {
	flex: 1 1 0;
	min-width: 0;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: stretch
}

/* ---------------------------------------------------------------------
 * Image thumbnail — score badge floats on top-right.
 * ------------------------------------------------------------------- */
.iosh_hotelboximg {
	flex: 0 0 160px;
	margin: 0;
	padding: 0;
	position: relative;
	overflow: hidden
}

.iosh_quickimgwrap {
	position: relative
}

.iosh_hotelboximg img {
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
	display: block
}

.iosh_hotelboximg span {
	position: absolute;
	bottom: 6px;
	left: 6px;
	padding: 3px 8px;
	background: var(--ir-red);
	color: var(--ir-white);
	font: 600 10px / 1.3 'Inter', system-ui, sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	border-radius: 3px
}

/* ---------------------------------------------------------------------
 * Hotel details — name, stars, address, rooms.
 * ------------------------------------------------------------------- */
.iosh_hotelboxdetails {
	flex: 1 1 0;
	min-width: 0;
	margin: 0;
	padding: 14px 16px;
	box-sizing: border-box
}

.iosh_hotelboxdetails h3 {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 6px;
	padding: 0;
	font: 700 18px / 1.3 'Figtree', 'Inter', system-ui, sans-serif;
	color: var(--ir-ink);
	white-space: normal;
	border: none;
	overflow: visible
}

.iosh_hotelboxdetails h3 a,
.iosh_hotelboxdetails h3 a:link,
.iosh_hotelboxdetails h3 a:visited {
	color: var(--ir-blue);
	text-decoration: none;
	border: none
}

.iosh_hotelboxdetails h3 a:hover {
	color: var(--ir-blue-70);
	text-decoration: underline
}

.iosh_hotboxaddress {
	margin: 0 0 10px;
	font: normal 13px / 1.5 'Inter', system-ui, sans-serif;
	color: #5A6A7A
}

.iosh_hotboxaddress a {
	color: #5A6A7A;
	text-decoration: none
}

.iosh_hotboxaddress a:hover {
	color: var(--ir-blue);
	text-decoration: underline
}

/* ---------------------------------------------------------------------
 * Score badge — large blue circle in right rail.
 * ------------------------------------------------------------------- */
.iosh_hotelboxscore {
	margin: 0;
	padding: 0;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0;
	background: none
}

.iosh_hotelboxscorel {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	margin: 0;
	padding: 0;
	border-radius: 50%;
	background: var(--ir-blue);
	text-align: center;
	font: 700 22px / 1 'Inter', system-ui, sans-serif;
	color: var(--ir-white);
	box-shadow: 0 4px 14px rgba(66, 133, 244, 0.35)
}

.iosh_hotelboxscorer {
	display: block;
	margin: 6px 0 0;
	padding: 0;
	text-align: center;
	font: 500 12px / 1.4 'Inter', system-ui, sans-serif;
	color: #5A6A7A;
	text-decoration: none;
	border: none;
	float: none;
	width: auto
}

/* ---------------------------------------------------------------------
 * Price display.
 * ------------------------------------------------------------------- */
.iosh_pricefrom {
	margin: 0;
	padding: 0;
	text-align: center
}

.iosh_pricefrom span {
	font: 700 22px / 1.2 'Figtree', 'Inter', system-ui, sans-serif;
	color: var(--ir-ink)
}

.iosh_pricefrom div {
	margin: 2px 0 0;
	padding: 0;
	font: normal 11px / 1.3 'Inter', system-ui, sans-serif;
	color: #5A6A7A;
	text-align: center
}

/* ---------------------------------------------------------------------
 * Mini-map in right rail.
 * ------------------------------------------------------------------- */
.iosh_hotelboxright .iosh_tsspace {
	margin: 0;
	padding: 0;
	text-align: center
}

.iosh_hotelboxright .iosh_tsspace img {
	border-radius: 4px;
	border: 1px solid var(--ir-fog)
}

/* ---------------------------------------------------------------------
 * Room summary rows — clean, color-coded by meal type.
 * ------------------------------------------------------------------- */
.iosh_hotelroom {
	margin: 8px 0 0;
	padding: 8px 0 0;
	font: normal 12px / 1.4 'Inter', system-ui, sans-serif;
	background: none;
	border-top: 1px solid var(--ir-fog)
}

.iosh_hotelroom h4 {
	margin: 0 0 4px;
	padding: 0;
	border: none;
	text-decoration: none;
	font: 600 14px / 1.4 'Inter', system-ui, sans-serif;
	color: var(--ir-ink)
}

.iosh_hotelroom h4 a,
.iosh_hotelroom h4 a:link,
.iosh_hotelroom h4 a:visited {
	color: var(--ir-green);
	text-decoration: none
}

.iosh_hotelroom h4 a:hover {
	color: #2E7D32;
	text-decoration: underline
}

/* ---------------------------------------------------------------------
 * Hotel box bottom — discount / promo card-stack.
 * Now sits INSIDE .iosh_hotelbox as a full-width flex row.
 * ------------------------------------------------------------------- */
.iosh_hotelboxbottom {
	flex: 0 0 100%;
	margin: 0;
	padding: 12px 14px 14px;
	background: var(--ir-mist);
	border-top: 1px solid var(--ir-fog);
	display: flex;
	flex-direction: column;
	gap: 6px;
	box-sizing: border-box
}

.iosh_hotelboxbottom > div {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0;
	padding: 10px 14px;
	background: var(--ir-white);
	border: 1px solid var(--ir-fog);
	border-left: 3px solid var(--ir-blue);
	border-radius: var(--ir-radius);
	font: normal 13px / 1.5 'Inter', system-ui, sans-serif;
	color: var(--ir-ink);
	box-shadow: 0 1px 3px rgba(15, 27, 45, 0.04)
}

.iosh_hotelboxbottom > div strong {
	color: var(--ir-blue);
	font-weight: 700;
	margin-right: 4px
}

.iosh_hotelboxbottom > div:has(abbr) {
	border-left-color: var(--ir-red);
	background: #FEF7F5
}

.iosh_hotelboxbottom > div:has(abbr) strong {
	color: var(--ir-red)
}

.iosh_hotelboxbottom > div:has(abbr.nonrefund) {
	border-left-color: var(--ir-red);
	background: #FEF7F5
}

.iosh_hotelboxbottom abbr {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	margin-left: auto;
	font: 700 11px / 1 'Inter', system-ui, sans-serif;
	color: var(--ir-red);
	background: #FDECEA;
	border-radius: 50%;
	cursor: help;
	text-decoration: none;
	border: none;
	flex: 0 0 18px
}

.iosh_hotelboxbottom abbr:hover {
	background: var(--ir-red);
	color: var(--ir-white)
}

/* ---------------------------------------------------------------------
 * Filter sidebar.
 * ------------------------------------------------------------------- */
.iosh_filtersbox {
	margin: 0 0 16px;
	padding: 0;
	background: none;
	border: none;
	border-radius: 0;
	overflow: visible
}

.iosh_filtersbox h4 {
	margin: 0;
	padding: 0;
	font: 600 13px / 1.4 'Inter', system-ui, sans-serif;
	text-transform: lowercase;
	letter-spacing: 0.2px;
	border: none
}

.iosh_filtersbox h4 a,
.iosh_filtersbox h4 a:link,
.iosh_filtersbox h4 a:visited {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 10px 0;
	color: var(--ir-ink);
	text-decoration: none;
	background: none;
	border-bottom: 1px solid var(--ir-fog);
	transition: color 0.15s
}

.iosh_filtersbox h4 a:hover {
	color: var(--ir-blue);
	background: none
}

.iosh_filteroptions {
	margin: 0;
	padding: 4px 0 0;
	list-style: none
}

.iosh_filteroptions li {
	margin: 0;
	padding: 0;
	border: none
}

.iosh_filteroptions li a,
.iosh_filteroptions li a:link,
.iosh_filteroptions li a:visited {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 6px 0;
	font: normal 13px / 1.4 'Inter', system-ui, sans-serif;
	color: var(--ir-ink);
	text-decoration: none;
	background: none;
	border: none;
	border-bottom: 1px solid var(--ir-fog);
	transition: color 0.15s
}

.iosh_filteroptions li a:hover {
	color: var(--ir-blue);
	background: none
}

.iosh_filteroptions li:last-child a,
.iosh_filteroptions li:last-child a:link,
.iosh_filteroptions li:last-child a:visited {
	border-bottom: none
}

.iosh_filteroptions li a span[dir="ltr"] {
	margin-left: auto;
	font-size: 11px;
	color: #98A8B8;
	background: var(--ir-mist);
	padding: 2px 6px;
	border-radius: 100px
}

/* ---------------------------------------------------------------------
 * Responsive — stack card elements on tablet/mobile.
 * ------------------------------------------------------------------- */
@media only screen and (max-width: 768px) {
	.iosh_hotelbox {
		flex-direction: column
	}

	.iosh_hotelboxright {
		flex: none;
		width: 100%;
		flex-direction: row;
		justify-content: space-around;
		padding: 10px;
		border-left: none;
		border-top: 1px solid var(--ir-fog)
	}

	.iosh_hotelboxleft {
		flex-direction: column
	}

	.iosh_hotelboximg {
		flex: none;
		width: 100%;
		max-height: 180px
	}

	.iosh_hotelboxdetails {
		padding: 12px 14px
	}

	.iosh_hotelboxdetails h3 {
		font-size: 16px
	}
}

@media only screen and (max-width: 480px) {
	.iosh_hotelboxright {
		flex-wrap: wrap;
		gap: 8px
	}

	.iosh_hotelboxscorel {
		width: 50px;
		height: 50px;
		font-size: 18px
	}

	.iosh_pricefrom span {
		font-size: 18px
	}

	.iosh_hotelboxdetails h3 {
		font-size: 15px
	}

	.iosh_hotelroom h4 {
		font-size: 13px
	}
}

/* ---------------------------------------------------------------------
 * Sidebar boxes — borderless text columns.
 * No chrome, no background, no border. Heading is Title Case
 * (shipped from PHP); list items are clean rows.
 * ------------------------------------------------------------------- */
.iosh_sidebox {
	margin: 0 0 16px;
	padding: 0;
	background: none;
	border: none;
	border-radius: 0
}

.iosh_sidebox h3,
.module .iosh_sidebox h3,
div.iosh_sidebox h3 {
	margin: 0;
	padding: 0 0 8px;
	border: none;
	font: 600 13px / 1.3 'Inter', system-ui, sans-serif;
	color: var(--ir-ink);
	letter-spacing: 0.2px;
	text-transform: capitalize;
	border-bottom: 1px solid var(--ir-fog)
}

.iosh_sidebox h3 a {
	color: inherit;
	text-decoration: none
}

.iosh_sidebox p {
	margin: 0;
	padding: 8px 0 0;
	font: normal 13px / 1.5 'Inter', system-ui, sans-serif;
	color: #444
}

.iosh_sidebox ul {
	margin: 0;
	padding: 8px 0 0;
	list-style: none;
	border: none
}

.iosh_sidebox ul li {
	margin: 0;
	padding: 6px 0;
	list-style: none;
	border: none;
	font-size: 12px;
	line-height: 1.5;
	color: var(--ir-ink)
}

.iosh_sidebox ul li:last-child {
	border: none
}

.iosh_sidebox ul li a {
	color: var(--ir-blue);
	text-decoration: none;
	transition: color 0.15s
}

.iosh_sidebox ul li a:hover {
	color: var(--ir-blue-70);
	text-decoration: underline
}

.iosh_sidebox ul li.iosh_noborder {
	padding: 6px 0;
	border: none;
	background: none
}

.iosh_sidebox ul li.iosh_noborder span,
.resh_sidebox ul li span {
	font-size: 11px;
	color: #5A6A7A
}

.iosh_sidebox ul li img.iosh_sideimg {
	width: 40px;
	float: left;
	margin: 0 8px 0 0;
	padding: 0;
	border-radius: 4px
}

.iosh_sidebox .iosh_dspace {
	padding: 0
}

.iosh_sidebox .iosh_notebox,
.iosh_sidebox p.iosh_notebox {
	margin: 0;
	padding: 8px 0 0;
	font-size: 12px;
	line-height: 1.6;
	color: #5A6A7A;
	background: none
}