<commit_before>@import '../style/menu-common';
@import '../style/vendor-prefixes';
@import '../style/layout-common';
@import '../../../cdk/a11y/a11y';

.mat-option {
  @include mat-menu-item-base();
  position: relative;
  cursor: pointer;
  outline: none;
  display: flex;
  flex-direction: row;
  max-width: 100%;
  box-sizing: border-box;
  align-items: center;
  -webkit-tap-highlight-color: transparent;

  &[aria-disabled='true'] {
    @include user-select(none);
    cursor: default;
  }

  .mat-optgroup &:not(.mat-option-multiple) {
    padding-left: $mat-menu-side-padding * 2;

    [dir='rtl'] & {
      padding-left: $mat-menu-side-padding;
      padding-right: $mat-menu-side-padding * 2;
    }
  }

  @include cdk-high-contrast(active, off) {
    $high-contrast-border-width: 1px;

    // Add a margin to offset the border that we're adding to active option, in order
    // to avoid the options shifting as the user is moving through the list.
    margin: 0 $high-contrast-border-width;

    &.mat-active {
      // We use a border here, rather than an outline, because the outline will be cut off
      // by the `overflow: hidden` on the panel wrapping the options, whereas a border
      // will push the element inwards. This could be done using `outline-offset: -1px`,
      // however the property isn't supported on IE11.
      border: solid $high-contrast-border-width currentColor;
      margin: 0;
    }
  }
}
<commit_msg>fix(material/core): unable to distinguish disabled mat-option in high contrast mode (#21484)<commit_after>@import '../style/menu-common';
@import '../style/vendor-prefixes';
@import '../style/layout-common';
@import '../../../cdk/a11y/a11y';

.mat-option {
  @include mat-menu-item-base();
  position: relative;
  cursor: pointer;
  outline: none;
  display: flex;
  flex-direction: row;
  max-width: 100%;
  box-sizing: border-box;
  align-items: center;
  -webkit-tap-highlight-color: transparent;

  &[aria-disabled='true'] {
    @include user-select(none);
    cursor: default;
  }

  .mat-optgroup &:not(.mat-option-multiple) {
    padding-left: $mat-menu-side-padding * 2;

    [dir='rtl'] & {
      padding-left: $mat-menu-side-padding;
      padding-right: $mat-menu-side-padding * 2;
    }
  }

  @include cdk-high-contrast(active, off) {
    $high-contrast-border-width: 1px;

    // Add a margin to offset the border that we're adding to active option, in order
    // to avoid the options shifting as the user is moving through the list.
    margin: 0 $high-contrast-border-width;

    &.mat-active {
      // We use a border here, rather than an outline, because the outline will be cut off
      // by the `overflow: hidden` on the panel wrapping the options, whereas a border
      // will push the element inwards. This could be done using `outline-offset: -1px`,
      // however the property isn't supported on IE11.
      border: solid $high-contrast-border-width currentColor;
      margin: 0;
    }

    // Fade out the option when it is disabled so that it can be distinguished from the enabled
    // options. Note that ideally we'd use `color: GreyText` here which is what the browser uses
    // for disabled buttons, but we can't because Firefox doesn't recognize it.
    &[aria-disabled='true'] {
      opacity: 0.5;
    }
  }
}

{'fraction_non_alphanumeric': 0.13472600666061157, 'fraction_numerical': 0.011201937632455344, 'mean_word_length': 2.864327485380117, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1541902', 'n_tokens_mistral': 1085, 'n_tokens_neox': 1020, 'n_words': 328}