/* SAF FINAL MOBILE MENU VISIBILITY FIX
 * Ensure top-level links and nested links are rendered as a vertical list
 * across the homepage, Shop, product categories, and normal pages.
 * Keep WordPress navigation state and links unchanged.
 */
@media (max-width: 900px) {
  .wp-block-navigation__responsive-container.is-menu-open,
  .wp-block-navigation__responsive-container.saf-lovable-menu-open {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    flex-direction: column !important;
  }

  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__responsive-container-content,
  .wp-block-navigation__responsive-container.saf-lovable-menu-open
    .wp-block-navigation__responsive-container-content {
    display: block !important;
    position: relative !important;
    flex: 1 1 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    visibility: visible !important;
    opacity: 1 !important;
    box-sizing: border-box !important;
  }

  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__container,
  .wp-block-navigation__responsive-container.saf-lovable-menu-open
    .wp-block-navigation__container {
    display: flex !important;
    flex: 0 0 auto !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
    gap: 0 !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__container > .wp-block-navigation-item,
  .wp-block-navigation__responsive-container.saf-lovable-menu-open
    .wp-block-navigation__container > .wp-block-navigation-item,
  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation-item,
  .wp-block-navigation__responsive-container.saf-lovable-menu-open
    .wp-block-navigation-item {
    display: flex !important;
    position: static !important;
    flex: 0 0 auto !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation-item__content,
  .wp-block-navigation__responsive-container.saf-lovable-menu-open
    .wp-block-navigation-item__content {
    display: flex !important;
    flex: 0 0 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 48px !important;
    height: auto !important;
    white-space: normal !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
    box-sizing: border-box !important;
  }

  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__submenu-container,
  .wp-block-navigation__responsive-container.saf-lovable-menu-open
    .wp-block-navigation__submenu-container,
  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__submenu-container[hidden],
  .wp-block-navigation__responsive-container.saf-lovable-menu-open
    .wp-block-navigation__submenu-container[hidden] {
    display: flex !important;
    position: static !important;
    flex: 0 0 auto !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 0 0 14px !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    clip: auto !important;
    clip-path: none !important;
  }

  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__submenu-container > .wp-block-navigation-item,
  .wp-block-navigation__responsive-container.saf-lovable-menu-open
    .wp-block-navigation__submenu-container > .wp-block-navigation-item {
    display: flex !important;
    width: 100% !important;
  }

  .wp-block-navigation__responsive-container-open {
    flex: 0 0 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    visibility: visible !important;
  }
}

/* SAF HOTFIX v2: prevent core/theme rules from collapsing the open overlay list.
 * Scope only to the open mobile WordPress Navigation overlay. */
@media (max-width: 900px) {
  body .wp-block-navigation__responsive-container.is-menu-open,
  body .wp-block-navigation__responsive-container.saf-lovable-menu-open {
    display: flex !important;
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    z-index: 2147483000 !important;
    visibility: visible !important;
    opacity: 1 !important;
    background: #fbf7ef !important;
    color: #251a1b !important;
    box-sizing: border-box !important;
  }

  body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close,
  body .wp-block-navigation__responsive-container.saf-lovable-menu-open .wp-block-navigation__responsive-close,
  body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog,
  body .wp-block-navigation__responsive-container.saf-lovable-menu-open .wp-block-navigation__responsive-dialog,
  body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
  body .wp-block-navigation__responsive-container.saf-lovable-menu-open .wp-block-navigation__responsive-container-content {
    display: flex !important;
    flex: 0 0 auto !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    position: relative !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
    box-sizing: border-box !important;
  }

  body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
  body .wp-block-navigation__responsive-container.saf-lovable-menu-open .wp-block-navigation__container,
  body .wp-block-navigation__responsive-container.is-menu-open ul.is-responsive,
  body .wp-block-navigation__responsive-container.saf-lovable-menu-open ul.is-responsive {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    position: relative !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
    list-style: none !important;
  }

  body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item,
  body .wp-block-navigation__responsive-container.saf-lovable-menu-open .wp-block-navigation-item {
    display: flex !important;
    flex: 0 0 auto !important;
    flex-direction: column !important;
    align-items: stretch !important;
    position: relative !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
    border-bottom: 1px solid #e8dccb !important;
    box-sizing: border-box !important;
  }

  body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content,
  body .wp-block-navigation__responsive-container.saf-lovable-menu-open .wp-block-navigation-item__content {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex: 0 0 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 48px !important;
    height: auto !important;
    padding: 13px 18px !important;
    margin: 0 !important;
    color: #251a1b !important;
    background: transparent !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    visibility: visible !important;
    opacity: 1 !important;
    box-sizing: border-box !important;
  }

  body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container,
  body .wp-block-navigation__responsive-container.saf-lovable-menu-open .wp-block-navigation__submenu-container {
    display: flex !important;
    flex: 0 0 auto !important;
    flex-direction: column !important;
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 0 0 12px !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    clip: auto !important;
    clip-path: none !important;
    border: 0 !important;
    box-sizing: border-box !important;
  }

  body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-icon,
  body .wp-block-navigation__responsive-container.saf-lovable-menu-open .wp-block-navigation__submenu-icon {
    display: none !important;
  }

  body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close,
  body .wp-block-navigation__responsive-container.saf-lovable-menu-open .wp-block-navigation__responsive-container-close {
    position: absolute !important;
    top: 14px !important;
    right: 18px !important;
    z-index: 10 !important;
    width: 44px !important;
    height: 44px !important;
  }
}

/* SAF MOBILE MENU PATCH v3
 * Root cause addressed: theme/core selectors were still able to collapse
 * sibling menu items in the responsive overlay on product-category archives.
 * Scope these resets to the open mobile overlay only. */
@media (max-width: 900px) {
  body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog,
  body .wp-block-navigation__responsive-container.saf-lovable-menu-open .wp-block-navigation__responsive-dialog,
  body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close,
  body .wp-block-navigation__responsive-container.saf-lovable-menu-open .wp-block-navigation__responsive-close {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content > ul,
  body .wp-block-navigation__responsive-container.saf-lovable-menu-open .wp-block-navigation__responsive-container-content > ul,
  body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content > .wp-block-navigation__container,
  body .wp-block-navigation__responsive-container.saf-lovable-menu-open .wp-block-navigation__responsive-container-content > .wp-block-navigation__container {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content li,
  body .wp-block-navigation__responsive-container.saf-lovable-menu-open .wp-block-navigation__responsive-container-content li {
    display: flex !important;
    flex: 0 0 auto !important;
    flex-direction: column !important;
    align-items: stretch !important;
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content li > a,
  body .wp-block-navigation__responsive-container.saf-lovable-menu-open .wp-block-navigation__responsive-container-content li > a,
  body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content li > button,
  body .wp-block-navigation__responsive-container.saf-lovable-menu-open .wp-block-navigation__responsive-container-content li > button {
    display: flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 48px !important;
    height: auto !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content ul.wp-block-navigation__submenu-container,
  body .wp-block-navigation__responsive-container.saf-lovable-menu-open .wp-block-navigation__responsive-container-content ul.wp-block-navigation__submenu-container {
    display: flex !important;
    flex-direction: column !important;
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* SAF ROOT-CAUSE HOTFIX v4
 * The live HTML contains every navigation link, but WordPress can set
 * html.has-modal-open before the navigation container's is-menu-open class
 * is reflected by the Interactivity API. Scope the visible menu to the real
 * modal state as well, and explicitly restore the direct list and its items.
 */
@media (max-width: 900px) {
  html.has-modal-open body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container,
  html.has-modal-open body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container.is-menu-open,
  html.has-modal-open body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container.saf-lovable-menu-open {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    z-index: 2147483000 !important;
    background: #fbf7ef !important;
    color: #251a1b !important;
    box-sizing: border-box !important;
  }

  html.has-modal-open body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container-content,
  html.has-modal-open body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container-content > ul,
  html.has-modal-open body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container-content > ul.wp-block-navigation__container,
  html.has-modal-open body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container-content ul.is-responsive {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    position: relative !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    clip: auto !important;
    clip-path: none !important;
  }

  html.has-modal-open body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container-content > ul > li,
  html.has-modal-open body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container-content ul.wp-block-navigation__container > li,
  html.has-modal-open body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container-content li.wp-block-navigation-item {
    display: flex !important;
    flex: 0 0 auto !important;
    flex-direction: column !important;
    align-items: stretch !important;
    position: relative !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    clip: auto !important;
    clip-path: none !important;
  }

  html.has-modal-open body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container-content li > a.wp-block-navigation-item__content,
  html.has-modal-open body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container-content li > button.wp-block-navigation-item__content {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex: 0 0 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 48px !important;
    height: auto !important;
    padding: 13px 24px !important;
    margin: 0 !important;
    color: #251a1b !important;
    background: transparent !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    visibility: visible !important;
    opacity: 1 !important;
    box-sizing: border-box !important;
  }

  html.has-modal-open body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container-content ul.wp-block-navigation__submenu-container {
    display: flex !important;
    flex-direction: column !important;
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 0 0 14px !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
  }
}


/* SAF MOBILE NAVIGATION RECOVERY — 2026-10-12
 * On touch-first devices, use the WordPress responsive toggle even when the
 * browser requests the desktop site and reports a wide CSS viewport.
 * Do not alter page content, images, links, or desktop pointer navigation.
 */
@media (hover: none) and (pointer: coarse) {
  /* Hide the desktop horizontal list outside the responsive overlay. */
  body nav[aria-label="SAFMenu"] > .wp-block-navigation__container,
  body nav[aria-label="SAFMenu"] > ul.wp-block-navigation__container,
  body nav[aria-label="SAFMenu"] > .wp-block-navigation__responsive-container:not(.is-menu-open):not(.saf-lovable-menu-open) .wp-block-navigation__container {
    display: none !important;
  }

  /* Keep the native WordPress hamburger visible and tappable. */
  body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container-open,
  body nav[aria-label="SAFMenu"] button.wp-block-navigation__responsive-container-open {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    position: relative !important;
    z-index: 2147483001 !important;
    min-width: 48px !important;
    min-height: 48px !important;
    cursor: pointer !important;
  }

  /* Closed overlay must not cover the page or leave hover dropdowns hanging. */
  body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container:not(.is-menu-open):not(.saf-lovable-menu-open) {
    display: none !important;
    pointer-events: none !important;
  }

  /* Once opened, make the menu a viewport-sized, scrollable panel. */
  body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container.is-menu-open,
  body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container.saf-lovable-menu-open {
    display: flex !important;
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    z-index: 2147483000 !important;
    background: #fbf7ef !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    box-sizing: border-box !important;
  }

  body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
  body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container.saf-lovable-menu-open .wp-block-navigation__responsive-container-content {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    max-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 76px 16px 24px !important;
    box-sizing: border-box !important;
  }

  /* Stack every menu level; never use desktop absolute-positioned dropdowns. */
  body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container.is-menu-open ul.wp-block-navigation__container,
  body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container.saf-lovable-menu-open ul.wp-block-navigation__container,
  body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container.is-menu-open ul.wp-block-navigation__submenu-container,
  body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container.saf-lovable-menu-open ul.wp-block-navigation__submenu-container {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    position: static !important;
    inset: auto !important;
    transform: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
    box-shadow: none !important;
  }

  body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container.is-menu-open li.wp-block-navigation-item,
  body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container.saf-lovable-menu-open li.wp-block-navigation-item {
    display: flex !important;
    flex-direction: column !important;
    position: static !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content,
  body nav[aria-label="SAFMenu"] .wp-block-navigation__responsive-container.saf-lovable-menu-open .wp-block-navigation-item__content {
    display: flex !important;
    align-items: center !important;
    min-height: 48px !important;
    height: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px 16px !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    box-sizing: border-box !important;
  }
}


/* SAF MOBILE MENU + BREADCRUMB ICON SIZE HOTFIX
 * Prevent oversized SVG icons (notably the mobile close/submenu chevron)
 * from occupying the menu content area. Keep menu markup and JS unchanged.
 */
@media (max-width: 900px) {
  .wp-block-navigation__responsive-container-open,
  .wp-block-navigation__responsive-container-close,
  .wp-block-navigation__submenu-icon,
  .wp-block-navigation-submenu__toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 44px !important;
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    padding: 10px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  .wp-block-navigation__responsive-container-open svg,
  .wp-block-navigation__responsive-container-close svg,
  .wp-block-navigation__submenu-icon svg,
  .wp-block-navigation-submenu__toggle svg,
  .wp-block-navigation__submenu-container svg {
    display: block !important;
    width: 20px !important;
    min-width: 20px !important;
    max-width: 20px !important;
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    flex: 0 0 20px !important;
    transform: none !important;
    overflow: visible !important;
  }

  .wp-block-navigation__responsive-container-close svg {
    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
    height: 22px !important;
    min-height: 22px !important;
    max-height: 22px !important;
    flex-basis: 22px !important;
  }

  /* Breadcrumbs must wrap naturally on small screens, not clip or overlap. */
  .rank-math-breadcrumb,
  .yoast-breadcrumb,
  .woocommerce-breadcrumb,
  nav[aria-label*="Breadcrumb"],
  nav[aria-label*="breadcrumb"],
  .wp-block-post-terms,
  .breadcrumb,
  .breadcrumbs {
    max-width: 100% !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
    box-sizing: border-box !important;
  }

  .rank-math-breadcrumb a,
  .yoast-breadcrumb a,
  .woocommerce-breadcrumb a,
  nav[aria-label*="Breadcrumb"] a,
  nav[aria-label*="breadcrumb"] a,
  .breadcrumb a,
  .breadcrumbs a {
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }
}