/* Approved mobile product menu. Desktop navigation retains its existing styles. */
.mobile-menu-backdrop { display: none; }
@media (max-width: 900px) {
  body.menu-open .site-header { z-index: 1400; transform: none; }
  body.menu-open .site-header .nav-wrap { background: #fff; backdrop-filter: none; -webkit-backdrop-filter: none; box-shadow: none; }
  body.menu-open .site-header .menu-toggle span { background: #2d4140; }
  body.menu-open .site-header .bag-button { color: #2d4140; background: transparent; box-shadow: none; }
  body.menu-open .site-header .bag-button svg { stroke: currentColor; }
  .mobile-menu-backdrop:not([hidden]) { display: block; position: fixed; inset: 0; z-index: 1399; width: 100%; height: 100%; padding: 0; border: 0; background: rgba(28,43,40,.27); cursor: pointer; }
  body .site-header .mobile-menu.dreamitt-mobile-menu { position: absolute; top: 100%; left: 0; right: 0; z-index: 2; display: block; max-height: calc(100dvh - var(--mobile-menu-top, 76px) - env(safe-area-inset-bottom)); overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; padding: 6px 22px 20px; border: 0; border-top: 1px solid #e9ece8; border-radius: 0 0 18px 18px; background: #fff; color: #2d4140; box-shadow: 0 10px 22px #173a3710; }
  body .site-header .mobile-menu.dreamitt-mobile-menu[hidden] { display: none; }
  .dreamitt-mobile-menu .dm-products { max-width: 480px; margin: 0 auto; }
  .site-header .dreamitt-mobile-menu a.dm-product { display: grid; grid-template-columns: 64px minmax(0,1fr) 20px; gap: 16px; width: 100%; min-height: 102px; align-items: center; padding: 18px 0; border: 0; border-bottom: 1px solid #e9ece8; color: #2d4140; text-align: left; text-decoration: none; }
  .dreamitt-mobile-menu .dm-thumb { position: relative; display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; overflow: hidden; border-radius: 10px; background: #fcf9f3; }
  .dreamitt-mobile-menu .dm-thumb img { position: relative; z-index: 1; display: block; width: 100%; height: 100%; object-fit: contain; }
  .dreamitt-mobile-menu .dm-thumb-bed::before { content: ''; position: absolute; left: 8px; top: 8px; width: 34px; height: 34px; border-radius: 50%; background: #fee2d8; }
  .dreamitt-mobile-menu .dm-name { display: flex; align-items: center; gap: 8px; font-family: var(--heading); font-size: 20px; font-weight: 700; line-height: 1.3; letter-spacing: -.4px; }
  .dreamitt-mobile-menu .dm-product[aria-current="page"] .dm-name::after { content: ''; width: 6px; height: 6px; flex-shrink: 0; border-radius: 50%; background: #ffa891; }
  .dreamitt-mobile-menu .dm-sub { display: block; margin-top: 5px; color: #6f7c76; font-family: var(--body); font-size: 12px; font-weight: 400; line-height: 1.4; }
  .dreamitt-mobile-menu .dm-arrow { display: block; width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; color: #7b8781; }
  .dreamitt-mobile-menu .dm-secondary { max-width: 480px; margin: 0 auto; padding-top: 15px; }
  .site-header .dreamitt-mobile-menu .dm-secondary a { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 44px; padding: 0; border: 0; color: #2d4140; font-family: var(--body); font-size: 15px; font-weight: 500; text-decoration: none; }
  .dreamitt-mobile-menu .dm-secondary .dm-arrow { width: 16px; height: 16px; stroke-width: 1.4; color: #a1aaa5; }
  .site-header .dreamitt-mobile-menu .dm-secondary a[aria-current="page"] { text-decoration: underline; text-decoration-color: #ffa891; text-underline-offset: 5px; }
  .dreamitt-mobile-menu a:focus-visible { outline: 2px solid #2d4140; outline-offset: 3px; border-radius: 5px; }
  .dreamitt-mobile-menu a:hover .dm-name, .site-header .dreamitt-mobile-menu .dm-secondary a:hover { color: #ba6d56; }
  body.menu-open .home-chat-launcher, body.menu-open .dreamitt-wa-float { display: none; }
}
@media (max-width: 350px) {
  body .site-header .mobile-menu.dreamitt-mobile-menu { padding-left: 17px; padding-right: 17px; }
  .site-header .dreamitt-mobile-menu a.dm-product { grid-template-columns: 58px minmax(0,1fr) 17px; gap: 11px; }
  .dreamitt-mobile-menu .dm-thumb { width: 58px; height: 58px; }
  .dreamitt-mobile-menu .dm-name { font-size: 19px; }
  .dreamitt-mobile-menu .dm-sub { font-size: 11px; }
}
