body {
	position: relative;
}

@media screen and (max-width: 600px) {
    #wpadminbar {
    	position: fixed;
    }
}

.wp-site-blocks {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.wp-site-blocks > main {
    flex-grow: 1;
}

body.has-theme-bg {
	background-image: linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url("/wp-content/themes/blogs-helsinki-2026/assets/images/main_background_image.jpg");
	background-position: top center;
	background-repeat: no-repeat;
	background-size: cover;
	min-height: 100vh;
}

body.has-custom-bg-image::before {
	content: "";
	position: fixed;
	width: 100%;
	height: 100%;
	background: linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9));
	pointer-events: none;
	z-index: -1;
}

.wp-site-blocks {
  position: relative;
  z-index: 1;
}

.breadcrumb * {
	font-size: 16px;
}

.breadcrumb .breadcrumb-list {
	list-style-type: none;
	padding: 0;
	margin: 0;
	padding-bottom: 16px;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-start;
	gap: 8px;
	border-bottom: 1px solid var(--wp--preset--color--secondary-gray);
}

.breadcrumb .breadcrumb-item span.separator {
	display: block;
	width: 16px;
	height: 16px;
	background-image: url("/wp-content/themes/blogs-helsinki-2026/assets/icons/arrow_forward_black_icon.svg");
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

body.archive.category .wp-block-term-description {
	padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--50);
	border: 1px solid var(--wp--preset--color--secondary-gray);
	background-color: var(--wp--preset--color--main-white);
}

@media (min-width: 782px) and (max-width: 1199px) {
	.post-template-single-post-with-sidebar-and-toc main .wp-block-columns {
		display: grid;
		grid-template-columns: 1fr 2fr;
	}
	.post-template-single-post-with-sidebar-and-toc main .wp-block-columns .right-col {
		grid-column: 2 / 3;
	}
}

@media (max-width: 599px) {
	main .content-area .breadcrumb {
		display: none;
	}
}

@media (max-width: 480px) {
	body {
		background-image: none !important;
		background-color: var(--wp--preset--color--main-white);
	}
}