/*
 * Istituti Atlante - esperienza "app" su telefono e tablet (inc/app.php)
 * Barra in basso + menu a scheda. Su computer (>= 992px) è tutto nascosto.
 */

.atl-tabbar,
.atl-sheet {
	--a-navy: #061a3a;
	--a-navy-2: #0b3a6e;
	--a-gold: #e8b52f;
	--a-gold-2: #f7d77c;
	--a-ink: #0f1d33;
	--a-muted: #5b6b82;
	--a-line: #e3e9f2;
	--a-bg: #f5f7fb;
	--a-ease: cubic-bezier(.2, .8, .2, 1);
	font-family: "Open Sans", system-ui, sans-serif;
	-webkit-font-smoothing: antialiased;
}
.atl-tabbar *,
.atl-sheet * {
	box-sizing: border-box;
}
.atl-tabbar .atl-ico,
.atl-sheet .atl-ico {
	width: 24px;
	height: 24px;
	flex: none;
}

.atl-tabbar {
	display: none;
}
.atl-sheet[hidden] {
	display: none !important;
}

@media (max-width: 991px) {
	/* spazio in fondo alla pagina per la barra */
	body.atl-app {
		padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px)) !important;
	}

	/* ---------- barra in basso ---------- */
	.atl-tabbar {
		position: fixed;
		left: 10px;
		right: 10px;
		bottom: calc(10px + env(safe-area-inset-bottom, 0px));
		z-index: 99990;
		display: grid;
		grid-template-columns: repeat(5, minmax(0, 1fr));
		align-items: end;
		height: 64px;
		padding: 0 6px;
		border-radius: 22px;
		background: rgba(6, 26, 58, .92);
		box-shadow: 0 12px 30px -8px rgba(4, 18, 43, .55), inset 0 0 0 1px rgba(255, 255, 255, .08);
		-webkit-backdrop-filter: saturate(160%) blur(16px);
		backdrop-filter: saturate(160%) blur(16px);
		transition: transform .35s var(--a-ease);
	}
	.atl-tabbar.is-away {
		transform: translateY(calc(100% + 24px));
	}
	.atl-tabbar__item,
	.atl-tabbar__call {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 3px;
		height: 64px;
		padding: 0;
		border: 0;
		background: none;
		color: rgba(255, 255, 255, .72) !important;
		font-family: Montserrat, "Open Sans", sans-serif;
		font-size: 10.5px;
		font-weight: 600;
		line-height: 1;
		letter-spacing: .01em;
		text-decoration: none !important;
		cursor: pointer;
		-webkit-tap-highlight-color: transparent;
		transition: color .2s ease, transform .2s var(--a-ease);
	}
	.atl-tabbar__item:active,
	.atl-tabbar__call:active {
		transform: scale(.92);
	}
	.atl-tabbar__item.is-current {
		color: var(--a-gold-2) !important;
	}
	.atl-tabbar__item.is-current::after {
		content: "";
		width: 4px;
		height: 4px;
		margin-top: 1px;
		border-radius: 50%;
		background: var(--a-gold);
	}
	.atl-tabbar__item.is-current span {
		display: none;
	}
	.atl-tabbar__item--wa .atl-ico {
		color: #4ade80;
	}
	.atl-tabbar__call {
		justify-content: flex-end;
		padding-bottom: 9px;
		color: #fff !important;
	}
	.atl-tabbar__call-btn {
		display: grid;
		place-items: center;
		width: 56px;
		height: 56px;
		margin-top: -28px;
		margin-bottom: 2px;
		border-radius: 50%;
		color: var(--a-navy);
		background: linear-gradient(135deg, var(--a-gold-2), var(--a-gold) 60%, #d9a01d);
		box-shadow: 0 10px 22px -6px rgba(232, 181, 47, .7), 0 0 0 5px rgba(6, 26, 58, .92);
	}
	.atl-tabbar__call-btn .atl-ico {
		animation: atl-ring 4s ease-in-out infinite;
	}
	.atl-tabbar :focus-visible {
		outline: 2px solid var(--a-gold);
		outline-offset: -4px;
		border-radius: 14px;
	}

	/* ---------- pulsanti flottanti: Chaty non serve (Chiama e WhatsApp sono nella barra),
	   chatbot e carrello salgono sopra la barra ---------- */
	body.atl-app .chaty-widget,
	body.atl-app .chaty {
		display: none !important;
	}
	body.atl-app #atlante-chat-widget {
		bottom: calc(86px + env(safe-area-inset-bottom, 0px)) !important;
		right: 14px !important;
	}
	body.atl-app #atlante-chat-teaser {
		display: none !important;
	}
	body.atl-app .xoo-wsc-basket {
		bottom: calc(150px + env(safe-area-inset-bottom, 0px)) !important;
	}
	body.atl-app #iubenda-cs-banner {
		bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important;
	}
	/* pulsante "preferenze cookie" di iubenda: copriva "Menu" della barra; resta raggiungibile (obbligo privacy), in basso a sinistra sopra la barra */
	html body.atl-app button.iubenda-tp-btn.iubenda-cs-preferences-link[data-tp-float],
	html body.atl-app button.iubenda-tp-btn.iubenda-cs-preferences-link[data-tp-float][data-tp-float] {
		top: auto !important;
		right: auto !important;
		left: 14px !important;
		bottom: calc(92px + env(safe-area-inset-bottom, 0px)) !important;
		margin: 0 !important;
		transform: none !important;
	}

	/* ---------- menu a scheda ---------- */
	.atl-sheet {
		position: fixed;
		inset: 0;
		z-index: 100000;
	}
	.atl-sheet__backdrop {
		position: absolute;
		inset: 0;
		background: rgba(4, 18, 43, .55);
		-webkit-backdrop-filter: blur(4px);
		backdrop-filter: blur(4px);
		opacity: 0;
		transition: opacity .3s ease;
	}
	.atl-sheet__panel {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		display: flex;
		flex-direction: column;
		max-height: 92vh;
		max-height: 92dvh;
		border-radius: 26px 26px 0 0;
		background: #fff;
		box-shadow: 0 -20px 60px -10px rgba(4, 18, 43, .45);
		transform: translateY(100%);
		transition: transform .42s var(--a-ease);
		touch-action: pan-y;
	}
	.atl-sheet.is-open .atl-sheet__backdrop {
		opacity: 1;
	}
	.atl-sheet.is-open .atl-sheet__panel {
		transform: translateY(var(--drag, 0px));
	}
	.atl-sheet.is-dragging .atl-sheet__panel {
		transition: none;
	}
	.atl-sheet__grip {
		width: 42px;
		height: 5px;
		margin: 10px auto 0;
		border-radius: 3px;
		background: #d3dbe7;
		flex: none;
	}
	.atl-sheet__head {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		padding: 10px 18px 12px;
		flex: none;
	}
	.atl-sheet__brand {
		display: flex;
		align-items: center;
		gap: 10px;
		color: var(--a-ink) !important;
		text-decoration: none !important;
	}
	.atl-sheet__brand img {
		width: 40px;
		height: 40px;
		border-radius: 50%;
	}
	.atl-sheet__brand strong {
		display: block;
		font-family: Montserrat, sans-serif;
		font-size: 16px;
		line-height: 1.2;
	}
	.atl-sheet__brand small {
		display: block;
		font-size: 12px;
		color: var(--a-muted);
	}
	.atl-sheet__close {
		display: grid;
		place-items: center;
		width: 40px;
		height: 40px;
		padding: 0;
		border: 0;
		border-radius: 50%;
		color: var(--a-ink);
		background: var(--a-bg);
		cursor: pointer;
	}
	.atl-sheet__close .atl-ico {
		width: 20px;
		height: 20px;
	}
	.atl-sheet__body {
		flex: 1;
		overflow-y: auto;
		overscroll-behavior: contain;
		padding: 4px 18px calc(24px + env(safe-area-inset-bottom, 0px));
		-webkit-overflow-scrolling: touch;
	}

	.atl-sheet__search {
		position: relative;
		margin: 0 0 16px;
	}
	.atl-sheet__search .atl-ico {
		position: absolute;
		left: 16px;
		top: 50%;
		width: 20px;
		height: 20px;
		margin-top: -10px;
		color: var(--a-muted);
		pointer-events: none;
	}
	.atl-sheet__search input {
		width: 100%;
		height: 50px;
		margin: 0;
		padding: 0 16px 0 46px;
		border: 1.5px solid var(--a-line);
		border-radius: 14px;
		background: var(--a-bg);
		color: var(--a-ink);
		font-size: 16px;
		box-shadow: none;
		-webkit-appearance: none;
		appearance: none;
	}
	.atl-sheet__search input:focus {
		outline: none;
		border-color: #1c5fa8;
		background: #fff;
	}

	.atl-sheet__quick {
		display: grid;
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 8px;
		margin-bottom: 18px;
	}
	.atl-sheet__quick a {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 6px;
		padding: 12px 4px 10px;
		border-radius: 16px;
		background: var(--a-bg);
		color: var(--a-ink) !important;
		font-size: 12px;
		font-weight: 600;
		line-height: 1.2;
		text-align: center;
		text-decoration: none !important;
		transition: background-color .2s ease;
	}
	.atl-sheet__quick a:active {
		background: #e8edf5;
	}
	.atl-sheet__quick .atl-ico {
		width: 38px;
		height: 38px;
		padding: 8px;
		border-radius: 12px;
		color: #fff;
		background: linear-gradient(135deg, #1c5fa8, var(--a-navy-2));
	}

	/* voci del menu principale */
	.atl-sheet__menu,
	.atl-sheet__menu ul {
		margin: 0;
		padding: 0;
		list-style: none;
	}
	.atl-sheet__menu > li {
		border-bottom: 1px solid var(--a-line);
	}
	.atl-sheet__menu li {
		position: relative;
		margin: 0;
		padding: 0;
	}
	.atl-sheet__menu a {
		display: flex;
		align-items: center;
		min-height: 52px;
		padding: 12px 52px 12px 4px;
		color: var(--a-ink) !important;
		font-family: Montserrat, sans-serif;
		font-size: 16px;
		font-weight: 600;
		line-height: 1.3;
		text-decoration: none !important;
		text-transform: none !important;
		background: none !important;
	}
	.atl-sheet__menu .current-menu-item > a {
		color: #1c5fa8 !important;
	}
	.atl-sheet__menu .sub-menu {
		display: none;
		margin: 0 0 10px !important;
		padding: 4px 0 4px 14px !important;
		border-left: 2px solid var(--a-gold);
	}
	.atl-sheet__menu li.is-open > .sub-menu {
		display: block;
		animation: atl-drop .3s var(--a-ease);
	}
	.atl-sheet__menu .sub-menu a {
		min-height: 44px;
		padding: 10px 44px 10px 6px;
		font-family: "Open Sans", sans-serif;
		font-size: 15px;
		font-weight: 500;
		color: #34445c !important;
	}
	.atl-sheet__toggle {
		position: absolute;
		top: 6px;
		right: 0;
		display: grid;
		place-items: center;
		width: 40px;
		height: 40px;
		padding: 0;
		border: 0;
		border-radius: 12px;
		color: var(--a-navy-2);
		background: var(--a-bg);
		cursor: pointer;
	}
	.atl-sheet__toggle::before {
		content: "";
		width: 9px;
		height: 9px;
		margin-top: -4px;
		border-right: 2px solid currentColor;
		border-bottom: 2px solid currentColor;
		transform: rotate(45deg);
		transition: transform .3s var(--a-ease), margin .3s var(--a-ease);
	}
	li.is-open > .atl-sheet__toggle::before {
		margin-top: 4px;
		transform: rotate(-135deg);
	}
	.atl-sheet__menu .sub-menu .atl-sheet__toggle {
		top: 2px;
		width: 36px;
		height: 36px;
	}

	/* i pulsanti colorati del menu (Catalogo, FAQ, Lavora con noi...) diventano "chip" */
	.atl-sheet__menu > li.menu-item-12601,
	.atl-sheet__menu > li.menu-item-12710,
	.atl-sheet__menu > li.menu-item-green,
	.atl-sheet__menu > li.euwb-open-guest-modal,
	.atl-sheet__menu > li.menu-item-13003 {
		display: inline-block;
		margin: 14px 6px 0 0;
		border: 0;
	}
	.atl-sheet__menu > li.menu-item-12601 > a,
	.atl-sheet__menu > li.menu-item-12710 > a,
	.atl-sheet__menu > li.menu-item-green > a,
	.atl-sheet__menu > li.euwb-open-guest-modal > a,
	.atl-sheet__menu > li.menu-item-13003 > a {
		min-height: 40px;
		padding: 9px 16px;
		border-radius: 999px;
		font-size: 14px;
		color: var(--a-navy-2) !important;
		background: var(--a-bg) !important;
		box-shadow: inset 0 0 0 1px var(--a-line);
	}

	.atl-sheet__contact {
		margin-top: 22px;
		padding: 18px;
		border-radius: 18px;
		color: #fff;
		background: linear-gradient(135deg, var(--a-navy-2), var(--a-navy));
		text-align: center;
	}
	.atl-sheet__cta {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 10px;
		min-height: 52px;
		border-radius: 999px;
		color: var(--a-navy) !important;
		background: linear-gradient(135deg, var(--a-gold-2), var(--a-gold));
		font-family: Montserrat, sans-serif;
		font-size: 16px;
		font-weight: 800;
		text-decoration: none !important;
	}
	.atl-sheet__cta .atl-ico {
		width: 20px;
		height: 20px;
	}
	.atl-sheet__contact p {
		margin: 12px 0 0;
		font-size: 13px;
		color: rgba(255, 255, 255, .75);
	}
	.atl-sheet__social {
		display: flex;
		justify-content: center;
		gap: 18px;
		margin-top: 10px;
	}
	.atl-sheet__social a {
		color: var(--a-gold-2) !important;
		font-size: 14px;
		font-weight: 600;
		text-decoration: none !important;
	}

	/* pagina sotto bloccata mentre il menu è aperto */
	html.atl-sheet-open,
	html.atl-sheet-open body {
		overflow: hidden !important;
	}
}

@keyframes atl-ring {
	0%, 86%, 100% { transform: rotate(0); }
	88% { transform: rotate(-14deg); }
	91% { transform: rotate(12deg); }
	94% { transform: rotate(-8deg); }
	97% { transform: rotate(4deg); }
}
@keyframes atl-drop {
	from { opacity: 0; transform: translateY(-6px); }
	to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
	.atl-tabbar,
	.atl-sheet__panel,
	.atl-sheet__backdrop {
		transition: none !important;
	}
	.atl-tabbar__call-btn .atl-ico,
	.atl-sheet__menu li.is-open > .sub-menu {
		animation: none !important;
	}
}

/* ==========================================================================
   FOOTER (tutto il sito): blu notte invece che grigio, in tono con la home
   ========================================================================== */
#footer #footer_copyright,
#footer #footer_bottom,
#footer #footer_top {
	background-color: #04122b !important;
	border-color: rgba(255, 255, 255, .08) !important;
}
#footer #footer_copyright {
	border-top: 1px solid rgba(255, 255, 255, .08) !important;
}
#footer #footer_copyright .copyright_text,
#footer #footer_copyright .copyright_text a {
	color: rgba(255, 255, 255, .78) !important;
}
#footer #footer_copyright .copyright_text a:hover {
	color: #f7d77c !important;
}
