/* MIDO PHASE 8.6 ENQUIRIES CSS ACTIVE */
/* =============================================================================
   Mido Hasan — Enquiries page (Phase 8.1 form UX repair)
   Scoped under .mht-enquiries-page. Zero global pollution.

   Design language:
   - Background: black/aubergine surface (theme tokens)
   - Brand colour: signature purple (#8E63A3) reserved for selected/active
   - Light moments: soft lavender glow + bright text on warm white
   - Type: Migra (display, used sparingly) + Blauer Nue (UI/body)
   - Chip cards replace native radios/checkboxes
   - 2-col desktop, 1-col mobile, compact enough that each step
     mostly fits a typical laptop viewport under the fixed header
   ========================================================================== */

/* --------------------------------------------------------------------------
   Page envelope
   -------------------------------------------------------------------------- */
.mht-enquiries-page {
  /* V8.6: removed min-height:70vh. It forced the <main> taller than its
     content, creating a huge empty area beneath the form card that read
     as "huge empty space inside the form". The card now wraps naturally;
     section-level padding handles the breathing room before the footer. */
  padding-bottom: clamp(48px, 6vw, 80px);
}
.mht-enquiries-page .mht-enq-hero {
  /* Reduce top padding so the form sits closer to the nav.
     Header is fixed; we just need enough breathing room beneath it. */
  padding-block: clamp(72px, 9vw, 110px) clamp(48px, 7vw, 80px);
}
/* V8.5: the page header is now rendered by the reusable .mht-page-hero
   partial. The form below it lives in .mht-enq-section.
   V8.6: bumped top padding so the form has an intentional ~60–80px gap
   under the hero on desktop, scaling down to ~32px on mobile. */
.mht-enquiries-page .mht-enq-section {
  padding-block: clamp(32px, 5vw, 72px) clamp(32px, 5vw, 56px);
}
.mht-enquiries-page .mht-enq-intro {
  max-width: 720px;
  margin: 0 auto clamp(28px, 4vw, 44px);
  text-align: center;
}
.mht-enquiries-page .mht-enq-title {
  margin: 12px 0 18px;
}
.mht-enquiries-page .mht-enq-lede {
  max-width: 56ch;
  margin-inline: auto;
  opacity: 0.85;
}
.mht-enquiries-page .mht-enq-note {
  text-align: center;
  margin-top: 24px;
  opacity: 0.65;
}
.mht-enquiries-page .mht-enq-fallback {
  text-align: center;
  padding: 40px 24px;
}
.mht-enquiries-page .mht-enq-fallback a {
  color: var(--accent-lime, #B78CFF);
}

/* The form card — glass-card supplies the surface; we add spacing + glow. */
.mht-enquiries-page .mht-enq-card {
  position: relative;
  max-width: 820px;
  margin: 0 auto;
  padding: clamp(28px, 4vw, 48px) clamp(22px, 4vw, 44px);
  border-radius: 24px;
}
.mht-enquiries-page .mht-enq-card::before {
  /* MIDO PHASE 10.4 ENQUIRIES GRADIENT FIX ACTIVE
     Gradient repositioned to middle-left so it sits inside the card
     atmosphere and is not cropped at the top or bottom edge. */
  content: "";
  position: absolute;
  inset: -80px -40px;
  z-index: -1;
  border-radius: 40px;
  background: radial-gradient(55% 55% at 20% 50%, rgba(183, 140, 255, 0.12), transparent 70%);
  pointer-events: none;
}

/* --------------------------------------------------------------------------
   Form base — re-skin plugin's neutral .mido-enq-* classes
   -------------------------------------------------------------------------- */
.mht-enquiries-page .mido-enq-form {
  max-width: none;
  padding: 0;
  color: var(--text-primary, #F6F2F7);
  font-family: var(--font-sans, "Blauer Nue", system-ui, sans-serif);
  font-size: 15px;
  line-height: 1.55;
}

/* Hide the form's own heading — page <h1> already covers it. */
.mht-enquiries-page .mido-enq-heading {
  position: absolute;
  width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap;
}

/* --------------------------------------------------------------------------
   Step counter + progress bar — Blauer Nue, small-uppercase label
   -------------------------------------------------------------------------- */
.mht-enquiries-page .mido-enq-progress {
  margin-bottom: 28px;
}
.mht-enquiries-page .mido-enq-progress__label {
  display: block;
  font-family: var(--font-sans, "Blauer Nue", system-ui, sans-serif);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-secondary, #DDD6E3);
  opacity: 0.85;
  margin-bottom: 10px;
}
.mht-enquiries-page .mido-enq-progress__bar {
  height: 2px;
  background: rgba(221, 214, 227, 0.10);
  border-radius: 999px;
  overflow: hidden;
}
.mht-enquiries-page .mido-enq-progress__fill {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--accent, #8E63A3), var(--accent-lime, #B78CFF));
  opacity: 1;
  transition: width 220ms ease;
}
@media (prefers-reduced-motion: reduce) {
  .mht-enquiries-page .mido-enq-progress__fill { transition: none; }
}

/* --------------------------------------------------------------------------
   Step titles — Blauer Nue, NOT decorative italic. Clear and readable.
   -------------------------------------------------------------------------- */
.mht-enquiries-page .mido-enq-step__legend {
  display: block;
  width: 100%;
  font-family: var(--font-sans, "Blauer Nue", system-ui, sans-serif);
  font-size: clamp(18px, 1.6vw, 22px);
  font-weight: 600;
  font-style: normal;
  letter-spacing: -0.005em;
  color: var(--text-primary, #F6F2F7);
  margin-bottom: 22px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--border, rgba(44,37,50,0.55));
}

.mht-enquiries-page .mido-enq-step {
  /* UA-default fieldset has an engraved border + intrinsic min-inline-size in
     some browsers. Reset both. */
  border: 0;
  padding: 0;
  margin: 0 0 8px;
  min-inline-size: 0;
}
.mht-enquiries-page .mido-enq-step__legend {
  /* UA-default legend can float / get default padding. Normalise it. */
  float: none;
  width: auto;
  display: block;
  padding: 0;
}

/* --------------------------------------------------------------------------
   Question labels — bolder + slightly larger than the answer chips
   -------------------------------------------------------------------------- */
.mht-enquiries-page .mido-enq-q {
  display: block;
  font-family: var(--font-sans, "Blauer Nue", system-ui, sans-serif);
  font-size: 15px;
  font-weight: 600;
  color: var(--text-primary, #F6F2F7);
  margin: 0 0 6px;
  line-height: 1.4;
}
.mht-enquiries-page .mido-enq-q-hint {
  font-size: 12px;
  font-weight: 400;
  color: var(--text-muted, #AFA4B8);
  letter-spacing: 0.02em;
  margin: 0 0 12px;
}
.mht-enquiries-page .mido-enq-hint {
  font-size: 12px;
  font-weight: 400;
  color: var(--text-faint, #7C7284);
  letter-spacing: 0.02em;
}

.mht-enquiries-page .mido-enq-field {
  margin-bottom: 22px;
}
.mht-enquiries-page .mido-enq-field:last-of-type {
  margin-bottom: 8px;
}

/* Standard input labels (Step 4 fields) */
.mht-enquiries-page .mido-enq-field > label {
  display: block;
  font-family: var(--font-sans, "Blauer Nue", system-ui, sans-serif);
  font-size: 14px;
  font-weight: 500;
  color: var(--text-primary, #F6F2F7);
  margin-bottom: 8px;
}
.mht-enquiries-page .mido-enq-required {
  color: var(--accent-lime, #B78CFF);
  margin-left: 2px;
}

/* --------------------------------------------------------------------------
   Choice chips — hide native control, present a clean card
   -------------------------------------------------------------------------- */
.mht-enquiries-page .mido-enq-choices {
  display: block;
}
.mht-enquiries-page .mido-enq-choices--grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

/* Chip card: <label.mido-enq-chip> wraps an input + control + text. The
   selected state is driven by INPUT:CHECKED ~ SIBLING (works everywhere),
   not :has() alone — :has() only adds the border/shadow on the parent <label>. */
.mht-enquiries-page .mido-enq-chip {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid var(--border, rgba(44,37,50,0.55));
  border-radius: 12px;
  background: var(--bg-elevated, #1B1620);
  color: var(--text-secondary, #DDD6E3);
  font-size: 14px;
  line-height: 1.4;
  cursor: pointer;
  transition: border-color 160ms ease, background-color 160ms ease, color 160ms ease;
  user-select: none;
  min-height: 48px;
}

/* Visually hide the native input but keep it accessible. Does NOT rely
   on :has() so it works in every modern browser even before the visual
   selected-state enhancement loads. */
.mht-enquiries-page .mido-enq-chip__input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  margin: 0;
  pointer-events: none;
  /* Defensive: stash off-screen so it never paints even if a UA ignores opacity. */
  inset-inline-start: -9999px;
}

/* The dot indicator. */
.mht-enquiries-page .mido-enq-chip__control {
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  border-radius: 999px;
  border: 1.5px solid var(--text-faint, #7C7284);
  background: transparent;
  transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}

.mht-enquiries-page .mido-enq-chip__text {
  flex: 1 1 auto;
  pointer-events: none;
}

/* Hover */
.mht-enquiries-page .mido-enq-chip:hover {
  border-color: var(--accent-soft, #C5A6D3);
  background: var(--bg-surface, #141017);
  color: var(--text-primary, #F6F2F7);
}
.mht-enquiries-page .mido-enq-chip:hover .mido-enq-chip__control {
  border-color: var(--accent-soft, #C5A6D3);
}

/* === Selected state — sibling-checked selectors are the primary path === */
.mht-enquiries-page .mido-enq-chip__input:checked ~ .mido-enq-chip__control {
  border-color: var(--accent-lime, #B78CFF);
  background: var(--accent-lime, #B78CFF);
  box-shadow: 0 0 0 3px rgba(183, 140, 255, 0.20);
}
.mht-enquiries-page .mido-enq-chip__input:checked ~ .mido-enq-chip__text {
  color: var(--text-primary, #F6F2F7);
}

/* Focus ring on keyboard nav — sibling form, not :has() */
.mht-enquiries-page .mido-enq-chip__input:focus-visible ~ .mido-enq-chip__control {
  outline: 2px solid var(--accent-lime, #B78CFF);
  outline-offset: 3px;
}

/* === :has() enhancement (parent border + bg). Falls back gracefully. === */
@supports selector(:has(*)) {
  .mht-enquiries-page .mido-enq-chip:has(.mido-enq-chip__input:checked) {
    border-color: var(--accent-lime, #B78CFF);
    background: rgba(183, 140, 255, 0.08);
    box-shadow: 0 0 0 1px var(--accent-lime, #B78CFF) inset;
  }
  .mht-enquiries-page .mido-enq-chip:has(.mido-enq-chip__input:focus-visible) {
    outline: 2px solid var(--accent-lime, #B78CFF);
    outline-offset: 3px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mht-enquiries-page .mido-enq-chip,
  .mht-enquiries-page .mido-enq-chip__control { transition: none; }
}

/* --------------------------------------------------------------------------
   Text inputs + textarea — same chip language
   -------------------------------------------------------------------------- */
.mht-enquiries-page .mido-enq-field input[type="text"],
.mht-enquiries-page .mido-enq-field input[type="email"],
.mht-enquiries-page .mido-enq-field input[type="url"],
.mht-enquiries-page .mido-enq-field input[type="tel"],
.mht-enquiries-page .mido-enq-field textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--border, rgba(44,37,50,0.55));
  border-radius: 12px;
  background: var(--bg-elevated, #1B1620);
  color: var(--text-primary, #F6F2F7);
  font: inherit;
  font-size: 14px;
  line-height: 1.5;
  transition: border-color 160ms ease, background-color 160ms ease;
  box-sizing: border-box;
}
.mht-enquiries-page .mido-enq-field textarea {
  min-height: 120px;
  resize: vertical;
}
.mht-enquiries-page .mido-enq-field input::placeholder,
.mht-enquiries-page .mido-enq-field textarea::placeholder {
  color: var(--text-faint, #7C7284);
  opacity: 1;
}
.mht-enquiries-page .mido-enq-field input:focus,
.mht-enquiries-page .mido-enq-field textarea:focus {
  outline: none;
  border-color: var(--accent-lime, #B78CFF);
  background: var(--bg-surface, #141017);
  box-shadow: 0 0 0 3px rgba(183, 140, 255, 0.12);
}

/* Step 4 row layout — name/email and whatsapp/website side-by-side */
.mht-enquiries-page .mido-enq-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.mht-enquiries-page .mido-enq-row > .mido-enq-field {
  margin-bottom: 14px;
}

/* Consent row */
.mht-enquiries-page .mido-enq-field--consent {
  margin-top: 10px;
}
.mht-enquiries-page .mido-enq-consent {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
  font-size: 14px;
  color: var(--text-secondary, #DDD6E3);
  line-height: 1.45;
}
.mht-enquiries-page .mido-enq-consent input[type="checkbox"] {
  margin-top: 3px;
  flex: 0 0 auto;
  accent-color: var(--accent, #8E63A3);
}

/* --------------------------------------------------------------------------
   Inline error styling
   -------------------------------------------------------------------------- */
.mht-enquiries-page .mido-enq-error {
  margin: 8px 0 0;
  font-size: 12.5px;
  font-weight: 500;
  color: #F0A0A0;
  letter-spacing: 0.01em;
}
.mht-enquiries-page .mido-enq-field--error .mido-enq-q,
.mht-enquiries-page .mido-enq-field--error > label {
  color: #F0A0A0;
}
.mht-enquiries-page .mido-enq-field--error .mido-enq-chip {
  border-color: rgba(240, 160, 160, 0.45);
}
.mht-enquiries-page .mido-enq-field--error input[type="text"],
.mht-enquiries-page .mido-enq-field--error input[type="email"],
.mht-enquiries-page .mido-enq-field--error input[type="tel"],
.mht-enquiries-page .mido-enq-field--error textarea {
  border-color: rgba(240, 160, 160, 0.55);
  background: rgba(240, 160, 160, 0.05);
}

/* --------------------------------------------------------------------------
   Live character counter
   -------------------------------------------------------------------------- */
.mht-enquiries-page .mido-enq-counter,
.mht-enquiries-page .mido-enq-char-counter {
  margin: 8px 0 0;
  font-size: 12px;
  font-weight: 500;
  color: var(--text-faint, #7C7284);
  letter-spacing: 0.02em;
  font-variant-numeric: tabular-nums;
}
.mht-enquiries-page .mido-enq-counter.is-progress,
.mht-enquiries-page .mido-enq-char-counter.is-progress {
  color: var(--text-muted, #AFA4B8);
}
.mht-enquiries-page .mido-enq-counter.is-good,
.mht-enquiries-page .mido-enq-char-counter.is-good {
  color: var(--accent-lime, #B78CFF);
}

/* --------------------------------------------------------------------------
   Navigation buttons — Back left, Next/Submit right
   -------------------------------------------------------------------------- */
.mht-enquiries-page .mido-enq-nav,
.mht-enquiries-page .mido-enq-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 28px;
  padding-top: 22px;
  border-top: 1px solid var(--border, rgba(44,37,50,0.55));
}
/* Back stays left; Next/Submit pushed to the right with auto margin so
   the layout still looks right when Back is hidden (Step 1) — Next then
   sits flush right on its own. */
.mht-enquiries-page .mido-enq-btn--back {
  margin-right: auto;
}
.mht-enquiries-page .mido-enq-btn--next,
.mht-enquiries-page .mido-enq-btn--submit {
  margin-left: auto;
}

/* Buttons now wear BOTH .mido-enq-btn (data hook for JS) AND .mht-u-btn (universal
   visual). The global mht-u-btn rules already exist in the theme — we only add the
   tiny scoped tweaks needed here (sizing in the form, hidden behavior, layout). */

/* Defensive: ensure [hidden] is hidden even if a future global rule weakens it. */
.mht-enquiries-page .mido-enq-btn[hidden] { display: none !important; }

/* Right-size the form buttons (slightly smaller than hero CTAs). */
.mht-enquiries-page .mido-enq-actions .mht-u-btn {
  padding-block: 11px;
  /* V8.3: tighten padding-inline-end so the orb sits flush right.
     Label still has comfortable left padding. */
  padding-inline-start: 22px;
  padding-inline-end: 8px;
  font-size: 13px;
  letter-spacing: 0.14em;
  gap: 10px;
}

/* V8.3: Pull the orb to the right edge of the button (flush alignment).
   Scoped to the enquiry actions row — does NOT affect hero/site-wide CTAs. */
.mht-enquiries-page .mido-enq-actions .mht-u-btn__orb {
  margin-inline-start: auto;
  margin-inline-end: 0;
}

/* Back is the only button without an orb — restore symmetric padding so it
   doesn't look lopsided on the left. */
.mht-enquiries-page .mido-enq-actions .mido-enq-btn--back.mht-u-btn {
  padding-inline-end: 22px;
}
@media (prefers-reduced-motion: reduce) {
  .mht-enquiries-page .mido-enq-actions .mht-u-btn { transition: none; }
}

/* --------------------------------------------------------------------------
   Global status (kept as a quiet backup — inline errors are primary)
   -------------------------------------------------------------------------- */
.mht-enquiries-page .mido-enq-status {
  margin-top: 16px;
  text-align: center;
  font-size: 13.5px;
  min-height: 1.4em;
}
.mht-enquiries-page .mido-enq-status.is-error   { color: #F0A0A0; }
.mht-enquiries-page .mido-enq-status.is-success { color: var(--accent-soft, #C5A6D3); }

/* --------------------------------------------------------------------------
   Thank-you variant
   -------------------------------------------------------------------------- */
.mht-enquiries-page--thanks .mht-enq-thanks__card {
  max-width: 720px;
  margin: 0 auto;
  padding: clamp(32px, 6vw, 64px) clamp(24px, 5vw, 56px);
  border-radius: 24px;
  text-align: center;
  position: relative;
}
.mht-enquiries-page--thanks .mht-enq-thanks__card::before {
  content: "";
  position: absolute;
  inset: -40px;
  z-index: -1;
  border-radius: 32px;
  background: radial-gradient(60% 60% at 50% 30%, rgba(183, 140, 255, 0.12), transparent 70%);
  pointer-events: none;
}
.mht-enquiries-page--thanks .mht-enq-thanks__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin: 32px 0 8px;
}

/* --------------------------------------------------------------------------
   Mobile
   -------------------------------------------------------------------------- */
@media (max-width: 720px) {
  .mht-enquiries-page .mido-enq-choices--grid,
  .mht-enquiries-page .mido-enq-row {
    grid-template-columns: 1fr;
  }
  .mht-enquiries-page .mht-enq-card {
    border-radius: 18px;
  }
  .mht-enquiries-page .mido-enq-btn {
    min-width: 0;
    padding: 12px 20px;
  }
}

/* =============================================================================
   Dropdown-select component (Phase 8.3)
   ----------------------------------------------------------------------------
   Each [data-mido-select] is a fake-dropdown that hosts real hidden inputs
   inside an option list. The closed field shows a placeholder or selected
   chips; clicking opens a panel beneath it.
   ========================================================================== */

.mht-enquiries-page .mido-enq-select {
  position: relative;
  display: block;
  width: 100%;
}

/* Trigger ("field box") --------------------------------------------------- */
.mht-enquiries-page .mido-enq-select__trigger {
  appearance: none;
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 48px;
  padding: 8px 14px;
  border: 1px solid var(--border, rgba(44,37,50,0.55));
  border-radius: 12px;
  background: var(--bg-elevated, #1B1620);
  color: var(--text-secondary, #DDD6E3);
  font: inherit;
  font-size: 14px;
  line-height: 1.4;
  text-align: left;
  cursor: pointer;
  transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}
.mht-enquiries-page .mido-enq-select__trigger:hover {
  border-color: var(--accent-soft, #C5A6D3);
}
.mht-enquiries-page .mido-enq-select__trigger:focus-visible {
  outline: 2px solid var(--accent-lime, #B78CFF);
  outline-offset: 3px;
}
.mht-enquiries-page .mido-enq-select.is-open .mido-enq-select__trigger,
.mht-enquiries-page .mido-enq-select.has-values .mido-enq-select__trigger {
  border-color: var(--accent-lime, #B78CFF);
  background: var(--bg-surface, #141017);
}
.mht-enquiries-page .mido-enq-select.is-open .mido-enq-select__trigger {
  box-shadow: 0 0 0 3px rgba(183, 140, 255, 0.12);
}

/* Placeholder + values area inside the trigger ---------------------------- */
.mht-enquiries-page .mido-enq-select__placeholder {
  color: var(--text-faint, #7C7284);
  flex: 1 1 auto;
}
.mht-enquiries-page .mido-enq-select__placeholder[hidden] { display: none; }

.mht-enquiries-page .mido-enq-select__values {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  flex: 1 1 auto;
  min-width: 0;
}
.mht-enquiries-page .mido-enq-select__values:empty { display: none; }

/* Selected-value chip (rendered inside trigger) --------------------------- */
.mht-enquiries-page .mido-enq-select__tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 4px 4px 10px;
  border-radius: 999px;
  background: rgba(183, 140, 255, 0.10);
  border: 1px solid var(--accent-lime, #B78CFF);
  color: var(--text-primary, #F6F2F7);
  font-size: 12.5px;
  line-height: 1.2;
  max-width: 100%;
}
.mht-enquiries-page .mido-enq-select__tag-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 28ch;
}
.mht-enquiries-page .mido-enq-select__tag-remove {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  padding: 0;
  border-radius: 999px;
  border: 0;
  background: transparent;
  color: var(--text-secondary, #DDD6E3);
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
  transition: background-color 140ms ease, color 140ms ease;
}
.mht-enquiries-page .mido-enq-select__tag-remove:hover,
.mht-enquiries-page .mido-enq-select__tag-remove:focus-visible {
  background: rgba(183, 140, 255, 0.25);
  color: var(--text-primary, #F6F2F7);
  outline: none;
}

/* Chevron ----------------------------------------------------------------- */
.mht-enquiries-page .mido-enq-select__chevron {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  color: var(--text-muted, #AFA4B8);
  transition: transform 200ms ease, color 200ms ease;
}
.mht-enquiries-page .mido-enq-select.is-open .mido-enq-select__chevron {
  transform: rotate(180deg);
  color: var(--accent-lime, #B78CFF);
}
@media (prefers-reduced-motion: reduce) {
  .mht-enquiries-page .mido-enq-select__chevron,
  .mht-enquiries-page .mido-enq-select__trigger,
  .mht-enquiries-page .mido-enq-select__tag-remove { transition: none; }
}

/* Menu (dropdown panel) --------------------------------------------------- */
.mht-enquiries-page .mido-enq-select__menu {
  position: absolute;
  z-index: 30;
  top: calc(100% + 6px);
  inset-inline: 0;
  max-height: 280px;
  overflow-y: auto;
  padding: 6px;
  border: 1px solid var(--border, rgba(44,37,50,0.55));
  border-radius: 12px;
  background: var(--bg-elevated, #1B1620);
  box-shadow:
    0 12px 32px rgba(0, 0, 0, 0.45),
    0 0 0 1px rgba(183, 140, 255, 0.12);
}
.mht-enquiries-page .mido-enq-select__menu[hidden] { display: none; }

/* Options inside the menu ------------------------------------------------- */
.mht-enquiries-page .mido-enq-select__option {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 8px;
  color: var(--text-secondary, #DDD6E3);
  font-size: 14px;
  line-height: 1.4;
  cursor: pointer;
  transition: background-color 140ms ease, color 140ms ease;
}
.mht-enquiries-page .mido-enq-select__option:hover {
  background: rgba(183, 140, 255, 0.06);
  color: var(--text-primary, #F6F2F7);
}
.mht-enquiries-page .mido-enq-select__option-control {
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  border-radius: 999px;
  border: 1.5px solid var(--text-faint, #7C7284);
  background: transparent;
  transition: border-color 140ms ease, background-color 140ms ease, box-shadow 140ms ease;
}
.mht-enquiries-page .mido-enq-select__option-text {
  flex: 1 1 auto;
}

/* Hide the real input visually inside the option (input is still
   the source of truth for form submission and validation). */
.mht-enquiries-page .mido-enq-select__option .mido-enq-chip__input {
  /* Already hidden globally by .mht-enquiries-page .mido-enq-chip__input,
     but this rule is here for defensive clarity. */
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  margin: 0;
  pointer-events: none;
  inset-inline-start: -9999px;
}

/* Selected-option state — sibling-checked selector (primary mechanism) */
.mht-enquiries-page .mido-enq-select__option .mido-enq-chip__input:checked ~ .mido-enq-select__option-control {
  border-color: var(--accent-lime, #B78CFF);
  background: var(--accent-lime, #B78CFF);
  box-shadow: 0 0 0 3px rgba(183, 140, 255, 0.20);
}
.mht-enquiries-page .mido-enq-select__option .mido-enq-chip__input:checked ~ .mido-enq-select__option-text {
  color: var(--text-primary, #F6F2F7);
}
.mht-enquiries-page .mido-enq-select__option .mido-enq-chip__input:focus-visible ~ .mido-enq-select__option-control {
  outline: 2px solid var(--accent-lime, #B78CFF);
  outline-offset: 3px;
}
@supports selector(:has(*)) {
  .mht-enquiries-page .mido-enq-select__option:has(.mido-enq-chip__input:checked) {
    background: rgba(183, 140, 255, 0.08);
  }
}

/* Error state on the dropdown wrapper (uses same hook as fields) ---------- */
.mht-enquiries-page .mido-enq-field--error .mido-enq-select__trigger {
  border-color: rgba(240, 160, 160, 0.55);
  background: rgba(240, 160, 160, 0.05);
}

/* Mobile -------------------------------------------------------------- */
@media (max-width: 720px) {
  .mht-enquiries-page .mido-enq-select__menu {
    max-height: 60vh;
  }
  .mht-enquiries-page .mido-enq-select__tag-text {
    max-width: 60vw;
  }
}

/* ── PHASE 10.4.3 ENQUIRIES GLOW FIX — OPTION C ──
   Root cause: .mht-enq-card::before uses inset:-80px -40px, extending
   outside the card bounds. An ancestor with overflow:clip crops it,
   creating a visible hard edge line.
   Fix: completely disable the ::before pseudo-element on the card.
   Replace with a safe radial glow on the section container itself —
   no clipping possible at section level. */

/* 1. Disable the problematic card ::before glow */
.mht-enquiries-page .mht-enq-card::before {
  content: none !important;
  display: none !important;
}

/* 2. Apply soft centered glow on the section — cannot be clipped */
.mht-enquiries-page .mht-enq-section {
  position: relative;
  isolation: isolate;
}
.mht-enquiries-page .mht-enq-section::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse 70% 60% at 50% 40%, rgba(183, 140, 255, 0.09), transparent 68%),
    radial-gradient(ellipse 40% 35% at 30% 70%, rgba(142, 99, 163, 0.06), transparent 72%);
}
/* Ensure form content sits above the glow layer */
.mht-enquiries-page .mht-enq-section > * {
  position: relative;
  z-index: 1;
}


/* Phase 80 enquiries shell foundation — moved from inline template styles. */
.mht-enq-shell {
  width: var(--site-w);
  max-width: var(--site-max);
  margin-inline: auto;
}