/* CSS 2 */
/* (Version) By sync - Boulette (V6.0.0)
	Jeu du Serpent (Snake)
*/
/* Définition de la police pour une meilleure esthétique
	// @import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap'); */
	/* ?? CORRECTION #1 : Renommage de l'ID du slider de volume du son du jeu */

#zenVolumeSlider { /* Anciennement zenVolume */
	width: 100px; /* Barre plus courte */
	margin-left: 8px;
	vertical-align: middle;
}

/* ?? CORRECTION #1 : Remplacement de zenVolumeInput par le nouveau nom */
#zenVolumeSlider {
	font-family: Arial, sans-serif;
	font-size: 12px; /* Police plus petite */
	padding: 4px 10px; /* Moins de padding */
	border: none;
	border-radius: 6px; /* Un peu moins arrondi */
	cursor: pointer;
	background: #e0e0e0;
	transition: background 0.3s, color 0.3s;
	color: #222;
	margin-right: 8px;
}

/* Le reste du style pour la musique zen reste inchangé */
#Music_ZenBtn {
	font-family: Arial, sans-serif;
	font-size: 12px; /* Police plus petite */
	padding: 4px 10px; /* Moins de padding */
	border: none;
	border-radius: 6px; /* Un peu moins arrondi */
	cursor: pointer;
	background: #e0e0e0;
	transition: background 0.3s, color 0.3s;
	color: #222;
	margin-right: 8px;
}

#Music_ZenBtn.on {
	background: linear-gradient(90deg, #ff4444, #ffffff);
	color: #222;
}

#Music_ZenBtn.off {
	background: #ccc;
	color: #888;
}

input[type="range"] {
	width: 100px; /* Barre plus courte */
	margin-left: 8px;
	vertical-align: middle;
}

select {
	margin-top: 0;
	font-family: Arial, sans-serif;
	padding: 4px 8px;
	border-radius: 6px;
	border: 1px solid #2ecc71; /* Bordure verte */
	font-size: 12px;
	vertical-align: middle;
	background-color: #669966; /* Fond gris clair */
	color: #222222; /* Texte noir foncé */
	transition: background-color 0.3s, color 0.3s;
}

/* Couleur au focus */
select:focus {
	font-family: Arial, sans-serif;
	background-color: #d1d8dc; /* Gris un peu plus foncé au focus */
	color: #222222; /* Toujours texte noir */
	outline: none;
	box-shadow: 0 0 5px #2ecc71; /* Ombre verte */
}

/* Container placé en haut et centré horizontalement */
.Music_ZenBtn-container {
	position: fixed; /* Fixé en haut */
	font-family: Arial, sans-serif;
	top: 10px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	flex-wrap: nowrap; /* Pas de retour à la ligne */
	align-items: center;
	gap: 8px;
	overflow:hidden; box-shadow:0 0 12px rgba(0,0,0,0.3);
	padding: 6px 12px;
	border-radius: 10px;
	box-shadow: 0 2px 8px rgba(0,0,0,0.5);
	z-index: 1000; /* Toujours devant */
}
	/* Ajout style pour le volume */
	#volumeInput { /* Volume du jeu */
		width: 100px;
		height: 25px;
		vertical-align: middle;
		margin-left: 10px;
		opacity: 0.5;
		transition: opacity 0.3s;
	}
	#volumeInput:enabled {
		opacity: 1;
		cursor: pointer;
	}

/* Style pour le message iOS/Tablette */
#iosInfo {
	position: fixed;
	bottom: 20px; /* À 20px du bas */
	left: 50%;
	transform: translateX(-50%); /* Centrage horizontal parfait */
	background-color: rgba(34, 39, 46, 0.9); /* Fond sombre semi-transparent */
	padding: 10px 15px;
	border-radius: 8px;
	z-index: 10000;
	text-align: center;
	font-size: 0.7rem;
	/* Animation d'estompage */
	opacity: 1;
	transition: opacity 1s ease-in-out; /* Transition de 1 seconde pour l'estompage */
	pointer-events: none; /* Permet de cliquer à travers pour ne pas bloquer le jeu */
	/* SUPPRESSION DE white-space: nowrap; POUR PERMETTRE LES SAUTS DE LIGNE */
}

#iosInfo.hidden {
	opacity: 0;
}

/* FIN CSS */