/*
Theme Name: Norrsken
Text Domain: norrsken
Version: 1.0.8
Description: Norrsken is a simple block theme for blogs, with a stylish design inspired by the aurora borealis. Demo: https://norrsken.andersnoren.se
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, blog, portfolio, news
Author: Anders Norén
Author URI: https://andersnoren.se
Theme URI: https://andersnoren.se/teman/norrsken-wordpress-theme/
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Requires at least: 6.4
Requires PHP: 7.4
Tested up to: 6.6
*/

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

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

:where(.wp-site-blocks) > * {
	margin-block-start: 0;
}

@supports (min-height: 100dvh) {
	[style*="min-height:100vh"] {
		min-height: 100dvh !important;
	}
}

/* HELPER CLASSES */

.hide-empty:empty { display: none !important; }

/* INPUTS */

::placeholder { 
	color: var( --wp--preset--color--contrast-2 );
}

input, textarea, select {
	background-color: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--contrast-4);
	border-radius: 4px;
	color: inherit;
	font: inherit;
	letter-spacing: inherit;
	margin: 0;
	padding: .725em 1em;
}

textarea {
	height: 5lh;
}

input[type="checkbox"],
input[type="radio"] {
	appearance: none;
	flex-shrink: 0;
	height: 1.5em;
	padding: 0;
	width: 1.5em;
}

input[type="checkbox"] { border-radius: 4px; }
input[type="radio"] { border-radius: 999px; }

input[type="checkbox"]:checked,
input[type="radio"]:checked {
	background-color: var(--wp--preset--color--contrast);
}

input[type="checkbox"]:checked {
	--check-w: .5em;
	--check-stroke: .133em;
	--check-stroke-half: calc( var( --check-stroke ) / 2 );

	background-image:
		linear-gradient(45deg, transparent calc( 50% - var( --check-stroke-half ) ), currentColor calc( 50% - var( --check-stroke-half ) ), currentColor calc( 50% + var( --check-stroke-half ) ), transparent calc( 50% + var( --check-stroke-half ) ) ),
		linear-gradient(-45deg, transparent calc( 50% - var( --check-stroke-half ) ), currentColor calc( 50% - var( --check-stroke-half ) ), currentColor calc( 50% + var( --check-stroke-half ) ), transparent calc( 50% + var( --check-stroke-half ) ) );
	background-repeat: no-repeat;
	background-position:
		calc( 50% - ( var( --check-w ) / 2 ) ) calc( 50% + ( var( --check-w ) / 4 ) ),
		calc( 50% + ( var( --check-w ) / 4 ) ) 50%;
	background-size:
		calc( var( --check-w ) / 2 ),
		var( --check-w );
	border-color: transparent;
	color: var( --wp--preset--color--base );
}

input[type="radio"]:checked {
	background-color: var(--wp--preset--color--contrast);
	border-width: 0;
}

select {
	--chevron-size: 12px;
		-webkit-appearance: none;
		-moz-appearance: none;
	appearance: none;
	background-image:
		linear-gradient(45deg, transparent calc( 50% - .5px ), currentColor calc( 50% - .5px ), currentColor calc( 50% + .5px ), transparent calc( 50% + .5px ) ),
		linear-gradient(-45deg, transparent calc( 50% - .5px ), currentColor calc( 50% - .5px ), currentColor calc( 50% + .5px ), transparent calc( 50% + .5px ) );
	background-repeat: no-repeat;
	background-position:
		calc(100% - 1em - ( .5 * var( --chevron-size ) ) ) 100%,
		calc(100% - 1em - ( 0 * var( --chevron-size ) ) ) 100%;
	background-size:
		calc( var( --chevron-size ) / 2 ), calc( var( --chevron-size ) / 2 ),
		calc( var( --chevron-size ) / 2 ), calc( var( --chevron-size ) / 2 );
	box-shadow: none;
	color: var(--wp--preset--color--contrast);
	max-width: 100%;
	outline: none;
	padding-right: 2.75em;
	transition: border-color .1s linear;
	width: 100%;
}

select:focus {
	border-color: var(--wp--preset--color--contrast-2);
}

/* TEMPLATE PART: FOOTER */

.theme-author-credit a { text-decoration: none; }
.theme-author-credit a:hover { text-decoration: underline; }