// Styles spécifiques à la page de login

@import "core";

$login-logo-path: "../../images/logos/logo.svg";
$login-logo-size: rem(300px 100px);
$login-logo-height: rem(100px);
$login-body-bg-color: #fff;
$login-text-color: $color-primary;
$login-link-color: $color-primary;
$login-link-hover-color: $color-primary;
$login-remember-input-check-color: $color-primary;
$login-btn-bg-color: $color-primary;
$login-btn-hover-bg-color: $color-primary;

html,
body {
  &::before,
  &::after {
    display: none;
  }
}

body.login {
  // screen background color
  background: $login-body-bg-color;

  // logo (before login form) path and size
  h1 a {
    display: block;
    width: 100%;
    height: $login-logo-height;
    background-image: url(#{$login-logo-path});
    background-repeat: no-repeat;
    background-position: center center;
    background-size: $login-logo-size;
  }

  // notice block border-left color
  .message,
  .success,
  #login_error {
    border-left-color: $login-text-color;
  }

  // default link styles
  a {
    color: $login-link-color;
    text-decoration: none;

    &:focus,
    &:hover {
      color: $login-link-hover-color;
      text-decoration: underline;
    }
  }

  // remember input checkbox check color
  input[type="checkbox"]:checked::before {
    color: $login-remember-input-check-color;
  }

  // link after login form styles
  #nav,
  #backtoblog {
    a {
      color: $login-link-color;

      &:focus,
      &:hover {
        color: $login-link-hover-color;
        text-decoration: underline;
      }
    }
  }
}

// submit login form button styles
.wp-core-ui {
  .button-primary {
    text-shadow: none;
    background-color: $login-btn-bg-color;
    border: 0;
    box-shadow: none;
    transition: all .2s ease;

    &:hover {
      background-color: $login-btn-hover-bg-color;
    }
  }
}