/* Bandeau d'environnement (test) en haut de page, pleine largeur.
   Override volontaire de la règle #environnement définie dans global.min.css. */
#environnement{
	display:block;
	position:static;
	top:auto;
	right:auto;
	width:100%;
	background:#e67e22;
	color:#fff;
	text-align:center;
	text-transform:uppercase;
	letter-spacing:3px;
	font-size:.85em;
	font-weight:700;
	padding:5px 10px;
	opacity:1;
	z-index:100;
	font-family:'Roboto',sans-serif;
	box-shadow:0 1px 3px rgba(0,0,0,.2);
}

/* Toggles classic/moderne et clair/sombre — visibles dans tous les thèmes */
.theme-switcher{
	position:absolute;
	top:10px;
	right:50px;
	display:flex;
	gap:14px;
	align-items:center;
	font-family:'Roboto',sans-serif;
	font-size:.8em;
	color:#fff;
	z-index:20;
}
.theme-switcher .ts-group{display:flex;align-items:center;gap:6px;line-height:1}
.theme-switcher .ts-group[hidden]{display:none}
.theme-switcher .ts-label{
	text-transform:uppercase;
	letter-spacing:.5px;
	opacity:.9;
	user-select:none;
}
.theme-switcher .ts-toggle{
	position:relative;
	width:38px;
	height:20px;
	background:rgba(0,0,0,.35);
	border:1px solid rgba(255,255,255,.45);
	border-radius:20px;
	cursor:pointer;
	transition:background .2s ease,border-color .2s ease,opacity .2s ease;
	flex-shrink:0;
}
.theme-switcher .ts-toggle::before{
	content:"";
	position:absolute;
	top:1px;
	left:1px;
	width:16px;
	height:16px;
	background:#fff;
	border-radius:50%;
	transition:left .2s ease,background .2s ease;
	box-shadow:0 1px 2px rgba(0,0,0,.3);
}
.theme-switcher .ts-toggle.is-on{background:#73482a;border-color:#73482a}
.theme-switcher .ts-toggle.is-on::before{left:19px}
.theme-switcher .ts-toggle.is-disabled{opacity:.35;cursor:not-allowed}
.theme-switcher .ts-toggle:focus{outline:2px solid rgba(255,255,255,.6);outline-offset:2px}
.theme-switcher .ts-toggle:focus:not(:focus-visible){outline:none}

/* Adaptation en mode moderne : couleurs depuis les variables CSS */
html.theme-modern .theme-switcher{color:var(--text)}
html.theme-modern .theme-switcher .ts-toggle{
	background:var(--surface-2);
	border-color:var(--border);
}
html.theme-modern .theme-switcher .ts-toggle::before{background:var(--surface)}
html.theme-modern .theme-switcher .ts-toggle.is-on{
	background:var(--accent);
	border-color:var(--accent);
}
html.theme-modern .theme-switcher .ts-toggle.is-on::before{background:#fff}

/* Responsive : sur petits écrans, on bascule sous la barre */
@media (max-width:991px){
	.theme-switcher{
		position:relative;
		top:auto;
		right:auto;
		justify-content:flex-end;
		padding:6px 12px;
	}
}
