/* menu.css — LIM Overlay FAB (M / Close). Drawer: lim-navigation.css */

:root {
  --lim-mobile-edge: 16px;
  --lim-fab-size: 56px;
  --lim-fab-glow: color-mix(in srgb, var(--accent) 42%, transparent);
}

/* ——— Overlay root: viewport-fixed layer, never inside transform parents ——— */
.lim-nav-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  pointer-events: none;
}

.lim-nav-overlay .lim-menu-btn {
  pointer-events: auto;
}

.lim-nav-overlay .lim-nav-backdrop.is-open,
.lim-nav-overlay .lim-menu[data-lim-nav-state="opening"],
.lim-nav-overlay .lim-menu[data-lim-nav-state="open"],
.lim-nav-overlay .lim-menu[data-lim-nav-state="dragging"],
.lim-nav-overlay .lim-menu[data-lim-nav-state="closing"] {
  pointer-events: none;
}

.lim-nav-overlay .lim-nav-backdrop.is-open {
  pointer-events: auto;
}

.lim-nav-overlay .lim-menu[data-lim-nav-state="opening"] .lim-menu__panel,
.lim-nav-overlay .lim-menu[data-lim-nav-state="open"] .lim-menu__panel,
.lim-nav-overlay .lim-menu[data-lim-nav-state="dragging"] .lim-menu__panel,
.lim-nav-overlay .lim-menu[data-lim-nav-state="closing"] .lim-menu__panel {
  pointer-events: auto;
}

/* ——— FAB: always viewport-fixed bottom-right ——— */
.lim-menu-btn,
.lim-menu-btn--fab {
  --lim-menu-icon-size: 24px;
  position: fixed;
  right: calc(var(--lim-mobile-edge) + env(safe-area-inset-right, 0px));
  bottom: calc(var(--lim-mobile-edge) + env(safe-area-inset-bottom, 0px));
  left: auto;
  top: auto;
  z-index: 10020;
  width: var(--lim-fab-size);
  height: var(--lim-fab-size);
  min-width: var(--lim-fab-size);
  min-height: var(--lim-fab-size);
  margin: 0;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 50%;
  background: color-mix(in srgb, var(--surface, var(--page-bg)) 94%, transparent);
  color: var(--text-primary);
  display: inline-grid;
  place-items: center;
  cursor: pointer;
  flex-shrink: 0;
  box-shadow: 0 8px 24px rgba(16, 17, 20, 0.12);
  -webkit-tap-highlight-color: transparent;
  transition:
    background-color var(--duration-fast) var(--ease-standard),
    border-color var(--duration-fast) var(--ease-standard),
    color var(--duration-fast) var(--ease-standard),
    box-shadow var(--duration-medium) var(--ease-emphasized),
    transform var(--duration-fast) var(--ease-standard);
}

.lim-menu-btn:hover {
  background: var(--surface);
  border-color: var(--border-strong);
  color: var(--text-primary);
}

.lim-menu-btn:active {
  transform: scale(0.95);
}

.lim-menu-btn:focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: 3px;
}

/* OPEN — soft LIM blue presence, same position */
.lim-menu-btn[aria-expanded="true"],
body.lim-menu-open .lim-menu-btn {
  background: color-mix(in srgb, var(--surface-raised, var(--surface)) 92%, var(--accent) 8%);
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
  color: var(--accent-strong);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--accent) 22%, transparent),
    0 0 22px var(--lim-fab-glow),
    0 10px 28px rgba(16, 17, 20, 0.16);
}

.lim-menu-btn__svg {
  display: block;
  width: var(--lim-menu-icon-size);
  height: calc(var(--lim-menu-icon-size) * 0.72);
  overflow: visible;
}

.lim-menu-icon__mark,
.lim-menu-icon__x {
  transition: opacity 320ms var(--ease-emphasized);
}

.lim-menu-icon__mark {
  opacity: 1;
}

.lim-menu-icon__x {
  opacity: 0;
}

.lim-menu-btn[aria-expanded="true"] .lim-menu-icon__mark {
  opacity: 0;
}

.lim-menu-btn[aria-expanded="true"] .lim-menu-icon__x {
  opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  .lim-menu-icon__mark,
  .lim-menu-icon__x,
  .lim-menu-btn {
    transition-duration: 1ms;
  }

  .lim-menu-btn:active {
    transform: none;
  }
}

@media (orientation: landscape) and (max-height: 480px) {
  :root {
    --lim-mobile-edge: 12px;
  }
}

/* Never show a second M inside the header */
.site-header__actions .lim-menu-btn,
.site-header__actions .nav-toggle,
.home-header .site-header__actions .lim-menu-btn {
  display: none !important;
}

/* Header chrome when menu open — switches stay readable */
.site-header.lim-menu-active {
  background: var(--nav-bg);
}

.site-header.lim-menu-active .lim-switch--lang,
.site-header.lim-menu-active .lim-switch--theme,
.home-header.lim-menu-active .lim-switch--lang,
.home-header.lim-menu-active .lim-switch--theme {
  border-color: var(--border-strong);
  background: var(--surface-subtle);
}

.home-header.lim-menu-active .lim-switch--theme,
.site-header.lim-menu-active .lim-switch--theme {
  background: linear-gradient(135deg, #dce9ff 0%, #f4f7fb 100%);
}

:root[data-theme="night"] .home-header.lim-menu-active .lim-switch--theme,
:root[data-theme="night"] .site-header.lim-menu-active .lim-switch--theme,
:root[data-theme="dark"] .home-header.lim-menu-active .lim-switch--theme,
:root[data-theme="dark"] .site-header.lim-menu-active .lim-switch--theme {
  background: var(--surface-subtle);
}

.home-header.lim-menu-active {
  background: var(--nav-bg);
  border-bottom-color: var(--border);
}

.home-header.lim-menu-active .header-links a {
  color: var(--text-secondary);
}