/* Borne ITG – Calendrier de présence. Couleurs reprises de la palette Astra quand elle existe. */

.borne-cal {
	--bc-accent: var(--ast-global-color-0, #0067ff);
	--bc-accent-fonce: var(--ast-global-color-1, #005ee9);
	--bc-texte: var(--ast-global-color-2, #0f172a);
	--bc-texte-doux: var(--ast-global-color-3, #364151);
	--bc-fond: var(--ast-global-color-4, #fff);
	--bc-fond-doux: var(--ast-global-color-5, #e7f6ff);
	--bc-bord: var(--ast-global-color-7, #d1dae5);
	--bc-note: #f59e0b;
	--bc-rayon: 8px;

	container-type: inline-size;
	color: var(--bc-texte);
	max-width: 900px;
	margin: 0 auto 2em;
	transition: opacity .15s;
}

.borne-cal.bc-occupe { opacity: .6; pointer-events: none; }

/* Neutralise les styles de boutons du thème. */
.borne-cal button {
	margin: 0;
	font: inherit;
	line-height: 1.2;
	text-transform: none;
	letter-spacing: normal;
	box-shadow: none;
	cursor: pointer;
}
.borne-cal button:disabled { cursor: default; }
.borne-cal button:focus-visible,
.borne-cal select:focus-visible,
.borne-cal input:focus-visible {
	outline: 2px solid var(--bc-accent);
	outline-offset: 2px;
}

/* ---------- En-tête ---------- */

.bc-entete {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .5em;
	margin-bottom: .75em;
}
.bc-titre { margin: 0; font-size: 1.3em; text-align: center; flex: 1; }
.borne-cal .bc-nav {
	width: 2.4em;
	height: 2.4em;
	padding: 0;
	border: 1px solid var(--bc-bord);
	border-radius: 50%;
	background: var(--bc-fond);
	color: var(--bc-texte);
	font-size: 1.1em;
}
.borne-cal .bc-nav:hover:not(:disabled) { background: var(--bc-fond-doux); color: var(--bc-texte); }
.borne-cal .bc-nav:disabled { opacity: .3; }

.bc-lieu {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: .1em .35em;
	margin: -.25em 0 .9em;
	font-size: .9em;
	color: var(--bc-texte-doux);
	text-align: center;
}
.bc-lieu svg { flex: none; color: var(--bc-accent); }
.bc-lieu a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }

.bc-annonce {
	margin: 0 0 .9em;
	padding: .55em .8em;
	border-radius: var(--bc-rayon);
	background: var(--bc-fond-doux);
	color: var(--bc-texte);
	text-align: center;
}

/* ---------- Grille ---------- */

.bc-grille {
	display: grid;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	gap: 4px;
}
.bc-jsem {
	text-align: center;
	font-size: .75em;
	text-transform: uppercase;
	color: var(--bc-texte-doux);
	padding-bottom: .25em;
}

.borne-cal .bc-jour {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	min-height: 3.4em;
	padding: .3em .35em;
	border: 1px solid var(--bc-bord);
	border-radius: var(--bc-rayon);
	background: var(--bc-fond);
	color: var(--bc-texte);
	text-align: left;
	overflow: hidden;
}
.borne-cal .bc-jour:hover { background: var(--bc-fond-doux); color: var(--bc-texte); }

.borne-cal .bc-jour.bc-ferme {
	border-color: transparent;
	background: transparent;
	color: var(--bc-texte-doux);
	opacity: .55;
}
.borne-cal .bc-jour.bc-n1 { background: color-mix(in srgb, var(--bc-accent) 12%, var(--bc-fond)); }
.borne-cal .bc-jour.bc-n2 { background: color-mix(in srgb, var(--bc-accent) 28%, var(--bc-fond)); }
.borne-cal .bc-jour.bc-n3 { background: color-mix(in srgb, var(--bc-accent) 48%, var(--bc-fond)); }
.borne-cal .bc-jour.bc-passe { opacity: .45; }
.borne-cal .bc-jour.bc-moi { box-shadow: inset 0 0 0 2px var(--bc-accent); }
.borne-cal .bc-jour.bc-selection { outline: 2px solid var(--bc-texte); outline-offset: 1px; }

.bc-num { font-weight: 600; font-size: .9em; line-height: 1.6; }
.bc-aujourdhui .bc-num {
	display: inline-block;
	min-width: 1.6em;
	border-radius: 1em;
	background: var(--bc-texte);
	color: var(--bc-fond);
	text-align: center;
}
.bc-avec-note::after {
	content: "";
	position: absolute;
	top: .35em;
	right: .35em;
	width: .45em;
	height: .45em;
	border-radius: 50%;
	background: var(--bc-note);
}

.bc-compte {
	margin-top: auto;
	align-self: flex-end;
	min-width: 1.5em;
	padding: 0 .35em;
	border-radius: 1em;
	background: var(--bc-accent);
	color: #fff;
	font-size: .72em;
	font-weight: 700;
	line-height: 1.5;
	text-align: center;
}
.bc-noms { display: none; }

/* Assez de place : on affiche les pseudos dans les cases. */
@container (min-width: 620px) {
	.borne-cal .bc-jour { min-height: 5.6em; }
	.bc-noms {
		display: block;
		width: 100%;
		margin-top: .15em;
		font-size: .72em;
		line-height: 1.3;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.bc-compte {
		position: absolute;
		top: .35em;
		right: .35em;
		margin: 0;
	}
	.bc-avec-note::after { top: auto; bottom: .4em; }
}

/* ---------- Légende ---------- */

.bc-legende {
	display: flex;
	flex-wrap: wrap;
	gap: .4em 1em;
	margin: .6em 0 1.2em;
	font-size: .78em;
	color: var(--bc-texte-doux);
}
.bc-legende span { display: inline-flex; align-items: center; gap: .35em; }
.bc-pastille {
	display: inline-block;
	width: .95em;
	height: .95em;
	border-radius: 3px;
	border: 1px solid var(--bc-bord);
	background: var(--bc-fond);
}
.bc-pastille.bc-ferme { border-style: dashed; background: transparent; }
.bc-pastille.bc-n2 { background: color-mix(in srgb, var(--bc-accent) 28%, var(--bc-fond)); }
.bc-pastille.bc-moi { box-shadow: inset 0 0 0 2px var(--bc-accent); }

/* ---------- Détail d'un jour ---------- */

.bc-detail {
	padding: 1em;
	border: 1px solid var(--bc-bord);
	border-radius: var(--bc-rayon);
	background: var(--bc-fond);
	scroll-margin-top: 90px;
}
.bc-detail-titre { margin: 0 0 .2em; font-size: 1.15em; }
.bc-horaires, .bc-resume, .bc-aide, .bc-vide-msg { margin: 0 0 .8em; color: var(--bc-texte-doux); }
.bc-resume { color: var(--bc-texte); }

.bc-timeline { margin: 0 0 1em; font-size: .9em; }
.bc-echelle, .bc-pres {
	display: grid;
	grid-template-columns: minmax(4.5em, 8em) 1fr 2em;
	align-items: center;
	gap: .5em;
}
.bc-echelle { height: 1.3em; }
.bc-echelle .bc-piste { position: relative; height: 100%; }
.bc-graduation {
	position: absolute;
	transform: translateX(-50%);
	font-size: .75em;
	color: var(--bc-texte-doux);
}
.bc-liste { list-style: none; margin: 0; padding: 0; }
.bc-pres { padding: .2em 0; }
.bc-pseudo { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bc-pres-moi .bc-pseudo { font-weight: 700; }
.bc-pres .bc-piste {
	position: relative;
	height: 1.5em;
	border-radius: 4px;
	background: var(--bc-fond-doux);
}
.bc-barre {
	position: absolute;
	top: 0;
	bottom: 0;
	border-radius: 4px;
	background: var(--bc-accent);
	color: #fff;
	font-size: .75em;
	line-height: 2em;
	padding: 0 .4em;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.bc-pres-moi .bc-barre { background: var(--bc-accent-fonce); box-shadow: inset 0 0 0 2px rgba(0, 0, 0, .25); }

.borne-cal .bc-suppr {
	width: 1.8em;
	height: 1.8em;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--bc-texte-doux);
}
.borne-cal .bc-suppr:hover { background: #fde2e2; color: #b91c1c; }

/* ---------- Formulaire ---------- */

.bc-form, .bc-inscrit {
	padding-top: .9em;
	border-top: 1px solid var(--bc-bord);
}
.bc-inscrit p { margin: 0 0 .7em; }
.bc-form { display: flex; flex-wrap: wrap; gap: .6em; align-items: flex-end; }
.borne-cal .bc-form .bc-form-titre { flex-basis: 100%; margin: 0; font-weight: 700; }
.bc-champ { display: flex; flex-direction: column; gap: .2em; flex: 1 1 6em; font-size: .85em; }
.borne-cal .bc-champ > span { color: var(--bc-texte-doux); } /* Le thème colore les <label>. */
.bc-champ-pseudo { flex: 1 1 100%; }
.bc-champ input, .bc-champ select {
	width: 100%;
	min-height: 2.6em;
	padding: .4em .6em;
	border: 1px solid var(--bc-bord);
	border-radius: 6px;
	background: var(--bc-fond);
	color: var(--bc-texte);
	font-size: 16px; /* Évite le zoom automatique sur iOS. */
}
.bc-form-actions { flex: 1 1 100%; }
@container (min-width: 620px) {
	.bc-champ-pseudo { flex: 2 1 12em; }
	.bc-form-actions { flex: 0 0 auto; }
}

.borne-cal .bc-bouton {
	display: inline-block;
	padding: .65em 1.2em;
	border: 1px solid var(--bc-accent);
	border-radius: 6px;
	background: var(--bc-accent);
	color: #fff;
	font-weight: 600;
	text-decoration: none;
}
.borne-cal .bc-bouton:hover { background: var(--bc-accent-fonce); border-color: var(--bc-accent-fonce); color: #fff; }
.borne-cal .bc-bouton.bc-secondaire { background: transparent; color: var(--bc-texte); border-color: var(--bc-bord); }
.borne-cal .bc-bouton.bc-secondaire:hover { background: var(--bc-fond-doux); color: var(--bc-texte); }

.bc-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.bc-msg { margin: 0 0 .8em; padding: .6em .8em; border-radius: 6px; }
.bc-ok { background: #dcfce7; color: #14532d; }
.bc-erreur { background: #fde2e2; color: #7f1d1d; }
.bc-chargement { color: var(--bc-texte-doux); }