/**
 * Feuille de style définissant l'affichage des tables paginées.
 *
 * Notes:
 * 		- Plutôt que de déclarer directement cette CSS, utiliser
 * 		  "include ('inc/table.php')" dans le head de la vue.
 * 		Sinon:
 * 		- Si on déclare cette CSS dans un head, il faut aussi
 *        déclarer avant "pagination.css".
 * 		- Ne pas oublier d'utiliser la fonction PHP "addVersion"
 * 		  dans la déclaration, afin d'éviter les problèmes de
 * 		  cache.
 */
 
table.table-page, div.table-page {
	width: 100%;
	border-top: 1px solid black;
}

table.table-page th, table.table-page td {
	max-width: 200px;
	text-align: center;
}

table.table-page td.actions {
	width: 0;
}

table.table-page th {
	background-color: #fffe92;
}

table.table-page th a {
	display: block;
	color: black;
}

table.table-page th a:visited {
	color: black;
}

table.table-page th a:hover {
	color: #2c78ca; /* couleur du golfe en plus foncé */
	background-color: #fffeb0;
}

table.table-page th a.sort-asc::before,
table.table-page th a.sort-desc::before {
	float: right;
	/* La police monospace permet d'avoir les fleches identiques
		 entre FF et Chrome. */
	font-family: monospace;
	font-weight: bold;
}

table.table-page th a.sort-asc::before {
	content: "\2191"; /* fleche vers le haut */
}

table.table-page th a.sort-desc::before {
	content: "\2193"; /* fleche vers le bas */
}

table.table-page tbody tr {
	height: 4rem;
}

table.table-page tbody tr:nth-child(odd) {
	background-color: var(--table-row-bg-odd);
}

table.table-page tbody tr:nth-child(even) {
	background-color: var(--table-row-bg-even);
}

table.table-page tbody tr:hover {
	background-color: var(--table-row-bg-hov);
}

p.table-page {
	font-style: italic;
}


@media (max-width: 1100px) and (min-width: 700px) {
	table.table-page th.optional, table.table-page td.optional {
		display: none;
	}
}


@media (pointer:coarse), (max-width:700px) {

	table.table-page th,
	table.table-page td {
		font-size: medium;
	}

	.table-page .optional {
		display: none;
	}
}