html, body {
  height: 100%;
  min-height: 100vh;
}
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  margin: 0;
  padding-top: 60px;
  font-family: sans-serif;
  background: #addaff;
  background: -webkit-linear-gradient(90deg,rgba(173, 218, 255, 1) 0%, rgba(157, 157, 209, 1) 35%, rgba(102, 181, 196, 1) 100%);
  background: -moz-linear-gradient(90deg,rgba(173, 218, 255, 1) 0%, rgba(157, 157, 209, 1) 35%, rgba(102, 181, 196, 1) 100%);
  background: linear-gradient(90deg,rgba(173, 218, 255, 1) 0%, rgba(157, 157, 209, 1) 35%, rgba(102, 181, 196, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(
    startColorstr="#ADDAFF",
    endColorstr="#66B5C4",
    GradientType=1
  );
  color: #fff;
}




.knapp {
  font-size: 1em; border: none; background: #2980b9; color: #fff; border-radius: 7px;
  padding: 0.45em 1.5em; cursor: pointer; width: auto; transition: 0.12s; margin-bottom: 0; font-weight: 500; text-decoration: none; display: inline-block;
}





/* Modal */
.modal-bg {
  position: fixed; left: 0; top: 0; right: 0; bottom: 0; background: #000c; z-index: 99999; display: flex;
  align-items: flex-start; justify-content: center; padding-top: 80px;
}
.modal {
  background: #fff; color: #222; border-radius: 16px; min-width: 290px; max-width: 420px; width: 98vw; margin: auto;
  padding: 2em 1.5em 1.3em 1.5em; box-shadow: 0 10px 48px #0006; position: relative; z-index: 100000; display: block;
  animation: modalPop 0.26s cubic-bezier(0.23, 1.09, 0.51, 0.93);
}



.admin-login-wrapper {
  display: flex; flex-direction: column; justify-content: center; align-items: center;
}
body.login-bg {
  background-image: url('bg.png');
  background-size: cover; background-position: center; background-repeat: no-repeat; background-attachment: fixed;
}
.admin-login-card {
  background: #23282d; border-radius: 16px; box-shadow: 0 8px 40px #000a; padding: 2.8em 2.2em 2em 2.2em; max-width: 350px; width: 100%;
  margin: 30px auto; color: #fff; display: flex; flex-direction: column; gap: 1.25em; border: 1.5px solid #2d3742;
}
.admin-login-card h2 {
  font-size: 1.48em; text-align: center; margin-bottom: 0.3em; letter-spacing: 0.01em; color: #70b1fa; font-weight: 700;
}
.admin-login-card label {
  font-size: 1.07em; color: #b0d1ff; font-weight: 500; margin-bottom: 0.27em; display: block;
}
.admin-login-card input[type="text"], .admin-login-card input[type="password"] {
  width: 100%; padding: 0.85em 1em; border-radius: 8px; border: 1.5px solid #3d4d60; background: #1c2227;
  color: #fff; font-size: 1em; margin-bottom: 1.05em; box-sizing: border-box; transition: border 0.16s, box-shadow 0.15s;
}
.admin-login-card input[type="text"]:focus, .admin-login-card input[type="password"]:focus {
  border-color: #6bb5ff; box-shadow: 0 0 0 2px #6bb5ff40; outline: none;
}
.admin-login-card button, .admin-login-card input[type="submit"] {
  width: 100%; padding: 0.9em 0; background: linear-gradient(90deg, #2980b9 0%, #70b1fa 100%); color: #fff; border: none; border-radius: 8px;
  font-size: 1.09em; font-weight: 700; cursor: pointer; box-shadow: 0 2px 10px #0003; letter-spacing: 0.02em; transition: background 0.15s, transform 0.13s;
}
.admin-login-card button:hover, .admin-login-card input[type="submit"]:hover {
  background: linear-gradient(90deg, #175184 0%, #2980b9 100%); transform: translateY(-2px) scale(1.03);
}
.admin-login-error {
  background: #ffb7b7; color: #910a0a; padding: 0.6em 1em; border-radius: 7px; font-size: 0.98em; margin-bottom: 1em; text-align: center;
}




/* Gruppe for innloggingsknapper */
.button-group-login {
  display: flex;
  gap: 12px;
}

/* Blå "Logg inn"-knapp */
.btn-login {
  flex: 1;
  padding: 0.9em 0;
  background: linear-gradient(90deg, #2980b9 0%, #70b1fa 100%);
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 1.1em;
  font-weight: 700;
  box-shadow: 0 2px 10px #0003;
  cursor: pointer;
  letter-spacing: 0.02em;
  transition: background 0.15s, transform 0.13s;
  line-height: 1;
  text-align: center;
  font-family: inherit;
}

.btn-login:hover {
  background: linear-gradient(90deg, #175184 0%, #2980b9 100%);
  transform: translateY(-2px) scale(1.03);
}

.button-group-login .btn-help-login {
  flex: 1;
  padding: 0.9em 0; /* Maintains exact size */
  background: orange !important; /* Matches .btn-help, !important to override potential conflicts */
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 1.1em; /* Maintains exact size */
  font-weight: 700;
  box-shadow: 0 2px 10px #0003;
  cursor: pointer;
  letter-spacing: 0.02em;
  transition: background 0.18s, transform 0.13s; /* Matches .btn-help transition */
  line-height: 1;
  text-align: center;
  font-family: inherit;
}

.button-group-login .btn-help-login:hover {
  background: #e67e22 !important; /* Matches .btn-help hover */
  transform: translateY(-2px) scale(1.03);
}