.login.login-1 .login-aside .aside-img {
  min-height: 450px; }

.login.login-1 .login-signin,
.login.login-1 .login-signup,
.login.login-1 .login-forgot {
  display: none; }

.login.login-1.login-signin-on .login-signup {
  display: none; }

.login.login-1.login-signin-on .login-signin {
  display: block; }

.login.login-1.login-signin-on .login-forgot {
  display: none; }

.login.login-1.login-signup-on .login-signup {
  display: block; }

.login.login-1.login-signup-on .login-signin {
  display: none; }

.login.login-1.login-signup-on .login-forgot {
  display: none; }

.login.login-1.login-forgot-on .login-signup {
  display: none; }

.login.login-1.login-forgot-on .login-signin {
  display: none; }

.login.login-1.login-forgot-on .login-forgot {
  display: block; }

/* .login-main-popup {
  background-color: white;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: clamp(300px, 70%, 800px);
  height: clamp(300px, 70%, 600px);
} */
 #plan-type-toggle-wrapper input[type="radio"] + label {
  background-color: white;
  color: grey;
  border: 1px solid black;
  margin-inline: 0.25rem;
 }

 #plan-type-toggle-wrapper input[type="radio"]:hover + label{
  background-color: rgba(54, 153, 255, 1);
  color: white;
  border: 1px solid rgba(54, 153, 255, 1);
 }

 #plan-type-toggle-wrapper input[type="radio"]:checked + label {
  background-color: rgba(54, 153, 255, 1);
  color: white;
  border: 1px solid rgba(54, 153, 255, 1);
 }
  #plan-type-wrapper{
  display: flex;
 }
 .plans-types-wrapper {
  display: none;
 }
 #plan-type-toggle-wrapper:has([type="radio"]:checked + label[for="show_dc_plans"]) ~ #dc_plans {
  display: flex; /* Show DC plans */
}
#plan-type-toggle-wrapper:has(input[type="radio"]:checked + label[for="show_b2b_plans"]) ~ #b2b_plans {
  display: flex; /* Show B2B plans */
}

#kt_signup_form_wrapper{
  display: none;
  border-radius: 0.5rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: white;
  min-width: fit-content;
  width: clamp(300px, 70%, 600px);
}
@media (min-width: 992px) {
  .login.login-1 .login-aside {
    width: 100%;
    max-width: 70%; }
  .login.login-1 .login-content {
    width: 100%;
    max-width: 500px; }
    .login.login-1 .login-content .login-form {
      width: 100%;
      max-width: 450px; } }

@media (min-width: 992px) and (max-width: 1399.98px) {
  .login.login-1 .login-aside {
    width: 100%;
    /* max-width: 450px; */
    } 
  } 

@media (max-width: 991.98px) {
  .login.login-1 .login-content .login-form {
    width: 100%;
    max-width: 400px; } }

@media (max-width: 575.98px) {
  .login.login-1 .aside-img {
    min-height: 300px !important;
    background-size: 400px; }
  .login.login-1 .login-content .login-form {
    width: 100%;
    max-width: 100%; } }