@charset "UTF-8";
/* Couleurs */
/* Espacement */
/* Base CSS réutilisée par les avis et les autres frames avec icônes*/
#error-message-empty-comment, .options-error-message, .complete-recaptcha-error {
  font-size: var(--qc-font-size-sm);
  line-height: var(--qc-line-height-sm);
  font-weight: var(--qc-font-weight-semi-bold);
  margin: 0;
  list-style: none !important;
  color: var(--qc-color-red-medium);
}

.comment-form-container {
  margin-top: 4.5rem;
}

#comments-form-section {
  padding: 0;
  margin: 0;
  /*RADIO*/
  /* checkbox aspect */
  /* checked mark aspect */
  /* checked mark aspect changes */
}
#comments-form-section .useful-block {
  margin-bottom: 0.25rem !important;
}
#comments-form-section .radio {
  padding-right: var(--qc-spacer-sm);
}
#comments-form-section .recaptcha-section {
  margin-bottom: 2rem;
}
#comments-form-section .custom-error-message {
  list-style: none;
}
#comments-form-section .custom-error-message:before {
  content: "";
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  background-image: url("../Icons/error-triangle.svg");
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  margin-bottom: 0.375rem;
}
#comments-form-section .submitted-form-message {
  border: none;
  padding: 0;
  margin: 0;
}
#comments-form-section .submitted-form-message ul {
  padding: 0;
}
#comments-form-section .submitted-form-message li {
  display: inline;
  list-style: none;
  margin: 0;
}
#comments-form-section .spam-error-message {
  border: none;
  padding: 0;
  margin: 0;
}
#comments-form-section .spam-error-message li {
  display: inline;
  list-style: none;
  margin: 0;
}
#comments-form-section .maxChars {
  text-align: right;
  font-size: var(--qc-font-size-sm);
  line-height: var(--qc-line-height-sm);
  font-weight: var(--qc-font-weight-regular);
  color: var(--qc-color-blue-dark);
}
#comments-form-section .complementLabel {
  font-size: var(--qc-font-size-sm);
  line-height: var(--qc-line-height-sm);
  font-weight: var(--qc-font-weight-regular);
}
#comments-form-section #maxExceeded {
  color: var(--qc-color-red-regular);
  font-size: var(--qc-font-size-sm);
  line-height: var(--qc-line-height-sm);
  font-weight: var(--qc-font-weight-semi-bold);
  font-family: var(--qc-font-family-content);
}
#comments-form-section .options-error-message {
  margin: 0 0 2rem 0;
}
#comments-form-section .comments-form {
  margin-bottom: 0 !important;
}
#comments-form-section .submit-button {
  height: 3rem !important;
  margin-top: 0.5rem !important;
  padding: 0.75rem 6rem !important;
  font-size: var(--qc-font-size-lg);
  line-height: var(--qc-line-height-lg);
  font-weight: var(--qc-font-weight-regular);
}
#comments-form-section .cancel-button {
  height: 3rem;
  margin-top: var(--qc-spacer-xs);
  font-size: var(--qc-font-size-lg);
  line-height: var(--qc-line-height-lg);
  font-weight: var(--qc-font-weight-regular);
  margin-left: var(--qc-spacer-sm);
}
#comments-form-section .comments-form {
  background-color: var(--qc-color-grey-extra-pale);
  border-top: 1px solid var(--qc-color-grey-light);
  padding: 0 !important;
}
#comments-form-section .btn-option {
  margin-right: var(--qc-spacer-md);
  background-color: rgba(9, 87, 151, 0) !important;
  color: var(--qc-color-blue-piv);
  border: 1px solid var(--qc-color-blue-piv);
  font-size: var(--qc-font-size-md);
  line-height: var(--qc-line-height-md);
  font-weight: var(--qc-font-weight-semi-bold);
  font-family: var(--qc-font-family-content);
  height: 2.5rem;
  width: 5rem;
  padding: 0.5rem 1rem;
  text-align: center;
  border-radius: 0;
}
#comments-form-section .btn-option:hover {
  margin-right: var(--qc-spacer-md);
  background-color: rgba(var(--qc-color-blue-piv-rgb), 0.16) !important;
  color: var(--qc-color-blue-piv);
  border: 1px solid var(--qc-color-blue-piv);
}
#comments-form-section .btn-option:focus {
  border: 1px solid var(--qc-color-blue-dark);
  outline: 2px solid var(--qc-color-blue-light);
  background-color: rgba(var(--qc-color-blue-piv-rgb), 0.16);
}
#comments-form-section .btn-option:active {
  background-color: rgba(9, 87, 151, 0.08);
}
#comments-form-section .link-option {
  margin-top: 0.3rem;
}
#comments-form-section #comment-textarea {
  border: 1px solid var(--qc-color-grey-medium);
  border-radius: 0;
  color: var(--qc-color-blue-dark);
}
#comments-form-section #comment-textarea:focus {
  box-shadow: 0 0 2px 2px var(--qc-color-blue-light);
  -moz-box-shadow: 0 0 2px 2px var(--qc-color-blue-light);
  -webkit-box-shadow: 0 0 2px 2px var(--qc-color-blue-light);
}
#comments-form-section .text-area-comments {
  margin-bottom: 2rem;
}
#comments-form-section .option-label {
  font-size: var(--qc-font-size-md);
  line-height: var(--qc-line-height-md);
  font-weight: var(--qc-font-weight-regular);
}
#comments-form-section .form-instruction {
  margin-bottom: 2rem;
  font-size: var(--qc-font-size-sm);
  line-height: var(--qc-line-height-sm);
  font-weight: var(--qc-font-weight-regular);
}
#comments-form-section .form-instruction .mandatoryMark {
  color: #BC442C;
}
#comments-form-section #QcCommentForm {
  margin-bottom: 0;
  border: none;
}
#comments-form-section .complete-recaptcha-error {
  margin-top: var(--qc-spacer-sm);
}
#comments-form-section #select-negativeReport-error-message {
  margin: 0 0 2rem 0;
}
#comments-form-section #error-message-empty-comment {
  margin: 0.5rem 0 2rem 0;
}
#comments-form-section .submit-message li {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-right: var(--qc-spacer-sm);
}
#comments-form-section .comment-section-elements {
  border: none;
  padding: 2rem 2rem 2rem 1.5rem;
}
#comments-form-section .option, #comments-form-section .options-question, #comments-form-section .options-label {
  margin-bottom: var(--qc-spacer-sm);
}
#comments-form-section .comment-area {
  margin-top: 2rem;
}
#comments-form-section .options-area legend {
  margin-bottom: 0 !important;
}
#comments-form-section .displayBlock {
  margin-top: 0 !important;
  padding-top: 0.25rem;
  margin-bottom: 0;
  padding-right: 0 !important;
}
#comments-form-section .options {
  padding-left: 0;
}
#comments-form-section .form-group {
  margin-top: 0;
}
#comments-form-section .comments-from-label {
  margin-bottom: var(--qc-spacer-sm);
}
#comments-form-section .btn-submit-comment {
  color: #fff;
  background-color: var(--qc-color-blue-piv);
  border-color: var(--qc-color-blue-piv);
  padding: 0.75rem;
  font-weight: bold;
  border: 0;
}
#comments-form-section .btn-submit-comment:hover {
  background-color: var(--qc-color-blue-regular);
}
#comments-form-section #submitButton {
  font-size: var(--qc-font-size-md);
  line-height: var(--qc-line-height-md);
  font-weight: var(--qc-font-weight-semi-bold);
  padding: 0.5rem 1rem !important;
  height: 2.5rem !important;
  border-radius: 0;
}
#comments-form-section #submitButton:focus {
  border: 1px solid var(--qc-color-blue-dark);
  outline: 2px solid var(--qc-color-blue-light);
  box-shadow: 0 2px 8px rgba(34, 54, 84, 0.24);
}
#comments-form-section #submitButton:active {
  border: 1px solid #3783c9;
  background-color: #3783c9;
}
#comments-form-section .icon-message {
  margin-right: var(--qc-spacer-sm);
  height: 100%;
}
#comments-form-section .comment-area, #comments-form-section textarea {
  margin-top: 0 !important;
}
#comments-form-section .maxChars {
  color: #4E5662 !important;
}
#comments-form-section .positive-area {
  margin-top: 2rem;
}
#comments-form-section .radio [type=radio]:active + label:before, #comments-form-section .radio [type=radio]:focus + label:before {
  outline: 2px solid var(--qc-color-blue-regular) !important;
  border: 2px solid var(--qc-color-blue-dark) !important;
}
#comments-form-section .radio [type=radio]:not(:checked) + label:before {
  border: 1px solid var(--qc-color-blue-dark);
}
#comments-form-section .radio [type=radio]:checked + label:before {
  border: 1px solid var(--qc-color-blue-regular);
}
#comments-form-section .radio [type=radio]:focus + label:before {
  border: 1px solid var(--qc-color-blue-dark) !important;
  outline: 2px solid var(--qc-color-blue-light) !important;
}
@media (min-width: 1200px) {
  #comments-form-section .h2 {
    padding: 0.95rem 0 0.95rem 1.45rem !important;
  }
}
@media (max-width: 576px) {
  #comments-form-section .tx-powermail input[type=submit], #comments-form-section .tx-powermail .powermail_submit, #comments-form-section .tx-powermail .btn-primary:not(:disabled):not(.disabled).powermail_submit:active {
    padding: 0.4rem !important;
  }
  #comments-form-section .formBasPage form {
    margin-bottom: 0;
  }
}
#comments-form-section .submitted-form-message {
  border: none;
  padding: 0;
  margin: 0;
}
#comments-form-section .submitted-form-message li {
  margin: 0;
}
#comments-form-section .spam-error-message {
  border: none;
  padding: 0;
  margin: 0;
}
#comments-form-section .spam-error-message li {
  margin: 0;
}
@media (max-width: 1199.98px) {
  #comments-form-section #comments-form-section .comment-section-elements {
    padding: var(--qc-spacer-md);
  }
}
@media (max-width: 991.98px) {
  #comments-form-section #comments-form-section .btn-option {
    margin-right: var(--qc-spacer-md);
  }
}
@media (max-width: 767.98px) {
  #comments-form-section .report-problem {
    margin-top: var(--qc-spacer-md);
  }
}
#comments-form-section .mandatoryMark {
  color: var(--qc-color-error);
}
#comments-form-section .fieldLabel {
  font-weight: bold;
  margin-bottom: 0;
  margin-top: 1rem;
}
#comments-form-section .submitted-form-message ul {
  padding: 0;
}
#comments-form-section .radio [type=radio]:not(:checked),
#comments-form-section .radio [type=radio]:checked {
  position: absolute;
  left: -9999px;
}
#comments-form-section .radio [type=radio]:not(:checked) + label,
#comments-form-section .radio [type=radio]:checked + label {
  position: relative;
  padding-left: 1.3rem;
  cursor: pointer;
}
#comments-form-section .radio span.checkboxVisuel {
  display: block;
  height: 1rem;
  width: 1rem;
  border: 1px solid var(--qc-color-grey-regular);
  margin: 0.3rem 0.7rem 0 0.1rem;
}
#comments-form-section .radio [type=radio]:not(:checked) + label:before,
#comments-form-section .radio [type=radio]:checked + label:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.2rem;
  width: 1rem;
  height: 1rem;
  border-radius: 0.8rem;
  border: 1px solid var(--qc-color-grey-regular);
  background: #fff;
}
#comments-form-section .radio [type=radio]:not(:checked) + label:after,
#comments-form-section .radio [type=radio]:checked + label:after {
  content: "";
  position: absolute;
  top: 0.45rem;
  left: 0.25rem;
  font-size: 1em;
  height: 0.5rem;
  width: 0.5rem;
  border-radius: 0.8rem;
  line-height: 0.8;
  background-color: var(--qc-color-blue-regular_light);
}
#comments-form-section .radio [type=radio]:not(:checked) + label:after {
  opacity: 0;
  transform: scale(0);
}
#comments-form-section .radio [type=radio]:checked + label:after {
  opacity: 1;
  transform: scale(1);
}
#comments-form-section .error-textarea {
  border: 0.125rem solid var(--qc-color-red-regular) !important;
}
#comments-form-section .negative-report-section, #comments-form-section .report-problem-section, #comments-form-section .positif-comment-section, #comments-form-section .text-area-section {
  max-width: 33rem;
}