/*
 * 0.4.73 — route-aware canonical Lovable mobile navigation.
 *
 * Homepage source: src/routes/index.tsx and src/routes/de.index.tsx.
 * Shared-page source: src/components/SiteHeader.tsx and
 * src/de/components/SiteHeader.tsx.
 *
 * Scoped !important declarations are required because historical parity files
 * contain older full-viewport mobile-panel rules with !important.
 */
@media (max-width: 1279px) {
  .lamilka-site-header .lamilka-mobile-panel {
    position: fixed !important;
    top: calc(var(--lamilka-header-offset, 0px) + 64px) !important;
    right: 0 !important;
    bottom: auto !important;
    left: 0 !important;
    z-index: 99989 !important;
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: 62vh !important;
    max-height: min(62vh, calc(100dvh - var(--lamilka-header-offset, 0px) - 64px)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    border-top: 1px solid rgba(10, 25, 47, .10) !important;
    background: #fff !important;
    box-shadow: 0 12px 24px -12px rgba(10, 25, 47, .25) !important;
    color: var(--lm-exact-navy, #0a192f) !important;
    -webkit-overflow-scrolling: touch;
  }

  html[lang^="de"] body:not(.lamilka-home) .lamilka-site-header .lamilka-mobile-panel {
    max-height: 60vh !important;
    max-height: min(60vh, calc(100dvh - var(--lamilka-header-offset, 0px) - 64px)) !important;
  }

  /* Both Lovable homepage routes use 62vh. */
  html[lang^="de"] body.lamilka-home .lamilka-site-header .lamilka-mobile-panel,
  body.lamilka-home .lamilka-site-header .lamilka-mobile-panel {
    max-height: 62vh !important;
    max-height: min(62vh, calc(100dvh - var(--lamilka-header-offset, 0px) - 64px)) !important;
  }

  .lamilka-site-header .lamilka-mobile-panel[hidden] {
    display: none !important;
  }

  .lamilka-site-header .lamilka-mobile-contact {
    display: none !important;
  }

  .lamilka-site-header .lamilka-language-switcher--mobile > span[aria-hidden="true"] {
    font-size: 0 !important;
  }

  .lamilka-site-header .lamilka-language-switcher--mobile > span[aria-hidden="true"]::before {
    content: "|";
    font-size: 12px;
  }

  /* Shared SiteHeader menu used on all non-home public routes. */
  body:not(.lamilka-home) .lamilka-site-header .lamilka-mobile-panel nav {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 1280px !important;
    margin: 0 auto !important;
    padding: 12px 16px !important;
  }

  body:not(.lamilka-home) .lamilka-site-header .lamilka-mobile-utility {
    display: flex !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 0 12px !important;
    align-items: center !important;
    justify-content: flex-start !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(10, 25, 47, .08) !important;
  }

  body:not(.lamilka-home) .lamilka-site-header .lamilka-mobile-links {
    display: flex !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-direction: column !important;
    gap: 0 !important;
  }

  body:not(.lamilka-home) .lamilka-site-header .lamilka-mobile-link {
    box-sizing: border-box !important;
    display: flex !important;
    min-height: 36px !important;
    margin: 0 !important;
    padding: 8px 0 !important;
    align-items: center !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: rgba(10, 25, 47, .80) !important;
    font: 400 14px/20px var(--lm-exact-body, Inter, sans-serif) !important;
    letter-spacing: 0 !important;
    text-decoration: none !important;
  }

  /* Homepage mobile menu follows the dedicated homepage JSX exactly. */
  body.lamilka-home .lamilka-site-header .lamilka-mobile-panel nav {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 8px 16px !important;
  }

  body.lamilka-home .lamilka-site-header .lamilka-mobile-utility {
    display: flex !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 0 12px !important;
    align-items: center !important;
    justify-content: flex-start !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(10, 25, 47, .08) !important;
  }

  .lamilka-site-header .lamilka-language-switcher--mobile {
    display: flex !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    gap: 12px !important;
    border: 0 !important;
    color: rgba(10, 25, 47, .70) !important;
    font: 500 12px/1 var(--lm-exact-body, Inter, sans-serif) !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
  }

  .lamilka-site-header .lamilka-language-switcher--mobile a,
  .lamilka-site-header .lamilka-language-switcher--mobile > span:not([aria-hidden="true"]) {
    display: inline-flex !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    color: rgba(10, 25, 47, .70) !important;
    font: inherit !important;
    letter-spacing: inherit !important;
    text-decoration: none !important;
  }

  .lamilka-site-header .lamilka-language-switcher--mobile > span[aria-current="true"] {
    color: var(--lamilka-gold, #c9a86a) !important;
  }

  .lamilka-site-header .lamilka-language-switcher--mobile > span[aria-hidden="true"] {
    display: inline-flex !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 44px !important;
    padding: 0 !important;
    align-items: center !important;
    color: rgba(10, 25, 47, .30) !important;
  }

  body.lamilka-home .lamilka-site-header .lamilka-mobile-links {
    display: flex !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-direction: column !important;
    gap: 0 !important;
  }

  body.lamilka-home .lamilka-site-header .lamilka-mobile-link {
    box-sizing: border-box !important;
    display: flex !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 16px 0 !important;
    align-items: center !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(10, 25, 47, .08) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #1e293b !important;
    font: 500 16px/24px var(--lm-exact-body, Inter, sans-serif) !important;
    letter-spacing: 0 !important;
    text-decoration: none !important;
  }

  .lamilka-site-header .lamilka-mobile-link:hover,
  .lamilka-site-header .lamilka-mobile-link:focus-visible,
  .lamilka-site-header .lamilka-mobile-link.is-active {
    background: transparent !important;
    color: var(--lm-exact-navy, #0a192f) !important;
  }
}