/*!
Theme Name: BAKS
Theme URI: https://gnistdesign.no
Author: Gnist Design
Author URI: https://gnistdesign.no
Description: A boilerplate FSE theme for 2024.
Tags: full-site-editing, block-patterns, accessibility-ready, block-styles, custom-colors, custom-logo, custom-menu, editor-style one-column, template-editing, translation-ready, wide-blocks
Requires at least: 6.7
Tested up to: 6.7
Requires PHP: 8.2
Version: 1.0
License: GNU General Public License v3 or later
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: baks

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

:root {
  --mobile-value: -100px;
  --desktop-value: -245px;
  --mobile-breakpoint: 600px;
  --desktop-breakpoint: 1300px;
  --range: calc(var(--desktop-breakpoint) - var(--mobile-breakpoint));
  --scaling-factor: calc((100vw - var(--mobile-breakpoint)) / var(--range));
  --value-difference: calc(var(--desktop-value) - var(--mobile-value));

  --wp--preset--spacing--140: clamp(
    var(--desktop-value),
    calc(var(--mobile-value) + (var(--value-difference) * var(--scaling-factor))),
    var(--mobile-value)
  );
}

/* Global Normalizer */
@-ms-viewport {
	width: device-width;
}

@viewport {
	width: device-width;
}

html {
	box-sizing: border-box;
	-ms-overflow-style: scrollbar;
	scroll-behavior: smooth;
}

*,
*::before,
*::after {
	box-sizing: inherit;
	min-width: 0;
	font-synthesis: none !important;
}

.has-custom-7-font-size {
	line-height: 1.55;
}

.dynamic-header {
	margin: 0 auto;
	width: 100%;
	max-width: var( --wp--style--global--wide-size );
}

body:not( .single ) .wp-site-blocks {
	position: relative;

	@media screen and ( max-width: 850px ) {
		main {
			margin-top: 0 !important;
			> div > div:not(.column-reverse):first-child {
				padding-top: 100px !important;
			}
		}
	}

	/* Hack to avoid jumpy animation inbetween mobile & desktop */
	@media screen and ( min-width: 840px ) and ( max-width: 860px ) {
		* {
			transition: all 0ms linear !important;
		}
	}

	/* Dymamic header */
	header.wp-block-template-part:has( .dynamic-header ) {
		.dynamic-header {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			z-index: 9999;

			padding-top: 27px !important;
			padding-bottom: 27px !important;

			@media screen and ( min-width: 851px ) {
				position: fixed;
				top: 0;
				left: 50%;
				transform: translateX(-50%);
				width: 100%;
				max-width: var( --wp--style--global--wide-size );
			}
		}
	}
}

/* Footer adjustments */
.site-footer {
	margin-block-start: 0;

	@media screen and ( max-width: 781px ) {
		> div {
			padding: 40px 0;
		}

		div div > div {
			flex-direction: column-reverse;

			div {
				padding-top: 40px !important;

				div {
					flex-direction: row;
					padding-top: 0 !important;

					img {
						padding-top: 10px;
					}
				}
			}
		}
	}
}


.blog .wp-block-query .wp-block-columns {
	.wp-block-post-excerpt__excerpt {
		margin: 0 !important;
	}
	@media screen  and ( max-width: 781px ) {
		flex-direction: column-reverse;

		.wp-block-column {
			/* aspect-ratio: 4 / 3; */
			width: 100%;
		}
	}
}

/* FSE Fix for images. */
figure img {
	width: 100%;
	object-fit: contain;
}

/* Adjust the navigation block breakpoint */
@media screen and (max-width: 850px) {
	html:not( .has-modal-open ) {
		.wp-block-navigation {
			flex: 1 0 auto;
			justify-content: end;
			align-self: center;
		}
	}

	.wp-block-navigation__responsive-container-open {
		/* Important to overwrite FSE. */
		display: flex !important;
	}

	.wp-block-navigation + .wp-block-buttons {
		display: none;
	}

	.wp-block-navigation__responsive-container:not( .is-menu-open ) {
		/* Important to overwrite FSE. */
		display: none !important;
	}

	header.wp-block-template-part .wp-block-group .wp-block-group .wp-block-group.is-layout-flex {
		width: 100%;
		justify-content: space-between;
	}

	.wp-block-columns {
    display: flex;
    flex-direction: column;
  }

  .wp-block-column {
    width: 100%;
  }

	.column-reverse {
		flex-direction: column-reverse;
	}

	.wp-block-template-part > .wp-block-group:first-child {
		padding-top: 27px !important;
		padding-bottom: 27px !important;
	}
}