/* Styles spécifiques à lapinou.maxou.pro (en complément de main.css) */

/* Sélecteur de langue */
#lang-switcher { position: relative; display: inline-block; float: right; margin: 1.5em 0 0 0; z-index: 10000; }
#lang-switcher button { background: none; border: none; cursor: pointer; font-size: 1.6em; line-height: 1; padding: 4px 8px; }
#lang-switcher .lang-menu { display: none; position: absolute; right: 0; top: 100%; background: #fff; border: 1px solid #ddd; border-radius: 6px; box-shadow: 0 4px 16px rgba(0,0,0,0.15); min-width: 180px; max-height: 320px; overflow-y: auto; padding: 6px 0; }
#lang-switcher.open .lang-menu { display: block; }
#lang-switcher .lang-menu a { display: flex; align-items: center; gap: 8px; padding: 8px 14px; color: #333; text-decoration: none; font-size: 0.95em; white-space: nowrap; }
#lang-switcher .lang-menu a:hover { background: #f2f2f2; }
#lang-switcher .lang-menu a.active { font-weight: bold; background: #f7f7f7; }
#lang-switcher .lang-menu .flag { font-size: 1.2em; }
[dir="rtl"] #lang-switcher { float: left; }
[dir="rtl"] #lang-switcher .lang-menu { right: auto; left: 0; }

/* Logo du jeu dans l'en-tête */
#logo a { color: inherit; }

/* Tuiles des 4 jeux (couleurs de l'application : prairie, et espace pour l'Attaque alien) */
.tool-tile {
	display: flex; align-items: center; justify-content: center;
	height: 160px; border-radius: 6px; margin-bottom: 1.5em;
	font-size: 4em; text-decoration: none; border-bottom: 0;
	background: radial-gradient(circle at 50% 40%, #1F4A2E 0%, #0F1A14 75%);
	transition: transform 0.2s ease;
}
.tool-tile:hover { transform: translateY(-3px); }
.tool-tile.hunt  { color: #FFA94D; }
.tool-tile.mole  { color: #D9B47F; }
.tool-tile.water { color: #4FC3F7; }
.tool-tile.alien { color: #76FF03; background: radial-gradient(circle at 50% 40%, #241650 0%, #0B1030 75%); }

/* Liste détaillée (page du jeu) */
.tool-list { list-style: none; padding: 0; margin: 0 0 2em 0; }
.tool-list > li { display: flex; gap: 1em; align-items: flex-start; padding: 1em 0; border-top: 1px solid #e5e5e5; }
.tool-list > li:first-child { border-top: 0; }
.tool-list .tool-icon {
	flex: 0 0 3em; height: 3em; border-radius: 10px;
	display: flex; align-items: center; justify-content: center; font-size: 1.3em;
	background: #18271F;
}
.tool-list .tool-icon.hunt   { color: #FFA94D; }
.tool-list .tool-icon.mole   { color: #D9B47F; }
.tool-list .tool-icon.water  { color: #4FC3F7; }
.tool-list .tool-icon.alien  { color: #76FF03; background: #0B1030; }
.tool-list .tool-icon.burrow { color: #9C7149; }
.tool-list .tool-icon.tap    { color: #F2F6F2; }
.tool-list .tool-icon.child  { color: #FF5A52; }
.tool-list .tool-icon.one    { color: #E53935; }
.tool-list .tool-icon.time   { color: #FFD54F; }
.tool-list h4 { margin: 0 0 0.25em 0; font-weight: bold; }
.tool-list p { margin: 0; }

/* Barème des points */
.points-list { list-style: none; padding: 0; margin: 0 0 2em 0; }
.points-list li { display: flex; gap: 1em; align-items: center; padding: 0.6em 0; border-top: 1px solid #e5e5e5; }
.points-list li:first-child { border-top: 0; }
.points-value { flex: 0 0 5.5em; text-align: center; padding: 0.35em 0; border-radius: 8px; font-weight: bold; background: #18271F; white-space: nowrap; }
.points-value.good { color: #7BD66B; }
.points-value.gold { color: #FFD54F; }
.points-value.bad  { color: #FF5A52; }

/* Tableau des jeux */
.table-wrapper { overflow-x: auto; margin: 0 0 2em 0; }
.mode-table { width: 100%; border-collapse: collapse; }
.mode-table th, .mode-table td { padding: 0.6em 0.8em; text-align: center; border-bottom: 1px solid #e5e5e5; }
.mode-table th { background: #18271F; color: #F2F6F2; font-weight: bold; }
.mode-table td:first-child { font-weight: bold; }

/* Encadré de téléchargement */
.download-box { background: #FFF4E5; border: 1px solid #FFD1A1; border-radius: 8px; padding: 1.5em; margin: 1.5em 0; }
.download-box p:last-child { margin-bottom: 0; }
.highlight-yellow { background-color: yellow; }

/* Encadré « Contenus familiaux » */
.family-box { border: 2px solid #34A853; border-radius: 8px; padding: 1.2em 1.5em; margin: 2em 0; background: #F1F8F3; }
.family-box p:last-child { margin-bottom: 0; }

/* Logo carré dans la barre latérale */
.app-logo-side { display: block; max-width: 160px; margin: 0 auto 1em auto; border-radius: 22%; }