/*
Theme Name: Blockfolio
Theme URI: https://blockthemespro.com
Author: Block Themes Pro
Description: Another amazing block theme by the BTP crew.  Simple, clean, and easy to navigate.  A great option for anyone who wants to create a beautiful portfolio site without a ton of work. Easily drop in our pre-built block patterns for a custom look that will awe your visitors. As always, no clunky code or unnecessary custom fields and javascript - it's lightweight and. great for SEO.
Requires at least: 6.2
Tested up to: 6.2
Requires PHP: 7.2
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/old-licenses/gpl-2.0.html
Text Domain: blockfolio
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, threaded-comments, translation-ready, wide-blocks, block-styles, blog, portfolio, education
*/



// DOCUMENT & GLOBAL

html, body {
	border: none;
	margin: 0;
	padding: 0;
	height: 100%;
}

html {
	scroll-behavior: smooth;
}

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

*:focus:not(:focus-visible) {
	outline: none;
}

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

.site-footer {
	margin-top: auto !important;
}

a {
	text-underline-offset: .15em;
	transition: .15s ease;
	&:hover {
		img {
			opacity: .8;
		}
	}
}

// SPECIAL IMAGE HOVER
.wp-block-image,
.wp-block-post .wp-block-post-featured-image {
	overflow: hidden;
	a {
		img {
			transform: scale(1.05);
			transition: transform .25s;
			&:hover {
				transform: scale(1);
				opacity: 1;
			}
		}
	}
} 

.wp-block-image:has(a),
.wp-block-post .wp-block-post-featured-image:has(a) {
	border-radius: 16px;	
}

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

input:not([type="radio"]):not([name="checkbox"]):not(.wp-element-button),
textarea,
select {
	max-width: 420px;
	border-radius: 6px;
	appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    background: var(--wp--preset--color--base-alt);
	border: 1px solid var(--wp--preset--color--base-alt);
	padding: calc(0.667rem + 5px) calc(1rem + 2px);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: normal;
	outline: none;
	color: currentcolor;
	transition: .2s all;
	&:focus {
		border-color: var(--wp--preset--color--contrast-alt);
	}
}

button {
	transition: .2s all;
}


// A FEW GLOBAL STYLES
.hide-on-desktop {
	display: none !important;
}
.mt-0 {
	margin-top: 0;
}
.mb-0 {
	margin-bottom: 0;
}
.mt-auto {
	margin-top: auto !important;
}


// FONTS: VARIABLE FONT SETTINGS
.is-style-font-variation-narrow {
	font-variation-settings: "wdth" 85;
}


// BLOCK: LOGO
.wp-block-site-logo a:hover img {
	opacity: 1;
}


// BLOCK: SITE TITLE
.wp-block-site-title {
	a {
		text-decoration: none;
	}
}


// BLOCK: SEPARATOR
.wp-block-separator {
	border-top: none;
}


// BLOCK: NAVIGATION
.wp-block-post-navigation-link {
	line-height: 1.25;
}
.post-navigation-link-previous,
.post-navigation-link-next {
	flex-basis: 50%;
}
.post-navigation-link-next {
	text-align: right;
}

// BLOCK: POST TERMS
.wp-block-post-terms {
	gap: 5px;
	display: flex;
	flex-flow: row wrap;
}

.wp-block-post-terms__separator {
	display: none;
}

.is-style-buttons .page-numbers, 
.is-style-buttons .wp-block-query-pagination-next, 
.is-style-buttons .wp-block-query-pagination-previous, 
.is-style-buttons.wp-block-post-terms>a {
    text-decoration: none;
    position: relative;
    line-height: var(--wp--custom--typography--line-height--normal);
    color: var(--wp--preset--color--contrast-alt);
    display: inline-block;
    font-variation-settings: "wdth" 85;
    font-weight: 500;
	text-transform: uppercase;
	font-size: calc(.7 * var(--wp--preset--font-size--small));
	letter-spacing: 1px;
    &:before {
		content: "#";
	}
	&:hover {
		color: var(--wp--preset--color--contrast);
	}
}

.taxonomy-category.has-text-align-center {
	justify-content: center;
}

// BLOCK: GALLERY
.gallery-vertically-center-images {
	.wp-block-image {
		display: flex;
		align-items: center;
		margin-top: auto !important;
		margin-bottom: auto !important;
	}
}


// BLOCK: CODE
.wp-block-code {
	border-radius: 4px;
	border: 1px solid var(--wp--preset--color--contrast-alt);
}


// BLOCK: POST AUTHOR
.wp-block-post-author__content {
	gap: .3rem;
	font-weight: 500;
	color: var(--wp--preset--color--contrast-alt);
	display: flex;
}

.avatar {
	border-radius: 50%;
}

.wp-block-post-author__content {
	flex-flow: column;
	p {
		margin: 0;
	}
}

.wp-block-post-author__name {
	a {
		color: var(--wp--preset--color--contrast);
	}
}

.wp-block-post-author__bio {
	font-size: 1em;
	color: var(--wp--preset--color--contrast);
	font-weight: normal;
}


// BLOCK: BUTTON
.wp-element-button {
	-webkit-transform-style: preserve-3d;
	-webkit-backface-visibility: hidden;
	-webkit-transform: translateZ(0);
	&:hover {
		opacity: .8;
	}
}


// BLOCK: SEARCH
.wp-block-search__inside-wrapper {
	padding: 0 !important;
	margin: 0 !important;
	border-radius: 4px;
	transition: .15s ease;
	&:focus-within {
		border-color: var(--wp--preset--color--accent);
	}
}
.wp-block-search__button-inside {
	input.wp-block-search__input  {
		border: none!important;
		padding: 8px 12px !important;
		font-size: var(--wp--preset--font-size--small);
	}
	button {
		padding: 8px !important;
		margin: 0 !important;
		background: none !important;
		color: var(--wp--preset--color--contrast-alt) !important;
		&:hover {
			color: var(--wp--preset--color--contrast) !important;
		}
	}
}


// BLOCK: PULLQUOTE 
.wp-block-pullquote {
	margin-top: 0;
	margin-bottom: 0;
	padding-bottom: var(--wp--preset--spacing--40);
	blockquote {
		padding: 0;
		margin: 0;
		p:last-of-type {
			margin-bottom: 5px;
		}
	}
}

// HELPER CLASSES & REGISTERED BLOCK STYLES

.subscribe-form {
	display: flex;
	flex-flow: column;
	margin: auto;
	gap: var(--wp--preset--spacing--20);
	.wp-element-button {
		width: fit-content;
		border: none;
		outline: none;
		box-shadow: none;
		cursor: pointer;
		&:hover {
			opacity: .8;
		}
	}
}

cite {
	font-size: calc(.9 * var(--wp--preset--font-size--small));
	text-transform: uppercase;
	font-weight: 500;
	font-style: normal;
	color: var(--wp--preset--color--contrast-alt) !important;
}


// COMMENTS
.comment-form-cookies-consent {
	display: none !important;
}

h3#reply-title {
	font-size: var(--wp--preset--font-size-large);
}

.logged-in-as,
.comment-notes {
	color: var(--wp--preset--color--contrast-alt);
	font-size: calc(.9 * var(--wp--preset--font-size--small));
}


// COLUMNS
.is-style-equal-height {
	figure.wp-block-image {
		height: 100%;
	}
	img {
		height: 100%;
		object-fit: cover;
	}
	.wp-block-group.has-background {
		height: 100%;
	}
}


// GROUP
.is-style-full-height-content {
	display: flex;
	flex-flow: column; 
}


// THINGS WE CAN HOPEFULLY REMOVE WHEN THERE ARE FIXES IN GUTENBERG
.has-text-align-center.wp-block-post-author {
	.wp-block-post-author__content {
		justify-content: center;
	}
}

.wp-block-navigation__responsive-container-close {
	padding-top: var(--wp--preset--spacing--40);
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: var(--wp--preset--spacing--70);
}
a.wp-block-navigation-item__content {
	&:hover {
		color: var(--wp--preset--color--contrast) !important;
	}
}

.wp-block-button.is-style-outline>.wp-block-button__link, 
.wp-block-button .wp-block-button__link.is-style-outline {
	padding: 6px 14px;
}

.wp-block-post-template.is-flex-container {
	gap: 2.5em 1.25em;	
}

.is-layout-grid {
    row-gap: 5vw !important;
}

// MOBILE ONLY
@media ( max-width: 767px ) {
	.hide-on-mobile {
		display: none !important;
	}
	.hide-on-desktop {
		display: flex !important;
	}
	.wp-block-post {
		padding-bottom: var(--wp--preset--spacing--50);
		&:last-of-type {
			padding-bottom: 0;
		}
	}
	.mobile-order-1 {
		order: 1;
	}
	.mobile-order-2 {
		order: 2;
	}
	.center-on-mobile {
		margin-left: auto !important;
		margin-right: auto !important;
	}
	.mobile-padding-0 {
		padding: 0 !important;
	}
	.mobile-padding-top-0 {
		padding-top: 0 !important;
	}
	.mobile-padding-bottom-0 {
		padding-bottom: 0 !important;
	}
	.mobile-padding-right-0 {
		padding-right: 0 !important;
	}
	.mobile-padding-left-0 {
		padding-left: 0 !important;
	}
	.blockfolio-default-header > .wp-block-group {
		width:100%;
		nav {
			margin-left: auto;
		}
	}
	.mobile-min-height-auto {
		padding-bottom: 100% !important;
	}
	.footer-subscribe-group {
		width: 100%;
	}
	.footer-nav-group {
		padding-left: 0 !important;
	}
	.footer-bottom {
		gap: 5px !important;
	}
	.wp-block-media-text {
		.wp-block-media-text__content {
			padding: var(--wp--preset--spacing--40);
		}
	}
}