/* # Overrides */

[vv-page="/search"]:not(body) {
	display: flex;
	flex-direction: column;
	gap: var(--padding);
}

/* # Sections */

/* ## Search */

section.search {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--padding);
	background-color: rgba(255, 255, 255, .05);
	padding: calc(var(--padding) * 1.5);
	margin-bottom: calc(var(--padding) * 2);
}

section.search form {
	display: contents;
}

section.search search {
	width: 100%;
}

section.search input {
	width: 100%;
}

section.search button[type="submit"] {
	width: 100%;
	max-width: 350px;
}

section.search > svg {
	width: 100%;
}

body:not([vv-page="/search"]) section.search {
	display: none;
}

/* # Search results */

section.results .result {
	display: flex;
	flex-direction: column;
	gap: calc(var(--padding) / 2);
}

/* ---- */

main > svg,
dialog.search search search-results > svg {
	margin: auto;
	width: 150px;
	fill: rgba(255, 255, 255, .05);
}

dialog.search search search-results .empty {
	text-align: center;
}

/* ## Titles */

section.title a h2 {
	color: var(--color-accent);
}

section.title a h2::before {
	content: "// ";
	color: white;
}

/* ## Work */

section.results.work {
	display: grid;
	grid-template-columns: 1fr;
	gap: calc(var(--padding) / 2);
}

section.results.work .result {
	padding: var(--padding);
	background-color: rgba(255, 255, 255, .03);
	border-radius: 6px;
}