@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins-Medium.ttf") format("truetype");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins-SemiBold.ttf") format("truetype");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

.h5p-content,
.h5p-question,
.h5p-question-content,
.h5p-question-introduction,
.h5p-advanced-text,
.h5p-summary,
.h5p-multichoice,
.h5p-drag-text,
.h5p-gotoquestion {
  font-family: "Poppins", Arial, sans-serif;
  color: var(--hbc-text);
}

.h5p-question-introduction,
.h5p-question-introduction p,
.h5p-question-content p,
.h5p-summary p,
.h5p-multichoice p,
.h5p-drag-text p,
.h5p-gotoquestion {
  line-height: 1.45;
}

.h5p-question-buttons .h5p-joubelui-button,
.h5p-question-buttons .h5p-question-check-answer,
.h5p-joubelui-button {
  background: var(--hbc-secondary);
  border: 1px solid var(--hbc-accent);
  border-radius: 0.45rem;
  box-shadow: none;
  color: var(--hbc-on-secondary);
  font-family: "Poppins", Arial, sans-serif;
  font-weight: 600;
  transition: background-color 160ms ease, color 160ms ease, border-color 160ms ease;
}

.h5p-question-buttons .h5p-joubelui-button:hover,
.h5p-question-buttons .h5p-joubelui-button:focus-visible,
.h5p-question-buttons .h5p-question-check-answer:hover,
.h5p-question-buttons .h5p-question-check-answer:focus-visible,
.h5p-joubelui-button:hover,
.h5p-joubelui-button:focus-visible {
  background: var(--hbc-white);
  border-color: var(--hbc-secondary);
  color: var(--hbc-secondary);
  outline: 3px solid var(--hbc-focus-ring);
  outline-offset: 2px;
}

/* Barre de score Joubel */
.h5p-joubelui-score-bar {
  background: var(--hbc-white);
  border: 1px solid var(--hbc-line);
  border-radius: 1.5em;
  box-shadow: 0 4px 14px rgba(17, 19, 24, 0.08);
}

.h5p-joubelui-score-bar-progress-wrapper {
  background: var(--hbc-line);
}

.h5p-joubelui-score-bar-progress {
  background: var(--hbc-success);
  background: linear-gradient(90deg, var(--hbc-accent), var(--hbc-success));
}

.h5p-joubelui-score-number {
  color: var(--hbc-text);
}

.h5p-joubelui-score-number-separator {
  color: var(--hbc-muted);
}

.h5p-joubelui-score-bar-star-border {
  stroke: var(--hbc-accent);
}

.h5p-joubelui-score-bar-star-fill,
.h5p-joubelui-score-bar-star-fill-full-score,
.h5p-joubelui-score-bar-full-score .h5p-joubelui-score-bar-star-fill {
  fill: var(--hbc-accent);
}

/* Choix multiple */
.h5p-multichoice .h5p-answer {
  margin: 0.55em 0;
}

.h5p-multichoice .h5p-alternative-container {
  background: var(--hbc-white);
  border: 1px solid var(--hbc-accent);
  border-radius: 0.55rem;
  box-shadow: 0 2px 6px rgba(17, 19, 24, 0.08);
  color: var(--hbc-primary);
  line-height: 1.45;
  padding-bottom: 0.55em;
  padding-top: 0.55em;
  text-indent: -2em;
}

.h5p-multichoice .h5p-answer:not([aria-disabled="true"]):hover .h5p-alternative-container {
  background: var(--hbc-accent-soft);
  border-color: var(--hbc-primary);
}

.h5p-multichoice .h5p-answer .h5p-alternative-container:before {
  color: var(--hbc-primary);
}

.h5p-multichoice .h5p-answer:focus {
  outline: none;
}

.h5p-multichoice .h5p-answer:focus-visible .h5p-alternative-container {
  border-color: var(--hbc-primary);
  box-shadow: 0 0 0 3px var(--hbc-focus-ring);
  outline: none;
}

.h5p-multichoice .h5p-answer[aria-checked="true"] .h5p-alternative-container {
  background: var(--hbc-info-bg);
  border: 2px solid var(--hbc-primary);
  color: var(--hbc-primary);
  box-shadow: none;
}

.h5p-multichoice .h5p-answer.h5p-correct .h5p-alternative-container,
.h5p-multichoice .h5p-answer.h5p-correct:hover .h5p-alternative-container {
  background: var(--hbc-success-bg);
  border-color: var(--hbc-success);
  color: var(--hbc-success);
  box-shadow: none;
}

.h5p-multichoice .h5p-answer.h5p-wrong .h5p-alternative-container,
.h5p-multichoice .h5p-answer.h5p-wrong:hover .h5p-alternative-container {
  background: var(--hbc-error-bg);
  border-color: var(--hbc-error);
  color: var(--hbc-error);
  box-shadow: none;
}

.h5p-multichoice .h5p-correct .h5p-answer-icon:before {
  color: var(--hbc-success);
}

.h5p-multichoice .h5p-wrong .h5p-answer-icon:before {
  color: var(--hbc-error);
}

/* Summary */
.h5p-summary .summary-progress-numeric {
  background: var(--hbc-success-bg);
  border: 1px solid var(--hbc-success);
  border-radius: 0.4rem;
  color: var(--hbc-success);
  font-weight: 600;
  padding: 0.2em 0.45em;
}

.h5p-summary .summary-progress-numeric:before {
  color: var(--hbc-success);
}

.h5p-summary .summary-options li {
  background: var(--hbc-white);
  border: 1px solid var(--hbc-line);
  border-radius: 0.55rem;
  box-shadow: 0 2px 6px rgba(17, 19, 24, 0.08);
  color: var(--hbc-text);
}

.h5p-summary .h5p-panel:not(.panel-disabled) .summary-claim-unclicked:hover {
  background: var(--hbc-info-bg);
  border-color: var(--hbc-primary);
}

.h5p-summary li.summary-failed,
.h5p-summary li.summary-failed > p {
  background: var(--hbc-error-bg);
  border-color: var(--hbc-error);
  color: var(--hbc-error);
}

.h5p-summary li.summary-failed:before,
.h5p-summary .summary-score:before {
  color: var(--hbc-error);
}

/* Drag Text */
.h5p-drag-text [aria-dropeffect] {
  background: var(--hbc-info-bg);
  border: 1px dashed var(--hbc-primary);
}

.h5p-drag-text [aria-grabbed] {
  background: var(--hbc-white);
  border: 1px solid var(--hbc-line);
  color: var(--hbc-text);
}

.h5p-drag-text [aria-grabbed="true"],
.h5p-drag-text [aria-grabbed]:not(.ui-draggable-disabled):hover {
  background: var(--hbc-accent-soft);
  border-color: var(--hbc-accent);
  color: var(--hbc-primary);
}

.h5p-drag-text [aria-dropeffect].h5p-drag-correct-feedback {
  background: var(--hbc-success-bg);
  border-color: var(--hbc-success);
}

.h5p-drag-text [aria-dropeffect].h5p-drag-wrong-feedback {
  background: var(--hbc-error-bg);
  border-color: var(--hbc-error);
}

.h5p-drag-text .h5p-drag-correct-feedback:before {
  color: var(--hbc-success);
}

.h5p-drag-text .h5p-drag-wrong-feedback:before {
  color: var(--hbc-error);
}

/* Choix d'engagement GoToQuestion */
.h5p-gotoquestion-wrapper,
.h5p-gotoquestion-choices {
  background: var(--hbc-gray-bg);
}

.h5p-gotoquestion-text,
.h5p-gotoquestion-chosentext {
  background: var(--hbc-secondary);
  color: var(--hbc-on-secondary);
}

.h5p-gotoquestion-button {
  background: var(--hbc-white);
  border: 1px solid var(--hbc-line);
  border-bottom: 3px solid var(--hbc-accent);
  color: var(--hbc-text);
  font-family: "Poppins", Arial, sans-serif;
}

.h5p-gotoquestion-button[aria-disabled="false"]:hover,
.h5p-gotoquestion-button[aria-disabled="false"]:focus-visible {
  border-color: var(--hbc-primary);
  color: var(--hbc-primary);
  outline: 3px solid var(--hbc-focus-ring);
  outline-offset: 2px;
}

.h5p-gotoquestion-button[aria-disabled="false"]:active,
.h5p-gotoquestion-chosen,
.h5p-gotoquestion-chosen:hover,
.h5p-gotoquestion-chosen:focus {
  background: var(--hbc-secondary);
  color: var(--hbc-on-secondary);
}

.h5p-gotoquestion-continuemsg {
  color: var(--hbc-primary);
}

@media (prefers-reduced-motion: reduce) {
  .h5p-content *,
  .h5p-content *::before,
  .h5p-content *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}
