/**
 * Barra fissa mobile.
 *
 * È gestita dalle impostazioni del plugin, quindi il foglio viene caricato
 * su tutto il sito quando la barra è attiva, non dai singoli widget.
 */

/* ============================================================
   BARRA FISSA MOBILE
   ============================================================ */
.aa-wdm-mbar {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 9997;
	display: none;
	align-items: stretch;
	box-sizing: border-box;
	background: #2b2726;
	border-top: 1px solid rgba(255, 255, 255, .12);
}
.aa-wdm-mbar__item {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 3px;
	box-sizing: border-box;
	padding: 9px 4px;
	border: 0;
	background: transparent;
	color: #f3f1f0;
	font: inherit;
	font-size: 11px;
	text-decoration: none;
	cursor: pointer;
	min-width: 0;
}
.aa-wdm-mbar__icon {
	position: relative;
	display: inline-flex;
	width: 22px;
	height: 22px;
}
.aa-wdm-mbar__icon svg {
	width: 100%;
	height: 100%;
}
.aa-wdm-mbar__label {
	display: block;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.aa-wdm-mbar .aa-wdm-cart-toggle__count {
	position: absolute;
	top: -6px;
	right: -8px;
	min-width: 17px;
	height: 17px;
	padding: 0 4px;
	border-radius: 9999px;
	background: #b4553f;
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* tendina che si apre verso l'alto dalla barra */
.aa-wdm-mbar__dropdown {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 100%;
	max-height: 60vh;
	overflow-y: auto;
	box-sizing: border-box;
	padding: 8px;
	background: #2b2726;
	border-top: 1px solid rgba(255, 255, 255, .12);
}
.aa-wdm-mbar__dropdown[hidden] {
	display: none;
}
.aa-wdm-mbar__cat {
	display: block;
	box-sizing: border-box;
	padding: 12px 14px;
	border-radius: 8px;
	color: #f3f1f0;
	text-decoration: none;
}
.aa-wdm-mbar__cat:hover {
	background: rgba(255, 255, 255, .12);
}

/* quando la barra è attiva lascio spazio in fondo alla pagina */
body.aa-wdm-has-mbar {
	padding-bottom: 66px;
}


/* la barra è per i dispositivi mobili: sopra questa larghezza resta nascosta */
@media (min-width: 1025px) {
	.aa-wdm-mbar {
		display: none !important;
	}
	body.aa-wdm-has-mbar {
		padding-bottom: 0;
	}
}
@media (max-width: 1024px) {
	.aa-wdm-mbar {
		display: flex;
	}

	/* con la barra attiva il carrello diventa un cassetto a tutto schermo fino
	   alla stessa soglia della barra: prima questa regola la stampava il widget
	   in uno <style> inline, ora vive qui e arriva solo se la barra è accesa */
	.aa-wdm-cart[data-aa-wdm-cart] {
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		width: auto;
		max-width: none;
		padding: 0;
		z-index: 99999;
		visibility: hidden;
	}
	.aa-wdm-cart[data-aa-wdm-cart].is-open {
		visibility: visible;
	}
	.aa-wdm-cart[data-aa-wdm-cart] > .aa-wdm-cart__overlay {
		display: block;
		position: absolute;
		inset: 0;
	}
	.aa-wdm-cart[data-aa-wdm-cart] .aa-wdm-cart__panel {
		position: absolute;
		top: 0;
		right: 0;
		height: 100%;
		width: 90%;
		max-width: 380px;
		margin: 0;
		border-radius: 0;
		transform: translateX(100%);
		transition: transform .28s ease;
		display: flex;
		flex-direction: column;
		overflow: hidden;
	}
	.aa-wdm-cart[data-aa-wdm-cart].is-open .aa-wdm-cart__panel {
		transform: translateX(0);
	}
	.aa-wdm-cart[data-aa-wdm-cart] .aa-wdm-cart__close {
		display: inline-flex;
	}
	body.aa-wdm-has-mbar-cart .aa-wdm-cart-toggle {
		display: none;
	}
}
