/* -------------------------------- */
/* ---------  PAGE LOGIN  --------- */
/* -------------------------------- */

/* Variables */
body.login {
  --color-primary : #302682;
  --color-primary-hover : #1d174e;
}

/* Selection */
body.login ::selection {
  background-color: var(--color-primary);
  color: white;
}

/* Logo */
body.login h1 a {
  background-image: url('../images/logo-fayat.png');
  background-position: bottom;
  background-size: contain;
  width: 100%;
  pointer-events: none;
}

/* Mot de passe */
body.login .button.wp-hide-pw:is(:hover,:focus,:active) {
  color: var(--color-primary-hover);
}

/* Bouton de connexion */
body.login .button.button-primary {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
  color: white;
  transition-duration: .3s;
}
body.login .button.button-primary:is(:hover,:focus,:active) {
  background-color: var(--color-primary-hover);
  border-color: var(--color-primary-hover);
  color: white;
}
body.login .button.button-primary:focus {
  box-shadow: 0 0 0 1px #fff,0 0 0 3px var(--color-primary);
}
body.login input[type="checkbox"]:checked::before {
  content: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20d%3D%27M14.83%204.89l1.34.94-5.81%208.38H9.02L5.78%209.67l1.34-1.25%202.57%202.4z%27%20fill%3D%27%302682c4%27%2F%3E%3C%2Fsvg%3E');
}

/* Liens */
body.login a {
  color: var(--color-primary);
}
body.login a:is(:hover,:focus,:active),
body.login #nav a:is(:hover,:focus,:active),
body.login #backtoblog a:is(:hover,:focus,:active) {
  color: var(--color-primary);
  text-decoration: none;
}
body.login a:focus {
  box-shadow: 0 0 0 1px var(--color-primary),0 0 2px 1px var(--color-primary);
}

/* Bouton du sélecteur de langue */
body.login select:is(:hover,:focus,:active) {
  color: var(--color-primary);
}
body.login .button {
  color: var(--color-primary);
  border-color: var(--color-primary);
  transition-duration: .3s;
}
body.login .button:is(:hover,:focus,:active) {
  color: white;
  background-color: var(--color-primary-hover);
  border-color: var(--color-primary-hover);
}

/* Focus des éléments cliquables */
body.login :is(.button.wp-hide-pw,input[type="checkbox"],select):focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 1px var(--color-primary);
}
