/* ===== DRAG THE WORDS (DTW) ===== */
.dtw-widget{
  /*border:2px solid #e7eef6;*/
  border-radius:10px;
  padding:0px 5px 5px 5px;
  background:#fff;
  max-width:900px;
  font-family:Arial, system-ui, sans-serif;
}

/* KaTeX inline (typo) 
.dtw-widget .katex{ font-size: 1em; font-family: arial;}
.dtw-widget .katex .msupsub {font-style: italic;}*/


/* Questions */
.dtw-widget .dtw-questions p{
  margin:10px 0;
  font-size:1.05rem;
  line-height:1.5;
}

/* Banque */
.dtw-widget .dtw-bank{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:5px;
  border-bottom: 1px solid #e7eef6;
  padding-bottom: 5px;
}
/* Case (drop) : même gabarit qu’un input */
.dtw-widget .dtw-blank{
  display:inline-flex;
  /*align-items:center;*/
  vertical-align:middle;
  min-height:30px;
  box-sizing:border-box;
  min-width:100px;
  max-width:280px;
  padding:6px 10px;
  padding-right:34px;
  margin:0 6px;
  border:2px solid #cfd9e6;
  border-radius:8px;
  font:inherit;
  font-size:1rem;
  line-height:normal;
  background:#fafcff;
  color:#0f172a;
  user-select:none;
  text-align:left;
  position:relative;
}

/* Survol drop */
.dtw-widget .dtw-blank.is-over{
  border-color:#2b7bbb;
  background:#eef6ff;
}
.dtw-widget .dtw-blank[data-filled="1"]{
  background:#fff;
}

/* Résultat */
.dtw-widget .dtw-blank.ok{
  border-color:#06752c;
  background:#f3fbf6;
  color:#035720;
}
.dtw-widget .dtw-blank.ko{
  border-color:#d64545;
  background:#fff0f0;
  color:#5a0f0f;
}

/* ✅ DTW : blank non remplie (après clic "Vérifier") */
.dtw-widget .dtw-blank.is-missed{
  border:2px dashed #d64545;
  border-radius:3px;
  background:#fafcff;;
}


/* ===== Réponse fournie par la correction ===== */
.dtw-widget .dtw-blank.is-solution{
  border:2px dashed #ffb913;
  background:rgba(255, 245, 191, 0.54);
  color:#6a4d08 !important;
}

/* Croix */
.dtw-widget .dtw-x{
  display:none;
  position:absolute;
  right:6px;
  top:50%;
  transform:translateY(-50%);
  padding:2px 8px;
  background:transparent;
  color:#0f4c5c;
  font-weight:800;
  cursor:pointer;
}
.dtw-widget .dtw-blank.ok .dtw-x{ color:#035720 !important; }
.dtw-widget .dtw-blank.ko .dtw-x{ color:#d64545; }

.dtw-widget .dtw-blank[data-filled="1"] .dtw-x{ display:inline-block; }

/* ===== Suppression des croix après correction ===== */
.dtw-widget.is-corrected .dtw-x{
  display:none !important;
}

.dtw-count {
  margin-left: 10px;
  font-size: 8pt;
  font-weight: normal;
  color: #0f4c5c;
  opacity: .3;
}


.dtw-widget .dtw-word{
  padding: 4px 10px;
  font-size: 14pt;
  border-radius: 999px;
  border: 1px solid #cfd9e6;
  background: #f0f3f6;
  color: #0f4c5c;
  font-weight: normal;
  cursor: grab;
  user-select: none;
  text-transform: none;
  font-family: arial;
}
.dtw-widget .dtw-word:hover{ filter:brightness(.97); }
.dtw-widget .dtw-word:active{ cursor:grabbing; }
.dtw-widget .dtw-word.is-used{ opacity:.45; cursor:not-allowed; }
.dtw-widget .dtw-word.is-selected{
  outline:3px solid rgba(43,123,187,.35);
  outline-offset:2px;
}

.dtw-widget .dtw-score{
  margin-left:auto;
  padding:8px 14px;
  display:inline-flex;
  align-items:center;
  font-weight:800;
  color:#0f4c5c;
  font-family: arial;
  font-size: 12pt;
}

/* Actions : mêmes boutons que blank */
.dtw-widget .dtw-actions{
  padding-top: 12px;
  border-top: 1px solid #e7eef6;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 12px;
}

.dtw-widget .dtw-actions button{
  padding: 8px 14px;
  border-radius: 8px;
  border: 1px solid #0f6d86;
  background: #147e99;
  color: #fff;
  cursor: pointer;
  -webkit-appearance: none;
  font-size: 12pt;
  font-weight: normal;
  line-height: 1.1;
  font-family: arial;
}

.dtw-widget .dtw-actions button:hover{
  filter:brightness(0.95);
}

.dtw-widget .dtw-actions .dtw-retry{
  background:#f0f3f6;
  color:#0f4c5c;
  border-color:#cfd9e6;
}

.dtw-widget .dtw-actions .dtw-solution:hover,
.dtw-widget .dtw-actions .dtw-solution.is-active{
  background:rgba(255, 245, 191, 0.54);
  color:#6a4d08;
  border:2px solid #ffb913;
}

.dtw-widget .dtw-score{
  margin-left:auto;
  padding:8px 14px;
  display:inline-flex;
  align-items:center;
  font-weight:800;
  color:#0f4c5c;
}

/* ✅ BLANKS : champ laissé vide à "Vérifier" */
.blanks-widget .bw-input.is-missed,
.blanks-widget .bw-select.is-missed,
.blanks-widget math-field.bw-input.is-missed{
  border:2px dashed #d64545 !important;
  border-radius:3px !important;
  background:transparent !important;
}

/* optionnel : si tu veux aussi un état wrapper (utile pour faux select) */
.blanks-widget .bw-input-wrap.is-missed .bw-input,
.blanks-widget .bw-input-wrap.is-missed .bw-select,
.blanks-widget .bw-input-wrap.is-missed .bw-dd-btn,
.blanks-widget .bw-input-wrap.is-missed math-field.bw-input{
  border:2px dashed #d64545 !important;
  border-radius:3px !important;
  background:transparent !important;
}