/*
// ===============================================
// ###############################################
// ### CSS - commentaire.css #####################
// ###############################################
// ===============================================
// ### HISTORIQUE DE VERSION #####################
// ===============================================
// 08/08/2025 : Re développement des commentaires
// ===============================================
*/

.commentaires {
	display: block;
	float: none;
	padding-bottom: 40px;
	padding-left: 20px;
	padding-right : 20px;
	position: relative;
	user-select: none;
	-webkit-user-select: none;
}
.commentaires-cadre {
	display: block;
	position: relative;
	float: none;
}
.commentaires-titre {
	display: block;
	float: none;
	position: relative;
	padding-top: 40px;
	border-top: 1px solid rgb(var(--theme_couleur_gris_clair));
}
.commentaires-titre h3 {
	font-weight: normal;
	margin: 0px;
}
.commentaires-resume {
	display: flex;
	float: none;
	position: relative;
	padding-top: 20px;
}
.commentaires-resume-pictogramme{
	display: block;
	float: none;
	position: relative;
	padding-right: 15px;
	flex-grow: 1;
}
.commentaires-resume-pictogramme svg{
	display: block;
	float: none;
	position: relative;
	width: 36px;
	height: auto;
}
.commentaires-resume-pictogramme svg .pictogramme {
	fill: rgb(var(--theme_couleur_2));
}
.commentaires-resume-texte {
	display: block;
	float: none;
	position: relative;
	flex-grow: 1000;
}
.commentaires-resume-nom {
	display: block;
	float: none;
	position: relative;
	padding-top: 15px;
	font-size: 16px;
	color: rgb(var(--theme_couleur_1));
}
.commentaires-resume-date {
	display: block;
	float: none;
	position: relative;
	font-size: 13px;
}
.commentaires-resume-detail {
	display: block;
	float: none;
	position: relative;
	font-size: 14px;
	padding-top: 10px;
}
.commentaire-ajouter {
	display: block;
	float: none;
	position: relative;
	border-bottom: 1px solid rgb(var(--theme_couleur_gris_clair));
	padding-bottom: 40px;
	padding-top: 20px;
}
.commentaire-ajouter-pictogramme {
	display: block;
	float: none;
	position: relative;
	padding-right: 15px;
	flex-grow: 1;
}
.commentaire-ajouter-pictogramme svg {
	display: block;
	float: none;
	position: relative;
	width: 36px;
	height: auto;
}
.commentaire-ajouter-pictogramme svg .pictogramme {
	fill: rgb(var(--theme_couleur_2));
}
.commentaire-ajouter-cadre {
	display: flex;
	float: none;
	position: relative;
}
.commentaire-ajouter-champ {
	display: block;
	float: none;
	position: relative;
	flex-grow: 1000;
}
.commentaire-formulaire {
	display: block;
	float: none;
	position: relative;
}
.commentaire-ajouter-champ form.formulaire {
	padding: 0px;
}
.commentaires-stitre {
	display: block;
	float: none;
	position: relative;
	padding-top: 40px;
}
.commentaires-stitre h4{
	margin: 0px;
}
.commentaire {
	display: block;
	float: none;
	position: relative;
	padding-top: 23px;
	padding-bottom: 0px;
}
.commentaire-contenu {
	display: flex;
	float: none;
	position: relative;
}
.commentaire-initiale {
	display: flex;
	float: none;
	position: relative;
	flex-grow: 1;
	padding-right: 15px;
}
.commentaire-initiale div {
	background-color: rgb(var(--theme_couleur_2));
	display: flex;
	height: 36px;
	width: 36px;
	position: relative;
	border-radius: 40px;
	text-transform: uppercase;
	align-items: center;
	justify-content: center;
}
.commentaire-initiale div span {
	display: block;
	position: relative;
	float: none;
	text-transform: uppercase;
	font-size: 15px;
	color:rgb(var(--theme_couleur_blanc));
	user-select: none;
	-webkit-user-select: none;
}
.commentaire-resume {
	display: block;
	float: none;
	position: relative;
	flex-grow: 1000;
}
.commentaire-resume h5 {
	font-weight: normal;
	margin: 0px;
	float: none;
	position: relative;
}
.commentaire-resume h5 strong {
	font-size: 15px;
}
.commentaire-resume h5 strong span {
	font-size: 15px;
}
.commentaire-resume h5 span {
	font-size: 14px;
}
.commentaire-resume h5 a {
	color: rgb(var(--theme_couleur_noir));
	user-select: none;
	-webkit-user-select: none;
	text-decoration: none;
	cursor: pointer;
}
.commentaire-resume h5 a:hover {
	color: rgb(var(--theme_couleur_1));
	text-decoration: none;
}
.commentaire-resume p {
	font-size: 15px;
	font-weight: 400;
	margin: 0px;
	padding-top: 5px;
}
.commentaire-reponse {
	display: block;
	float: none;
	position: relative;
	padding-top: 23px;
	padding-bottom: 0px;
	padding-left: 40px;
}
.commentaire-reponse-indicateur {
	display: block;
	float: none;
	position: absolute;
	width: 14px;
	height: 10px;
	top:0px;
}
.commentaire-reponse-indicateur svg{
	display: block;
	float: none;
	position: relative;
	width: 100%;
	height: auto;
}
.commentaire-reponse-indicateur svg .pictogramme {
	fill: rgb(var(--theme_couleur_2));
	width: 100%;
	height: auto;
}
.commentaire-reponse-reponse {
	display: block;
	float: none;
	position: relative;
	padding-top: 23px;
	padding-bottom: 0px;
	padding-left: 80px;
}
.commentaire-repondre-ajouter {
	display: block;
	float: none;
	position: relative;
}
.commentaire-repondre {
	display: flex;
	position: relative;
	float: none;
	padding-top: 10px;
	padding-bottom: 10px;
	border-bottom: 1px solid rgb(var(--theme_couleur_gris_clair));
	margin-left: 31px;
	align-items: center;
}
.commentaire-repondre a, .commentaire-repondre-vote {
	display: flex;
	position: relative;
	float: none;
	width: auto;
	height: 22px;
	cursor: pointer;
	margin-left: 20px;
	align-items: center;
}
.commentaire-repondre a svg .pictogramme, .commentaire-repondre-vote svg .pictogramme{
	fill: rgb(var(--theme_couleur_noir));
}
.commentaire-repondre a:hover svg .pictogramme, .commentaire-repondre-vote:hover svg .pictogramme{
	fill: rgb(var(--theme_couleur_1));
}
.commentaire-repondre-vote-nombre {
	display: block;
	position: relative;
	float: none;
	font-size: 13px;
	margin: 0px;
	padding-left: 5px;
	padding-top: 2px;
	user-select: none;
	-webkit-user-select: none;
}
.commentaire-ajouter-champ-info {
	padding-top: 20px;
	padding-bottom: 20px;
}

.commentaire-ajouter-bouton {
	text-align: right;
	display: block;
	float: none;
	position: relative;
	padding-top: 20px;
}
.commentaire-ajouter-action {
	display: none;
	float: none;
	position: relative;
}
.commentaire-ajouter-formulaire {
	display: block;
	float: none;
	position: relative;
}
.commentaire-ajouter-attente {
	display: none;
	float: none;
	position: relative;
}
.commentaire-ajouter-contenu {
	display: flex;
	float: none;
	position: relative;
	align-items: center;
}
.commentaire-ajouter-initiale {
	display: flex;
	float: none;
	position: relative;
	flex-grow: 1;
	padding-right: 15px;
	align-items: center;
}
.commentaire-ajouter-initiale div {
	display: flex;
	position: relative;
	float: none;
	background-color: rgb(var(--theme_couleur_2));
	height: 36px;
	width: 36px;
	border-radius: 40px;
	align-items: center;
	justify-content: center;
}
.commentaire-ajouter-initiale div span {
	display: block;
	position: relative;
	float: none;
	text-transform: uppercase;
	font-size: 15px;
	color:rgb(var(--theme_couleur_blanc));
	user-select: none;
	-webkit-user-select: none;
}
.commentaire-ajouter-resume {
	display: block;
	float: none;
	position: relative;
	font-size: 15px;
	flex-grow: 1000;
}
.commentaire-ajouter-resume a {
	text-decoration: underline;
	color: rgb(var(--theme_couleur_noir));
	font-weight: bold;
	user-select: none;
	-webkit-user-select: none;
	cursor: pointer;
}
.commentaire-ajouter-resume a:hover{
	text-decoration: none;
	color: rgb(var(--theme_couleur_1));
}
.commentaire-ajouter-resume-detail {
	display: none;
	float: none;
	position: relative;
}
.commentaire-ajouter-resume-detail h5 {
	display: inline-block;
	float: none;
	position: relative;
	font-size: 15px;
	font-weight: normal;
	margin: 0px;
}
.commentaire-ajouter-resume-detail h5 span{
	font-size: 14px;
}
.commentaire-ajouter-resume-detail p {
	font-size: 15px;
	font-style: italic;
	margin: 0px;
}