/**
 * Mobile layout — hero CTAs, header, and block navigation overlay (hamburger menu).
 */

/* ── Hero CTAs (home) — prevent right-edge clipping ── */
.luxe-video-hero__content {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  padding-left: max(1rem, env(safe-area-inset-left, 0px));
  padding-right: max(1rem, env(safe-area-inset-right, 0px));
}

.luxe-video-hero__cta {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin-left: auto;
  margin-right: auto;
}

.luxe-video-hero__cta .wp-block-button__link {
  box-sizing: border-box;
  max-width: 100%;
  white-space: normal;
  line-height: 1.35;
  text-align: center;
}

@media (max-width: 900px) {
  .luxe-video-hero__cta {
    flex-direction: column;
    align-items: stretch;
    gap: 0.65rem;
    padding-inline: 0.25rem;
  }

  .luxe-video-hero__cta .wp-block-button__link {
    display: block;
    width: 100%;
    max-width: 20rem;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
    font-size: 0.78rem !important;
  }
}

/* ── Block theme content padding — keep Luxe full-width blocks centered ── */
@media (max-width: 782px) {
  .wp-block-post-content > .luxe-video-hero,
  .entry-content > .luxe-video-hero,
  .wp-block-post-content > .luxe-page-banner,
  .entry-content > .luxe-page-banner {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }

  .wp-block-post-content,
  .entry-content {
    padding-left: max(0.75rem, env(safe-area-inset-left, 0px));
    padding-right: max(0.75rem, env(safe-area-inset-right, 0px));
  }
}

/* ── Header buttons (if theme adds CTAs in header) ── */
@media (max-width: 782px) {
  header .wp-block-buttons,
  .site-header .wp-block-buttons {
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 0.5rem !important;
    max-width: 100%;
  }

  header .wp-block-button,
  .site-header .wp-block-button {
    flex: 1 1 100%;
    max-width: 100%;
  }

  header .wp-block-button__link,
  .site-header .wp-block-button__link {
    display: block;
    width: 100%;
    max-width: 18rem;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    white-space: normal;
    font-size: 0.72rem !important;
    padding: 0.75rem 1rem !important;
  }
}

/* ── Hamburger menu — match Luxe plum / blush / gold (not white + pink) ── */
.wp-block-navigation__responsive-container-open {
  color: var(--luxe-text, #f8e7ff) !important;
}

.wp-block-navigation__responsive-container-open svg {
  fill: currentColor !important;
}

.wp-block-navigation__responsive-container.is-menu-open,
.wp-block-navigation__responsive-container.has-modal-open,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.wp-block-navigation__responsive-container.has-modal-open .wp-block-navigation__responsive-container-content {
  background-color: var(--luxe-bg, #1f1a2e) !important;
  color: var(--luxe-text, #f8e7ff) !important;
}

/* Modal backdrop (WP 6.5+) */
.wp-block-navigation__responsive-container.is-menu-open::before,
.wp-block-navigation__responsive-container.has-modal-open::before {
  background-color: rgba(31, 26, 46, 0.92) !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__label,
.wp-block-navigation__responsive-container.is-menu-open a,
.wp-block-navigation__responsive-container.has-modal-open a {
  color: var(--luxe-text, #f8e7ff) !important;
  font-family: var(--luxe-font-body, Raleway, sans-serif) !important;
  font-size: 0.95rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}

.wp-block-navigation__responsive-container.is-menu-open a:hover,
.wp-block-navigation__responsive-container.is-menu-open a:focus,
.wp-block-navigation__responsive-container.has-modal-open a:hover {
  color: var(--luxe-accent, #d4af77) !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container,
.wp-block-navigation__responsive-container.has-modal-open .wp-block-navigation__submenu-container {
  background-color: var(--luxe-card, #2a2540) !important;
  border: 1px solid var(--luxe-border, rgba(212, 175, 119, 0.35)) !important;
  border-radius: 12px !important;
  padding: 0.5rem 0 !important;
  margin-top: 0.35rem !important;
  margin-bottom: 0.75rem !important;
}

/* Legal submenu — indented, slightly smaller on mobile */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu .wp-block-navigation-item,
.wp-block-navigation__responsive-container.has-modal-open .wp-block-navigation-submenu .wp-block-navigation-item {
  padding-left: 0.75rem !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu .wp-block-navigation-item a,
.wp-block-navigation__responsive-container.has-modal-open .wp-block-navigation-submenu .wp-block-navigation-item a {
  font-size: 0.82rem !important;
  letter-spacing: 0.08em !important;
}

/* Submenu toggle (Legal) */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle,
.wp-block-navigation__responsive-container.has-modal-open .wp-block-navigation-submenu__toggle {
  color: var(--luxe-accent, #d4af77) !important;
}

.wp-block-navigation__responsive-container-close {
  color: var(--luxe-accent, #d4af77) !important;
  background: transparent !important;
}

.wp-block-navigation__responsive-container-close svg {
  fill: currentColor !important;
}

/* Override theme preset colors inside the mobile nav modal */
.wp-block-navigation__responsive-container.is-menu-open,
.wp-block-navigation__responsive-container.has-modal-open {
  --wp--preset--color--base: #1f1a2e;
  --wp--preset--color--contrast: #f8e7ff;
  --wp--preset--color--primary: #e8a8c8;
}

/* Page content when menu open — avoid white flash behind dialog */
html.has-modal-open body {
  background-color: var(--luxe-bg, #1f1a2e) !important;
}

/* ── Contact page & forms on mobile ── */
@media (max-width: 782px) {
  .entry-content.is-layout-constrained > .luxe-contact-page,
  .wp-block-post-content.is-layout-constrained > .luxe-contact-page,
  .luxe-contact-page,
  .luxe-contact-page .luxe-contact-info,
  .luxe-contact-page .luxe-contact-card,
  .luxe-contact-page .luxe-contact-form,
  .luxe-support-page {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box;
  }

  .luxe-contact-info {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.85rem !important;
  }

  .luxe-contact-page .wp-block-columns {
    flex-direction: column !important;
    flex-wrap: wrap !important;
  }

  .luxe-contact-page .wp-block-column {
    flex-basis: 100% !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .luxe-support-nav a {
    font-size: 0.78rem;
    padding: 0.4rem 0.7rem;
  }

  .luxe-contact-card {
    padding: 1.25rem 1rem !important;
    margin: 0 !important;
  }

  .luxe-contact-form {
    padding: 1.25rem 1rem !important;
  }

  .luxe-contact-form .wpcf7-form label,
  .luxe-contact-page .wpcf7-form label {
    font-size: 0.8rem !important;
    letter-spacing: 0.1em !important;
  }

  .luxe-contact-page .luxe-contact-card:has(.wpcf7),
  .luxe-contact-page .luxe-contact-card:has(.wpcf7-form) {
    width: 100% !important;
    max-width: 100% !important;
  }

  .wpcf7-form p {
    flex: none !important;
    flex-basis: 100% !important;
  }

  .luxe-feature-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1rem !important;
  }

  .wpcf7-form input[type="text"],
  .wpcf7-form input[type="email"],
  .wpcf7-form input[type="tel"],
  .wpcf7-form input[type="url"],
  .wpcf7-form textarea,
  .wpcf7-form select,
  .wpforms-form input[type="text"],
  .wpforms-form input[type="email"],
  .wpforms-form textarea,
  .wpforms-form select,
  .wpcf7-form input[type="submit"],
  .wpforms-submit {
    width: 100% !important;
    max-width: 100% !important;
  }
}