/*
Theme Name: BobNet Companion
Theme URI: https://github.com/bobhollis/Bobnet
Author: Bob Hollis
Author URI: https://github.com/bobhollis
Description: A lightweight, accessible (WCAG 2.2 AA) companion theme for the BobNet Festival Management System. It inherits the festival's branding from BobNet — colors, fonts, and logo — so the public site matches automatically, with a Tickets call-to-action header, an event-aware footer, Event JSON-LD / Open Graph for sharing, and a live block-editor palette. Works with or without the plugin; BobNet does not require a specific theme.
Version: 2.0.1
Requires at least: 6.4
Requires PHP: 7.4
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bobnet-companion
*/

/* ---------------------------------------------------------------------------
 * Design tokens. The accent/fonts/background are overridden inline from the
 * BobNet branding settings (see functions.php bnc_assets) so the theme matches
 * the festival. Contrast ratios target WCAG 2.2 AA (4.5:1 body text, 3:1 large
 * text / UI); target sizes meet 2.5.8.
 * ------------------------------------------------------------------------- */
:root {
	--bnc-accent: #1a4f8b;
	--bnc-accent-dark: #143c69;
	--bnc-accent2: #1a4f8b;
	--bnc-text: #1d2327;
	--bnc-muted: #50575e;
	--bnc-bg: #ffffff;
	--bnc-bg-alt: #f6f7f7;
	--bnc-border: #dcdcde;
	--bnc-maxw: 70rem;
	--bnc-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--bnc-font-heading: var(--bnc-font);
}

/* Headings use the festival's heading font when one is set in BobNet branding. */
h1, h2, h3, h4, h5, h6,
.bnc-site-title, .bnc-entry-title { font-family: var(--bnc-font-heading); }

* { box-sizing: border-box; }

body {
	margin: 0;
	font-family: var(--bnc-font);
	color: var(--bnc-text);
	background: var(--bnc-bg);
	line-height: 1.6;
	font-size: 1.05rem;
}

a { color: var(--bnc-accent); }
a:hover, a:focus { color: var(--bnc-accent-dark); }

/* Visible keyboard focus everywhere (WCAG 2.4.7). */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
	outline: 3px solid var(--bnc-accent);
	outline-offset: 2px;
}

img { max-width: 100%; height: auto; }

.bnc-container { max-width: var(--bnc-maxw); margin: 0 auto; padding: 0 1.25rem; }

/* Skip link — visible on focus (WCAG 2.4.1). */
.bnc-skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	background: var(--bnc-accent);
	color: #fff;
	padding: 0.6rem 1rem;
	z-index: 1000;
}
.bnc-skip-link:focus { left: 0; color: #fff; }

/* Header */
.bnc-site-header {
	border-bottom: 1px solid var(--bnc-border);
	background: var(--bnc-bg);
}
.bnc-header-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
	padding-top: 1rem;
	padding-bottom: 1rem;
}
.bnc-branding { display: flex; align-items: center; gap: 0.75rem; }
.bnc-custom-logo img, .bnc-custom-logo { max-height: 64px; width: auto; }
.bnc-site-title { font-size: 1.4rem; margin: 0; }
.bnc-site-title a { color: var(--bnc-text); text-decoration: none; }
.bnc-site-desc { margin: 0; color: var(--bnc-muted); font-size: 0.95rem; }

/* Primary nav */
.bnc-nav ul { list-style: none; display: flex; gap: 1rem; margin: 0; padding: 0; flex-wrap: wrap; }
.bnc-nav a {
	text-decoration: none;
	color: var(--bnc-text);
	padding: 0.4rem 0.2rem;
	display: inline-block;
	min-height: 44px; /* AA target size */
	line-height: 1.8;
}
.bnc-nav a:hover, .bnc-nav .current-menu-item > a { color: var(--bnc-accent); border-bottom: 2px solid var(--bnc-accent); }

/* Header banner image */
.bnc-banner { background: var(--bnc-bg-alt); }
.bnc-banner img { display: block; width: 100%; height: auto; object-fit: cover; }

/* Content */
.bnc-main { padding: 2rem 0 3rem; }
.bnc-entry { margin: 0 auto 2.5rem; }
.bnc-entry-title { line-height: 1.2; }
.bnc-entry-meta { color: var(--bnc-muted); font-size: 0.9rem; margin-bottom: 1rem; }
.bnc-entry-content h2, .bnc-entry-content h3 { line-height: 1.25; }
.bnc-featured { margin-bottom: 1.25rem; }

.bnc-button, .wp-block-button__link {
	display: inline-block;
	background: var(--bnc-accent);
	color: #fff;
	padding: 0.6rem 1.1rem;
	border-radius: 6px;
	text-decoration: none;
	min-height: 44px;
}
.bnc-button:hover, .bnc-button:focus { background: var(--bnc-accent-dark); color: #fff; }

/* Footer */
.bnc-site-footer {
	background: var(--bnc-bg-alt);
	border-top: 1px solid var(--bnc-border);
	margin-top: 3rem;
	color: var(--bnc-muted);
}
.bnc-footer-cols {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
	gap: 1.5rem;
	padding: 2.5rem 0 1.5rem;
}
.bnc-footer-col h2 { font-size: 1.05rem; color: var(--bnc-text); margin: 0 0 0.5rem; }
.bnc-footer-col p, .bnc-footer-col address { margin: 0 0 0.4rem; font-style: normal; }
.bnc-footer-social a { margin-right: 0.75rem; text-decoration: none; }
.bnc-footer-bottom {
	border-top: 1px solid var(--bnc-border);
	padding: 1rem 0;
	font-size: 0.9rem;
	text-align: center;
}

/* Respect reduced-motion. */
@media (prefers-reduced-motion: reduce) {
	* { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; }
}

/* Screen-reader-only utility. */
.screen-reader-text {
	border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
	height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute;
}

/* ---------------------------------------------------------------------------
 * BobNet Companion v2.0.0 additions: header Tickets CTA, the event footer bar,
 * the full-width page template, and dark-mode support.
 * ------------------------------------------------------------------------- */

/* Let the nav take the middle and push the CTA to the right of the header. */
.bnc-nav { flex: 1 1 auto; }
.bnc-nav ul { justify-content: flex-end; }

/* Header Tickets call-to-action — a pill button in the festival's primary color. */
.bnc-cta {
	display: inline-flex;
	align-items: center;
	background: var(--bnc-accent);
	color: #fff;
	text-decoration: none;
	font-weight: 700;
	padding: 0.65rem 1.25rem;
	border-radius: 999px;
	min-height: 44px; /* AA target size (2.5.8) */
	box-sizing: border-box;
}
.bnc-cta:hover, .bnc-cta:focus { background: var(--bnc-accent-dark); color: #fff; }

/* Event footer bar — festival name + dates + quick links, above the copyright. */
.bnc-festival-bar { border-top: 1px solid var(--bnc-border); background: var(--bnc-bg); }
.bnc-festival-inner {
	display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem;
	align-items: center; justify-content: space-between;
	padding: 1rem 1.25rem;
}
.bnc-festival-name { font-weight: 700; color: var(--bnc-text); }
.bnc-festival-dates { font-weight: 400; color: var(--bnc-muted); }
.bnc-festival-links a { color: var(--bnc-text); text-decoration: none; margin-left: 1rem; min-height: 24px; display: inline-block; }
.bnc-festival-links a:first-child { margin-left: 0; }
.bnc-festival-links a:hover, .bnc-festival-links a:focus { color: var(--bnc-accent); }

/* Full-width page template (Template: Full Width) — let content span the viewport,
 * e.g. for BobNet shortcode/app screens that manage their own padding. */
.bnc-full-width .bnc-main > .bnc-container { max-width: 100%; padding-left: 0; padding-right: 0; }

/* The public site always renders on the festival's branded LIGHT surfaces with dark,
 * high-contrast text (WCAG 2.2 AA), matching the BobNet plugin's own public pages. We do
 * NOT follow the visitor's OS dark mode: a festival's branding sets a light background and
 * the BobNet forms use white cards, so flipping only the text to dark-mode light would put
 * light text on a light surface (a contrast failure). `color-scheme: light` also keeps form
 * controls light so their text stays dark. */
:root { color-scheme: light; }
