/*
Theme Name: Black Comedy News
Theme URI: https://www.blackcomedynews.com/
Author: Black Comedy News
Description: The World of Black Comedians and All the News. A dark, comedy-club block theme with a front page built around top stories, tour dates, a Comedians A–Z directory, videos and a one-liner of the day. Works best with the BCN Core plugin.
Version: 1.0.0
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: blackcomedynews
Tags: news, blog, dark, block-patterns, full-site-editing, wide-blocks
*/

/* Small touches theme.json can't express. Everything else lives in theme.json. */

:where(a, button, input):focus-visible {
	outline: 2px solid var(--wp--preset--color--gold);
	outline-offset: 2px;
}

.bcn-kicker {
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 700;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gold);
}

.bcn-wordmark a { color: var(--wp--preset--color--cream); }
.bcn-wordmark a:hover { color: var(--wp--preset--color--cream); opacity: 0.9; }

/* Story lists: divider between items */
.bcn-stack > li + li {
	border-top: 1px solid var(--wp--preset--color--line);
	padding-top: var(--wp--preset--spacing--40);
}

/* Tour date rows */
.bcn-tour-list > li {
	border-top: 1px solid var(--wp--preset--color--line);
	padding-block: 1.1rem;
}
.bcn-tour-list > li:last-child { border-bottom: 1px solid var(--wp--preset--color--line); }
.bcn-tour-date { min-width: 4.5rem; text-align: center; }
.bcn-tour-date p { margin: 0; line-height: 1; }

/* Ghost button style */
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--cream);
	border: 1px solid var(--wp--preset--color--cream);
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--wp--preset--color--cream);
	color: var(--wp--preset--color--ink);
}

/* A–Z letter strip */
.bcn-az a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 6px;
	font-weight: 700;
}
.bcn-az a:hover { border-color: var(--wp--preset--color--gold); }
.bcn-az p { margin: 0; display: flex; flex-wrap: wrap; gap: 6px; }

/* Comedian cards */
.bcn-comic-card {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 8px;
	height: 100%;
	box-sizing: border-box;
}
.bcn-comic-card .wp-block-post-featured-image { flex: none; }
.bcn-comic-card .wp-block-post-featured-image img { border-radius: 50%; }

/* Video tiles: play badge over the thumbnail */
.bcn-video .wp-block-post-featured-image { position: relative; }
.bcn-video .wp-block-post-featured-image::after {
	content: "";
	position: absolute;
	inset: 50% auto auto 50%;
	width: 56px;
	height: 56px;
	transform: translate(-50%, -50%);
	border-radius: 50%;
	background: var(--wp--preset--color--gold) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5v14l11-7z' fill='%2312100E'/%3E%3C/svg%3E") center / 22px no-repeat;
	pointer-events: none;
}

/* Header search: compact pill */
.bcn-header .wp-block-search__input {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--cream);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 999px;
	padding-inline: 1rem;
	min-height: 44px;
}
.bcn-header .wp-block-search__button {
	min-height: 44px;
	min-width: 44px;
	border-radius: 999px;
}

/* Pagination */
.wp-block-query-pagination a,
.wp-block-query-pagination .page-numbers { padding: 0.4rem 0.6rem; }
.wp-block-query-pagination .current { color: var(--wp--preset--color--gold); }

/* Comment form fields on dark */
.wp-block-post-comments-form input:not([type=submit]),
.wp-block-post-comments-form textarea {
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--cream);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 6px;
	padding: 0.6rem 0.8rem;
}
