/*
Theme Name: The Yoga Collective
Theme URI: https://weaver.coop
Author: The Yoga Collective
Author URI: https://theyogacollective.ca
Description: Base theme for The Yoga Collective
Requires at least: 6.7
Tested up to: 6.9
Requires PHP: 7.2
Version: 1.4
Text Domain: yogacollective
*/

@media (max-width: 768px) {
  :root {
    --wp--preset--border-radius--small:   30px;
    --wp--preset--border-radius--medium:  30px;
    --wp--preset--border-radius--large:   30px;
    --wp--preset--border-radius--x-large: 30px;
  }
}

:root {
	--sm-width: 480px;
	--md-width: 768px;
	--lg-width: 980px;
	--xl-width: 1200px;
	--2xl-width: 1600px;
	--3xl-width: 1920px;
}

:root :where(.is-layout-flow) > .wp-block-cover {
	margin: 0;
}

html {
	scroll-behavior: smooth;
}

body {
	scroll-margin-top: 100px;
}

.xl-font-2xl {
	@media screen and (min-width: 1024px) {
		font-size: 2rem !important;
	}
}

.yogacollective-main-block-group {
	margin-top: 80px;

	@media screen and (min-width: 768px) {
		margin-top: 200px;
	}

	@media screen and (min-width: 1024px) {
		margin-top: 150px;
	}

	.with-hero & {
		margin-top: 0;
	}
}

.yogacollective-main-block-group:has(.entry-content > .yogacollective-hero-background-image) {
	margin-top: 0;
}

.hide-sm {

	@media screen and (min-width: 480px) {
		display: none !important;
		visibility: hidden !important;
	}
}

.hide-md {

	@media screen and (min-width: 768px) {
		display: none !important;
		visibility: hidden !important;
	}
}

.show-lg {
	display: none !important;
	visibility: hidden !important;

	@media screen and (min-width: 980px) {
		display: block !important;
		visibility: visible !important;
	}
}

.show-2xl {
	display: none !important;
	visibility: hidden !important;

	@media screen and (min-width: 1600px) {
		display: block !important;
		visibility: visible !important;
	}
}

/* Accordions */
.wp-block-accordion-item {
	border-bottom: 1px solid var(--wp--preset--color--contrast);
}

.wp-block-accordion-item.is-open {
	padding-bottom: 2rem;
}

/* Blocks */
.flush-top {
	margin-top: -30px !important;

	@media screen and (min-width: 768px) {
		margin-top: -200px !important;
	}

	@media screen and (min-width: 1024px) {
		margin-top: -90px !important;
	}
}

/* Buttons */
/* see theme.json */

/* Columns */
@media (max-width: 767px) {
  .wp-block-columns.ycl-reverse-mobile {
    flex-direction: column-reverse;
  }
}

/* Cover block */
.wp-block-cover__background {
	margin-block-start: 0 !important;
}

.text-shadow {
	text-shadow:	1px 2px 15px black;
}

/* Footer */
.site-footer {
	margin-top: 0 !important;

	.wp-block-navigation.is-vertical {
		width: 100%;
		align-items: center !important;

		@media screen and (min-width: 768px) {
			align-items: flex-start !important;
		}

		li {
			font-size: 25px !important;
			text-align: left;
		}
	}

	@media screen and (max-width: 1023px) {
		.wp-block-columns {
			gap: 2rem !important;
		}
		
		.footer-inner * {
			text-align: center !important;
		}
		
		.wp-block-navigation__container.items-justified-right {
			justify-content: center !important;
		}
	}
}

/* Forms */

.ff-el-group {
	margin-bottom: 4rem;
}

.frm-fluent-form input,
.frm-fluent-form input::placeholder,
.frm-fluent-form textarea,
.frm-fluent-form textarea::placeholder  {
	color: var(--wp--preset--color--contrast) !important;
}

.ff-btn-submit:not(.ff_btn_no_style) {
	font-weight: 700;
	font-size: 20px;
	font-family: var(--wp--preset--font-family--serif) !important;
	color: var(--wp--preset--color--base) !important;
	border-radius: var(--wp--preset--border-radius--small) !important;
	background-color: var(--wp--preset--color--accent-1) !important;
}

.ff-message-success {
	padding: 0;
	border: 0 none !important;
	box-shadow: none;
}

/* Galleries */
.wp-block-gallery {
	@media screen and (max-width: 767px) {
		flex-direction: flex-column;

		figure {
			flex: 0 0 100%;
		}
	}
}

/* Header */
.site-header {
	position: fixed;
	top: 0;
	z-index: 500;
	width: 100vw;
	padding: 0.5rem 0;
	background: color-mix(in srgb, var(--wp--preset--color--contrast) 70%, transparent);
	color: var(--wp--preset--color--base) !important;
	transition: all 1000ms;

	@media screen and (min-width: 1024px) {
		padding: 0;
		background: color-mix(in srgb, var(--wp--preset--color--contrast) 20%, transparent);
	}

	&.show,
	&.with-hero-scrolled {
		background: var(--wp--preset--color--contrast) !important;
		color: var(--wp--preset--color--base) !important;
	}

	a {
		text-decoration: none;

		&:hover,
		&:focus,
		&:active {
			text-decoration: underline;
		}
	}

	.wp-block-navigation__container {
		gap: 3rem;
	}

	/* make our own responsive columns */
  .site-header-columns > .wp-block-column:nth-child(1) {
    flex-basis: 75% !important;
  }
  .site-header-columns > .wp-block-column:nth-child(2) {
    flex-basis: 25% !important;
  }

	@media (min-width: 1024px) {
		.site-header-columns > .wp-block-column:nth-child(1) {
		  flex-basis: 40% !important;
		}
		.site-header-columns > .wp-block-column:nth-child(2) {
		  flex-basis: 50% !important;
		}
		.site-header-columns > .wp-block-column:nth-child(3) {
		  flex-basis: 10% !important;
		}
	}

	@media (min-width: 1200px) {
		.site-header-columns > .wp-block-column:nth-child(1) {
		  flex-basis: 30% !important;
		}
		.site-header-columns > .wp-block-column:nth-child(2) {
		  flex-basis: 55% !important;
		}
		.site-header-columns > .wp-block-column:nth-child(3) {
		  flex-basis: 15% !important;
		}
	}
}

.header-logo {
	margin-top: 0.25rem;

	@media screen and (max-width: 400px) {
		font-size: 14px !important;
	}

	a {
		text-decoration: none !important;
	}
}

/* Display mobile menu icon for screens smaller than 1024px */
@media (max-width: 1024px) {
  .wp-block-navigation__responsive-container-open:not(.always-shown) {
      display: flex !important;
  }
  .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
      display: none !important;
  }
}

/* Ensure the desktop menu displays for screens 1200px and above */
@media (min-width: 1200px) {
  .wp-block-navigation__responsive-container-open:not(.always-shown) {
      display: none !important;
  }
  .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
      display: block !important;
      width: 100%;
      position: relative;
      z-index: auto;
      background-color: inherit;
  }
}

/* Lists */
.wp-block-list li {
	margin-bottom: 1rem;
}

/* Pagination */
.wp-block-query-pagination-numbers {

	span,
	a {
		padding-right: 1rem;
	}
}

/* Social Snap */
.ss-inline-share-wrapper {
	margin: 0;
	padding: 3rem 0;
	background-color: var(--wp--preset--color--accent-3);
}


/* Tables  */
.wp-block-tableberg tbody,
.wp-block-tableberg th {
	border: 0 none !important;
}

/* Tay Wingman */
.has-tay-wingman-font-family {
	letter-spacing: 0.05em !important;
}