/*
 * DO NOT EDIT THIS FILE.
 * See the following change record for more information,
 * https://www.drupal.org/node/3084859
 * @preserve
 */

/**
 * @file
 * Checkbox and radio input elements.
 */

input[type="checkbox"],
input[type="radio"] {
  display: inline-block;
  width: 27px;
  height: 27px;
  vertical-align: text-bottom;
  border: 2px solid #7e96a7;
  border-radius: 2px;
  background-color: #f7f9fa;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 18px 18px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none
}

input[type="checkbox"]:focus, input[type="radio"]:focus {
    outline: 6px dashed transparent;
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px #53b0eb, 0 0 36px rgba(83, 176, 235, 0.25)
  }

@supports (outline-style: double) {

input[type="checkbox"]:focus, input[type="radio"]:focus {
      outline-style: double
  }
    }

input[type="checkbox"]:hover, input[type="radio"]:hover {
    border-color: #53b0eb;
  }

input[type="checkbox"][disabled], input[type="radio"][disabled] {
    opacity: 0.3;
  }

input[type="checkbox"].error, input[type="radio"].error {
    border-color: #e33f1e;
  }

input[type="checkbox"],
input[type="radio"] {

  /* Specific pseudo-element to apply red borders for IE11 bool elements in case of error */
}

input[type="checkbox"].error::-ms-check, input[type="radio"].error::-ms-check {
    border: 1px solid #e33f1e;
  }

input[type="checkbox"]:checked {
    background-image: url("data:image/svg+xml,%3Csvg width='18' height='14' viewBox='0 0 18 14' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%232494DB' d='M14.8232 0.176777C14.9209 0.0791457 15.0791 0.0791455 15.1768 0.176777L16.9445 1.94454C17.0422 2.04217 17.0422 2.20047 16.9445 2.2981L6.23744 13.0052C6.13981 13.1028 5.98151 13.1028 5.88388 13.0052L0.176777 7.2981C0.0791456 7.20047 0.0791456 7.04218 0.176777 6.94454L1.94454 5.17678C2.04217 5.07915 2.20047 5.07915 2.2981 5.17678L5.88388 8.76256C5.98151 8.86019 6.13981 8.86019 6.23744 8.76256L14.8232 0.176777Z'/%3E%3C/svg%3E%0A");
  }

input[type="radio"] {
  border-radius: 50%
}

input[type="radio"]:checked {
    background-image: url("data:image/svg+xml,%3Csvg width='17' height='17' viewBox='0 0 17 17' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='8.5' cy='8.5' r='8.5' fill='%232494DB'/%3E%3C/svg%3E%0A");
    background-size: 17px 17px;
  }

[dir="ltr"] .form-type-boolean {
  margin-left: 36px
}

[dir="rtl"] .form-type-boolean {
  margin-right: 36px
}

.form-type-boolean {
  clear: both
}

[dir="ltr"] .form-type-boolean input[type="checkbox"],[dir="ltr"] 
  .form-type-boolean input[type="radio"] {
    float: left
}

[dir="rtl"] .form-type-boolean input[type="checkbox"],[dir="rtl"] 
  .form-type-boolean input[type="radio"] {
    float: right
}

[dir="ltr"] .form-type-boolean input[type="checkbox"],[dir="ltr"] 
  .form-type-boolean input[type="radio"] {
    margin-left: -36px
}

[dir="rtl"] .form-type-boolean input[type="checkbox"],[dir="rtl"] 
  .form-type-boolean input[type="radio"] {
    margin-right: -36px
}

.form-type-boolean input[type="checkbox"],
  .form-type-boolean input[type="radio"] {
    position: relative;
    top: 9px;
    transform: translateY(-50%);
  }

[dir="ltr"] .form-type-boolean.form-no-label {
    margin-left: 0
}

[dir="rtl"] .form-type-boolean.form-no-label {
    margin-right: 0
}

.form-type-boolean.form-no-label input[type="checkbox"],
    .form-type-boolean.form-no-label input[type="radio"] {
      position: static;
      float: none;
      margin-left: 0;
      margin-right: 0;
      transform: none;
    }

[dir="ltr"] .form-type-boolean .form-item__description,[dir="ltr"] 
  .form-type-boolean .form-item--error-message {
    margin-left: -36px
}

[dir="rtl"] .form-type-boolean .form-item__description,[dir="rtl"] 
  .form-type-boolean .form-item--error-message {
    margin-right: -36px
}

.form-boolean-group .form-type-boolean {
  margin-top: 18px;
  margin-bottom: 18px;
}

[dir="ltr"] .container-inline .form-boolean-group .form-type-boolean:not(:last-child) {
  margin-right: 18px
}

[dir="rtl"] .container-inline .form-boolean-group .form-type-boolean:not(:last-child) {
  margin-left: 18px
}
