/* Plan de classe : même vert que le reste du site */
#features.pl-section { padding-top: 1em; }
.pl-section [hidden] { display: none !important; }

.pl-onglets { display: flex; justify-content: center; gap: .6em; margin: 0 0 1.2em 0; flex-wrap: wrap; }
.pl-onglet {
	font: inherit; padding: .55em 1.6em; border-radius: 2em; cursor: pointer; -webkit-appearance: none; appearance: none;
	border: 2px solid #e5e5e5; color: #878787 !important; background: #fff !important; text-shadow: none; width: auto !important;
	transition: background-color .25s, border-color .25s, color .25s;
}
.pl-onglet:hover { border-color: #5cc79a; color: #16855a !important; }
.pl-onglet.actif, .pl-onglet.actif:hover { background: #16855a !important; border-color: #16855a; color: #fff !important; }

.pl-grille { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.2em; align-items: start; max-width: 75em; margin: 0 auto; }
.pl-cote { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.6em; align-items: start; }
.pl-cote.tables { grid-template-columns: minmax(0, 1fr); }
.pl-cote.tables .pl-actions { flex-direction: row; flex-wrap: wrap; }
.pl-cote.tables .pl-actions .button { width: auto !important; }
.pl-carte { background: #fff; border: 2px solid #e5e5e5; border-radius: 1.2em; padding: 1.2em; text-align: left; }

.pl-barre { display: flex; gap: .8em; align-items: center; flex-wrap: wrap; margin-bottom: .8em; }
.pl-titre { flex: 0 1 14em; width: auto !important; font-weight: 700; color: #16855a !important; }
.pl-aide { flex: 1 1 14em; font-size: .85em; color: #878787; }

.pl-salle { --nc: 8; display: flex; flex-direction: column; gap: .8em; }
.pl-salle.retourne { flex-direction: column-reverse; }
.pl-tableau { text-align: center; background: #3d5a4c; color: #fff; border-radius: .5em; padding: .45em; font-size: .85em; letter-spacing: 2px; text-transform: uppercase; }
.pl-plan { display: grid; gap: .45em; container-type: inline-size; }
.pl-plan > div { min-height: 3.4em; min-width: 0; }
.pl-place, .pl-vide { border-radius: .6em; }
.pl-place {
	display: flex; align-items: center; justify-content: center; text-align: center; padding: .2em .15em; box-sizing: border-box;
	background: #f5faf7; border: 2px dashed #9bd8bd; color: #16855a; font-weight: 700; line-height: 1.15; font-size: clamp(.72rem, calc(100cqw / var(--nc) / 7.5), 1.05rem);
	overflow-wrap: break-word; word-break: normal; hyphens: manual; cursor: pointer; transition: background-color .15s, border-color .15s;
}
.pl-place.pris { background: #eaf7f1; border: 2px solid #16855a; }
.pl-place:hover, .pl-place.survol { border-color: #16855a; background: #dcf2e7; }
.pl-place.choisi { background: #16855a; color: #fff; border-color: #16855a; }
.pl-vide.editable { border: 2px dotted #e5e5e5; cursor: pointer; }
.pl-vide.editable:hover { border-color: #5cc79a; background: #f5faf7; }

.pl-outils { display: flex; flex-wrap: wrap; align-items: center; gap: .5em; margin-top: 1em; padding-top: 1em; border-top: 2px solid #e5e5e5; }
.pl-outils-titre { font-size: .85em; color: #878787; margin-right: .2em; }
.pl-taille { display: flex; align-items: center; gap: .4em; margin-left: auto; font-size: .85em; color: #878787; flex-wrap: wrap; }
.pl-taille strong { min-width: 1.3em; text-align: center; color: #16855a; font-size: 1.1em; }
.pl-mini, .pl-pm {
	font: inherit; cursor: pointer; -webkit-appearance: none; appearance: none; text-shadow: none; width: auto !important;
	border: 2px solid #5cc79a; color: #16855a !important; background: #fff !important; transition: background-color .25s, color .25s;
}
.pl-mini { padding: .3em .9em; border-radius: 2em; font-size: .85em; letter-spacing: 0; text-transform: none; }
.pl-pm { width: 2em !important; height: 2em; padding: 0 !important; border-radius: 50%; line-height: 1; display: inline-flex; align-items: center; justify-content: center; letter-spacing: 0; }
.pl-mini:hover, .pl-pm:hover { background: #16855a !important; color: #fff !important; }

.pl-etiquette { display: block; margin: .9em 0 .3em 0; font-size: .85em; color: #878787; }
.pl-cote .pl-etiquette:first-child, #bloc-eleves > .pl-etiquette:first-child { margin-top: 0; }
.pl-carte input[type="text"], .pl-carte select, .pl-carte textarea {
	width: 100%; font: inherit; padding: .5em .7em; border: 2px solid #e5e5e5; border-radius: .6em; background: #fff; color: #555; box-sizing: border-box;
}
.pl-carte textarea { resize: vertical; min-height: 7em; }
.pl-carte input:focus, .pl-carte select:focus, .pl-carte textarea:focus { outline: none; border-color: #16855a; }
.pl-info { margin: .4em 0 0 0; font-size: .85em; color: #16855a; font-weight: 700; }
.pl-info.alerte { color: #c0562b; }
.pl-conseil { font-size: .9em; color: #666; margin: 0 0 .6em 0; }

.pl-pool-titre { margin: 1em 0 .4em 0; font-size: .85em; color: #878787; }
.pl-pool { display: flex; flex-wrap: wrap; gap: .4em; min-height: 3em; padding: .5em; border: 2px dashed #e5e5e5; border-radius: .8em; max-height: 18em; overflow: auto; }
.pl-pool.survol { border-color: #16855a; background: #f5faf7; }
.pl-vide-msg { font-size: .85em; color: #878787; }
.pl-chip {
	font: inherit; font-size: .85em; padding: .3em .8em; border-radius: 2em; cursor: grab; -webkit-appearance: none; appearance: none; width: auto !important;
	border: 2px solid #5cc79a; color: #16855a !important; background: #eaf7f1 !important; letter-spacing: 0; text-transform: none; text-shadow: none; line-height: 1.2; height: auto;
}
.pl-chip:hover { background: #dcf2e7 !important; }
.pl-chip.choisi { background: #16855a !important; color: #fff !important; border-color: #16855a; }

.pl-actions { display: flex; flex-direction: column; gap: .5em; margin-top: 1em; }
.pl-actions .button { margin: 0; flex: none; width: 100% !important; box-sizing: border-box; text-align: center; padding: .85em 1em; height: auto; line-height: 1.4; font-size: .8em; letter-spacing: 1px; }
.pl-case { display: block; margin: .8em 0 0 0; font-size: .85em; color: #666; cursor: pointer; }
.pl-case input { margin-right: .4em; }
.pl-ok { min-height: 1.4em; margin: .6em 0 0 0; color: #16855a; font-weight: 700; font-size: .9em; }
.pl-rgpd { margin: 1.4em 0 0 0; font-size: .8em; color: #878787; text-align: center; }
.pl-carte input[type="checkbox"] { appearance: auto; -webkit-appearance: checkbox; opacity: 1; position: static; width: auto; }

@media screen and (max-width: 736px) {
	.pl-salle { overflow-x: auto; padding-bottom: .4em; }
	.pl-plan, .pl-tableau { min-width: calc(var(--nc, 8) * 5.4rem); }
	.pl-tableau { position: sticky; left: 0; }
}
@media screen and (max-width: 900px) { .pl-cote { grid-template-columns: minmax(0, 1fr); } .pl-taille { margin-left: 0; } }

/* Import de fichier */
.pl-fichiers { display: flex; flex-wrap: wrap; gap: .5em; margin-top: .8em; }
.pl-import { margin-top: .8em; padding: .8em 1em 1em 1em; border: 2px dashed #5cc79a; border-radius: .9em; background: #f6fcf9; }
.pl-import-titre { margin: 0 0 .4em 0; color: #555; font-size: .9em; }
.pl-import .pl-case { margin: .2em 0 0 0; }
.pl-apercu { margin: .8em 0 0 0; font-size: .85em; color: #16855a; }
.pl-ligne { display: flex; gap: .6em; align-items: center; flex-wrap: wrap; margin-top: .6em; }
.pl-mini.plein { background: #16855a !important; color: #fff !important; border-color: #16855a; }


/* Impression : le plan seul, en paysage */
@page { size: A4 landscape; margin: 1.2cm; }
@media print {
	#header, #banner, #footer, #nav, .pl-onglets, .pl-cote, .pl-barre, .pl-outils, .pl-rgpd { display: none !important; }
	#features.pl-section { padding: 0 !important; }
	.pl-grille { display: block; max-width: none; }
	.pl-carte { border: 0; padding: 0; }
	.pl-salle::before { content: attr(data-titre); display: block; font: 700 1.6rem 'Fredoka', 'Nunito', sans-serif; color: #16855a; margin-bottom: .3em; }
	.pl-salle.retourne::before { order: 9; }
	.pl-tableau { background: #fff; color: #000; border: 2px solid #000; }
	.pl-place { background: #fff; border: 2px solid #000; color: #000; font-size: clamp(.7rem, calc(100cqw / var(--nc) / 8), 1.1rem); }
	.pl-place:not(.pris) { border-style: dashed; border-color: #999; }
	.pl-plan > div { min-height: 2.6cm; }
}
