:root, 
:host {
    --clear-primary: #00b2a9;
    --clear-secondary: #071f2c;
    --clear-white: #fff;
    --clear-font: 'Arboria', 'Helvetica Neue', Helvetica, Arial, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Liberation Sans', 'Nimbus Sans L', 'FreeSans', sans-serif;
}

body { 
    font-family: var(--clear-font);
}

.login {
    background-color: var(--clear-secondary);

    #backtoblog a, #nav a {
        color: var(--clear-white);
        transition: color 200ms ease;
        &:hover {
            color: var(--clear-primary);
        }
    }

    .button {
        background-color: var(--clear-primary);
        border-color: currentColor;
        transition: background-color 200ms ease, border-color 200ms ease;
        &:hover,
        &:focus {
            background-color: var(--clear-secondary);
            border-color: currentColor;
        }
    }

    h1.wp-login-logo {
		a {
			display: flex;
			justify-content: center;
			align-items: flex-end;
			background: transparent;
			width: auto;
			height: 40px;
			padding: 0 1.5rem;

			&::before,
			&::after {
				content: '';
				display: block;
				background-color: transparent;
				background-position: center center;
				background-repeat: no-repeat;
				background-size: contain;
			}
			&::before {
                background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='127.2' height='40'%3E%3Cpath fill='%23ffffff' d='M40.7 39.5a.5.5 0 0 1-.5.5h-6.3a.5.5 0 0 1-.5-.5V.5a.5.5 0 0 1 .5-.5h6.3a.5.5 0 0 1 .5.5Zm67.6-15.1v15a.5.5 0 0 1-.6.6h-6.2a.5.5 0 0 1-.6-.5v-1.9a15.6 15.6 0 1 1 7.4-13.2ZM92.6 16a8.3 8.3 0 1 0 8.4 8.3 8.3 8.3 0 0 0-8.4-8.3Zm34-7.3a15.6 15.6 0 0 0-15.5 15.6v15a.5.5 0 0 0 .5.6h6.2a.5.5 0 0 0 .6-.5V24.4a8.3 8.3 0 0 1 7.3-8.3h1a.5.5 0 0 0 .5-.5V9.3a.5.5 0 0 0-.5-.5ZM30.4 28.3h-7a.5.5 0 0 0-.5.2 8.3 8.3 0 1 1 0-8.2.5.5 0 0 0 .4.2h7.2a.3.3 0 0 0 .3-.3 15.6 15.6 0 1 0 0 8.4c0-.4-.4-.3-.4-.3Zm44.3-4a15.7 15.7 0 0 1-.2 3 .4.4 0 0 1-.4.2H51.3a8.3 8.3 0 0 0 13.3 3 1 1 0 0 1 .5-.2h8s.3 0 .2.4a15.6 15.6 0 1 1 1.3-6.3Zm-7.9-3a8.3 8.3 0 0 0-15.4 0Z'/%3E%3C/svg%3E");				width: 128px;
				height: 40px;
			}
		}
	}
}