/* REKAP_MOBILE_MENU_POLISH_V1_1 */

#rekapMenuFixedSpacer {
  display: block;
  height: 70px;
  width: 100%;
  pointer-events: none;
}

body.rekap-menu-fixed-v11 #rekapAppMenuBar {
  position: fixed !important;
  top: var(--rekap-menu-fixed-top, 82px) !important;
  left: max(14px, env(safe-area-inset-left)) !important;
  right: auto !important;
  z-index: 2147482500 !important;
  width: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  pointer-events: none;
}

body.rekap-menu-fixed-v11 #rekapAppMenuButton {
  pointer-events: auto;
  min-height: 48px;
  padding: 6px 14px 6px 7px;
  gap: 9px;
  border-radius: 17px;
  background:
    radial-gradient(circle at 22px 50%, rgba(205,55,243,.18), transparent 30px),
    linear-gradient(180deg, rgba(30,18,42,.97), rgba(14,8,21,.97));
  box-shadow:
    0 16px 38px rgba(0,0,0,.32),
    0 0 0 1px rgba(255,255,255,.025),
    0 0 34px rgba(189,46,238,.10);
}

body.rekap-menu-fixed-v11 #rekapAppMenuButton .rm-lines {
  width: 34px !important;
  height: 34px !important;
  flex: 0 0 34px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 35% 28%, rgba(255,255,255,.17), transparent 28%),
    linear-gradient(145deg, rgba(211,40,244,.26), rgba(121,74,255,.16));
  box-shadow:
    inset 0 0 0 1px rgba(230,155,255,.15),
    0 0 19px rgba(199,50,242,.17);
  transition:
    transform .32s cubic-bezier(.2,.85,.25,1.2),
    box-shadow .28s ease;
}

body.rekap-menu-fixed-v11 #rekapAppMenuButton .rm-lines i {
  left: 6px !important;
  width: 22px !important;
}

body.rekap-menu-fixed-v11 #rekapAppMenuButton .rm-lines i:nth-child(1) {
  top: 9px !important;
}

body.rekap-menu-fixed-v11 #rekapAppMenuButton .rm-lines i:nth-child(2) {
  top: 16px !important;
}

body.rekap-menu-fixed-v11 #rekapAppMenuButton .rm-lines i:nth-child(3) {
  top: 23px !important;
}

body.rekap-menu-open #rekapAppMenuButton .rm-lines {
  transform: rotate(180deg) scale(1.05);
  box-shadow:
    inset 0 0 0 1px rgba(230,155,255,.22),
    0 0 28px rgba(207,45,244,.38);
}

body.rekap-menu-open #rekapAppMenuButton .rm-lines i:nth-child(1),
body.rekap-menu-open #rekapAppMenuButton .rm-lines i:nth-child(3) {
  top: 16px !important;
}

.rekap-round-menu-burst {
  position: fixed;
  z-index: 2147483005;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  pointer-events: none;
  transform: translate(-50%, -50%) scale(.25);
  background:
    radial-gradient(circle,
      rgba(244,190,255,.68) 0%,
      rgba(211,39,244,.42) 24%,
      rgba(117,70,255,.19) 52%,
      rgba(117,70,255,0) 72%);
  box-shadow:
    0 0 0 1px rgba(234,174,255,.22),
    0 0 34px rgba(204,45,241,.38);
  animation: rekap-round-burst-v11 .68s cubic-bezier(.12,.72,.2,1) forwards;
}

@keyframes rekap-round-burst-v11 {
  0% {
    opacity: .92;
    transform: translate(-50%, -50%) scale(.25);
  }
  55% {
    opacity: .36;
  }
  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(25);
  }
}

/* Mobile-first drawer polish */
#rekapMenuDrawer {
  width: min(355px, 92vw) !important;
}

#rekapMenuDrawer .rm-head {
  padding-top: max(18px, env(safe-area-inset-top)) !important;
}

#rekapMenuList .rm-item {
  min-height: 55px;
  border-radius: 14px;
}

#rekapMenuList .rm-copy b {
  font-size: 11.2px;
}

#rekapMenuList .rm-copy small {
  font-size: 7.8px;
}

#rekapMenuList .rm-icon {
  width: 36px;
  height: 36px;
  border-radius: 11px;
}

#rekapMenuList .rm-icon .rm-rick-logo {
  width: 29px;
  height: 29px;
}

@media (max-width: 640px) {
  #rekapMenuFixedSpacer {
    height: 62px;
  }

  body.rekap-menu-fixed-v11 #rekapAppMenuBar {
    left: max(10px, env(safe-area-inset-left)) !important;
  }

  body.rekap-menu-fixed-v11 #rekapAppMenuButton {
    min-height: 44px;
    padding: 5px 12px 5px 6px;
    border-radius: 15px;
    font-size: 11px;
  }

  body.rekap-menu-fixed-v11 #rekapAppMenuButton .rm-lines {
    width: 32px !important;
    height: 32px !important;
    flex-basis: 32px;
  }

  body.rekap-menu-fixed-v11 #rekapAppMenuButton .rm-lines i {
    left: 5px !important;
  }

  #rekapMenuDrawer {
    width: min(345px, 94vw) !important;
  }

  #rekapMenuList {
    padding-left: 8px;
    padding-right: 8px;
  }

  #rekapMenuList .rm-item {
    min-height: 57px;
    margin: 4px 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .rekap-round-menu-burst {
    display: none !important;
  }
}