
.login-section {
  /* padding: 80px 0; */
  background-color: #f8f9fa;
  overflow: hidden;
  padding-block: 100px;
}
.login-section .login-sec-main-bx {
  background-color: var(--color-white);
  border-radius: 24px;
  padding: 24px;
}

.login-section .login-tabs-bx {
  display: flex;
  min-width: 480px;
  padding: 80px 0px;
  flex-direction: column;
  align-items: center;
  gap: 40px;
  flex: 1 0 0;
  align-self: stretch;
  height: 100%;
}

.login-section .nav-pills {
  border-radius: 12px;
  display: flex;
  width: 359px;
  padding: 3px 6px;
  justify-content: center;
  align-items: center;
  gap: 4px;

  border: 1px solid var(--color-secondary-gray-25);
  background: var(--color-white);

}
.login-section .nav-pills .nav-item {
  display: flex;
  height: 44px;
  /* padding: var(--spacing-md, 8px) var(--spacing-lg, 12px); */
  justify-content: center;
  align-items: center;
  gap: var(--spacing-md, 8px);
  flex: 1 0 0;
}
.login-section .nav-pills .nav-link {
  display: flex;
  /* height: 44px; */
  /* padding: 8px 12px; */
  padding: 8px 12px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  flex: 1 0 0;
  border-radius: 6px;
  color: var(--colors-text-text-quarterary-500, #667085);

  background: var(--Base-White, #fff);

  /* Text md/Semibold */
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px; /* 150% */
}
.login-section .nav-pills .nav-link.active {
  color: var(--color-primary-pink);
  background: #fce7f6;
  /* Shadows/shadow-sm */
  box-shadow: 0px 1px 3px 0px rgba(16, 24, 40, 0.1),

    0px 1px 2px 0px rgba(16, 24, 40, 0.06);
}
.login-section .tab-content{
  width: 100%;
  max-width: 359px;
  /* max-height: 593px;
  height: 593px; */
}
.login-section .login-form-bx{
  display: flex;
  max-width: 360px;
  flex-direction: column;
  align-items: center;
  gap: 32px;
  align-self: stretch;

}
.login-section .login-form-bx .input-bx input{
  display: flex;
height: 52px;
padding: 16px 24px 16px 16px;
align-items: center;
gap: 10px;
align-self: stretch;
border-radius: 8px;
border: 1px solid var(--color-gray-300);
background: var(--color-white);
width: 100%;
}

.login-section .login-form-bx .input-bx input:focus{

  border: 0px;
  outline: 2px solid var(--color-primary-pink);
  box-shadow: none;
}
.login-section .login-form-bx .input-bx input::placeholder{
color: var(--color-gray-400);  
}
.login-section .standard-select2 .select2-container .select2-selection--single .select2-selection__rendered{
  font-weight: var(--fontRegular);
}
.login-section .standard-select2 .select2-container--default .select2-selection--single .select2-selection__clear{
  margin-right: 50px;
}
.login-section .standard-input-field.standard-select2{
  height: 52px;
}
.login-section .standard-select2 .select2-container .select2-selection--single .select2-selection__rendered{
  padding-left: 16px;
}
.login-section .standard-btn-pink{
  padding: 4px 4px 4px 16px;
}
.login-section .ambassador-image {
  width: 100%;
  height: 100%;

  display: flex;
  align-items: center;
  justify-content: center;

  /* padding: 24px 0px; */
}

.login-section .ambassador-image img {
  max-width: 100%;
  height: auto;
  border-radius: 10px;
  object-fit: contain;
}
.login-section .floating-btn {
  display: inline-flex;
  position: absolute;
  padding: 17px 24px;
  justify-content: center;
  align-items: center;
  gap: 10px;

  color: var(--color-primary-pink);
  border-radius: 16px;
  border: 1px solid rgba(222, 0, 111, 0.05);
  background: rgba(255, 255, 255, 0.8);
  box-shadow: 0px -3px 1px 0px rgba(222, 0, 111, 0.1) inset,
    0px 12px 16px -4px rgba(222, 0, 111, 0.08),
    0px 4px 6px -2px rgba(222, 0, 111, 0.04);
  backdrop-filter: blur(20px);
}

.login-section .floating-btn.btn-one {
  position: absolute;
  left: 32px;
  top: 196px;
  animation: nudge1 2.5s infinite;
}

.login-section .floating-btn.btn-two {
  /* position: absolute; */
  right: -49px;

  top: 250px;
  animation: nudge2 2.8s infinite;
}

.login-section .floating-btn.btn-three {
  right: -3px;

  bottom: 248px;
  animation: nudge2 3.3s infinite;
}

.login-section .floating-btn.btn-four {
  /* position: absolute; */
  left: -61px;
  bottom: 380px;
  animation: nudge2 3.3s infinite;
}

@media (min-width: 1400px) {
  .login-section .custom-width {
    flex: 0 0 597px;
    width: 597px;
    max-width: 597px;
  }
}

@media (min-width: 280px) and (max-width: 575px) {
  .login-section .nav-pills {
    width: 100%;
  }
  .login-section .login-tabs-bx{
    min-width: auto;
    padding: 0px;
  }
  .login-section{
    padding:40px 0px;
  }
  .login-section .login-tabs-bx{
    gap: 24px;
  }
  .login-section .tab-content{
    max-height: 100%;
    height: 100%;
  }
  .login-section .login-form-bx .standard-social-btn span{
   font-size: 14px;
  }
}
@media (max-width: 320px) {
  .login-section .login-form-bx .forget-password label ,.login-section .login-form-bx .forget-password a{
    font-size: 10px;
   }
}
.standard-input-field{
  height: 52px;
}