/** @file search-flexbox.scss */

$flexbox-margin: 10px;

.gv-widget-search {
	-js-display: flex;
	display: flex;
	flex-flow: row wrap;
	align-content: flex-start;
	align-items: flex-start;
	justify-content: space-between;
	flex: 1 0 auto;
	margin: ( $flexbox-margin * 2 ) ($flexbox-margin * -1);


	&.gv-search-horizontal {
		.gv-search-box {
			flex: 1 1 10em;
		}

		label.gv-check-radio {
			display: inline-block;
			margin-right: 1em;
			input {
				display: inline;
			}
		}
	}

	&.gv-search-vertical {
		flex-direction: column;
		.gv-search-box {
			flex: 1 1 auto;
		}

		label.gv-check-radio {
			display: block;
			margin-bottom: .25em;
		}
	}

	.gv-search-box-links .active {
		font-weight: bold;
	}

	p {
		margin: 0 0 .75em 0;
		padding: 0;
	}

	select {
		flex-basis: auto;

		&[multiple] {
			width: 100%;
		}
	}

	.gv-search-box {
		min-width: 100px;
		align-self: auto;
		margin: 0 $flexbox-margin;

		// The search button
		&.gv-search-box-submit {
			-js-display: flex;
			display: flex;
			width: 100%;
			flex: 0 0 auto;
			flex-flow: row wrap;

			.gv-search-button {
				order: -111;
			}
		}

		/**
		 * SEARCH ALL
		 */
		&.gv-search-field-search_all {
			flex-grow: 3;
		}

		/**
		 * DATE FIELD
		 */
		&.gv-search-date {
			-js-display: flex;
			display: flex;
			flex-flow: row wrap;

			.gv-search-horizontal & {
				flex: 1 0 20em;
			}
			justify-content: flex-start;

			p {
				-js-display: flex;
				display: flex;
				flex-wrap: wrap;
				justify-content: flex-start;
			}

			input {
				margin-bottom: .5em;
				margin-right: 1%;
				flex: 1 1 49%;
			}
		}
	}
}

.gv-search-clear {
	display: none;

	.gv-is-search & {
		order: 2;
		display: inline-block;
		margin: 0 3%;
		height: 100%; // Otherwise, the text border stretches to max height
	}
}