html,
 body {
   height: 100%;
 }

 .form-signin {
   max-width: 330px;
   padding: 1rem;
 }

 .form-signin .form-floating:focus-within {
   z-index: 2;
 }

 .form-signin input[type="email"] {
   margin-bottom: -1px;
   border-bottom-right-radius: 0;
   border-bottom-left-radius: 0;
 }

 .form-signin input[type="password"] {
   margin-bottom: 10px;
   border-top-left-radius: 0;
   border-top-right-radius: 0;
 }

 .background {
   background-image: url('./public/assets/images/logo.webp');
 }

 * {
   margin: 0;
   padding: 0;
   font-family: 'Poppins', sans-serif;
 }

 .login-container {
   display: flex;
   height: 100vh;
   flex-wrap: wrap;
 }

 .left-panel {
   width: 60%;
   background-image: url('/assets/images/32058.webp');
   background-repeat: no-repeat;
   background-position: center;
   background-size: cover;
   display: flex;
   justify-content: center;
   align-items: center;
   color: #fff;
   text-align: center;
   padding: 2rem;
 }

 .left-panel h1 {
   font-size: 2rem;
   font-weight: bold;
 }

 .left-panel p {
   font-size: 1rem;
   margin-top: 1rem;
 }

 .right-panel {
   width: 40%;
   display: flex;
   justify-content: center;
   align-items: center;
   padding: 3rem;
 }

 .login-card {
   width: 100%;
   max-width: 400px;
 }

 .login-card h2 {
   font-size: 1.8rem;
   margin-bottom: 1rem;
 }

 .social-login a {
   display: inline-block;
   width: 40px;
   height: 40px;
   line-height: 40px;
   text-align: center;
   border-radius: 50%;
   background: #1f1f1f;
   margin: 0 5px;
   font-size: 18px;
   color: #fff;
 }

 .social-login a:hover {
   background: #007bff;
 }

 .forgot-password {
   float: right;
   font-size: 0.9rem;
 }

 /* Hide left panel on small screens */
 @media (max-width: 768px) {
   .left-panel {
     display: none;
   }

   .right-panel {
     flex: 1 1 100%;
   }
 }