/*!
Theme Name: Jessica Darby Photography Overnight Website
Theme URI: 
Author: Overnight Website
Author URI: https://overnightwebsite.com
Description: Overnight Website theme for Jessica Darby
Version: 1.0.0
Tested up to: 6.0
Requires PHP: 6.8
Text Domain: overnight-website
*/

html {
	scroll-behavior: smooth;
}

@media screen and (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

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

body .is-layout-flex {
	gap: 40px;
}

main {
	margin-block-start: 0 !important;
}

header {
	position: relative;
	z-index: 2;
}

p strong {
	font-weight: 600;
}

main li + li {
	margin-top: 24px;
}

/* ************* */
/* Hover & Focus */
/* ************* */
.entry-content a:where(:not(.wp-element-button)):hover, aside a:where(:not(.wp-element-button)):hover {
	background: #000;
	color: #FFF;
}

/* Default Button Style */
.wp-block-button .wp-block-button__link, .ff_submit_btn_wrapper .ff-btn-submit:not(.ff_btn_no_style), .is-style-ow-style-button a {
	overflow: hidden;
	position: relative;
	transition: all 150ms ease-in-out;
	z-index: 1;
}
.wp-block-button .wp-block-button__link:before, .ff_submit_btn_wrapper .ff-btn-submit:not(.ff_btn_no_style):before, .is-style-ow-style-button a:before {
	background-color: var(--wp--preset--color--secondary);
	content: "";
	height: 0%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%) rotate(45deg);
	transition: all 0.6s ease;
	width: 100%;
	z-index: -1;
}
.wp-block-button:where(.is-style-outline) > .wp-block-button__link:not(.has-background) {
	border-color: #000 !important;
}
.wp-block-button .wp-block-button__link:hover {
	border-color: var(--wp--preset--color--secondary);
	color: #fff;
	outline: 0;
}
.wp-block-button .wp-block-button__link:hover:before, .ff_submit_btn_wrapper .ff-btn-submit:not(.ff_btn_no_style):hover:before {
	height: 670%;
}

/* Button Light Style */
.wp-block-button.is-style-ow-button-light a:hover, .wp-block-search__button:hover, .fluentform_wrapper_2 .ff_submit_btn_wrapper .ff-btn-submit:not(.ff_btn_no_style):hover {
	border-color: var(--wp--preset--color--light);
	color: #000;
}
.wp-block-button.is-style-ow-button-light a:before, .wp-block-search__button:before, .fluentform_wrapper_2 .ff_submit_btn_wrapper .ff-btn-submit:not(.ff_btn_no_style):before {
	background-color: var(--wp--preset--color--light);
}

/* Button Outline Style */
.wp-block-button.is-style-outline .wp-block-button__link:hover {
	border-color: var(--wp--preset--color--dark);
	color: #FFF;
}
.wp-block-button.is-style-outline .wp-block-button__link:before {
	background-color: var(--wp--preset--color--dark);
}

/* Submit Button */
.ff_submit_btn_wrapper .ff-btn-submit:not(.ff_btn_no_style):before {
	background: #000;
}
.frm-fluent-form .ff_submit_btn_wrapper .ff-btn-submit:not(.ff_btn_no_style):hover {
	color: #FFF;
	opacity: 1;
}

/* Footer Button Style */
footer a:where(:not(.wp-element-button):not(.wp-block-social-link-anchor)):hover {
	border-color: var(--wp--preset--color--secondary);
	color: #FFF;
}
footer a:where(:not(.wp-element-button):not(.wp-block-social-link-anchor)):before {
	background-color: var(--wp--preset--color--secondary);
}
.fluentform_wrapper_2 .ff_submit_btn_wrapper .ff-btn-submit:not(.ff_btn_no_style):hover {
	background: transparent !important;
	opacity: 1;
}

/* Button Focus */
a:where(:not(.wp-element-button)):focus-visible, .wp-element-button:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 4px;
}
.fluentform_wrapper_2 .ff_submit_btn_wrapper .ff-btn-submit:not(.ff_btn_no_style):focus-visible {
	outline: 2px solid #FFF;
	outline-offset: 4px;
}
.wp-block-social-link-anchor:focus-visible {
	border-radius: 50%;
}

/* ************ */
/* Block Styles */
/* ************ */

/* Group: Auto Margins */
.is-style-ow-margin-auto {
	margin-left: auto !important;
	margin-right: auto !important;
}

/* ************ */
/* Header Styles */
/* ************ */

/* Top Bar */
.top-bar .wp-block-social-links.is-style-logos-only {
	gap: 15px;
}
.top-bar .wp-block-social-links.is-style-logos-only .wp-social-link svg {
	height: 14px;
	width: auto;
}

/* Header */
.header-inner .wp-block-navigation ul {
	gap: 40px;
}

/* Nav */
.wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content:hover {
	text-decoration: underline;
}

/* Transparent Header */
.page-template-page-transparent .entry-content {
	margin-block-start: -115.5px !important;
}
.page-template-page-transparent .header-inner .wp-block-site-logo img {
	filter: grayscale(100) brightness(100);
}

/* ************** */
/* Blocks & Pages */
/* ************** */
body:not(.blog) .wp-block-post-featured-image img {
	max-height: 800px;
	object-fit: cover;
}
.wp-block-button .wp-block-button__link {
	min-width: 168px;
}

.wp-block-post-title a {
	text-decoration: none;
}

/* Single Post */
.single-post .wp-block-post-featured-image {
	margin-top: 0;
}

.single-post main .wp-block-post-title {
	margin-top: -15px;
}
.single-post main .wp-block-post-terms a {
	text-decoration: none;
}

.single-post main .single-post-divider {
	height: 1px !important;
	margin-left: 0 !important;
	margin-bottom: 30px;
	width: 150px;
}

.single-post aside .wp-block-query {
	margin-top: 15px;
}
.single-post aside .wp-block-categories a {
	text-decoration: none;
}
.single-post aside .wp-block-categories {
	list-style: none;
	padding: 0;
}
.single-post aside .wp-block-categories li + li {
	margin-top: 14px;
}

.single-post .wp-block-image {
	margin-bottom: 0;
}

/* Forms */
form.fluent_form_1 .ff-btn.ff-btn-submit {
	font-family: 'Gotham', sans-serif;
}
form.fluent_form_1 .ff-el-form-left {
	background: #f2f2f2;
	border: 1px solid #000;
}
form.fluent_form_1 .ff-el-input--content select {
	background: #FFF;
}
.fluentform .ff-el-form-left .ff-el-input--label, .fluentform .ff-el-form-right .ff-el-input--label {
	padding-left: 13px;
}
.fluentform_wrapper_1 .ff-el-input--content input, .fluentform_wrapper_1 .ff-el-input--content .ff-el-form-control.ff_stripe_card_element, .fluentform_wrapper_1 .ff-el-input--content textarea, .fluentform_wrapper_1 .ff-el-input--content select, .fluentform_wrapper_1 .choices__list--single, .fluentform_wrapper_1 .choices[data-type*="select-multiple"] {
	border-color: transparent !important;
}

/* ************* */
/* Footer Styles */
/* ************* */

.site-footer {
	margin-block-start: 0;
}
.site-footer .fluentform .ff-el-form-control {
	padding: 15.5px 15px;
}
.site-footer .wp-block-social-links .wp-social-link a {
	padding: 15px;
}

footer .ff-el-input--content {
	position: relative;
}
footer .fluentform .ff-el-is-error .text-danger {
	bottom: -25px;
	color: #FFF;
	font-size: 16px;
	position: absolute;
}

/* ************************ */
/* Natural Navigation Break */
/* ************************ */

@media ( min-width: 1067px ) {
	/* Inherit Fixes */
	.has-light-color .wp-block-navigation-item__content {
		color: var(--wp--preset--color--light) !important;
	}

	/* Hide navigation items on desktop */
	.wp-block-navigation .is-style-ow-desktop-hide {
		display: none;
	}

	/* Navigation: Button Style */
	.is-style-ow-style-button a:hover {
		border-color: var(--wp--preset--color--primary);
		color: #FFF !important;
		text-decoration: none !important;
	}
	.is-style-ow-style-button a:before {
		background: var(--wp--preset--color--primary);
	}

	/* Transparent header fixes */
	.page-template-page-transparent header .wp-block-navigation-item__content.wp-block-navigation-item__content {
		color: #FFF;
		transition: all 150ms ease-in-out;
	}
	.page-template-page-transparent header .is-style-ow-style-button a {
		border-color: #FFF;
	}
	.page-template-page-transparent header .is-style-ow-style-button a:hover {
		border-color: var(--wp--preset--color--primary);
	}
}

@media (max-width: 1390px) and (min-width: 1080px) {
	.wp-block-navigation-item.is-style-ow-style-button {
		display: none;
	}
}

@media ( max-width: 1080px ) {
	/* Spacer: Hide on mobile */
	.is-style-ow-mobile-hide {
		display: none;
	}

	/* ************************ */
	/* Adjust Default Nav Break */
	/* ************************ */

	/* Show the top bar and align the buttons */
	header .wp-block-navigation__responsive-container {
		padding-top: 20px !important;
		top: 35px;
	}
	/* Hide the nav when it's not open */
	header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}
	/* Show the menu button and style it */
	.wp-block-navigation__responsive-container-open.wp-block-navigation__responsive-container-open.wp-block-navigation__responsive-container-open {
		border: 1px solid #000;
		display: block;
		font-size: 18px;
		padding: 8px 15px 10px;
	}
	.page-template-page-transparent .wp-block-navigation__responsive-container-open.wp-block-navigation__responsive-container-open.wp-block-navigation__responsive-container-open {
		border-color: #FFF;
		color: #FFF;
	}
	/* Close button styles */
	.wp-block-navigation__responsive-container-close.wp-block-navigation__responsive-container-close.wp-block-navigation__responsive-container-close {
		border: 1px solid #000;
		font-size: 18px;
		padding: 8px 15px 10px;
	}
	
	.wp-block-navigation__responsive-dialog {
		padding-inline: 25px;
	}
	
	.wp-block-navigation__responsive-container-close {
		right: 25px;
	}

	/* Top Bar */
	.top-bar nav {
		display: none;
	}

	/* Single Post */
	.single-post aside {
		margin-top: 150px;
	}

	/* 3 columns of content */
	.wp-block-post-template.is-flex-container.is-flex-container.columns-3 > li {
		width: calc(50% - .83333em);
	}
	
	h1 {
		font-size: 2.5rem !important;
	}
	h2 {
		font-size: 1.75rem !important;
	}
	.has-heading-5-font-size {
		font-size: 1.25rem !important;
	}
	
	.zero-mobile-padding-bottom {
		padding-bottom: 0 !important;
	}
	.less-mobile-padding-top {
		padding-top: 20px !important;
	}
}

/* Misc Small Screens */
@media ( max-width: 810px ) {
	/* Fix min heights */
	.wp-block-cover {
		min-height: 450px !important;
	}
	.single-post .wp-block-post-featured-image, .single-post .wp-block-post-featured-image img {
		height: auto !important;
		max-height: 550px !important;
	}

	/* 3 columns of content */
	.wp-block-post-template.is-flex-container.is-flex-container.columns-3 > li {
		width: 100%;
	}
}

/* Mobile Screens - I tried to attempt this but then gave up very quickly because I didn't want to break things*/
@media ( max-width: 480px ) {
	
}

