@charset "UTF-8";

/* ============================================================================
   THANH NUT NHANH DAY MAN HINH (.az-template-navfooter) - style RIENG
   ----------------------------------------------------------------------------
   Tach thanh tep rieng chu khong gop vao Footer.css: chan trang da nghiem thu
   16/08 va dang khoa, sua vung nay khong duoc dong vao tep do.

   Ban may tinh (cot nut bo tron noi ben phai) GIU NGUYEN - moi luat duoi day
   deu nam trong @media (max-width: 900px).
   ========================================================================== */

@layer overrides {

	@media (max-width: 900px) {

		/* ---- LOI: khe ho giua cac nut ----
		   style.css dat .az-template-navfooter ul { gap: 8px } cho ban may tinh
		   (cot doc, cac nut roi nhau nen can khoang cach). Sang man hep chi doi
		   huong sang hang ngang ma QUEN bo gap, nen con nguyen ba khe 8px. Thanh
		   lai khong co nen rieng -> noi dung cuon phia sau lot qua khe, dung
		   hien tuong trong anh chup 16/08.

		   Chua bang hai viec: bo gap, va cho ca THANH mot nen dac. */
		.az-template-navfooter {
			/* Nen TRANG, chu CAM (truoc day nguoc lai: dai gradient cam, chu
			   trang). Doi mau nen thi phai doi luon mau duong ke va mau khi
			   cham - chung dang dung trang mo, tren nen trang se tang hinh. */
			background: #fff;
			/* Bong hat len tren de tach khoi noi dung, khong con cam giac thanh
			   "dinh" vao chu. */
			/* Nen trang can bong nhe hon nen cam - de dam se thanh vet xam duc */
			box-shadow: 0 -2px 12px rgba(0, 0, 0, .12);
			/* May co vien cong duoi day (dong iPhone tai tho): chua them cho.
			   Trinh duyet nao khong hieu env() thi lay 0, khong hai gi. */
			padding-bottom: env(safe-area-inset-bottom, 0px);
		}

		.az-template-navfooter ul { gap: 0; }

		/* Nut de nen TRONG SUOT, de dai mau cua ca thanh chay lien mach qua ba
		   nut - nhin thanh mot dai duy nhat chu khong phai ba manh ghep. */
		.az-template-navfooter a {
			background: transparent;
			color: var(--az-template-brand);
			padding: 12px 4px;
			/* Duong ke giua cac nut: tren nen trang phai dung mau toi mo,
			   khong con la trang mo. */
			border-right: 1px solid rgba(0, 0, 0, .12);
			transition: background-color .15s ease;

			/* style.css cho tung nut mot bong do (dang nut tron noi tren nen
			   cam). Nen thanh gio la trang va nut de trong suot, de nguyen thi
			   ba bong do hien thanh ba mang mo giua nen trang. */
			box-shadow: none;
		}

		/* Bieu tuong theo mau chu */
		.az-template-navfooter a i,
		.az-template-navfooter a svg { color: var(--az-template-brand); }

		/* Vien tren tach thanh khoi noi dung - nen trang khong con tu tach
		   duoc bang mau nhu dai cam truoc day. */
		.az-template-navfooter { border-top: 1px solid rgba(0, 0, 0, .1); }

		.az-template-navfooter li:last-child a { border-right: 0; }

		/* Man cam ung khong co :hover - dung :active de nguoi dung thay nut an
		   xuong khi cham. */
		.az-template-navfooter a:hover { background: transparent; }
		.az-template-navfooter a:active { background: rgba(0, 0, 0, .06); }

		/* Chua cho thanh: cao 45px (12 + 12 dem, cong 21 dong chu) lam tron 46.
		   style.css dat 44px theo dem cu 11px - khong sua thi doan cuoi trang
		   bi thanh de len. */
		body { padding-bottom: calc(46px + env(safe-area-inset-bottom, 0px)); }
	}

	/* Man rat hep: ba nhan tieng Viet co dau de bi vo dong -> ha co chu mot bac
	   va thu hep khoang giua bieu tuong voi chu. */
	@media (max-width: 380px) {
		.az-template-navfooter a { font-size: 12px; gap: 6px; padding: 12px 2px; }
	}
}