/* mobile.css - règles générales smartphone pour tout l'espace privé (chargé en dernier dans commun/head.php).
   Ne s'applique qu'aux écrans étroits : l'affichage PC n'est pas modifié. */

@media (max-width: 800px) {

	/* la taille des blocs inclut padding et bordures */
	*, *::before, *::after { box-sizing: border-box; }

	html, body { max-width: 100%; overflow-x: hidden; }
	body { -webkit-text-size-adjust: 100%; }

	/* images : jamais plus larges que l'écran */
	img { max-width: 100%; height: auto; }

	/* fenêtre bleue de bas de page : inutile sur smartphone */
	#bas { display: none !important; }

	/* conteneur principal : pleine largeur */
	#wrap { width: auto !important; max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }

	/* champs de saisie : 16 px minimum (sinon iOS zoome à la saisie) et taille de touche confortable */
	input[type="text"], input[type="password"], input[type="email"], input[type="tel"],
	input[type="number"], input[type="date"], input[type="search"], select, textarea {
		font-size: 16px; max-width: 100%;
	}
	input[type="submit"], input[type="button"], button { min-height: 40px; }

	/* en-tête (titre_affich_perso.php) : nom de la chorale, puis salut / aide / déconnexion, puis titre ; plus de flottants */
	#page-name, #page-name-perso { width: 100% !important; height: auto !important; padding: 4px 8px; border-radius: 0; }
	#logo { float: none; display: block; font-size: 1.3em; border-radius: 12px; box-shadow: 2px 2px 3px #555; margin-bottom: 4px; }
	#numecran { float: none; display: block; font-size: .85em; border-radius: 8px; padding: 2px 4px; line-height: 1.8; }
	/* « Bonjour Prénom Nom », ? et Déconnexion sur une seule ligne ; le nom est tronqué (…) s'il est trop long */
	#numecran { display: flex; align-items: center; justify-content: center; gap: 6px; white-space: nowrap; }
	#numecran .bonjour { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
	#numecran .br-deco { display: none; }
	#numecran input[type="button"] { flex: none; min-height: 32px; padding: 0 10px; font-size: 14px; }
	#numecran .numecr { display: none; }   /* numéro d'écran : inutile sur smartphone */
	#page-name h2, #page-name-perso h2 { font-size: 125%; padding: 4px 0; }
}
