/*
 * Floating Multisite Menu — stile frontend
 * Pulsante scuro con accento oro/bronzo; pannello menu rosso brand (#ab1123),
 * sfondo pieno senza sfumature, angoli squadrati, testo bianco maiuscolo (Montserrat).
 */

.fmsm-container {
	position: fixed;
	z-index: 999999;
	--fmsm-color-primary: #1c1c1c;
	--fmsm-color-accent: #c9a24b;
	--fmsm-radius: 0;
	font-family: "Montserrat", Arial, Helvetica, sans-serif;
	line-height: 1.3;
}

/* Posizionamento orizzontale (con rispetto delle safe-area su dispositivi con notch). */
.fmsm-container.fmsm-h-left {
	left: calc(20px + env(safe-area-inset-left, 0px));
}
.fmsm-container.fmsm-h-right {
	right: calc(20px + env(safe-area-inset-right, 0px));
}

/* Posizionamento verticale. */
.fmsm-container.fmsm-v-top {
	top: calc(20px + env(safe-area-inset-top, 0px));
}
.fmsm-container.fmsm-v-middle {
	top: 50%;
	transform: translateY(-50%);
}
.fmsm-container.fmsm-v-bottom {
	bottom: calc(20px + env(safe-area-inset-bottom, 0px));
}
.fmsm-container.fmsm-v-custom {
	top: calc(var(--fmsm-offset, 50%) + env(safe-area-inset-top, 0px));
	transform: translateY(-50%);
}

/* Pulsante principale. */
.fmsm-toggle {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	min-width: 44px;
	min-height: 44px;
	padding: 0;
	margin: 0;
	border: 1px solid var(--fmsm-color-accent);
	border-radius: 50%;
	background-color: var(--fmsm-color-primary);
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
	transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.fmsm-toggle:hover {
	transform: translateY(-2px);
}

.fmsm-toggle:focus-visible {
	outline: 2px solid var(--fmsm-color-accent);
	outline-offset: 3px;
}

.fmsm-toggle .fmsm-hamburger-line {
	stroke: var(--fmsm-color-accent);
	transition: stroke 0.2s ease;
}

.fmsm-toggle img.fmsm-custom-icon {
	width: 26px;
	height: 26px;
	object-fit: contain;
	border-radius: 4px;
	pointer-events: none;
}

/* Menu a comparsa. */
.fmsm-menu {
	position: absolute;
	list-style: none;
	margin: 0;
	padding: 10px;
	min-width: 230px;
	max-width: calc(100vw - 32px);
	background-color: #ab1123;
	border: none;
	border-radius: var(--fmsm-radius);
	box-shadow: 0 16px 44px rgba(0, 0, 0, 0.5);
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px) scale(0.97);
	transition:
		opacity 0.26s cubic-bezier(0.16, 1, 0.3, 1),
		transform 0.26s cubic-bezier(0.16, 1, 0.3, 1),
		visibility 0s linear 0.26s;
}

.fmsm-menu.is-open {
	opacity: 1;
	visibility: visible;
	transform: translateY(0) scale(1);
	transition:
		opacity 0.26s cubic-bezier(0.16, 1, 0.3, 1),
		transform 0.26s cubic-bezier(0.16, 1, 0.3, 1),
		visibility 0s linear 0s;
}

/* Il menu si apre verso il basso di default, verso l'alto se il pulsante è in basso. */
.fmsm-container.fmsm-v-bottom .fmsm-menu {
	bottom: calc(100% + 12px);
	top: auto;
}
.fmsm-container:not(.fmsm-v-bottom) .fmsm-menu {
	top: calc(100% + 12px);
	bottom: auto;
}

/* Allineamento orizzontale del menu rispetto al pulsante. */
.fmsm-container.fmsm-h-right .fmsm-menu {
	right: 0;
	left: auto;
}
.fmsm-container.fmsm-h-left .fmsm-menu {
	left: 0;
	right: auto;
}

/* Voci di menu. */
.fmsm-menu-item {
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: 44px;
	padding: 10px 14px;
	border-radius: 0;
	color: #fff;
	font-size: 13px;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color 0.18s ease, color 0.18s ease, padding-left 0.18s ease;
}

.fmsm-menu-item:hover,
.fmsm-menu-item:focus-visible {
	background-color: rgba(201, 162, 75, 0.14);
	color: var(--fmsm-color-accent);
	padding-left: 18px;
	outline: none;
}

.fmsm-menu-item:focus-visible {
	box-shadow: inset 0 0 0 1px var(--fmsm-color-accent);
}

.fmsm-menu-item.is-current {
	color: var(--fmsm-color-accent);
	font-weight: 700;
	box-shadow: inset 2px 0 0 var(--fmsm-color-accent);
}

.fmsm-site-icon {
	display: inline-flex;
	flex: 0 0 auto;
	width: 20px;
	height: 20px;
}

.fmsm-site-icon img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 4px;
}

.fmsm-site-label {
	flex: 1 1 auto;
}

.fmsm-current-badge {
	flex: 0 0 auto;
	font-style: normal;
	font-size: 11px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: rgba(241, 233, 216, 0.6);
	border: 1px solid rgba(201, 162, 75, 0.4);
	border-radius: 999px;
	padding: 2px 8px;
}

/* Adattamenti per schermi piccoli / touch. */
@media (max-width: 600px) {
	.fmsm-container.fmsm-h-left {
		left: calc(14px + env(safe-area-inset-left, 0px));
	}
	.fmsm-container.fmsm-h-right {
		right: calc(14px + env(safe-area-inset-right, 0px));
	}
	.fmsm-menu {
		min-width: 210px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.fmsm-toggle,
	.fmsm-menu,
	.fmsm-menu-item {
		transition-duration: 0.001ms !important;
	}
}