/*
Theme Name: Brettro Base Block Theme
Theme URI: https://example.com/theme-brettro-base
Author: Brettrospective
Author URI: https://brettrospective.com
Description: A lightweight WordPress block theme with color controls, background customization, logo support, and Adobe Fonts integration.
Requires at least: 6.5
Tested up to: 6.7
Requires PHP: 8.0
Version: 1.0.5
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: theme-brettro-base
Tags: block-theme, full-site-editing, custom-colors, custom-background, custom-logo
*/

/* Frontend typography defaults are injected via functions.php so Adobe Fonts can override them. */

/* WordPress-specific compatibility tweaks layered on top of BDS core CSS. */

/* Keep fixed BDS breakpoint widths within the available layout viewport. */
.bds-grid-container {
	max-width: 100%;
}

/*
 * Preserve the established type scale at 390px and above while allowing
 * larger BDS presets to taper on narrower screens. The higher-specificity
 * root selector keeps these values authoritative over WordPress global styles.
 */
@media screen and (max-width: 389px) {
	html:root {
		--bds-typography-font-size-3: clamp(20px, 6.154vw, 24px);
		--bds-typography-font-size-4: clamp(24px, 8.205vw, 32px);
		--bds-typography-font-size-5: clamp(24px, 8.205vw, 32px);
		--bds-typography-font-size-6: clamp(32px, 10.256vw, 40px);
		--bds-typography-font-size-7: clamp(40px, 12.308vw, 48px);
		--bds-typography-font-size-8: clamp(48px, 14.359vw, 56px);
		--bds-typography-font-size-9: clamp(48px, 16.41vw, 64px);
		--bds-typography-font-size-10: clamp(56px, 18.462vw, 72px);
		--bds-typography-font-size-11: clamp(64px, 20.513vw, 80px);
		--bds-typography-font-size-12: clamp(72px, 22.564vw, 88px);
		--bds-typography-font-size-13: clamp(72px, 24.615vw, 96px);
		--bds-typography-font-size-14: clamp(80px, 26.667vw, 104px);
		--bds-typography-font-size-15: clamp(88px, 28.718vw, 112px);
		--bds-typography-font-size-20: clamp(96px, 30.769vw, 120px);
		--bds-typography-font-size-30: clamp(128px, 41.026vw, 160px);

		--wp--preset--font-size--bds-font-3: var(--bds-typography-font-size-3);
		--wp--preset--font-size--bds-font-4: var(--bds-typography-font-size-4);
		--wp--preset--font-size--bds-font-5: var(--bds-typography-font-size-5);
		--wp--preset--font-size--bds-font-6: var(--bds-typography-font-size-6);
		--wp--preset--font-size--bds-font-7: var(--bds-typography-font-size-7);
		--wp--preset--font-size--bds-font-8: var(--bds-typography-font-size-8);
		--wp--preset--font-size--bds-font-9: var(--bds-typography-font-size-9);
		--wp--preset--font-size--bds-font-10: var(--bds-typography-font-size-10);
		--wp--preset--font-size--bds-font-11: var(--bds-typography-font-size-11);
		--wp--preset--font-size--bds-font-12: var(--bds-typography-font-size-12);
		--wp--preset--font-size--bds-font-13: var(--bds-typography-font-size-13);
		--wp--preset--font-size--bds-font-14: var(--bds-typography-font-size-14);
		--wp--preset--font-size--bds-font-15: var(--bds-typography-font-size-15);
		--wp--preset--font-size--bds-font-20: var(--bds-typography-font-size-20);
		--wp--preset--font-size--bds-font-30: var(--bds-typography-font-size-30);
	}
}

#bds-container-nav-primary {
	background: var(--brettro-nav-primary-surface-background, var(--bds-color-base-neutral-0));
	border: var(--brettro-nav-primary-surface-border, 1px solid var(--bds-color-base-neutral-300));
	border-bottom: var(--brettro-nav-primary-surface-border-bottom, none);
	border-radius: var(--brettro-nav-primary-surface-border-radius, var(--bds-spacing-2) var(--bds-spacing-2) 0 0);
	box-shadow: var(--brettro-nav-primary-surface-box-shadow, 0 1px 3px 0 rgba(2, 6, 23, 0.1), 0 1px 2px -1px rgba(2, 6, 23, 0.1));
}

.bds-grid-container #bds-container-content {
	background: var(--brettro-content-surface-background, var(--bds-color-base-neutral-0));
	border: var(--brettro-content-surface-border, 1px solid var(--bds-color-base-neutral-300));
	border-top: var(--brettro-content-surface-border-top, none);
	border-radius: var(--brettro-content-surface-border-radius, 0 0 var(--bds-spacing-2) var(--bds-spacing-2));
	box-shadow: var(--brettro-content-surface-box-shadow, 0 1px 3px 0 rgba(2, 6, 23, 0.1), 0 1px 2px -1px rgba(2, 6, 23, 0.1));
}

#bds-nav-primary {
	display: block;
}

#bds-nav-primary .wp-block-navigation {
	justify-content: center;
}

#bds-nav-primary .wp-block-navigation__container {
	gap: 18px;
}

#bds-nav-primary .wp-block-navigation__responsive-container-open,
#bds-nav-primary .wp-block-navigation__responsive-container-close {
	font-family: var(--brettro-heading-font-family, inherit);
}

/* Balance the mobile menu control within its navigation surface. */
@media screen and (max-width: 599px) {
	#bds-container-nav-primary {
		padding-block: var(--bds-spacing-2);
	}
}

/* Let a static front-page hero meet the desktop navigation divider. */
@media screen and (min-width: 1024px) {
	body.home.page #bds-nav-primary {
		margin-bottom: 0;
	}
}

/* Header branding: keep logo/title centered. */
#bds-container-masthead .bds-grid-col-12 {
	display: flex;
	flex-direction: column;
	align-items: center;
}

#bds-container-masthead .bds-header-zones {
	width: 100%;
	align-items: center;
	margin-block-start: 0;
	margin-block-end: 0;
}

#bds-container-masthead .bds-header-zone {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

#bds-container-masthead .bds-header-zone-left {
	align-items: flex-start;
	text-align: left;
}

#bds-container-masthead .bds-header-zone-center {
	align-items: center;
	text-align: center;
}

#bds-container-masthead .bds-header-zone-right {
	align-items: flex-end;
	text-align: right;
}

#bds-container-masthead .wp-block-site-logo,
#bds-container-masthead .wp-block-site-title {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

#bds-container-masthead .wp-block-site-logo img {
	display: block;
	width: 100% !important;
	max-width: 100%;
	max-height: none !important;
	height: auto !important;
	margin: 0 auto;
}

/* When a custom logo is set, hide the site title. */
body.wp-custom-logo #bds-container-masthead .wp-block-site-title {
	display: none;
}

@media (max-width: 781px) {
	#bds-container-masthead .bds-header-zone-left,
	#bds-container-masthead .bds-header-zone-center,
	#bds-container-masthead .bds-header-zone-right {
		align-items: center;
		text-align: center;
	}
}

/* Remove default root-block gap between header and main for BDS page structure. */
.wp-site-blocks > #bds-page-header + #bds-page-content {
	margin-block-start: 0;
}

/* Force override of WP root block spacing rule regardless of stylesheet order. */
.wp-site-blocks > #bds-page-content {
	margin-block-start: 0 !important;
}

/*
 * WooCommerce wraps block templates before rendering. Reset the root block gap
 * on that direct wrapper so the standard BDS header/content join is preserved.
 */
body.woocommerce .wp-site-blocks > .wp-block-group.woocommerce {
	margin-block-start: 0 !important;
}

/* BDS Hero block-family layout for saved markup and editor previews. */
.bds-hero-container {
	--bds-hero-min-height: auto;

	position: relative;
	overflow: hidden;
	border-radius: 0;
	min-height: var(--bds-hero-min-height);
}

.bds-hero-background-video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
	z-index: 0;
	pointer-events: none;
}

.bds-hero-layout-text-only {
	align-content: center;
}

.bds-hero-layout-text-only.bds-hero-hide-header.bds-hero-hide-footer .bds-hero-content > .wp-block-columns {
	min-height: var(--bds-hero-min-height);
}

.bds-hero-hide-header .bds-hero-header,
.bds-hero-hide-footer .bds-hero-footer,
.bds-hero-layout-text-only .bds-hero-img {
	display: none;
}

.bds-hero-header,
.bds-hero-main,
.bds-hero-footer {
	grid-column: 1 / span 12;
	position: relative;
	z-index: 1;
}

.bds-hero-header {
	min-height: 0;
}

.bds-hero-header > * {
	margin-block-start: 0;
	margin-block-end: 0;
}

.bds-hero-min-height-small {
	--bds-hero-min-height: 280px;
}

.bds-hero-min-height-medium {
	--bds-hero-min-height: 360px;
}

.bds-hero-min-height-large {
	--bds-hero-min-height: 440px;
}

.bds-hero-min-height-viewport {
	--bds-hero-min-height: 70vh;
}

.bds-hero-layout-full .bds-hero-img,
.bds-hero-layout-full .bds-hero-content,
.bds-hero-layout-text-only .bds-hero-content,
.bds-hero-layout-half-left .bds-hero-img,
.bds-hero-layout-half-left .bds-hero-content,
.bds-hero-layout-half-right .bds-hero-img,
.bds-hero-layout-half-right .bds-hero-content {
	grid-column: span 12;
}

.bds-hero-layout-half-left .bds-hero-img,
.bds-hero-layout-half-right .bds-hero-img,
.bds-hero-layout-full .bds-hero-img {
	order: 1;
}

.bds-hero-layout-half-left .bds-hero-content,
.bds-hero-layout-half-right .bds-hero-content,
.bds-hero-layout-full .bds-hero-content {
	order: 2;
}

.bds-hero-img .components-placeholder {
	box-sizing: border-box;
	width: 100%;
	max-width: none;
}

.bds-hero-img .wp-block-image {
	margin: 0;
}

@media (prefers-reduced-motion: reduce) {
	.bds-hero-background-video {
		display: none;
	}
}

@media screen and (min-width: 768px) {
	.bds-hero-layout-half-left .bds-hero-img,
	.bds-hero-layout-half-left .bds-hero-content,
	.bds-hero-layout-half-right .bds-hero-img,
	.bds-hero-layout-half-right .bds-hero-content {
		grid-column: span 6;
	}

	.bds-hero-layout-half-right .bds-hero-content {
		order: 1;
	}

	.bds-hero-layout-half-right .bds-hero-img {
		order: 2;
	}

	.bds-hero-layout-half-left .bds-hero-content,
	.bds-hero-layout-half-right .bds-hero-content {
		align-self: center;
	}
}

@media screen and (min-width: 1024px) {
	.bds-hero-min-height-small {
		--bds-hero-min-height: 360px;
	}

	.bds-hero-min-height-medium {
		--bds-hero-min-height: 520px;
	}

	.bds-hero-min-height-large {
		--bds-hero-min-height: 680px;
	}

	.bds-hero-min-height-viewport {
		--bds-hero-min-height: 85vh;
	}
}

/*
 * Native BDS card patterns retain BDS region classes for default layout while
 * leaving appearance controls to WordPress blocks.
 */
.bds-card-grid > .bds-card,
.bds-cards > .bds-card,
.bds-card > .bds-card-container {
	height: 100%;
}

.wp-block-theme-brettro-base-bds-cards.bds-cards.is-style-bds-cards-per-row-1 {
	grid-template-columns: minmax(0, 1fr);
}

.wp-block-theme-brettro-base-bds-cards.bds-cards.is-style-bds-cards-per-row-2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.wp-block-theme-brettro-base-bds-cards.bds-cards.is-style-bds-cards-per-row-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.wp-block-theme-brettro-base-bds-cards.bds-cards.is-style-bds-cards-per-row-4 {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.editor-styles-wrapper .wp-block-theme-brettro-base-bds-cards.bds-cards > .block-list-appender {
	grid-column: 1 / -1;
}

.bds-card-grid .bds-card,
.bds-cards .bds-card {
	overflow: hidden;
}

.bds-card-grid .bds-card {
	border: 1px solid var(--bds-color-base-neutral-300);
	border-radius: var(--bds-spacing-1);
}

.bds-card-grid .bds-card-container,
.bds-cards .bds-card-container {
	align-items: stretch;
	flex-wrap: nowrap;
	gap: 0;
	width: 100%;
}

.bds-card-grid .bds-card-img,
.bds-cards .bds-card-img {
	margin: 0;
	width: 100%;
}

.bds-card-grid .bds-card-img,
.bds-card-grid .bds-card-img img {
	border-radius: var(--bds-spacing-1) var(--bds-spacing-1) 0 0;
}

.bds-card-grid .bds-card-img img {
	box-shadow: none;
	width: 100%;
}

.bds-card-grid .bds-card-content,
.bds-cards .bds-card-content {
	display: flex;
	flex: 1;
	flex-direction: column;
	width: 100%;
}

.bds-card-grid .bds-card-content {
	align-self: stretch;
	padding: var(--bds-spacing-2);
}

.bds-card-grid .bds-card-content-header .bds-text-detail {
	margin-top: 0;
}

.bds-card-grid .bds-card-content-footer,
.bds-cards .bds-card-content-footer {
	margin-block-start: auto;
}

.bds-card-grid .bds-card .bds-card-container .bds-card-content .bds-card-content-header h3 a,
.bds-cards .bds-card .bds-card-container .bds-card-content .bds-card-content-header h3 a {
	color: inherit;
}

.bds-card-grid .bds-card-action,
.bds-cards .bds-card-action {
	padding: var(--bds-spacing-1);
	text-align: center;
}

.bds-card-grid .bds-card-read-more,
.bds-cards .bds-card-read-more {
	display: block;
	text-decoration: none;
}

/* Query Loop bridge: force predictable card grid and per-item card shell. */
.bds-query-cards {
	width: 100%;
}

.bds-query-cards .bds-cards-query-template {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--bds-spacing-2);
	list-style: none;
	padding: 0;
	margin: 0;
}

/* Keep Query Loop columns native by mapping core columns-* classes when present. */
.bds-query-cards .bds-cards-query-template.columns-1 {
	grid-template-columns: 1fr;
}

.bds-query-cards .bds-cards-query-template.columns-2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.bds-query-cards .bds-cards-query-template.columns-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.bds-query-cards .bds-cards-query-template.columns-4 {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.bds-query-cards .bds-cards-query-template.columns-5 {
	grid-template-columns: repeat(5, minmax(0, 1fr));
}

.bds-query-cards .bds-cards-query-template.columns-6 {
	grid-template-columns: repeat(6, minmax(0, 1fr));
}

.bds-query-cards .bds-cards-query-template > .wp-block-post {
	border: 0 !important;
	margin: 0;
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
	min-width: 0;
}

.bds-query-cards .bds-cards-query-template > .wp-block-post > .bds-card {
	height: 100%;
}

.bds-query-cards .bds-card .bds-card-container > .bds-card-content {
	margin-block-start: 0 !important;
}

.bds-query-cards .bds-card-content-header > .wp-block-post-date,
.bds-query-cards .bds-card-content-header > .wp-block-post-terms,
.bds-query-collection .bds-collection-item-content-header > .wp-block-post-date,
.bds-query-collection .bds-collection-item-content-header > .wp-block-post-terms {
	display: inline;
	margin: 0;
}

.bds-query-cards .bds-card .bds-card-container > .bds-card-img:empty {
	display: none;
}

@media screen and (max-width: 768px) {
	.wp-block-theme-brettro-base-bds-cards.bds-cards.is-style-bds-cards-per-row-1,
	.wp-block-theme-brettro-base-bds-cards.bds-cards.is-style-bds-cards-per-row-2,
	.wp-block-theme-brettro-base-bds-cards.bds-cards.is-style-bds-cards-per-row-3,
	.wp-block-theme-brettro-base-bds-cards.bds-cards.is-style-bds-cards-per-row-4 {
		grid-template-columns: minmax(0, 1fr);
	}

	.bds-query-cards .bds-cards-query-template {
		grid-template-columns: 1fr;
	}
}

/* Keep Query "No Results" fallback for frontend, but hide it in editor canvas. */
.editor-styles-wrapper .bds-query-cards > .wp-block-query-no-results {
	display: none;
}

/* Query Loop bridge: collection list wrappers from post-template markup. */
.bds-query-collection {
	width: 100%;
}

.bds-query-collection .bds-collection-query-template {
	list-style: none;
	padding: 0;
	margin: 0;
}

.bds-query-collection .bds-collection-query-template > .wp-block-post {
	list-style: none;
	margin: 0 !important;
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
}

.bds-query-collection .bds-collection-query-template > .wp-block-post > .bds-collection-item {
	margin-block-start: 0 !important;
}

.bds-query-collection .bds-collection-query-template > .wp-block-post > .bds-collection-item > .bds-collection-item-content {
	margin-block-start: 0 !important;
}

/* Keep Query "No Results" fallback for frontend, but hide it in editor canvas. */
.editor-styles-wrapper .bds-query-collection > .wp-block-query-no-results {
	display: none;
}

/* Footer layout and social links. */
.bds-site-footer-zones {
	padding-top: var(--bds-spacing-2);
	padding-bottom: var(--bds-spacing-2);
	align-items: flex-start;
}

/* Let WP Social Icons control their own icon/link color in footer social nav. */
#bds-container-nav-social nav ul li a,
#bds-container-nav-social nav ul li a:visited {
	color: inherit;
}

/* Let the core Social Links block control icon sizing and typography. */
#bds-container-nav-social .wp-block-social-links,
#bds-container-nav-social .wp-block-social-links .wp-social-link {
	font-family: inherit;
	font-style: inherit;
	font-weight: inherit;
	line-height: inherit;
}

#bds-container-nav-social .wp-block-social-links .wp-social-link {
	font-size: inherit;
}

#bds-container-nav-social .wp-block-social-links.has-small-icon-size {
	font-size: 16px;
}

#bds-container-nav-social .wp-block-social-links,
#bds-container-nav-social .wp-block-social-links.has-normal-icon-size {
	font-size: 24px;
}

#bds-container-nav-social .wp-block-social-links.has-large-icon-size {
	font-size: 36px;
}

#bds-container-nav-social .wp-block-social-links.has-huge-icon-size {
	font-size: 48px;
}

/* Utility nav: keep WP spacing, add pipe separators between items. */
#bds-container-nav-utility nav ul li::before {
	content: none;
}

#bds-container-nav-utility .wp-block-navigation__container {
	gap: 0;
}

#bds-container-nav-utility nav ul li a {
	padding: 0;
}

#bds-container-nav-utility .wp-block-navigation-item:not(:last-child) .wp-block-navigation-item__content::after {
	content: "|";
	display: inline-block;
	margin-inline: var(--bds-spacing-1);
}

.bds-footer-social-list.is-labels-hidden .bds-social-label,
.bds-footer-social-links.is-labels-hidden .bds-social-label,
.bds-footer-social-nav.is-labels-hidden .bds-social-label {
	display: none;
}

.bds-site-footer-zone-primary .bds-footer-col-text,
.bds-site-footer-zone-secondary .bds-footer-col-text,
.bds-site-footer-zone-tertiary .bds-footer-col-text {
	margin: 0;
}

.bds-site-footer-zone-tertiary {
	text-align: right;
}

@media screen and (max-width: 768px) {
	.bds-site-footer-zone-tertiary {
		text-align: left;
	}
}
