/*!
 * Truong An Landing Page – floating contact (desktop buttons + mobile bottom bar).
 */
.tal-float { font-family: var(--tal-font); }
.tal-float *, .tal-float *::before, .tal-float *::after { box-sizing: border-box; }
.tal-float .tal-icon { width: 22px; height: 22px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.tal-float__desk { display: none; }
.tal-float__bar {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 9990;
	display: grid; grid-template-columns: repeat(3, 1fr);
	background: #fff; border-top: 1px solid #dbe5f2;
	box-shadow: 0 -8px 24px -12px rgba(16, 42, 80, .35);
	padding-bottom: env(safe-area-inset-bottom);
}
.tal-float .tal-float__item {
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
	min-height: 58px; padding: 6px 4px;
	color: var(--tal-dark); font-size: .78rem; font-weight: 700; line-height: 1.2; text-decoration: none;
}
.tal-float .tal-float__item--call { background: var(--tal-accent); color: var(--tal-dark); }
.tal-float .tal-float__item--zalo { color: var(--tal-secondary); }
.tal-float .tal-float__item--quote { background: var(--tal-primary); color: #fff; }
.tal-float .tal-float__item:focus-visible { outline: 3px solid var(--tal-dark); outline-offset: -3px; }
body.tal-has-mobile-bar { padding-bottom: calc(58px + env(safe-area-inset-bottom)); }

@media (min-width: 768px) {
	body.tal-has-mobile-bar { padding-bottom: 0; }
	.tal-float__bar { display: none; }
	.tal-float__desk { position: fixed; right: 20px; bottom: 24px; z-index: 9990; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
	.tal-float .tal-float__btn {
		display: flex; align-items: center; gap: 0;
		height: 52px; min-width: 52px; padding: 0 15px; border-radius: 26px;
		color: #fff; font-size: .9rem; font-weight: 700; text-decoration: none; white-space: nowrap;
		box-shadow: 0 12px 26px -10px rgba(16, 42, 80, .55);
		transition: transform .15s ease, gap .2s ease;
	}
	.tal-float .tal-float__btn:hover, .tal-float .tal-float__btn:focus-visible { transform: translateY(-2px); gap: 10px; }
	.tal-float .tal-float__btn:focus-visible { outline: 3px solid var(--tal-dark); outline-offset: 2px; }
	.tal-float__label { max-width: 0; overflow: hidden; transition: max-width .25s ease; }
	.tal-float__btn:hover .tal-float__label, .tal-float__btn:focus-visible .tal-float__label { max-width: 240px; }
	.tal-float .tal-float__btn--call { background: var(--tal-accent); color: var(--tal-dark); animation: tal-ring 2.4s ease-out infinite; }
	.tal-float .tal-float__btn--zalo { background: var(--tal-secondary); }
	.tal-float .tal-float__btn--quote { background: var(--tal-primary); }
}
@keyframes tal-ring {
	0% { box-shadow: 0 0 0 0 rgba(255, 178, 28, .55), 0 12px 26px -10px rgba(16, 42, 80, .55); }
	70% { box-shadow: 0 0 0 14px rgba(255, 178, 28, 0), 0 12px 26px -10px rgba(16, 42, 80, .55); }
	100% { box-shadow: 0 0 0 0 rgba(255, 178, 28, 0), 0 12px 26px -10px rgba(16, 42, 80, .55); }
}
@media (prefers-reduced-motion: reduce) {
	.tal-float * { animation: none !important; transition: none !important; }
}
@media print {
	.tal-float { display: none !important; }
	body.tal-has-mobile-bar { padding-bottom: 0; }
}