/* Page layout */
.auth-content {
  padding: 40px 35px 15px;
}

.modal-wrapper, .app-container, .form-container {
  position: relative;
}

/* Modal */
#okta-sign-in {
  border: none !important;
  border-radius: 0 !important;
  width: 440px;
}

/* Removes dark blue border around the full modal on focus */
#okta-sign-in.auth-container.main-container.no-beacon:focus {
  outline: none;
}

#okta-sign-in.auth-container.main-container {
  background-color: #343b45 !important;
}

#okta-sign-in.auth-container .okta-sign-in-header {
  z-index: 0;
}

/* Removes the 30px margin from the bottom */
#okta-sign-in.auth-container.main-container .margin-btm-30 {
  margin-bottom: 0px !important;
}

/* Header image wrapper (layout and image styling below) */
.auth-org-logo {
  width: 440px !important;
  height: 138px !important;
}

/* Header layout (wrapper styling above & image styling below) */
.okta-sign-in-header.auth-header {
  border-bottom: 2px solid #008cca !important;
  padding: 0 !important;
}

/* Below header content wrapper background color fix */
#okta-sign-in .auth-content {
  background-color: #343b45 !important;
}

/* Header image (wrapper and layout styling above) */
#okta-sign-in.auth-container .okta-sign-in-header img {
  width: 387px;
  height: 120px;
  max-width: 500px;
  max-height: 200px;
}

/* Remove "Sign In" text */
.okta-form-title.o-form-head {
  display: none;
}

/* SSO non enabled account warning - username clear button */
#sso-restart {
  position: absolute;
  fill: #fff;
  cursor: pointer;
  right: -15px;
  margin-top: 15px !important;
  visibility: hidden;
}

/* Error text color override */
.okta-form-infobox-error.infobox.infobox-error > p {
  color: inherit;
}

/* Error icon fix */
.js-help-link {
  display: none;
}

/* Remove unused input label */
.okta-form-label.o-form-label {
  color: #fff !important
}

/* Input styling for an only bottom border */
#okta-sign-in .o-form .input-fix {
  background-color: #343b45 !important;
  border-radius: 0 !important;
  border: none !important;
  border-bottom: 1px solid #999 !important;
}

/* Input padding adjustments and font adjustment to prevent iOS zoom */
#okta-sign-in .o-form .input-fix input[type=text] {
  padding: 5px 5px 2px !important;
  font-size: min(100%, 16px);
  color: #fff;
}

/* Input padding adjustments and font adjustment to prevent iOS zoom */
#okta-sign-in .o-form .input-fix input[type=password] {
  font-size: min(100%, 16px);
  color: #fff;
}

/* Remove focus outline from input which is actually a box-shadow applied to a class */
#okta-sign-in.auth-container .focused-input {
  box-shadow: none;
}

/* Remember me styling. The next button is absolutely positioned, so margin is added fix the layout */
#okta-sign-in .o-form .custom-checkbox label {
  color: #fff;
  margin-bottom: 50px;
}

/* Keep button from moving up and down when interacting with it as a focus based class is styled different */
#okta-sign-in .o-form-button-bar {
  padding: 0 !important;
  margin: 0 !important;
}

/* Next button styling */
#okta-sign-in.auth-container .button-primary {
  background: #008cca !important;
  border: none;
  width: auto !important;
  height: 30px !important;
  position: absolute;
  right: 0;
  bottom: 5px;
  line-height: 1;
}

/* Style the dataminr feedback messages */
#okta-sign-in .feedback {
  font-weight: 700;
  padding-bottom: 20px;
  color: #fff !important;
  font-size: 14px;
}

#okta-sign-in .feedback-error{
  color: #f55855 !important;
}

/* Brings the need help signing in dropdown inline with the sign in button */
#okta-sign-in .auth-footer {
  position: relative;
  bottom: 30px;
  width: 70%;
}

#okta-sign-in.auth-container .link {
  color: #CDCED6 !important;
}

/* Hide the sso form for the classic dataminr login flow */
#sso-form {
  display: none;
}

/* Set the obfuscated dots to black so they can be seen in FF */
#okta-sign-in.auth-container #okta-signin-password {
  color: #ffffff;
}

/* Remove background color from saved password in FF */
input {
  filter: none;
}

/* Set background of saved password fields to the same backing as app in chromium browsers */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active
{
  -webkit-box-shadow: 0 0 0 30px #343b45 inset !important;
  caret-color: #ffffff;
}

/* Set saved password dot color to same as typed in dot color in chromium browsers */
input:-webkit-autofill
{
  -webkit-text-fill-color: #ffffff !important;
}

#microsoftBtn {
  position: relative;
  bottom: 25px;
  left: 225px;
  width: 200px;
  height: 40px;
  border: 1px solid white !important;
  border-radius: 5px;
  background-color: #2f2f2f !important;
  cursor: pointer;
}

@media only screen
and (max-device-width: 480px) {
  #okta-sign-in.auth-container .okta-sign-in-header img {
    max-width: 300px;
    max-height: 96px;
  }
  #okta-sign-in {
    left: 50%;
    transform: translate(-50%, 0);
  }
  #microsoftBtn {
    transform: translate(-81%, 0);
    top: 0;
  }
  #okta-sign-in.auth-container.main-container {
    max-width: 320px;
    min-height: 430px;
    width: 100%;
  }
}

@media only screen
and (min-device-width: 480px) {
  #okta-sign-in.auth-container {
    max-width: 440px;
    width: 440px;
  }
  .auth-org-logo {
    width: 440px;
    height: 138px;
  }
}