/* Shared hamburger dropdown menu — used by any page that includes
   templates/_hamburger_menu.html. Pairs with static/js/common.js for the
   toggle functions (toggleHamburger, toggleWeatherGuides, toggleBajaBash,
   closeHamburger). */
.hamburger-btn {
  background: #1a2d40;
  border: 1px solid #2a3f55;
  color: #7ec8e3;
  font-size: 18px;
  font-weight: 400;
  padding: 4px 10px;
  border-radius: 5px;
  cursor: pointer;
  transition: all 0.15s;
  line-height: 1;
  flex-shrink: 0;
}
.hamburger-btn:hover { background: #243d55; border-color: #7ec8e3; }
.hamburger-wrap { position: relative; }
.hamburger-dropdown {
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  background: #1a2d40;
  border: 1px solid #2a3f55;
  border-radius: 8px;
  min-width: 190px;
  z-index: 10000;
  box-shadow: 0 8px 24px rgba(0,0,0,0.5);
  padding: 6px 0;
}
.hamburger-dropdown.open { display: block; }
.hm-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 16px;
  font-size: 0.82rem;
  color: #c8dce8;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.12s;
  white-space: nowrap;
}
.hm-item:hover { background: #243d55; color: #fff; }
.hm-item .hm-icon { width: 16px; text-align: center; font-size: 14px; }
.hm-divider { border: none; border-top: 1px solid #2a3f55; margin: 4px 0; }
.hm-menu-label {
  padding: 6px 16px 2px;
  font-size: 0.68rem;
  color: #5a7a90;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}