/*
Theme Name: Gate 52 Venue Theme
Theme URI: https://github.com/gate52/g52-venue-theme
Description: Base FSE block theme for Gate 52 venue websites. All templates, blocks, patterns, and design tokens live here. Per-venue branding is configured via the Customizer in child themes.
Version: 0.1.0
Requires at least: 6.4
Requires PHP: 8.1
Author: Gate 52
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: g52-venue-theme
*/

:root {
	/* Default (tall) fixed header — used for scroll-padding and sticky offsets */
	--g52--header-height: 80px;
	--g52--header-height-shrunk: 40px;
	/* Approximate height of the compact mobile filter row when stuck. Used in
	 * scroll-padding so anchor links don't land beneath sticky chrome. */
	--g52--filter-bar-compact-height: 0px;
}

@media (max-width: 767px) {
	:root {
		--g52--header-height: 60px;
		--g52--filter-bar-compact-height: 56px;
	}
}

html {
	scroll-behavior: smooth;
	scroll-padding-top: calc(
		var(--g52--header-height)
		+ var(--g52-ab-offset, 0px)
		+ var(--g52--filter-bar-compact-height)
	);
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

strong,
b {
	font-weight: 600;
}

.is-style-lead {
	font-family: var(--wp--preset--font-family--condensed);
	font-size: clamp(1.25rem, 2vw, 1.5rem);
	font-weight: 300;
	line-height: 1.4;
	letter-spacing: 0;
	text-transform: uppercase;
}

.is-style-condensed {
	font-family: var(--wp--preset--font-family--condensed);
	font-weight: 300;
	letter-spacing: 0;
	text-transform: uppercase;
}

.text-stroke {
	-webkit-text-stroke: 1px currentColor;
	color: transparent;
}

h1 + h2,
h2 + h3,
h3 + h4 {
	margin-top: 0.5em;
}

/* ==========================================================================
   Hover Card — reusable block utility class
   Apply "g52-hover-card" via Additional CSS Class in the block inspector.
   On hover: primary-coloured border appears; any child Material Symbol scales up.
   ========================================================================== */

.g52-hover-card {
	transition: border-color 300ms ease;
}

/* !important needed to override WP's generated has-border-{slug}-color preset classes */
.g52-hover-card:hover {
	border-color: var(--wp--preset--color--primary, #D90429) !important;
}

/* is-inline sets display:inline !important — transform is a no-op on inline elements, so force inline-block */
.g52-hover-card .material-symbols-outlined,
.g52-hover-card .wp-block-g52-material-icon {
	display: inline-block !important;
	transition: transform 300ms ease !important;
}

.g52-hover-card:hover .material-symbols-outlined,
.g52-hover-card:hover .wp-block-g52-material-icon {
	transform: scale(1.1) !important;
}

/* ==========================================================================
   prefers-reduced-motion — site-wide motion reduction
   Disables non-essential animations and transitions for users who request
   reduced motion. Specific blocks may further refine this rule.
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}

	/* Disable horizontal scroll-snap so content jumps without inertia. */
	.g52-filter-bar__chips,
	.g52-section-nav__sticky > .wp-block-group__inner-container,
	.g52-hero-homepage__sidebar-events {
		scroll-snap-type: none !important;
	}

	/* Bottom sheet collapses instantly. */
	.g52-filter-sheet,
	.g52-info-panel {
		transition: none !important;
	}
}
