/* =======================================================
   MOBILE BURGER (FINAL POLISHED)
   - Semi rounded border
   - Toggle icon (bars <-> close)
   - No shadow
   ======================================================= */

:root{
  --topbar-h: 100px;
}

#mobile-menu-btn{
  position: absolute !important;
  top: 50% !important;
  right: 14px !important;
  transform: translateY(-50%) !important;

  width: 42px !important;
  height: 42px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important; /* ✅ semi-round */
  padding: 0 !important;
  margin: 0 !important;

  box-shadow: none !important;
  cursor: pointer !important;

  z-index: 1001 !important;
  -webkit-tap-highlight-color: transparent !important;
}

#mobile-menu-btn i{
  font-size: 20px !important;
  line-height: 1 !important;
  pointer-events: none !important;
  color: #111827 !important;
}

/* active state (menu open) */
body.menu-open #mobile-menu-btn{
  background: #f9fafb !important;
  border-color: #d1d5db !important;
}

/* overlay */
#mobile-overlay{
  position: fixed !important;
  inset: 0 !important;
  background: rgba(0,0,0,.45) !important;
  z-index: 1100 !important;
  display: none !important;
}
#mobile-overlay[aria-hidden="false"]{ display:block !important; }

/* sidebar */
@media (max-width: 900px){
  #sidebar{
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 280px !important;
    max-width: 86vw !important;
    height: 100vh !important;
    background: #fff !important;
    z-index: 1200 !important;

    transform: translateX(-100%) !important;
    transition: transform .25s ease !important;
    overflow-y: auto !important;

    padding-top: var(--topbar-h) !important;
  }

  body.menu-open #sidebar,
  #sidebar.open{
    transform: translateX(0) !important;
  }
}

@media (min-width: 901px){
  #mobile-menu-btn{ display:none !important; }
}
