/* ---------------------------------------------------------------------------------------------

	Theme Name: Björk
    Text Domain: bjork
	Version: 0.1.6
	Description: Björk is a minimal theme for blogs and personal websites. It features a sticky sidebar menu on desktop for quick and easy navigation, and the clean design puts your content front and center. Björk comes with seven different theme styles to choose from, and over 15 different block patterns that you can use to quickly build unique page layouts. Demo: https://andersnoren.se/themes/bjork/
	Tags: blog, portfolio, grid-layout, one-column, two-columns, custom-background, custom-colors, custom-logo, custom-menu, editor-style, featured-images, sticky-post, threaded-comments, translation-ready, block-styles, wide-blocks, full-site-editing
	Author: Anders Norén
	Author URI: https://andersnoren.se
	Theme URI: https://andersnoren.se/teman/bjork-wordpress-theme/
	License: GNU General Public License version 2.0
	License URI: http://www.gnu.org/licenses/gpl-2.0.html
	Requires PHP: 5.6
	Tested up to: 6.0

	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)

/* --------------------------------------------------------------------------------------------- */

/*
 * Font smoothing.
 * This is a niche setting that will not be available via Global Styles.
 * https://github.com/WordPress/gutenberg/issues/35934
 */

body {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}

/*
 * Link styles. Necessary until the following issue is resolved in Gutenberg:
 * https://github.com/WordPress/gutenberg/issues/27075
 */

a {
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
}

a:hover { 
	text-decoration: none; 
}

.wp-block-navigation .wp-block-navigation-item a:hover,
.wp-block-navigation .wp-block-navigation-item a:focus {
	text-decoration: underline;
	text-decoration-style: solid;
}

/* Input styles */

input, textarea, select, button {
	background-color: inherit;
	border-radius: 0;
	font-family: inherit;
	font-size: inherit;
	letter-spacing: inherit;
	margin: 0;
	-webkit-appearance: none;
}

input, textarea, select {
	background-color: var( --wp--preset--color--background );
	border: .1rem solid var( --wp--preset--color--tertiary );
	border-radius: .4rem;
	box-sizing: border-box;
	color: var( --wp--preset--color--foreground );
	max-width: 100%;
	padding: .5em;
}

label {
	font-size: var( --wp--preset--font-size--small );
	font-weight: 500;
}

/* Figure Styles */

figure {
	margin: 0;
}

figcaption {
	color: var( --wp--preset--color--secondary );
}

:root figcaption {
	font-size: var( --wp--preset--font-size--small );
}

/*
 * Button hover styles. Necessary until the following issue is resolved in Gutenberg:
 * https://github.com/WordPress/gutenberg/issues/27075
 */

.wp-block-file .wp-block-file__button:hover,
.wp-block-button__link:hover,
.wp-block-button__link:visited {
	color: var( --wp--preset--color--background );
}

/*
 * Alignment styles. Relevant issues:
 * https://github.com/WordPress/gutenberg/issues/35607
 * https://github.com/WordPress/gutenberg/issues/35884
 */

.wp-site-blocks,
body>.is-root-container,
.edit-post-visual-editor__post-title-wrapper,
.wp-block-group.alignfull,
.wp-block-cover.alignfull,
.is-root-container .wp-block[data-align="full"]>.wp-block-group,
.is-root-container .wp-block[data-align="full"]>.wp-block-cover {
	padding-left: var(--wp--custom--spacing--outer);
	padding-right: var(--wp--custom--spacing--outer);
}

.wp-site-blocks .alignfull,
.wp-site-blocks>.wp-block-group.has-background,
.wp-site-blocks>.wp-block-cover,
.wp-site-blocks>.wp-block-template-part>.wp-block-group.has-background,
.wp-site-blocks>.wp-block-template-part>.wp-block-cover,
body>.is-root-container>.wp-block-cover,
body>.is-root-container>.wp-block-template-part>.wp-block-group.has-background,
body>.is-root-container>.wp-block-template-part>.wp-block-cover,
.is-root-container .wp-block[data-align="full"] {
	margin-left: calc(-1 * var(--wp--custom--spacing--outer)) !important;
	margin-right: calc(-1 * var(--wp--custom--spacing--outer)) !important;
	width: unset;
}

@media ( min-width: 781px ) {

	.wp-site-blocks .wp-block-columns .wp-block-column .alignfull,
	.is-root-container .wp-block-columns .wp-block-column .wp-block[data-align="full"],
	.wp-site-blocks .alignfull:not(.wp-block-group) .alignfull,
	.is-root-container .wp-block[data-align="full"]>*:not(.wp-block-group) .wp-block[data-align="full"] {
		margin-left: auto !important;
		margin-right: auto !important;
		width: inherit;
	}

}

/*
 * Search and File Block button styles.
 * Necessary until the following issues are resolved in Gutenberg:
 * https://github.com/WordPress/gutenberg/issues/36444
 * https://github.com/WordPress/gutenberg/issues/27760
 */

input[type="button"],
input[type="submit"],
input[type="reset"],
.wp-block-search__button,
.wp-block-file .wp-block-file__button {
	background-color: var( --wp--preset--color--primary );
	border: none;
	border-radius: 0;
	color: var(--wp--preset--color--background);
	font-size: var(--wp--preset--font-size--medium);
	letter-spacing: inherit;
	padding: calc(.667em + 2px) calc(1.333em + 2px);
}

/* Editor Post Title */

.editor-post-title__input { 
	text-align: center;
}

/* Background Padding */

h1.has-background, 
h2.has-background, 
h3.has-background, 
h4.has-background, 
h5.has-background, 
h6.has-background,
p.has-background {
	padding: min( 1em, var( --wp--custom--spacing--small ) );
}

:where(.wp-block-group.has-background) {
	padding: min( 2em, var( --wp--custom--spacing--small ) );
}


/* ------------------------------------------- */
/*	Typography
/* ------------------------------------------- */


.has-huge-font-size,
.has-heading-1-font-size,
.has-heading-2-font-size,
.has-heading-3-font-size,
.has-heading-4-font-size,
.has-heading-5-font-size { 
	letter-spacing: var( --wp--custom--typography--letter-spacing--heading );
	line-height: var( --wp--custom--typography--line-height--headings--large ); 
}

.has-gigantic-font-size {
	letter-spacing: var( --wp--custom--typography--letter-spacing--gigantic );
	line-height: var( --wp--custom--typography--line-height--headings--gigantic );
}

.has-medium-font-size {
	line-height: var( --wp--custom--typography--line-height--body );
}

/* Text Decoration --------------------------- */

#cancel-comment-reply-link,
.wp-block-comment-edit-link a,
.comment-reply-link,
.wp-block-comment-date a,
.wp-block-comment-author-name a,
.wp-block-comments-pagination a,
.wp-block-post-date a,
.wp-block-site-title a,
.wp-block-query-pagination a,
.wp-block-post-title a {
	text-decoration: none;
}

#cancel-comment-reply-link:hover, #cancel-comment-reply-link:focus,
.wp-block-comment-edit-link a:hover, .wp-block-comment-edit-link a:focus,
.comment-reply-link:hover, .comment-reply-link:focus,
.wp-block-comment-date a:hover, .wp-block-comment-date a:focus,
.wp-block-comment-author-name a:hover, .wp-block-comment-author-name a:focus,
.wp-block-comments-pagination a:hover, .wp-block-comments-pagination a:focus,
.wp-block-post-date a:hover, .wp-block-post-date a:focus,
.wp-block-site-title a:hover, .wp-block-site-title a:focus,
.wp-block-query-pagination a:hover, .wp-block-query-pagination a:focus,
.wp-block-post-title a:hover, .wp-block-post-title a:focus {
	text-decoration: underline;
}


/* ------------------------------------------- */
/* Template Parts
/* ------------------------------------------- */

/* TEMPLATE PART: HEADER */

@media ( min-width: 782px ) {
	:root:not(.editor-styles-wrapper) .site-header { display: none !important; }
}

/* TEMPLATE PART: SIDEBAR */

.site-sidebar {
	display: flex;
	flex-direction: column;
	min-height: calc( 100vh - ( var( --wp--custom--spacing--outer ) * 2 ) );
}

.admin-bar .site-sidebar {
	min-height: calc( 100vh - ( var( --wp--custom--spacing--outer ) * 2 ) - var( --wp-admin--admin-bar--height ) );
}

.site-sidebar > .wp-block-group.is-vertical {
	flex-grow: 1;
	justify-content: space-between;
}

:root:not(.editor-styles-wrapper) .site-sidebar {
	position: sticky;
		top: var( --wp--custom--spacing--outer );
}

@media ( max-width: 781px ) {
	:root:not(.editor-styles-wrapper) .site-sidebar-col { display: none !important; }
}

/* TEMPLATE PART: FOOTER */

@media ( max-width: 500px ) {
	.theme-credit { display: none !important; }
}


/* ------------------------------------------- */
/* Blocks
/* ------------------------------------------- */


/* Block: Avatar ----------------------------- */

.wp-block-avatar img {
	display: block;
}

/* Block: Buttons ---------------------------- */
/* Block: Calendar --------------------------- */

.wp-block-calendar table caption,
.wp-block-calendar table tbody {
	color: var( --wp--preset--color--foreground );
}

.wp-block-calendar th,
.wp-block-calendar tbody td {
	border-color: var( --wp--preset--color--secondary );
}

.wp-block-calendar table th { 
	background-color: var( --wp--preset--color--secondary ); 
}

/* Block: Comments --------------------------- */

#cancel-comment-reply-link {
	font-weight: 500;
	letter-spacing: var(--wp--custom--typography--letter-spacing--body);
}

.wp-block-post-comments-form input[type=submit] {
	border-radius: 999rem;
	font-size: var( --wp--preset--font-size--small );
}

/* Block: File ------------------------------- */

.wp-block-file {
	align-items: center;
	display: flex;
	justify-content: space-between;
}

:root .wp-block-file__button:not(:only-child) { 
	margin-left: var( --wp--custom--spacing--baseline ); 
}

/* Block: Navigation ------------------------- */

.wp-block-navigation__responsive-container-close svg { transform: scale( 1.25 ); }
.wp-block-navigation__responsive-container-open svg { transform: scale( 1.5, 1.25 ); }

.wp-block-navigation__responsive-container.is-menu-open { 
	padding: var(--wp--custom--spacing--outer); 
}

/* Block: Pagination ------------------------- */

.wp-block-query-pagination-numbers {
	display: flex;
	gap: .88em;
}

:root .wp-block-query-pagination-numbers:first-child {
	margin: 0 auto;
	padding-left: 7.5em;
}

:root .wp-block-query-pagination-numbers:last-child {
	margin: 0 auto;
	padding-right: 7.5em;
}

[class^="wp-block-query-pagination-"][class*="-arrow"] {
	color: #fff;
	font-weight: 500;
	text-align: center;
	width: 1.75em;
}

.wp-block-query-pagination-previous,
.wp-block-query-pagination-next {
	position: relative;
}

.wp-block-query-pagination-previous:before,
.wp-block-query-pagination-next:before {
	background-color: currentColor;
	border-radius: 50%;
	content: "";
	display: block;
	position: absolute;
		top: calc( 50% - .875em );
	height: 1.75em;
	width: 1.75em;
}

.wp-block-query-pagination-previous:before { left: 0; }
.wp-block-query-pagination-next:before { right: 0; }

:root .wp-block-query-pagination-previous-arrow { margin-right: .88em; }
:root .wp-block-query-pagination-next-arrow { margin-left: .88em; }

@media ( max-width: 600px ) {
	.wp-block-query-pagination-numbers:not(:only-child) {
		display: none;
	}
}

/* Block: Paragraph -------------------------- */

.has-drop-cap:not(:focus):first-letter {
	border: .2rem solid currentColor;
    font-size: 2.75em;
    font-weight: var( --wp--custom--typography--font-weight--bold );
	margin: .09em 1rem .5rem 0;
	min-width: .6875em;
	padding: 0.3em;
	text-align: center;
}

/* Block: Post Comments Form ----------------- */

ol.wp-block-comment-template {
	margin: 0;
}

.wp-block-post-comments-form input:not([type=submit]), 
.wp-block-post-comments-form textarea {
	border-color: var( --wp--preset--color--tertiary );
}

.required-field-message,
.comment-notes {
	display: none;
}

.logged-in-as {
	color: var( --wp--preset--color--secondary );
}

.comment-reply-title {
	margin: 0;
}

/* Block: Post Featured Image ---------------- */

.wp-block-post-featured-image img {
	border-radius: 8px;
}

/* Block: Post Navigation -------------------- */

.post-navigation-link-previous a:before { content: "← "; }
.post-navigation-link-next a:after { content: " →"; }

/* Block: Pull Quote ------------------------- */

:root .wp-block-pullquote blockquote,
:root .wp-block-pullquote blockquote p {
	line-height: inherit;
}

:root .wp-block-pullquote blockquote p {
	hanging-punctuation: first;
	font-size: inherit;
}

:root .wp-block-pullquote.has-text-align-left, 
:root .wp-block-pullquote.has-text-align-right {
	max-width: 100%;
}

/* Block: Query Loop ------------------------- */

.wp-block-post-template.is-flex-container, 
.wp-block-query-loop.is-flex-container {
	gap: var( --wp--custom--spacing--small );
}

@media (min-width: 600px) {
	.wp-block-post-template.is-flex-container.is-flex-container.columns-2 > li, .wp-block-query-loop.is-flex-container.is-flex-container.columns-2 > li { width:calc( 50% - ( var( --wp--custom--spacing--small ) * ( 1 / 2 ) ) ); }
	.wp-block-post-template.is-flex-container.is-flex-container.columns-3 > li, .wp-block-query-loop.is-flex-container.is-flex-container.columns-3 > li { width:calc( 33.33333% - ( var( --wp--custom--spacing--small ) * ( 2 / 3 ) )); }
	.wp-block-post-template.is-flex-container.is-flex-container.columns-4 > li, .wp-block-query-loop.is-flex-container.is-flex-container.columns-4 > li { width:calc( 25% - ( var( --wp--custom--spacing--small ) * ( 3 / 4 ) ) ); }
	.wp-block-post-template.is-flex-container.is-flex-container.columns-5 > li, .wp-block-query-loop.is-flex-container.is-flex-container.columns-5 > li { width:calc( 20% - ( var( --wp--custom--spacing--small ) * ( 4 / 5 ) ) ); }
	.wp-block-post-template.is-flex-container.is-flex-container.columns-6 > li, .wp-block-query-loop.is-flex-container.is-flex-container.columns-6 > li { width: calc( 16.66667% - ( var( --wp--custom--spacing--small ) * ( 5 / 6 ) ) ); }
}

/* Block: Query Pagination ------------------- */

.wp-block-query-pagination > .wp-block-query-pagination-next, 
.wp-block-query-pagination > .wp-block-query-pagination-numbers, 
.wp-block-query-pagination > .wp-block-query-pagination-previous {
	margin-bottom: 0;
}

.wp-block-query-pagination-next:only-child {
	margin-left: auto;
}

/* Block: Quote ------------------------------ */

blockquote {
	margin: 0;
}

blockquote p:first-child { margin-top: 0; }
blockquote p:last-child { margin-bottom: 0; }

/* Block: Separator -------------------------- */

:root hr[class*="is-style-bjork-angled-separator"] {
	background-color: transparent !important;
	background-image: linear-gradient( -45deg, currentColor 25%, transparent 25%, transparent 50%, currentColor 50%, currentColor 75%, transparent 75%, transparent );
    background-size: 5px 5px;
	border: none;
	height: 10px !important;
	max-width: 100%;
}

:root hr.is-style-bjork-angled-separator-wide { width: 100% !important; }

/* Block: Search Form ------------------------ */

.wp-block-search {
	font-size: var( --wp--preset--font-size--small );
}

.wp-block-search .wp-block-search__label {
	font-weight: inherit;
}

.wp-block-search__input {
	margin: 0;
	padding: .75em 1.25em;
}

.wp-block-search__button-inside .wp-block-search__inside-wrapper,
.wp-block-search__button-inside .wp-block-search__input {
	margin: 0;
	padding: .375em .5em !important;
}

.wp-block-search__button { 
	border-radius: 999rem;
	font-size: inherit;
	font-weight: 600;
	margin: 0 0 0 .75em;
}

/* Block: Table ------------------------------ */

:root .wp-block-table *,
.wp-block-table.is-style-stripes {
	border-color: var(--wp--preset--color--secondary);
}

.wp-block-table.is-style-stripes tbody tr:nth-child(odd) { 
	background-color: var(--wp--preset--color--secondary); 
}