#apply-form {
  overflow-x: hidden;
}

section#apply-form .container {
  gap: 4rem;
}

section#apply-form .content {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  gap: 15px;
}

section#apply-form .content .stats-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 20px;
  font-size: 13px;
  width: 30%;
}

section#apply-form .content .stats-section .perks {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 30px;
}

section#apply-form .content .stats-section .perk {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 16px;
  background-color: rgb(var(--theme-background));
  border: 2px solid rgb(var(--theme-text), 0.05);
  border-radius: 25px;
  padding: 1.25rem 2rem;
}

section#apply-form .content .stats-section .perk p {
  color: rgb(var(--theme-text), 0.6);
}

section#apply-form .content .stats-section span {
  display: flex;
}
section#apply-form .content .stats-section span svg {
  fill: rgb(var(--color-secondary));
}

section#apply-form .content .stats-section div {
  display: flex;
  flex-direction: column;
  gap: 2.5px;
  text-align: start;
}

section#apply-form .content .stats-section .achievments {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  gap: 5px;
  width: 100%;
}

section#apply-form .content .stats-section .achievment {
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid rgb(var(--theme-text), 0.05);
  border-radius: 25px;
  padding: 1.25rem 2rem;
  gap: 5px;
  width: 33%;
  background-color: rgb(var(--theme-background));
}
section#apply-form .content .stats-section .achievment h2 {
  color: rgb(var(--theme-text-secondary));
}

section#apply-form .content .form-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  width: 55%;
  gap: 20px;
  padding: 2rem;
  border-radius: 33px;
  background: rgb(var(--theme-background));
  border: 2px solid rgb(var(--theme-text), 0.05);
}

section#apply-form .content .form-section .form-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

section#apply-form .content .form-section .form-header .form-title p {
  opacity: 0.7;
  margin-top: 4px;
}

section#apply-form .content .form-section .form-header .tracker {
  display: flex;
  gap: 10px;
}
section#apply-form .content .form-section .form-header .bar {
  padding: 0.25rem 1rem;
  border-radius: 99px;
  background-color: rgb(var(--color-secondary), 0.1);
}

section#apply-form .content .form-section .form-header .bar.active {
  background-color: rgb(var(--color-secondary), 0.8);
}

section#apply-form .content .form-section form {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 25px;
}

section#apply-form .content .form-section input {
  width: 100%;
  padding: 1rem 0;
  padding-left: 1rem;
  border-radius: 99px;
  border: 1px solid rgb(var(--color-secondary), 0.25);
}

section#apply-form .content .form-section input::placeholder {
  margin-left: 1rem;
}

section#apply-form .content .form-section input:focus,
section#apply-form .content .form-section select:focus {
  outline: 2px solid rgb(34, 197, 94); /* example green */
  outline-offset: 2px;
  border: 1px solid transparent;
}

section#apply-form .content .form-section select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding: 1rem;
  border-radius: 99px;
  border: 1px solid rgb(var(--color-secondary), 0.25);
  background-color: transparent;
  color: rgb(var(--theme-text));
}
section#apply-form .content .form-section select option {
  background-color: rgb(var(--theme-background));
}

section#apply-form .content .form-section button {
  width: 100%;
  padding: 1rem 0;
  border-radius: 99px;
  background-color: rgb(var(--color-secondary));
  color: #fff;
  box-shadow: 0 4px 10px rgb(var(--color-secondary), 0.4);
  cursor: pointer;
}
section#apply-form .content .form-section button:hover {
  background-color: rgb(var(--color-secondary), 0.8);
  box-shadow: 0 4px 15px rgb(var(--color-secondary), 0.4);
}

section#apply-form .content .form-section .input-wrapper {
  display: flex;
  flex-direction: column;
  width: 100%;
}
section#apply-form .content .form-section .input-wrapper span {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 500;
  margin-bottom: 10px;
  margin-left: 5px;
}

section#apply-form .content .form-section .double-input-wrapper {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

@media (max-width: 1028px) {
  section#apply-form .content .stats-section .perks {
    display: none;
  }

  section#apply-form .container {
    gap: 2rem;
  }

  section#apply-form .content {
    flex-direction: column;
  }

  section#apply-form .content .stats-section,
  section#apply-form .content .form-section {
    width: 100%;
  }
}

@media (max-width: 642px) {
  section#apply-form .content .form-section .form-header .form-title {
    display: none;
  }

  section#apply-form .content .form-section .form-header .tracker {
    margin-left: auto;
  }

  section#apply-form .content .form-section .double-input-wrapper {
    flex-direction: column;
    gap: 15px;
  }

  section#apply-form .content .form-section form {
    gap: 15px;
  }
}

/* @media (max-height: 814px) {
  section#apply-form .content .form-section .form-header .form-title,
  section#apply-form .content .stats-section .achievments,
  section#apply-form .header .tag {
    display: none;
  }

  section#apply-form .content .form-section .form-header .tracker {
    margin-left: auto;
  }

  section#apply-form .container {
    gap: 2rem;
  }

  section#apply-form .content .stats-section .perks {
    margin: auto;
  }
}

@media (max-height: 980px) and (max-width: 484px) {
  section#apply-form section {
    padding-top: 2rem;
  }

  section#apply-form .container {
    gap: 1rem;
  }
} */