/*
Theme Name: ArcHub Child
Theme URI: https://archub.liquid-themes.com/
Description: Child theme for ArcHub. Safe place for custom CSS and PHP overrides.
Author: Your Team
Author URI: https://example.com/
Template: archub
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
Text Domain: archub-child
*/

/*
 * Add custom CSS below this line.
 */

/*
 * Portfolio tile micro-slideshow (style 01): extra images crossfade over
 * the featured image. Slides are rendered by the child template
 * (templates/portfolio/tmpl-style01.php) and driven by
 * assets/js/portfolio-tile-slideshow.js.
 */
.archub-child-pf-slideshow {
	position: relative;
	overflow: hidden;
}

.archub-child-pf-slideshow .archub-child-pf-slide {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: left bottom;
	opacity: 0;
	transition: opacity 0.6s ease;
	pointer-events: none;
}

.archub-child-pf-slideshow .archub-child-pf-slide.is-active {
	opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
	.archub-child-pf-slideshow .archub-child-pf-slide {
		transition: none;
	}
}

/*
 * Portfolio list style 01: disable image zoom on hover.
 * Source: archub-elementor-addons portfolio-image.css
 * (.lqd-pf-item:hover .lqd-pf-img>figure { transform: scale(1.05) }).
 * That file is lazy-loaded AFTER this stylesheet, so !important is required.
 */
.lqd-pf-item-style-1:hover .lqd-pf-img > figure {
	transform: none !important;
}

/*
 * ArcHub portfolio grid: unify thumbnail heights in filterable galleries.
 * Works for masonry/packery listings used by the portfolio widget.
 */
.elementor-widget-ld_portfolio .lqd-pf-grid .lqd-pf-row > .masonry-item .lqd-pf-img {
	aspect-ratio: 4 / 3;
	position: relative;
	overflow: hidden;
}

.elementor-widget-ld_portfolio .lqd-pf-grid .lqd-pf-row > .masonry-item .lqd-pf-img > figure,
.elementor-widget-ld_portfolio .lqd-pf-grid .lqd-pf-row > .masonry-item .lqd-pf-img > figure > figure {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
}

.elementor-widget-ld_portfolio .lqd-pf-grid .lqd-pf-row > .masonry-item .lqd-pf-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: left bottom;
	display: block;
}

/*
 * Elementor image gallery: unify tile heights at the 1520x1280 look.
 *
 * liquid-portfolio-big-sq is registered 1520x1280 hard-cropped
 * (archub/liquid/liquid-media.php), but WordPress never upscales, so the
 * cropped file only exists for originals at least 1520 wide AND 1280 tall. A
 * photo uploaded as a 1600px web export (e.g. 1600x1067) gets no crop at all,
 * WordPress falls back to the closest existing size, and that tile renders at
 * the source aspect ratio - which is what broke the rows on /zabudowy-meblowe/
 * (11 of its 34 photos).
 *
 * The `large` size is listed too, because the tiles render at ~457px and the
 * 1520px files are roughly twice the bytes they need. Switching the widget to
 * Large halves the page weight, and this rule keeps the layout identical: the
 * 1024x683 file is 3:2, so the browser crops it back to the same 1.1875 tile.
 *
 * Both sizes therefore look the same; only the bytes differ.
 */
.gallery.gallery-size-liquid-portfolio-big-sq .gallery-icon img,
.gallery.gallery-size-large .gallery-icon img {
	aspect-ratio: 1520 / 1280;
	object-fit: cover;
	width: 100%;
	height: auto;
}

/*
 * Mini logo watermark on gallery photos.
 *
 * Drawn as a ::after layer over each photo, so nothing is baked into the image
 * files: one 9 KB logo is fetched once and reused by every photo on the site.
 * No re-upload, no regenerated thumbnails, and it applies to photos added later.
 *
 * The logo path is root-relative on purpose - a url() in this file would
 * otherwise resolve against the theme directory, not the uploads folder.
 *
 * Tune it by overriding the three variables on :root; --dw-watermark-h is the
 * logo height and the width follows from the logo's own 1093x1291 ratio.
 * The drop-shadow is what keeps the white mark readable on the bright walls
 * that most of these interior photos are full of; without it, it disappears.
 */
:root {
	--dw-watermark: url("/wp-content/uploads/2022/02/logo-white.webp");
	--dw-watermark-h: 38px;
	--dw-watermark-opacity: 0.72;
}

.gallery-item .gallery-icon,
.wp-block-gallery.stabilizer-gallery-smart > figure.wp-block-image {
	position: relative;
}

.gallery-item .gallery-icon::after,
.wp-block-gallery.stabilizer-gallery-smart > figure.wp-block-image::after {
	content: "";
	position: absolute;
	right: 14px;
	bottom: 14px;
	width: calc(var(--dw-watermark-h) * 0.847);
	height: var(--dw-watermark-h);
	background: var(--dw-watermark) center / contain no-repeat;
	opacity: var(--dw-watermark-opacity);
	filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.45));
	/* The whole tile is a lightbox trigger - never swallow the click. */
	pointer-events: none;
	z-index: 2;
}

/* A caption sits below the photo, so lift the mark clear of it. */
.wp-block-gallery.stabilizer-gallery-smart > figure.wp-block-image:has(> figcaption)::after {
	bottom: 2.4em;
}

@media (max-width: 767px) {
	:root {
		--dw-watermark-h: 26px;
	}

	.gallery-item .gallery-icon::after,
	.wp-block-gallery.stabilizer-gallery-smart > figure.wp-block-image::after {
		right: 9px;
		bottom: 9px;
	}
}

.main-header a:active,
.main-header a:focus {
    outline: none !important;
    box-shadow: none !important;
}

.main-header a {
    -webkit-tap-highlight-color: transparent;
}