/*
Theme Name: Properly Palmer
Theme URI: https://properlypalmer.com
Author: John Palmer
Author URI: https://properlypalmer.com
Description: A full-site-editing WordPress block theme built for a wide-ranging personal blog. Each category gets its own rotating accent color so posts on totally different topics still feel like they belong to one cohesive, engaging site. Includes a styled homepage grid, category archives, single post layout with author bio and related posts, search, and 404.
Requires at least: 6.4
Tested up to: 6.6
Requires PHP: 7.4
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: properly-palmer
Tags: blog, one-column, two-columns, grid-layout, block-patterns, full-site-editing, custom-colors, custom-menu, featured-images, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/* Fallback / progressive-enhancement styles. Most visual design lives in theme.json,
   but a few things (category color chips, card hover states, reading-time badge)
   are easiest to hand-write here. */

.wp-block-post-featured-image {
	overflow: hidden;
	border-radius: 14px;
}

.pp-card {
	border-radius: 16px;
	overflow: hidden;
	transition: transform 0.18s ease, box-shadow 0.18s ease;
	background: var(--wp--preset--color--surface);
}

.pp-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 28px rgba(20, 20, 30, 0.12);
}

.pp-card img {
	transition: transform 0.4s ease;
}

.pp-card:hover img {
	transform: scale(1.04);
}

/* Category chip — color is set inline per-post via functions.php using
   --pp-accent, so the same markup works for any category name. */
.pp-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	padding: 5px 12px;
	border-radius: 999px;
	background: var(--pp-accent, #6b5ce7);
	color: #fff;
	text-decoration: none;
}

.pp-chip:hover {
	color: #fff;
	opacity: 0.88;
}

.pp-meta {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 0.85rem;
	color: var(--wp--preset--color--muted);
}

.pp-reading-time::before {
	content: "•";
	margin-right: 10px;
	opacity: 0.5;
}

.pp-accent-border {
	border-left: 4px solid var(--pp-accent, #6b5ce7);
	padding-left: 20px;
}

.pp-topic-nav {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.pp-topic-nav a {
	padding: 6px 14px;
	border-radius: 999px;
	background: var(--wp--preset--color--surface-alt);
	font-size: 0.85rem;
	font-weight: 600;
	text-decoration: none;
}

.pp-author-box {
	border-radius: 18px;
	background: var(--wp--preset--color--surface-alt);
	padding: 28px;
}

.pp-author-box img {
	border-radius: 999px;
}

@media (max-width: 600px) {
	.pp-author-box {
		padding: 20px;
	}
}