/*
Theme Name: Covr
Theme URI: https://wordpress.com/theme/covr
Author: Automattic
Author URI: https://automattic.com
Description: Covr is a simple and straightforward theme designed for a sleek presentation of images. With its full width images home template, Covr makes any photography blog, portfolio or blog beautiful and enjoyable to browse through. Contrasting with the immersiveness is its highly functional single post template. Use Covr to present your work, display your photos or tell your stories.
Requires at least: 5.8
Tested up to: 6.2
Requires PHP: 5.7
Version: 1.0.6
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: covr
Tags: blog, photography, portfolio, grid-layout, one-column, two-columns, wide-blocks, block-patterns, custom-colors, custom-logo, custom-menu, editor-style, featured-image-header, featured-images, full-site-editing, rtl-language-support, template-editing, theme-options, threaded-comments, translation-ready, fullwidth, photography, art
*/

/*
 * Control the hover stylings of outline block style.
 * Unnecessary once block styles are configurable via theme.json
 * https://github.com/WordPress/gutenberg/issues/42794
 */
.wp-block-button.is-style-outline>.wp-block-button__link:not(.has-background):hover {
	background-color: var(--wp--preset--color--secondary);
	color: var(--wp--preset--color--background);
	border-color: var(--wp--preset--color--secondary);
}

/*
 * Link styles
 * https://github.com/WordPress/gutenberg/issues/42319
 */
a {
	text-decoration-thickness: .0625em !important;
	text-underline-offset: .15em;
}

/* ===== Bat cursor + trail — whole About page ===== */
.covr-bat-page,
.covr-bat-page * {
	cursor: none;
}

.covr-bat {
	position: fixed;
	top: 0;
	left: 0;
	pointer-events: none;
	-webkit-user-select: none;
	user-select: none;
	-webkit-user-drag: none;
	z-index: 100000;
	will-change: transform, opacity;
}

.covr-bat--leader {
	z-index: 100001;
	filter: drop-shadow(0 2px 3px rgba(0, 0, 0, .35));
	transition: transform .08s ease-out, opacity .25s ease-out;
}

.covr-bat--leader .covr-bat__img {
	display: block;
	width: 46px;
	height: auto;
	transform-origin: 50% 50%;
	animation: covr-bat-flap .34s ease-in-out infinite alternate;
}

.covr-bat--trail {
	position: absolute;   /* anchored to the document so it scrolls with content */
	width: 38px;
	height: auto;
	filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .25));
	animation: covr-bat-fade 4.2s ease-out forwards;
}

@keyframes covr-bat-flap {
	from { transform: scaleY(1) scaleX(1); }
	to   { transform: scaleY(.78) scaleX(1.05); }
}

@keyframes covr-bat-fade {
	0% {
		opacity: .9;
		transform: translate(-50%, -50%)
			translate(var(--bx, 0px), var(--by, 0px))
			rotate(var(--ba, 0deg)) scale(var(--bs, 1));
	}
	100% {
		opacity: 0;
		transform: translate(-50%, -50%)
			translate(calc(var(--bx, 0px) + var(--bdx, 0px)), calc(var(--by, 0px) + var(--bdy, 0px)))
			rotate(calc(var(--ba, 0deg) + var(--bspin, 0deg)))
			scale(calc(var(--bs, 1) * .8));
	}
}

@media (prefers-reduced-motion: reduce) {
	.covr-bat--leader .covr-bat__img { animation: none; }
}

/* ===== Hover swap — show first item, reveal second on hover (2-item container) ===== */
.covr-swap-stage {
	position: relative;
}

.covr-swap-stage > .covr-swap-a,
.covr-swap-stage > .covr-swap-b {
	transition: opacity .7s ease;
}

.covr-swap-b {
	position: absolute;
	inset: 0;
	opacity: 0;
	pointer-events: none;
	display: flex;            /* center the 2nd item's content (e.g. text) in the box */
	align-items: center;
	justify-content: center;
}

.covr-swap-b,
.covr-swap-b img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.covr-hover-swap:hover .covr-swap-a,
.covr-hover-swap.is-swapped .covr-swap-a {
	opacity: 0;
}

.covr-hover-swap:hover .covr-swap-b,
.covr-hover-swap.is-swapped .covr-swap-b {
	opacity: 1;
}

.covr-hover-swap.is-swapped .covr-swap-b {
	pointer-events: auto;
}

/* only the first two items participate in the swap */
.covr-swap-stage > :nth-child(n+3) {
	display: none;
}

/* ===== Sticky header: its tall gradient must not intercept clicks ===== */
/* Anchored on the header group's class. The whole strip stops catching
   pointer events, while the actual menu controls keep working, so clicks in
   the empty gradient area fall through to the content below. */
[class*="header{z-index"] {
	pointer-events: none;
}

[class*="header{z-index"] a,
[class*="header{z-index"] button,
[class*="header{z-index"] input,
[class*="header{z-index"] label,
[class*="header{z-index"] .wp-block-search {
	pointer-events: auto;
}