/**
 * @file less/forms.less
 *
 * Copyright (c) 2014-2020 Simon Fraser University
 * Copyright (c) 2003-2020 John Willinsky
 * Distributed under the GNU GPL v2. For full terms see the file docs/COPYING.
 *
 * @brief most site-wide form styles based on Bootstrap classes
 *
 */

// General form styles

label {
	font-family: @font-family-secondary;
	font-size: smaller;
}

fieldset {
	margin: 50px 0;
}

legend {
	font-weight: 600;
}

select {
	-webkit-appearance: none;
	background-position: right 50%;
	background-repeat: no-repeat;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAMCAYAAABSgIzaAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDZFNDEwNjlGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDZFNDEwNkFGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo0NkU0MTA2N0Y3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo0NkU0MTA2OEY3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PuGsgwQAAAA5SURBVHjaYvz//z8DOYCJgUxAf42MQIzTk0D/M+KzkRGPoQSdykiKJrBGpOhgJFYTWNEIiEeAAAMAzNENEOH+do8AAAAASUVORK5CYII=);
}

// Bootstrap overrides

.form-control {
	font-family: @font-family-secondary;
	font-size: smaller;
	border-radius: 0;
	transition: all .2s ease-in;

	&:hover, &:focus, &:active {
		border-color: @primary-colour;
		box-shadow: 0 0 0 0.1rem @primary-colour;
		padding-left: 0.25em;
		padding-right: 0.25em;
		transition: all .2s ease-out;
	}

}

.custom-radio .custom-control-input:checked ~ .custom-control-label::before,
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before,
.custom-control-input:checked ~ .custom-control-label::before {
	background-color: #000;
}

.custom-control-input:active ~ .custom-control-label::before {
	background-color: rgba(0, 0, 0, 0.5);
}

.custom-control-input:focus ~ .custom-control-label::before {
	box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem @primary-colour;
}

.custom-checkbox .custom-control-label::before {
	border-radius: 0;
}

.btn {
	border-radius: 0;
	font-family: @font-family-secondary;
	font-size: 0.65rem;
	border-color: #000;
	background-color: #fff;
	box-shadow: none;
	.button();

	&:hover, &:focus, &:active {
		color: @contrast-colour;
	}
}

.btn-primary {
	&:extend(.btn);
	background-color: @primary-colour;
	border-color: @contrast-colour;
	font-weight: 600;
	color: @contrast-colour;
	box-shadow: none;

	&:hover, &:focus, &:active {
		background-color: #000;
		text-decoration: none;
		color: white;
		box-shadow: none;
	}
}

.btn-primary:hover,
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show > .btn-primary.dropdown-toggle {
	background-color: #000;
	border-color: #000;
}

.btn-secondary {
	&:extend(.btn);
	background-color: #FFF;
	border-color: #000;
	color: #000;

	&:hover, &:focus, &:active {
		background-color: @primary-colour;
		border-color: @primary-colour;
		text-decoration: none;
		color: @contrast-colour;

	}
}

.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active {
	background-color: #000;
}

// OJS classes

.form-text {
	font-family: @font-family-secondary;
	font-size: small;
	margin: 0.5em 0;
}

.custom-control-label a {
	font-size: inherit;
	font-family: inherit;
}
