* {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
      font-family: 'Roboto', sans-serif;
    }
    body {
      background-color: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      height: 100vh;
    }
    .login-card {
      width: 100%;
      max-width: 360px;
      padding: 2rem;
      border-radius: 12px;
      box-shadow: 0 4px 20px rgba(0,0,0,0.1);
      background:#fff;
    }
    .login-card .logo {
      text-align: center;
      margin-bottom: 0.5rem;
    }
    .login-card .logo img {
      width: 200px;
      height:80px;
      object-fit: contain;
    }
    .login-card h2 {
      text-align: center;
      margin-bottom: 1.5rem;
      font-weight: 500;
      color: #333;
    }
    .form-group {
      margin-bottom: 1rem;
    }
    .form-group label {
      display: block;
      margin-bottom: 0.5rem;
      color: #555;
      font-size: 0.9rem;
    }
    .form-group input {
      width: 100%;
      padding: 0.75rem 1rem;
      border: 1px solid #ddd;
      border-radius: 8px;
      
      transition: border-color 0.2s;
    }
    .form-group input:focus {
      outline: none;
      border-color: #0066ff;
    }
    .submit-btn {
      width: 100%;
      padding: 0.75rem;
      background-color: #0066ff;
      color: #fff;
      border: none;
      border-radius: 8px;
      font-size: 1rem;
      font-weight: 500;
      cursor: pointer;
      transition: background-color 0.2s;
    }
    .submit-btn:hover {
      background-color: #0051cc;
    }
    .footer {
      text-align: center;
      margin-top: 1.25rem;
      font-size: 0.85rem;
      color: #aaa;
    }
   .theme-steelblue {
   &:before{
           left: 0;
   }
   }
    .input-group {
    position: relative;
    display: table;
    border-collapse: separate;
    border: 1px solid #ddd;
    border-radius: 8px;
    background-color:transparent!important;
    padding: 0 0.8rem 0 0;
    .form-control{
    border:0;
    box-shadow: inset 0 0 20px 20px #fff;
    }
}
.input-group-addon, .input-group-btn, .input-group .form-control{
display: table-cell;
}
.input-group-addon, .input-group-btn {
    width: 1%;
    white-space: nowrap;
    vertical-align: middle;
}
#togglePassword{
    cursor:pointer;
}

.forgotpass{
	padding:10px;
	text-align:center;
	font-size:14px;
	a{
	color:#888;
	&:hover{
	text-decoration:none;
	}
	}
}
.infotxt{
	color:#aaa;
	padding:10px 0;
}
.heading{
	text-align: center;
	font-size:18px;
	margin-bottom:15px;
	margin-top:-5px;
	font-weight: 500;
	color:#555;
}

.login-with-google-btn {
  transition: background-color 0.3s, box-shadow 0.3s;
  padding: 12px 16px 12px 42px;
  border: none;
  border-radius: 5px;
  box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.04), 0 1px 1px rgba(0, 0, 0, 0.25);
  color: #757575;
  font-size: 14px;
  font-weight: 500;
  width:100%;
  background-color: white;
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:center;
  border:solid 1px #ddd;
  cursor:pointer;
  text-decoration: none;
  &:before{
  content:"";
  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMTcuNiA5LjJsLS4xLTEuOEg5djMuNGg0LjhDMTMuNiAxMiAxMyAxMyAxMiAxMy42djIuMmgzYTguOCA4LjggMCAwIDAgMi42LTYuNnoiIGZpbGw9IiM0Mjg1RjQiIGZpbGwtcnVsZT0ibm9uemVybyIvPjxwYXRoIGQ9Ik05IDE4YzIuNCAwIDQuNS0uOCA2LTIuMmwtMy0yLjJhNS40IDUuNCAwIDAgMS04LTIuOUgxVjEzYTkgOSAwIDAgMCA4IDV6IiBmaWxsPSIjMzRBODUzIiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48cGF0aCBkPSJNNCAxMC43YTUuNCA1LjQgMCAwIDEgMC0zLjRWNUgxYTkgOSAwIDAgMCAwIDhsMy0yLjN6IiBmaWxsPSIjRkJCQzA1IiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48cGF0aCBkPSJNOSAzLjZjMS4zIDAgMi41LjQgMy40IDEuM0wxNSAyLjNBOSA5IDAgMCAwIDEgNWwzIDIuNGE1LjQgNS40IDAgMCAxIDUtMy43eiIgZmlsbD0iI0VBNDMzNSIgZmlsbC1ydWxlPSJub256ZXJvIi8+PHBhdGggZD0iTTAgMGgxOHYxOEgweiIvPjwvZz48L3N2Zz4=);
  background-repeat: no-repeat;
  background-position: center;
  display:inline-block;
  width:25px;
  height:25px;  
  }
}
.login-with-google-btn:hover {
  box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.04), 0 2px 4px rgba(0, 0, 0, 0.25);
}
.login-with-google-btn:active {
  background-color: #eeeeee;
}
.login-with-google-btn:focus {
  outline: none;
  box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.04), 0 2px 4px rgba(0, 0, 0, 0.25), 0 0 0 3px #c8dafc;
}