/**
 * MYWIE Webmail — page de connexion (Elastic + branding MYWIE)
 * Palette alignée sur mywie.fr (auth / gradient-hero)
 */
:root {
  --mywie-primary: hsl(25 45% 40%);
  --mywie-primary-hover: hsl(25 45% 34%);
  --mywie-foreground: hsl(25 35% 25%);
  --mywie-muted: hsl(25 20% 45%);
  --mywie-card: hsl(40 35% 96%);
  --mywie-border: hsl(35 25% 85%);
  --mywie-gradient: linear-gradient(180deg, hsl(40 40% 98%) 0%, hsl(35 35% 88%) 100%);
  --mywie-shadow: 0 20px 50px -15px hsl(25 45% 40% / 0.22);
}

html.task-login,
body.task-login {
  background: var(--mywie-gradient) !important;
  color: var(--mywie-foreground);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

body.task-login #layout {
  min-height: 100vh;
  background: transparent;
}

body.task-login h1.voice {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

body.task-login #layout-content {
  position: relative;
  top: 10vh !important;
  display: block;
  width: min(92vw, 26rem);
  max-width: 26rem;
  margin: 0 auto;
  padding: 2rem 1.75rem 1.5rem;
  text-align: center;
  background: var(--mywie-card);
  border: 1px solid var(--mywie-border);
  border-radius: 0.75rem;
  box-shadow: var(--mywie-shadow);
}

body.task-login #logo {
  position: static !important;
  top: auto !important;
  display: block;
  width: 11rem;
  height: auto;
  max-height: none;
  margin: 0 auto 1rem;
}

body.task-login #logo img {
  display: block;
  width: 11rem;
  height: auto;
  max-height: 3.5rem;
  object-fit: contain;
}

body.task-login .mywie-login-header {
  margin-bottom: 1.25rem;
}

body.task-login .mywie-login-header h2 {
  margin: 0 0 0.35rem;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.65rem;
  font-weight: 700;
  color: var(--mywie-foreground);
  line-height: 1.2;
}

body.task-login .mywie-login-header p {
  margin: 0;
  font-size: 0.9rem;
  color: var(--mywie-muted);
}

body.task-login .mywie-login-badge {
  margin: 0 0 1.25rem;
  padding: 0.65rem 0.75rem;
  border-radius: 0.5rem;
  background: hsl(25 45% 40% / 0.08);
  border: 1px solid hsl(25 45% 40% / 0.18);
  font-size: 0.75rem;
  line-height: 1.45;
  color: var(--mywie-muted);
  text-align: center;
}

body.task-login #login-form {
  position: static !important;
  top: auto !important;
  width: 100%;
  max-width: none;
  margin: 0;
  text-align: left;
}

body.task-login #login-form table {
  width: 100%;
}

body.task-login #login-form tr {
  display: block;
  margin-bottom: 0.85rem;
}

body.task-login #login-form td.title,
body.task-login #login-form td.input {
  display: block;
  width: 100%;
  padding: 0;
}

body.task-login #login-form td.title {
  margin-bottom: 0.35rem;
}

body.task-login #login-form label {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--mywie-foreground);
}

body.task-login #login-form .form-control {
  width: 100%;
  box-sizing: border-box;
  border-radius: 0.5rem;
  border: 1px solid var(--mywie-border);
  background: #fff;
  padding: 0.625rem 0.75rem;
  font-size: 0.9rem;
  color: var(--mywie-foreground);
  box-shadow: none;
}

body.task-login #login-form .form-control:focus {
  border-color: var(--mywie-primary);
  outline: 2px solid hsl(25 45% 40% / 0.2);
  outline-offset: 0;
}

body.task-login #login-form .formbuttons {
  margin-top: 1rem;
  text-align: center;
}

body.task-login #login-form .button.mainaction {
  width: 100%;
  border: none;
  border-radius: 0.5rem;
  background: var(--mywie-primary);
  color: #fff;
  font-size: 0.9rem;
  font-weight: 600;
  padding: 0.7rem 1rem;
  cursor: pointer;
  box-shadow: none;
}

body.task-login #login-form .button.mainaction:hover,
body.task-login #login-form .button.mainaction:focus {
  background: var(--mywie-primary-hover);
}

body.task-login #login-footer {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid var(--mywie-border);
  font-size: 0.75rem;
  color: var(--mywie-muted);
}

body.task-login #login-footer a {
  color: var(--mywie-primary);
}

body.task-login #login-footer .support-link {
  font-weight: 500;
}

html.dark-mode body.task-login {
  background: linear-gradient(180deg, hsl(25 30% 12%) 0%, hsl(25 28% 16%) 100%) !important;
}

html.dark-mode body.task-login #layout-content {
  background: hsl(25 28% 16%);
  border-color: hsl(25 25% 25%);
}

html.dark-mode body.task-login .mywie-login-header h2,
html.dark-mode body.task-login #login-form label {
  color: hsl(40 40% 95%);
}

html.dark-mode body.task-login .mywie-login-header p,
html.dark-mode body.task-login .mywie-login-badge,
html.dark-mode body.task-login #login-footer {
  color: hsl(40 25% 78%);
}

html.dark-mode body.task-login #login-form .form-control {
  background: hsl(25 25% 20%);
  border-color: hsl(25 25% 25%);
  color: hsl(40 40% 95%);
}

@media (max-width: 480px) {
  body.task-login #layout-content {
    top: 6vh !important;
    padding: 1.5rem 1.25rem 1.25rem;
  }
}
