/*
Theme Name: Camp Hayden
Theme URI: https://camphaydenadventures.org
Author: Camp Hayden volunteers
Author URI: https://camphaydenadventures.org
Description: A calm, joyful block theme for Camp Hayden — accessible adventures for families with special needs. Fully editable in the Site Editor, no page builder required.
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
Version: 1.2.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: camp-hayden
*/

/* ---------------------------------------------------------------
   Accent script (Leckerli One) — used via the "Eyebrow" style
   --------------------------------------------------------------- */

.ch-script {
	font-family: var(--wp--preset--font-family--script);
	font-weight: 400;
	color: var(--wp--preset--color--sky);
	letter-spacing: 0.01em;
}

/* Eyebrow label above section headings */
.ch-eyebrow {
	font-family: var(--wp--preset--font-family--script);
	font-size: 1.5rem;
	color: var(--wp--preset--color--sky);
	margin-bottom: 0.25rem;
}

.has-navy-background-color .ch-eyebrow,
.has-sky-to-navy-gradient-background .ch-eyebrow {
	color: var(--wp--preset--color--marigold);
}

/* ---------------------------------------------------------------
   Signature: camp patch — stitched badge for stats & goal chips
   --------------------------------------------------------------- */

.ch-patch {
	background: var(--wp--preset--color--base);
	border-radius: 18px;
	box-shadow: 0 0 0 6px var(--wp--preset--color--base), 0 1px 10px rgba(15, 53, 84, 0.12);
	outline: 2px dashed var(--wp--preset--color--sky);
	outline-offset: -10px;
	padding: 2rem 1.5rem !important;
	text-align: center;
}

.ch-patch .ch-stat-number {
	font-size: var(--wp--preset--font-size--xx-large);
	font-weight: 900;
	line-height: 1;
	color: var(--wp--preset--color--trail);
}

.ch-patch .ch-stat-label {
	font-size: 0.875rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--navy);
	margin-top: 0.5rem;
}

/* Small inline patch chip, e.g. a fundraising goal on a cause card */
.ch-chip {
	display: inline-block;
	background: var(--wp--preset--color--cloud);
	border-radius: 999px;
	outline: 1.5px dashed var(--wp--preset--color--trail);
	outline-offset: -5px;
	padding: 0.4rem 1.1rem;
	font-size: 0.875rem;
	font-weight: 700;
	color: var(--wp--preset--color--navy);
}

/* ---------------------------------------------------------------
   Buttons
   --------------------------------------------------------------- */

/* Marigold donate button */
.ch-donate .wp-block-button__link,
.wp-block-button.is-style-donate .wp-block-button__link {
	background-color: var(--wp--preset--color--marigold);
	color: var(--wp--preset--color--navy);
}

.ch-donate .wp-block-button__link:hover,
.wp-block-button.is-style-donate .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--navy);
	color: var(--wp--preset--color--base);
}

/* Outline button on dark backgrounds */
.wp-block-button.is-style-outline-light .wp-block-button__link {
	background: transparent;
	border: 2px solid var(--wp--preset--color--base);
	color: var(--wp--preset--color--base);
}

.wp-block-button.is-style-outline-light .wp-block-button__link:hover {
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--navy);
}

/* ---------------------------------------------------------------
   Imagery
   --------------------------------------------------------------- */

.wp-block-image img,
.wp-block-gallery .wp-block-image img,
.wp-block-cover {
	border-radius: 16px;
}

.wp-block-cover.ch-hero {
	border-radius: 0;
}

.wp-block-image.is-style-rounded img {
	border-radius: 50%;
}

.wp-block-embed__wrapper iframe {
	border-radius: 16px;
	max-width: 100%;
}

/* ---------------------------------------------------------------
   Cards (cause cards, program cards, team cards)
   --------------------------------------------------------------- */

.ch-card {
	background: var(--wp--preset--color--base);
	border-radius: 16px;
	box-shadow: 0 2px 16px rgba(15, 53, 84, 0.1);
	overflow: hidden;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.ch-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 28px rgba(15, 53, 84, 0.16);
}

.ch-card .wp-block-image img {
	border-radius: 0;
}

/* ---------------------------------------------------------------
   Header / footer details
   --------------------------------------------------------------- */

.ch-topbar {
	font-size: 0.875rem;
}

.ch-topbar a {
	text-decoration: none;
}

.ch-footer a {
	color: var(--wp--preset--color--mist);
}

.ch-footer a:hover {
	color: var(--wp--preset--color--base);
}

.ch-footer .wp-block-heading {
	color: var(--wp--preset--color--base);
	font-size: 1rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* ---------------------------------------------------------------
   Sponsor logo marquee — pure CSS rotation, no carousel plugin.
   The pattern contains the logo set twice; the duplicate makes the
   loop seamless and is hidden from assistive tech via empty alts.
   --------------------------------------------------------------- */

.ch-logo-marquee {
	overflow: hidden;
	max-width: 100%;
}

.ch-logo-track {
	display: flex !important;
	flex-wrap: nowrap !important;
	align-items: center;
	gap: clamp(2.5rem, 6vw, 5rem) !important;
	width: max-content;
	animation: ch-marquee 35s linear infinite;
}

.ch-logo-track:hover {
	animation-play-state: paused;
}

@keyframes ch-marquee {
	to {
		transform: translateX(calc(-50% - clamp(1.25rem, 3vw, 2.5rem)));
	}
}

.ch-logo-set {
	display: flex !important;
	flex-wrap: nowrap !important;
	align-items: center;
	gap: clamp(2.5rem, 6vw, 5rem) !important;
}

.ch-logo-set .wp-block-image {
	margin: 0;
}

.ch-logo-set img {
	height: 56px;
	width: auto;
	max-width: none;
	border-radius: 0;
	filter: grayscale(1) opacity(0.75);
	transition: filter 0.2s ease;
}

.ch-logo-set img:hover {
	filter: none;
}

@media (prefers-reduced-motion: reduce) {
	.ch-logo-track {
		animation: none;
		width: 100%;
		flex-wrap: wrap !important;
		justify-content: center;
	}

	.ch-logo-set {
		flex-wrap: wrap !important;
		justify-content: center;
	}

	.ch-logo-set.is-dupe {
		display: none !important;
	}
}

/* The Events Calendar's list rows overshoot small viewports by ~2px
   (negative-margin grid rounding) — clip the stray overflow. */
.tribe-events {
	overflow-x: clip;
}

/* ---------------------------------------------------------------
   Mobile navigation overlay — centered, comfortable tap targets
   --------------------------------------------------------------- */

.wp-block-navigation__responsive-container.is-menu-open {
	background-color: var(--wp--preset--color--cloud);
	padding-top: 5rem;
}

/* The overlay inherits the desktop menu's right-justification via
   --navigation-layout-justification-setting — recenter every level. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	align-items: center !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__container,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	align-items: center !important;
	justify-content: center !important;
	text-align: center;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	font-size: 1.35rem;
	color: var(--wp--preset--color--navy);
	padding: 0.55rem 0;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	font-size: 1.05rem;
	color: var(--wp--preset--color--trail);
}

/* ---------------------------------------------------------------
   Consent banner (Complianz) — always offer a visible Deny and
   View-preferences option, in brand colors. Lives in the theme so
   Complianz updates can't reset it.
   --------------------------------------------------------------- */

.cmplz-cookiebanner .cmplz-buttons .cmplz-deny,
.cmplz-cookiebanner .cmplz-links .cmplz-link.cmplz-manage-options {
	display: inline-block !important;
}

.cmplz-cookiebanner .cmplz-buttons .cmplz-accept {
	background-color: var(--wp--preset--color--trail) !important;
	border-color: var(--wp--preset--color--trail) !important;
	color: #ffffff !important;
}

.cmplz-cookiebanner .cmplz-buttons .cmplz-deny {
	background-color: var(--wp--preset--color--cloud) !important;
	border: 2px solid var(--wp--preset--color--trail) !important;
	color: var(--wp--preset--color--navy) !important;
}

/* ---------------------------------------------------------------
   Quality floor
   --------------------------------------------------------------- */

:where(a, button, input, textarea, [tabindex]):focus-visible {
	outline: 3px solid var(--wp--preset--color--marigold);
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	.ch-card,
	.ch-card:hover {
		transition: none;
		transform: none;
	}
}