fieldset > legend {
  display: block !important;
  font-weight: initial;
  padding-left: 5px;
  border-top: 1px solid #32c5d2;
  border-left: 4px solid #32c5d2;
  border-bottom: 0px !important;
  margin-bottom: 4px;
  font-weight: 525;
  font-size: 18px;
}

#edit-acconsento-finalita-survey > .c-checkbox input[type="checkbox"]:checked ~ label > .check {
  opacity: 0;
}

#edit-terms-of-service {
  opacity: 0;
}

#edit-actions-wizard-next {
  padding: 20px 60px !important;
}

.c-checkbox input[type="checkbox"] {
  visibility: visible;
  position: absolute;
}

fieldset input[type="checkbox"] {
  opacity: 0;
}

#edit-actions {
  text-align: center !important;
}

.form-item-acconsento-finalita-survey {
  padding-top: 8px;
}

.form-group .form-item {
  border: 1px solid #cccece !important;
  padding: 2px;
}

.form-actions .btn-medium {
  margin-top: 34px !important;
  padding: 20px !important;
}

.img-webform-vert {
 display: block !important;
}

#edit-processed-text-consenso,
#edit-processed-text-a,
#edit-processed-text-b,
#edit-processed-text-c,
#edit-processed-text-d,
#edit-processed-text-e,
#edit-processed-text-f,
#edit-processed-text-g {
  padding-top: 8px !important;
}

#processed_text_consenso {
  margin-bottom: 0 !important;
  padding-top: 8px !important;
}

#edit-html-info {
  border-top: 0px !important;
}

#edit-html-info-2 {
  border-top: 0px !important;
}

#edit-acconsento-finalita-survey {
  width: 20px;
  height: 20px;
  margin-top: 1px;
}

#edit-acconsento-marketing {
  width: 20px;
  height: 20px;
  margin-top: 1px;
}

#content {
  width: 100% !important;
}

/* Contenitore principale invio completato */
.invio-completato-container {
    max-width: 800px;
    margin: 0 auto;
    font-family: sans-serif;
}
.invio-completato-container {
    background: #f9f9f9;
    padding: 30px 30px 5px 30px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    text-align: center;
    margin-top: 20px;
    border-top: 5px solid #ccc;
}
/* Stili per il testo */
.invio-completato-text p {
    margin-bottom: 1.2em;
}
/* Grassetto nel testo */
.invio-completato-text strong {
    font-weight: 700;
}
.invio-completato-text {
    font-size: 22px;
    line-height: 1.6;
    text-align: center;
    color: #333;
}

.form-item {
  margin-right: 0 !important;
}

/* Regola comune incolonnamento per radio e checkboxes */
fieldset.webform-type-radios .fieldset-wrapper .form-item,
fieldset.webform-type-checkboxes .fieldset-wrapper .form-item {
  display: block;
}

.form-item-terms-of-service {
  padding-top: 10px;
}

/* Regola titoli sezioni */
#edit-processed-text-consenso {
  margin-top: 0 !important;
  border-bottom: 2px solid #32c5d2 !important;
  border-top: none !important
}
#edit-processed-text-consenso p{
  margin: 0 0 6px !important;
}
#edit-processed-text-a {
  margin-top: 0 !important;
  border-bottom: 2px solid #32c5d2 !important;
  border-top: none !important
}
#edit-processed-text-a p{
  margin: 0 0 6px !important;
}
#edit-processed-text-b {
  margin-top: 0 !important;
  border-bottom: 2px solid #32c5d2 !important;
  border-top: none !important
}
#edit-processed-text-b p{
  margin: 0 0 6px !important;
}
#edit-processed-text-c {
  margin-top: 0 !important;
  border-bottom: 2px solid #32c5d2 !important;
  border-top: none !important
}
#edit-processed-text-c p{
  margin: 0 0 6px !important;
}
#edit-processed-text-d {
  margin-top: 0 !important;
  border-bottom: 2px solid #32c5d2 !important;
  border-top: none !important
}
#edit-processed-text-d p{
  margin: 0 0 6px !important;
}
#edit-processed-text-e {
  margin-top: 0 !important;
  border-bottom: 2px solid #32c5d2 !important;
  border-top: none !important
}
#edit-processed-text-e p{
  margin: 0 0 6px !important;
}
#edit-processed-text-f {
  margin-top: 0 !important;
  border-bottom: 2px solid #32c5d2 !important;
  border-top: none !important
}
#edit-processed-text-f p{
  margin: 0 0 6px !important;
}
#edit-processed-text-g {
  margin-top: 0 !important;
  border-bottom: 2px solid #32c5d2 !important;
  border-top: none !important
}
#edit-processed-text-g p{
  margin: 0 0 6px !important;
}

.tippy-box {
  background-color: #007f8a !important;
}

.webform-progress-tracker .progress-step.is-complete .progress-marker::before, .webform-progress-tracker .progress-step.is-complete:hover .progress-marker::before, .webform-progress-tracker .progress-step.is-complete .progress-marker::after {
    background-color: #25a2ad;
}

.webform-progress-tracker .progress-step.is-active:hover .progress-marker::before {
    background-color: #32c5d2;
}

.progress-step.is-active .progress-marker::before {
    background-color: #32c5d2;
}

.form-group js-form-item form-item js-form-type-email form-item-email-mail-1 js-form-item-email-mail-1 {
    border: 0px !important;
}

@media screen and (max-width: 768px) {
  .webform-type-radios .form-item {
    display: flex !important;
    align-items: flex-start !important;
    margin-bottom: 12px !important;
  }
  .webform-type-radios input[type="radio"] {
    margin-top: 4px !important;
    margin-right: 8px !important;
    flex-shrink: 0 !important;
  }
}

/* Correzione specifica per le Checkbox della domanda 1 */
@media screen and (max-width: 768px) {
  .webform-type-checkboxes .form-item {
    display: flex !important;
    align-items: center !important;
    margin-bottom: 12px !important;
  }
  
  .webform-type-checkboxes input[type="checkbox"] {
    margin-right: 10px !important;
    flex-shrink: 0 !important;
  }
}

/* TEMA_CON_BACKGROUND */
.nd-region {
  background-color: #c1ffea;
  background-image: url("https://www.puerimed.it/sites/default/files/survey-background.jpg");
  background-repeat: no-repeat;
  background-size: cover;
}

#edit-acconsento-finalita-survey {
  /* position: inherit; */
  opacity: 0;
}

#edit-introduzione,
#edit-consenso,
#edit-sezione-a-dati-anagrafici,
#edit-sezione-b-infrastruttura-digitale,
#edit-sezione-c-conoscenza-telemedicina,
#edit-sezione-d-intelligenza-artificiale,
#edit-sezione-e-contesto-regionale,
#edit-sezione-f-atteggiamento-cambiamento,
#edit-sezione-g-priorita-investimento {
  text-align: initial !important;
}

#edit-introduzione,
#edit-consenso,
#edit-sezione-a-dati-anagrafici,
#edit-sezione-b-infrastruttura-digitale,
#edit-sezione-c-conoscenza-telemedicina,
#edit-sezione-d-intelligenza-artificiale,
#edit-sezione-e-contesto-regionale,
#edit-sezione-f-atteggiamento-cambiamento,
#edit-sezione-g-priorita-investimento {
  background: #f9f9f9;
  padding: 30px 30px 5px 30px;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.1);
  text-align: center;
  max-width: 800px;
  margin: 0 auto;
  margin-top: 0px;
}

.webform-progress > .webform-progress-tracker {
  background-color: #f0f8ff4f;
  padding: 10px 0;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

/* CUSTOM RADIO AS CHECKBOX CSS CLASS */
/* --- Radio con aspetto checkbox, box cliccabile --- */

/* Contenitore */
.radios-as-checkboxes .js-webform-radios {
  display: flex !important;
  flex-direction: column;
  gap: .75rem;
  width: 100%;
  margin: 0;
  padding: 0;
}

/* Box di ogni opzione */
.radios-as-checkboxes .js-webform-radios > .js-form-type-radio,
.radios-as-checkboxes .js-webform-radios > .js-form-type-radio.form-group {
  position: relative;
  margin: 0 !important;
  padding: .9rem 1rem .9rem 3.4rem !important;
  border: 2px solid #d3d3d3;
  border-radius: 0;
  background: #fff;
  transition: background-color .15s ease, border-color .15s ease;
}

/* Neutralizza il wrapper intermedio di Drupal */
.radios-as-checkboxes .js-form-type-radio > .form-group,
.radios-as-checkboxes .js-form-type-radio > .form-group.has-feedback {
  position: static !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
}

/* Label */
.radios-as-checkboxes .js-form-type-radio label,
.radios-as-checkboxes label.option {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  cursor: pointer;
  font-weight: normal;
  line-height: 1.35;
}

/* Area cliccabile su tutto il box */
.radios-as-checkboxes .js-form-type-radio label::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
}

/* Quadratino */
.radios-as-checkboxes input[type="radio"] {
  appearance: none !important;
  -webkit-appearance: none !important;
  position: absolute !important;
  left: 1rem !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 1.15em !important;
  height: 1.15em !important;
  min-width: 0;
  flex: none;
  border: 1px solid #767676;
  border-radius: 0;
  background: #fff;
  box-shadow: none !important;
  outline: none !important;
  z-index: 2;
  cursor: pointer;
}

.radios-as-checkboxes input[type="radio"]:focus,
.radios-as-checkboxes input[type="radio"]:focus-visible,
.radios-as-checkboxes input[type="radio"]:active {
  outline: none !important;
  box-shadow: none !important;
}

.radios-as-checkboxes input[type="radio"]:checked {
  background: #32c5d2;
  border-color: #25a2ad;
}

.radios-as-checkboxes input[type="radio"]:checked::after {
  content: "";
  position: absolute;
  left: .36em;
  top: .12em;
  width: .28em;
  height: .6em;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* Hover solo su puntatore */
@media (hover: hover) {
  .radios-as-checkboxes .js-webform-radios > .js-form-type-radio:hover {
    border-color: #9bbdd4;
    background: #fbfdfe;
  }
}

/* Focus da tastiera */
.radios-as-checkboxes .js-webform-radios > .js-form-type-radio:has(input:focus-visible) {
  outline: 2px solid #0074bd;
  outline-offset: 2px;
}

/* Stato selezionato: bordo blu su tutto il box */
.radios-as-checkboxes .js-webform-radios > .js-form-type-radio:has(input:checked) {
  border-color: #25a2ad !important;
  background: #d6eef0;
}

.radios-as-checkboxes .js-webform-radios > .js-form-type-radio:has(input:checked) label {
  font-weight: 600;
  color: #0d3d5c;
}

/* Fieldset / legenda */
.radios-as-checkboxes .fieldset-wrapper {
  width: 100%;
  margin: 0;
}

.radios-as-checkboxes legend {
  margin-bottom: .75rem;
}

.radios-as-checkboxes.webform-container-inline > .fieldset-wrapper {
  width: 100%;
}

/* CUSTOM CHECKBOXES — identici ai radio trasformati */

/* Contenitore */
.checkboxes-styled .js-webform-checkboxes {
  display: flex !important;
  flex-direction: column;
  gap: .75rem;
  width: 100%;
  margin: 0;
  padding: 0;
}

/* Box di ogni opzione */
.checkboxes-styled .js-webform-checkboxes > .js-form-type-checkbox,
.checkboxes-styled .js-webform-checkboxes > .js-form-type-checkbox.form-group {
  position: relative;
  margin: 0 !important;
  padding: .9rem 1rem .9rem 3.4rem !important;
  border: 2px solid #d3d3d3;
  border-radius: 0;
  background: #fff;
  transition: background-color .15s ease, border-color .15s ease;
}

/* Neutralizza il wrapper del tema (.c-checkbox) */
.checkboxes-styled .js-form-type-checkbox > .c-checkbox {
  position: static !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
}

/* Nasconde la label decorativa del tema (quella con gli span) */
.checkboxes-styled .js-form-type-checkbox > .c-checkbox > label {
  display: none !important;
}

/* Nasconde comunque gli span decorativi, ovunque siano */
.checkboxes-styled .js-form-type-checkbox .inc,
.checkboxes-styled .js-form-type-checkbox .check,
.checkboxes-styled .js-form-type-checkbox .box {
  display: none !important;
}

/* Label visibile */
.checkboxes-styled .js-form-type-checkbox > label.option {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  cursor: pointer;
  font-weight: normal;
  line-height: 1.35;
}

/* Area cliccabile su tutto il box */
.checkboxes-styled .js-form-type-checkbox > label.option::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
}

/* Quadratino */
.checkboxes-styled input[type="checkbox"] {
  appearance: none !important;
  -webkit-appearance: none !important;
  position: absolute !important;
  left: 1rem !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 1.15em !important;
  height: 1.15em !important;
  min-width: 0;
  flex: none;
  border: 1px solid #767676;
  border-radius: 0;
  background: #fff;
  box-shadow: none !important;
  outline: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  z-index: 2;
  cursor: pointer;
}

.checkboxes-styled input[type="checkbox"]:focus,
.checkboxes-styled input[type="checkbox"]:focus-visible,
.checkboxes-styled input[type="checkbox"]:active {
  outline: none !important;
  box-shadow: none !important;
}

.checkboxes-styled input[type="checkbox"]:checked {
  background: #32c5d2;
  border-color: #25a2ad;
}

.checkboxes-styled input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  left: .36em;
  top: .12em;
  width: .28em;
  height: .6em;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* Hover solo su puntatore */
@media (hover: hover) {
  .checkboxes-styled .js-webform-checkboxes > .js-form-type-checkbox:hover {
    border-color: #9bbdd4;
    background: #fbfdfe;
  }
}

/* Focus da tastiera */
.checkboxes-styled .js-webform-checkboxes > .js-form-type-checkbox:has(input:focus-visible) {
  outline: 2px solid #0074bd;
  outline-offset: 2px;
}

/* Stato selezionato */
.checkboxes-styled .js-webform-checkboxes > .js-form-type-checkbox:has(input:checked) {
  border-color: #25a2ad !important;
  background: #d6eef0;
}

.checkboxes-styled .js-webform-checkboxes > .js-form-type-checkbox:has(input:checked) > label.option {
  font-weight: 600;
  color: #0d3d5c;
}

/* Fieldset / legenda */
.checkboxes-styled .fieldset-wrapper {
  width: 100%;
  margin: 0;
}

.checkboxes-styled legend {
  margin-bottom: .75rem;
}

.checkboxes-styled.webform-container-inline > .fieldset-wrapper {
  width: 100%;
}

.webform-submission-form fieldset .fieldset-wrapper {
  display: flex;
  flex-direction: column;
}

.webform-submission-form fieldset .fieldset-wrapper > .description {
  order: -1;
  margin-bottom: .5rem;
}

.mx-off { opacity: .45; }
.mx-off label { cursor: not-allowed; }

/* ===================================================================
   LIKERT → CARD VERTICALI
   =================================================================== */

/* 1. smontaggio della tabella -------------------------------------- */
.webform-likert-table-wrapper { overflow: visible !important; }
.js-form-type-webform-likert .tableresponsive-toggle-columns { display: none !important; }
/* clone volante generato da core/drupal.tableheader */
.webform-likert-table-wrapper > table.sticky-header:not(.webform-likert-table) { display: none !important; }

.webform-likert-table { display: block !important; border: 0 !important; margin: 0 !important; }
.webform-likert-table > thead { display: none !important; }
.webform-likert-table > tbody { display: block !important; }

.webform-likert-table > tbody > tr,
.webform-likert-table > tbody > tr > td {
  display: block !important;
  width: auto !important;
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}
.webform-likert-table > tbody > tr:hover { background: none !important; }

/* 2. la riga diventa il blocco-statement, con rail teal ------------- */
.webform-likert-table > tbody > tr {
  border-left: 3px solid #a8e2e8 !important;
  margin: 0 0 0 5px !important;
  padding: 0 0 22px 15px !important;
}

/* 3. testo dello statement ----------------------------------------- */
.webform-likert-table > tbody > tr > td:first-child { padding: 0 0 12px !important; }
.webform-likert-table > tbody > tr + tr > td:first-child {
  border-top: 1px solid #e2e6e8 !important;
  padding-top: 16px !important;
}
.webform-likert-table td:first-child > .js-form-item {
  border: 0 !important; background: none !important;
  margin: 0 !important; padding: 0 !important;
}
.webform-likert-table td:first-child label {
  display: block !important;
  margin: 0 !important;
  padding: 0 0 0 13px !important;
  border-left: 5px solid #32c5d2;
  font-weight: 700;
  font-size: 17px;
  line-height: 1.3;
  color: #243740;
}

/* 4. ogni cella-risposta diventa una card -------------------------- */
.webform-likert-table td + td { margin: 0 !important; }
.webform-likert-table td:last-child { margin-bottom: 0 !important; }

.webform-likert-table td + td > .js-form-type-radio {
  position: relative !important;
  display: block !important;
  margin: 0 !important;
  padding: .9rem 1rem .9rem 3.4rem !important;
  border: 2px solid #d3d3d3 !important;
  border-radius: 0 !important;
  background: #fff !important;
  transition: background-color .15s ease, border-color .15s ease;
}
.webform-likert-table td + td > .js-form-type-radio > .form-group,
.webform-likert-table td + td > .js-form-type-radio > .form-group.has-feedback {
  position: static !important;
  margin: 0 !important; padding: 0 !important;
  border: 0 !important; background: none !important;
}

/* 5. l'etichetta della risposta esiste già: la si smette di nascondere
      (vale anche quando le risposte sono testuali) --------------- */
.webform-likert-table .webform-likert-label.visually-hidden {
  position: static !important;
  clip: auto !important;
  clip-path: none !important;
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
  white-space: normal !important;
  margin: 0 !important;
  padding: 0 !important;
}
.webform-likert-table td + td label.option {
  display: block !important;
  margin: 0 !important; padding: 0 !important;
  cursor: pointer;
  font-weight: normal;
  line-height: 1.35;
}
/* bersaglio = tutta la card */
.webform-likert-table td + td label.option::before {
  content: ""; position: absolute; inset: 0; z-index: 0;
}

/* 6. controllo, identico alle altre domande della webform ---------- */
.webform-likert-table td + td input[type="radio"] {
  appearance: none !important; -webkit-appearance: none !important;
  position: absolute !important;
  left: 1rem !important; top: 50% !important;
  transform: translateY(-50%) !important;
  margin: 0 !important; padding: 0 !important;
  width: 1.15em !important; height: 1.15em !important;
  min-width: 0; flex: none;
  border: 1px solid #767676 !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important; outline: none !important;
  z-index: 2; cursor: pointer;
}
.webform-likert-table td + td input[type="radio"]:checked {
  background: #32c5d2 !important;
  border-color: #25a2ad !important;
}
.webform-likert-table td + td input[type="radio"]:checked::after {
  content: "";
  position: absolute;
  left: .36em; top: .12em;
  width: .28em; height: .6em;
  border: solid #fff; border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* 7. stati --------------------------------------------------------- */
.webform-likert-table td + td > .js-form-type-radio:has(input:checked) {
  border-color: #25a2ad !important;
  background: #d6eef0 !important;
}
.webform-likert-table td + td > .js-form-type-radio:has(input:checked) label.option {
  font-weight: 600;
  color: #0d3d5c;
}
@media (hover: hover) {
  .webform-likert-table td + td > .js-form-type-radio:hover {
    border-color: #9bbdd4 !important;
    background: #fbfdfe !important;
  }
}
.webform-likert-table td + td > .js-form-type-radio:has(input:focus-visible) {
  outline: 2px solid #0074bd;
  outline-offset: 2px;
}
/* --- le celle-risposta ereditano il centraggio dal CSS del likert --- */
.webform-likert-table td + td,
.webform-likert-table td + td > .js-form-type-radio,
.webform-likert-table td + td label.option,
.webform-likert-table td + td .webform-likert-label {
  text-align: left !important;
}
/* --- descrizione subito sotto il titolo, prima delle voci --- */
.js-form-type-webform-likert { display: flex !important; flex-direction: column; }
.js-form-type-webform-likert > label { order: 1; margin-bottom: 6px !important; }
.js-form-type-webform-likert > .description,
.js-form-type-webform-likert > .help-block,
.js-form-type-webform-likert > .form-item__description,
.js-form-type-webform-likert > .webform-element-description { order: 2; }
.js-form-type-webform-likert > .webform-likert-table-wrapper { order: 3; }

.js-form-type-webform-likert > .description,
.js-form-type-webform-likert > .help-block,
.js-form-type-webform-likert > .form-item__description,
.js-form-type-webform-likert > .webform-element-description {
  margin: 0 0 16px !important;
  padding: 10px 14px;
  background: #eef8f9;
  border-left: 3px solid #a8e2e8;
  border-radius: 0;
  font-size: 14.5px;
  line-height: 1.45;
  font-style: normal;
  color: #4a5a63;
  text-align: left !important;
}

/* ===================================================================
   ACCORDION
   =================================================================== */

/* 1. tutte le risposte chiuse */
.webform-likert-table-wrapper:not(.lk-acc) > .webform-likert-table > tbody > tr > td + td {
  display: none !important;
}

/* 2. la prima voce, finché è senza risposta, è aperta */
.webform-likert-table-wrapper:not(.lk-acc) > .webform-likert-table > tbody
  > tr:first-child:not(:has(input:checked)) > td + td {
  display: block !important;
}

/* 3. si apre la voce che segue una già compilata */
.webform-likert-table-wrapper:not(.lk-acc) > .webform-likert-table > tbody
  > tr:has(input:checked) + tr:not(:has(input:checked)) > td + td {
  display: block !important;
}

/* 4. in una voce compilata resta la sola card scelta: è il riepilogo */
.webform-likert-table-wrapper:not(.lk-acc) > .webform-likert-table > tbody
  > tr:has(input:checked) > td + td:has(input:checked) {
  display: block !important;
}

/* 5. rimossa: la riapertura via :focus-within sposta il layout
      tra mousedown e mouseup e fa perdere il click */

/* 6. voce compilata e chiusa: rail pieno */
.webform-likert-table-wrapper:not(.lk-acc) > .webform-likert-table > tbody
  > tr:has(input:checked) {
  border-left-color: #32c5d2 !important;
  padding-bottom: 14px !important;
}
/* ===================================================================
   ACCORDION CON JS — attivo solo quando lo script aggiunge .lk-acc
   =================================================================== */

/* chiuso / aperto */
.lk-acc > .webform-likert-table > tbody > tr > td + td { display: none !important; }
.lk-acc > .webform-likert-table > tbody > tr.lk-open > td + td { display: block !important; }

.lk-acc > .webform-likert-table > tbody > tr { padding-bottom: 0 !important; }
.lk-acc > .webform-likert-table > tbody > tr.lk-open {
  padding-bottom: 20px !important;
  border-left-color: #32c5d2 !important;
}

/* l'intestazione è il comando */
.lk-acc .lk-head { cursor: pointer; }
.lk-acc .lk-head:focus-visible { outline: 2px solid #0074bd; outline-offset: 2px; }
.lk-acc .lk-head label { padding-right: 26px !important; }

/* chevron */
.lk-acc .lk-head > .js-form-item { position: relative; }
.lk-acc .lk-head > .js-form-item::after {
  content: "";
  position: absolute; right: 4px; top: 5px;
  width: 9px; height: 9px;
  border-right: 2px solid #6e7a82;
  border-bottom: 2px solid #6e7a82;
  transform: rotate(45deg);
  transition: transform .2s ease;
}
.lk-acc tr.lk-open .lk-head > .js-form-item::after { transform: rotate(-135deg); }

/* riepilogo: unico contenuto visibile a voce chiusa */
.lk-acc .lk-sum {
  display: block;
  margin: 6px 0 0 18px;
  font-size: 13.5px; line-height: 1.3;
  color: #6e7a82;
  text-align: left !important;
}
.lk-acc .lk-sum.is-set { color: #25a2ad; font-weight: 700; }
.lk-acc .lk-sum.is-set::before { content: "Risposta: "; font-weight: 400; color: #6e7a82; }
.lk-acc tr:not(.lk-open) .lk-sum.is-set::after {
  content: " · tocca per modificare";
  font-weight: 400; color: #6e7a82;
}
/* a voce aperta è ridondante: le card parlano da sole */
.lk-acc tr.lk-open .lk-sum { display: none; }

/* spaziatura sul contenitore, come nelle altre domande:
   il gap non è in competizione con nessun margin */
.webform-likert-table-wrapper > .webform-likert-table > tbody > tr {
  display: flex !important;
  flex-direction: column;
  gap: .75rem;
}
/* il titolo non ha più bisogno del proprio distacco */
.webform-likert-table-wrapper > .webform-likert-table > tbody > tr > td:first-child {
  padding-bottom: 0 !important;
}

/* ===================================================================
   TITOLI LIKERT LUNGHI: a capo entro la larghezza disponibile
   =================================================================== */

/* niente può essere più largo del contenitore */
.js-form-type-webform-likert,
.webform-likert-table-wrapper,
.webform-likert-table,
.webform-likert-table > tbody,
.webform-likert-table > tbody > tr,
.webform-likert-table > tbody > tr > td {
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box;
}

/* si annulla il nowrap ereditato dal CSS del likert */
.webform-likert-table > tbody > tr > td,
.webform-likert-table td:first-child > .js-form-item,
.webform-likert-table td:first-child label,
.webform-likert-table td + td label.option,
.webform-likert-table .webform-likert-label,
.webform-likert-table .lk-sum {
  white-space: normal !important;
  overflow-wrap: break-word;
  word-break: break-word;
}

/* il chevron resta in alto a destra: il testo non ci finisce sotto */
.lk-acc .lk-head label,
.lk-acc .lk-head .lk-sum {
  padding-right: 28px !important;
}

/* fix normal checkbox */
.c-checkbox label > .check {
  top: -5px !important;
  left: 4px !important;
}
.c-checkbox label > .box {
  margin-left: -3px !important;
}

/* ===================================================================
   TABLE SORT → CARD ORDINABILI  (Wrapper CSS classes: rank-cards)
   =================================================================== */
.rank-cards .tabledrag-toggle-weight-wrapper,
.rank-cards .tableresponsive-toggle-columns,
.rank-cards .tabledrag-hide,
.rank-cards.rk-ready .tabledrag-handle { display: none !important; }

.rank-cards table, .rank-cards thead, .rank-cards tbody,
.rank-cards tr, .rank-cards th {
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  background: none !important;
  border: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.rank-cards th {
  border-left: 5px solid #32c5d2 !important;
  padding-left: 13px !important;
  margin-bottom: 14px !important;
  font-size: 17px; font-weight: 700; line-height: 1.3; color: #243740;
  text-align: left !important; white-space: normal !important;
}

.rank-cards tbody { counter-reset: rk; }
.rank-cards tbody > tr {
  counter-increment: rk;
  margin-bottom: .75rem !important;
  transition: transform .18s ease;
}
.rank-cards tbody > tr:last-child { margin-bottom: 0 !important; }

.rank-cards td:first-child {
  display: flex !important; align-items: center; gap: 12px;
  width: auto !important;
  padding: .7rem .75rem !important;
  border: 2px solid #d3d3d3 !important;
  border-radius: 0 !important;
  background: #fff !important;
  text-align: left !important; white-space: normal !important;
  cursor: grab;
  user-select: none; -webkit-user-select: none; -webkit-touch-callout: none;
  transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.rank-cards td:first-child::before {
  content: counter(rk);
  flex: none;
  display: flex; align-items: center; justify-content: center;
  width: 30px; height: 30px;
  background: #32c5d2; border: 1px solid #25a2ad;
  color: #fff; font-size: 15px; font-weight: 600; line-height: 1;
}

.rank-cards .rk-text {
  flex: 1; min-width: 0;
  font-size: 16px; line-height: 1.35; color: #243740;
  overflow-wrap: break-word;
}

.rank-cards .rk-grip {
  flex: none; width: 12px; height: 20px; opacity: .5;
  background: radial-gradient(#8f9ba1 1.2px, transparent 1.3px) 0 1px/6px 7px;
}

.rank-cards .rk-ctrl { flex: none; display: flex; flex-direction: column; gap: 4px; }

.rank-cards .rk-btn {
  appearance: none; -webkit-appearance: none;
  display: flex; align-items: center; justify-content: center;
  width: 38px; height: 32px; margin: 0; padding: 0;
  background: #fff; border: 1px solid #cfd8db; border-radius: 0;
  box-shadow: none !important; color: #25a2ad; cursor: pointer;
  transition: background-color .15s ease, border-color .15s ease;
}
.rank-cards .rk-btn::before {
  content: ""; width: 8px; height: 8px;
  border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
}
.rank-cards .rk-up::before   { transform: rotate(-135deg); margin-top: 3px; }
.rank-cards .rk-down::before { transform: rotate(45deg); margin-bottom: 3px; }
.rank-cards .rk-btn:hover:not([disabled]) { background: #eef8f9; border-color: #25a2ad; }
.rank-cards .rk-btn[disabled] { color: #ccd4d7; border-color: #e6ebec; cursor: default; }
.rank-cards .rk-btn:focus-visible { outline: 2px solid #0074bd; outline-offset: 2px; }

@media (hover: hover) {
  .rank-cards tbody > tr:hover td:first-child {
    border-color: #9bbdd4 !important; background: #fbfdfe !important;
  }
}

.rank-cards tr.rk-drag { position: relative; z-index: 5; transition: none; }
.rank-cards tr.rk-drag td:first-child,
.rank-cards tr.rk-moved td:first-child {
  border-color: #25a2ad !important; background: #d6eef0 !important;
}
.rank-cards tr.rk-drag td:first-child {
  box-shadow: 0 8px 20px rgba(13,61,92,.18) !important; cursor: grabbing;
}

.rank-cards .rk-live {
  position: absolute !important; width: 1px; height: 1px;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); border: 0 !important;
}

@media screen and (max-width: 480px) {
  .rank-cards td:first-child { gap: 9px; padding: .6rem !important; }
  .rank-cards td:first-child::before { width: 26px; height: 26px; font-size: 14px; }
  .rank-cards .rk-text { font-size: 15px; }
  .rank-cards .rk-grip { display: none; }
  .rank-cards .rk-btn { width: 34px; height: 30px; }
}

@media (prefers-reduced-motion: reduce) {
  .rank-cards tbody > tr { transition: none !important; }
}

/* ===================================================================
   TITOLI WIZARD SU DUE RIGHE
   =================================================================== */
.webform-progress-tracker .progress-title {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  line-height: 1.25;
  padding: 0 6px;
}

.webform-progress-tracker .ps-name {
  font-size: 15px;
  font-weight: 700;
  white-space: nowrap;   /* "Sezione A" non va mai a capo */
  color: #243740;
}

.webform-progress-tracker .ps-desc {
  font-size: 12px;
  font-weight: 400 !important;  /* non eredita il bold dello step attivo */
  line-height: 1.2;
  color: #5c6a72;
  max-width: 150px;             /* regola qui quanto stretta è la colonna */
}

.webform-progress-tracker .progress-step.is-active .ps-desc { color: #25a2ad; }

/* su mobile la descrizione resta solo sullo step corrente */
@media screen and (max-width: 768px) {
  .webform-progress-tracker .ps-desc { display: none; }
  .webform-progress-tracker .progress-step.is-active .ps-desc { display: block; }
}