@use 'sass:map';
@use '../../../mx-core/src/base/colors';
@use '../../../mx-core/src/base/elevation';

@mixin mx-password-input-theme($theme) {
  $is-dark: map.get($theme, is-dark);
  $current-theme: colors.$mx-light;

  @if $is-dark {
    $current-theme: colors.$mx-dark;
  }

  /* mxPasswordValidation */
  .mx-validation-rule-list {
    &__status {
      border-top-color: map.get($current-theme, outlineVariant);
      &--valid {
        border-top-color: map.get($current-theme, success);
      }

      &--invalid {
        border-top-color: map.get($current-theme, error);
      }
    }

    &__content {
      color: map.get($current-theme, onSurface);
    }

    &__rule {
      mat-icon {
        &.valid {
          color: map.get($current-theme, success);
        }
        &.invalid {
          color: map.get($current-theme, error);
        }
      }

      &__dot:before {
        background-color: map.get($current-theme, onSurfaceVariant);
      }
    }
  }
}