/* ==========================================================================
   Espositori 2026 (page-templates/page-espositori2026.php) — 2026-09-28
   --------------------------------------------------------------------------
   The page chrome around the plugin's [wh_exhibitors] catalogue: the hero
   additions, the award sidebar with its tier filters, the outer catalogue
   skin (regions, the two-column card grid, the cards) and the filter-row
   polish. The rules moved here verbatim from the <style> block the template
   used to print AFTER the catalogue — behind some 5 MB of cards, so every
   load painted the sidebar's award badges at their natural size (773 and
   2000 px) and the catalogue in one column until the very end of the page
   had arrived (owner, 2026-09-28).

   Loaded in the <head> by functions.php mwf_enqueue_espositori_assets(),
   after /custom-css/mwf.css and after the plugin's own stylesheet
   (`wh-exhibitors`, a dependency), so these rules still layer OVER the
   plugin's exactly as they did from the end of the page. Measured on the
   live page before the move: the new order changes no computed style
   (51,156 elements, 147 cards opened, pseudo-elements, hover rules; at 375,
   1024 and 1440 px).

   Never redefines the product-row contract (one product per row, fixed
   award slot, tier order) — those rules are plugin-owned. /custom-css/mwf.css
   is read-only; the .mwfe hero classes come from there untouched.
   ========================================================================== */

.mwf-esp26 { background: #fdfbf6; }

/* ---- hero additions (inside the .mwfe scope) ---- */
.esp26-hero .mwfe-hero--slim { min-height: 54vh; }
/* The design system scales the hero media (parallax); at very wide viewports
   the overhang escaped and produced a 10px horizontal scroll — clip it here
   (mwf.css itself is read-only). */
.esp26-hero .mwfe-hero,
.esp26-hero .mwfe-hero-media { overflow: hidden; }
.esp26-stats {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 34px;
	list-style: none;
	margin: 26px 0 0;
	padding: 18px 0 0;
	border-top: 1px solid rgba(205, 173, 89, .35);
}
.esp26-stats li { display: flex; flex-direction: column; }
.esp26-stats strong {
	font-size: 1.7rem;
	line-height: 1.1;
	color: #cdad59;
	font-variant-numeric: tabular-nums;
}
.esp26-stats span {
	font-size: .72rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	opacity: .8;
}

/* ---- body frame: wide, with the award sidebar on large screens ---- */
.esp26-body {
	max-width: 1680px;
	margin: 0 auto;
	padding: 34px 24px 90px;
	font-family: 'Libre Baskerville', Baskerville, 'Times New Roman', serif;
	color: #2a1d10;
}
.esp26-layout { display: block; }
@media (min-width: 1100px) {
	.esp26-layout {
		display: grid;
		grid-template-columns: 264px minmax(0, 1fr);
		gap: 30px;
		align-items: start;
	}
	.esp26-side {
		position: sticky;
		top: calc(14vh + 14px); /* the site header is sticky at 14vh */
	}
}

/* ---- award sidebar ---- */
.esp26-legend {
	border: 1px solid rgba(205, 173, 89, .55);
	background: #fff;
	border-radius: 14px;
	padding: 18px 18px 16px;
	box-shadow: 0 8px 26px rgba(74, 22, 29, .05);
	margin: 0 0 18px;
}
.esp26-legend h2 {
	margin: 0 0 12px;
	font-size: .98rem;
	letter-spacing: .04em;
	color: #4b1221;
}
.esp26-tiers { display: flex; flex-direction: column; gap: 8px; }
.esp26-tier {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 8px 10px;
	font: inherit;
	font-size: .9rem;
	color: #2a1d10;
	background: #fff;
	border: 1px solid rgba(75, 18, 33, .3);
	border-radius: 10px;
	cursor: pointer;
	text-align: left;
	transition: background .2s, border-color .2s, box-shadow .2s;
}
.esp26-tier:hover { background: #faf4e6; border-color: #4b1221; }
.esp26-tier[aria-pressed="true"] {
	background: #4b1221;
	color: #fff;
	border-color: #cdad59;
	box-shadow: 0 3px 14px rgba(75, 18, 33, .35);
}
.esp26-tier img { width: 30px; height: 30px; object-fit: contain; flex: 0 0 30px; }
.esp26-tier[aria-pressed="true"] img { filter: drop-shadow(0 0 1px rgba(255,255,255,.6)); }
.esp26-tier-label { flex: 1 1 auto; min-width: 0; }
.esp26-tier-count {
	flex: 0 0 auto;
	font-size: .74rem;
	padding: 2px 8px;
	border-radius: 999px;
	background: rgba(205, 173, 89, .22);
	color: #7a6645;
	font-variant-numeric: tabular-nums;
}
.esp26-tier[aria-pressed="true"] .esp26-tier-count { background: rgba(205, 173, 89, .9); color: #35141a; }
.esp26-tier-clear {
	margin-top: 2px;
	padding: 7px 10px;
	font: inherit;
	font-size: .8rem;
	color: #7a6645;
	background: transparent;
	border: 1px dashed rgba(122, 102, 69, .5);
	border-radius: 10px;
	cursor: pointer;
}
.esp26-tier-clear:hover { color: #4b1221; border-color: #4b1221; }
.esp26-legend-note {
	margin: 14px 0 0;
	font-size: .8rem;
	line-height: 1.5;
	color: #7a6645;
	font-style: italic;
}
.esp26-award-line { margin: 10px 0 0; font-size: .8rem; color: #7a6645; }
.esp26-award-line a { color: #8c6d1f; }

/* mid/small screens: sidebar becomes a horizontal strip above the list */
@media (max-width: 1099px) {
	.esp26-tiers { flex-direction: row; flex-wrap: wrap; }
	.esp26-tier { width: auto; }
}

/* ---- tier filtering (composes with the plugin's own filters: the plugin
        keeps its inline display logic; these classes only ever REMOVE) ---- */
.mwf-esp26 .esp26-tier-on .acc-item.esp26-tier-hide { display: none !important; }
.mwf-esp26 .esp26-tier-on .wh-region.esp26-region-empty { display: none !important; }

/* ---- filter layer polish (plugin markup kept verbatim) ---- */
.mwf-esp26 .wh-exhibitors--v2 .tab-headers { width: 100%; margin-top: 4px; }
.mwf-esp26 .wh-exhibitors--v2 .tab-headers .tab {
	border-color: rgba(75, 18, 33, .45);
	background: #fff;
	transition: background .2s, border-color .2s, box-shadow .2s;
	font-size: .92rem;
}
.mwf-esp26 .wh-exhibitors--v2 .tab-headers .tab:hover {
	background: #faf4e6;
	border-color: #4b1221;
	box-shadow: 0 2px 10px rgba(74, 22, 29, .12);
}
.mwf-esp26 .wh-exhibitors--v2 .tab-headers .tab.active {
	border-color: #cdad59;
	box-shadow: 0 3px 14px rgba(205, 173, 89, .35);
	color: #e77f00;
}
.mwf-esp26 .wh-exhibitors--v2 .wh-filter-actions {
	position: sticky;
	top: 14vh; /* under the sticky site header (z-index 30) */
	z-index: 20;
	background: rgba(253, 251, 246, .94);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	padding: 10px 0;
	margin: 10px 0 16px;
	box-shadow: 0 10px 18px -14px rgba(42, 29, 16, .35);
}
.mwf-esp26 .wh-exhibitors--v2 #searchInput,
.mwf-esp26 .wh-exhibitors--v2 #regionSelect {
	border-radius: 10px;
	border-color: rgba(205, 173, 89, .8);
	background: #fff;
	font-family: inherit;
}
.mwf-esp26 .wh-exhibitors--v2 #searchInput:focus,
.mwf-esp26 .wh-exhibitors--v2 #regionSelect:focus {
	outline: 2px solid #cdad59;
	outline-offset: 1px;
}

/* The plugin's "Ordina per numero di tavolo" switch is HIDDEN on this page
   (owner, 2026-09-27: "does not work at all — hide or fix"). It did sort,
   but into one list of every producer while table numbers restart in each
   sezione (three different "table 1" in three rooms), and a closed card
   never shows its number, so the result read as a random shuffle. The
   search box still finds a table number or a room, and each card and
   producer page names its table per sezione. Bring it back by deleting
   this rule, once the sort runs per sezione and prints the number on the
   closed card. */
.mwf-esp26 .wh-tavolo-switch { display: none !important; }

/* ---- regions + accordions ---- */
.mwf-esp26 .wh-region { display: block; }
.mwf-esp26 .wh-region-title {
	margin: 0;
	padding: 30px 0 4px;
	font-size: 1.7rem;
	font-weight: 700;
	color: #4b1221;
	letter-spacing: .01em;
}
.mwf-esp26 .wh-region-title::after {
	content: "";
	display: block;
	width: 64px;
	height: 3px;
	margin-top: 8px;
	background: linear-gradient(90deg, #cdad59, rgba(205, 173, 89, 0));
	border-radius: 2px;
}
/* Producers flow in COLUMNS on wide screens (the one-per-row rule is about
   PRODUCTS inside a card, never about producers). align-items:start keeps
   an opened card from stretching its neighbours. */
.mwf-esp26 .wh-region-list {
	display: grid;
	grid-template-columns: 1fr;
	gap: .55rem;
	align-items: start;
	margin-top: .6rem;
}
/* Two columns MAX (owner, 2026-08-27): three squeezed product names even
   on a 2550px screen — width goes to the products instead. */
@media (min-width: 1100px) {
	.mwf-esp26 .wh-region-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
}

.mwf-esp26 .acc-item {
	border: 1px solid rgba(205, 173, 89, .55);
	border-radius: 12px;
	background: #fff;
	overflow: hidden;
	transition: box-shadow .2s, border-color .2s;
}
.mwf-esp26 .acc-item:hover {
	border-color: #cdad59;
	box-shadow: 0 10px 26px rgba(74, 22, 29, .08);
}
.mwf-esp26 .acc-item[open] {
	border-color: #cdad59;
	box-shadow: 0 14px 34px rgba(74, 22, 29, .10);
}
.mwf-esp26 .acc-summary {
	display: flex;
	align-items: center;
	gap: .75rem;
	padding: .5rem 1.05rem;
	/* Uniform CLOSED-tile height (owner, 2026-08-27): every summary row is
	   the same height whether the producer name takes one line or two;
	   names beyond two lines clamp with an ellipsis (full name inside). */
	min-height: 76px; /* fits a two-line clamped name — 1-line and 2-line tiles render identical */
	box-sizing: border-box;
	cursor: pointer;
	list-style: none;
}
.mwf-esp26 .acc-summary::-webkit-details-marker { display: none; }
.mwf-esp26 .acc-summary::before {
	content: "";
	flex: 0 0 9px;
	width: 9px;
	height: 9px;
	border-right: 2px solid #4b1221;
	border-bottom: 2px solid #4b1221;
	transform: rotate(-45deg);
	transition: transform .2s;
	margin-right: 2px;
}
.mwf-esp26 .acc-item[open] > .acc-summary::before { transform: rotate(45deg); }
.mwf-esp26 .acc-name {
	font-weight: 700;
	font-size: 1.02rem;
	color: #2a1d10;
	line-height: 1.25;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.mwf-esp26 .acc-item[open] > .acc-summary { border-bottom: 1px solid rgba(205, 173, 89, .45); }
.mwf-esp26 .acc-left { display: flex; align-items: center; min-width: 0; }
.mwf-esp26 .acc-right.badges { margin-left: auto; display: flex; align-items: center; flex: 0 0 auto; }
.mwf-esp26 .acc-content { padding: .55rem 1.05rem 1rem; }

/* producer header inside the card */
.mwf-esp26 .wh-exh-producer { display: flex; gap: 14px; align-items: flex-start; padding: 6px 0 4px; }
.mwf-esp26 .wh-exh-producer__logo { width: 74px; height: 74px; object-fit: contain; flex: 0 0 auto; }
.mwf-esp26 .wh-exh-producer__name { font-weight: 700; font-size: 1.05rem; color: #4b1221; }
.mwf-esp26 .wh-exh-producer__region { font-size: .82rem; color: #7a6645; margin-top: 1px; }
.mwf-esp26 .wh-exh-producer__facts { display: flex; flex-wrap: wrap; gap: 4px 22px; margin: 8px 0 0; }
.mwf-esp26 .wh-exh-producer__facts > div { display: flex; gap: 6px; font-size: .84rem; }
.mwf-esp26 .wh-exh-producer__facts dt { font-weight: 700; color: #7a6645; }
.mwf-esp26 .wh-exh-producer__facts dt::after { content: ":"; }
.mwf-esp26 .wh-exh-producer__facts dd { margin: 0; }
.mwf-esp26 .wh-exh-producer__facts a { color: #8c6d1f; }

/* no-results notice */
.mwf-esp26 #whNoResults { padding: 26px 6px; font-style: italic; color: #7a6645; }

@media (max-width: 720px) {
	.esp26-hero .mwfe-hero--slim { min-height: 46vh; }
	.esp26-stats { gap: 10px 22px; }
	.esp26-stats strong { font-size: 1.35rem; }
	.esp26-body { padding: 22px 12px 70px; }
	.mwf-esp26 .wh-exh-producer__logo { width: 56px; height: 56px; }
	.mwf-esp26 .wh-region-title { font-size: 1.4rem; }
}
