/*
Theme Name: Praise Director
Theme URI: https://praisedirector.com
Author: Praise Director
Author URI: https://praisedirector.com
Description: The marketing site theme for Praise Director, worship projection for WordPress. A block theme with the Praise Director brand: sanctuary navy, candle gold and hymnal ivory, Fraunces headlines and Inter text, plus landing-page patterns.
Requires at least: 6.6
Requires PHP: 8.1
Version: 0.1.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: praise-director
Tags: full-site-editing, block-patterns, one-column, custom-colors, editor-style
*/

/* Small touches theme.json can't express. */

.pd-eyebrow {
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* Links and navigation on navy bands. */
.pd-on-navy a:where(:not(.wp-element-button)) {
	color: var(--wp--preset--color--on-sanctuary);
}
.pd-on-navy a:where(:not(.wp-element-button)):hover {
	color: var(--wp--preset--color--candle-light);
}
.pd-on-navy .wp-block-site-title a {
	color: var(--wp--preset--color--on-sanctuary);
}
.pd-logo-mark img {
	border-radius: 10px;
	outline: 1px solid #3a4d80;
}

/* Cards: borders, not shadows. */
.is-style-pd-card {
	border: 1px solid var(--wp--preset--color--hairline);
	border-radius: 12px;
}

/* Step number badge. */
.pd-step-number {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	margin: 0;
}

/* FAQ rows. */
.pd-faq details {
	border-bottom: 1px solid var(--wp--preset--color--hairline);
	padding: 20px 0;
}
.pd-faq details:first-child {
	border-top: 1px solid var(--wp--preset--color--hairline);
}
.pd-faq summary {
	cursor: pointer;
	font-weight: 600;
	font-size: 1.125rem;
	line-height: 1.45;
}
.pd-faq details p {
	margin: 8px 0 0;
	color: var(--wp--preset--color--ink-muted);
}

/* Operator-view mockup used in the hero (replace with a screenshot when ready). */
.pd-operator {
	background: #12182a;
	border: 1px solid #2c3654;
	border-radius: 20px;
	padding: 20px;
	color: #faf6ee;
	font-family: var(--wp--preset--font-family--sans);
}
.pd-operator__bar {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 16px;
	font-size: 13px;
	color: #a9b0c2;
}
.pd-operator__live {
	color: #6bc48c;
	font-weight: 600;
	font-size: 12px;
}
.pd-operator__live::before {
	content: "";
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 4px;
	background: currentColor;
	margin-right: 6px;
}
.pd-operator__screens {
	display: grid;
	grid-template-columns: 3fr 2fr;
	gap: 12px;
}
.pd-operator__label {
	margin: 0 0 6px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.06em;
	color: #a9b0c2;
}
.pd-operator__screen {
	aspect-ratio: 16 / 9;
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 12px;
	box-sizing: border-box;
	font-family: var(--wp--preset--font-family--display);
}
.pd-operator__screen--live {
	background: #000;
	outline: 2px solid #6bc48c;
	font-size: 18px;
	line-height: 1.4;
}
.pd-operator__screen--next {
	background: #1b2338;
	color: #d6dbe8;
	font-size: 12px;
	line-height: 1.4;
}
.pd-operator__buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 16px;
}
.pd-operator__buttons span {
	flex: 1 1 auto;
	text-align: center;
	background: #1b2338;
	color: #d6dbe8;
	border-radius: 10px;
	padding: 10px 12px;
	font-size: 13px;
}
.pd-operator__buttons .is-current {
	background: #3a4d80;
	color: #faf6ee;
	font-weight: 600;
}
.pd-operator__buttons .is-blackout {
	background: #5c1f1b;
	color: #f9d3cf;
	font-weight: 600;
}

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