/* Shared featured threads highlight mockup styles.
 *
 * Loaded only on Nova BB forum pages where featured threads are enabled.
 */

/* Styling Start */
.knewscommunity-eatery-highlight-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr); 
    grid-template-rows: 1fr 1fr; 
    gap: 15px;
    /* Define the specific areas to map the children to */
    grid-template-areas: 
        "featured default2 default3 default6"
        "featured default4 default5 default7";
}

/* --- Map the Articles to the Areas --- */

/* 1. Article 1 (Featured) - Stretches across both rows in Column 1 */
.knewscommunity-eatery-highlight-card:nth-child(1) {
	grid-area: featured;
}

.knewscommunity-eatery-highlight-card:nth-child(2) {
	grid-area: default2;
}
.knewscommunity-eatery-highlight-card:nth-child(4) {
	grid-area: default4;
}

.knewscommunity-eatery-highlight-card:nth-child(3) {
	grid-area: default3;
}
.knewscommunity-eatery-highlight-card:nth-child(5) {
	grid-area: default5;
}

.knewscommunity-eatery-highlight-card:nth-child(6) {
	grid-area: default6;
}
.knewscommunity-eatery-highlight-card:nth-child(7) {
	grid-area: default7;
}

/* --- Styling for all Cards to ensure perfect alignment --- */
.knewscommunity-eatery-highlight-card {
    height: 100%;
    display: flex;
    /*flex-direction: column;*/
    overflow: hidden;
}

/* Ensure the Featured Thumb is larger */
.knewscommunity-eatery-highlight-card.is-featured .knewscommunity-eatery-highlight-thumb-featured.thumb-1 {
    height: 150px!important; /* Example height for featured large image */
	width: 100%!important;
	border-radius: 10px;
	margin-bottom: 0.25rem;
}

.knewscommunity-eatery-highlight-card.default-card {
    display: flex!important;
    align-items: stretch;     /* Forces children (image & text) to be same height */
    gap: 0.5rem!important;                /* Space between image and text */
    overflow: hidden;
    height: 140px;            /* Set a fixed height for the card */
}

.knewscommunity-eatery-highlight-thumb {
    width: 115px;             /* Fixed width for the image */
    height: auto;             /* Let 'align-items: stretch' handle the height */
    flex-shrink: 0;           /* Prevents the image from squashing */
    background-size: cover;
    background-position: center;
}

.knewscommunity-eatery-highlight-card-content {
    flex: 1;                  /* Takes up all remaining width */
    display: flex;
    flex-direction: column;   /* Stacks title and copy vertically */
    margin-top: 5px;
    min-width: 0;             /* Required if you want to use text-ellipsis later */
}

/* Reset margins so text stays tight */
.knewscommunity-eatery-highlight-card-title,
.knewscommunity-eatery-highlight-card-copy {
    margin: 0;
}
article.knewscommunity-eatery-highlight-card.is-featured .knewscommunity-eatery-highlight-card-title {
	margin-bottom: 0.2rem!important;
}

/* Styling End */


.knewscommunity-novabb-featured-threads .knewscommunity-novabb-featured-threads-title {
	margin: 0;
	font-size: clamp(1.45rem, 2.2vw, 2rem);
	line-height: 1.15;
	font-weight: 800;
	letter-spacing: -0.01em;
}

/* Eatery highlight mockup */
.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-mockup {
	display: grid;
	gap: 0.7rem;
}

.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-heading-accent {
	color: #ef4444;
}

.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-tabs {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.4rem;
	padding: 0.15rem 0 0.55rem;
	border-bottom: 1px solid #d1d5db;
}

.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-tab {
	border: 0;
	border-radius: 0;
	background: transparent;
	color: #111827;
	font-size: 0.8rem;
	font-weight: 700;
	line-height: 1;
	padding: 0.38rem 0.7rem;
	cursor: default;
}

.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-tab + .knewscommunity-eatery-highlight-tab {
	position: relative;
}

.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-tab + .knewscommunity-eatery-highlight-tab::before {
	content: "";
	position: absolute;
	left: -0.22rem;
	top: 50%;
	width: 1px;
	height: 0.62rem;
	transform: translateY(-50%);
	background: #9ca3af;
}

.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-tab.is-active {
	background: #ef4444;
	color: #fff;
	border-radius: 2px;
}

.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-tab.is-active::before {
	display: none;
}

.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-cards {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0.4rem;
}

.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-card {
	display: grid;
	grid-template-rows: auto auto 1fr auto;
	gap: 0.35rem;
	padding: 0.25rem 0.32rem 0.3rem;
	background: #fff;
	border: 1px solid #e5e7eb;
}

.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-card.is-featured {
	background: #ffd84d;
	border-color: #f1c33a;
	height: 100%;
	border-radius: 15px;
	background-size: cover;
	background-position: center;
	padding: 0.4rem 0.5rem;
}

.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-thumb {
	height: 100%;
	background-size: cover;
	background-position: center;
}

.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-thumb-featured.thumb-1 {
	background-image: linear-gradient(145deg, #a16207, #dc2626 48%, #111827);
}

.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-thumb.thumb-2 {
	background-image: linear-gradient(145deg, #92400e, #f59e0b 42%, #111827);
}

.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-thumb.thumb-3 {
	background-image: linear-gradient(145deg, #7c2d12, #fb923c 52%, #111827);
}

.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-thumb.thumb-4 {
	background-image: linear-gradient(145deg, #b91c1c, #fbbf24 50%, #111827);
}

.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-thumb.thumb-5 {
	background-image: linear-gradient(145deg, #1d4ed8, #93c5fd 46%, #111827);
}
.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-thumb.thumb-6 {
	background-image: linear-gradient(145deg, #92400e, #f59e0b 42%, #111827);
}

.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-thumb.thumb-7 {
	background-image: linear-gradient(145deg, #a16207, #dc2626 48%, #111827);
}

.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-card-title {
	margin-bottom: 0.5rem;
	font-size: 0.97rem;
	font-weight: 800;
	line-height: 1.2;
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
	word-break: keep-all;
}

.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-card-copy {
	margin: 0;
	font-size: 0.84rem;
	line-height: 1.25;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
	line-clamp: 4;
	overflow: hidden;
    word-break: keep-all;
}

.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-card-meta {
	margin: 0;
	display: inline-flex;
	justify-self: end;
	align-items: center;
	gap: 0.32rem;
}

.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-chip {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.2rem;
	height: 1.2rem;
	padding: 0 0.28rem;
	background: rgba(255, 255, 255, 0.88);
	border: 1px solid rgba(17, 24, 39, 0.2);
	border-radius: 999px;
	font-size: 0.72rem;
	font-weight: 700;
}


@media (max-width: 1199px) {
	
}

@media (max-width: 767px) {
	.knewscommunity-novabb-layout-eatery .knewscommunity-eatery-highlight-cards {
		grid-template-columns: repeat(1, minmax(0, 1fr));
	}
}

/* Attraction highlight mockup */
.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-mockup {
	display: grid;
	gap: 0.72rem;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-heading-accent {
	color: #ef4444;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-tabs {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.42rem;
	padding: 0.14rem 0 0.55rem;
	border-bottom: 1px solid #d1d5db;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-tab {
	border: 0;
	border-radius: 0;
	background: transparent;
	color: #111827;
	font-size: 0.8rem;
	font-weight: 700;
	line-height: 1;
	padding: 0.38rem 0.74rem;
	cursor: default;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-tab + .knewscommunity-attraction-highlight-tab {
	position: relative;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-tab + .knewscommunity-attraction-highlight-tab::before {
	content: "";
	position: absolute;
	left: -0.24rem;
	top: 50%;
	width: 1px;
	height: 0.62rem;
	transform: translateY(-50%);
	background: #9ca3af;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-tab.is-active {
	background: #ef4444;
	color: #fff;
	border-radius: 2px;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-tab.is-active::before {
	display: none;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-cards {
	display: grid;
	grid-template-columns: minmax(248px, 1.25fr) repeat(3, minmax(0, 1fr));
	grid-auto-rows: 1fr;
	gap: 0.42rem;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-card {
	background: #fff;
	border: 1px solid #e5e7eb;
	padding: 0.2rem 0.28rem 0.24rem;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-card.is-featured {
	display: grid;
	grid-template-rows: auto auto 1fr auto;
	gap: 0.35rem;
	grid-row: span 2;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-card:not(.is-featured) {
	display: grid;
	grid-template-columns: 108px 1fr;
	grid-template-rows: auto 1fr;
	gap: 0.28rem 0.5rem;
	align-content: start;
	min-height: 117px;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-card:not(.is-featured) .knewscommunity-attraction-highlight-thumb {
	grid-column: 1 / 2;
	grid-row: 1 / 3;
	height: 100%;
	min-height: 100px;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-card:not(.is-featured) .knewscommunity-attraction-highlight-card-title,
.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-card:not(.is-featured) .knewscommunity-attraction-highlight-card-copy {
	grid-column: 2 / 3;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-thumb {
	border-radius: 2px;
	background-size: cover;
	background-position: center;
	height: 86px;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-card.is-featured .knewscommunity-attraction-highlight-thumb {
	height: 130px;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-thumb.thumb-1 {
	background-image: linear-gradient(145deg, #1e3a8a, #60a5fa 52%, #111827);
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-thumb.thumb-2 {
	background-image: linear-gradient(145deg, #0f766e, #99f6e4 52%, #1f2937);
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-thumb.thumb-3 {
	background-image: linear-gradient(145deg, #1d4ed8, #93c5fd 48%, #111827);
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-thumb.thumb-4 {
	background-image: linear-gradient(145deg, #0ea5e9, #bae6fd 52%, #111827);
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-thumb.thumb-5 {
	background-image: linear-gradient(145deg, #b91c1c, #fca5a5 52%, #1f2937);
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-thumb.thumb-6 {
	background-image: linear-gradient(145deg, #1e40af, #93c5fd 52%, #111827);
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-thumb.thumb-7 {
	background-image: linear-gradient(145deg, #334155, #cbd5e1 52%, #111827);
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-card-title {
	margin: 0;
	font-size: 0.95rem;
	font-weight: 800;
	line-height: 1.16;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-card-copy {
	margin: 0;
	font-size: 0.84rem;
	line-height: 1.22;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	overflow: hidden;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-card:not(.is-featured) .knewscommunity-attraction-highlight-card-copy {
	-webkit-line-clamp: 4;
	line-clamp: 4;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-card-meta {
	margin: 0;
	display: inline-flex;
	align-items: center;
	justify-self: end;
	gap: 0.3rem;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-chip {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.2rem;
	height: 1.2rem;
	background: rgba(255, 255, 255, 0.9);
	border: 1px solid rgba(17, 24, 39, 0.24);
	border-radius: 999px;
	font-size: 0.72rem;
	font-weight: 700;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-badge-new {
	display: inline-block;
	margin-left: 0.28rem;
	color: #ef4444;
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.02em;
}

.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-badge-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.12rem;
	height: 0.98rem;
	margin-left: 0.2rem;
	padding: 0 0.3rem;
	background: #60a5fa;
	color: #fff;
	border-radius: 999px;
	font-size: 0.67rem;
	font-weight: 700;
	line-height: 1;
}

@media (max-width: 1199px) {
	.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-cards {
		grid-template-columns: minmax(220px, 1.2fr) repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 900px) {
	.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-cards {
		grid-template-columns: repeat(1, minmax(0, 1fr));
	}

	.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-card.is-featured {
		grid-row: auto;
	}

	.knewscommunity-novabb-layout-attraction .knewscommunity-attraction-highlight-card:not(.is-featured) {
		grid-template-columns: 108px 1fr;
		min-height: 0;
	}
}