/* Marrakech Holiday Booking: booking box and price tags (Hellenium palette: olive, sage, cream, sand). */
.mh-book, .mh-price {
	--mh-forest: #4C5246; --mh-sage: #687062; --mh-cream: #FAF0E4; --mh-sand: #F4ECDC; --mh-linen: #EEE2D2;
	--mh-stone: #E8DCCE; --mh-border: #E6DCD0; --mh-line: #ACA696; --mh-ink: #2E2A1E; --mh-body: #545044; --mh-muted: #706758;
	--mh-serif: 'Cormorant Garamond', Georgia, serif; --mh-sans: 'Jost', system-ui, sans-serif;
}

/* ---------- price tags ---------- */
.mh-price { font-family: var(--mh-sans); line-height: 1.2; }
.mh-price__from, .mh-price__pp { font-size: 13px; color: var(--mh-muted); }
.mh-price__amount { font-family: var(--mh-serif); font-weight: 600; font-size: 30px; color: var(--mh-ink); }
.mh-price.is-request .mh-price__amount { font-size: 24px; }
.mh-price--banner .mh-price__from, .mh-price--banner .mh-price__pp { color: var(--mh-stone); }
.mh-price--banner .mh-price__amount { color: var(--mh-cream); font-size: 26px; }
.mh-price--banner.is-request .mh-price__amount { font-size: 21px; font-weight: 500; }

/* ---------- booking box ---------- */
.mh-book { position: relative; font-family: var(--mh-sans); color: var(--mh-ink); background: #FFFDF9; border: 1px solid var(--mh-border);
	border-radius: 14px; box-shadow: 0 18px 44px -22px rgba(46,42,30,0.28); overflow: hidden; }
.mh-anchor { position: absolute; top: -110px; }
.mh-book__head { background: var(--mh-forest); color: var(--mh-cream); padding: 22px 24px 20px; }
.mh-book__price-line { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.mh-book__from, .mh-book__pp { font-size: 13px; color: var(--mh-stone); letter-spacing: .3px; }
.mh-book__price { font-family: var(--mh-serif); font-size: 38px; font-weight: 600; line-height: 1; color: var(--mh-cream); }
.mh-book__price--req { font-size: 30px; }
.mh-book__note { margin: 8px 0 0; font-size: 13.5px; color: var(--mh-stone); }
.mh-book__perks { list-style: none; margin: 14px 0 0; padding: 14px 0 0; border-top: 1px solid rgba(250,240,228,0.18); display: grid; gap: 7px; }
.mh-book__perks li { display: flex; align-items: center; gap: 9px; font-size: 14px; color: var(--mh-cream); margin: 0; }
.mh-book__perks .mh-ico { color: var(--mh-stone); flex: none; width: 16px; height: 16px; }

.mh-form { padding: 6px 24px 22px; margin: 0; }
.mh-step { padding: 18px 0 4px; border-bottom: 1px solid var(--mh-border); }
.mh-step:last-of-type { border-bottom: 0; }
.mh-step__title { display: flex; align-items: center; gap: 10px; font-family: var(--mh-serif); font-size: 22px; font-weight: 600; margin-bottom: 12px; }
.mh-step__n { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--mh-stone);
	color: var(--mh-forest); font-family: var(--mh-sans); font-size: 13px; font-weight: 600; }
.mh-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.mh-field { display: block; margin: 0 0 12px; }
.mh-field > span { display: block; font-size: 13px; font-weight: 500; color: var(--mh-body); margin-bottom: 5px; }
.mh-field b { color: #9A4A2C; font-weight: 600; }
.mh-field i { font-style: normal; color: var(--mh-muted); font-weight: 400; }
.mh-book input[type="text"], .mh-book input[type="email"], .mh-book input[type="tel"], .mh-book input[type="date"],
.mh-book input[type="number"], .mh-book textarea {
	width: 100%; box-sizing: border-box; font: 15px/1.4 var(--mh-sans); color: var(--mh-ink); background: #fff;
	border: 1px solid #CFC5B6; border-radius: 8px; padding: 11px 12px; min-height: 46px; margin: 0; box-shadow: none; }
.mh-book textarea { min-height: 84px; resize: vertical; }
.mh-book input:focus, .mh-book textarea:focus { outline: 2px solid var(--mh-sage); outline-offset: 1px; border-color: var(--mh-sage); }
.mh-stepper { display: flex; align-items: stretch; border: 1px solid #CFC5B6; border-radius: 8px; overflow: hidden; background: #fff; min-height: 46px; }
.mh-stepper input[type="number"] { border: 0 !important; border-radius: 0 !important; text-align: center; -moz-appearance: textfield; min-width: 0; padding: 0 !important; }
.mh-stepper input::-webkit-outer-spin-button, .mh-stepper input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.mh-stepper__btn { flex: none; width: 44px; display: grid; place-items: center; background: var(--mh-sand) !important; color: var(--mh-forest) !important;
	border: 0 !important; border-radius: 0 !important; padding: 0 !important; cursor: pointer; }
.mh-stepper__btn:hover { background: var(--mh-stone) !important; }

.mh-quote { margin: 4px 0 14px; background: var(--mh-cream); border-radius: 10px; padding: 12px 14px; font-size: 14px; }
.mh-quote:empty { display: none; }
.mh-quote > div { display: flex; justify-content: space-between; gap: 12px; padding: 4px 0; color: var(--mh-body); }
.mh-quote strong { color: var(--mh-ink); font-weight: 600; white-space: nowrap; }
.mh-quote__total { border-top: 1px solid var(--mh-border); margin-top: 4px; padding-top: 8px !important; }
.mh-quote__total strong { font-size: 16px; }
.mh-quote__dep strong { color: var(--mh-forest); font-size: 16px; }
.mh-quote.is-enquiry .mh-quote__dep, .mh-quote.is-enquiry .mh-quote__bal { display: none; }

.mh-mode { border: 0; margin: 0 0 12px; padding: 0; display: grid; gap: 10px; }
.mh-option { display: block; cursor: pointer; margin: 0; }
.mh-option input { position: absolute; opacity: 0; pointer-events: none; }
.mh-option__box { display: flex; gap: 12px; align-items: flex-start; border: 1px solid var(--mh-border); border-radius: 10px; padding: 13px 14px; background: #fff; }
.mh-option__box strong { display: block; font-size: 15px; font-weight: 600; }
.mh-option__box small { display: block; font-size: 13px; color: var(--mh-muted); line-height: 1.45; margin-top: 2px; }
.mh-option__ico { flex: none; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--mh-sand); color: var(--mh-forest); }
.mh-option input:checked + .mh-option__box { border-color: var(--mh-forest); box-shadow: 0 0 0 1px var(--mh-forest) inset; background: var(--mh-cream); }
.mh-option input:focus-visible + .mh-option__box { outline: 2px solid var(--mh-sage); outline-offset: 2px; }

.mh-submit { display: block; width: 100%; margin: 12px 0 0; padding: 15px 18px !important; border: 0 !important; border-radius: 8px !important;
	background: var(--mh-forest) !important; color: var(--mh-cream) !important; font: 500 15.5px/1.2 var(--mh-sans) !important; letter-spacing: .3px; cursor: pointer; }
.mh-submit:hover { background: var(--mh-ink) !important; }
.mh-submit:disabled { opacity: .6; cursor: wait; }
.mh-msg { margin: 10px 0 0; font-size: 14px; min-height: 0; }
.mh-msg:empty { display: none; }
.mh-msg.is-ok { color: var(--mh-forest); }
.mh-msg.is-err { color: #9A3A1F; }
.mh-secure { display: flex; align-items: center; justify-content: center; gap: 7px; margin: 12px 0 0; font-size: 12.5px; color: var(--mh-muted); }
.mh-secure .mh-ico { width: 15px; height: 15px; }
.mh-book:not(.is-paying) .mh-secure, .mh-book:not(.is-paying) .mh-cards { display: none; }
.mh-cards { margin: 8px 0 0; text-align: center; }
.mh-card-logos { display: inline-flex; gap: 6px; }
.mh-card-logo { display: inline-grid; place-items: center; width: 42px; height: 26px; border: 1px solid var(--mh-border); border-radius: 5px; background: #fff; }
.mh-terms { margin: 12px 0 0; font-size: 12.5px; color: var(--mh-muted); text-align: center; }
.mh-terms a { color: var(--mh-forest); }
.mh-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.mh-done { margin: 18px 24px; padding: 16px 18px; border-radius: 10px; background: var(--mh-cream); border: 1px solid var(--mh-border); color: var(--mh-forest); font-size: 15px; line-height: 1.55; }
.mh-book__help { display: flex; align-items: center; justify-content: center; gap: 9px; padding: 14px 18px; border-top: 1px solid var(--mh-border);
	background: var(--mh-sand); color: var(--mh-body) !important; font-size: 14px; text-decoration: none !important; }
.mh-book__help b { color: var(--mh-ink); font-weight: 600; }
.mh-book__help .mh-ico { color: var(--mh-forest); }
.mh-book .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* tour photos open in the lightbox: let the link fill the widget so the photo can stretch to the column */
.single-mh_tour .elementor-widget-image a { display: block; }

@media (max-width: 480px) {
	.mh-row { grid-template-columns: 1fr; gap: 0; }
	.mh-book__head { padding: 20px 18px 18px; }
	.mh-form { padding: 4px 18px 20px; }
}
