/* header_desktop.css rend ce h1 en inline-block (bandeau) via des sélecteurs main:has(...):not(#home) h1 de forte spécificité :
   on reprend le même :not(#home) pour passer devant et centrer le titre avec des marges auto */
main#glossaire:not(#home) > h1 {
  display: block !important;
  width: fit-content !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.glossaire-scroll-container {
  margin-left: 10px !important;
  margin-right: 10px !important;
  max-height: calc(100vh - 220px);
  min-height: 250px;
  overflow-y: auto;
  border: 1px solid #dee2e6;
  border-radius: 6px;
  box-shadow: 0 4px 6px rgba(0,0,0,0.05);
  background-color: #fff;
}

.glossaire-table {
  margin-bottom: 0 !important;
  width: 100% !important;
  border-collapse: collapse !important;
}

.glossaire-table thead th {
  position: sticky !important;
  top: 0 !important;
  background-color: #308796 !important;
  color: #fff !important;
  z-index: 100 !important;
  text-align: center !important;
  vertical-align: middle !important;
  padding: 8px 12px !important;
  font-size: 14px !important;
  border-bottom: 2px solid #246875 !important;
}

.glossaire-table tbody td {
  vertical-align: top !important;
  padding: 8px 12px !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
}
.glossaire-table td p {
  margin-top: 0 !important;
  margin-bottom: 6px !important;
}
.glossaire-table td p:last-child {
  margin-bottom: 0 !important;
}
.glossaire-table td ul, .glossaire-table td ol {
  margin-top: 0 !important;
  margin-bottom: 6px !important;
  padding-left: 20px !important;
}
.glossaire-table td li {
  margin-bottom: 3px !important;
}

.glossaire-table th, .glossaire-table td {
  border: 1px solid #308796 !important;
}

/* Lignes bleutées une sur deux ; chaque section (tbody) commence par sa bande de titre */
.glossaire-table tbody tr:nth-child(odd) {
  background-color: #eaf2f8 !important; /* bleu clair */
}
.glossaire-table tbody tr:nth-child(even) {
  background-color: #ffffff !important;
}

/* Buttons inside cells */
.glossaire-table .button1 {
  padding: 3px 8px !important;
  font-size: 11px !important;
  margin: 2px !important;
  display: inline-block !important;
}
.glossaire-table .glossaire-actions-cell .btn-action {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 90px !important;
  height: 32px !important;
  padding: 0 !important;
  font-size: 13px !important;
  font-weight: bold !important;
  border-radius: 4px !important;
  border: none !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important;
  cursor: pointer !important;
  margin: 4px !important;
  box-sizing: border-box !important;
  transition: background-color 0.2s !important;
}

.glossaire-table .glossaire-actions-cell a.btn-action {
  background-color: #308796 !important;
  color: #fff !important;
  text-decoration: none !important;
}
.glossaire-table .glossaire-actions-cell a.btn-action:hover {
  background-color: #1f616d !important;
  color: #fff !important;
}

.glossaire-table .glossaire-actions-cell button.btn-action {
  background-color: #b50000 !important;
  color: #fff !important;
}
.glossaire-table .glossaire-actions-cell button.btn-action:hover {
  background-color: #8f0000 !important;
}

.glossaire-table form {
  display: inline-block !important;
  margin: 0 !important;
}
.glossaire-actions-cell {
  white-space: nowrap !important;
  text-align: center !important;
  vertical-align: middle !important;
}
.glossaire-table .first-td {
  text-align: center !important;
  font-weight: bold !important;
}
.glossaire-table .code-site-cell,
.glossaire-table .glossaire-visibilite-cell {
  text-align: center !important;
  vertical-align: middle !important;
  font-weight: bold !important;
}
/* Bande de titre d'une section (une par page du menu) */
.glossaire-table tbody tr.glossaire-section-titre th {
  background-color: #dff0f2 !important;
  color: #246875 !important;
  font-size: 15px !important;
  font-weight: bold !important;
  letter-spacing: 0.03em;
  text-align: left !important;
  vertical-align: middle !important;
  padding: 8px 12px !important;
}
.glossaire-section-titre th > span {
  vertical-align: middle;
}
.glossaire-section-titre .glossaire-page-icon {
  margin-right: 10px;
}
/* Pastille colorée : les icônes du menu sont blanches */
.glossaire-page-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background-color: #308796;
  color: #fff;
  font-size: 18px;
}
.glossaire-page-icon img {
  width: 22px;
  height: 22px;
  object-fit: contain;
}
.glossaire-table .glossaire-magnifier-cell {
  text-align: center !important;
  vertical-align: middle !important;
  width: 45px !important;
}
.glossaire-table .glossaire-magnifier-cell a {
  color: #308796 !important;
  font-size: 1.25rem !important;
  transition: transform 0.2s ease, color 0.2s ease !important;
  display: inline-block !important;
}
.glossaire-table .glossaire-magnifier-cell a:hover {
  color: #246875 !important;
  transform: scale(1.2) !important;
}

/* ============================================================================
   Classes remplaçant les anciens attributs style= des templates.
   :is(.classe, #_#_#_) donne à la règle la spécificité de 3 id (le second sélecteur ne
   correspond à rien) : comme le style inline qu'elle remplace, elle l'emporte sur les
   règles normales des autres feuilles, mais pas sur leurs !important ni sur element.style.
   ============================================================================ */

/* glossaire/index.html.twig */
:is(.glossaire-index__th, #_#_#_) {
	width: 45px;
}

/* Lignes masquées au public (visibles des seuls administrateurs) : fond gris et texte atténué sur toute la ligne
   (le texte en gras ou coloré du contenu est aussi atténué, la colonne Code et les actions restent lisibles) */
.glossaire-table tbody tr.glossaire-ligne--masquee {
	background-color: #dee2e6 !important;
}
.glossaire-table tbody tr.glossaire-ligne--masquee > td:not(.code-site-cell):not(.glossaire-visibilite-cell):not(.glossaire-actions-cell) {
	opacity: 0.5;
	filter: grayscale(1);
}
.glossaire-legende-admin {
	margin: 0 10px 8px;
	font-size: 0.85rem;
	color: #495057;
}
.glossaire-badge-masque {
	font-size: 0.7rem;
	white-space: nowrap;
}

/* Interrupteur d'affichage public (administrateurs) */
.glossaire-visibilite {
	display: flex;
	justify-content: center;
	min-height: 0;
	margin: 0;
	padding-left: 0;
}
/* Interrupteur deux fois plus grand que celui de Bootstrap (2em x 1em) */
.glossaire-visibilite__interrupteur {
	width: 4em;
	height: 2em;
	margin: 0;
	float: none;
	cursor: pointer;
}
.glossaire-visibilite__interrupteur:disabled {
	cursor: progress;
}
.glossaire-visibilite__erreur {
	display: block;
	font-size: 0.7rem;
}

/* Retour depuis une page cible : la ligne d'origine est brièvement surlignée */
.glossaire-table tbody tr.glossaire-ligne--retour > td {
	animation: glossaire-retour-clignote 1s ease-in-out 3;
}
@keyframes glossaire-retour-clignote {
	0%, 100% { box-shadow: none; }
	50% { box-shadow: inset 0 0 0 3px #e53935; }
}