/* devinstall.com/css/form-core.css */
.form__container {
  top: 50%;
  left: 50%;
  position: absolute;
  transform: translate(-50%, -50%);
}

.form {
  padding: 20px;
}

.form > div {
    margin-bottom: 20px;
}

.form h1 {
  margin: 0;
  color: #4a4a4a;
  margin-bottom: 10px;
  font-size: 20px
}

.form input {
  padding: 5px 10px;
  color: white;
  border: 1px solid white;
  background: rgba(0,0,0,0.99);
  border-radius: 3px;
}

.aa-DetachedSearchButtonQuery,
.form input::placeholder {
  color: white;
}

.form button {
  width: 100%;
  border: 1px solid white;
  color: white;
  display: block;
  margin: 0 auto;
  padding: 5px 0;
  background: rgba(0,0,0,0.99);
  border-radius: 3px;
}

.form button:hover {
  cursor: pointer;
}

.form__password,
.form__codename{
  background-color: rgba(var(--aa-input-background-color-rgb),var(--aa-input-background-color-alpha));
  border: 1px solid rgba(var(--aa-input-border-color-rgb),var(--aa-input-border-color-alpha));
  border-radius: 3px;
  color: rgba(var(--aa-text-color-rgb),var(--aa-text-color-alpha));
}

.swal-text h3 {
  margin: 10px 0 5px;
}

code {
    font-family: Consolas, Monaco, 'Courier New', monospace;
  background-color: #f5f5f5;
  padding: 2px 4px;
  color: #d63384;
  font-size: 70%;
}
/* devinstall.com/css/form-core.css END */

/* algolia/autocomplete overwrites START */
:root {
  --aa-search-input-height: 30px;
}

* { /* remove width overflow */
  box-sizing: border-box;
}

.aa-InputWrapperSuffix, /* remove icons */
.aa-InputWrapperPrefix{
  display: none;
}
/* algolia/autocomplete overwrites END */


/* devinstall.com/css/form-style.css START */
.form__container {
  border-radius: 5px;
  background-color: rgba(39, 144, 245, 0.4)
}

.form h1 {
  color: white;
}
/* devinstall.com/css/form-style.css END */

/* Help Icon */
.help-icon {
  width: 32px;
  height: 32px;
  cursor: pointer;
  fill: #fff;
  transition: fill 0.3s ease;
}

.help-icon:hover {
  fill: #007BFF;
}

@media (max-width: 600px) {
  .help-icon {
    width: 20px;
    height: 20px;
  }
}

.help-container {
  position: fixed;
  top: 15px;
  right: 15px;
  z-index: 1000;
}

/* Intro Tutorial */
.introjs-tooltiptext {
  font-size: 16px;
}

/* Mobile styles */
@media only screen and (max-width: 767px) {
    .aa-DetachedSearchButtonIcon { display: none; }
    .aa-Input { padding: 5px 10px; }
    .form__container { width: 70%; }
    .form button {
        padding: 5px 10px;
    }
    .form button::placeholder {
        color: rgba(var(--aa-muted-color-rgb),var(--aa-muted-text-color-alpha));
    }
    
}