/* Menu Tiles – Stili Pro */
@font-face { font-family: "MTP Montserrat"; src: url("montserrat-latin-700-normal.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "MTP Nunito"; src: url("nunito-latin-800-normal.woff2") format("woff2"); font-weight: 800; font-display: swap; }

/* =================================================================
 * Struttura comune ai tre stili a pulsante
 * ================================================================= */
:is(.mtl--pillola, .mtl--rilievo, .mtl--contorno) .mtl-item {
	position: relative; display: flex; flex-direction: row; align-items: stretch;
	padding: 0; border: 0; overflow: visible; background: transparent;
	-webkit-tap-highlight-color: transparent;
}
:is(.mtl--pillola, .mtl--rilievo, .mtl--contorno) :is(.mtl-media, .mtl-desc, .mtl-rel) { display: none; }
:is(.mtl--pillola, .mtl--rilievo, .mtl--contorno) .mtl-body {
	flex: 1; display: flex; flex-direction: row; align-items: center; gap: 0; padding: 0; min-width: 0;
}
:is(.mtl--pillola, .mtl--rilievo, .mtl--contorno) .mtl-title {
	flex: 1; min-width: 0; margin: 0; display: flex; align-items: center; justify-content: center; text-align: center;
	text-wrap: balance;
}
:is(.mtl--pillola, .mtl--rilievo, .mtl--contorno) .mtl-title a { color: inherit; text-decoration: none; }
:is(.mtl--pillola, .mtl--rilievo, .mtl--contorno) .mtl-title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
:is(.mtl--pillola, .mtl--rilievo, .mtl--contorno) .mtl-icon { transition: transform .2s ease, background .2s ease, color .2s ease; }
:is(.mtl--pillola, .mtl--rilievo, .mtl--contorno) .mtl-icon .dashicons { transition: transform .2s ease; }

/* =================================================================
 * 42 PILLOLA CON ICONA: pillola piena, cerchio bianco a sinistra con
 * l'icona nel colore della voce, testo maiuscolo spaziato
 * ================================================================= */
.mtl--pillola { --mtl-gap: 16px 22px; }
.mtl--pillola .mtl-item { --c: #8dc63f; }
.mtl--pillola .mtl-item:nth-child(12n+2)  { --c: #ee2a3c; }
.mtl--pillola .mtl-item:nth-child(12n+3)  { --c: #f9a516; }
.mtl--pillola .mtl-item:nth-child(12n+4)  { --c: #2b7cc1; }
.mtl--pillola .mtl-item:nth-child(12n+5)  { --c: #2c3e55; }
.mtl--pillola .mtl-item:nth-child(12n+6)  { --c: #9b59b6; }
.mtl--pillola .mtl-item:nth-child(12n+7)  { --c: #1fb2e5; }
.mtl--pillola .mtl-item:nth-child(12n+8)  { --c: #b5189a; }
.mtl--pillola .mtl-item:nth-child(12n+9)  { --c: #16a689; }
.mtl--pillola .mtl-item:nth-child(12n+10) { --c: #6d2be0; }
.mtl--pillola .mtl-item:nth-child(12n+11) { --c: #e8175d; }
.mtl--pillola .mtl-item:nth-child(12n+12) { --c: #ff6a00; }
.mtl--pillola .mtl-item {
	min-height: 52px; border-radius: 999px; color: #fff;
	background: linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,0) 55%), var(--c);
	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.25),
		inset 0 -2px 0 rgba(0,0,0,.12),
		0 2px 3px rgba(0,0,0,.12),
		0 8px 16px -8px color-mix(in srgb, var(--c) 70%, #000);
	transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.mtl--pillola .mtl-icon,
.mtl--pillola.mtl--no-icon .mtl-body::before {
	flex: none; align-self: center; width: 42px; height: 42px; margin: 5px 0 5px 5px;
	display: grid; place-items: center; border-radius: 50%;
	background: #fff; color: var(--c);
	box-shadow: 0 2px 5px rgba(0,0,0,.22), inset 0 -2px 0 rgba(0,0,0,.06);
}
.mtl--pillola.mtl--no-icon .mtl-body::before { content: "\2192"; font: 700 20px/1 system-ui, sans-serif; }
.mtl--pillola .mtl-icon .dashicons { width: 22px; height: 22px; font-size: 22px; }
.mtl--pillola .mtl-icon svg { width: 22px; height: 22px; }
.mtl--pillola .mtl-title {
	padding: 8px 22px 8px 12px;
	font: 700 14px/1.2 "MTP Montserrat", Montserrat, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	letter-spacing: .12em; text-transform: uppercase; color: #fff;
	text-shadow: 0 1px 1px rgba(0,0,0,.18);
}
.mtl--pillola .mtl-item:hover {
	transform: translateY(-2px); filter: saturate(1.08) brightness(1.04);
	box-shadow: inset 0 1px 0 rgba(255,255,255,.25), inset 0 -2px 0 rgba(0,0,0,.12), 0 3px 5px rgba(0,0,0,.12), 0 14px 22px -10px color-mix(in srgb, var(--c) 75%, #000);
}
.mtl--pillola .mtl-item:hover .mtl-icon { transform: scale(1.08) rotate(-8deg); }
.mtl--pillola .mtl-item:active { transform: translateY(1px); box-shadow: inset 0 1px 0 rgba(255,255,255,.2), inset 0 -1px 0 rgba(0,0,0,.12), 0 2px 4px -2px rgba(0,0,0,.3); }
.mtl--pillola .mtl-item:has(.mtl-title a:focus-visible) { outline: 3px solid color-mix(in srgb, var(--c) 55%, #fff); outline-offset: 3px; }
.mtl--dark.mtl--pillola .mtl-item { box-shadow: inset 0 1px 0 rgba(255,255,255,.25), inset 0 -2px 0 rgba(0,0,0,.18), 0 8px 18px -8px rgba(0,0,0,.8); }

/* =================================================================
 * 43 RILIEVO 3D: pulsante pieno arrotondato, ombra netta scura che
 * si «schiaccia» al clic, carattere tondo e grassetto
 * ================================================================= */
.mtl--rilievo { --mtl-gap: 18px 22px; --sh: #161616; padding: 0 6px 6px 0; }
.mtl--rilievo .mtl-item { --c: #3cbd56; --t: #fff; }
.mtl--rilievo .mtl-item:nth-child(8n+2) { --c: #2a9fe4; }
.mtl--rilievo .mtl-item:nth-child(8n+3) { --c: #9a1bbf; }
.mtl--rilievo .mtl-item:nth-child(8n+4) { --c: #dd1e3a; }
.mtl--rilievo .mtl-item:nth-child(8n+5) { --c: #e4e4e4; --t: #3a3a3a; }
.mtl--rilievo .mtl-item:nth-child(8n+6) { --c: #ff8a00; }
.mtl--rilievo .mtl-item:nth-child(8n+7) { --c: #12b3a4; }
.mtl--rilievo .mtl-item:nth-child(8n+8) { --c: #ff4f9a; }
.mtl--rilievo .mtl-item {
	min-height: 56px; border-radius: 10px; background: var(--c); color: var(--t);
	box-shadow: inset 0 2px 0 rgba(255,255,255,.22), inset 0 -3px 0 rgba(0,0,0,.08), 5px 5px 0 var(--sh);
	transition: transform .12s ease, box-shadow .12s ease, filter .12s ease;
}
.mtl--rilievo .mtl-body { justify-content: center; gap: 12px; padding: 8px 22px; }
.mtl--rilievo .mtl-title { flex: 0 1 auto; font: 800 19px/1.15 "MTP Nunito", Nunito, ui-rounded, "Arial Rounded MT Bold", system-ui, sans-serif; letter-spacing: .01em; color: var(--t); }
.mtl--rilievo .mtl-icon {
	flex: none; width: auto; height: auto; padding: 0; border-radius: 0; background: none; color: var(--t);
	filter: drop-shadow(0 1px 0 rgba(0,0,0,.12));
}
.mtl--rilievo .mtl-icon .dashicons { width: 26px; height: 26px; font-size: 26px; }
.mtl--rilievo .mtl-icon svg { width: 26px; height: 26px; stroke-width: 2.4; }
.mtl--rilievo .mtl-item:hover { transform: translate(-2px, -2px); filter: brightness(1.05); box-shadow: inset 0 2px 0 rgba(255,255,255,.22), inset 0 -3px 0 rgba(0,0,0,.08), 7px 7px 0 var(--sh); }
.mtl--rilievo .mtl-item:hover .mtl-icon { transform: rotate(-10deg) scale(1.1); }
.mtl--rilievo .mtl-item:active { transform: translate(5px, 5px); box-shadow: inset 0 2px 0 rgba(255,255,255,.22), inset 0 -1px 0 rgba(0,0,0,.08), 0 0 0 var(--sh); }
.mtl--rilievo .mtl-item:has(.mtl-title a:focus-visible) { outline: 3px solid var(--sh); outline-offset: 3px; }
.mtl--dark.mtl--rilievo { --sh: #000; }
.mtl--dark.mtl--rilievo .mtl-item { outline: 2px solid #000; outline-offset: 0; }

/* =================================================================
 * 44 BLOCCO CONTORNO: riquadro icona pieno + corpo con bordo colorato,
 * al passaggio il corpo si riempie (variante «outline» di Icona a blocco)
 * ================================================================= */
.mtl--contorno { --mtl-gap: 10px 12px; }
.mtl--contorno .mtl-item { --c: #43a047; --ct: #2e7d32; }
.mtl--contorno .mtl-item:nth-child(8n+2) { --c: #dc3545; --ct: #b02a37; }
.mtl--contorno .mtl-item:nth-child(8n+3) { --c: #f2c014; --ct: #8a6d00; }
.mtl--contorno .mtl-item:nth-child(8n+4) { --c: #3d6ef5; --ct: #2a55cf; }
.mtl--contorno .mtl-item:nth-child(8n+5) { --c: #6c757d; --ct: #495057; }
.mtl--contorno .mtl-item:nth-child(8n+6) { --c: #52a6ba; --ct: #337f91; }
.mtl--contorno .mtl-item:nth-child(8n+7) { --c: #6f42c1; --ct: #5a32a3; }
.mtl--contorno .mtl-item:nth-child(8n+8) { --c: #fd7e14; --ct: #c35a02; }
.mtl--contorno .mtl-item {
	min-height: 46px; border-radius: 6px; overflow: hidden;
	background: var(--mtl-surface, #fff); color: var(--ct);
	box-shadow: inset 0 0 0 2px var(--c), 0 2px 4px rgba(0,0,0,.08);
	transition: background .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.mtl--contorno .mtl-body { align-items: stretch; }
.mtl--contorno .mtl-icon,
.mtl--contorno.mtl--no-icon .mtl-body::before {
	flex: none; width: 50px; height: auto; border-radius: 0; display: grid; place-items: center;
	background: var(--c); color: #fff;
}
.mtl--contorno .mtl-item:nth-child(8n+3) .mtl-icon { color: #2b2400; }
.mtl--contorno.mtl--no-icon .mtl-body::before { content: "\276F"; font-size: 15px; }
.mtl--contorno .mtl-icon .dashicons { width: 20px; height: 20px; font-size: 20px; }
.mtl--contorno .mtl-title { padding: 8px 18px; font: 600 16px/1.2 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; color: inherit; }
.mtl--contorno .mtl-item:hover { background: var(--c); color: #fff; transform: translateY(-1px); box-shadow: inset 0 0 0 2px var(--c), 0 6px 12px -4px color-mix(in srgb, var(--c) 60%, transparent); }
.mtl--contorno .mtl-item:nth-child(8n+3):hover { color: #2b2400; }
.mtl--contorno .mtl-item:hover .mtl-icon { background: color-mix(in srgb, var(--c) 82%, #000); }
.mtl--contorno .mtl-item:hover .mtl-icon .dashicons { transform: translateX(2px); }
.mtl--contorno .mtl-item:active { transform: translateY(1px); }
.mtl--contorno .mtl-item:has(.mtl-title a:focus-visible) { outline: 0; box-shadow: inset 0 0 0 2px var(--c), 0 0 0 4px color-mix(in srgb, var(--c) 40%, transparent); }
.mtl--dark.mtl--contorno .mtl-item { background: transparent; color: color-mix(in srgb, var(--c) 70%, #fff); }

/* =================================================================
 * Perfezionamento di «Icona a blocco» (Stili extra): bordo nel tono
 * scuro del colore, anello di focus come Bootstrap, icona che scatta
 * ================================================================= */
.mtl--blocco .mtl-item { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--c) 82%, #000), inset 0 1px 0 rgba(255,255,255,.18), 0 2px 4px rgba(0,0,0,.15); }
.mtl--blocco .mtl-icon { background: color-mix(in srgb, var(--c) 84%, #000); transition: background .15s ease; }
.mtl--blocco .mtl-icon .dashicons { transition: transform .18s ease; }
.mtl--blocco .mtl-item:hover .mtl-icon .dashicons { transform: scale(1.12); }
.mtl--blocco .mtl-item:has(.mtl-title a:focus-visible) { outline: 0; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--c) 82%, #000), 0 0 0 4px color-mix(in srgb, var(--c) 45%, transparent); }
.mtl--blocco .mtl-title a:focus-visible { outline: 0; }

/* =================================================================
 * Altezza libera (selettore «Altezza pulsanti» di Stili extra)
 * ================================================================= */
.mtl.mtl--altezza:is(.mtl--pillola, .mtl--rilievo, .mtl--contorno) .mtl-body { flex: 1; align-self: stretch; height: 100%; }
.mtl.mtl--altezza:is(.mtl--pillola, .mtl--rilievo, .mtl--contorno) .mtl-title { align-self: stretch; display: flex; align-items: center; justify-content: center; }
.mtl.mtl--altezza.mtl--pillola .mtl-icon,
.mtl.mtl--altezza.mtl--pillola.mtl--no-icon .mtl-body::before {
	width: calc(var(--mtx-h) - 10px) !important; height: calc(var(--mtx-h) - 10px) !important;
	align-self: center !important; margin: 0 0 0 5px;
}
.mtl.mtl--altezza.mtl--rilievo .mtl-body { padding-top: 0; padding-bottom: 0; }
.mtl.mtl--altezza.mtl--rilievo .mtl-icon { align-self: center !important; height: auto !important; }
.mtl.mtl--altezza.mtl--rilievo .mtl-title { flex: 0 1 auto; }
.mtl.mtl--altezza.mtl--contorno .mtl-body { align-items: stretch; }
.mtl.mtl--altezza.mtl--contorno .mtl-icon,
.mtl.mtl--altezza.mtl--contorno.mtl--no-icon .mtl-body::before { width: clamp(20px, var(--mtx-h), 64px); }

/* =================================================================
 * Miniature nel selettore di Aspetto › Menu Tiles
 * ================================================================= */
.mtl-thumb--pillola, .mtl-thumb--rilievo, .mtl-thumb--contorno { flex-direction: column; justify-content: center; gap: 6px; background: #f1f2f4; }
:is(.mtl-thumb--pillola, .mtl-thumb--rilievo, .mtl-thumb--contorno) i:nth-child(n) { display: block; flex: none; height: 13px; border: 0; }
.mtl-thumb--pillola i:nth-child(n) { border-radius: 9px; background: radial-gradient(circle at 7px 50%, #fff 0 4.5px, transparent 5px), #8dc63f; box-shadow: 0 2px 3px rgba(0,0,0,.18); }
.mtl-thumb--pillola i:nth-child(2) { background: radial-gradient(circle at 7px 50%, #fff 0 4.5px, transparent 5px), #ee2a3c; }
.mtl-thumb--pillola i:nth-child(3) { background: radial-gradient(circle at 7px 50%, #fff 0 4.5px, transparent 5px), #2b7cc1; }
.mtl-thumb--rilievo { background: #fff; padding-right: 12px; }
.mtl-thumb--rilievo i:nth-child(n) { border-radius: 3px; background: #3cbd56; box-shadow: 2px 2px 0 #161616; }
.mtl-thumb--rilievo i:nth-child(2) { background: #2a9fe4; }
.mtl-thumb--rilievo i:nth-child(3) { background: #9a1bbf; }
.mtl-thumb--contorno { background: #fff; }
.mtl-thumb--contorno i:nth-child(n) { border-radius: 2px; background: linear-gradient(90deg, #43a047 0 24%, #fff 24%); box-shadow: inset 0 0 0 1.5px #43a047; }
.mtl-thumb--contorno i:nth-child(2) { background: linear-gradient(90deg, #dc3545 0 24%, #fff 24%); box-shadow: inset 0 0 0 1.5px #dc3545; }
.mtl-thumb--contorno i:nth-child(3) { background: linear-gradient(90deg, #3d6ef5 0 24%, #fff 24%); box-shadow: inset 0 0 0 1.5px #3d6ef5; }

@media (prefers-reduced-motion: reduce) {
	:is(.mtl--pillola, .mtl--rilievo, .mtl--contorno, .mtl--blocco) .mtl-item,
	:is(.mtl--pillola, .mtl--rilievo, .mtl--contorno, .mtl--blocco) .mtl-icon,
	:is(.mtl--pillola, .mtl--rilievo, .mtl--contorno, .mtl--blocco) .mtl-icon .dashicons { transition: none; }
	:is(.mtl--pillola, .mtl--rilievo, .mtl--contorno, .mtl--blocco) .mtl-item:hover,
	:is(.mtl--pillola, .mtl--rilievo, .mtl--contorno, .mtl--blocco) .mtl-item:hover .mtl-icon { transform: none; }
}