/*
 Theme Name:   Woodmart Child
 Description:  Woodmart Child Theme
 Author:       XTemos
 Author URI:   http://xtemos.com
 Template:     woodmart
 Version:      1.0.0
 Text Domain:  woodmart
*/

/* ==========================================================================
   HOME HERO SLIDER (Gutenberg / WoodMart blocks)
   Mobile: show full landscape image + readable text + padded CTAs
   ========================================================================== */

/* --- Buttons: WoodMart large size only sets --btn-padding: 5px vertically --- */
.home .wp-block-wd-slider.wd-8a57848b .wp-block-wd-button.btn {
	--btn-padding: 14px 28px;
	--btn-height: auto;
	min-height: 48px;
	padding: 14px 28px !important;
	box-sizing: border-box;
	line-height: 1.25;
	white-space: nowrap;
}

.home .wp-block-wd-slider.wd-8a57848b .wp-block-wd-button.btn > span {
	display: inline-block;
	line-height: 1.25;
}

/* Desktop: taller hero so faces aren’t cropped by cover */
@media (min-width: 768px) {
	.home .wp-block-wd-slider.wd-8a57848b .wd-slide {
		min-height: 680px !important;
	}

	.home .wp-block-wd-slider.wd-8a57848b .wd-slide-bg img {
		object-fit: cover !important;
		object-position: center center !important;
	}
}

@media (min-width: 1200px) {
	.home .wp-block-wd-slider.wd-8a57848b .wd-slide {
		min-height: 720px !important;
	}
}

@media (max-width: 767px) {

	/* Stack CTAs — side-by-side pills crush horizontal + vertical padding */
	.home .wp-block-wd-slider.wd-8a57848b .wd-slide-container > .wp-block-wd-container.wd-dir-row,
	.home .wp-block-wd-slider.wd-8a57848b .wd-e4371188,
	.home .wp-block-wd-slider.wd-8a57848b .wd-e39fc6c7 {
		display: flex !important;
		flex-direction: column !important;
		align-items: stretch !important;
		gap: 12px !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	.home .wp-block-wd-slider.wd-8a57848b .wp-block-wd-button.btn {
		--btn-padding: 16px 24px;
		--wd-width: 100% !important;
		width: 100% !important;
		max-width: 100% !important;
		padding: 16px 24px !important;
		justify-content: center;
		text-align: center;
	}

	/*
	 * Layout option A (active): SPLIT — full landscape image on top,
	 * copy on a solid panel below. Only reliable way to show the entire
	 * 1366×768 frame on a portrait phone without letterboxing over text.
	 */
	.home .wp-block-wd-slider.wd-8a57848b .wd-slide {
		min-height: 0 !important;
		height: auto !important;
		aspect-ratio: auto !important;
		display: flex !important;
		flex-direction: column !important;
		justify-content: flex-start !important;
		padding: 0 !important;
		overflow: visible !important;
	}

	.home .wp-block-wd-slider.wd-8a57848b .wd-slide-bg.wd-fill {
		position: relative !important;
		inset: auto !important;
		order: -1;
		width: 100%;
		height: auto !important;
		aspect-ratio: 1366 / 768;
		flex: 0 0 auto;
	}

	.home .wp-block-wd-slider.wd-8a57848b .wd-slide-bg img {
		position: absolute;
		inset: 0;
		width: 100% !important;
		height: 100% !important;
		object-fit: contain !important;
		object-position: center center !important;
		background-color: #1a1a1a;
	}

	.home .wp-block-wd-slider.wd-8a57848b .wd-slide-container {
		position: relative !important;
		z-index: 2;
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
		padding: 28px 20px 40px !important;
		background-color: #f9f5f0;
		align-items: flex-start !important;
		justify-content: flex-start !important;
		row-gap: 14px !important;
		box-sizing: border-box;
	}

	/* Eyebrow */
	.home .wp-block-wd-slider.wd-8a57848b .wd-slide-container > .wp-block-wd-paragraph:first-child,
	.home .wp-block-wd-slider.wd-8a57848b .wd-a569b73f,
	.home .wp-block-wd-slider.wd-8a57848b .wd-5dfd15cf {
		color: #5c5c5c !important;
		font-size: 11px !important;
		letter-spacing: 0.08em;
		text-shadow: none !important;
	}

	/* Headline */
	.home .wp-block-wd-slider.wd-8a57848b .wd-1e892bac,
	.home .wp-block-wd-slider.wd-8a57848b .wd-e2094f32 {
		font-size: 32px !important;
		line-height: 1.15 !important;
		color: #1a1a1a !important;
		max-width: 100% !important;
		text-shadow: none !important;
	}

	/* Supporting copy (WoodMart title block used as body) */
	.home .wp-block-wd-slider.wd-8a57848b .wp-block-wd-title,
	.home .wp-block-wd-slider.wd-8a57848b .wd-66109132,
	.home .wp-block-wd-slider.wd-8a57848b .wd-5c3109a9 {
		font-size: 14px !important;
		line-height: 1.55 !important;
		color: #333 !important;
		max-width: 100% !important;
		text-shadow: none !important;
	}

	/* Hide slider arrows on the shorter split layout — dots remain */
	.home .wp-block-wd-slider.wd-8a57848b .wd-slider-arrows {
		display: none !important;
	}

	.home .wp-block-wd-slider.wd-8a57848b .wd-nav-pagin-wrap {
		bottom: 12px;
	}

	/* Kill leftover cover / background-image on the slider shell */
	.home .wp-block-wd-slider.wd-8a57848b {
		background-image: none !important;
		background-size: auto !important;
	}
}

/*
 * OPTIONAL LAYOUT B — uncomment and comment out Layout A block above
 * if client prefers a tall full-bleed crop (image will NOT be fully visible).
 *
 * @media (max-width: 767px) {
 *   .home .wp-block-wd-slider.wd-8a57848b .wd-slide {
 *     min-height: 70vh !important;
 *     padding: 32px 20px 48px !important;
 *   }
 *   .home .wp-block-wd-slider.wd-8a57848b .wd-slide-bg.wd-fill {
 *     position: absolute !important;
 *     inset: 0 !important;
 *   }
 *   .home .wp-block-wd-slider.wd-8a57848b .wd-slide-bg img {
 *     object-fit: cover !important;
 *     object-position: center right !important;
 *   }
 *   .home .wp-block-wd-slider.wd-8a57848b .wd-slide-container {
 *     background: transparent !important;
 *     padding: 0 !important;
 *   }
 *   .home .wp-block-wd-slider.wd-8a57848b .wd-slide-container::before {
 *     content: "";
 *     position: absolute;
 *     inset: -24px -16px;
 *     background: linear-gradient(
 *       180deg,
 *       rgba(249, 245, 240, 0.88) 0%,
 *       rgba(249, 245, 240, 0.72) 55%,
 *       rgba(249, 245, 240, 0.35) 100%
 *     );
 *     z-index: -1;
 *     border-radius: 0;
 *     pointer-events: none;
 *   }
 * }
 */

/* Featured images: both treatment + concern master layouts use the block
   default (height ~350px, object-fit: cover). Export assets at 1400×700 (2:1). */

/* ==========================================================================
   Promotion popup (Popup Builder #6960)
   Larger on desktop, no scroll/white frame, dark + blurred overlay
   ========================================================================== */

/* Dark + blur page behind promo (do NOT force opacity — breaks Magnific close) */
body.mfp-ready:has(.wd-mfp-popup-wrap-6960) .mfp-bg {
	background: rgba(0, 0, 0, 0.78) !important;
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}

/* Desktop: larger promo (portrait 4:5) */
body .wd-mfp-popup-wrap-6960 {
	--wd-popup-width: min(640px, calc(100vw - 48px));
}

@media (min-width: 1200px) {
	body .wd-mfp-popup-wrap-6960 {
		--wd-popup-width: min(720px, calc(100vw - 64px));
	}
}

@media (max-width: 767px) {
	body .wd-mfp-popup-wrap-6960 {
		--wd-popup-width: min(92vw, 420px);
	}
}

/* Kill white chrome / scroll from Magnific + WoodMart popup shell */
body .wd-mfp-popup-wrap-6960 .mfp-content,
body .wd-mfp-popup-wrap-6960 .wd-popup,
body #popup-6960.wd-popup {
	background: transparent !important;
	box-shadow: none !important;
	padding: 0 !important;
	margin: 0 auto !important;
	max-height: 92vh !important;
	overflow: hidden !important;
}

body .wd-mfp-popup-wrap-6960 .wd-popup.wd-scroll-content,
body #popup-6960.wd-scroll-content {
	overflow: hidden !important;
}

body .wd-mfp-popup-wrap-6960 .wd-popup .wd-popup-inner,
body #popup-6960 .wd-popup-inner {
	padding: 0 !important;
	margin: 0 !important;
	background: transparent !important;
	max-height: 92vh !important;
	overflow: hidden !important;
}

body #popup-6960 .wp-block-wd-image,
body #popup-6960 .wd-block-image,
body .wd-mfp-popup-wrap-6960 .wp-block-wd-image,
body .wd-mfp-popup-wrap-6960 .wd-block-image {
	margin: 0 !important;
	padding: 0 !important;
	line-height: 0 !important;
	background: transparent !important;
}

body #popup-6960 .wp-block-wd-image img,
body #popup-6960 .wd-block-image img,
body .wd-mfp-popup-wrap-6960 .wp-block-wd-image img,
body .wd-mfp-popup-wrap-6960 .wd-block-image img {
	display: block !important;
	width: 100% !important;
	height: auto !important;
	max-height: 92vh !important;
	object-fit: contain !important;
	margin: 0 !important;
	vertical-align: top;
}

