/*
Theme Name: Broadsheet
Theme URI: https://rajpatel.co
Author: Raj Patel
Author URI: https://rajpatel.co
Description: An editorial block theme for technical writing. Serif headlines, a readable measure, first-class code blocks, and a card-driven home page. Built for full site editing — every colour, font and template is editable in the Site Editor.
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: broadsheet
Tags: blog, one-column, two-columns, block-patterns, full-site-editing, custom-colors, custom-menu, editor-style, featured-images, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations

Broadsheet is distributed under the terms of the GNU GPL v2 or later.

Bundled fonts:
  Newsreader    — SIL Open Font License 1.1 — https://github.com/productiontype/Newsreader
  Inter         — SIL Open Font License 1.1 — https://github.com/rsms/inter
  IBM Plex Mono — SIL Open Font License 1.1 — https://github.com/IBM/plex
*/

/*
 * Nearly all styling lives in theme.json so it stays editable in the Site Editor.
 * What follows is the small set of rules that theme.json cannot express.
 */

/* ---- Kerning and ligatures for headline serif ---- */
h1, h2, h3, h4, h5, h6,
.wp-block-post-title,
.wp-block-site-title {
	font-kerning: normal;
	font-feature-settings: "kern" 1, "liga" 1;
	text-wrap: balance;
}

/* ---- Readable, non-orphaned paragraphs ---- */
p {
	text-wrap: pretty;
}

/* ---- Drop the gap under the last block in an entry ---- */
.wp-block-post-content > *:last-child {
	margin-bottom: 0;
}

/* ---- Post cards: lift on hover ---- */
.broadsheet-card {
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.broadsheet-card:hover,
.broadsheet-card:focus-within {
	transform: translateY(-2px);
	box-shadow: 0 12px 28px -18px rgba(20, 22, 28, 0.45);
}

/* ---- Underline links on hover only inside running text ---- */
.wp-block-post-content a:where(:not(.wp-element-button)) {
	text-underline-offset: 0.18em;
	text-decoration-thickness: 1px;
}

.wp-block-post-content a:where(:not(.wp-element-button)):hover {
	text-decoration-thickness: 2px;
}

/* ---- Code: horizontal scroll instead of overflow ---- */
.wp-block-code,
.wp-block-preformatted {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	tab-size: 4;
}

.wp-block-code code {
	display: block;
	white-space: pre;
}

/* ---- Inline code should not inherit heading weight ---- */
:where(h1, h2, h3, h4, h5, h6) code {
	font-size: 0.9em;
	font-weight: 500;
}

/* ---- Table: keep wide technical tables usable on phones ---- */
.wp-block-table {
	overflow-x: auto;
}

.wp-block-table table {
	border-collapse: collapse;
}

.wp-block-table th {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

/* ---- Eyebrow / meta text ---- */
.broadsheet-eyebrow {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

/* ---- "Read more" is fit-content, so constrained layouts centre it ----
 * Core's constrained-layout rule sets auto margins with !important, which
 * centres any fit-content child. Match that specificity to keep the link
 * aligned with the text above it.
 */
.is-layout-constrained > .wp-block-read-more,
.wp-block-read-more {
	margin-left: 0 !important;
	margin-right: auto !important;
}

/* ---- Unbulleted lists in furniture (footer, sidebar, 404) ---- */
.wp-block-categories-list,
.wp-block-latest-posts__list,
.wp-block-archives-list {
	list-style: none;
	padding-left: 0;
}

.wp-block-latest-posts__post-date {
	color: var(--wp--preset--color--contrast-2);
	font-size: var(--wp--preset--font-size--x-small);
}

/* Link lists in the sidebar and footer read as navigation, not as running
   text — so they drop the red and the permanent underline. */
.wp-block-categories-list a,
.wp-block-latest-posts__list a,
.wp-block-archives-list a {
	color: inherit;
	text-decoration: none;
}

.wp-block-categories-list a:hover,
.wp-block-latest-posts__list a:hover,
.wp-block-archives-list a:hover {
	color: var(--wp--preset--color--accent);
	text-decoration: underline;
}

.wp-block-latest-posts__list li + li {
	margin-top: 0.75em;
}

/* ---- Screen-reader-only text ----
 * Shipped with the theme rather than relied on from core, so labels stay
 * hidden even if a plugin dequeues the classic-themes stylesheet.
 */
.screen-reader-text {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	clip-path: none;
	height: auto;
	width: auto;
}

/* ---- Skip link ---- */
.skip-link:focus {
	background-color: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
	clip: auto !important;
	clip-path: none;
	display: block;
	font-size: 0.875rem;
	font-weight: 600;
	height: auto;
	left: 8px;
	line-height: normal;
	padding: 16px 24px;
	text-decoration: none;
	top: 8px;
	width: auto;
	z-index: 100000;
	border-radius: 4px;
}

/* ---- Respect reduced motion ---- */
@media (prefers-reduced-motion: reduce) {
	.broadsheet-card {
		transition: none;
	}

	.broadsheet-card:hover,
	.broadsheet-card:focus-within {
		transform: none;
	}
}