/*
 * Static featured overrides for homepage.
 * Flex grid: 2 columns on desktop (hero left, 3 cards right), single column on mobile.
 * Completely replaces the Slick carousel float/table-cell layout.
 * All rules scoped by body.apb-static-featured-enabled to avoid impacting other pages.
 *
 * Overrides from style.css:
 *   L430  .posts-listing-2-cols { display:inline-block; font-size:0 }
 *   L441  .posts-listing-2-cols div.top-featured { float:left; display:table-cell; width:50% }
 *   L1332 #featured-slides { max-width:calc((100vw - 460px)/2) }
 *   L2070 .top-featured-right { display:table-cell; width:initial; padding:0 0 0 10px }
 *   L126  #featured-slides-vertical > article:first-child { display:none }
 */

/* ============================================================
   OUTER GRID: 2-column flex container
   ============================================================ */

body.apb-static-featured-enabled #featured-block.posts-listing-2-cols {
	display: flex !important;
	flex-direction: row !important;
	align-items: stretch !important;
	width: 100% !important;
	font-size: initial !important;
	box-sizing: border-box;
}

/* ============================================================
   LEFT COLUMN: hero post
   ============================================================ */

body.apb-static-featured-enabled #featured-block .top-featured-left {
	flex: 0 0 50%;
	width: 50% !important;
	float: none !important;
	display: flex !important;
	flex-direction: column;
	box-sizing: border-box;
}

/* #featured-slides fills the full height of the left column.
   Overrides style.css L1332: max-width:calc((100vw - 460px)/2) */
body.apb-static-featured-enabled #featured-block #featured-slides {
	flex: 1;
	display: flex !important;
	flex-direction: column;
	max-width: none !important;
	width: 100% !important;
}

/* Hero post wrapper div (the single child of #featured-slides) */
body.apb-static-featured-enabled #featured-block #featured-slides > div {
	display: flex !important;
	flex: 1;
	flex-direction: column;
}

/* Hero image link: sits at top, fills the column width */
body.apb-static-featured-enabled #featured-block #featured-slides > div > a.overlay {
	display: block !important;
	flex: 0 0 auto;
	position: relative;
	font-size: 0;
	line-height: 0;
}

body.apb-static-featured-enabled #featured-block #featured-slides > div > a.overlay img {
	display: block !important;
	width: 100% !important;
	height: auto !important;
	visibility: visible !important;
	opacity: 1 !important;
}

/* Hero meta / date */
body.apb-static-featured-enabled #featured-block #featured-slides > div > ul.entry-meta {
	padding: 8px 10px 5px !important;
	margin: 0 !important;
	font-size: 0.65rem;
	list-style: none;
}

body.apb-static-featured-enabled #featured-block #featured-slides > div > ul.entry-meta li {
	display: inline;
	margin-right: 5px;
}

body.apb-static-featured-enabled #featured-block #featured-slides > div > .info {
	padding: 0 10px 8px !important;
	margin: 10px 0 0 0 !important;
	font-size: 0.65rem;
	color: #666;
}

/* Hero title: match the 10px left padding of entry-meta and .info */
body.apb-static-featured-enabled #featured-block #featured-slides > div > header.entry-header {
	margin: 0 !important;
	padding: 5px 10px 0 10px !important;
}

body.apb-static-featured-enabled #featured-block #featured-slides > div > header.entry-header .entry-title {
	margin: 0 !important;
	padding: 0 !important;
}

/* ============================================================
   RIGHT COLUMN: 3 article cards stacked vertically
   Overrides style.css L2070: display:table-cell; padding:0 0 0 10px
   ============================================================ */

body.apb-static-featured-enabled #featured-block .top-featured-right {
	flex: 1;
	display: flex !important;
	flex-direction: column;
	padding: 0 0 0 10px !important;
	width: auto !important;
	box-sizing: border-box;
}

/* .wrap inner wrapper */
body.apb-static-featured-enabled #featured-block .top-featured-right .wrap {
	flex: 1;
	display: flex !important;
	flex-direction: column;
	padding: 0 !important;
	background: #fff;
}

/* #featured-slides-vertical: flex column container for the 3 cards */
body.apb-static-featured-enabled #featured-block #featured-slides-vertical {
	flex: 1;
	display: flex !important;
	flex-direction: column;
	overflow: visible !important;
	height: auto !important;
	padding: 0 !important;
}

/* ============================================================
   CARDS: flex rows (text left, image right)
   Replaces display:table/table-cell layout.
   Also overrides style.css L126: article:first-child { display:none }
   ============================================================ */

body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card {
	display: flex !important;
	flex-direction: row !important;
	flex: 1;
	min-height: 0;
	width: 100%;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	float: none !important;
	border-bottom: 1px solid #eee !important;
	box-sizing: border-box;
}

body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card:last-child {
	border-bottom: 0 !important;
}

/* Text column (meta, title, date) */
body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card__text {
	display: flex !important;
	flex-direction: column;
	flex: 1;
	min-width: 0;
	padding: 0 !important;
	margin: 0 !important;
}

/* Image column */
body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card__image {
	display: flex !important;
	flex-direction: column;
	flex: 0 0 50%;
	width: 50% !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* ============================================================
   CARD TYPOGRAPHY
   ============================================================ */

/* Metadata line */
body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card ul.entry-meta {
	display: block !important;
	margin: 0 !important;
	padding: 8px 10px 0 10px !important;
	font-size: 0.65rem;
	list-style: none;
}

body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card ul.entry-meta li {
	display: inline;
	margin-right: 5px;
}

/* Override theme global separator (style.css: ul.entry-meta li + li:before). */
body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card ul.entry-meta li + li:before {
	content: none !important;
	padding: 0 !important;
}

body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card ul.entry-meta li:after {
	content: " | ";
	margin-left: 5px;
}

body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card ul.entry-meta li:last-child:after {
	content: "";
}

/* Title: clamped to 4 lines max; flex: 1 fills remaining space so date always anchors to bottom */
body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card .entry-title {
	display: -webkit-box !important;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
	overflow: hidden;
	flex: 1;
	min-height: 0;
	color: #093850;
	font-size: clamp(1.0rem, 1.4vw, 1.25rem) !important;
	font-weight: 400;
	line-height: 1.3;
	margin: 5px 10px 0 10px !important;
	padding: 0 !important;
}

body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card .entry-title a,
body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card .entry-title button {
	color: #093850;
	text-decoration: none;
}

/* Date: margin-top: auto pushes it to the bottom of the flex column */
body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card .info {
	display: block !important;
	margin: 0 !important;
	margin-top: auto !important;
	padding: 5px 10px 8px 10px !important;
	font-size: 0.65rem;
	color: #666;
}

/* ============================================================
   CARD IMAGE
   ============================================================ */

body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card__image a.overlay {
	display: flex !important;
	flex: 1;
	position: relative;
	font-size: 0;
	line-height: 0;
}

body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card__image a.overlay img,
body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card__image .wp-post-image {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	flex: 1;
	min-height: 0;
	max-width: none !important;
	visibility: visible !important;
	opacity: 1 !important;
}

body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card .article-icon {
	display: block !important;
}

/* ============================================================
   MOBILE: single column stack at ≤740px
   ============================================================ */

@media (max-width: 740px) {
	/* Collapse 2 columns into a vertical stack */
	body.apb-static-featured-enabled #featured-block.posts-listing-2-cols {
		flex-direction: column !important;
		width: 100% !important;
	}

	body.apb-static-featured-enabled #featured-block .top-featured-left {
		flex: none;
		width: 100% !important;
	}

	body.apb-static-featured-enabled #featured-block .top-featured-right {
		flex: none;
		width: 100% !important;
		padding: 0 !important;
	}

	/* Cards: capped height on mobile, content clipped cleanly */
	body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card {
		flex: 0 0 auto;
		max-height: 250px;
		overflow: hidden;
		align-items: flex-start;
		border-bottom: 1px solid #eee !important;
	}

	body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card:last-child {
		border-bottom: 0 !important;
	}

	/* Narrower image column on small screens: stretch to full card height with cover crop. */
	body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card__image {
		display: flex !important;
		flex-direction: column;
		align-self: stretch;
		flex: 0 0 40%;
		width: 40% !important;
	}

	body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card__image a.overlay {
		display: flex !important;
		flex: 1;
		position: relative;
		font-size: 0;
		line-height: 0;
	}

	body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card ul.entry-meta {
		padding: 8px 8px 0 8px !important;
	}

	body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card .entry-title {
		-webkit-line-clamp: 3;
		flex: 0 0 auto;
		font-size: 0.9rem !important;
		margin: 5px 8px 0 8px !important;
	}

	body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card .info {
		padding: 5px 8px 8px 8px !important;
	}

	/* Images fill the full card height with cover crop */
	body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card__image a.overlay img,
	body.apb-static-featured-enabled #featured-block #featured-slides-vertical .apb-featured-card__image .wp-post-image {
		height: 100% !important;
		object-fit: cover !important;
		flex: 1;
		min-height: 0;
	}
}