//
// Checkboxes and radios
//

.custom-control-input {
  &:checked ~ .custom-control-indicator {
    // Fix where Bootstrap calls box-shadow(), preventing outline replacements
    // from taking effect when $enable-shadows is false
    box-shadow: $custom-control-checked-indicator-box-shadow;
  }

  &:active ~ .custom-control-indicator {
    // Fix where Bootstrap calls box-shadow(), preventing outline replacements
    // from taking effect when $enable-shadows is false
    box-shadow: $custom-control-active-indicator-box-shadow;
  }
}

.custom-radio,
.custom-checkbox {
  // Allow custom border styles on .custom-control-indicator
  .custom-control-input ~ .custom-control-indicator {
    border: $input-btn-border-width solid $custom-control-indicator-border-color;
  }

  .custom-control-input:checked ~ .custom-control-indicator,
  .custom-control-input:disabled ~ .custom-control-indicator {
    border-color: transparent;
  }
}

.custom-radio {
  .custom-control-indicator {
    // Allow more granual control of radio indicator size
    background-size: $custom-radio-indicator-bg-size;
  }
}

.custom-checkbox {
  .custom-control-indicator {
    // Allow more granual control of checkbox indicator size
    background-size: $custom-checkbox-indicator-bg-size;
  }
}


//
// Select
//

.custom-select {
  font-size: $font-size-base-md; // Match default select input font sizes
  height: $custom-select-height;

  &:focus {
    // Fix where Bootstrap calls box-shadow(), preventing outline replacements
    // from taking effect when $enable-shadows is false
    box-shadow: $custom-select-focus-box-shadow;
  }
}

.custom-select-sm {
  font-size: $custom-select-sm-font-size; // Re-declare to override .custom-select above
  height: $custom-select-sm-height;
}

.custom-select-lg {
  font-size: $custom-select-lg-font-size;
  height: $custom-select-lg-height;

  // Dumb hack to fix subpixel difference in height with input group buttons
  .input-group & {
    height: calc(#{$custom-select-lg-height} - .5px);
  }
}


//
// File
//

.custom-file-input {
  font-size: $font-size-base-md;

  &:focus ~ .custom-file-control {
    // Fix where Bootstrap calls box-shadow(), preventing outline replacements
    // from taking effect when $enable-shadows is false
    box-shadow: $custom-file-focus-box-shadow;
  }
}

.custom-file-control {
  font-size: $font-size-base-md;

  // Fix reversed variable usage in Bootstrap
  &,
  &::before {
    padding: $custom-file-padding-y $custom-file-padding-x;
  }
}