/* Chi phan dau trang / chan trang - dung o TRANG BAI VIET, noi CSS goc cua theme apkfab lo phan than trang. Khong dua cac quy tac chung (body, img, *) vao day vi chung de len CSS goc va lam vo bo cuc. */ :root { --bg: #f6f9fc; --surface: #ffffff; --surface-2: #f9f9f9; --border: #e8ecf1; --text: #222222; --muted: #9f9f9f; --muted-2: #6f6f6f; --brand: #0284fe; --brand-dim: #3483ce; --star: #ff9500; --radius: 8px; --maxw: 1200px; } .site-head { background: var(--surface); border-bottom: 1px solid var(--border); position: sticky; top: 0; z-index: 50; } .site-head .wrap { display: flex; align-items: center; gap: 20px; height: 58px; } .site-head .wrap { height: auto; padding: 9px 16px; flex-wrap: wrap; gap: 9px; } .brand { display: flex; align-items: center; gap: 9px; font-weight: 700; font-size: 18px; white-space: nowrap; color: var(--text); } .brand img { width: 34px; height: 34px; border-radius: 7px; flex-shrink: 0; } .brand .brand-text span { color: var(--brand); } .nav { display: flex; gap: 2px; overflow-x: auto; flex: 1; } .nav::-webkit-scrollbar { height: 0; } .nav a { padding: 6px 12px; border-radius: 6px; color: var(--muted-2); font-size: 14px; white-space: nowrap; } .nav a:hover { color: var(--brand); } .nav a.on { color: var(--brand); font-weight: 600; } .search input { background: var(--surface-2); border: 1px solid var(--border); color: var(--text); border-radius: 20px; padding: 7px 16px; font-size: 13px; width: 180px; } .search input:focus { outline: none; border-color: var(--brand); background: #fff; } .site-foot { background: var(--surface); border-top: 1px solid var(--border); margin-top: 36px; padding: 24px 0; color: var(--muted); font-size: 13px; } .wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 16px; } /* ---------- Nut "Xem them" o trang bai viet ---------- */ /* CSS goc CHI gioi han chieu cao khi noi dung nam trong .packageInfo - trang chi tiet KHONG co lop do, nen noi dung hien day du va nut "Xem them" chi la phan trang tri con sot lai. Truoc day toi tu them max-height o day va vo tinh cat mat noi dung - dung lai loi cua chinh minh. */ /* Nut "Xem them" hoat dong that. CSS goc dat gioi han o '.detail-describe .text{max-height:200px}' - KHONG phai '.packageInfo .pre_description' nhu toi tra nham luc truoc. Ban goc dung app.js de mo rong; o day dung class 'show' cho gon. */ .detail-describe .text.show { max-height: none !important; } .detail-describe .text.show .more-btn { display: none; } /* ---------- Day chan trang xuong day man hinh ---------- */ /* KHONG dung flex/grid tren : trang chu co nhieu khoi 'body > .wrap' (banner, Noi bat, luoi bai) - bien chung thanh flex/grid item lam chung co lai va lech giua. Da thu ca hai, deu vo bo cuc. Cach an toan: de dong chay binh thuong, chi dam bao chan trang khong bao gio nam cao hon day man hinh bang min-height tren chinh no. */ .site-foot { margin-top: 36px; } @supports (min-height: 100dvh) { .site-foot { min-height: 0; } } /* Anh icon o dau bai: khung la o vuong 80x80 nhung anh dai dien thuong la 16:9. Neu ban cat vuong cua WordPress khong co (anh cu tu ban dump, hoac logo thay the) thi trinh duyet se nen anh cho vua o vuong -> meo hinh. object-fit:cover cat bot hai ben thay vi bop meo. */ .detail-info .icon img { object-fit: cover; width: 80px; height: 80px; } /* Day sao cham diem: chi doi con tro khi CON cham duoc (rate.js gan lop .tmc-rate-live). Da cham roi thi de nguyen, khoi tuong con bam duoc. */ .rmp-rating-widget__icons-list.tmc-rate-live .rmp-rating-widget__icons-list__icon { cursor: pointer; } .rmp-rating-widget__icons-list.tmc-rate-live .rmp-rating-widget__icons-list__icon:hover { transform: scale(1.08); } .rate-msg { margin-top: 6px; font-size: 13px; color: var(--muted, #8a94a6); text-align: center; } /* O du phong trong khoi "Anh mo ta": ban goc luon hien khoi nay, nen bai thieu anh van giu khung cho bo cuc dong deu - nhung ve o mau nhat kem logo thay vi the hong (o trang + icon anh vo). */ .screenshots-box .shot-ph { display: inline-flex; align-items: center; justify-content: center; width: 190px; height: 250px; margin-right: 8px; vertical-align: top; border-radius: 6px; overflow: hidden; } .screenshots-box .shot-ph img { width: 54px; height: 54px; border-radius: 10px; opacity: .75; object-fit: contain; } @media (max-width: 640px) { .screenshots-box .shot-ph { width: 132px; height: 180px; } }