/*
 * Giao dien thanhtravien.vn — nen loang dong va cum phien noi.
 * Bang mau lay tu client/index.css cua ai.thanhtravien.vn.
 *
 * Doi mau o day thi doi luon trong tep nay; dung viet mau thang vao
 * tung khoi, moi mau viet cung la mot cho se lech khi doi bang mau.
 */

:root {
	--ttv-mint: #50AFA4;
	--ttv-mint-dam: #3D9B90;
	--ttv-mint-nhat: #7BCFC2;
	--ttv-mint-lot: #B7E8E0;
	--ttv-lam: #3E78C5;
	--ttv-ngoc: #446B6E;
	--ttv-muc: #253638;
	--ttv-nen: #F6FAF9;
}

/* ============================================================
   NEN LOANG

   Bon mang mau chong nhau, moi mang mot quy dao va mot chu ky
   rieng. Bon chu ky 17/23/29/20 giay khong chia het cho nhau nen
   toan canh khong lap lai ro ret — do la thu lam hieu ung nay
   trong "song" thay vi thay bang mot vong tuan hoan.

   ⚠️ Hieu chinh bien do: lan dau dat 7-16% trong 19-26 giay cho
   "diem tinh", ket qua ra khoang 5 pixel moi giay tren mot mang
   rong hon 1000px — nguoi dung bao thang la "nhin nhu anh tinh"
   va ho dung. Nen dong ma qua cham thi khong phai la kin dao, no
   chi la hong theo mot kieu kho nhan ra. Do lai bang cach tua
   `currentTime` roi doc `transform`, dung uoc luong bang mat.
   ============================================================ */
.ttv-aurora {
	position: fixed;
	inset: 0;
	z-index: 0;
	overflow: hidden;
	pointer-events: none;
	contain: strict;
	/* Nen duoi cung phai co mau, khong thi luc cac mang troi lech nhau
	   se ho ra mang trang o goc man hinh. */
	background: linear-gradient(150deg, #EFF8F5 0%, #F6FAF9 55%, #E9F5F1 100%);
}
.ttv-aurora i {
	position: absolute;
	border-radius: 50%;
	display: block;
	/* Lam mo o day AN TOAN vi chi anh hoat hinh `transform` va `opacity`:
	   trinh duyet dung anh mo mot lan roi chi dich chuyen va doi do trong
	   cua lop do. Dieu phai tranh la lam mo mot thu doi mau that. */
	filter: blur(22px);
	/* Nhan mau: cho hai mang chong len nhau thi cho giao dam han han. Nho
	   vay khi chung troi qua nhau, mau THAY DOI chu khong chi truot — day
	   moi la thu lam nguoi xem nhan ra la nen dang song. */
	mix-blend-mode: multiply;
	will-change: transform, opacity;
}
.ttv-aurora i:nth-child(1) {
	width: 82%; height: 92%; left: -18%; top: -26%;
	background: radial-gradient(circle at 50% 50%, rgba(80,175,164,.95), rgba(80,175,164,0) 68%);
	animation: ttvLoangA 17s ease-in-out infinite;
}
.ttv-aurora i:nth-child(2) {
	width: 76%; height: 84%; left: 38%; top: -30%;
	background: radial-gradient(circle at 50% 50%, rgba(123,207,194,.95), rgba(123,207,194,0) 66%);
	animation: ttvLoangB 23s ease-in-out infinite;
}
.ttv-aurora i:nth-child(3) {
	width: 84%; height: 90%; left: 18%; top: 28%;
	background: radial-gradient(circle at 50% 50%, rgba(62,120,197,.62), rgba(62,120,197,0) 68%);
	animation: ttvLoangC 29s ease-in-out infinite;
}
.ttv-aurora i:nth-child(4) {
	width: 70%; height: 78%; left: -20%; top: 36%;
	background: radial-gradient(circle at 50% 50%, rgba(183,232,224,1), rgba(183,232,224,0) 70%);
	animation: ttvLoangD 20s ease-in-out infinite;
}
/* Bien do gap doi ban truoc va chu ky ngan lai gan mot nua. Ban truoc
   dich 7-16% cua chinh mang trong 19-26 giay — ra khoang 5-12 pixel moi
   giay tren mot mang da lam mo, tuc la khong the nhan ra. Do trong doi
   theo la phan de thay nhat, hon han viec truot cho. */
@keyframes ttvLoangA {
	0%,100% { transform: translate(0,0) scale(1); opacity: .78 }
	33% { transform: translate(30%,17%) scale(1.26); opacity: 1 }
	66% { transform: translate(-16%,29%) scale(.84); opacity: .6 }
}
@keyframes ttvLoangB {
	0%,100% { transform: translate(0,0) scale(1); opacity: .68 }
	40% { transform: translate(-32%,24%) scale(1.28); opacity: 1 }
	70% { transform: translate(15%,-12%) scale(.82); opacity: .8 }
}
@keyframes ttvLoangC {
	0%,100% { transform: translate(0,0) scale(1); opacity: .85 }
	30% { transform: translate(-26%,-28%) scale(1.24); opacity: .55 }
	65% { transform: translate(23%,-8%) scale(.86); opacity: 1 }
}
@keyframes ttvLoangD {
	0%,100% { transform: translate(0,0) scale(1); opacity: .7 }
	45% { transform: translate(34%,-25%) scale(1.26); opacity: 1 }
	75% { transform: translate(11%,15%) scale(.88); opacity: .62 }
}

/* Lop lam diu giua nen va chu. Mong thoi — day qua thi mau bi rua het
   va nhin nhu nen trang tron. */
.ttv-aurora::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(246,250,249,.2), rgba(246,250,249,.46));
}
/* Trang chu dai thi lop nay day hon: doc muoi doan van can nen tinh
   hon la luot qua phan dau trang chu. */
body.ttv-chu-dai .ttv-aurora::after {
	background: linear-gradient(180deg, rgba(246,250,249,.44), rgba(246,250,249,.66));
}

/* ⚠️ Blocksy to nen DAC cho #main-container. De nguyen thi no phu kin
   nen loang va trang nhin nhu trang tron — dung luc do rat de tuong
   nen loang khong chay. Phai bo nen cua no di. */
body { background-color: var(--ttv-nen); }
#main-container {
	position: relative;
	z-index: 1;
	background-color: transparent !important;
}
#main-container > .ct-container,
#main-container > .ct-container-full,
.entry-content { background-color: transparent; }

/* Dai dau va chan trang de trong mo de nen chay xuyen qua, neu khong
   hai dai do cat nen thanh ba manh. Kem mot duong ke rat manh: nen
   trong mo nam tren vung mau nhat thi khong con gi tach no khoi noi
   dung, va thanh dieu huong troi lo lung. */
#header.ct-header, #footer.ct-footer { position: relative; z-index: 2; }
#header.ct-header [data-row] {
	background-color: rgba(255,255,255,.58) !important;
	backdrop-filter: blur(18px) saturate(1.4);
	-webkit-backdrop-filter: blur(18px) saturate(1.4);
	border-bottom: 1px solid rgba(68,107,110,.16);
	box-shadow: 0 1px 16px -8px rgba(37,54,56,.24);
}
#footer.ct-footer, #footer.ct-footer [data-row] {
	background-color: rgba(232,246,242,.52) !important;
	backdrop-filter: blur(18px) saturate(1.4);
	-webkit-backdrop-filter: blur(18px) saturate(1.4);
}
#footer.ct-footer { border-top: 1px solid rgba(68,107,110,.16); }

/* ============================================================
   TUONG PHAN CHU

   Sac nhan #50AFA4 dep lam nen nut, nhung lam MAU CHU tren nen
   sang thi chi dat 2,49:1 — duoi han nguong AA 4,5:1 va nguoi doc
   lon tuoi gan nhu khong thay. Lien ket trong noi dung doi sang
   #2B7A70 (4,84:1), sac nay von da co tren ai.thanhtravien.vn nen
   khong pha vo bang mau. Nut va mang nen van giu #50AFA4.
   ============================================================ */
#main-container a:not(.ct-button):not(.wp-block-button__link),
#footer a {
	color: #2B7A70;
}
#main-container a:not(.ct-button):not(.wp-block-button__link):hover,
#footer a:hover {
	color: #1F6E65;
}

/* ============================================================
   CUM PHIEN NOI
   Nguon la mot danh sach thuong trong trinh soan thao WordPress
   (<ul class="ttv-phien">). Khong co JavaScript thi no van la mot
   danh sach lien ket doc duoc — bo thu thap va trinh doc man hinh
   deu thay, va do cung la ly do khong dung canh 3D dung san.
   ============================================================ */
.ttv-canh {
	position: relative;
	min-height: 480px;
	perspective: 1150px;
	perspective-origin: 50% 46%;
	margin: 2.4rem 0 2.8rem;
}
.ttv-boong {
	position: absolute;
	inset: 0;
	transform-style: preserve-3d;
	transform: rotateX(calc(var(--ttv-rx,0) * 1deg)) rotateY(calc(var(--ttv-ry,0) * 1deg));
	transition: transform .5s cubic-bezier(.28,.78,.22,1);
	will-change: transform;
}
/* ⚠️ Khung va mat phang KHONG duoc hung con tro.
   Chung la hai the div phu kin ca vung canh. The nao khong co nen van
   hung con tro nhu thuong, nen phien nam SAU mat phang (toa do chieu sau
   am) thi con tro cham vao mat phang truoc, khong bao gio toi duoc phien
   — ca re chuot lan bam deu hong, va chi hong dung may phien do.
   Da gap: hai phien z = -16 va -15 khong bam duoc, bon phien z >= 3 thi
   binh thuong. */
.ttv-canh, .ttv-boong { pointer-events: none; }
.ttv-the { pointer-events: auto; }
.ttv-the {
	position: absolute;
	left: 50%;
	top: 50%;
	border-radius: 12px;
	padding: 12px 14px;
	background: rgba(255,255,255,.9);
	border: 1px solid rgba(80,175,164,.36);
	box-shadow: 0 18px 34px -24px rgba(30,48,51,.6);
	transform-style: preserve-3d;
	transition: transform .5s cubic-bezier(.28,.78,.22,1), box-shadow .34s,
		border-color .3s, background .3s, opacity .3s;
	animation: ttvTroi 8s ease-in-out infinite;
}
@keyframes ttvTroi {
	0%,100% { translate: 0 0 0 }
	50% { translate: 0 -10px 0 }
}
/* Re chuot vao thi phien tien ve phia truoc, to len va thang mat.
   Chi doi ba bien; toan bo phep bien doi van do JavaScript giu, xem
   chu thich trong ttv-giao-dien.js. */
.ttv-the:hover, .ttv-the:focus-within {
	--ttv-noi: 78px;
	--ttv-phong: 1.07;
	--ttv-xoay: .25;
	background: #fff;
	border-color: var(--ttv-mint);
	box-shadow: 0 30px 54px -26px rgba(30,48,51,.5);
	/* Dung troi trong luc dang xem cho khoi rung */
	animation-play-state: paused;
	transition: transform .34s cubic-bezier(.22,.8,.28,1),
		box-shadow .34s, border-color .24s, background .24s;
}
/* Cac phien con lai lui lai mot chut cho cai dang xem noi han */
.ttv-boong:hover .ttv-the:not(:hover) { opacity: .72; }
.ttv-nhan {
	display: inline-block;
	font-size: .68rem;
	font-weight: 600;
	letter-spacing: .08em;
	color: #2C7A70;
	background: #E1F4EF;
	border-radius: 99px;
	padding: 2px 8px;
	margin-bottom: 6px;
}
.ttv-the a {
	display: block;
	font-size: .95rem;
	font-weight: 600;
	color: var(--ttv-muc);
	text-decoration: none;
	line-height: 1.3;
}
.ttv-the a:hover, .ttv-the a:focus-visible { color: var(--ttv-mint-dam); text-decoration: underline; }
.ttv-mota {
	display: block;
	font-size: .78rem;
	color: var(--ttv-ngoc);
	margin-top: 3px;
	line-height: 1.45;
}
/* Vung bam phu ca the, khong bat nguoi dung nham dung chu */
.ttv-the { cursor: pointer; }
.ttv-the a::after { content: ""; position: absolute; inset: 0; border-radius: 12px; }

/* Mui ten bao cho biet bam duoc. Trong khung phien, tieu de khong gach
   chan nen no trong y het mot dong chu thuong — chu quan bao thang la
   "khong co link de bam" trong khi lien ket van o do. Dau hieu nhin thay
   duoc quan trong khong kem viec lien ket ton tai. */
.ttv-the::after {
	content: "→";
	position: absolute;
	right: 13px;
	bottom: 9px;
	font-size: .95rem;
	line-height: 1;
	color: #2B7A70;
	opacity: .45;
	transition: opacity .24s, transform .24s;
}
.ttv-the:hover::after, .ttv-the:focus-within::after {
	opacity: 1;
	transform: translateX(4px);
}
/* Chua cho mui ten khoi de len chu */
.ttv-mota { padding-right: 20px; }

/* Danh sach nguon: an di sau khi JavaScript da dung xong canh.
   Chi an bang thuoc tinh do JavaScript dat, de khi mã khong chay
   thi danh sach van hien nguyen. */
.ttv-phien[hidden] { display: none; }

@media (max-width: 800px) {
	/* Dien thoai khong co con tro nen mat phan nghieng; xep doc lai
	   cho doc duoc, dung co ep canh 3D vao man hinh hep. */
	.ttv-canh { min-height: 0; perspective: none; margin: 1.4rem 0 1.8rem; }
	.ttv-boong { position: static; transform: none !important; display: grid; gap: 10px; }
	.ttv-the {
		position: static;
		width: auto !important;
		margin: 0 !important;
		transform: none !important;
		animation: none;
	}
}

/* ============================================================
   GIAM CHUYEN DONG — dieu lai, khong tat han

   Ban dau khoi nay dat `animation: none`. Hau qua: may nao bat
   giam chuyen dong thi nen dung im nhu mot tam anh, va nguoi xem
   ket luan la hieu ung khong chay chu khong nghi den cai dat may
   minh. Da gap dung tinh huong do ngay 16/8/2026.

   Nay chay ban diu: bien do con khoang 45%, BO HAN phan phong to
   thu nho, va keo dai chu ky hon gap doi. Phong to thu nho la thu
   de gay chong mat nhat trong ba loai, nen do la thu bo truoc.
   Van con chuyen dong de nhin ra, nhung cham va nho.
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
	.ttv-aurora i:nth-child(1) { animation: ttvLoangDiuA 24s ease-in-out infinite; }
	.ttv-aurora i:nth-child(2) { animation: ttvLoangDiuB 31s ease-in-out infinite; }
	.ttv-aurora i:nth-child(3) { animation: ttvLoangDiuC 37s ease-in-out infinite; }
	.ttv-aurora i:nth-child(4) { animation: ttvLoangDiuD 28s ease-in-out infinite; }
	.ttv-the { animation: ttvTroiDiu 16s ease-in-out infinite; }
	.ttv-boong { transition: none !important; }
}
/* Ban diu VAN phai nhin ra duoc. Giu do trong doi theo — do la phan de
   thay ma khong gay chong mat — chi bo phan phong to thu nho va ha bien
   do truot con khoang mot nua. */
@keyframes ttvLoangDiuA {
	0%,100% { transform: translate(0,0); opacity: .74 }
	33% { transform: translate(22%,13%); opacity: 1 }
	66% { transform: translate(-12%,21%); opacity: .62 }
}
@keyframes ttvLoangDiuB {
	0%,100% { transform: translate(0,0); opacity: .68 }
	40% { transform: translate(-24%,18%); opacity: 1 }
	70% { transform: translate(11%,-9%); opacity: .8 }
}
@keyframes ttvLoangDiuC {
	0%,100% { transform: translate(0,0); opacity: .86 }
	30% { transform: translate(-20%,-21%); opacity: .58 }
	65% { transform: translate(17%,-6%); opacity: 1 }
}
@keyframes ttvLoangDiuD {
	0%,100% { transform: translate(0,0); opacity: .7 }
	45% { transform: translate(25%,-18%); opacity: 1 }
	75% { transform: translate(8%,11%); opacity: .66 }
}
@keyframes ttvTroiDiu {
	0%,100% { translate: 0 0 0 }
	50% { translate: 0 -5px 0 }
}