/* UMEED HARD NAVBAR COMPACT FIX v2
   Last-loaded navbar-only override. It fixes the real issue: desktop menu was still showing on mobile/tablet and brand text was forcing height/width. */
:root{
  --umeed-nav-desktop-h: 46px !important;
  --umeed-nav-mobile-h: 46px !important;
  --umeed-gold: #e8c86f !important;
}

html body header.nav,
html body .nav{
  position: relative !important;
  width: 100% !important;
  height: var(--umeed-nav-desktop-h) !important;
  min-height: var(--umeed-nav-desktop-h) !important;
  max-height: var(--umeed-nav-desktop-h) !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  background: rgba(4,6,10,.86) !important;
  border-bottom: 1px solid rgba(232,200,111,.16) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.22) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  z-index: 10000 !important;
}

html body header.nav .container.navbar,
html body header.nav .navbar,
html body .navbar{
  height: var(--umeed-nav-desktop-h) !important;
  min-height: var(--umeed-nav-desktop-h) !important;
  max-height: var(--umeed-nav-desktop-h) !important;
  width: min(1220px, calc(100% - 18px)) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  flex-wrap: nowrap !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

html body header.nav .brand,
html body .brand{
  height: var(--umeed-nav-desktop-h) !important;
  min-height: var(--umeed-nav-desktop-h) !important;
  max-height: var(--umeed-nav-desktop-h) !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 !important;
  margin: 0 !important;
  min-width: 0 !important;
  flex: 0 1 300px !important;
  overflow: hidden !important;
}

html body header.nav .brandMark,
html body .brandMark{
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  flex: 0 0 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 10px !important;
  overflow: hidden !important;
}

html body header.nav .brandMark img,
html body .brandMark img{
  width: 30px !important;
  height: 30px !important;
  object-fit: contain !important;
  display: block !important;
}

html body header.nav .brandName,
html body .brandName{
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  max-width: 100% !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  font-size: clamp(13px, .92vw, 16px) !important;
  line-height: 1 !important;
  color: #fff0c2 !important;
}

html body header.nav .brandSub,
html body .brandSub{ display: none !important; }

html body header.nav .menu,
html body .menu{
  height: var(--umeed-nav-desktop-h) !important;
  min-height: var(--umeed-nav-desktop-h) !important;
  max-height: var(--umeed-nav-desktop-h) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: clamp(7px, .75vw, 13px) !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  flex-wrap: nowrap !important;
}

html body header.nav .menu > a,
html body header.nav .menu .login-btn,
html body .menu > a,
html body .menu .login-btn{
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 5px !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  font-size: clamp(11px, .72vw, 13px) !important;
  border-radius: 9px !important;
  white-space: nowrap !important;
}

html body header.nav .navMore,
html body .navMore{
  height: 28px !important;
  display: inline-flex !important;
  align-items: center !important;
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

html body header.nav .moreBtn,
html body .moreBtn{
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 10px !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 850 !important;
}

html body header.nav .moreMenu,
html body .moreMenu{
  position: absolute !important;
  top: calc(100% + 8px) !important;
  right: 0 !important;
  width: min(310px, calc(100vw - 22px)) !important;
  max-height: min(420px, calc(100dvh - 74px)) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch !important;
  padding: 9px !important;
  border-radius: 18px !important;
  background: linear-gradient(145deg, rgba(10,12,18,.98), rgba(80,11,21,.94)) !important;
  border: 1px solid rgba(232,200,111,.28) !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.56), inset 0 1px 0 rgba(255,255,255,.07) !important;
  z-index: 2147483000 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: perspective(900px) rotateX(-7deg) translateY(-8px) scale(.98) !important;
  transform-origin: top right !important;
  transition: opacity .16s ease, transform .16s ease, visibility .16s ease !important;
}

html body header.nav .navMore.open .moreMenu,
html body header.nav .moreBtn[aria-expanded="true"] + .moreMenu,
html body .navMore.open .moreMenu,
html body .moreBtn[aria-expanded="true"] + .moreMenu{
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: perspective(900px) rotateX(0deg) translateY(0) scale(1) !important;
}

html body header.nav .moreMenu a,
html body .moreMenu a{
  min-height: 36px !important;
  padding: 9px 11px !important;
  margin: 2px 0 !important;
  display: flex !important;
  align-items: center !important;
  border-radius: 12px !important;
  line-height: 1.15 !important;
  white-space: normal !important;
  font-size: 12.5px !important;
}

html body header.nav .actions,
html body .actions{
  height: var(--umeed-nav-desktop-h) !important;
  min-height: var(--umeed-nav-desktop-h) !important;
  max-height: var(--umeed-nav-desktop-h) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 5px !important;
  padding: 0 !important;
  margin: 0 !important;
  flex: 0 0 auto !important;
  overflow: visible !important;
}

html body header.nav .actions .btn,
html body header.nav .actions .notice-bell,
html body header.nav .header-bell,
html body .actions .btn,
html body .actions .notice-bell,
html body .header-bell{
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  min-height: 30px !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 14px !important;
  line-height: 1 !important;
}

html body header.nav .actions .btn-primary,
html body .actions .btn-primary{
  width: auto !important;
  min-width: 58px !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  font-size: 14.5px !important;
  line-height: 1 !important;
}

html body header.nav .hamb,
html body .hamb{ display: none !important; }

html body main{ margin-top: 0 !important; padding-top: 0 !important; }
html body header.nav + .scrim + .drawer + main,
html body header.nav + main{ margin-top: 0 !important; padding-top: 0 !important; }

/* Mobile and narrow/tablet: logo-only, hide desktop menu, keep compact usable controls. */
@media (max-width: 1180px), (hover: none) and (pointer: coarse){
  :root{ --umeed-nav-desktop-h: 44px !important; --umeed-nav-mobile-h: 44px !important; }

  html body header.nav,
  html body .nav{
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
  }

  html body header.nav .container.navbar,
  html body header.nav .navbar,
  html body .navbar{
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    width: 100% !important;
    padding: 0 6px !important;
    gap: 5px !important;
  }

  html body header.nav .brand,
  html body .brand{
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    flex: 1 1 auto !important;
    max-width: none !important;
    gap: 0 !important;
  }

  html body header.nav .brandMark,
  html body .brandMark{
    width: 31px !important;
    height: 31px !important;
    min-width: 31px !important;
    flex-basis: 31px !important;
    border-radius: 9px !important;
  }

  html body header.nav .brandMark img,
  html body .brandMark img{
    width: 29px !important;
    height: 29px !important;
  }

  html body header.nav .brandName,
  html body .brandName,
  html body header.nav .brandSub,
  html body .brandSub{
    display: none !important;
  }

  html body header.nav .menu,
  html body .menu{
    display: none !important;
  }

  html body header.nav .actions,
  html body .actions{
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    gap: 4px !important;
    flex: 0 0 auto !important;
  }

  html body header.nav .hamb,
  html body .hamb{
    display: inline-flex !important;
  }

  html body header.nav .actions .btn,
  html body header.nav .actions .notice-bell,
  html body header.nav .header-bell,
  html body .actions .btn,
  html body .actions .notice-bell,
  html body .header-bell{
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
    font-size: 15px !important;
  }

  html body header.nav .actions .btn-primary,
  html body .actions .btn-primary{
    min-width: 52px !important;
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 9px !important;
    font-size: 14.5px !important;
  }

  html body .scrim{
    position: fixed !important;
    inset: 0 !important;
    z-index: 999998 !important;
  }

  html body .drawer{
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: min(88vw, 360px) !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 10px 12px 18px !important;
    z-index: 999999 !important;
    background: linear-gradient(145deg, rgba(7,9,14,.98), rgba(73,10,19,.95)) !important;
    border-left: 1px solid rgba(232,200,111,.22) !important;
  }

  html body .drawerTop{
    position: sticky !important;
    top: 0 !important;
    z-index: 2 !important;
    min-height: 42px !important;
    padding: 2px 0 8px !important;
    margin: 0 0 6px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    background: linear-gradient(180deg, rgba(7,9,14,.98), rgba(7,9,14,.76)) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
  }

  html body .drawer a{
    min-height: 40px !important;
    padding: 10px 11px !important;
    margin: 2px 0 !important;
    display: flex !important;
    align-items: center !important;
    border-radius: 12px !important;
    line-height: 1.15 !important;
    white-space: normal !important;
  }

  html body.drawer-open{ overflow: hidden !important; }
}

@media (max-width: 390px){
  html body header.nav .container.navbar,
  html body .navbar{ padding: 0 4px !important; gap: 3px !important; }
  html body header.nav .actions,
  html body .actions{ gap: 3px !important; }
  html body header.nav .actions .btn,
  html body header.nav .actions .notice-bell,
  html body header.nav .header-bell,
  html body .actions .btn,
  html body .actions .notice-bell,
  html body .header-bell{
    width: 30px !important; height: 30px !important; min-width: 30px !important; min-height: 30px !important;
  }
  html body header.nav .actions .btn-primary,
  html body .actions .btn-primary{ min-width: 48px !important; height: 32px !important; min-height: 32px !important; padding:0 7px!important; }
}