@import "../../assets/scss/variables";
:root {
  --disabled-bg:#E1E1E1;
  --disabled-button-bg: #e1e1e1;
  --disabled-color:#A2A2A2;
  --disabled-border:none;
  --check-filter: var(--svg-white);
}

:root[data-theme="dark"] {
  --disabled-bg:#2F363E;
  --disabled-color:#20262E;
  --disabled-border:1px solid #20262E;
  --check-filter: var(--svg-to-dark-gray);
  --disabled-button-bg: #40474F;
}
#dua-login, #ldap-req {
  $disabled-bg:var(--disabled-bg);
  $disabled-color: var(--disabled-color);
  $disabled-border: var(--disabled-border);
  & .orange-squares {
    position: absolute;
    right: 15%;
    top: 140px;
    z-index: -1;

    & > div {
      position: absolute;
      background-color: $orange-square;
      filter: blur(10px);
      aspect-ratio: 1;
    }

    & .s1 {
      top: 0;
      right: 0;
      width: 70px;
    }

    & .s2 {
      top: 60px;
      right: 60px;
      width: 40px;
    }
  }


  input:disabled,
  input:-webkit-autofill {
    background: #E1E1E1 !important;
    border: none !important;
    color: #A2A2A2 !important;
    border-radius: 5px !important;
  }

  .form-button:disabled {

    cursor: not-allowed;
    background-color: var(--disabled-button-bg);
    pointer-events: none;
    color: $disabled-color;
    border: $disabled-border;
    font-weight: 500;

    img {
      filter: var(--check-filter);
    }

    hr {
      background-color: $disabled-color;
    }
  }

  input[disabled] ~ label {
    z-index: 1 !important;
    color: #A2A2A2 !important;
  }
}

@media (max-width: 575px) {
  .guidehelperalt-image-wrapper {
    left: -6px !important;

    img {
      width: 65px;
      height: 65px;
    }
  }
}

@media (max-width: 425px) {
  .guidehelperalt-image-wrapper {
    left: -6px !important;
  }
}