/* === CUSTOM CSS === */
$primary-color: #202020;
$background-color: #FFFFFF;
$secondary-color: #FFFFFF;
$font-color: #202020;

$extra-color: #e638c5; // Este color varía según plantilla
$background-label: #ffffff; // Este color varía según plantilla
$background-label-hover-checked: #000000; // Este color varía según plantilla
$color-label: #000000; // Este color varía según plantilla
$color-label-hover: #ffffff; // Este color varía según plantilla
$font-size-15: 15.008px;

/** 08 09 2022 **/

.home_layout .m_action_link {
  display: none;
}

h1 {
  letter-spacing: .05rem;
}

.wrapper.home_layout {
  .m_header_title {
    margin-bottom: 26px;
    padding-bottom: 25px;
  }

  .section {
    padding: 0 69px;
  }

  .headline_row {
    padding-bottom: 22px;
  }
}

.m_header_title,
.m_tab_nav_item,
.form_fields .form_input input,
.form_fields .form_input textarea,
.m_wysiwyg textarea,
.select_content,
.row+.row,
.fields,
.fields+.row,
.pagination a {
  border-bottom: 1px solid $extra-color;
}

.m_banner {
  border-bottom: 4px solid $primary-color;
}

// Formulary
.section-form-contender {
  padding: 0 55px;
}

.error,
.notice,
.error_explanation {
  font-size: $font-size-15;
  text-transform: uppercase !important;
  font-weight: 100;
  letter-spacing: 0;
}

.wizard>.steps::before,
.wizard>.steps ul>li::after {
  content: none;
}

.wizard>.steps ul>li>a,
.wizard>.steps ul>li>a:hover,
.wizard>.steps ul>li>a:focus,
.wizard>.steps ul>li>a:active {
  padding: 0.1em !important;
  width: 30px;
}

.wizard>.steps ul li.current a,
.wizard>.steps .done a {
  background-color: $primary-color  !important;
  border: solid 1px $primary-color;

  span {
    color: $secondary-color;
  }
}

.wizard>.steps .disabled a,
.wizard>.steps .disabled a:hover,
.wizard>.steps .disabled a:active {
  background: $secondary-color;
  border: solid 1px $extra-color;
}

.wizard>.steps .number {
  font-size: $font-size-15;
  font-weight: 100;
}

.wizard>.steps ul>li>a,
.wizard>.steps ul>li>span {
  color: $font-color;
}

form.js_participation_form_wizard:not(.two_steps_quiz) .header_step {
  margin-bottom: 20px;

  .quizz_question {
    text-align: center;

    &.step_error {
      color: $font-color  !important;
      background-color: transparent;
    }
  }
}

form .header_step .quizz_question {
  font-size: 1em;
  font-weight: normal !important;
  letter-spacing: inherit;
}

.js_quizz_question .js_answer_image {
  margin: 0 auto;
  width: 100%;
}

.li_wrapper .m_options_list_input .m_option label:not(.step_error),
.m_tabs_nav {
  padding: 17px 5px 14px;
  text-align: center;
  border-color: $extra-color  !important;
  background-color: $background-label  !important;
  color: $color-label  !important;
  letter-spacing: 0;
  font-weight: 100;
  font-size: $font-size-15;
  transition: all .3s ease-in-out;

  &:hover {
    background-color: $background-label-hover-checked  !important;
    border-color: $background-label-hover-checked  !important;
    color: $color-label-hover  !important;
  }
}

.control-point, .control-checks input:disabled ~ .control-point {
  opacity: 0;
}

.m_option_input:checked+.m_option_label {
  background-color: $background-label  !important;
  color: $color-label  !important;
  border-color: $extra-color  !important;
}

.control-checks-link input:checked~.control-point::after,
.control-checks:not(.js_quizz_question_ok):not(.js_quizz_question_ko):not(.no-answer-with-image) .no-answer.video-answer input:checked~label:not(.image_description),
.control-checks:not(.js_quizz_question_ok):not(.js_quizz_question_ko):not(.no-answer-with-image) input:checked~label:not(.image_description),
.control-checks:not(.js_quizz_question_ok):not(.js_quizz_question_ko) .video-answer input:checked~label:not(.image_description),
.control-checks:not(.js_quizz_question_ok):not(.js_quizz_question_ko) .m_options_list_input:not(.no-answer) input:checked~label:not(.image_description) {
  background-color: $background-label-hover-checked  !important;
  border-color: $background-label-hover-checked  !important;
  color: $color-label-hover  !important;
}

.form_fields ol.align-items-end,
.form_fields ul.align-items-end {
  align-items: flex-start !important;
}

.actions ul li a[href="#next"],
.actions ul li a[href="#previous"],
.actions ul li a[href="#finish"],
.actions ul li button[href="#next"],
.actions ul li button[href="#previous"],
.actions ul li button[href="#finish"] {
  font-size: 1rem;
}

#error_explanation,
.m_entries_entry_info .error,
.m_actions_viewport .error,
.wizard>.steps .step_error a,
.m_header_step label.step_error,
.form_fields .form_input label.step_error,
.form_checkbox label.step_error,
.js_error_placement_parent .js_error_placement .step_error,
.form_select .step_error,
.wizard>.content>.body label.step_error {
  color: $extra-color  !important;
  background-color: transparent;
}

.pagination,
.m_header>*,
.m_popup_header {
  text-align: center;
  font-size: 30px;
  letter-spacing: .05;
}

// Thank you page


.entry_layout {
  .notice {
    display: none;
  }

  .raw-contender {
    h1,
    h2,
    h3 {
      font-weight: normal !important;
      font-size: 24px;
      letter-spacing: .15rem;
      text-align: center !important;
      color: $extra-color;
    }
  }
}
/* Cambios 28-09-2022 para formulario en 1 columna*/
.section-form-contender {
  padding: 0;
}
.wizard > .content {
  margin: 0 auto !important;
  @media screen and (min-width: 768px) {
    padding: 0;
  }
}
.form_fields .form_input ul{
  -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  li.m_options_list_item.col-md-6{
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
  }
}
.wizard > .steps {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 0;
}
.home_layout .m_action_link.my_participation_link {
 display: none;
}