html, body {
  height: 100%;
  overflow-x: hidden !important;
  overflow-y: hidden !important; 
}

.site-main {
  display: flex;
  align-items: flex-start;   
  justify-content: center;
  padding-top: clamp(24px, 8vh, 80px);  
  padding-bottom: 0;
}

.login-wrapper *, .login-wrapper *::before, .login-wrapper *::after { box-sizing: border-box; }

.login-wrapper {
  max-width: 440px;
  margin: 0 auto;           
  padding: 30px;
  background-color: #ffffff;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  border: 1px solid #e0e0e0;
}

/* Τίτλος */
.login-title {
  text-align: center;
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 24px;
  color: #2158A1;
}

/* Layout φόρμας */
.login-wrapper form {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 20px;
}

/* Μάζεμα default περιθωρίων Drupal */
.login-wrapper .form-item,
.login-wrapper .js-form-item,
.login-wrapper .form-actions {
  margin: 0;
  padding: 0;
  width: 100%;
}

/* Πεδία εισόδου */
.login-wrapper input[type="text"],
.login-wrapper input[type="password"],
.login-wrapper input[type="email"] {
  width: 100%;
  padding: 12px 14px;
  font-size: 1.05rem;
  border-radius: 8px;
  border: 1px solid #dcdcdc;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

/* Focus στα πεδία */
.login-wrapper input[type="text"]:focus,
.login-wrapper input[type="password"]:focus,
.login-wrapper input[type="email"]:focus {
  outline: none;
  border-color: #2158A1;
  box-shadow: 0 0 0 3px rgba(33, 88, 161, 0.2);
}

/* Κουμπί Είσοδος: ίδιο πλάτος με τα πεδία */
.login-wrapper .form-actions { display: block; }
.login-wrapper input[type="submit"],
.login-wrapper .form-actions .button {
  display: block;
  width: 100%;
  padding: 12px 14px;
  font-size: 1.08rem;
  font-weight: 600;
  border-radius: 8px;
  background-color: #2158A1;
  color: #fff;
  border: none;
  cursor: pointer;
  transition: background-color 0.2s ease, transform 0.1s ease;
  text-align: center;
}
.login-wrapper input[type="submit"]:hover,
.login-wrapper .form-actions .button:hover { background-color: #1a4580; }
.login-wrapper input[type="submit"]:active,
.login-wrapper .form-actions .button:active { transform: translateY(1px); }

/* Γενικό focus */
.login-wrapper input:focus,
.login-wrapper select:focus,
.login-wrapper textarea:focus,
.login-wrapper button:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(33, 88, 161, 0.2);
}

/* Placeholder στο focus (Chrome/Safari) */
.login-wrapper input:focus::-webkit-input-placeholder,
.login-wrapper select:focus::-webkit-input-placeholder,
.login-wrapper textarea:focus::-webkit-input-placeholder { color: transparent; }

/* Links */
.login-links, .back-to-login { margin-top: 8px; text-align: center; }
.login-wrapper .link-forgot,
.login-wrapper .link-forgot:visited,
.login-wrapper .back-to-login a,
.login-wrapper .back-to-login a:visited {
  color: var(--brand-blue, #2158A1);
  background: transparent;
  border: 0;
  padding: 0;
  text-decoration: none;
  font-weight: 600;
}
.login-wrapper .link-forgot:hover,
.login-wrapper .back-to-login a:hover { text-decoration: underline; text-underline-offset: 2px; }
.login-wrapper .link-forgot:focus,
.login-wrapper .link-forgot:focus-visible,
.login-wrapper .back-to-login a:focus,
.login-wrapper .back-to-login a:focus-visible {
  outline: none !important;
  box-shadow: none !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Responsive */
@media (max-width: 420px) {
  .site-main { padding: 16px; }
  .login-wrapper { max-width: 94%; padding: 20px; }
  .login-title { font-size: 1.8rem; margin-bottom: 18px; }
  .login-wrapper form { gap: 16px; }
}