/**
 * Theme Name: Oh My, Hi FSE Theme
 * Theme URI: https://ohmyhi.com/
 * Author: Jeremy Launder
 * Author URI: https://jeremylaunder.com
 * Description: A full site editing theme for Oh My, Hi.
 * Requires at least: 6.6
 * Tested up to: 6.6
 * Requires PHP: 8.1
 * Version: 1.36.0
 * License: GNU General Public License v2 or later
 * License URI: http://www.gnu.org/licenses/gpl-2.0.html
 * Text Domain: omht
 *
 * @package OMHT
 */
:root {
	--omht--color--contrast-ultra-light: #ebebeb;
	--omht--color--accent-ultra-dark: #17404f;
}

.wp-element-button,
.wp-block-button__link,
a {
	transition: var(--wp--custom--btn-transition);
}

/* Disable background attachment: fixed on smaller screens */
@media (max-width: 1024px) {
	.wp-block-group.has-background {
		background-attachment: scroll !important;
	}
}

:where(body .wp-site-blocks)>.wp-block-template-part {
	margin-block-start: 0;
}

body .wp-block-post-content.has-global-padding .wp-block-group {
	padding-left: var(--wp--preset--spacing--s);
	padding-right: var(--wp--preset--spacing--s);
}

/*
 * "Log in" button for site owners (assets/js/append-login-link.js): a small
 * icon tab tucked flush into the footer's bottom-left corner for logged-out
 * visitors, about the size of the old round icon. The container takes no space,
 * so it overlays the footer without changing its layout. "Log in" is
 * screen-reader text, and the link has a matching tooltip. 34px is easy to
 * tap on a phone (24px, the WCAG 2.2 AA minimum, proved too small in practice). Literal brand colors on purpose: it is
 * Oh My Hi's button, not part of the site's palette.
 */
.omht-login__container {
	position: relative;
	height: 0;
}

.omht-login__link {
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 10;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 0 10px 0 0;
	/* Defines the tab on white or light footers; barely visible on dark ones. */
	border-top: 1px solid rgba(23, 64, 79, 0.15);
	border-right: 1px solid rgba(23, 64, 79, 0.15);
	box-sizing: border-box;
	background: rgba(255, 255, 255, 0.9);
	box-shadow: 1px -1px 6px rgba(0, 0, 0, 0.1);
	color: #17404f;
	text-decoration: none;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.omht-login__link:hover {
	background: #17404f;
	color: #fff;
}

/* Drawn inside the button, since it sits against the edge of the screen. */
.omht-login__link:focus-visible {
	outline: 2px solid #258eb6;
	outline-offset: -4px;
}

.omht-login__icon {
	flex: none;
	width: 16px;
	height: 16px;
}

/*
 * Phones: their rounded screen corners clip anything flush in the corner, so
 * move the button in from the edge as a rounded square (and past any safe-area
 * inset the browser reports).
 */
@media (max-width: 782px) {
	.omht-login__link {
		bottom: max(10px, env(safe-area-inset-bottom));
		left: max(10px, env(safe-area-inset-left));
		border: 1px solid rgba(23, 64, 79, 0.15);
		border-radius: 10px;
		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
	}
}

.omht-login__label {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.ff-form-preview-body .ff_submit_btn_wrapper button.ff-btn.ff-btn-submit {
	background: var(--wp--preset--color--action);
}

.fluentform .error-clear {
    cursor: pointer;
}

#wp-admin-bar-omht-logout .ab-item:before {
	content: "\f310";
	top: 2px;
}
#wpadminbar #wp-admin-bar-site-editor,
#wpadminbar #wp-admin-bar-comments,
#wpadminbar #wp-admin-bar-new-content,
#wpadminbar #wp-admin-bar-fluent_form,
#wp-admin-bar-top-secondary {
	display: none;
}
#wpadminbar {
	z-index: 100010;
}
#wpadminbar,
.ab-sub-wrapper,
#wpadminbar ul,
#wpadminbar ul li {
	background: var(--omht--color--accent-ultra-dark);
}
#wpadminbar:not(.mobile) .ab-top-menu>li>.ab-item:focus,
#wpadminbar.nojq .quicklinks .ab-top-menu>li>.ab-item:focus,
#wpadminbar:not(.mobile) .ab-top-menu>li:hover>.ab-item,
#wpadminbar .ab-top-menu>li.hover>.ab-item {
	background: var(--omht--color--accent-ultra-dark);
	color: var(--omht--color--contrast-light);
}
#wpadminbar .ab-icon:before,
#wpadminbar .ab-item:before,
#wpadminbar #adminbarsearch:before {
	color: var(--omht--color--contrast-ultra-light);
}
#wpadminbar .quicklinks .menupop ul li a,
#wpadminbar .quicklinks .menupop ul li a strong,
#wpadminbar .quicklinks .menupop.hover ul li a,
#wpadminbar.nojs .quicklinks .menupop:hover ul li a {
	color: var(--omht--color--contrast-ultra-light);
}
#wpadminbar .quicklinks .menupop ul li a:hover,
#wpadminbar .quicklinks .menupop ul li a:focus,
#wpadminbar .quicklinks .menupop ul li a:hover strong,
#wpadminbar .quicklinks .menupop ul li a:focus strong,
#wpadminbar .quicklinks .ab-sub-wrapper .menupop.hover>a,
#wpadminbar .quicklinks .menupop.hover ul li a:hover,
#wpadminbar .quicklinks .menupop.hover ul li a:focus,
#wpadminbar .quicklinks .menupop.hover ul li div[tabindex]:hover,
#wpadminbar .quicklinks .menupop.hover ul li div[tabindex]:focus,
#wpadminbar.nojs .quicklinks .menupop:hover ul li a:hover,
#wpadminbar.nojs .quicklinks .menupop:hover ul li a:focus,
#wpadminbar li:hover .ab-icon:before,
#wpadminbar li:hover .ab-item:before,
#wpadminbar li a:focus .ab-icon:before,
#wpadminbar li .ab-item:focus:before,
#wpadminbar li .ab-item:focus .ab-icon:before,
#wpadminbar li.hover .ab-icon:before,
#wpadminbar li.hover .ab-item:before,
#wpadminbar li:hover #adminbarsearch:before,
#wpadminbar li #adminbarsearch.adminbar-focused:before {
	color: var(--omht--color--contrast-light);
}