/* Color variables */
:root {
	--links: var(--blue500);
	--nav-toggle-hover: white;
	--search-btn-bg: var(--blue100);
	--search-btn-bg-hover: var(--blue500);
	--search-btn-text-hover: white;
	--title-font-size: var(--fz16);
}

/* Removes space under post */
article {
	border: 0 !important;
	margin-bottom: 5rem !important;
	padding-bottom: 0 !important;
}

/* Customizes font family */
body {
	font-family: "Libre Franklin" !important;
}

button {
	background: none !important;
	box-shadow: none !important;

	&:hover {
		color: var(--gold500);
	}
}

/* Fixes font size */
html {
	font-size: 100%;
}

.archive-title {
	font-size: var(--title-font-size) !important;
}

/* Hides 'This entry was posted in...by...' from below post */
.entry-meta {
	display: none;
}

.page-title {
	font-size: var(--title-font-size) !important;
}

/* Customizes the search button, note the use of 'background' shorthand to reset defaults rather than background-color */
.wp-block-search__button {
	background: var(--green300) !important;
	border: none;
	font-size: var(--fz12);
	font-weight: 500;
	letter-spacing: 1px;
	padding: .7rem;
	text-transform: uppercase;
	transition: var(--transition);

	&:hover {
		background: var(--green500) !important;
		color: white;
	}
}

.wp-block-spacer {
	display: none;
}

/* Hides 'Proudly powered by WordPress' from below post */
#colophon {
	display: none;
}

/* Hides embedded default nav */
#masthead {
	display: none;
}

/* Hides 'Older Posts...' from below post */
#nav-below {
	display: none;
}

/* Customizes some default styling */
#page {
	background-color: transparent;
	box-shadow: none;
	margin: 0;
	padding: 0;

	a {
		color: var(--green700);
		hyphens: none;

		&::after {
			height: 2px !important;
		}
	}

	h1 {
		font-weight: 700;
	}

	p {
		hyphens: none;
	}
}

/* Makes main section responsive */
#primary {
	@media (width < 1200px) {
		float: none;
		width: 100%;
	}
}

/* Customizes right-side widget (Recent Posts) */
#secondary {
	@media (width < 1200px) {
		float: none;
		margin-top: 4rem;
		width: min(400px, 100%);
	}

	h2 {
		font-size: var(--fz18);
	}

	li {
		margin-top: .5rem;
		padding-left: 0;
	}

	ul {
		margin-top: 1rem;
		padding: 0;
	}
}