body {
  font-family: "Lato", sans-serif;
  background-color: #f4f4f4;
}

/* Ogólny styl dla kontenera formularza */
.login-container {
  display: flex;
  flex-direction: column;
  align-items: center; /* Wyśrodkowanie w poziomie */
  justify-content: center; /* Wyśrodkowanie w pionie */
  height: 100vh; /* Wysokość na pełny ekran */
}

/* Styl dla tytułu formularza */
.login-logo {
  display: flex;
  justify-content: center;
  margin-bottom: 20px; /* Odstęp pod tytułem */
}

.login-logo img {
  max-width: 65% !important;
}

/* Styl dla formularza */
.login-form {
  width: 100%; /* Szerokość formularza */
  max-width: 300px; /* Maksymalna szerokość formularza */
}

/* Styl dla pól formularza */
.form-input {
  width: 100%; /* Szerokość pól */
  padding: 12px; /* Wewnętrzny odstęp */
  margin-bottom: 15px; /* Odstęp między polami */
  border: 1px solid #ccc; /* Obramowanie */
  border-radius: 5px; /* Zaokrąglone rogi */
  font-size: 1em;
}

/* Styl dla przycisku */
.form-button {
  width: 100%; /* Szerokość przycisku */
  padding: 12px; /* Wewnętrzny odstęp */
  background-color: #4caf50; /* Kolor tła */
  color: white; /* Kolor tekstu */
  border: none; /* Bez obramowania */
  border-radius: 5px; /* Zaokrąglone rogi */
  cursor: pointer; /* Wskaźnik kursora */
  transition: background-color 0.3s; /* Efekt przejścia */
  font-size: 1.2em;
}

/* Efekt na przycisku przy najechaniu */
.form-button:hover {
  background-color: #45a049; /* Ciemniejszy kolor przy najechaniu */
}

.error-message {
  color: red;
  margin-bottom: 10px;
}