/**
 * @file plugins/themes/default/styles/pages/register.less
 *
 * Copyright (c) 2014-2021 Simon Fraser University
 * Copyright (c) 2003-2021 John Willinsky
 * Distributed under the GNU GPL v3. For full terms see the file docs/COPYING.
 *
 * @brief Styles applying to the registration page
 * @link templates/frontend/pages/userRegister.tpl
 */
.page_register {

	.required_label {
		font-size: @font-sml;
		line-height: @line-sml;
		color: @text-light;
		margin-bottom: @double;
	}

	.consent {
		margin-bottom: 0;
	}

	.fields .reviewer_interests {
		max-height: 0;
		padding-bottom: 0;
		overflow: hidden;
		opacity: 0;
		transition: all 0.3s;

		&.is_visible {
			max-height: 400px;
			overflow: visible;
			padding-bottom: @triple;
			opacity: 1;
		}
	}

	.context_optin {

		.contexts {
			&:extend(.pkp_unstyled_list);

			> li {
				margin-bottom: 1em;

				&:last-child {
					margin-bottom: 0;
				}
			}
		}

		.roles {
			padding: @half 0;
			margin-bottom: 0;

			legend {
				&:extend(.pkp_screen_reader);
			}

			label {
				display: inline-block;
				margin-right: 1em;
				font-size: @font-sml;
				line-height: @line-sml;
			}
		}

		.context_privacy {
			position: absolute;
			left: -9999px;
			padding: @half 0;
			font-size: @font-sml;
			line-height: @line-sml;
		}

		.context_privacy_visible {
			position: relative;
			left: auto;
		}
	}

	// Styles for form error list, which is still tied to a template shared by
	// the backend
	#formErrors {
		margin: @double 0;
		padding: @base;
		background: @no;
		color: #fff;

		.pkp_form_error {
			padding: 0;
			font-size: @font-sml;
			font-weight: bold;
			line-height: @line-sml;

		}

		.pkp_form_error_list {
			margin: 0;
			padding-left: @double;
			font-size: @font-sml;
			line-height: @line-sml;

			a {
				color: #fff;
			}
		}
	}

	@media(min-width: @screen-tablet) {

		.identity li {
			display: inline-block;
			padding-right: 1em;
			max-width: 13em;
		}
	}

	@media(min-width: @screen-lg-desktop) {

		.identity li {
			max-width: 17em;
		}
	}
}

.pkp_op_register {

	.ui-helper-hidden-accessible {
	    clip: rect(1px, 1px, 1px, 1px);
	    position: absolute !important;
	    left: -2000px;

	    &:focus {
	        background-color: #fff;
	        border-radius: 3px;
	        box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	        -webkit-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	        clip: auto !important;
	        color: #000;
	        display: block;
	        font-size: @font-base;
	        height: auto;
	        line-height: normal;
	        padding: @base;
	        position: absolute;
	        left: @half;
	        top: @half;
	        text-decoration: none;
	        width: auto;
	        z-index: 100000;
    	}
    }

	.ui-autocomplete {
		position: absolute !important;
	}
}