@import "../bootstrap-core/custom-forms";
.custom-control-label::before {
  background-color: #fff;
  border: $input-border-width $input-border-color solid;
}
.custom-control-input {
  &:checked ~ .custom-control-label::before {
    border-color: $custom-control-indicator-checked-bg;
  }
  &:disabled {
    ~ .custom-control-label {
      &::before {
        border-color: $gray-300;
      }
    }
  }
}
.custom-control:hover {
  .custom-control-input:not(:disabled) ~ .custom-control-label::before {
    border-color: $custom-select-focus-border-color;
  }
}
.custom-radio .custom-control-input:checked ~ .custom-control-label::before {
  background: $white;
}

.custom-radio .custom-control-input:checked ~ .custom-control-label::after {
  background-size: 50%;
}
// SEB Specific style for slide toggle
.custom-slide-toggle .custom-control-label::before {
  width: 2.5rem;
  height:  1.25rem;
  border-radius:  10px;
  pointer-events: auto;
}
.custom-slide-toggle .custom-control-input:checked ~ .custom-control-label::after {
  left: -4px;
}

.custom-slide-toggle .custom-control-input ~ .custom-control-label::after {
  background-image: escape-svg(str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 10 10'%3E%3Ccircle r='5' fill='#{$custom-control-indicator-checked-color}'/%3E%3C/svg%3E"), "#", "%23"));
  transition: .2s ease-in-out;
  background-size: 100% 100%;
}

.custom-slide-toggle:hover .custom-control-input:not(:disabled) ~ .custom-control-label {
  &::before {
    border:none;
  }
  &::after {
    background-image: escape-svg(str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 10 10'%3E%3Ccircle r='5' fill='#{$custom-control-indicator-checked-color}'/%3E%3Ccircle r='3' fill='#{$custom-control-indicator-checked-bg}' /%3E%3C/svg%3E"), "#", "%23"));
  }
}

.custom-slide-toggle .custom-control-input ~ .custom-control-label::before {
  transition: background-color .2s ease-in-out;
  background-color: $input-border-color;
}
.custom-slide-toggle .custom-control-input:disabled ~ .custom-control-label {
  &::before {
    background-color: $gray-300;
  }
  &::after {
    background-image: escape-svg(str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 10 10'%3E%3Ccircle r='5' fill='#{$custom-control-indicator-disabled-bg}'/%3E%3C/svg%3E"), "#", "%23"));
  }
}

.custom-slide-toggle .custom-control-input:checked ~ .custom-control-label::before {
  background-color: $custom-select-focus-border-color;
}

.custom-slide-toggle .custom-control-label {
  padding-left: 1.5rem;
  &::after {
    height:  1.125rem;
    width:  1.125rem;
    margin-top: 1px;
    margin-left: 1px;
  }
}

.custom-file-label {
  &::after {
    border: $input-border-color solid $input-border-width;
    border-left: none;
    background-image: escape-svg(url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%230092E1' d='M452 432c0 11-9 20-20 20s-20-9-20-20 9-20 20-20 20 9 20 20zm-84-20c-11 0-20 9-20 20s9 20 20 20 20-9 20-20-9-20-20-20zm144-48v104c0 24.3-19.7 44-44 44H44c-24.3 0-44-19.7-44-44V364c0-24.3 19.7-44 44-44h124v-99.3h-52.7c-35.6 0-53.4-43.1-28.3-68.3L227.7 11.7c15.6-15.6 40.9-15.6 56.6 0L425 152.4c25.2 25.2 7.3 68.3-28.3 68.3H344V320h124c24.3 0 44 19.7 44 44zM200 188.7V376c0 4.4 3.6 8 8 8h96c4.4 0 8-3.6 8-8V188.7h84.7c7.1 0 10.7-8.6 5.7-13.7L261.7 34.3c-3.1-3.1-8.2-3.1-11.3 0L109.7 175c-5 5-1.5 13.7 5.7 13.7H200zM480 364c0-6.6-5.4-12-12-12H344v24c0 22.1-17.9 40-40 40h-96c-22.1 0-40-17.9-40-40v-24H44c-6.6 0-12 5.4-12 12v104c0 6.6 5.4 12 12 12h424c6.6 0 12-5.4 12-12V364z'/%3E%3C/svg%3E"));
    content:'' !important;
    background-size: 1rem 1rem;
    background-repeat: no-repeat;
    background-position: center center;
    width: 2.5rem;
    height: calc(100% + #{$input-border-width} * 2);
    top: -$input-border-width;
    right: -$input-border-width;
  }
}
.custom-file:hover .custom-file-label {
  &::after {
    border-left: none;
    background: $blue;
    border: $blue solid $input-border-width;
    background-image: escape-svg(url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23fff' d='M452 432c0 11-9 20-20 20s-20-9-20-20 9-20 20-20 20 9 20 20zm-84-20c-11 0-20 9-20 20s9 20 20 20 20-9 20-20-9-20-20-20zm144-48v104c0 24.3-19.7 44-44 44H44c-24.3 0-44-19.7-44-44V364c0-24.3 19.7-44 44-44h124v-99.3h-52.7c-35.6 0-53.4-43.1-28.3-68.3L227.7 11.7c15.6-15.6 40.9-15.6 56.6 0L425 152.4c25.2 25.2 7.3 68.3-28.3 68.3H344V320h124c24.3 0 44 19.7 44 44zM200 188.7V376c0 4.4 3.6 8 8 8h96c4.4 0 8-3.6 8-8V188.7h84.7c7.1 0 10.7-8.6 5.7-13.7L261.7 34.3c-3.1-3.1-8.2-3.1-11.3 0L109.7 175c-5 5-1.5 13.7 5.7 13.7H200zM480 364c0-6.6-5.4-12-12-12H344v24c0 22.1-17.9 40-40 40h-96c-22.1 0-40-17.9-40-40v-24H44c-6.6 0-12 5.4-12 12v104c0 6.6 5.4 12 12 12h424c6.6 0 12-5.4 12-12V364z'/%3E%3C/svg%3E"));
    content:'';
    background-size: 1rem 1rem;
    background-repeat: no-repeat;
    background-position: center center;
    width: 2.5rem;
  }
}
