
:root {
  --sigrh-green:#07833f;
  --sigrh-yellow:#f4b914;
  --sigrh-blue:#073c86;
  --sigrh-navy:#052b65;
  --sigrh-login-bg-size:cover;
  --sigrh-login-bg-position:center center;
  --sigrh-login-body-bg:#062f72;
}

html, body.login { min-height:100%; }
body.login {
  position:relative;
  margin:0;
  min-height:100vh;
  overflow:hidden;
  background:var(--sigrh-login-body-bg);
  font-family:Arial, Helvetica, sans-serif;
}

body.login::before {
  content:"";
  position:fixed;
  inset:0;
  background-image:var(--sigrh-login-bg);
  background-position:var(--sigrh-login-bg-position);
  background-repeat:no-repeat;
  background-size:var(--sigrh-login-bg-size);
  z-index:0;
}
body.login::after {
  content:"";
  position:fixed;
  inset:0;
  background:linear-gradient(to bottom, rgba(3,23,58,.02), rgba(3,23,58,.05));
  pointer-events:none;
  z-index:0;
}

body.login h1,
body.login .language-switcher,
body.login .privacy-policy-page-link,
body.login #backtoblog { display:none !important; }

body.login #login {
  position:fixed;
  z-index:2;
  left:50%;
  top:56%;
  width:min(340px, calc(100vw - 26px));
  margin:0;
  padding:0;
  transform:translate(-50%, -50%);
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

body.login #login_error,
body.login .message,
body.login .success {
  position:fixed;
  z-index:4;
  top:12px;
  left:50%;
  transform:translateX(-50%);
  width:min(620px, calc(100vw - 32px));
  margin:0;
  border-left:4px solid var(--sigrh-yellow);
  border-radius:7px;
  box-shadow:0 10px 30px rgba(0,0,0,.18);
}

body.login form {
  position:relative;
  width:100%;
  margin:0 auto !important;
  padding:44px 14px 8px !important;
  border:1px solid rgba(255,255,255,.48) !important;
  border-radius:18px !important;
  background:rgba(255,255,255,.30) !important;
  box-shadow:0 16px 48px rgba(0,27,62,.10) !important;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  overflow:visible;
}
body.login form::before {
  content:"";
  position:absolute;
  top:-11px;
  left:50%;
  transform:translateX(-50%);
  width:36px;
  height:34px;
  border-radius:50%;
  background:var(--sigrh-blue) center/15px 15px no-repeat;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='10' width='16' height='11' rx='2'/%3E%3Cpath d='M8 10V7a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E");
  box-shadow:0 6px 16px rgba(0,42,102,.25);
}
body.login form::after {
  content:"Connexion";
  position:absolute;
  top:12px;
  left:0;
  width:100%;
  text-align:center;
  font-size:16px;
  font-weight:800;
  color:var(--sigrh-navy);
}

body.login form p,
body.login .user-pass-wrap { margin:0 0 11px !important; }

body.login p label[for="user_login"],
body.login .user-pass-wrap label[for="user_pass"] {
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0, 0, 0, 0) !important;
  white-space:nowrap !important;
  border:0 !important;
}

body.login input[type="text"],
body.login input[type="password"] {
  box-sizing:border-box;
  width:100%;
  height:34px;
  margin:0;
  padding:0 36px 0 36px;
  border:1px solid rgba(178,188,199,.65);
  border-radius:7px;
  background:rgba(255,255,255,.85);
  box-shadow:none;
  color:#3f4b5a;
  font-size:12px;
  outline:none;
}
body.login #user_login {
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23737b87'%3E%3Cpath d='M12 12a5 5 0 1 0-5-5 5 5 0 0 0 5 5Zm0 2c-4.33 0-8 2.17-8 4.5V21h16v-2.5c0-2.33-3.67-4.5-8-4.5Z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-size:15px 15px;
  background-position:11px center;
}
body.login #user_pass {
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23737b87'%3E%3Cpath d='M17 8h-1V6A4 4 0 0 0 8 6v2H7a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-9a2 2 0 0 0-2-2Zm-7-2a2 2 0 1 1 4 0v2h-4Z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-size:15px 15px;
  background-position:11px center;
}
body.login input[type="text"]:focus,
body.login input[type="password"]:focus {
  border-color:rgba(5,116,55,.45);
  background:rgba(255,255,255,.94);
  box-shadow:0 0 0 2px rgba(5,116,55,.12);
}
body.login input::placeholder { color:#8c939d; opacity:1; }

body.login .wp-pwd { position:relative; }
body.login .button.wp-hide-pw {
  position:absolute;
  top:1px;
  right:3px;
  width:28px;
  height:28px;
  min-height:auto;
  border:0;
  background:transparent;
  color:#727b86;
  box-shadow:none;
}
body.login .button.wp-hide-pw:hover,
body.login .button.wp-hide-pw:focus { background:transparent; color:#4e5968; box-shadow:none; }

body.login .forgetmenot {
  display:flex;
  align-items:center;
  justify-content:flex-start;
  position:relative;
  float:none;
  margin:2px 0 10px !important;
}
body.login .forgetmenot label {
  display:flex !important;
  align-items:center;
  gap:5px;
  color:#0d2f66;
  font-size:10px;
  line-height:1.2;
}
body.login input[type="checkbox"] {
  width:12px;
  height:12px;
  min-width:12px;
  margin:0;
  border-color:#b4bbc5;
  background:rgba(255,255,255,.92);
  box-shadow:none;
}
body.login input[type="checkbox"]:checked::before { color:var(--sigrh-green); }

body.login .submit {
  margin:4px 0 0 !important;
  padding:0 !important;
  text-align:center;
}
body.login .button-primary {
  float:none;
  display:inline-block;
  width:min(205px, 100%);
  min-height:34px;
  border:0;
  border-radius:7px;
  background:linear-gradient(180deg, rgba(13,143,67,.97), rgba(6,109,49,.97)) !important;
  box-shadow:0 8px 20px rgba(6,109,49,.18) !important;
  text-shadow:none;
  color:#fff;
  font-size:13px;
  font-weight:700;
  letter-spacing:.01em;
}
body.login .button-primary:hover,
body.login .button-primary:focus { background:#046b31 !important; box-shadow:0 0 0 3px rgba(5,126,56,.18) !important; }

body.login #nav {
  position:absolute;
  right:16px;
  top:151px;
  width:auto;
  margin:0;
  padding:0;
  text-align:right;
  font-size:10px;
  line-height:1.2;
  z-index:3;
}
body.login #nav a { color:#0d5ab5; text-decoration:none; }
body.login #nav a:hover { color:#063b7c; text-decoration:underline; }

body.login.sigrh-secondary-screen {
  overflow:auto;
}
body.login.sigrh-secondary-screen::before {
  background-size:var(--sigrh-login-bg-size, cover);
  filter:saturate(.96) brightness(.80);
}
body.login.sigrh-secondary-screen #login {
  position:relative;
  left:auto;
  top:auto;
  transform:none;
  width:min(340px, calc(100vw - 24px));
  margin:170px auto 24px;
}

@media (max-width: 900px) {
  body.login {
    overflow:auto;
  }
  body.login::before {
    background-size:var(--sigrh-login-bg-size, cover);
    filter:saturate(.96) brightness(.82);
  }
  body.login #login {
    position:relative;
    left:auto;
    top:auto;
    transform:none;
    width:min(330px, calc(100vw - 18px));
    margin:96px auto 16px;
  }
  body.login form { padding:42px 14px 10px !important; }
}

@media (max-width: 420px) {
  body.login #login {
    width:calc(100vw - 16px);
  }
  body.login form { padding:40px 12px 10px !important; }
  body.login form::after { font-size:16px; }
  body.login .button-primary { width:100%; }
}

@media (max-width: 420px) {
  body.login #nav { margin:-24px 0 8px auto; font-size:10px; }
}


@media (max-width: 900px) {
  body.login #login {
    margin:108px auto 18px;
  }
  body.login #nav {
    right:12px;
    top:146px;
    bottom:auto;
    font-size:10px;
  }
  body.login.sigrh-secondary-screen #login {
    margin:140px auto 24px;
  }
}

@media (max-width: 420px) {
  body.login #nav {
    right:9px;
    top:140px;
    bottom:auto;
    font-size:9px;
  }
  body.login.sigrh-secondary-screen #login {
    margin:130px auto 22px;
  }
}
