/* ============================================================
   mobile-fixes.css — petites corrections mobile, chargé EN DERNIER.
   Ajouté le 27/06/2026. 100% réversible (suffit de retirer ce fichier).
   ------------------------------------------------------------
   1) Anti-zoom iOS : tout champ < 16px fait zoomer l'iPhone au focus.
      On force 16px UNIQUEMENT sur petit écran (le bureau ne change pas).
   ============================================================ */
@media (max-width: 768px) {
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]),
  textarea,
  select {
    font-size: 16px !important;
  }
}

/* 2) Page Voyageurs : la mise en page figée à 3 colonnes (220px | 1fr | 300px)
      débordait sur téléphone. On empile en 1 colonne, contenu (la grille) en
      premier, le Gardien en dernier. Le bureau ne change pas. */
@media (max-width: 900px) {
  .voyageurs-layout {
    grid-template-columns: 1fr !important;
  }
  .voyageurs-layout > main {
    order: -1;
  }
  /* (23/07) La colonne de droite (Gardien + Suggestions + pub) était en position:sticky :
     une fois empilée sur mobile, la pub « Sponsorisé » chevauchait les suggestions.
     On la remet en flux normal → plus de chevauchement. Vérifié sur le vrai tél (384px). */
  .voyageurs-layout aside .adm-card {
    position: static !important;
    top: auto !important;
  }
  /* (23/07, demande Julien) Sur mobile : masquer le GROS bloc Gardien (colonne de droite,
     avec ses suggestions) et afficher à la place le PETIT Gardien remonté sous le bloc Voyageurs. */
  .voyageurs-layout aside:last-of-type .adm-card { display: none !important; }
  .voy-gardien-top { display: block !important; }
  /* (23/07, demande Julien) Autour de moi (Radar) : la pub sous « Proximité » s'étend sur les
     2 colonnes → jusqu'au bord droit du bloc « Communauté ». */
  .am-col:not(.am-col-radar) > .ad-slot-wrap { grid-column: 1 / -1 !important; }
}

/* (23/07, demande Julien) Cartes de stats (Phares allumés / Envie de balade / Discussion /
   Entraide) sur téléphone : grille 2×2 compacte + plus petites. */
@media (max-width: 560px) {
  .adm-kpi-row { grid-template-columns: 1fr 1fr !important; gap: 10px !important; }
  .adm-kpi { padding: 11px 12px !important; gap: 10px !important; }
  .adm-kpi-ic { width: 36px !important; height: 36px !important; border-radius: 10px !important; }
  .adm-kpi-ic svg { width: 16px !important; height: 16px !important; }
  .adm-kpi-label { font-size: 10px !important; }
  .adm-kpi-value { font-size: 20px !important; }
}

/* 3) Barre du bas mobile : onglet « Plus » + panneau des sections absentes
      (Accueil, Feu de camp, Voyages, Sorties, Carnet, Classement, Sécurité).
      Ajout, n'enlève rien aux 5 onglets existants. */
.bn-more-sheet[hidden], .bn-more-backdrop[hidden] { display: none !important; }
.bottom-nav button.bn-more-toggle {
  background: none; border: 0; cursor: pointer; font: inherit;
}
.bn-more-backdrop {
  position: fixed; inset: 0; z-index: 58; background: rgba(4, 10, 22, 0.55);
}
.bn-more-sheet {
  position: fixed; left: 8px; right: 8px; bottom: 84px; z-index: 62;
  background: #0e1b30; border: 1px solid rgba(61, 169, 252, 0.30);
  border-radius: 16px; padding: 12px; box-shadow: 0 16px 44px rgba(0, 0, 0, 0.55);
}
.bn-more-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px;
}
.bn-more-item {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  padding: 13px 6px; border-radius: 12px; text-decoration: none;
  color: #e9eff8; background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(61, 169, 252, 0.15);
  font-size: 12px; text-align: center; line-height: 1.15;
}
.bn-more-item svg { width: 23px; height: 23px; }
.bn-more-item:hover, .bn-more-item:active { background: rgba(61, 169, 252, 0.14); }
