/* Mortbeth Estimator — mobile-first. Inherits theme fonts/colours with safe fallbacks. */
.mbe, .mbe-rates {
	--mbe-navy: var(--mb-navy, #0E1F3B);
	--mbe-paper: var(--mb-paper, #FBF9F4);
	--mbe-linen: var(--mb-linen, #F4EFE6);
	--mbe-linen-deep: var(--mb-linen-deep, #EAE3D5);
	--mbe-stone: var(--mb-stone-ink, #6E695F);
	--mbe-ink: var(--mb-ink, #16181D);
	--mbe-accent: var(--mb-accent, #C2551C);
	--mbe-rule: rgba(14, 31, 59, .16);
	--mbe-serif: var(--mb-serif, Georgia, serif);
	color: var(--mbe-ink);
	font-variant-numeric: lining-nums;
}
.mbe [hidden] { display: none !important; }
.mbe *, .mbe *::before, .mbe *::after { box-sizing: border-box; }
.mbe .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
.mbe-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.mbe-grid { display: grid; gap: 2.5rem; margin-bottom: 3.5rem; }
@media (min-width: 960px) { .mbe-grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 4rem; align-items: start; } }

.mbe-step { margin: 0 0 2.75rem; }
.mbe-step__no { margin: 0 0 .25rem; font-family: var(--mbe-serif); font-size: .95rem; color: var(--mbe-accent); letter-spacing: .02em; }
.mbe-step__title { margin: 0 0 1.25rem; font-family: var(--mbe-serif); font-weight: 350; font-size: clamp(1.5rem, 2.6vw, 1.95rem); line-height: 1.15; color: var(--mbe-navy); padding-bottom: .9rem; border-bottom: 1px solid var(--mbe-rule); }

/* Fields */
.mbe-field { margin: 0 0 1.1rem; border: 0; padding: 0; min-width: 0; }
.mbe-field > label, .mbe legend { display: block; font-size: .78rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--mbe-navy); margin: 0 0 .45rem; padding: 0; }
.mbe legend .mbe-muted, .mbe-field > label .mbe-muted { text-transform: none; letter-spacing: 0; font-weight: 400; }
.mbe input[type="text"], .mbe input:not([type]), .mbe input[type="tel"], .mbe input[type="date"], .mbe input[type="file"], .mbe select, .mbe textarea {
	width: 100%; font: inherit; font-size: 1rem; color: var(--mbe-ink); background: var(--mbe-paper);
	border: 1px solid rgba(14, 31, 59, .32); border-radius: 2px; padding: .75rem .85rem; min-height: 48px;
	transition: border-color .15s, box-shadow .15s; -webkit-appearance: none; appearance: none;
}
.mbe select { background-image: linear-gradient(45deg, transparent 50%, var(--mbe-navy) 50%), linear-gradient(135deg, var(--mbe-navy) 50%, transparent 50%); background-position: calc(100% - 18px) 52%, calc(100% - 13px) 52%; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 2.25rem; }
.mbe input[type="file"] { padding: .5rem; font-size: .88rem; color: var(--mbe-stone); }
.mbe input[type="file"]::file-selector-button { font: inherit; font-size: .85rem; font-weight: 500; color: var(--mbe-navy); background: transparent; border: 1px solid var(--mbe-navy); border-radius: 2px; padding: .5rem .9rem; margin-right: .9rem; cursor: pointer; transition: background .2s, color .2s; }
.mbe input[type="file"]::file-selector-button:hover { background: var(--mbe-navy); color: var(--mbe-paper); }
.mbe input:focus, .mbe select:focus, .mbe textarea:focus { outline: none; border-color: var(--mbe-navy); box-shadow: 0 0 0 3px rgba(194, 85, 28, .28); }
.mbe input:user-invalid, .mbe textarea:user-invalid { border-color: #A3361A; }
.mbe textarea { resize: vertical; min-height: 0; }
.mbe-hint { margin: .45rem 0 0; font-size: .82rem; line-height: 1.5; color: var(--mbe-stone); }
.mbe-hint em, .mbe-note em { font-style: normal; color: var(--mbe-stone); }
.mbe-muted { color: var(--mbe-stone); font-size: .9em; }

/* Items */
.mbe-items { list-style: none; margin: 0 0 1rem; padding: 0; }
.mbe-item { background: var(--mbe-paper); border: 1px solid var(--mbe-rule); border-left: 2px solid var(--mbe-navy); padding: 1.1rem 1.1rem .4rem; margin: 0 0 1rem; }
.mbe-item__head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: .75rem; }
.mbe-item__no { font-family: var(--mbe-serif); font-size: 1.1rem; color: var(--mbe-navy); }
.mbe-group { margin: 0 0 .9rem; }
.mbe-unit { border: 0; padding: 0; margin: 0 0 .8rem; display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.mbe-unit legend { float: left; margin: 0 .5rem 0 0; }
.mbe-unit label { display: inline-flex; align-items: center; gap: .35rem; border: 1px solid rgba(14, 31, 59, .32); border-radius: 2px; padding: .35rem .8rem; font-size: .9rem; cursor: pointer; min-height: 40px; }
.mbe-unit label:has(input:checked) { background: var(--mbe-navy); color: var(--mbe-paper); border-color: var(--mbe-navy); }
.mbe-unit label:has(input:focus-visible) { outline: 2px solid var(--mbe-accent); outline-offset: 2px; }
.mbe-unit input { accent-color: var(--mbe-navy); margin: 0; }
.mbe-dims { display: grid; grid-template-columns: 1fr auto 1fr; gap: .6rem; align-items: end; }
.mbe-dims .mbe-field { margin: 0; }
.mbe-times { font-family: var(--mbe-serif); font-size: 1.3rem; color: var(--mbe-stone); padding-bottom: .7rem; }
.mbe-check { margin: 0 0 1rem; }
.mbe-check label { display: grid; grid-template-columns: 18px 1fr; gap: .1rem .65rem; align-items: start; cursor: pointer; font-size: .95rem; line-height: 1.45; }
.mbe-check label > .mbe-muted { grid-column: 2; font-size: .8rem; }
.mbe-check input, .mbe-slots input { width: 18px; height: 18px; margin: .15rem 0 0; accent-color: var(--mbe-navy); flex: none; }
.mbe-item__line { margin: 0 0 .7rem; padding-top: .6rem; border-top: 1px dashed var(--mbe-rule); font-size: .85rem; color: var(--mbe-navy); font-variant-numeric: tabular-nums; min-height: 1.3em; }
.mbe-item__line:empty { display: none; }
.mbe-item__line.is-error { color: #A3361A; }

/* Buttons — square edges */
.mbe-btn { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; font: inherit; font-size: .95rem; font-weight: 500; letter-spacing: .02em; color: var(--mbe-paper); background: var(--mbe-navy); border: 1px solid var(--mbe-navy); border-radius: 2px; padding: .9rem 1.5rem; min-height: 48px; cursor: pointer; text-decoration: none; transition: background .2s, color .2s; }
.mbe-btn:hover { background: #24375A; color: var(--mbe-paper); }
.mbe-btn:disabled { opacity: .6; cursor: progress; }
.mbe-btn--ghost { background: transparent; color: var(--mbe-navy); }
.mbe-btn--ghost:hover { background: var(--mbe-navy); color: var(--mbe-paper); }
.mbe-btn:focus-visible, .mbe-link:focus-visible { outline: 2px solid var(--mbe-accent); outline-offset: 3px; }
.mbe-link { background: none; border: 0; padding: .25rem 0; font: inherit; font-size: .82rem; color: var(--mbe-stone); text-decoration: underline; text-underline-offset: .2em; cursor: pointer; }
.mbe-link:hover { color: #A3361A; }

/* Summary */
.mbe-summary__inner { background: var(--mbe-navy); color: rgba(244, 239, 230, .86); padding: 1.5rem 1.4rem; position: relative; }
.mbe-summary__inner::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 6px; background: repeating-linear-gradient(135deg, rgba(244, 239, 230, .16) 0 1px, transparent 1px 6px); }
@media (min-width: 960px) { .mbe-summary { position: sticky; top: 1.5rem; } .mbe-summary__inner { padding: 2rem 1.9rem; } }
.mbe-summary .mbe-step__title { color: var(--mbe-linen); border-bottom-color: rgba(244, 239, 230, .2); }
.mbe-summary .mbe-step__no { color: #E58A57; }
.mbe-summary .mbe-muted, .mbe-summary .mbe-note { color: rgba(244, 239, 230, .62); }
.mbe-lines { list-style: none; margin: 0; padding: 0; }
.mbe-line { display: grid; grid-template-columns: 1fr auto; gap: .1rem 1rem; padding: .75rem 0; border-bottom: 1px solid var(--mbe-rule); font-size: .92rem; }
.mbe-summary .mbe-line { border-bottom-color: rgba(244, 239, 230, .14); }
.mbe-line__label { font-weight: 500; }
.mbe-line__amt { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.mbe-line__formula { grid-column: 1 / -1; font-size: .78rem; line-height: 1.45; opacity: .72; font-variant-numeric: tabular-nums; }
.mbe-line--stain .mbe-line__label, .mbe-line--express .mbe-line__label { font-weight: 400; padding-left: .9rem; }
.mbe-line--quote .mbe-line__amt { opacity: .8; }
.mbe-line--empty { display: block; opacity: .7; font-family: var(--mbe-serif); }
.mbe-total { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding: 1.1rem 0 .4rem; }
.mbe-total span { font-size: .72rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.mbe-total strong { font-family: var(--mbe-serif); font-weight: 350; font-size: clamp(1.8rem, 4vw, 2.4rem); line-height: 1.1; font-variant-numeric: lining-nums tabular-nums; }
.mbe-summary .mbe-total strong { color: var(--mbe-linen); }
.mbe-pending { margin: 0 0 .5rem; font-size: .84rem; min-height: 0; }
.mbe-pending:empty { display: none; }
.mbe-note { margin: .75rem 0 0; font-size: .8rem; line-height: 1.5; }
.mbe-summary .mbe-note strong { color: var(--mbe-linen); font-weight: 500; }

/* Booking */
.mbe-book { margin-top: 1rem; padding-top: 0; }
.mbe-book__grid { display: grid; gap: 0 1.25rem; }
@media (min-width: 640px) { .mbe-book__grid { grid-template-columns: 1fr 1fr; } .mbe-field--wide { grid-column: 1 / -1; } }
.mbe-slots { display: grid; grid-template-columns: 1fr 1fr; gap: .4rem; }
.mbe-slots legend { grid-column: 1 / -1; }
.mbe-slots label { display: flex; align-items: center; gap: .45rem; border: 1px solid rgba(14, 31, 59, .25); border-radius: 2px; padding: .55rem .6rem; font-size: .88rem; cursor: pointer; background: var(--mbe-paper); min-height: 44px; }
.mbe-slots label:has(input:checked) { border-color: var(--mbe-navy); box-shadow: inset 0 0 0 1px var(--mbe-navy); }
.mbe-submit { display: grid; gap: .75rem; margin: .75rem 0 1.25rem; }
@media (min-width: 640px) { .mbe-submit { grid-template-columns: auto 1fr; align-items: center; gap: 1.5rem; } }
.mbe-submit .mbe-btn { width: 100%; }
@media (min-width: 640px) { .mbe-submit .mbe-btn { width: auto; } }
.mbe-submit .mbe-hint { margin: 0; }
.mbe-preview-note { font-size: .82rem; line-height: 1.55; padding: .2rem 0 .2rem 1rem; border-left: 2px solid var(--mbe-accent); margin: 0; color: var(--mbe-stone); max-width: 40rem; }
.mbe-preview-note strong { color: var(--mbe-navy); font-weight: 600; }
.mbe-alert { border-left: 3px solid #A3361A; background: #FBEDE6; padding: .9rem 1.1rem; margin: 0 0 1.5rem; font-size: .95rem; }

/* Confirmation */
.mbe-confirm { background: var(--mbe-paper); border: 1px solid var(--mbe-rule); border-top: 2px solid var(--mbe-navy); padding: 1.75rem 1.4rem; max-width: 44rem; }
.mbe-confirm:focus { outline: none; }
.mbe-confirm .mbe-total strong { color: var(--mbe-navy); }
.mbe-confirm p { margin: 0 0 1rem; }

/* Sticky total bar — phones only, shown by JS while the form (not the summary) is in view */
.mbe-sticky { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; display: flex; align-items: center; gap: .9rem; padding: .7rem 1.1rem calc(.7rem + env(safe-area-inset-bottom)); background: var(--mbe-navy); color: var(--mbe-linen); border-top: 2px solid var(--mbe-accent); transform: translateY(110%); transition: transform .25s ease; visibility: hidden; }
.mbe-sticky.is-on { transform: none; visibility: visible; }
.mbe-sticky__label { font-size: .7rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; opacity: .75; }
.mbe-sticky__total { font-family: var(--mbe-serif); font-weight: 400; font-size: 1.3rem; font-variant-numeric: tabular-nums; }
.mbe-sticky__link { margin-left: auto; color: var(--mbe-linen); font-size: .85rem; text-underline-offset: .2em; }
@media (min-width: 960px) { .mbe-sticky { display: none !important; } }
@media (prefers-reduced-motion: reduce) { .mbe-sticky, .mbe * { transition: none !important; } }

/* Rate table */
.mbe-rates__table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.mbe-rates__table caption { text-align: left; font-size: .72rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--mbe-stone); padding-bottom: .75rem; }
.mbe-rates__table th, .mbe-rates__table td { text-align: left; vertical-align: top; padding: .85rem 0; border-top: 1px solid var(--mbe-rule); font-variant-numeric: tabular-nums; }
.mbe-rates__table th { font-weight: 500; color: var(--mbe-navy); padding-right: 1.5rem; width: 44%; }
.mbe-rates__table tr:first-child th, .mbe-rates__table tr:first-child td { border-top: 1px solid rgba(14, 31, 59, .55); }
.mbe-rates .mbe-note { color: var(--mbe-stone); }
@media (max-width: 560px) { .mbe-rates__table th, .mbe-rates__table td { display: block; width: auto; } .mbe-rates__table td { border-top: 0; padding-top: 0; } }