span.aide_client {
	font-style: italic;
	font-size: 14px;
}

/* Global container */
.commande {
	width: 100%;
}

/* Sub-category */
.sous-categorie {
	margin-bottom: 0.5rem;
}

td.ancreCatProduit {
	min-width: 240px;
	padding: 6px;
}

td.ancreCatProduit a {
	text-decoration: none;
	font-weight: bold;
}

td.ancreCatProduit a:hover {
	text-decoration: underline;
}

.recap-numbers {
	min-width: 30px;
	text-align: right;
}

@media (max-width: 700px) {

	td.ancreCatProduit {
		min-width: 20px;
		padding: 1px;
	}

	td.ancreCatProduit a {
		font-weight: normal;
	}

}

div.blocTarifCategorie {
	position: absolute;
	top: 0px;
	left: 0px;
	font-weight: bold;
	width: 350px;
	padding: 2px;
	padding-left: 5px;
	padding-right: 5px;
	height: 25px;
	line-height: 25px;
	border-bottom-right-radius: 5px;
	border-top-right-radius: 5px;
	font-size: 0.82em;
	display: flex;
	justify-content: space-between;
}

@media (max-width: 350px) {

	/* under 350px, the nominal width of that element, just keep all screen */
	div.blocTarifCategorie {
		width: 100%;
		border-bottom-right-radius: 0px;
		border-top-right-radius: 0px;
	}
}

input.commandeBtn {
	cursor: pointer;
	width: 30px;
	height: 30px;
}

/* Grid that becomes 2 columns */
.produits-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.5rem 4rem;
}

/* Two columns on large screens */
@media (min-width: 700px) {
	.produits-grid {
		grid-template-columns: 1fr 1fr;
		grid-auto-flow: column;
	}
}

/* @media (min-width: 1000px) {
	.produits-grid {
		grid-template-columns: repeat(3, 1fr);
		grid-auto-flow: column;
	}
} */

/* One product line */
.produit-ligne {
	display: grid;
	grid-template-columns:
		1fr
		/* product name */
		27px
		/* minus */
		27px
		/* quantity */
		27px;
	/* plus */
	align-items: center;
	gap: 0.3rem;
}

/* Name wraps nicely */
.produit-nom {
	overflow-wrap: anywhere;
	border-bottom: 1px solid #cbe6cc;
}

/* Quantity input */
.qte {
	width: 48px;
	text-align: center;
}

/* Buttons */
.btn-qte {
	width: 36px;
	height: 32px;
	cursor: pointer;
}

/* Afffichages coordonnées de la page */
table.cdeTableCoord input.champTexte {
	border: 0px;
	border-bottom: 1px solid gray;
	width: 100%;
	max-width: 400px;
	font-size: 1.1em;
}

table.cdeTableCoord tr td textarea {
	width: 100%;
	max-width: 700px;
	height: 100px;
	border: none;
	border-bottom: 1px solid gray;
}

td.cdeCoordIntitule {
	text-align: right;
	padding-right: 5px;
	width: 130px;
}

.selectBorder {
	display: inline-block;
	border: 1px solid gray;
	border-radius: 5px;
	margin: 2px;
	text-align: center;
	width: 75px;
}

.selectDiv {
	margin: 0 21px 0;
	display: inline-flex;
	flex-wrap: nowrap;
}

@media screen and (max-width:510px) {
	/* display table on 1 column */
	table.cdeTableCoord {
		display: block;
		width: 100%;
	}

	table.cdeTableCoord td {
		display: block;
		width: 100%;
	}
	
	/* To get cell 2 below cell 1 within the *conceptual* row */
	table.cdeTableCoord tr {
		width: 100%;
		display: flex;
		flex-direction: column;
		margin-bottom: 1em;
	}

	td.cdeCoordIntitule {
		text-align: left;
		padding-left: 5px;
	}
}