/* ============================================================================
   Styles propres à la page web des vrais comptes (/web/, app.devoxia.app).
   Gabarit recopié en public/web/web-comptes.css par preparer-web-comptes.mjs ;
   posé juste avant </head>, donc après app.css et appli-nuit.css, dont il
   l'emporte. Jamais embarqué dans l'APK.

   Compléments de page ajoutés au fil du lot (tâche 3 : bouton de Google).
   ============================================================================ */

/* Feuille « Continuer avec Google » (plateforme-web-comptes.js) : le bouton
   officiel de Google, centré, rendu dans ce conteneur. Hauteur réservée dès
   l'ouverture (44 px au moins, cible tactile) : la feuille ne saute pas quand
   le bouton arrive. */
.w-google {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  margin-top: 16px;
  /* Le cadre de Google est une page claire : sous color-scheme: dark
     (appli-nuit.css, sur <html>), le navigateur peint son fond OPAQUE, en
     blanc, d'où un cadre blanc autour du bouton sombre (iPhone, 07/11). En
     light, le fond du cadre reste transparent ; le bouton garde son thème
     filled_black, choisi par Google et non par ce réglage. */
  color-scheme: light;
}

/* Message de la feuille de Google (bouton qui ne vient pas) : caché vide. */
.w-google-souci {
  margin: 12px 0 0;
  text-align: center;
  font-weight: 600;
}
.w-google-souci:empty { display: none; }

/* Guide « écran d'accueil » (web-comptes.js) : liste numérotée des gestes de
   Safari, dans la feuille. Le retrait laisse la place au numéro. */
.w-guide-etapes {
  margin: 12px 0;
  padding-left: 22px;
}
.w-guide-etapes li { margin: 0 0 8px; }