:root {
    --primary_color: #FFCB05;
    --secondary_color: black;
    --tertiary_color: rgba(0, 0, 0, 0.8);
}

body {
	background-image: url('/wp-content/uploads/2023/11/La-Federation-Williams-France.jpg');
	background-size: cover;
	background-position: 50% 80%;
	background-repeat: no-repeat;
}

#login h1 a, .login h1 a {
    padding-bottom: 0;
}

.language-switcher {
    display: none;
}

#login {
    padding: 0 200px;
    margin: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100vh;
    background-color: var(--primary_color);
    color: var(--secondary_color);
}

.login form {
    background: 0;
    margin-top: 0;
    box-shadow: none;
    border: none;
}

.login form .input {
    background: 0;
    border: none;
    border-bottom: 2px solid var(--secondary_color);
    border-radius: 0;
    color: var(--secondary_color);
    box-shadow: none !important;
}

#login a, #login p, #login label {
    color: var(--secondary_color) !important;
    transition: ease-in-out .2s;
}

#login a:hover, #login p:hover {
    color: var(--tertiary_color);
}

input[type=checkbox]:focus, input[type=color]:focus, input[type=date]:focus, input[type=datetime-local]:focus, input[type=datetime]:focus, input[type=email]:focus, input[type=month]:focus, input[type=number]:focus, input[type=password]:focus, input[type=radio]:focus, input[type=search]:focus, input[type=tel]:focus, input[type=text]:focus, input[type=time]:focus, input[type=url]:focus, input[type=week]:focus, select:focus, textarea:focus {
    box-shadow: none;
}

.wp-core-ui .button, .wp-core-ui .button-secondary, .wp-core-ui .button-primary {
    background-color: var(--secondary_color);
    color: var(--primary_color);
    border: var(--secondary_color);
    transition: ease-in-out .2s;
    text-shadow: none !important;
}

.wp-core-ui .button-primary.focus, .wp-core-ui .button-primary.hover, .wp-core-ui .button-primary:focus, .wp-core-ui .button-primary:hover {
    background-color: var(--tertiary_color);
    color: var(--primary_color);
    border: var(--tertiary_color);
}

input[type=checkbox], input[type=radio] {
    border-radius: 6px;
}

#login_error, #login p.message {
    color: black !important;
}

.wp-core-ui .button-primary.focus, .wp-core-ui .button-primary:focus {
    box-shadow: none;
}

@media screen and (max-width: 782px) {
    body{
        overflow: hidden;
    }
    #login {
        padding: 12%;
    }
}

@media screen and (max-width: 500px) {
    #login {
        padding: 0;
        margin: auto;
        width: 100vw;
        height: 100vh;
    }
}