/*-----------*
 | B - BLOCS |
 *-----------*/

/* Les blocs mettent en forme le contenu sans fixer la largeur de la page. */
:is(.blc-crd, .blc-dsh, .blc-tbl, .blc-frm, .blc-flw, .blc-stk, .blc-gal, .blc-tab, .blc-ctr){
	min-width: 0;
}

:is(.blc-crd, .blc-flw, .blc-stk, .blc-gal) > :is(section, article, aside, div),
.blc-tab > .blc-tab-cnt{
	padding: 1rem;
	background-color: var(--fond-neutre-attenue);
	border: 1px solid var(--bordure-douce);
	border-radius: var(--stl-rds);
}

/* Cartes */
.blc-crd{
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: var(--stl-spc);
}

.blc-crd > :is(section, article, aside, div){
	display: flex;
	flex-direction: column;
	gap: .65rem;
}

.blc-crd > :is(section, article, aside, div) > :last-child{ margin-bottom: 0; }
.blc-crd .btn{ align-self: flex-start; margin-top: auto; }

/* Tableau / grille */
.blc-tbl{ overflow: visible; }
.blc-tbl > div{ overflow-x: auto; }
.blc-tbl table{ margin-top: 0; }
.blc-tbl th,
.blc-tbl td{ white-space: nowrap; }
.blc-tbl > form:first-child{ margin-top: 0; }
.blc-tbl .btn-action{ white-space: nowrap; }

.blc-nav{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: .5rem;
	margin: 0 0 1rem;
	text-align: center;
}

.blc-nav form{ margin: 0; }
.blc-nav p{ margin: 0; min-width: 5rem; }

/* Formulaire */
.blc-frm > form{
	max-width: 100%;
	margin: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem var(--stl-spc);
}

.blc-frm > form > .inp,
.blc-frm > form > fieldset,
.blc-frm > form > p{
	min-width: 0;
}

.blc-frm .fll,
.blc-frm > form > fieldset,
.blc-frm > form > p,
.blc-frm > form > .blc-frm-fll{
	grid-column: 1 / -1;
}

.blc-frm textarea{ width: 100%; }

/* Flux vertical */
.blc-flw,
.blc-stk{
	display: flex;
	flex-direction: column;
	gap: var(--stl-spc);
}

.blc-flw > :is(section, article, aside, div),
.blc-stk > :is(section, article, aside, div){ margin: 0; }

/* Galerie */
.blc-gal{
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
	gap: var(--stl-spc);
}

.blc-gal > figure{
	margin: 0;
	min-width: 0;
}

.blc-gal > figure > a{
	display: block;
	color: inherit;
	text-decoration: none;
}

.blc-gal .gal-img{
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 150px;
}

/* Onglets : navigation réelle par pages, sans dépendance JavaScript. */
.blc-tab-nav{
	display: flex;
	flex-wrap: wrap;
	gap: .35rem;
	margin: 0 0 1rem 0;
	padding: 0;
	list-style: none;
	border-bottom: 1px solid var(--bordure);
}

.blc-tab-nav li{ margin: 0; }

.blc-tab-nav a{
	display: block;
	padding: .7rem 1rem;
	color: var(--texte);
	text-decoration: none;
	border: 1px solid transparent;
	border-radius: var(--stl-rds) var(--stl-rds) 0 0;
}

.blc-tab-nav a:hover{
	background-color: var(--fond-attenue);
	color: var(--primaire);
}

.blc-tab-nav .actif a,
.blc-tab-nav a[aria-current="page"]{
	margin-bottom: -1px;
	background-color: var(--fond-neutre-attenue);
	color: var(--primaire);
	border-color: var(--bordure) var(--bordure) var(--fond-neutre-attenue);
	font-weight: 700;
}

/* Centrage simple */
.blc-ctr{ text-align: center; }

/* Actions compactes des grilles d'administration. */
.btn-action{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.2rem;
	padding: .4rem .55rem;
	background-color: var(--fond-neutre-attenue);
	color: var(--texte);
	border: 1px solid var(--bordure);
	border-radius: 4px;
	cursor: pointer;
}

.btn-action:hover{
	background-color: var(--fond-accentue);
	border-color: var(--bordure-primaire);
}

@media(max-width: 600px){
	.blc-frm > form{ grid-template-columns: 1fr; }
	.blc-frm .fll,
	.blc-frm > form > fieldset,
	.blc-frm > form > p,
	.blc-frm > form > .blc-frm-fll{ grid-column: auto; }

	.blc-tab-nav{ display: grid; grid-template-columns: 1fr; border-bottom: 0; }
	.blc-tab-nav a,
	.blc-tab-nav .actif a,
	.blc-tab-nav a[aria-current="page"]{
		margin-bottom: 0;
		border: 1px solid var(--bordure);
		border-radius: var(--stl-rds);
	}
}

/* Informations */
.blc-inf-grd{ display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:var(--stl-spc); margin:1rem 0; }
.blc-inf-crd{ padding:1rem; text-align:center; background:var(--fond-attenue); border:1px solid var(--bordure-douce); border-radius:var(--stl-rds); }
.blc-inf-crd .blc-inf-ico{ font-size:2rem; }
.blc-inf-crd .blc-inf-val{ margin:.45rem 0 .2rem; font-size:1.15rem; font-weight:700; color:var(--primaire); }
.blc-inf-crd .blc-inf-lbl{ margin:0; color:var(--texte-attenue); }