.main-bg{
            background-image: url('/static/images/wallpaper.png');
            /* background-attachment: fixed; */
            background-position: center;
            background-repeat: no-repeat;
            background-size: cover;
            margin: 0; /* Remove default margin */
            /* height: 100vh; Full viewport height */
            display: flex;
            justify-content: center;
            align-items: center;
        }
    
  

    .left-panel {
      background: url('your-background-image.jpg') no-repeat center center;
      background-size: cover;
      color: white;
      position: relative;
    }

    .overlay {
      background: linear-gradient(118.44deg, rgba(59, 130, 246, 0.5) 0.31%, rgba(130, 63, 224, 0.5) 65.77%);
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
    
    }

    .left-content {
      position: relative;
      z-index: 2;
    }

    .left-panel img {
      max-width: 100%;
      height: auto;
    }

    .avatar {
      width: 40px;
      height: 40px;
      background-color: #5c6bc0;
      color: white;
      border-radius: 50%;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-weight: bold;
    }

    .btn_color {
      background: linear-gradient(90deg, #3B82F6 0%, #823FE0 65.87%);
      border: none;
      color: white;
    }

    .text_p {
      color: rgba(255, 255, 255, 1);
    }

    input[type="number"]::-webkit-outer-spin-button,
    input[type="number"]::-webkit-inner-spin-button {
      -webkit-appearance: none;
      margin: 0;
    }

    input[type="number"] {
      -moz-appearance: textfield;
    }

    ::placeholder{
      color: rgba(136, 151, 173, 1) !important;
    }

    .form-control {
    background-color: rgba(59, 130, 246, 0.1) !important;
    color: black !important;
    border: 1px solid rgba(212, 215, 227, 1)!important;
    box-shadow: none !important; /* Removes Bootstrap shadow */
    outline: none !important;     /* Removes the default browser outline */
    padding: 7px !important; /* Adds padding for better spacing */
}

.form-control:focus {
    border-color: #E8EDF2 !important; /* Keeps border consistent on focus */
    box-shadow: none !important;      /* Removes Bootstrap shadow on focus */
    outline: none !important;         /* Removes default outline on focus */
}

    @media (max-width: 768px) {
      h1 {
        font-size: 1.8rem;
      }

      .left-content {
        text-align: center;
      }

      .left-panel {
        background-position: center;
        background-size: cover;
      }
    }


    /* Add to your base.css */
@media (max-width: 991.98px) {
  .mobile-header-card {
    background: #fff;
    margin-bottom: 24px;
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
  }

   .col-12, .col-lg-4 {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  /* .mobile-header-card img {
    margin-bottom: 12px;
  } */
  .mobile-header-card h1 {
    font-size: 1.3rem;
    line-height: 1.3;
    margin-bottom: 8px;
  }
  .mobile-header-card p {
    font-size: 1rem;
    color: #555;
  }


 
  .col-lg-4.bg-white {
    height: 100vh !important;
    overflow-y: auto !important;
  
  }

  /* .set_mobile{
    line-height: 100px !important;
  } */
  

  .row {
    flex-wrap: wrap !important;
  }
  .col-6 {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }

.main-bg {
background-attachment: scroll !important;
position: relative;
overflow: hidden;
}
.main-bg::before {
content: "";
position: fixed;
top: 0; left: 0; right: 0; bottom: 0;
background: url('/static/images/wallpaper.png') center center / cover no-repeat;
z-index: -1;
pointer-events: none;
}
 body {
 
  }


}

/* @media only screen and (min-width: 768px) and (max-width: 1024px) {
  .main-bg {
    flex-direction: column !important;
    align-items: stretch !important;
    padding: 0 !important;
  }
 body {

  }
  .left-panel, .col-lg-4.bg-white {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 320px;
    box-shadow: none !important;
    border-radius: 0 !important;
  }

  .left-panel {
    min-height: 300px;
    padding: 40px 24px 24px 24px !important;
    text-align: center;
    justify-content: center;
    align-items: center;
    display: flex;
    flex-direction: column;
  }

  .left-content {
    padding: 0 !important;
    text-align: center !important;
  }

  .col-lg-4.bg-white {
    padding: 32px 24px !important;
    min-height: 400px;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .form-control {
    font-size: 1rem !important;
    padding: 10px !important;
  }

  .btn_color {
    font-size: 1rem !important;
    padding: 12px 0 !important;
  }

  .mobile-header-card {
    margin-bottom: 16px !important;
  }
} */
.responsive-height {
  height: 95vh;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1366px) {
  /* Styles for all iPads */
   .remove-min-vh-100 {
    min-height: auto !important;
}

}