/*
Theme Name: JS WP Block Template
Author: totoluto
Author URI: https://github.com/JS-Wordpress
Description: A block theme dedicated for Jungschar groups in switzerland.
Requires at least: 6.7
Tested up to: 6.8
Requires PHP: 
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: jstemplate
Tags: full-site-editing, custom-colors, custom-logo, custom-menu, custom-header, custom-background, two-columns, three-columns, wide-blocks, featured-images, theme-options
*/

a {
	text-decoration-thickness: 1px !important;
	text-underline-offset: .1em;
}

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

.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation-item:not(:last-child) {
	margin-bottom: 3px;
}

.wp-block-navigation .wp-block-navigation-item .wp-block-navigation-item__content {
	outline-offset: 4px;
}

.wp-block-navigation .wp-block-navigation-item ul.wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	outline-offset: 0;
}

h1,
h2,
h3,
h4,
h5,
h6,
blockquote,
caption,
figcaption,
p {
	text-wrap: pretty;
}

.more-link {
	display: block;
}

.responsive-row {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	gap: 20px;

	div.wp-block-group {
		flex: 1;
	}
}

.min-page-height {
	min-height: 80dvh;
	width: 100%;
	display:flex;
	flex-direction:column;
}

.full-page-height-container {
	height: 100dvh;
	width: 100%;
	display:flex;
	flex-direction:column;
}

.full-size-content {
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	padding: 0 20px;
}

.text-image-section,
.image-text-section {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 20px;

	img {
		border-radius: 10px;
	}
}

.image-text-section {
	h2 {
		text-align: right;
	}

	p {
		text-align: right;
	}
}

.text-image-section .wp-block-image,
.text-image-section .text-content,
.image-text-section .wp-block-image,
.image-text-section .text-content {
	flex: 1 1 300px;
}

@media (max-width: 768px) {
	.responsive-row {
		flex-direction: column;
	}

	.text-image-section,
	.image-text-section {
		h2 {
			text-align: left;
		}

		p {
			text-align: left;
		}
	}


	.image-text-section,
	.text-image-section {
		flex-direction: column;
		text-align: center;
		gap: 0;
	}

	.image-text-section {
		flex-direction: column-reverse;
	}


	.text-image-section .wp-block-image,
	.text-image-section .text-content,
	.image-text-section .wp-block-image,
	.image-text-section .text-content {
		flex: 1 1 auto;
		margin-bottom: 20px;
	}

	.no-mobile {
		display: none;
	}
}