
/* CRAZE-X V14 — compact, modern mobile menu. Overrides previous menu rules. */
._cx_menu_overlay{
  position:fixed!important;inset:0!important;z-index:4990!important;
  background:rgba(1,5,18,.68)!important;backdrop-filter:blur(3px)!important;
  -webkit-backdrop-filter:blur(3px)!important;opacity:0!important;
  visibility:hidden!important;pointer-events:none!important;transition:opacity .22s ease,visibility .22s ease!important;
}
._cx_menu_overlay.active{opacity:1!important;visibility:visible!important;pointer-events:auto!important}

._nuxt_mobile_menu{
  position:fixed!important;z-index:5005!important;top:92px!important;left:18px!important;
  width:320px!important;max-height:calc(100vh - 215px)!important;overflow:auto!important;
  padding:10px!important;margin:0!important;background:linear-gradient(180deg,#091a36 0%,#06142b 100%)!important;
  border:1px solid rgba(52,137,225,.38)!important;border-radius:22px!important;
  box-shadow:0 28px 80px rgba(0,0,0,.72),0 0 35px rgba(15,129,230,.10)!important;
  transform:translateX(-18px) translateY(-8px) scale(.98)!important;opacity:0!important;
  visibility:hidden!important;pointer-events:none!important;
  transition:transform .22s cubic-bezier(.2,.8,.2,1),opacity .18s ease,visibility .18s ease!important;
  scrollbar-width:thin!important;scrollbar-color:#183866 transparent!important;
}
._nuxt_mobile_menu.active{
  transform:translateX(0) translateY(0) scale(1)!important;opacity:1!important;
  visibility:visible!important;pointer-events:auto!important;
}
._nuxt_mobile_menu::-webkit-scrollbar{width:4px!important}
._nuxt_mobile_menu::-webkit-scrollbar-thumb{background:#183866!important;border-radius:10px!important}

.cx-menu-head{
  height:52px!important;padding:0 5px 8px 8px!important;display:flex!important;
  align-items:center!important;justify-content:space-between!important;
  border-bottom:1px solid rgba(93,139,194,.14)!important;margin-bottom:8px!important;
}
.cx-menu-brand{display:flex!important;align-items:center!important;gap:9px!important;color:#fff!important;
  font-size:17px!important;font-weight:800!important;letter-spacing:.02em!important}
.cx-menu-dot{width:9px!important;height:9px!important;border-radius:50%!important;background:#20d36f!important;
  box-shadow:0 0 12px rgba(32,211,111,.65)!important}
.cx-menu-close{
  width:38px!important;height:38px!important;border-radius:11px!important;border:1px solid rgba(94,139,195,.25)!important;
  background:#0d2447!important;color:#9fb2d6!important;display:flex!important;align-items:center!important;
  justify-content:center!important;font-size:16px!important;cursor:pointer!important;
}
.cx-menu-close:hover{background:#15345f!important;color:#fff!important}

.cx-menu-list{display:flex!important;flex-direction:column!important;gap:5px!important}
._nuxt_mobile_menu .cx-menu-item{
  min-height:52px!important;display:flex!important;align-items:center!important;gap:12px!important;
  padding:7px 10px!important;border-radius:14px!important;color:#b7c5e5!important;
  font-size:15px!important;font-weight:700!important;line-height:1!important;
  border:1px solid transparent!important;background:rgba(7,24,50,.35)!important;
  transition:background .16s ease,border-color .16s ease,transform .16s ease,color .16s ease!important;
}
._nuxt_mobile_menu .cx-menu-item:hover,. _nuxt_mobile_menu .cx-menu-item:active{
  background:#0d294e!important;border-color:rgba(36,171,248,.25)!important;color:#fff!important;transform:translateX(2px)!important;
}
.cx-menu-icon{
  width:36px!important;height:36px!important;min-width:36px!important;border-radius:11px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  background:#0d2a52!important;color:#59b8fa!important;font-size:15px!important;
  border:1px solid rgba(54,139,223,.20)!important;
}
.cx-menu-arrow{margin-left:auto!important;font-size:10px!important;color:#55749f!important}
.cx-menu-admin .cx-menu-icon{color:#ffbb0d!important;background:#332b0c!important}
.cx-menu-footer{
  margin:9px 4px 1px!important;padding:10px 8px 3px!important;border-top:1px solid rgba(93,139,194,.12)!important;
  color:#607b9e!important;font-size:10px!important;font-weight:600!important;text-align:center!important;
}
.cx-menu-status{display:inline-block!important;width:6px!important;height:6px!important;border-radius:50%!important;
  background:#20d36f!important;margin-right:5px!important;box-shadow:0 0 8px rgba(32,211,111,.5)!important}

body.cx-menu-open{overflow:hidden!important}

@media(max-width:620px){
  ._nuxt_mobile_menu{
    top:76px!important;left:12px!important;width:calc(100vw - 24px)!important;max-width:370px!important;
    max-height:calc(100vh - 190px)!important;border-radius:20px!important;padding:9px!important;
  }
  .cx-menu-head{height:49px!important;margin-bottom:7px!important}
  .cx-menu-brand{font-size:16px!important}
  ._nuxt_mobile_menu .cx-menu-item{min-height:49px!important;font-size:15px!important}
  .cx-menu-icon{width:34px!important;height:34px!important;min-width:34px!important;border-radius:10px!important}
}
@media(max-width:380px){
  ._nuxt_mobile_menu{left:9px!important;width:calc(100vw - 18px)!important}
  ._nuxt_mobile_menu .cx-menu-item{min-height:46px!important}
  .cx-menu-icon{width:32px!important;height:32px!important;min-width:32px!important}
}
/* Keep the fixed bottom navigation above the menu only where it exists. */
.x-bottom-nav{z-index:6000!important}

/* ===== CRAZE-X PROFILE DROPDOWN V15 ===== */
._nuxt_header_profile_menu{
  position:absolute!important;
  top:calc(100% + 10px)!important;
  right:0!important;
  width:236px!important;
  padding:9px!important;
  display:flex!important;
  flex-direction:column!important;
  gap:6px!important;
  background:linear-gradient(145deg,rgba(12,29,58,.98),rgba(5,16,35,.99))!important;
  border:1px solid rgba(46,145,239,.30)!important;
  border-radius:20px!important;
  box-shadow:0 22px 65px rgba(0,0,0,.65),0 0 30px rgba(20,139,235,.10)!important;
  backdrop-filter:blur(20px)!important;
  -webkit-backdrop-filter:blur(20px)!important;
  opacity:0!important;
  visibility:hidden!important;
  transform:translateY(-8px) scale(.97)!important;
  pointer-events:none!important;
  transition:opacity .18s ease,transform .20s ease,visibility .18s ease!important;
  z-index:7000!important;
}
._nuxt_header_profile_menu.active{
  opacity:1!important;
  visibility:visible!important;
  transform:translateY(0) scale(1)!important;
  pointer-events:auto!important;
}
._nuxt_header_profile_menu:before{
  content:''!important;
  position:absolute!important;
  top:-6px!important;
  right:76px!important;
  width:11px!important;
  height:11px!important;
  background:#0c1d3a!important;
  border-left:1px solid rgba(46,145,239,.30)!important;
  border-top:1px solid rgba(46,145,239,.30)!important;
  transform:rotate(45deg)!important;
}
._nuxt_header_profile_menu a{
  position:relative!important;
  width:100%!important;
  height:52px!important;
  min-height:52px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:12px!important;
  padding:0 14px!important;
  border:1px solid transparent!important;
  border-radius:14px!important;
  background:rgba(10,30,59,.55)!important;
  color:#dbe6fb!important;
  font-size:15px!important;
  font-weight:800!important;
  text-align:left!important;
  transition:all .16s ease!important;
}
._nuxt_header_profile_menu a:before{
  width:34px!important;
  height:34px!important;
  min-width:34px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:10px!important;
  background:#102d56!important;
  color:#55b9fa!important;
  font-family:"Font Awesome 6 Free"!important;
  font-weight:900!important;
  font-size:14px!important;
}
._nuxt_header_profile_menu a:nth-child(1):before{content:"\f2bd"!important}
._nuxt_header_profile_menu a:nth-child(2):before{content:"\f53a"!important}
._nuxt_header_profile_menu a:nth-child(3):before{
  content:"\f2f5"!important;
  color:#ff6680!important;
  background:rgba(255,63,92,.10)!important;
}
._nuxt_header_profile_menu a:after{
  content:"\f054"!important;
  margin-left:auto!important;
  font-family:"Font Awesome 6 Free"!important;
  font-weight:900!important;
  font-size:9px!important;
  color:#587ba9!important;
}
._nuxt_header_profile_menu a:hover,
._nuxt_header_profile_menu a:active{
  background:linear-gradient(90deg,rgba(25,91,156,.48),rgba(17,52,94,.72))!important;
  border-color:rgba(52,161,245,.22)!important;
  color:#fff!important;
  transform:translateX(2px)!important;
}
._nuxt_header_profile_menu a:hover:before{
  background:#174372!important;
  color:#fff!important;
}
._nuxt_header_profile_menu a:nth-child(3):hover{
  background:rgba(255,63,92,.10)!important;
  border-color:rgba(255,63,92,.20)!important;
  color:#ff8da0!important;
}

/* click-away layer sits below the dropdown */
._nuxt_header_profile_menu_bg{
  position:fixed!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  top:0!important;
  left:0!important;
  background:rgba(1,5,18,.48)!important;
  backdrop-filter:blur(2px)!important;
  -webkit-backdrop-filter:blur(2px)!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  z-index:6990!important;
  transition:opacity .18s ease,visibility .18s ease!important;
}
._nuxt_header_profile_menu_bg.active{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
}
._nuxt_header_profile_menu,
._nuxt_header_user{
  isolation:isolate!important;
}
._nuxt_header_user_photo{
  cursor:pointer!important;
  transition:transform .16s ease,box-shadow .16s ease!important;
}
._nuxt_header_user_photo:hover{
  transform:scale(1.06)!important;
  box-shadow:0 0 0 3px rgba(36,171,248,.12),0 0 20px rgba(36,171,248,.18)!important;
}
@media(max-width:620px){
  ._nuxt_header_profile_menu{
    top:calc(100% + 8px)!important;
    right:-2px!important;
    width:220px!important;
    padding:8px!important;
    border-radius:18px!important;
  }
  ._nuxt_header_profile_menu a{
    height:49px!important;
    min-height:49px!important;
    font-size:14px!important;
    border-radius:13px!important;
  }
  ._nuxt_header_profile_menu a:before{
    width:32px!important;
    height:32px!important;
    min-width:32px!important;
  }
  ._nuxt_header_profile_menu:before{right:68px!important}
}

/* ===== MOBILE BOTTOM NAV — FINAL STABILITY FIX =====
   The navigation is shared by all pages. Keep it anchored to the viewport
   so profile content, horizontal tabs and footer layout cannot move it. */
@media (max-width:620px){
  html,body{
    width:100%!important;
    max-width:100%!important;
    overflow-x:hidden!important;
  }
  ._nuxt_container{
    max-width:100%!important;
  }
  .x-bottom-nav{
    position:fixed!important;
    left:12px!important;
    right:12px!important;
    bottom:10px!important;
    width:auto!important;
    max-width:none!important;
    min-width:0!important;
    height:76px!important;
    margin:0!important;
    padding:5px!important;
    box-sizing:border-box!important;
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    align-items:center!important;
    transform:none!important;
    z-index:60000!important;
  }
  .x-bottom-nav a,
  .x-bottom-nav button{
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }
  .x-bottom-nav span{
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    max-width:100%!important;
  }
  /* Reserve space under profile/footer content without affecting the nav. */
  ._nuxt_footer{
    margin-bottom:112px!important;
  }
}

@media (max-width:380px){
  .x-bottom-nav{left:9px!important;right:9px!important;bottom:8px!important}
  .x-bottom-nav a,.x-bottom-nav button{font-size:10px!important}
  .x-bottom-plus{width:54px!important;height:54px!important}
}
