/**
 * Tab bar app: visibile solo ≤1024px; nasconde nav Elementor nell’header in quella fascia.
 */
:root {
	--psai-tabbar-h: 3.75rem;
	--psai-tabbar-safe: env(safe-area-inset-bottom, 0px);
}

/* Desktop: nascosto con ID per battere regole generiche (es. Elementor su div). */
#psai-app-tabbar,
#psai-app-tabbar-backdrop,
#psai-app-tabbar-sheet {
	display: none !important;
}

body {
	padding-bottom: 0;
}

@media (max-width: 1024px) {
	/* Header: niente hamburger / menu duplicato — usa tab bar + foglio Altro */
	.elementor-location-header .elementor-widget-nav-menu {
		display: none !important;
	}

	/*
	 * Elementor Container (.e-con) può impostare flex-direction: column su tablet → logo sopra.
	 * Forziamo una sola riga: logo | (nav nascosto — tab bar gestisce la navigazione).
	 */
	.elementor-location-header .psai-tb-header-inner.elementor-element,
	.elementor-location-header .psai-tb-header-inner.e-flex {
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		align-items: center !important;
		justify-content: space-between !important;
		row-gap: 0 !important;
		column-gap: 0.75rem !important;
	}

	.elementor-location-header .psai-tb-header-logo {
		flex: 0 0 auto !important;
		order: 0 !important;
		min-width: 0 !important;
		max-width: min(52%, 240px) !important;
	}

	.elementor-location-header .psai-tb-nav-wrap {
		display: none !important;
		width: 0 !important;
		min-width: 0 !important;
		max-width: 0 !important;
		height: 0 !important;
		min-height: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		overflow: hidden !important;
		border: 0 !important;
		flex: 0 0 0 !important;
		order: 1 !important;
	}

	body {
		padding-bottom: calc(var(--psai-tabbar-h) + var(--psai-tabbar-safe));
	}

	/* Blocco scroll documento (reforzo + iOS); lo scroll resta solo in .psai-app-tabbar__sheet-nav */
	html.psai-tabbar-open {
		overflow: hidden !important;
		height: 100%;
		overscroll-behavior: none;
	}

	body.psai-tabbar-open {
		overflow: hidden !important;
		overscroll-behavior: none;
	}

	#psai-app-tabbar {
		display: block !important;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 100002;
		padding-bottom: var(--psai-tabbar-safe);
		background: color-mix(in srgb, var(--psai-surface-header) 96%, transparent);
		backdrop-filter: blur(16px) saturate(140%);
		-webkit-backdrop-filter: blur(16px) saturate(140%);
		border-top: 1px solid var(--psai-border-subtle);
		box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.35);
	}

	.psai-app-tabbar__nav {
		width: 100%;
		max-width: min(1200px, 100%);
		margin-inline: auto;
	}

	.psai-app-tabbar__list {
		display: flex;
		list-style: none;
		margin: 0;
		padding: 0.35rem 0.25rem calc(0.35rem + var(--psai-tabbar-safe));
		justify-content: space-around;
		align-items: stretch;
		gap: 0.125rem;
	}

	.psai-app-tabbar__item {
		flex: 1 1 0;
		min-width: 0;
		text-align: center;
	}

	.psai-app-tabbar__link,
	.psai-app-tabbar__more {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 0.2rem;
		width: 100%;
		min-height: var(--psai-tabbar-h);
		padding: 0.2rem 0.15rem;
		border: none;
		border-radius: 10px;
		background: transparent;
		color: var(--psai-text-muted);
		font-family: inherit;
		font-size: 0.625rem;
		font-weight: 600;
		text-decoration: none;
		line-height: 1.15;
		cursor: pointer;
		touch-action: manipulation;
		-webkit-tap-highlight-color: transparent;
		transition: color 0.2s ease, background-color 0.2s ease;
	}

	.psai-app-tabbar__link:hover,
	.psai-app-tabbar__link:focus-visible,
	.psai-app-tabbar__more:hover,
	.psai-app-tabbar__more:focus-visible {
		color: var(--psai-text);
		background: color-mix(in srgb, var(--psai-white) 6%, transparent);
		outline: none;
	}

	.psai-app-tabbar__link.is-active,
	.psai-app-tabbar__link[aria-current="page"] {
		color: var(--psai-primary);
	}

	.psai-app-tabbar__icon-wrap {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.psai-app-tabbar__icon {
		display: block;
		flex-shrink: 0;
	}

	.psai-app-tabbar__label {
		display: block;
		max-width: 100%;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	/* Copertura viewport reale (mobile/desktop stretto); JS sposta il nodo sotto body se serve */
	#psai-app-tabbar-backdrop {
		display: block !important;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		width: 100%;
		max-width: none;
		min-height: 100vh;
		min-height: 100svh;
		min-height: 100dvh;
		min-height: -webkit-fill-available;
		margin: 0;
		padding: 0;
		border: 0;
		box-sizing: border-box;
		z-index: 100003;
		background: rgba(0, 0, 0, 0.52);
		backdrop-filter: blur(3px);
		-webkit-backdrop-filter: blur(3px);
		touch-action: none;
	}

	/* Stessa specificità ID + [hidden] così batte display:block/flex sopra */
	#psai-app-tabbar-backdrop[hidden],
	#psai-app-tabbar-sheet[hidden] {
		display: none !important;
		pointer-events: none;
	}

	#psai-app-tabbar-sheet {
		display: flex !important;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 100004;
		/* Quasi tutto il viewport: meno scroll interno; il menu scorre solo nella nav */
		max-height: min(96vh, calc(100vh - env(safe-area-inset-top, 0px) - 8px));
		height: auto;
		padding-bottom: var(--psai-tabbar-safe);
		background: var(--psai-surface-raised);
		border-radius: 16px 16px 0 0;
		border: 1px solid var(--psai-border-subtle);
		border-bottom: none;
		box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.45);
		flex-direction: column;
		min-height: 0;
		overflow: hidden;
		animation: psai-tabbar-sheet-in 0.25s ease-out;
	}

	@supports (height: 1dvh) {
		#psai-app-tabbar-sheet {
			max-height: min(96dvh, calc(100dvh - env(safe-area-inset-top, 0px) - 8px));
		}
	}

	@keyframes psai-tabbar-sheet-in {
		from {
			transform: translateY(100%);
			opacity: 0.9;
		}

		to {
			transform: translateY(0);
			opacity: 1;
		}
	}

	.psai-app-tabbar__sheet-inner {
		display: flex;
		flex-direction: column;
		flex: 1 1 auto;
		min-height: 0;
		max-height: 100%;
		overflow: hidden;
	}

	.psai-app-tabbar__sheet-head {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 0.75rem;
		padding: 0.85rem 1rem 0.5rem;
		border-bottom: 1px solid var(--psai-border-subtle);
		flex-shrink: 0;
	}

	.psai-app-tabbar__sheet-title {
		margin: 0;
		font-size: 1rem;
		font-weight: 600;
		color: var(--psai-text);
	}

	.psai-app-tabbar__sheet-close {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-shrink: 0;
		width: 2.5rem;
		height: 2.5rem;
		padding: 0;
		border: none;
		border-radius: 10px;
		background: color-mix(in srgb, var(--psai-white) 8%, transparent);
		color: var(--psai-text);
		font: inherit;
		line-height: 1;
		cursor: pointer;
		transition: background-color 0.2s ease;
	}

	.psai-app-tabbar__sheet-close-glyph {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 100%;
		font-size: 1.5rem;
		font-weight: 400;
		line-height: 1;
		margin-top: -0.06em;
	}

	.psai-app-tabbar__sheet-close:hover,
	.psai-app-tabbar__sheet-close:focus-visible {
		background: color-mix(in srgb, var(--psai-white) 14%, transparent);
		outline: none;
	}

	.psai-app-tabbar__sheet-nav {
		flex: 1 1 auto;
		min-height: 0;
		overflow-x: hidden;
		overflow-y: auto;
		overscroll-behavior-y: contain;
		-webkit-overflow-scrolling: touch;
		touch-action: pan-y;
		padding: 0.5rem 0 1rem;
	}

	.psai-app-tabbar__sheet-menu {
		list-style: none;
		margin: 0;
		padding: 0 0.75rem;
	}

	.psai-app-tabbar__sheet-menu > li {
		border-bottom: 1px solid var(--psai-border-subtle);
	}

	.psai-app-tabbar__sheet-menu > li:last-child {
		border-bottom: none;
	}

	.psai-app-tabbar__sheet-menu a {
		display: block;
		padding: 0.68rem 0.5rem;
		color: var(--psai-text);
		text-decoration: none;
		font-weight: 500;
		font-size: 0.9375rem;
	}

	.psai-app-tabbar__sheet-menu a:hover,
	.psai-app-tabbar__sheet-menu a:focus-visible {
		color: var(--psai-primary);
		outline: none;
	}

	.psai-app-tabbar__sheet-menu .sub-menu {
		list-style: none;
		margin: 0;
		padding: 0 0 0.5rem 0.75rem;
	}

	.psai-app-tabbar__sheet-menu .sub-menu a {
		padding: 0.55rem 0.5rem;
		font-size: 0.875rem;
		color: var(--psai-text-muted);
	}

	.psai-app-tabbar__sheet-menu .sub-menu a:hover,
	.psai-app-tabbar__sheet-menu .sub-menu a:focus-visible {
		color: var(--psai-primary);
	}

	/* Voce padre “Approfondisci” con href # */
	.psai-app-tabbar__sheet-menu a[href="#"] {
		pointer-events: none;
		color: var(--psai-text-muted);
		font-size: 0.75rem;
		text-transform: uppercase;
		letter-spacing: 0.06em;
		padding-bottom: 0.35rem;
	}
}