/* Cornerstone Stay Design: booking forms (12 Oct 2026).
 *
 * Adapted from VCG Stay Design forms.css. The --csd-* colours are printed by the plugin from the
 * Booklium Customizer (accent, heading ink, calendar cream, gold); the rest are mixed from those.
 * Selectors are doubled where Booklium's hotel-booking.css would otherwise win.
 */

:root {
	--csd-accent-dark: color-mix(in srgb, var(--csd-accent, #334f7f) 82%, #000);
	--csd-text: #3b4249;
	--csd-white: #fff;
	--csd-line: color-mix(in srgb, var(--csd-ink, #17181a) 14%, transparent);
	--csd-tint: color-mix(in srgb, var(--csd-accent, #334f7f) 12%, #fff);
}

/* ------------------------------------------------------------------ *
 * 1e. Availability search form: dates side by side, guests side by side.
 * ------------------------------------------------------------------ */

.mphb_sc_search-wrapper form.mphb_sc_search-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 12px; margin: 0; }
.mphb_sc_search-wrapper form.mphb_sc_search-form > p { margin: 0; min-width: 0; }
.mphb_sc_search-wrapper form.mphb_sc_search-form > p > br { display: none; }
.mphb_sc_search-wrapper form.mphb_sc_search-form .mphb-required-fields-tip { display: none; }
.mphb_sc_search-wrapper form.mphb_sc_search-form label { display: block; margin: 0 0 6px; font-size: 15px; font-weight: 600; line-height: 1.3; color: var(--csd-ink); }
.mphb_sc_search-wrapper form.mphb_sc_search-form abbr { border: 0; text-decoration: none; color: var(--csd-accent); }
.mphb_sc_search-wrapper form.mphb_sc_search-form input[type="text"],
.mphb_sc_search-wrapper form.mphb_sc_search-form select {
	box-sizing: border-box; width: 100%; height: 50px; margin: 0;
	font-size: 16px; /* 16px stops iOS zooming in on focus */
	color: var(--csd-ink); border-radius: 10px;
}
/* Booklium pads date boxes for a desktop-width icon; on a two-column phone form the date ran under it. */
.mphb_sc_search-wrapper form.mphb_sc_search-form input.mphb-datepick { padding-left: 12px; padding-right: 34px; background-position: right 10px center; text-overflow: ellipsis; }
.mphb_sc_search-wrapper form.mphb_sc_search-form select { padding-left: 12px; }
.mphb_sc_search-wrapper form.mphb_sc_search-form input:focus,
.mphb_sc_search-wrapper form.mphb_sc_search-form select:focus { outline: 2px solid var(--csd-accent); outline-offset: 1px; }
.mphb_sc_search-wrapper form.mphb_sc_search-form .mphb_sc_search-submit-button-wrapper { grid-column: 1 / -1; margin: 4px 0 0; }
.mphb_sc_search-wrapper form.mphb_sc_search-form .mphb_sc_search-submit-button-wrapper .button { display: block; width: 100%; min-height: 50px; border-radius: 999px; }

/* ------------------------------------------------------------------ *
 * 1e. Date pop-up (search and booking forms).
 * ------------------------------------------------------------------ */

.datepick-popup { z-index: 100001 !important; }
/* The WhatsApp button (z-index 9999999) would sit on the Close pill; the pop-up only exists while open. */
body:has(.datepick-popup) .qlwapp__container { display: none; }
.datepick-popup .mphb-datepick-popup.datepick {
	box-sizing: border-box; padding: 14px; font-family: inherit; font-size: 15px; color: var(--csd-ink);
	background: var(--csd-white); border: 1px solid var(--csd-line); border-radius: 16px;
	box-shadow: 0 16px 40px color-mix(in srgb, var(--csd-ink) 18%, transparent);
}
.datepick-popup .mphb-datepick-popup .datepick-nav { display: flex; justify-content: space-between; align-items: center; padding: 0 2px 8px; background: transparent; border: 0; }
.datepick-popup .mphb-datepick-popup .datepick-nav a,
.datepick-popup .mphb-datepick-popup .datepick-nav span { float: none; width: auto; padding: 6px 4px; font-weight: 600; color: var(--csd-accent); background: transparent; text-decoration: none; }
.datepick-popup .mphb-datepick-popup .datepick-month-header,
.datepick-popup .mphb-datepick-popup .datepick-month-header select { font-weight: 600; font-size: 16px; color: var(--csd-ink); }
.datepick-popup .mphb-datepick-popup .datepick-month table { width: 100%; border: 0; border-collapse: separate; border-spacing: 2px; }
.datepick-popup .mphb-datepick-popup .datepick-month th,
.datepick-popup .mphb-datepick-popup .datepick-month td { padding: 0; border: 0; background: transparent; }

/* Day cells: past dates grey (MotoPress/Booklium make them nearly invisible), today ringed. */
.datepick-popup .mphb-datepick-popup .datepick-month td a,
.datepick-popup .mphb-datepick-popup .datepick-month td span { width: auto; height: 38px; line-height: 38px; padding: 0; border: 0; border-radius: 10px; text-decoration: none; }
.datepick-popup .mphb-datepick-popup .datepick-month td .mphb-date-cell { border: 0 !important; } /* Booklium rings every date, past ones with a more specific rule */
.datepick-popup .mphb-datepick-popup .datepick-month td .mphb-past-date,
.datepick-popup .mphb-datepick-popup .datepick-month td .mphb-unselectable-date { opacity: 1; color: color-mix(in srgb, var(--csd-text) 45%, transparent); }
.datepick-popup .mphb-datepick-popup .datepick-month td a.mphb-selectable-date:hover,
.datepick-popup .mphb-datepick-popup .datepick-month td a.datepick-highlight { background: var(--csd-alt); color: var(--csd-ink); }
.datepick-popup .mphb-datepick-popup .datepick-month td .datepick-today { box-shadow: inset 0 0 0 2px var(--csd-ink); }

/* The chosen stay: first and last night solid, the nights between tinted. */
.datepick-popup .mphb-datepick-popup .datepick-month td .mphb-selected-date,
.datepick-popup .mphb-datepick-popup .datepick-month td .datepick-selected-range { background: var(--csd-tint); color: var(--csd-ink); }
.datepick-popup .mphb-datepick-popup .datepick-month td .datepick-selected,
.datepick-popup .mphb-datepick-popup .datepick-month td .datepick-current-day,
.datepick-popup .mphb-datepick-popup .datepick-month td .mphb-check-in-date,
.datepick-popup .mphb-datepick-popup .datepick-month td .mphb-check-out-date { background: var(--csd-accent); color: var(--csd-white); font-weight: 600; }

/* Clear and Close inside the card; Close as a pill. */
.datepick-popup .mphb-datepick-popup .datepick-ctrl { float: none; display: flex; justify-content: space-between; align-items: center; margin-top: 8px; padding: 10px 2px 0; background: transparent; border: 0; border-top: 1px solid var(--csd-line); }
.datepick-popup .mphb-datepick-popup .datepick-ctrl a { float: none; width: auto; padding: 6px 4px; font-weight: 600; background: transparent; text-decoration: none; }
.datepick-popup .mphb-datepick-popup .datepick-ctrl .datepick-cmd-clear { color: var(--csd-text); }
.datepick-popup .mphb-datepick-popup .datepick-ctrl .datepick-cmd-close { color: var(--csd-white); background: var(--csd-accent); border-radius: 999px; padding: 8px 20px; }
.datepick-popup .mphb-datepick-popup .datepick-clear-fix { display: none; }

/* The calendar always draws six weeks; drop a week made only of next month's hidden dates. */
.datepick-popup .mphb-datepick-popup .datepick-month tbody tr:not(:has(td > :not(.mphb-extra-date))) { display: none; }

/* Phones: one month at a time, held 16px inside the screen. */
@media (max-width: 600px) {
	.datepick-popup { left: 16px !important; right: 16px; }
	.datepick-popup .mphb-datepick-popup.datepick { width: calc(100vw - 32px) !important; }
	.datepick-popup .mphb-datepick-popup .datepick-month { width: 100% !important; }
	.datepick-popup .mphb-datepick-popup .datepick-month + .datepick-month { display: none; }
}

/* ------------------------------------------------------------------ *
 * 1a. Checkout and booking confirmed: white cards, rounded fields,
 * clean price table, scrolling terms box, pill Book Now.
 * ------------------------------------------------------------------ */

.mphb_sc_checkout-wrapper,
.mphb_sc_booking_confirmation { max-width: 760px; margin: 0 auto; color: var(--csd-text); }
.mphb_sc_checkout-wrapper br { display: none; }
.mphb_sc_checkout-wrapper .mphb-required-fields-tip { display: none; }

/* Cards */
.mphb_sc_checkout-wrapper .mphb-checkout-section,
.mphb_sc_checkout-wrapper .mphb-login-form-wrap,
.mphb_sc_booking_confirmation .mphb-booking-details-section:not(.invoice) {
	box-sizing: border-box; margin: 0 0 20px; padding: 24px;
	background: var(--csd-white); border: 1px solid var(--csd-line); border-radius: 20px;
	box-shadow: 0 8px 28px color-mix(in srgb, var(--csd-ink) 8%, transparent);
}
.mphb_sc_checkout-wrapper .mphb-checkout-section.mphb-checkout-section { margin-top: 0; } /* Booklium adds 64px above each section */
.mphb_sc_checkout-wrapper time,
.mphb_sc_booking_confirmation time { border-bottom: 0; } /* Booklium dashes every <time> */
.mphb_sc_checkout-wrapper .mphb-login-form-wrap { padding: 16px 24px; box-shadow: none; }
.mphb_sc_checkout-wrapper .mphb-login-form-wrap > p { margin: 0; font-size: 15px; }
.mphb_sc_checkout-wrapper .mphb-checkout-section > h3,
.mphb_sc_checkout-wrapper .mphb-checkout-section > h4,
.mphb_sc_booking_confirmation .mphb-booking-details-title { margin: 0 0 16px; font-size: 22px; line-height: 1.2; color: var(--csd-ink); }

/* Booking details: label above value, the two dates side by side */
.mphb_sc_checkout-wrapper .mphb-booking-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.mphb_sc_checkout-wrapper .mphb-booking-details > h3,
.mphb_sc_checkout-wrapper .mphb-booking-details > .mphb-reserve-rooms-details { grid-column: 1 / -1; }
.mphb_sc_checkout-wrapper .mphb-check-in-date,
.mphb_sc_checkout-wrapper .mphb-check-out-date { margin: 0 0 16px; padding: 14px 16px; font-size: 15px; background: var(--csd-alt); border-radius: 14px; }
.mphb_sc_checkout-wrapper .mphb-check-in-date > span:first-child,
.mphb_sc_checkout-wrapper .mphb-check-out-date > span:first-child { display: block; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--csd-text); }
.mphb_sc_checkout-wrapper .mphb-check-in-date strong,
.mphb_sc_checkout-wrapper .mphb-check-out-date strong { font-size: 17px; color: var(--csd-ink); }
.mphb_sc_checkout-wrapper .mphb-room-details { padding-top: 16px; border-top: 1px solid var(--csd-line); }
.mphb_sc_checkout-wrapper .mphb-room-number { margin: 0 0 6px; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--csd-text); }
.mphb_sc_checkout-wrapper .mphb-room-type-title { margin: 0 0 16px; font-size: 18px; }
.mphb_sc_checkout-wrapper .mphb-room-type-title > span { display: none; }
.mphb_sc_checkout-wrapper .mphb-room-type-title a { font-weight: 600; color: var(--csd-ink); text-decoration: none; }

/* Fields */
.mphb_sc_checkout-wrapper .mphb-checkout-section p { margin: 0 0 14px; }
.mphb_sc_checkout-wrapper label { display: block; margin: 0 0 6px; font-size: 15px; font-weight: 600; line-height: 1.3; color: var(--csd-ink); }
.mphb_sc_checkout-wrapper abbr { border: 0; text-decoration: none; color: var(--csd-accent); }
.mphb_sc_checkout-wrapper input[type="text"],
.mphb_sc_checkout-wrapper input[type="email"],
.mphb_sc_checkout-wrapper input[type="tel"],
.mphb_sc_checkout-wrapper select,
.mphb_sc_checkout-wrapper textarea {
	box-sizing: border-box; width: 100%; min-height: 50px; margin: 0;
	font-size: 16px; color: var(--csd-ink); border-radius: 10px;
	/* Booklium gives selects a gold border and text boxes a near-invisible grey one: one visible border for all. */
	border: 1px solid color-mix(in srgb, var(--csd-ink) 28%, transparent);
}
.mphb_sc_checkout-wrapper input:focus,
.mphb_sc_checkout-wrapper select:focus,
.mphb_sc_checkout-wrapper textarea:focus { outline: 2px solid var(--csd-accent); outline-offset: 1px; border-color: var(--csd-accent); }
.mphb_sc_checkout-wrapper textarea { min-height: 110px; }
.mphb_sc_checkout-wrapper .mphb-coupon-code-wrapper .button,
.mphb_sc_checkout-wrapper .mphb-coupon-code-wrapper button { border-radius: 999px; padding-left: 28px; padding-right: 28px; }
.mphb_sc_checkout-wrapper .mphb-adults-chooser select,
.mphb_sc_checkout-wrapper .mphb-children-chooser select { max-width: 160px; }
.mphb_sc_checkout-wrapper .mphb-customer-details { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 16px; }
.mphb_sc_checkout-wrapper .mphb-customer-details > h3,
.mphb_sc_checkout-wrapper .mphb-customer-note,
.mphb_sc_checkout-wrapper .mphb-customer-country { grid-column: 1 / -1; }

/* Payment method choices as tappable rows */
.mphb_sc_checkout-wrapper .mphb-gateways-list { margin: 0; padding: 0; list-style: none; }
.mphb_sc_checkout-wrapper .mphb-gateways-list > li { margin: 0 0 10px; padding: 14px 16px; border: 1px solid var(--csd-line); border-radius: 14px; }
.mphb_sc_checkout-wrapper .mphb-gateways-list > li:has(input:checked) { border-color: var(--csd-accent); background: var(--csd-tint); }
.mphb_sc_checkout-wrapper .mphb-gateways-list label { display: flex; gap: 10px; align-items: center; margin: 0; }
.mphb_sc_checkout-wrapper .mphb-gateway-description { margin: 8px 0 0 30px; font-size: 14px; line-height: 1.5; color: var(--csd-text); }

/* Checkboxes */
.mphb_sc_checkout-wrapper input[type="checkbox"],
.mphb_sc_checkout-wrapper input[type="radio"] { width: 20px; height: 20px; margin: 0; flex: none; accent-color: var(--csd-accent); }
.mphb_sc_checkout-wrapper .mphb-terms-and-conditions-accept label { position: relative; display: block; padding-left: 32px; font-weight: 400; font-size: 15px; line-height: 1.5; color: var(--csd-text); }
.mphb_sc_checkout-wrapper .mphb-terms-and-conditions-accept label input[type="checkbox"] { position: absolute; left: 0; top: 1px; }
.mphb_sc_checkout-wrapper .mphb-terms-and-conditions-accept a { color: var(--csd-accent); font-weight: 600; }
.mphb_sc_checkout-wrapper .mphb-errors-wrapper:not(.mphb-hide):not(:empty) { margin: 0 0 20px; padding: 12px 16px; font-size: 15px; color: #8a1c0b; background: #fbeae6; border-radius: 12px; }

/* Price breakdown: clean rows, total in bold */
.mphb_sc_checkout-wrapper table.mphb-price-breakdown { width: 100%; margin: 0; border: 0; border-collapse: collapse; font-size: 16px; }
.mphb_sc_checkout-wrapper table.mphb-price-breakdown th,
.mphb_sc_checkout-wrapper table.mphb-price-breakdown td { padding: 12px 0; border: 0; border-bottom: 1px solid var(--csd-line); background: transparent; text-align: left; font-weight: 400; color: var(--csd-text); vertical-align: top; }
.mphb_sc_checkout-wrapper table.mphb-price-breakdown td:last-child,
.mphb_sc_checkout-wrapper table.mphb-price-breakdown th:last-child { text-align: right; white-space: nowrap; padding-left: 16px; color: var(--csd-ink); }
.mphb_sc_checkout-wrapper table.mphb-price-breakdown th { font-weight: 600; color: var(--csd-ink); }
.mphb_sc_checkout-wrapper .mphb-price-breakdown-expand { display: inline-flex; gap: 8px; align-items: center; font-weight: 600; color: var(--csd-ink); text-decoration: none !important; }
.mphb_sc_checkout-wrapper .mphb-price-breakdown-expand .mphb-inner-icon { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--csd-tint); color: var(--csd-accent); font-weight: 700; line-height: 1; }
.mphb_sc_checkout-wrapper .mphb-price-breakdown-expand .mphb-inner-icon.mphb-hide { display: none; }
.mphb_sc_checkout-wrapper table.mphb-price-breakdown tfoot .mphb-price-breakdown-total th { padding-top: 16px; border-bottom: 0; font-size: 20px; color: var(--csd-ink); }

/* Total and terms */
.mphb_sc_checkout-wrapper .mphb-total-price { margin: 0 0 20px; padding: 18px 24px; font-size: 17px; color: var(--csd-ink); background: var(--csd-tint); border-radius: 20px; }
.mphb_sc_checkout-wrapper .mphb-total-price output { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; }
.mphb_sc_checkout-wrapper .mphb-total-price-field { font-size: 26px; color: var(--csd-ink); }
.mphb_sc_checkout-wrapper .mphb-terms-and-conditions { max-height: 240px; overflow: auto; margin: 0 0 16px; padding: 4px 16px; font-size: 14px; background: var(--csd-alt); border-radius: 14px; }
.mphb_sc_checkout-wrapper .mphb-terms-and-conditions h1 { margin: 0 0 6px; font-size: 20px; }
.mphb_sc_checkout-wrapper .mphb-terms-and-conditions h2 { margin: 14px 0 4px; font-size: 16px; }
.mphb_sc_checkout-wrapper .mphb-terms-and-conditions p { margin: 0 0 8px; }

/* Book now */
.mphb_sc_checkout-wrapper .mphb_sc_checkout-submit-wrapper { margin: 0 0 24px; }
.mphb_sc_checkout-wrapper .mphb_sc_checkout-submit-wrapper input[type="submit"],
.mphb_sc_checkout-wrapper .mphb_sc_checkout-submit-wrapper button[type="submit"] {
	display: block; width: 100%; min-height: 54px; padding: 14px 24px; border: 0; border-radius: 999px;
	background: var(--csd-accent); color: var(--csd-white); font-size: 17px; font-weight: 600; cursor: pointer;
}
.mphb_sc_checkout-wrapper .mphb_sc_checkout-submit-wrapper input[type="submit"]:hover,
.mphb_sc_checkout-wrapper .mphb_sc_checkout-submit-wrapper button[type="submit"]:hover { background: var(--csd-accent-dark); }

/* Booking confirmed: tick above the details, status as a pill */
.mphb_sc_booking_confirmation::before {
	content: "\2713"; display: grid; place-items: center; width: 52px; height: 52px; margin: 0 auto 20px;
	border-radius: 50%; background: var(--csd-tint); color: var(--csd-accent); font-size: 26px; font-weight: 700; line-height: 1;
}
.mphb_sc_booking_confirmation ul.mphb-booking-details { list-style: none; margin: 0; padding: 0; }
.mphb_sc_booking_confirmation ul.mphb-booking-details li { display: flex; justify-content: space-between; gap: 16px; margin: 0; padding: 12px 0; border-bottom: 1px solid var(--csd-line); font-size: 16px; }
.mphb_sc_booking_confirmation ul.mphb-booking-details li:last-child { border-bottom: 0; }
.mphb_sc_booking_confirmation .label { color: var(--csd-text); }
.mphb_sc_booking_confirmation .value { font-weight: 600; color: var(--csd-ink); text-align: right; }
.mphb_sc_booking_confirmation .booking-status .value { padding: 2px 12px; border-radius: 999px; background: var(--csd-tint); color: var(--csd-accent-dark); font-size: 14px; }
.mphb_sc_booking_confirmation .booking-price .value { font-size: 18px; }
.mphb_sc_booking_confirmation .accommodations { display: flex; justify-content: space-between; gap: 16px; margin-top: 4px; padding-top: 12px; border-top: 1px solid var(--csd-line); }
.mphb_sc_booking_confirmation .accommodations-list a { font-weight: 600; color: var(--csd-accent); }
.mphb_sc_booking_confirmation .invoice p { margin: 4px 0 24px; }
.mphb_sc_booking_confirmation .invoice-link {
	display: block; box-sizing: border-box; width: 100%; padding: 14px 24px; text-align: center;
	border: 2px solid var(--csd-accent); border-radius: 999px; color: var(--csd-accent); font-weight: 600; text-decoration: none;
}
.mphb_sc_booking_confirmation .invoice-link:hover { background: var(--csd-accent); color: var(--csd-white); }

/* ------------------------------------------------------------------ *
 * 1c. Homepage hero (12 Oct 2026). Layout, colours, padding and the white
 * card are Getwid section settings on page 41; only what the blocks
 * cannot set lives here: type scale, card radius and shadow, the one-row
 * desktop search form, the WhatsApp link and the header Book Now pill.
 * ------------------------------------------------------------------ */

.csd-hero-eyebrow { margin: 0 0 12px; font-size: 14px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.csd-hero-title { max-width: 820px; margin: 0 auto 16px; font-size: clamp(30px, 3.2vw + 16px, 52px); line-height: 1.12; text-shadow: 0 2px 16px rgba(0, 0, 0, .25); }
.csd-hero-lead { max-width: 640px; margin: 0 auto 32px; font-size: clamp(16px, .6vw + 14px, 19px); line-height: 1.55; text-shadow: 0 1px 10px rgba(0, 0, 0, .3); }

.csd-hero-search,
.csd-hero-search > .wp-block-getwid-section__wrapper,
.csd-hero-search .wp-block-getwid-section__background { border-radius: 20px; }
.csd-hero-search { text-align: left; box-shadow: 0 16px 40px rgba(0, 0, 0, .22); }
.csd-hero-search h2 { margin: 0 0 16px; font-size: 22px; line-height: 1.2; color: var(--csd-ink); scroll-margin-top: 24px; }
.csd-hero-search .mphb_sc_search-wrapper { margin: 0; }

.csd-hero-alt { margin: 18px 0 0; font-weight: 600; }
.csd-hero-alt a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }

@media (min-width: 900px) {
	.csd-hero-search .mphb_sc_search-wrapper form.mphb_sc_search-form {
		grid-template-columns: minmax(0, 1.35fr) minmax(0, 1.35fr) minmax(0, .85fr) minmax(0, .85fr) auto;
		align-items: end; gap: 0 12px;
	}
	.csd-hero-search .mphb_sc_search-wrapper form.mphb_sc_search-form .mphb_sc_search-submit-button-wrapper { grid-column: auto; margin: 0; }
	.csd-hero-search .mphb_sc_search-wrapper form.mphb_sc_search-form .mphb_sc_search-submit-button-wrapper .button { width: auto; min-width: 140px; padding: 0 32px; }
}

/* Header direct CTA: menu item with the CSS class "csd-menu-cta" (Appearance > Menus). */
.main-navigation .primary-menu > .csd-menu-cta > a { margin-left: 8px; padding: 10px 22px; border-radius: 999px; background: var(--csd-accent); color: var(--csd-white) !important; font-weight: 600; }
.main-navigation .primary-menu > .csd-menu-cta > a:hover { background: var(--csd-accent-dark); }

@media (min-width: 601px) {
	.mphb_sc_checkout-wrapper .mphb-customer-details { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.mphb_sc_checkout-wrapper .mphb-checkout-section,
	.mphb_sc_booking_confirmation .mphb-booking-details-section:not(.invoice) { padding: 32px; }
}
@media (max-width: 420px) {
	.mphb_sc_checkout-wrapper .mphb-booking-details { grid-template-columns: minmax(0, 1fr); }
}