/*
Theme Name: Armando
Author: Carolina Nymark
Author URI: https://fullsiteediting.com
Theme URI:
Version: 1.2.2
Description: An experimental full site editing theme for blogs or sports teams. This theme requires Gutenberg version 10.6 or newer. Armando includes multiple block styles and block patterns including site headers, site footers and page layouts.
Tags: full-site-editing, blog, one-column, two-columns, editor-style, block-styles
Text Domain: armando
Requires at least: 5.5
Requires PHP: 7.2
Tested up to: 5.7

License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html

All files, unless otherwise stated, are released under the GNU General Public
License version 2.0 (http://www.gnu.org/licenses/gpl-2.0.html)

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.
*/

/* Make sure that full width blocks are full width, reset the browser margins. */
body {
	margin: 0;
	overflow-x: hidden;
}

* {
	box-sizing: border-box;
}

/* Elements */
img {
	max-width: 100%;
	height: auto;
}

textarea {
	clear: both;
	display: block;
	width: 100%;
}

pre {
	white-space: pre-wrap;
}

/* Adjust underlines to improve accessibility. This is a temporary solution.*/
.wp-site-blocks a:not(.wp-block-button__link) {
	text-decoration: underline;
}

.wp-site-blocks a:hover {
	text-decoration: none;
}

/* Center site title and menu on small screens */
@media ( max-width: 781px ) {
	.wp-site-blocks .site-header .wp-block-site-title {
		text-align: center;
	}
}

@media ( max-width: 1300px ) {
	.wp-site-blocks .site-header .items-justified-right>ul {
		justify-content: initial;
	}
}

/* Override column breakpoints for the site header. */
@media (min-width: 600px) and (max-width: 1024px) {
	.wp-site-blocks .site-header .wp-block-column:not(:only-child) {
		flex-basis: 100%!important;
		flex-grow: initial;
	}

	.wp-site-blocks .site-header .wp-block-column:nth-child(2n) {
		margin-left: initial;
	}
}

@media ( min-width: 782px ) {
	.is-style-armando-multi-color.has-background {
		padding-bottom: 0;
		padding-top: 0;
		padding-right: 0;
	}
}

/* Block figcaptions has an incorrect width on the front. */
.wp-block-image .aligncenter>figcaption {
	display: block;
}

/* 
 * Site logo can not be centered on the front without this.
 * Temporary solution. Needs testing.
*/
.wp-block-site-logo.aligncenter {
	margin-left: auto;
	margin-right: auto;
	display: table;
}

/* Comments */
.commentlist,
.children {
	list-style: none;
}

.comment-meta .says,
.home .comment-area {
	display: none; /* Hide single page comment area on the home page */
}

/* Prevent long titles from overflowing */
.wp-site-blocks h2.wp-block-post-title {
	-ms-word-wrap: break-word;
	word-wrap: break-word;
}

/* Sticky header */
.is-style-armando-sticky-header {
	position: sticky;
	top: 0;
}

/* Move the position down to adjust for the WordPress admin bar */
.admin-bar .is-style-armando-sticky-header {
	position: sticky;
	top: 32px;
}

/* Revert the sticky position on smaller screens */
@media screen and (max-width: 782px) {
	.is-style-armando-sticky-header {
		position: initial;
	}
}

/* Sidebars */
.armando-sidebar-right,
.armando-sidebar-left {
	height: 100%;
}

@media (min-width: 782px) {
	.armando-has-sidebar-right .wp-block-column:not(:first-child),
	.armando-has-sidebar-left .wp-block-column:not(:first-child) {
		margin-left: 0;
		position: sticky;
	}
}

@media ( min-width: 600px ) {
	.armando-sidebar-right,
	.armando-sidebar-left {
		position: sticky;
		border-left: 1px solid var(--wp--preset--color--white);
	}

	.armando-sidebar-left {
		position: sticky;
		border-right: 1px solid var(--wp--preset--color--white);
	}
}

/* Disable https://github.com/WordPress/gutenberg/pull/27995 until 
* https://github.com/WordPress/gutenberg/pull/26809.
*/
p:empty:before {
	content: none !important;
}

/*
 * Increase padding on smaller screens. 
 * Temporary solution to avoid text content running up to the edge of the browser window,
 * making the text difficult to read.
*/
@media ( max-width: 600px ) {
	main {
		padding: 8px;
	}
}

@media ( max-width: 1200px ) {
	.post-template-post-sidebar-right main,
	.post-template-post-sidebar-left main,
	.page-template-post-sidebar-right main,
	.page-template-post-sidebar-left main {
		padding: 8px;
	}
}