/* Login centralizado */
body {
  font-family: Arial, sans-serif;
  background: linear-gradient(135deg, #cfcfcf, #f9f9f9);
  margin: 0;
  padding: 0;
  text-align: center;
}

header .header-container {
  display: flex;
  align-items: center;
  justify-content: center;      /* mantém o texto centralizado */
  gap: 20px;
  position: relative;
  padding: 20px;

  background: linear-gradient(
    to right,
    #ffffff 15%,
    #32066d 15%,
    #32066d 85%,
    #ffffff 85%,
    #ffffff 100%
  );

  color: #f8f008;
}

/* IMAGEM DO HEADER */
header .header-container img {
  position: absolute;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);  /* centraliza verticalmente */
  height: 85px;
}

/* 📱 Ajustes para celular */
@media (max-width: 600px) {
  header .header-container {
    padding: 15px;
  }

  header .header-container img {
    height: 55px;               /* diminui no mobile */
    left: 10px;                 /* encosta um pouco mais */
  }
}

header img {
  position: absolute;
  left: 20px;
  height: 85px;
}

.login-container {
  margin: 50px auto;
  max-width: 380px;
  background-color: white;
  padding: 30px;
  border-radius: 15px;
  box-shadow: 0 6px 18px rgba(0,0,0,0.1);
  text-align: left;
}

.form-card {
  display: flex;
  flex-direction: column;
}

.form-card label {
  margin-top: 10px;
}

.form-card input {
  padding: 10px;
  border-radius: 8px;
  border: 1px solid #ccc;
  margin-top: 6px;
  box-sizing: border-box;
}

.form-card button {
  margin-top: 20px;
  padding: 12px;
  background-color: #f8f008;
  border: none;
  color: #32066d;
  border-radius: 8px;
  cursor: pointer;
  transition: 0.15s;
}

.form-card button:hover {
  background-color: #f9f630;
}

footer { margin-top: 30px; color: #666; text-align:center; }