/* Menu du header (v1.75.0).
   Les six entrées étaient auparavant six icônes alignées ; avec l'arrivée de
   la synchronisation bancaire, elles débordaient sur une seconde ligne et
   chevauchaient le wordmark sur téléphone. Un seul bouton les regroupe, et
   le menu redevient extensible sans repayer ce défaut à chaque ajout. */
.menu-anchor { position: relative; }

#menu-button { position: relative; font-size: 1.15rem; line-height: 1; }

/* Pastille discrète : quelque chose attend dans le menu (alerte ou réveil).
   Sans elle, replier les icônes ferait perdre le signal qu'elles portaient. */
#menu-badge {
  position: absolute;
  top: 0.1rem;
  right: 0.15rem;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 999px;
  background: #dc2626;
}

#app-menu {
  position: absolute;
  top: calc(100% + 0.35rem);
  right: 0;
  z-index: 30;
  min-width: 16.5rem;
  padding: 0.35rem;
  display: flex;
  flex-direction: column;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 14px;
  box-shadow: var(--shadow-pop);
}
#app-menu[hidden] { display: none; }

.menu-item {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  width: 100%;
  /* 44 px de haut : la cible tactile minimale tenue depuis v1.49. */
  min-height: 44px;
  padding: 0.5rem 0.7rem;
  background: none;
  border: none;
  border-radius: 10px;
  color: var(--text);
  font: inherit;
  font-size: 0.92rem;
  text-align: left;
  cursor: pointer;
}
.mi-icon { font-size: 1.05rem; line-height: 1; }
.mi-label { flex: 1; }

@media (hover: hover) {
  .menu-item:hover { background: var(--accent-soft); }
}
.menu-item:active { background: var(--accent-soft); }