/* The producer pages' phone bar on the digital catalogue (owner, 2026-10-29)
   — inc/mwf-catalogo-bar.php. The bar's look is the plugin's own
   (wh-exhibitors assets/producer.css, loaded before this file); here only what
   the catalogue needs besides: the plugin's colour words (the producer page
   sets them on its <main class="whp">), phones only, the page's foot clear of
   the bar, the catalogue's own fixed things above it, and the notebook's
   number badge (css/mwf-notebook.css carries it on the producer page, which
   the catalogue does not load). */

.whp-bar.mwfc-whpbar {
	--whp-deep: #28191b;
	--whp-gold: #cdad59;
	--whp-gold-dark: #8c6d1f;
	--whp-cream: #f4efe4;
	--whp-sans: 'Raleway', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* the notebook's number on «Taccuino» (as css/mwf-notebook.css draws it) */
.mwfc-whpbar .whp-bar-btn.mwfn-bar { position: relative; }
.mwfc-whpbar .whp-bar-btn.mwfn-bar .mwfn-bar-n {
	position: absolute;
	top: 5px;
	right: calc(50% - 25px);
	min-width: 20px;
	height: 20px;
	padding: 0 5px;
	border-radius: 10px;
	background: var(--whp-gold, #cdad59);
	box-shadow: 0 0 0 2px rgba(32, 19, 22, .92);
	font: 700 .68rem/20px var(--whp-sans, sans-serif);
	text-align: center;
	color: var(--whp-deep, #28191b);
	overflow: visible;
}
.mwfc-whpbar .whp-bar-btn.mwfn-bar .mwfn-bar-n[hidden] { display: none; }

@media (min-width: 900px) {
	/* the producer page shows its bar as a row under the hero; the catalogue has none */
	.whp-bar.mwfc-whpbar { display: none; }
}

@media (max-width: 899px) {
	/* the bar covers nothing: the page ends above it (the producer page's own room) */
	body.mwfc-has-bar { padding-bottom: calc(78px + env(safe-area-inset-bottom, 0px)); }
	/* the room's (or the event's) card rests on the bar */
	body.mwfc-has-bar .mwfc-cards { bottom: calc(78px + .7rem + env(safe-area-inset-bottom, 0px)); }
	/* the bar's «Piantina» does what the floating «↑ Piantina» did */
	body.mwfc-has-bar .mwfc .mwfc-fab { display: none !important; }
}
