label {
  display: inline-block;
}

.group-form label {
  cursor: inherit;
}

.container-attach-file {
  max-width: 57.6rem;
  margin-inline: auto;
}

.form-resume {
  border: 0.1rem solid var(--clGray);
  border-radius: 0.8rem;
}

.resume-type img {
  max-width: 6rem;
}

.user img {
  max-width: 12rem;
}

.user.upload img {
  border-radius: 50%;
  height: 12rem;
  object-fit: cover;
  object-position: top;
  border: 0.1rem solid var(--clGray);
}

.up-image {
  height: 4rem;
  font-size: var(--fontText);
  border-radius: 0.4rem;
  background: var(--clOrange);
  color: var(--clWhite);
  display: flex;
  align-items: center;
  padding-inline: 1.2rem;
  margin-inline: auto;
  width: fit-content;
  transition: 0.5s ease;
}

.up-image:hover {
  background: var(--clOrangeHover);
}

.up-image input[type="file"] {
  display: none;
}

.resume-header {
  border-radius: 0.4rem 0.4rem 0 0 !important;
  background: var(--cllightGreen);
}

.resume-header button {
  display: flex;
  width: 100%;
  background: transparent;
  border: 0;
  outline: none;
  color: var(--clWhite) !important;
  text-decoration: none !important;
}

.resume-header button:focus {
  box-shadow: none;
}

.input-control {
  border-radius: 0.4rem;
  height: 4rem;
}

.input-control.error,
.textarea-control.error {
  border-color: var(--clRed);
  box-shadow: 0 0 0 0.2rem rgba(252, 71, 71, 0.25);
}

small.error {
  color: var(--clRed);
}

.save {
  margin-block: 3.2rem;
}

.save button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--clRed);
  color: var(--clWhite);
  border-radius: 0.4rem;
  border: 0;
  height: 4rem;
  padding-inline: 1.6rem;
}

.save button:hover {
  background: var(--clRedHover);
}

/* Sweet Alert 2 */
.swal2-popup {
  width: 57.6rem !important;
}

.swal2-title {
  line-height: 1.5;
}

.swal2-popup {
  padding-block: 3.2rem !important;
}

/* End Sweet Alert 2 */

/* Input Type File */
.upload-file {
  height: 4rem;
  font-size: var(--fontText);
  border-radius: 0.4rem;
  background: var(--clOrange);
  color: var(--clWhite);
  display: inline-flex;
  align-items: center;
  padding-inline: 2rem;
  width: fit-content;
  transition: 0.5s ease-in-out;
  cursor: pointer !important;
}

.upload-file.disabled,
.upload-file.disabled:hover {
  background: var(--clWhitetGray);
  color: var(--clWhite);
}

.upload-file:hover {
  background: var(--clOrangeHover);
}

.upload-file input[type="file"] {
  display: none;
}

/* End Input Type File */

#file-wrapper {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1.2rem;
}

#file-wrapper li {
  background: var(--clSky);
  color: var(--clWhite);
  padding-inline: 1.6rem;
  border-radius: 0.4rem;
  min-height: 3.2rem;
  display: flex;
  align-items: center;
  gap: 1.2rem;
}

#file-wrapper button {
  background: transparent;
  border: 0;
  display: flex;
  align-items: center;
  color: var(--clWhite);
  padding-inline: 0;
}

.save-again {
  background: transparent;
  border: 0;
  font-size: var(--fontHead);
  color: var(--clSky);
}

.condition a {
  display: inline-block;
  color: var(--clRed);
}

.profileUser img {
  margin-bottom: 5px;
}

.select2-container {
  width: 100% !important;
}

.select2-container--default .select2-selection--single {
  background-color: #fff;
  border: 1px solid #aaa;
  border-radius: 10px !important;
  height: 40px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 26px;
  position: absolute;
  top: 8px !important;
  right: 1px;
  width: 20px;
}

.select2-container--default .select2-selection--single {
  padding-left: 20px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 40px !important;
}

select[readonly].select2-hidden-accessible+.select2-container {
  pointer-events: none;
  touch-action: none;
}

select[readonly].select2-hidden-accessible+.select2-container .select2-selection {
  background: #eee;
  box-shadow: none;
}

select[readonly].select2-hidden-accessible+.select2-container .select2-selection__arrow,
select[readonly].select2-hidden-accessible+.select2-container .select2-selection__clear {
  display: none;
}

.grid_section_customer {
  margin-top: 35px;
  text-align: center;
}

.grid_two {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 1.5rem;
  margin-bottom: 2rem;
}

.grid_three {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 0.5rem;
}

.grid_three_desired_job {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 1.5rem;
  margin-bottom: 2rem;
}

.grid_four {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 1.6rem;
  margin-bottom: 2rem;
}

.grid_five {
  display: grid;
  grid-gap: 1.5rem;
  margin-bottom: 2rem;
  grid-template-columns: auto auto 25px auto auto;
}

.add button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--clBlackGray);
  color: var(--clWhite);
  border-radius: 0.4rem;
  border: 0;
  height: 4rem;
  padding-inline: 1.6rem;
}

.lineDashUse {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

.error .select2-selection {
  border-color: var(--clRed) !important;
  box-shadow: 0 0 0 0.2rem rgb(252 71 71 / 25%);
}

.btn_collaps {
  font-weight: 400;
  color: #fff;
  text-decoration: none;
  font-size: 2rem !important;
}

.btn_btn_dark {
  background: var(--clBlackGray) !important;
  color: var(--clWhite) !important;
  border-radius: 0.4rem;
  height: 3.2rem;
  padding-inline: 1.6rem;
  border: 0;
  outline: none;
}

.btn_is_verify_email {
  color: #258de7;
  font-size: 2rem;
}

.btn_non_verify_email {
  color: #D40101;
  font-size: 2rem;
}

.btn_customer_confirm {
  border: 0;
  border-radius: 0.25em;
  background: initial;
  background-color: var(--clGreen);
  color: var(--clWhite);
  margin: 0.3125em;
  padding: 0.625em 2em;
  box-shadow: none;
  font-weight: 500;
  font-size: 1.0625em;
}

.btn_customer_cancel {
  border: 0;
  border-radius: 0.25em;
  background: initial;
  background-color: var(--clRed);
  color: var(--clWhite);
  margin: 0.3125em;
  padding: 0.625em 2em;
  box-shadow: none;
  font-weight: 500;
  font-size: 1.0625em;
}

.btn_customer_confirm:hover {
  background: var(--clGreenHover);
  border: 1px solid var(--clGreenHover);
  color: var(--clWhite);
}

.btn_customer_cancel:hover {
  background: var(--clRedHover);
  border: 1px solid var(--clRedHover);
  color: var(--clWhite);
}

.btn_customer_jobbkk_confirm {
  border: 0;
  border-radius: 0.25em;
  background: initial;
  background-color: var(--clRed);
  color: var(--clWhite);
  margin: 0.3125em;
  padding: 0.625em 2em;
  box-shadow: none;
  font-weight: 500;
  font-size: 1.0625em;
}

.btn_customer_jobbkk_cancel {
  border: 0;
  border-radius: 0.25em;
  background: initial;
  background-color: var(--clWineGray);
  color: var(--clWhite);
  margin: 0.3125em;
  padding: 0.625em 2em;
  box-shadow: none;
  font-weight: 500;
  font-size: 1.0625em;
}

.btn_customer_jobbkk_confirm:hover,
.btn_customer_jobbkk_cancel:hover {
  background: var(--clRedHover);
  border: 1px solid var(--clRedHover);
  color: var(--clWhite);
}

@media (max-width: 352px) {
  #list_save_again span, .condition p {
    font-size: 1.2rem;
  }
}

@media (max-width: 575.98px) {
  #list_save_again{
    display: unset !important;
    flex-wrap: unset !important;
  }
  
  .grid_section_customer {
    display: none;
  }

  .grid_two {
    display: contents !important;
  }

  .grid_two label {
    margin-bottom: 0.5rem !important;
  }

  .grid_two section {
    margin-bottom: 1.5rem !important;
  }

  .grid_three_desired_job {
    display: contents !important;
  }

  .grid_three_desired_job label {
    margin-bottom: 0.5rem !important;
  }

  .grid_three_desired_job section {
    margin-bottom: 1.5rem !important;
  }

  .grid_four {
    display: contents !important;
  }

  .grid_four label {
    margin-bottom: 0.5rem !important;
  }

  .grid_four section {
    margin-bottom: 1.5rem !important;
  }

  .grid_five {
    display: contents !important;
  }

  .grid_five label {
    margin-bottom: 0.5rem !important;
  }

  .grid_five section {
    margin-bottom: 1.5rem !important;
  }

  .resume-type {
    display: block !important;
    text-align: center;
  }

  .resume-type img {
      text-align: center;
      margin-bottom: 3rem;
  }
}