/*
Theme Name: Patriots and Prayers
Description: Child theme of Frost for Patriots and Prayers, an independent publication on faith and country.
Author: Patriots and Prayers
Template: frost
Version: 0.1.0
Requires at least: 6.7
Requires PHP: 7.4
License: GNU General Public License v3
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: patriots-and-prayers
*/

/* Most styling lives in theme.json. Keep this file for the few rules
   theme.json can't express. */

/* Frost highlights <mark> with a primary-colored bar; keep it subtle. */
mark {
	background: linear-gradient(90deg, var(--wp--preset--color--surface) 0%, var(--wp--preset--color--surface) 100%);
}

/* Form fields use the UI sans and the border color. */
input,
select,
textarea {
	border-color: var(--wp--preset--color--border);
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 400;
}

input:focus,
textarea:focus {
	background-color: var(--wp--preset--color--surface);
}

::placeholder {
	color: var(--wp--preset--color--muted);
	opacity: 1;
}

*:not(.wp-block-code) > code {
	background-color: var(--wp--preset--color--surface);
}

/* -- Header and footer -- */

/* Keep the footer at the bottom of short pages. */
.wp-site-blocks {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

.wp-site-blocks > .site-content {
	flex-grow: 1;
}

.site-header {
	border-bottom: 1px solid var(--wp--preset--color--border);
}

.site-header .wp-block-site-title,
.site-footer .wp-block-site-title {
	margin: 0;
}

.site-footer {
	border-top: 1px solid var(--wp--preset--color--border);
}

.site-footer__meta {
	font-family: var(--wp--preset--font-family--sans);
}

.site-footer__meta a {
	color: var(--wp--preset--color--contrast);
}

/* -- Mobile menu (the navigation block's overlay, below 600px) -- */

/* Open and close buttons: 44px tap targets (Frost gives them 2px padding). */
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
	border-color: var(--wp--preset--color--border);
	padding: 10px;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	align-items: flex-start;
	gap: 0;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	border-top: 1px solid var(--wp--preset--color--border);
	width: 100%;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	border-bottom: 1px solid var(--wp--preset--color--border);
	width: 100%;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content {
	display: block;
	font-size: var(--wp--preset--font-size--large);
	padding: 0.75rem 0;
	width: 100%;
}

/* -- Post lists (Articles, archives, search, Home) -- */

.pp-post-list > li + li {
	border-top: 1px solid var(--wp--preset--color--border);
	padding-top: var(--wp--style--block-gap);
}

.pp-post-row {
	gap: var(--wp--preset--spacing--small);
}

.pp-post-row__text {
	min-width: 0;
}

.pp-post-row__text > * {
	margin-block: 0;
}

.pp-post-row__text > * + * {
	margin-block-start: 0.5rem;
}

.pp-post-row__thumb {
	flex-shrink: 0;
	margin: 0.25rem 0 0;
}

@media (max-width: 600px) {

	.pp-post-row__thumb {
		width: 96px !important;
	}

	.pp-post-row__thumb img {
		aspect-ratio: 1 !important;
	}

}

.pp-archive-head {
	margin-block-end: var(--wp--preset--spacing--small);
}

.pp-archive-head > * {
	margin-block: 0;
}

.pp-topic-filter a {
	text-decoration: none;
}

.pp-topic-filter a:hover,
.pp-topic-filter a:focus {
	text-decoration: underline;
}

.wp-block-query-pagination {
	border-top: 1px solid var(--wp--preset--color--border);
	margin-block-start: var(--wp--preset--spacing--small);
	padding-top: var(--wp--style--block-gap);
}

/* -- Single post -- */

.entry-meta > *,
.entry-byline > * {
	margin: 0;
}

.entry-byline {
	color: var(--wp--preset--color--muted);
}

.entry-image {
	margin-block: var(--wp--preset--spacing--small);
}

/* Portrait phone photos inside an article shouldn't run taller than the screen. */
.entry-content .wp-block-image img {
	display: block;
	margin-inline: auto;
	max-height: 75vh;
	width: auto;
}

.entry-image:empty {
	display: none;
}

.pp-sources-heading {
	border-top: 1px solid var(--wp--preset--color--border);
	padding-top: var(--wp--preset--spacing--small);
}

/* -- Newsletter signup -- */

.pp-newsletter__embed {
	margin-inline: auto;
	max-width: 520px;
}

/* -- Homepage -- */

.pp-section-head > * {
	margin: 0;
}

.pp-section-head a,
.pp-home-about a {
	text-decoration: none;
}

.pp-home-intro .wp-block-image {
	margin: 0;
}

/* Visually hidden, still read by screen readers (e.g. the Subscribe page title). */
.screen-reader-text {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	white-space: nowrap;
	width: 1px;
	word-wrap: normal !important;
}

/* -- Subscribe page: the signup band fills the page -- */

.pp-subscribe-main {
	display: flex;
	flex-direction: column;
}

.pp-subscribe-main > .wp-block-template-part {
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}

.pp-subscribe-main .pp-newsletter {
	flex-grow: 1;
	margin: 0;
}

/* -- Key Point label (styling, so it never becomes post text) -- */

.is-style-pp-key-point::before {
	color: var(--wp--preset--color--primary);
	content: "Key point";
	display: block;
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: 0.06em;
	margin-bottom: 0.35rem;
	text-transform: uppercase;
}

/* Visible keyboard focus everywhere. */
:where(a, button, input, select, textarea, .wp-element-button):focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 2px;
}
