/*————————————

Checkboxes

————————————*/

.u-check {

position: relative;
cursor: pointer;

&-icon {
  // Icon Font
  &-font {
    display: inline-block;
    font-size: 0;
    padding-left: 1px;
    padding-right: 1px;

    i {
      font-size: 22px;
      color: $g-color-gray-light-v2;

      &::before {
        content: attr(data-uncheck-icon);
      }
    }
  }
  // End Icon Font

  &-checkbox,
  &-radio {
    display: inline-block;
  }
}

// Control
input[type="checkbox"],
input[type="radio"] {
  &:checked {
    & +,
    & + * {
      // Icon Font
      .u-check-icon-font {
        i {
          color: $g-color-primary;

          &::before {
            content: attr(data-check-icon);
          }
        }
      }
      // End Icon Font
    }
  }
}

}

.g-hide-check {

display: block !important;

.g-checked > * &,
input[type="checkbox"]:checked + &,
input[type="radio"]:checked + &,
input[type="checkbox"]:checked + * &,
input[type="radio"]:checked + * & {
  display: none !important;
}

}

.g-show-check {

display: none !important;

.g-checked > * &,
input[type="checkbox"]:checked + &,
input[type="radio"]:checked + &,
input[type="checkbox"]:checked + * &,
input[type="radio"]:checked + * & {
  display: block !important;
}

}

// // Imports // @import “checkboxes-v1”; @import “checkboxes-v2”; @import “checkboxes-v3”; @import “checkboxes-v4”; @import “checkboxes-v5”; @import “checkboxes-v6”; @import “checkboxes-v7”; @import “checkboxes-v8”;

/* P */

class*=“u-checkbox-v1”

{

display: none;

}

class*=“u-checkbox-v1”

+ label {

cursor: pointer;

}

.u-checkbox-v1–checked-color-primary:checked + label {

color: $g-color-primary !important;

}

.u-checkbox-v1–checked-brd-primary:checked + label {

border-color: $g-color-primary !important;

}