/*
Theme Name: Struggle Bus
Theme URI: 
Author: Michael Hughes
Author URI: 
Description: A custom theme built up from the core Twenty Twenty Five theme.
Requires at least: 6.8
Tested up to: 6.8
Requires PHP: 7.2
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: struggle-bus
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news

/*
 * Link styles
 * https://github.com/WordPress/gutenberg/issues/42319
 */

/*
 * Link styles
 * https://github.com/WordPress/gutenberg/issues/42319
 */
a {
	text-decoration-thickness: 1px !important;
	text-underline-offset: .1em;
}

/* Focus styles */
:where(.wp-site-blocks *:focus) {
	outline-width: 2px;
	outline-style: solid;
}

/* Increase the bottom margin on submenus, so that the outline is visible. */
.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation-item:not(:last-child) {
	margin-bottom: 3px;
}

/* Increase the outline offset on the parent menu items, so that the outline does not touch the text. */
.wp-block-navigation .wp-block-navigation-item .wp-block-navigation-item__content {
	outline-offset: 4px;
}

/* Remove outline offset from the submenus, otherwise the outline is visible outside the submenu container. */
.wp-block-navigation .wp-block-navigation-item ul.wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	outline-offset: 0;
}

/*
 * Progressive enhancement to reduce widows and orphans
 * https://github.com/WordPress/gutenberg/issues/55190
 */
h1, h2, h3, h4, h5, h6, blockquote, caption, figcaption, p {
	text-wrap: pretty;
}

/*
 * Change the position of the more block on the front, by making it a block level element.
 * https://github.com/WordPress/gutenberg/issues/65934
*/
.more-link {
	display: block;
}


/* Custom CSS */

html {
	scroll-padding-top: 100px; /* offset anchors for fixed header */
}
@media screen and (min-width: 700px) {
	html {
		scroll-padding-top: 175px;
	}
}

/* fade in header background on scroll */
.custom-header-bg-fade {
	position: absolute;
	width: 100%;
	padding-top: 0vh;
	transition: background-color .33s ease-in-out, padding-top .33s ease-in-out;
}
body:not(.custom-scrolled) .custom-header-bg-fade {
	background-color: transparent !important;
	background-image: none !important;
	padding-top: calc(37vw / 2 - 70px) !important;
	padding-top: clamp(150px, calc(37vw / 2 - 70px), 100vh) !important;
}

/* nav & logo view transition */
.custom-header-bg-fade .wp-container-core-group-is-layout-7add347e {
	view-transition-name: flex-direction-transition;
}
body.custom-scrolled .custom-header-bg-fade > .wp-block-group {
	flex-direction: row;
	justify-content: space-between;
}
@media (max-width: 781px) {
	body:not(.custom-scrolled) .custom-header-bg-fade {
		padding-top: 0 !important;
	}
	.custom-header-bg-fade > .wp-block-group {
		flex-direction: row;
		justify-content: space-between;
	}
}

/* shrink logo on mobile */
@media screen and (max-width: 1000px) {
	.wp-block-site-logo {
	  max-width: 20%;
	}
}

/* shrink logo on scroll */
@media screen and (min-width: 900px) {
	.custom-logo-link img {
		transition: max-width .33s ease-in-out;
	}
	body.custom-scrolled .custom-logo-link img {
		max-width: 6rem;
	}
}

/* shrink footer logo on mobile */
.custom-footer-logo {
  max-width: 20%;
  opacity: .78;
}

/* nav font */
.wp-block-navigation a {
	font-family: var(--wp--preset--font-family--alfa-slab-one);
}

/* hero sizing */
.custom-sb-block-hero-image img,
.custom-hero-video video {
	min-height: 100vw;
	object-fit: contain;
}
@media screen and (min-width: 600px) {
	.custom-sb-block-hero-image img,
	.custom-hero-video video {
		min-height: 500px;
		object-fit: cover;
	}
}

/* main bg parallax */
body {
	animation: main-bg-parallax linear forwards;
	animation-timeline: scroll();
}
@keyframes main-bg-parallax {
	to {
		background-position: 50% -10vh;
	}
}

/* cover section parallax */
.custom-cover-parallax .wp-block-cover__image-background {
	animation: cover-image-parallax linear forwards;
	animation-timeline: view();
}
@keyframes cover-image-parallax {
	to {
		background-position: 60% 70%;
	}
}

.custom-cover-gradient {
	background: linear-gradient(114.4deg, #46608D 0.02%, #7D3268 96.66%);
}
.custom-cover-gradient .wp-block-cover__image-background {
	mix-blend-mode: overlay;
}

/* stretch images beyond bounds of container */
@media screen and (min-width: 1140px) {
	.custom-horizontal-overlap {
		width: 150%;
		max-width: 150%;
		margin-left: -25% !important;
	}

	/* don't stretch if less than 3 contributors */
	.contributor-horizontal-overlap:has(> .wp-block-post-template > :nth-child(3)) {
		width: 150%;
		max-width: 150%;
		margin-left: -25% !important;
	}
}

/* Audio elements */
.wp-block-audio {
	width: 100%;
}

audio,
audio::-webkit-media-controls-enclosure {
    border-radius: 0;
	width: 100%;
}

header .wp-block-navigation ul {
	row-gap: 1em;
}

/* album cover rotation */
.custom-album-cover {
	overflow: clip;
}

.custom-album-bg {
	position: absolute;
	top: -41%;
	left: 50%;
	width: 140%;
	/* don't translate vertical position because it affects the animation trigger point */
	transform: translate(-50%, 0%);
}

.custom-album-logo {
	position: relative;
	z-index: 1;
}

.custom-album-bg img {
	transform: rotate(0);
	animation: album-cover linear forwards;
	animation-timeline: view();
}

@keyframes album-cover {
	to {
		transform: rotate(360deg);
	}
}

/* Song contributors list */
.custom-sb-block-song-contributors p {
	margin: 0;
}
.custom-sb-block-song-contributors span {
	font-size: .875em;
}

/* util classes */
.custom-sb-margin-top-auto {
	margin-block-start: auto !important;
}

.custom-sb-two-column {
	columns: 2;
	column-gap: 2rem;
}

ul.custom-sb-two-column {
	padding-inline-start: 1rem;
}

/* gravity forms overrides */
.gform-theme--foundation .gform_footer,
.gform-theme--foundation .gform_page_footer {
	margin-block-start: 0;
}

.gform-button {
	padding-inline-start: 3em !important;
	padding-inline-end: 3em !important;
}

.gform_fields {
	row-gap: 1rem !important;
}

footer.wp-block-template-part {
	margin-block-start: 0 !important;
}


/* Mosaic layout for a Gallery block with the class "mosaic-gallery" */
.mosaic-gallery.wp-block-gallery.has-nested-images {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-flow: dense;
}
.mosaic-gallery.wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) {
  width: auto;
  margin: 0;
  aspect-ratio: 3 / 2;
}
/* Every 10th photo (1st, 11th, 21st, 31st) becomes a large 2x2 feature tile */
.mosaic-gallery.wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image):nth-child(10n+1) {
  grid-column: span 2;
  grid-row: span 2;
  aspect-ratio: auto;
}
/* Phones: 2 columns, feature tiles go full width */
@media (max-width: 600px) {
  .mosaic-gallery.wp-block-gallery.has-nested-images {
    grid-template-columns: repeat(2, 1fr);
  }
  .mosaic-gallery.wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image):nth-child(10n+1) {
    grid-row: span 1;
    aspect-ratio: 3 / 2;
  }
}

/* Contributor photos: crop from the top so faces aren't cut off */
.type-contributor .wp-block-post-featured-image img {
  object-position: center top;
}