/*
Theme Name: Essentials Child HOSO
Theme URI: https://tuigiayhoso.com
Description: Child theme cua Essentials, giu cac tuy chinh rieng cua HOSO de update theme cha khong lam mat.
Author: HOSO
Template: essentials
Version: 1.0.0
*/

/* H1 rieng cho trang chu, chuyen tu Customizer sang day
   de doi theme khong lam no hien ra. */
/* #theh1 da go 18/08/2026 — hero la H1 that, khong con H1 an de phai giau */

/* Muc menu trong dropdown: doi tu xam nhat sang nau thuong hieu.
   Chu site yeu cau 17/08 vi mau cu qua mo, kho doc.
   Theme dat mau xam bang !important nen phai khop selector va dung !important. */
.dropdown-item .pix-dropdown-title,
.dropdown-item .pix-dropdown-title::after,
.dropdown-item::after {
	color: #603813 !important;
}
.dropdown-item:hover .pix-dropdown-title,
.dropdown-item:hover .pix-dropdown-title::after,
.dropdown-item:hover::after {
	color: #4a7a10 !important;
}
/* Icon canh chu cung doi cho dong bo, neu de xam se lech tong. */
.dropdown-item .pix-menu-item-icon,
.dropdown-item .pix-menu-item-icon i {
	color: #603813 !important;
}
.dropdown-item:hover .pix-menu-item-icon,
.dropdown-item:hover .pix-menu-item-icon i {
	color: #4a7a10 !important;
}

/* ============================================================
   Nut chinh: chu nau dam thay vi chu trang. Chu site chot 17/08/2026.
   Ly do: chu trang tren #78bc20 chi dat 2,33:1, truot WCAG AA.
   Chu #2E2118 tren #78bc20 dat 6,69:1.

   PHAI sua ca hover, khong thi sua nua voi:
   hover cua theme doi nen sang #5c9019, ma nen do TRUOT AA voi ca hai
   mau chu (chu trang 3,85:1 va chu nau dam 4,05:1).
   Doi nen hover sang #4A7A10 thi chu trang dat 5,14:1.

   Theme dat mau chu qua bien --pix-btn-color, dat ca bien lan color
   cho chac vi mot so rule cua theme ghi color truc tiep.
   ============================================================ */
.btn-primary {
	--pix-btn-color: #2E2118 !important;
	color: #2E2118 !important;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary.focus {
	--pix-btn-background: #4A7A10 !important;
	background-color: #4A7A10 !important;
	color: #fff !important;
}
.btn-primary:not(.btn-custom-bg):active,
.btn-primary:not(.btn-custom-bg).active,
.show > .btn-primary.dropdown-toggle {
	background-color: #4A7A10 !important;
	color: #fff !important;
}

/* ============================================================
   Ton trong thiet lap giam chuyen dong cua nguoi dung.
   pixfort 4.2.0 KHONG co bao ve nay: ho transition cua no
   ([data-anim-type="fade-in-up"] ...) chay bat ke prefers-reduced-motion.

   Khong the chi tat transition, vi .animate-in tu no la lenh an
   (visibility:hidden;opacity:0) va chi duoc JS go bo khi chay hieu ung.
   Nen phai ep hien luon, roi moi tat chuyen dong.
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
	.animate-in,
	.group-animate-in {
		visibility: visible !important;
		opacity: 1 !important;
	}
	[data-anim-type]:not(.animated),
	[data-anim-type] .pix-sliding-item {
		transition: none !important;
		animation: none !important;
		opacity: 1 !important;
		transform: none !important;
	}
}

/* ============================================================
   Bang phi in tren /bang-gia-in-tui-giay/ (page 14801).
   Bang nay la HTML trong vc_column_text, khong phai shortcode,
   vi pixfort khong co element bang du lieu nhieu dong.
   Dau bang xanh thuong hieu, chu #2E2118 dat 6,69:1.
   ============================================================ */
.hoso-bang-phi-in {
	width: 100%;
	border-collapse: collapse;
	font-variant-numeric: tabular-nums;
	border: 1px solid #E8D9C4;
	border-radius: 10px;
	overflow: hidden;
}
.hoso-bang-phi-in th,
.hoso-bang-phi-in td { padding: 15px 20px; text-align: left; }
.hoso-bang-phi-in thead th {
	background: #78bc20;
	color: #2E2118;
	font-family: "Roboto Serif", Times, serif;
	font-weight: 700;
	font-size: 15px;
}
.hoso-bang-phi-in thead th:nth-child(2) { background: #4A7A10; color: #ffffff; }
.hoso-bang-phi-in thead th:nth-child(2),
.hoso-bang-phi-in thead th:nth-child(3),
.hoso-bang-phi-in tbody td { text-align: right; }
.hoso-bang-phi-in tbody th,
.hoso-bang-phi-in tbody td { border-top: 1px solid #E8D9C4; font-weight: 500; }
.hoso-bang-phi-in tbody td { font-weight: 700; }
.hoso-bang-phi-in tbody td:first-of-type {
	background: rgba(120, 188, 32, 0.13);
	color: #4A7A10;
}
.hoso-bang-phi-in tbody tr:nth-child(even) th { background: #FDFAF5; }
.hoso-bang-phi-in caption {
	caption-side: bottom;
	padding: 14px 20px 0;
	text-align: left;
	color: #8a6a4a;
	font-size: 15px;
}
@media (max-width: 767px) {
	.hoso-bang-phi-in th,
	.hoso-bang-phi-in td { padding: 11px 12px; font-size: 14px; }
}

/* 8. The nen xanh gradient: dat mau o the cha roi de con ke thua.
   Khong nham vao span nua, vi span:not(...) co do uu tien 5 lop,
   thang ca luat nhan va luat nut, lam chu trang tren nen trang. */
.pix_pricing.bg-gradient-primary,
.pix-content-box.hoso-box3-da-bo,
.pix-content-box.vc_custom_hoso_ss2 {
    color: #ffffff !important;
}
.pix_pricing.bg-gradient-primary > *:not(.btn),
.pix-content-box.hoso-box3-da-bo > *:not(.btn),
.pix-content-box.vc_custom_hoso_ss2 > *:not(.btn),
.pix-content-box.hoso-box3-da-bo h1, .pix-content-box.hoso-box3-da-bo h2,
.pix-content-box.hoso-box3-da-bo h3, .pix-content-box.hoso-box3-da-bo h4,
.pix-content-box.hoso-box3-da-bo h5, .pix-content-box.hoso-box3-da-bo h6,
.pix-content-box.hoso-box3-da-bo p,
.pix-content-box.vc_custom_hoso_ss2 h1, .pix-content-box.vc_custom_hoso_ss2 h2,
.pix-content-box.vc_custom_hoso_ss2 h3, .pix-content-box.vc_custom_hoso_ss2 h4,
.pix-content-box.vc_custom_hoso_ss2 h5, .pix-content-box.vc_custom_hoso_ss2 h6,
.pix-content-box.vc_custom_hoso_ss2 p,
.pix-content-box.vc_custom_hoso_ss2 li {
    color: #ffffff !important;
}
.pix-content-box.hoso-box3-da-bo .pixfort-icon,
.pix-content-box.vc_custom_hoso_ss2 .pixfort-icon {
    --pf-icon-color: #ffffff !important;
}
/* Nhan va nut co nen sang rieng nen phai giu chu mau nau */
.pix-content-box.vc_custom_hoso_ss2 .pix-badge,
.pix-content-box.vc_custom_hoso_ss2 [class*="vc_custom_hoso_ss2b"],
.pix-content-box.vc_custom_hoso_ss2 .btn,
.pix-content-box.vc_custom_hoso_ss2 .btn span,
.pix_pricing.bg-gradient-primary .btn,
.pix_pricing.bg-gradient-primary .btn span {
    color: #2E2118 !important;
}
.pix-content-box.vc_custom_hoso_ss2 .btn,
.pix_pricing.bg-gradient-primary .btn {
    background-color: #ffffff !important;
    background-image: none !important;
    border-color: #ffffff !important;
    --pix-btn-color: #2E2118 !important;
}

/* 9. Mobile: bang phi in la nguyen nhan tran ngang ca trang -> cho bang tu cuon */
@media (max-width: 767px){
  .hoso-bang-phi-in{display:block;width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .hoso-bang-phi-in tbody, .hoso-bang-phi-in thead{display:table;width:100%;min-width:520px;}
  .hoso-bang-phi-in th, .hoso-bang-phi-in td{white-space:normal;}
}
/* 10. Mobile: thu gon dem doc cac khoi cho khoi trong trai */
@media (max-width: 767px){
  .vc_custom_hoso_hero{padding-top:36px !important;padding-bottom:24px !important;}
  .vc_custom_hoso_bakhong{padding-top:56px !important;}
  .vc_custom_hoso_bakhong2{padding-bottom:56px !important;}
  .vc_custom_hoso_phiin, .vc_custom_hoso_visao, .vc_custom_hoso_giatui,
  .vc_custom_hoso_quytrinh, .vc_custom_hoso_faq{padding-top:56px !important;}
  .vc_custom_hoso_quytrinh2{padding-bottom:56px !important;}
  .vc_custom_hoso_chot{padding-top:56px !important;padding-bottom:56px !important;}
}
/* 10b. WPBakery in CSS noi tuyen sau file nay nen phai nang do uu tien bang .vc_row */
@media (max-width: 767px){
  .vc_row.vc_custom_hoso_hero{padding-top:36px !important;padding-bottom:24px !important;}
  .vc_row.vc_custom_hoso_bakhong{padding-top:56px !important;}
  .vc_row.vc_custom_hoso_bakhong2{padding-bottom:56px !important;}
  .vc_row.vc_custom_hoso_phiin, .vc_row.vc_custom_hoso_visao, .vc_row.vc_custom_hoso_giatui,
  .vc_row.vc_custom_hoso_quytrinh, .vc_row.vc_custom_hoso_faq{padding-top:56px !important;}
  .vc_row.vc_custom_hoso_quytrinh2{padding-bottom:56px !important;}
  .vc_row.vc_custom_hoso_chot{padding-top:56px !important;padding-bottom:56px !important;}
}
/* 8b. Hai the so sanh: vien nhe cho the trang, hai the cao bang nhau */
.pix-content-box.vc_custom_hoso_ss1{border:1px solid #E8D9C4 !important;}
.vc_custom_hoso_visao .vc_row.vc_inner > .wpb_column{display:flex;}
.vc_custom_hoso_visao .vc_row.vc_inner > .wpb_column > .vc_column-inner,
.vc_custom_hoso_visao .vc_row.vc_inner > .wpb_column > .vc_column-inner > .wpb_wrapper{width:100%;display:flex;flex-direction:column;}
.pix-content-box.vc_custom_hoso_ss1, .pix-content-box.vc_custom_hoso_ss2{height:100%;}
/* 11. Anh hero dung tu template: gioi han be ngang cho khoi khong chiem het man hinh */
.vc_custom_hoso_heroimg img{max-width:560px !important;width:100% !important;height:auto;margin-left:auto;margin-right:auto;display:block;}
/* 12. pix_highlight_box: bo d-inline-flex lam the chi rong 443px, cho chiem het cot */
.pix-content-box > .d-inline-flex{display:flex !important;width:100%;}
.pix-content-box > .d-inline-flex > .card.no-gutters{width:100%;border:1px solid #E8D9C4 !important;}

/* 13. Nen trang toan trang. Phan cach cac section bang duong ke manh mo dan,
   nhe hon dai song pix_dividers va hop tong in an hon. */
.hoso-sec { position: relative; }
.hoso-sec ~ .hoso-sec::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: min(1250px, calc(100% - 40px));
    height: 1px;
    background: linear-gradient(to right, rgba(232,217,196,0), #E8D9C4 22%, #E8D9C4 78%, rgba(232,217,196,0));
}
/* Khoi quy trinh co nen rieng nen khong can them duong ke.
   Hai hang: quytrinh la hang tieu de, quytrinh2 la hang bon the. Ban dau
   chi tat cho hang dau nen hang bon the van keo mot vach ngang qua dinh
   bon the. Sua 18/08/2026 theo yeu cau chu site. */
.hoso-sec.vc_custom_hoso_quytrinh::before,
.hoso-sec.vc_custom_hoso_quytrinh2::before { display: none; }

/* 14. Bon the "Tu luc dat den luc nhan": deu trang, vien xanh la */
.pix-content-box.vc_custom_hoso_box1,
.pix-content-box.vc_custom_hoso_box2,
.pix-content-box.vc_custom_hoso_box3,
.pix-content-box.vc_custom_hoso_box4 {
    background-color: #ffffff !important;
    border: 1.5px solid #78bc20 !important;
    border-radius: 12px !important;
}

/* 15. Bang phi in: bo goc va vien */
.hoso-bang-phi-in {
    border: 1px solid #E8D9C4 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
}
.hoso-bang-phi-in thead th:first-child { border-top-left-radius: 11px; }
.hoso-bang-phi-in thead th:last-child { border-top-right-radius: 11px; }
.hoso-bang-phi-in tbody tr:last-child th:first-child,
.hoso-bang-phi-in tbody tr:last-child td:first-child { border-bottom-left-radius: 11px; }
.hoso-bang-phi-in tbody tr:last-child td:last-child { border-bottom-right-radius: 11px; }

/* 16. Hai danh sach so sanh: dau cheo mau trung tinh de doc ra y phu dinh,
   dau tich mau xanh thuong hieu. */
.hoso-list-khong .pixfort-icon { --pf-icon-color: #A79684 !important; }
.hoso-list-khong span { color: #6B5B4A !important; }
.hoso-list-co .pixfort-icon { --pf-icon-color: #78bc20 !important; }

/* 17. Dai chuong trinh in thu mien phi: co nen xanh rieng nen khong ve duong ke,
   va bao dam chu tren nen xanh luon doc duoc. */
.hoso-uudai::before { display: none !important; }
.hoso-uudai .pixfort-icon { --pf-icon-color: #ffffff !important; }
.hoso-uudai .pix-badge, .hoso-uudai [class*="uudaibadge"] { color: #2E2118 !important; }

/* 18. Nut xanh: chu trang. #78bc20 voi chu trang chi dat 2,33:1 nen khong doc duoc,
   dung xanh dam #4A7A10 cua bo token de len 5,14:1, dat chuan AA. */
.btn-primary-phang-da-bo {
    background-color: #4A7A10 !important;
    background-image: none !important;
    border-color: #4A7A10 !important;
    color: #ffffff !important;
    --pix-btn-color: #ffffff !important;
}
.btn-primary-phang-da-bo:hover,
.btn-primary-phang-da-bo:focus {
    background-color: #3C640D !important;
    border-color: #3C640D !important;
    color: #ffffff !important;
}
.btn-primary-phang-da-bo .pixfort-icon { --pf-icon-color: #ffffff !important; }

/* 19. Dai in thu mien phi, dung theo khoi promo cua ban demo restaurant:
   the trang bo goc noi tren nen co hai dai cong mau. Ban restaurant dung
   pix_dividers, o day ve bang CSS de chu dong mau theo token HOSO. */
.hoso-promo { position: relative; overflow: hidden; background-color: #ffffff; }
.hoso-promo-cu::before {
    content: ""; position: absolute; z-index: 0;
    left: -14%; top: 30%; width: 78%; height: 260px;
    background: linear-gradient(to right, rgba(240,219,192,.55), rgba(234,245,218,.9));
    border-radius: 50% / 100%;
    transform: rotate(-7deg);
}
.hoso-promo-cu::after {
    content: ""; position: absolute; z-index: 0;
    right: -10%; top: 14%; width: 46%; height: 210px;
    background: linear-gradient(to right, #78bc20, #4eb200);
    border-radius: 120px 0 0 120px;
    transform: rotate(-6deg);
    opacity: .92;
}
.hoso-promo > .vc_row, .hoso-promo .wpb_column { position: relative; z-index: 1; }
.hoso-promo .card {
    box-shadow: 0 26px 64px rgba(46, 33, 24, .14) !important;
    border: none !important;
}
.hoso-promo-cu::before, .hoso-promo-cu::after { pointer-events: none; }
@media (max-width: 767px) {
    .hoso-promo-cu::before, .hoso-promo-cu::after { display: none; }
    .hoso-promo { padding-top: 56px !important; padding-bottom: 56px !important; }
}

/* 19b. Hai dai nen ve lai thanh net cong quet nhu ban restaurant,
   thay vi thanh chu nhat cung. */
.hoso-promo-cu::before {
    left: -22% !important;
    top: 46% !important;
    width: 96% !important;
    height: 420px !important;
    border-radius: 50% / 100% !important;
    transform: rotate(-10deg) !important;
    background: linear-gradient(to right, rgba(240,219,192,.75), rgba(234,245,218,.65)) !important;
}
.hoso-promo-cu::after {
    right: -26% !important;
    top: 6% !important;
    width: 66% !important;
    height: 380px !important;
    border-radius: 50% / 100% !important;
    transform: rotate(-10deg) !important;
    background: linear-gradient(to right, rgba(120,188,32,.92), rgba(78,178,0,.92)) !important;
    opacity: 1 !important;
}

/* 20. Ve lai nen dai in thu y het ban restaurant: mot cung tron HAI MAU quet tu
   goc duoi ben trai, va mot dai bo cong hai mau o mep phai. */
.hoso-promo { position: relative; overflow: hidden; background-color: #ffffff; }
.hoso-promo-cu::before {
    content: ""; position: absolute; z-index: 0;
    left: -26%; bottom: -168%;
    width: 118%; height: 0; padding-bottom: 118%;
    border-radius: 50% !important;
    border: 52px solid #78bc20 !important;
    box-shadow: 0 0 0 44px rgba(240, 219, 192, .72) !important;
    background: none !important;
    transform: none !important;
    opacity: 1 !important;
}
.hoso-promo-cu::after {
    content: ""; position: absolute; z-index: 0;
    right: 0 !important; left: auto !important; top: 16% !important;
    width: 30% !important; height: 240px !important;
    border-radius: 130px 0 0 130px !important;
    background: linear-gradient(to bottom, #78bc20 0, #78bc20 52%, #F6EBDA 52%, #F6EBDA 100%) !important;
    transform: none !important;
    opacity: 1 !important;
    box-shadow: none !important;
    border: 0 !important;
}
.hoso-promo > .vc_row, .hoso-promo .wpb_column { position: relative; z-index: 1; }
@media (max-width: 991px) {
    .hoso-promo-cu::before, .hoso-promo-cu::after { display: none !important; }
}

/* 21. The hero dung chung kieu voi the promo: bong do va nhan noi.
   Khong ve dai cong o day de hai khoi lien tiep khong bi trung nhau. */
.hoso-hero-card .card {
    box-shadow: 0 26px 64px rgba(46, 33, 24, .14) !important;
    border: none !important;
}
.hoso-hero-card .badge {
    box-shadow: 0 10px 28px rgba(46, 33, 24, .13) !important;
}

/* 22. Nut dung gradient xanh goc cua theme, giong nut "Nhan tu van" o trang chu. */
.btn-gradient-primary { color: #ffffff !important; --pix-btn-color: #ffffff !important; }
.btn-gradient-primary .pixfort-icon { --pf-icon-color: #ffffff !important; }

/* 23. Bon the khoi "Nhung rang buoc": vien xanh khi ro chuot, nhac len va
   doi mau icon, dong bo voi bon the "Tu luc dat den luc nhan". */
.pix-content-box.vc_custom_1773844599875 {
    border: 1.5px solid #E8D9C4 !important;
    border-radius: 12px !important;
    transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease, background-color .28s ease;
}
.pix-content-box.vc_custom_1773844599875:hover {
    border-color: #78bc20 !important;
    background-color: #FBFDF7 !important;
    transform: translateY(-6px);
    box-shadow: 0 18px 38px rgba(74, 122, 16, .16) !important;
}
.pix-content-box.vc_custom_1773844599875:hover .pixfort-icon {
    --pf-icon-color: #4A7A10 !important;
}
.pix-content-box.vc_custom_1773844599875:hover .pix-feature-title {
    color: #4A7A10 !important;
}

/* 24. Nut vien xanh: giu bo goc goc, chu nau, vao chuot moi do mau. */
.btn-outline-primary {
    border: 1px solid #78bc20 !important;
    color: #603813 !important;
    background-color: transparent !important;
    background-image: none !important;
    transition: background-color .25s ease, color .25s ease, border-color .25s ease;
}
.btn-outline-primary:hover, .btn-outline-primary:focus {
    background-image: linear-gradient(to right, #4eb200, #67ba12, #78bc20) !important;
    border-color: #4eb200 !important;
    color: #ffffff !important;
    --pix-btn-color: #ffffff !important;
}
.btn-outline-primary:hover .pixfort-icon { --pf-icon-color: #ffffff !important; }


/* 25. Chip toc do dung tren tieu de: nen trang co bong nhe, chu gradient xanh,
   dong bo voi chip "In thu mien phi" o duoi trang. */
.pix-badge-element:has(.vc_custom_hoso_chiptoc) {
    display: block !important;
    width: 100%;
    margin-bottom: 18px !important;
}
.vc_custom_hoso_chiptoc {
    box-shadow: 0 8px 22px rgba(46, 33, 24, .10) !important;
    letter-spacing: .2px;
}

/* 26. Nut vien: theme cong them box-shadow inset 2px chong len vien 1px nen
   nhin day gap ba. Bo lop bong do, chi giu dung mot duong 1px. */
.btn-outline-primary {
    box-shadow: none !important;
    border-width: 1px !important;
}
.btn-outline-primary:hover, .btn-outline-primary:focus {
    box-shadow: none !important;
}

/* 27. Tieu de cac khoi noi dung viet in hoa, dong bo voi tieu de trang.
   Gioi han trong trang 14801 vi tep nay dung chung ca site. */
.page-id-14801 .pix-sliding-text,
.page-id-14801 .pix-heading-el .heading-text,
.page-id-14801 .pix-heading-el h1,
.page-id-14801 .pix-heading-el h2,
.page-id-14801 .pix-heading-el h3 {
    text-transform: uppercase;
}

/* 27b. In hoa ca tieu de trong tung the (pix_feature) va tieu de cau hoi FAQ. */
.page-id-14801 .pix-feature-title,
.page-id-14801 .accordion .pix-accordion-title,
.page-id-14801 .accordion-card .accordion-title {
    text-transform: uppercase;
}

/* 28. Tieu de khoi chot can giua cho khop doan van va hai nut. */
.page-id-14801 .vc_custom_1773703682619 .pix-sliding-text,
.page-id-14801 .vc_custom_1773703682619 .pix-sliding-text > * {
    text-align: center !important;
    justify-content: center !important;
}

/* 29. The buoc 3 hover giong ba the con lai: do gradient xanh, chu va icon trang. */
.page-id-14801 .pix-content-box.vc_custom_hoso_box3:hover,
.page-id-14801 .pix-content-box.hoso-box3-da-bo:hover {
    background-image: linear-gradient(to right, #4eb200, #67ba12, #78bc20) !important;
    background-color: transparent !important;
    border-color: #4eb200 !important;
}
.page-id-14801 .pix-content-box.vc_custom_hoso_box3:hover .pix-feature-title,
.page-id-14801 .pix-content-box.vc_custom_hoso_box3:hover .pix-feature-content,
.page-id-14801 .pix-content-box.vc_custom_hoso_box3:hover p,
.page-id-14801 .pix-content-box.hoso-box3-da-bo:hover .pix-feature-title,
.page-id-14801 .pix-content-box.hoso-box3-da-bo:hover .pix-feature-content,
.page-id-14801 .pix-content-box.hoso-box3-da-bo:hover p {
    color: #ffffff !important;
}
.page-id-14801 .pix-content-box.vc_custom_hoso_box3:hover .pixfort-icon,
.page-id-14801 .pix-content-box.hoso-box3-da-bo:hover .pixfort-icon {
    --pf-icon-color: #ffffff !important;
}

/* 30. Cau dan cua tung section can giua cho khop tieu de. Chi nham vao doan
   nam truc tiep trong cot cua section, khong dung toi doan ben trong the
   (the so sanh va the in thu van can trai). */
.page-id-14801 .wpb_column > .vc_column-inner > .wpb_wrapper > .pix-text-el,
.page-id-14801 .wpb_column > .vc_column-inner > .wpb_wrapper > .pix-text-el * {
    text-align: center !important;
}
.page-id-14801 .card .pix-text-el,
.page-id-14801 .card .pix-text-el * {
    text-align: left !important;
}

/* 30b. Bo chon con truc tiep khong khop vi WPBakery long them lop. Noi rong:
   moi doan dan trong trang can giua, tru doan nam trong the. */
.page-id-14801 .wpb_wrapper > .pix-text-el,
.page-id-14801 .wpb_wrapper > .pix-text-el p,
.page-id-14801 .wpb_wrapper > .pix-text-el span,
.page-id-14801 .vc_column-inner .pix-text-el:not(.card *) {
    text-align: center !important;
}
.page-id-14801 .card .pix-text-el,
.page-id-14801 .card .pix-text-el p,
.page-id-14801 .card .pix-text-el span,
.page-id-14801 .card-body .pix-text-el {
    text-align: left !important;
}

/* 31. Bon the "Nhung rang buoc": chu dang dinh nhau va lech trai trong khi
   bon the quy trinh can giua. Cho tho hon va dong bo hai khoi. */
.page-id-14801 .pix-content-box.vc_custom_1773844599875 {
    padding: 34px 26px !important;
    text-align: center !important;
}
.page-id-14801 .vc_custom_1773844599875 .pix-feature-el,
.page-id-14801 .vc_custom_1773844599875 .pix-feature-el * {
    text-align: center !important;
}
.page-id-14801 .vc_custom_1773844599875 .pixfort-icon {
    margin: 0 auto 18px !important;
    display: block !important;
}
.page-id-14801 .vc_custom_1773844599875 .pix-feature-title {
    font-size: 16px !important;
    line-height: 1.45 !important;
    letter-spacing: .4px;
    margin-bottom: 12px !important;
    padding-bottom: 0 !important;
}
.page-id-14801 .vc_custom_1773844599875 .pix-feature-content {
    font-size: 14.5px !important;
    line-height: 1.75 !important;
    color: #6B5B4A !important;
}

/* 32. Thiet ke lai bang phi in: bo vien ke o, dung khoang tho va mot cot
   duoc nhan manh. Cot "Mua kem tui tai HOSO" la lua chon co loi nen duoc
   to dam bang nen xanh nhat va vien hai ben. */
.page-id-14801 .hoso-bang-phi-in {
    border: 0 !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    box-shadow: 0 10px 34px rgba(46, 33, 24, .09) !important;
    font-variant-numeric: tabular-nums;
}
.page-id-14801 .hoso-bang-phi-in thead th {
    background: linear-gradient(to right, #4A7A10, #62a015) !important;
    color: #ffffff !important;
    text-transform: uppercase;
    letter-spacing: .6px;
    font-size: 13px !important;
    padding: 20px 22px !important;
    border: 0 !important;
}
.page-id-14801 .hoso-bang-phi-in thead th:nth-child(2) {
    background: linear-gradient(to right, #3C640D, #4eb200) !important;
}
.page-id-14801 .hoso-bang-phi-in td,
.page-id-14801 .hoso-bang-phi-in tbody th {
    padding: 16px 22px !important;
    border: 0 !important;
    border-bottom: 1px solid #F2EAE0 !important;
    background: #ffffff !important;
    color: #4A3728 !important;
    font-weight: 500 !important;
}
.page-id-14801 .hoso-bang-phi-in tbody tr:last-child td,
.page-id-14801 .hoso-bang-phi-in tbody tr:last-child th {
    border-bottom: 0 !important;
}
/* Cot HOSO: nhan manh */
.page-id-14801 .hoso-bang-phi-in td:nth-child(2) {
    background: #F3F9EA !important;
    color: #3C640D !important;
    font-weight: 700 !important;
    box-shadow: inset 1px 0 0 #DCEBC6, inset -1px 0 0 #DCEBC6;
}
/* Cot phai: gia cao hon, de nhat de tuong phan */
.page-id-14801 .hoso-bang-phi-in td:nth-child(3) {
    color: #8A7563 !important;
    font-weight: 600 !important;
}
.page-id-14801 .hoso-bang-phi-in tbody tr:hover td,
.page-id-14801 .hoso-bang-phi-in tbody tr:hover th {
    background: #FBFDF7 !important;
}
.page-id-14801 .hoso-bang-phi-in tbody tr:hover td:nth-child(2) {
    background: #E9F5D6 !important;
}
.page-id-14801 .hoso-bang-phi-in caption {
    caption-side: bottom;
    padding-top: 14px;
    color: #8A7563;
    font-size: 13.5px;
    text-align: center;
}

/* 33. Thiet ke lai bang phi theo huong "doi chieu gia", khong con dang bang ke.
   Moi hang la mot dong so sanh: muc so luong ben trai, gia HOSO noi bat o giua,
   gia khi tu mang tui lam mo va gach ngang de thay ngay phan chenh lech. */
.page-id-14801 .hoso-bang-phi-in {
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    overflow: visible !important;
    background: transparent !important;
}
.page-id-14801 .hoso-bang-phi-in thead th {
    background: transparent !important;
    color: #8A7563 !important;
    font-size: 11.5px !important;
    letter-spacing: 1.4px;
    padding: 0 24px 6px !important;
    border: 0 !important;
    box-shadow: none !important;
}
.page-id-14801 .hoso-bang-phi-in thead th:nth-child(2) { color: #4A7A10 !important; }

.page-id-14801 .hoso-bang-phi-in tbody tr {
    transition: transform .2s ease, box-shadow .2s ease;
}
.page-id-14801 .hoso-bang-phi-in tbody th,
.page-id-14801 .hoso-bang-phi-in tbody td {
    background: #ffffff !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 20px 24px !important;
    vertical-align: middle !important;
}
.page-id-14801 .hoso-bang-phi-in tbody th {
    border-radius: 14px 0 0 14px !important;
    border-left: 4px solid #E8D9C4 !important;
    color: #4A3728 !important;
    font-weight: 600 !important;
    font-size: 15px !important;
}
.page-id-14801 .hoso-bang-phi-in tbody td:nth-child(2) {
    background: linear-gradient(to right, #F3F9EA, #ffffff) !important;
    color: #3C640D !important;
    font-weight: 800 !important;
    font-size: 20px !important;
    letter-spacing: -.2px;
}
.page-id-14801 .hoso-bang-phi-in tbody td:nth-child(3) {
    border-radius: 0 14px 14px 0 !important;
    color: #B3A192 !important;
    font-weight: 500 !important;
    font-size: 15px !important;
    text-decoration: line-through;
    text-decoration-thickness: 1px;
    text-decoration-color: #D9C9B6;
}
.page-id-14801 .hoso-bang-phi-in tbody tr:hover th { border-left-color: #78bc20 !important; }
.page-id-14801 .hoso-bang-phi-in tbody tr:hover th,
.page-id-14801 .hoso-bang-phi-in tbody tr:hover td {
    box-shadow: 0 10px 26px rgba(74, 122, 16, .13) !important;
}
.page-id-14801 .hoso-bang-phi-in tbody tr:hover td:nth-child(2) {
    background: linear-gradient(to right, #E9F5D6, #ffffff) !important;
}
@media (max-width: 767px) {
    .page-id-14801 .hoso-bang-phi-in tbody th,
    .page-id-14801 .hoso-bang-phi-in tbody td { padding: 14px 14px !important; }
    .page-id-14801 .hoso-bang-phi-in tbody td:nth-child(2) { font-size: 17px !important; }
}

/* 33b. Go nen xanh con sot cua ban truoc o o tieu de cot giua. */
.page-id-14801 .hoso-bang-phi-in thead th:nth-child(2) {
    background: transparent !important;
    background-image: none !important;
    color: #4A7A10 !important;
}

/* 34. Nhan dau khoi "Khac biet ve cach san xuat": dua vao vien thuoc nen trang.
   Khoi la content_box + pix_feature (co icon) nen khong dung duoc pix_badge.
   Neo bang el_class="hoso-chip" chu KHONG bam vao vc_custom_1773792065155:
   id do WPBakery sinh va dung chung cho ca mot content_box rong khac tren cung
   trang, bam vao no se to nen cho ca khoi rong do.
   Nen section la trang tinh nen chip trang phai co vien va mot lop bong rat nhe
   thi moi noc len duoc.
   BAT BUOC !important cho padding: CSS noi tuyen cua WPBakery nam SAU style.css
   va da dat padding-bottom:10px !important cho chinh khoi nay. */
.pix-content-box.hoso-chip {
    background: #FFFFFF !important;
    border: 1px solid #E8D9C4 !important;
    border-radius: 999px !important;
    padding: 8px 20px !important;
    box-shadow: 0 2px 10px rgba(96,56,19,.06);
    margin-bottom: 20px;
}
.pix-content-box.hoso-chip .pix-feature-el {
    align-items: center;
    margin-bottom: 0;
}
/* .media-body cua Bootstrap la flex:1 kem min-width:0. Trong mot hop
   inline-flex co giat theo noi dung, cap do lam chu xuong dong tung tu va
   chip cao 133px thay vi mot dong. Ep khong xuong dong va thoi co gian. */
.pix-content-box.hoso-chip .media-body {
    flex: 0 0 auto;
    min-width: 0;
}
.pix-content-box.hoso-chip .pix-feature-title,
.pix-content-box.hoso-chip h6 {
    white-space: nowrap;
    margin-bottom: 0;
}
.pix-content-box.hoso-chip .pix-feature-content {
    display: none;
}

/* ============================================================================
   NUT CHINH TOAN SITE — gradient, chu trang. Chot 18/08/2026.
   ----------------------------------------------------------------------------
   Thay quyet dinh 17/08 ("nen xanh #78bc20 phang, chu den #2E2118"). Chu site
   khong thich nut xanh phang chu den.

   Gop LUON .btn-gradient-primary vao day. Truoc do site chay HAI kieu nut xanh
   song song: 6 CTA dung .btn-gradient-primary (gradient trai->phai, chu trang)
   con lai dung .btn-primary (phang, chu den). Gio ca hai la mot.

   ⚠️ KHONG dat WCAG AA va do la lua chon co chu dinh cua chu site:
      trang tren #78bc20 = 2,33:1 · tren #4A7A10 = 5,14:1 · giua nut ~3,4:1.
      Dung "sua" lai thanh chu den.

   Go: xoa khoi nay -> .btn-primary ve nen phang cua theme, .btn-gradient-primary
   ve gradient goc cua pixfort. Ban sao: ~/backup-w5-20260818/style.css.goc
   ============================================================================ */
.btn-primary,
.btn-primary:visited,
.btn-gradient-primary,
.btn-gradient-primary:visited {
    background: linear-gradient(135deg, #78bc20 0%, #63A018 52%, #4A7A10 100%) !important;
    border: none !important;
    color: #fff !important;
    text-shadow: 0 1px 1px rgba(46, 33, 24, .28);
    box-shadow: 0 2px 6px rgba(74, 122, 16, .24);
    transition: background .2s ease, box-shadow .2s ease, transform .12s ease;
}

/* pixfort boc chu nut trong <span>, mau chu dat o span chu khong o the ngoai */
.btn-primary span,
.btn-gradient-primary span {
    color: #fff !important;
}

.btn-primary .pixfort-icon,
.btn-gradient-primary .pixfort-icon {
    --pf-icon-color: #fff;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-gradient-primary:hover,
.btn-gradient-primary:focus {
    background: linear-gradient(135deg, #6BAA1C 0%, #55901A 52%, #3E680C 100%) !important;
    color: #fff !important;
    opacity: 1;                    /* theme dat opacity:.7 khi hover, lam nut bac mau */
    box-shadow: 0 4px 12px rgba(74, 122, 16, .32);
}

.btn-primary:active,
.btn-gradient-primary:active {
    transform: translateY(1px);
}

/* Nut hanh dong chinh cua WooCommerce dung chung kieu voi .btn-primary.
   CHI cac nut "alt" (mau thuong hieu) — nut phu mau xam cua Woo giu nguyen.
   Woo dat mau chu #EFF7E4 (trang ngA) san, ta dua ve trang han cho khop. */
.woocommerce .button.alt,
.woocommerce button.button.alt,
.woocommerce .single_add_to_cart_button,
.woocommerce a.checkout-button,
.woocommerce .wc-proceed-to-checkout a.button {
    background: linear-gradient(135deg, #78bc20 0%, #63A018 52%, #4A7A10 100%) !important;
    border: none !important;
    color: #fff !important;
    text-shadow: 0 1px 1px rgba(46, 33, 24, .28);
    box-shadow: 0 2px 6px rgba(74, 122, 16, .24);
    transition: background .2s ease, box-shadow .2s ease;
}
.woocommerce .button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce .single_add_to_cart_button:hover,
.woocommerce a.checkout-button:hover,
.woocommerce .wc-proceed-to-checkout a.button:hover {
    background: linear-gradient(135deg, #6BAA1C 0%, #55901A 52%, #3E680C 100%) !important;
    color: #fff !important;
    box-shadow: 0 4px 12px rgba(74, 122, 16, .32);
}
/* Nut da bi vo hieu (chua chon bien the) phai NHIN THAY duoc la dang tat. */
.woocommerce .single_add_to_cart_button.disabled,
.woocommerce .single_add_to_cart_button:disabled {
    background: #DFE8D2 !important;
    color: #556047 !important;
    opacity: 1 !important;
    text-shadow: none;
    box-shadow: none;
}

/* Trang thai VO HIEU cua nut them vao gio (chua chon bien the).
   Woo dinh nghia trang thai nay bang selector 4 lop + 1 the (vi du
   .woocommerce button.button.alt.disabled) nen luat 3 lop o tren thua.
   Phai viet dung muc do dac hieu do, neu khong nut tat van sang nhu nut bat. */
.woocommerce button.button.alt.disabled,
.woocommerce button.button.alt:disabled,
.woocommerce button.button.alt.disabled:hover,
.woocommerce button.button.alt:disabled:hover,
.woocommerce .single_add_to_cart_button.disabled,
.woocommerce .single_add_to_cart_button.disabled:hover {
    background: #DFE8D2 !important;
    background-image: none !important;
    color: #556047 !important;
    opacity: 1 !important;
    text-shadow: none !important;
    box-shadow: none !important;
    transform: none !important;
}

/* 20/08/2026 — vi sao mau o hai khoi tren doi:
   Cap #63704F tren #C9D8B4 chi dat 3,52:1, va theme con phu them opacity .6
   len ca nut, keo thuc te xuong 1,93:1. Lighthouse bat dung loi nay
   (color-contrast, trang san pham 77/100).

   #DFE8D2 CHINH LA #C9D8B4 sau khi pha 60% tren nen trang — tuc dung mau ma
   mat van dang thay. Tat opacity roi ghi thang mau do vao: nen khong doi mot
   sac nao, chi chu dam len, 1,93:1 -> 5,27:1 (AA can 4,5:1).

   Nut van nhat hon han nut gradient luc ban duoc nen van doc ra la dang tat. */

/* ============================================================================
   POPUP "Để HOSO gọi lại"  —  pixpopup #17609 + form CF7 #17608
   ----------------------------------------------------------------------------
   Nạp toàn site vì nút mở popup đặt được ở bất kỳ trang nào.
   Popup dựng bằng element pixfort, nội dung tải qua AJAX của theme.
   Gỡ: xoá khối này.
   ============================================================================ */
.hoso-goilai {
    --gl-nau: #603813;
    --gl-nau-nhat: #6d4f34;
    --gl-xanh: #78bc20;
    --gl-xanh-tham: #4A7A10;
    --gl-be: #F0DBC0;
    --gl-kem: #FDFAF5;
    --gl-vien: #E8D9C4;
    border-radius: 14px;
    overflow: hidden;
    background: #fff;
}

.hoso-goilai .hoso-goilai-trai {
    background: var(--gl-kem);
    border-right: 1px solid var(--gl-vien);
    padding: 32px 28px;
}

.hoso-goilai .hoso-goilai-phai { padding: 32px 28px; }

.hoso-goilai .hoso-goilai-tieu {
    font-family: "Roboto Serif", "Times New Roman", Times, serif;
    font-weight: 700;
    color: var(--gl-nau);
    font-size: 24px;
    line-height: 1.3;
    margin-bottom: 10px;
}

.hoso-goilai .hoso-goilai-mo {
    color: var(--gl-nau-nhat);
    font-size: 15px;
    line-height: 1.65;
    margin: 0 0 22px;
}

.hoso-goilai .hoso-goilai-chips > div + div { margin-top: 14px; }
.hoso-goilai .pix-feature-title { color: var(--gl-nau) !important; }
.hoso-goilai .hoso-goilai-chips p { margin: 0; }        /* wpautop hay chèn <p> rỗng */

/* --- form --- */
.hoso-goilai .hoso-goilai-nhan {
    display: block;
    width: 100%;
    font-family: "Roboto Serif", "Times New Roman", Times, serif;
    font-weight: 700;
    color: var(--gl-nau);
    font-size: 15px;
    margin-bottom: 16px;
}

.hoso-goilai .hoso-goilai-bb,
.hoso-goilai .hoso-goilai-tuychon {
    font-family: "Lexend Deca", Arial, Helvetica, sans-serif;
    font-weight: 500;
    font-size: 12px;
    margin-left: 6px;
    padding: 2px 8px;
    border-radius: 999px;
    vertical-align: middle;
}
.hoso-goilai .hoso-goilai-bb { background: #EDF4E3; color: #3F6311; border: 1px solid #CBE0AE; }
.hoso-goilai .hoso-goilai-tuychon { background: var(--gl-kem); color: #8a6a4a; border: 1px solid var(--gl-vien); }

.hoso-goilai .hoso-goilai-o,
.hoso-goilai input[type="tel"],
.hoso-goilai input[type="text"],
.hoso-goilai textarea {
    display: block;
    width: 100%;
    margin-top: 7px;
    padding: 12px 14px;
    font-family: "Lexend Deca", Arial, Helvetica, sans-serif;
    font-size: 15px;
    color: var(--gl-nau);
    background: #fff;
    border: 1px solid var(--gl-vien);
    border-radius: 10px;
    box-shadow: none;
    transition: border-color .16s ease, box-shadow .16s ease;
}
.hoso-goilai .hoso-goilai-o:focus,
.hoso-goilai input:focus,
.hoso-goilai textarea:focus {
    outline: none;
    border-color: var(--gl-xanh);
    box-shadow: 0 0 0 3px rgba(120, 188, 32, .18);
}
.hoso-goilai textarea { resize: vertical; min-height: 84px; }

.hoso-goilai .wpcf7-form-control-wrap { display: block; }

.hoso-goilai .hoso-goilai-cam {
    color: #8a6a4a;
    font-size: 13px;
    line-height: 1.6;
    margin: 14px 0 0;
}

/* CF7 báo lỗi: giữ tông nâu ấm, không dùng đỏ chói của bản mặc định */
.hoso-goilai .wpcf7-not-valid-tip {
    color: #8A4A22;
    font-size: 13px;
    margin-top: 6px;
}
.hoso-goilai .wpcf7-not-valid { border-color: #D89A72 !important; }
.hoso-goilai .wpcf7-response-output {
    border: 1px solid var(--gl-vien) !important;
    background: var(--gl-kem);
    border-radius: 10px;
    color: var(--gl-nau);
    font-size: 14px;
    padding: 12px 14px !important;
    margin: 16px 0 0 !important;
}
.hoso-goilai form.sent .wpcf7-response-output {
    border-color: #CBE0AE !important;
    background: #EDF4E3;
    color: #3F6311;
}

@media (max-width: 991px) {
    .hoso-goilai .hoso-goilai-trai {
        border-right: none;
        border-bottom: 1px solid var(--gl-vien);
        padding: 24px 20px;
    }
    .hoso-goilai .hoso-goilai-phai { padding: 24px 20px; }
    .hoso-goilai .hoso-goilai-tieu { font-size: 21px; }
}

/* Khổ popup. Theme có meta `pix-popup-size` nhưng lớp size không tới được DOM
   (đã đo: <dialog> không mang lớp col-*, .pix-dialog-container đứng ở 620px),
   nên đặt thẳng ở đây. Chỉ nhắm popup 17609, không đụng các popup khác. */
.pix-popup-17609 .pix-dialog-container {
    width: 900px !important;
    max-width: 94vw !important;
}
@media (max-width: 991px) {
    .pix-popup-17609 .pix-dialog-container { width: 100% !important; max-width: 96vw !important; }
}

/* .pix-dialog-inner bị theme đặt cứng width:620px — đó mới là chỗ chặn thật,
   không phải .pix-dialog-container. Đo bằng getComputedStyle từng cấp mới ra. */
.pix-popup-17609 .pix-dialog-inner { width: 100% !important; max-width: 100% !important; }
.pix-popup-17609 .pix-dialog-inner > .container { max-width: 100% !important; padding-left: 0; padding-right: 0; }

/* ============================================================================
   NUT CTA BAC 3 ("Hoặc gọi …") tren cac trang builder.
   ----------------------------------------------------------------------------
   Nut bac 3 phai doc ra la CHU, khong phai nut. Truoc day no duoc cho nen pill
   trang/toi de doc duoc tren dai xanh, nhung the la chu shop dem thanh "3 nut",
   "4 nut". Nay bo nen, dung gach chan + mau chu tuong phan de van doc duoc.
   ============================================================================ */
.btn.btn-link-heading-default {
    color: #603813 !important;
    background: transparent !important;
    border-radius: 0;
    padding: .55rem .25rem !important;
    text-decoration: underline 1px rgba(96, 56, 19, .38) !important;
    text-underline-offset: 4px;
}
.btn.btn-link-heading-default:hover {
    background: transparent !important;
    color: #4A7A10 !important;
    text-decoration: underline 1px #4A7A10 !important;
}

/* Tren dai nen xanh thi doi sang chu trang */
.btn.btn-link-white,
.btn.btn-link-white span {
    color: #fff !important;
}
.btn.btn-link-white {
    background: transparent !important;
    border-radius: 0;
    padding: .55rem .25rem !important;
    text-decoration: underline 1px rgba(255, 255, 255, .55) !important;
    text-underline-offset: 4px;
}
.btn.btn-link-white:hover {
    background: transparent !important;
    text-decoration: underline 1px #fff !important;
}
.btn.btn-link-white .pixfort-icon { --pf-icon-color: #fff; }

/* ============================================================================
   KHOI LIEN HE cuoi trang chu va /bang-gia-tui-giay/  (mu-plugin hoso-zalo.php)
   ----------------------------------------------------------------------------
   Dat o style.css chu khong phai hoso-danhmuc.css: hoso-danhmuc.css chi nap tren
   trang danh muc va trang san pham, con khoi nay nam o trang thuong.
   KHONG dat max-width: noi dung trang rong 1220px, cap 960px lam khoi thut vao
   trong va trong nho hon han phan tren (chu site bao 18/08).
   ============================================================================ */
.hoso-zalo-khoi {
    --z-nau: #603813;
    --z-nau-nhat: #6d4f34;
    --z-xanh-tham: #4A7A10;
    --z-be: #F0DBC0;
    --z-vien: #E8D9C4;
    margin: 3rem 0 1rem;
    padding: 34px 34px 30px;
    background: var(--z-be);
    border-radius: 14px;
}

.hoso-zalo-khoi .pix-heading-el { margin-bottom: 0; }
.hoso-zalo-khoi .pix-heading-el h2 {
    font-family: "Roboto Serif", "Times New Roman", Times, serif !important;
    color: var(--z-nau) !important;
    line-height: 1.3 !important;
    margin: 0 0 8px !important;
}
.hoso-zalo-khoi .pix-el-text { margin: 0 0 20px; }
.hoso-zalo-khoi .pix-el-text p { color: var(--z-nau) !important; opacity: .88; line-height: 1.65; margin: 0; }

/* chip cam ket */
.hoso-zalo-khoi .hoso-zalo-chip .pix-feature-el { margin-bottom: 6px; align-items: flex-start; }
.hoso-zalo-khoi .hoso-zalo-chip .pix-feature-title { color: var(--z-nau) !important; margin-bottom: 2px; }
.hoso-zalo-khoi .hoso-zalo-chip .pix-feature-content { color: var(--z-nau-nhat) !important; }

/* cot nut: xep doc, sat nhau. <br> cua wpautop khong xuat hien o day vi khoi
   duoc noi SAU wpautop, nhung van chan phong khi noi dung doi ve sau. */
.hoso-zalo-khoi .hoso-zalo-nut { display: flex; flex-direction: column; gap: 8px; }
.hoso-zalo-khoi .hoso-zalo-nut br { display: none; }
.hoso-zalo-khoi .hoso-zalo-nut > .btn {
    width: 100%;
    justify-content: center;
    margin: 0 !important;
}
/* nut bac 3 nhe nhat, khong tranh cho hai nut tren */
.hoso-zalo-khoi .hoso-zalo-nut > .btn.btn-link-heading-default {
    background: none !important;
    padding: 6px 8px 2px !important;
    font-size: 14.5px;
}
.hoso-zalo-khoi .hoso-zalo-nut > .btn.btn-link-heading-default:hover {
    background: none !important;
    color: var(--z-xanh-tham) !important;
    text-decoration: underline !important;
}
/* nut vien tren nen be: nen trang cho noi khoi */
.hoso-zalo-khoi .hoso-zalo-nut > .btn.btn-outline-primary {
    background: #fff !important;
    border-color: var(--z-nau) !important;
    color: var(--z-nau) !important;
}
.hoso-zalo-khoi .hoso-zalo-nut > .btn.btn-outline-primary:hover {
    background: var(--z-nau) !important;
    color: #fff !important;
}

@media (max-width: 991px) {
    .hoso-zalo-khoi { padding: 24px 20px 22px; }
    .hoso-zalo-khoi .pix-heading-el h2 { font-size: 23px !important; }
    .hoso-zalo-khoi .hoso-zalo-nut { margin-top: 20px; }
}

/* ---------- Khối liên hệ: nền nhạt lại + dòng liên kết giá làm chân khối ----
   Chủ site 18/08: nền be #F0DBC0 quá đậm khi khối đứng một mình ở đáy trang
   trắng. Trên /tui-giay/ nó ổn vì có nội dung hai bên làm nhịp màu; ở đây nó là
   một mảng đặc giữa nền trắng.
   Đổi sang kem #FDFAF5 + viền ấm, cùng kiểu với thẻ "Chưa chắc nên chọn cỡ nào?"
   mà chủ site đã duyệt. Nhạt hơn nhưng vẫn tách khỏi nền trang.
   ---------------------------------------------------------------------------- */
.hoso-zalo-khoi {
    background: linear-gradient(180deg, #FFFDF9 0%, #FBF6EE 100%) !important;
    border: 1px solid var(--z-vien);
    box-shadow: 0 1px 2px rgba(96, 56, 19, .04);
    margin-top: 3.5rem;
}

/* dòng liên kết giá: chân khối, tách bằng một đường mảnh chứ không phải dải nền riêng */
.hoso-zalo-khoi .hoso-zalo-lienket {
    margin: 22px 0 0;
    padding: 16px 0 0;
    border-top: 1px solid var(--z-vien);
    color: var(--z-nau-nhat);
    font-size: 14.5px;
    line-height: 1.6;
}
.hoso-zalo-khoi .hoso-zalo-lienket a {
    color: var(--z-xanh-tham);
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.hoso-zalo-khoi .hoso-zalo-lienket a:hover { color: var(--z-nau); }

/* nút viền trên nền kem: giữ nền trắng để vẫn nổi */
.hoso-zalo-khoi .hoso-zalo-nut > .btn.btn-outline-primary { background: #fff !important; }

/* ============================================================
 * 33. Thanh khuyến mãi Trung Thu trên header  (dựng 19/08/2026)
 * Đỏ son → vàng kim, hoà với nâu #603813 của brand.
 * Gỡ mùa: xoá khối này + xoá element trong topbar của header post 6.
 * ============================================================ */
:root {
    --tt-do-dam:  #6E1210;
    --tt-do:      #B01F1B;
    --tt-vang:    #D8A032;
    --tt-vang-sang: #F0CE7A;
}

/* dải nền — đè lên biến nền mặc định của pixfort */
.pixfort-area-content[data-area="topbar"],
.pixfort-area-content[data-area="m_topbar"] {
    --pix-header-bg-color: var(--tt-do);
    background-image: linear-gradient(90deg,
        var(--tt-do-dam) 0%,
        var(--tt-do)     38%,
        var(--tt-vang)   88%,
        var(--tt-vang-sang) 100%);
    border-bottom: 1px solid rgba(0, 0, 0, .12);
}

/* chữ và liên kết trong dải: ép trắng, không phụ thuộc class theme */
.pixfort-area-content[data-area="topbar"] .pix-header-text,
.pixfort-area-content[data-area="topbar"] .pix-header-text *,
.pixfort-area-content[data-area="m_topbar"] .pix-header-text,
.pixfort-area-content[data-area="m_topbar"] .pix-header-text * {
    color: #fff !important;
}

/* nút "Xem bộ sưu tập": viên thuốc vàng nhạt cho tách khỏi nền */
.pix-topbar .hoso-tt-nut,
.pix-header-mobile .hoso-tt-nut {
    background: rgba(255, 255, 255, .16);
    border: 1px solid rgba(255, 255, 255, .38);
    border-radius: 999px;
    padding: 4px 14px !important;
    transition: background .18s ease, border-color .18s ease;
}
.pix-topbar .hoso-tt-nut:hover,
.pix-header-mobile .hoso-tt-nut:hover {
    background: rgba(255, 255, 255, .28);
    border-color: var(--tt-vang-sang);
}

/* khoảng cách giữa dòng chữ và nút */
.pix-topbar [data-col="topbar_1"] .pix-header-space { min-width: 16px; }

/* dải mỏng lại một chút để không ăn chỗ của header chính */
.pix-topbar .pix-header-min-height { min-height: 40px; }

/* mobile: chữ nhỏ hơn, cho phép xuống dòng thay vì tràn */
@media (max-width: 767.98px) {
    .pixfort-area-content[data-area="m_topbar"] .hoso-tt-nut {
        font-size: 13px;
        padding: 3px 10px !important;
        white-space: normal;
        line-height: 1.25;
    }
}

/* social + nút sẵn có trên dải mobile: ép sáng cho đọc được trên nền đỏ */
.pixfort-area-content[data-area="m_topbar"] .pix-social a,
.pixfort-area-content[data-area="m_topbar"] .pix-social svg,
.pixfort-area-content[data-area="m_topbar"] .pix-social path {
    color: #fff !important;
    fill: currentColor !important;
    opacity: .92;
}
.pixfort-area-content[data-area="m_topbar"] .pix-social a:hover { opacity: 1; }


/* ── Hero /tui-giay-trung-thu/: ảnh mẫu túi khá sáng nên chữ trắng bị chìm.
      Phủ một lớp nâu chuyển dần cho tiêu đề và breadcrumb đọc được. ── */
body.term-tui-giay-trung-thu .pix-main-intro { position: relative; }
body.term-tui-giay-trung-thu .pix-main-intro::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(180deg,
        rgba(48, 22, 10, .28) 0%,
        rgba(48, 22, 10, .55) 62%,
        rgba(48, 22, 10, .70) 100%);
}
body.term-tui-giay-trung-thu .pix-intro-container { position: relative; z-index: 2; }
body.term-tui-giay-trung-thu .pix-main-intro h1,
body.term-tui-giay-trung-thu .pix-main-intro .pix-breadcrumbs,
body.term-tui-giay-trung-thu .pix-main-intro .pix-breadcrumbs a {
    text-shadow: 0 1px 10px rgba(30, 12, 4, .55);
}

/* ── Dải Trung Thu trên mobile: link promo + 5 icon social + nút "Tin tức"
      cộng lại rộng hơn 375px nên tràn thành hai hàng. Ẩn social ở dải này
      (vẫn còn đủ ở chân trang) để promo và nút nằm gọn một hàng. ── */
@media (max-width: 575.98px) {
    .pixfort-area-content[data-area="m_topbar"] .pix-social { display: none !important; }
    .pixfort-area-content[data-area="m_topbar"] .hoso-tt-nut { font-size: 12.5px; }
}

/* ── Chip cam kết: ở màn hẹp hai cột làm chữ vỡ dòng xấu, cho xuống một cột ── */
@media (max-width: 479.98px) {
    .hoso-tg-chip > [class*="col-"] { flex: 0 0 100%; max-width: 100%; }
}

/* ============================================================
 * 34. Trang bộ sưu tập Trung Thu — phần dưới lưới sản phẩm
 * Dùng chung ngôn ngữ với bảng giá ERP (.hoso-cat-bang) nên
 * ở đây chỉ lo nhịp dọc giữa các khối, không vẽ lại bảng.
 * ============================================================ */
.hoso-tg-duoi { max-width: 1140px; }

/* Nhịp dọc đều: mỗi khối cách nhau đúng một khoảng, không phụ thuộc
   thẻ nào đứng cuối khối trước (trước đây ghi chú dính sát H2 kế tiếp). */
.hoso-tg-duoi > .hoso-tt-khoi + .hoso-tt-khoi,
.hoso-tg-duoi > .hoso-tt-khoi + .hoso-tg-hoi-cuoi { margin-top: 52px; }

.hoso-tt-khoi > .hoso-tt-h2 {
    font-family: "Roboto Serif", Georgia, "Times New Roman", serif;
    font-size: clamp(23px, 2.2vw, 28px);
    font-weight: 700;
    color: #603813;
    margin: 0 0 16px;
    line-height: 1.3;
}
.hoso-tt-khoi > .hoso-cat-bang { margin-top: 0; }
.hoso-tt-doan {
    margin: 0;
    font-size: 16px;
    line-height: 1.75;
    max-width: 78ch;
}
.hoso-tt-ghi {
    margin: 14px 0 0;
    font-size: 14px;
    line-height: 1.65;
    color: #8a6a4a;
    max-width: 78ch;
}

/* Giá trong bảng: cùng sắc nâu đậm với bảng giá ERP */
.hoso-tg-duoi .hoso-cat-gia { font-weight: 700; color: #603813; }

/* Thẻ CTA cuối trang: rộng hết khung thay vì bó trong cột hẹp như bản ở đầu trang */
.hoso-tg-hoi-cuoi { max-width: none; }
/* Nút xếp dọc như thẻ ở đầu trang. KHÔNG dùng flex:1 1 260px ở đây —
   wrapper của pix_button sẽ giãn cả chiều cao theo container (stretch)
   và nút phình lên gần 300px. */
.hoso-tg-hoi-cuoi .hoso-tg-hoi-nut > * { display: block; }
.hoso-tg-hoi-cuoi .hoso-tg-hoi-nut .btn { width: 100%; }

@media (max-width: 767.98px) {
    .hoso-tg-duoi > .hoso-tt-khoi + .hoso-tt-khoi,
    .hoso-tg-duoi > .hoso-tt-khoi + .hoso-tg-hoi-cuoi { margin-top: 38px; }
}

/* CSS của .hoso-cat-bang do mu-plugin hoso-catalog.php in ra, và chỉ in khi
   trang có shortcode bảng giá ERP. Trang này không dùng shortcode đó nên phải
   chép lại — giới hạn trong .hoso-tg-duoi để không đụng bảng giá thật ở nơi khác. */
.hoso-tg-duoi .hoso-cat-bang {
    border: 1px solid #E8D9C4;
    border-radius: 14px;
    background: #fff;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(96, 56, 19, .04);
}
.hoso-tg-duoi .hoso-cat-bang table {
    border-collapse: collapse;
    width: 100%;
    table-layout: auto;
    margin: 0;
}
.hoso-tg-duoi .hoso-cat-bang th,
.hoso-tg-duoi .hoso-cat-bang td {
    padding: 14px 16px;
    text-align: left;
    border-bottom: 1px solid #EDE0CE;
    vertical-align: middle;
    overflow-wrap: anywhere;
}
.hoso-tg-duoi .hoso-cat-bang thead th {
    font-family: "Roboto Serif", "Times New Roman", Times, serif;
    background: #F0DBC0;
    color: #603813;
    font-weight: 600;
    font-size: 14.5px;
    border-bottom: 1px solid #DCC5A6;
    white-space: nowrap;
}
.hoso-tg-duoi .hoso-cat-bang tbody tr:last-child td { border-bottom: none; }
.hoso-tg-duoi .hoso-cat-bang tbody tr:hover { background: #FDFAF5; }
.hoso-tg-duoi .hoso-cat-so { font-variant-numeric: tabular-nums; white-space: nowrap; }
.hoso-tg-duoi .hoso-cat-ten { font-weight: 600; color: #603813; font-size: 15.5px; }

/* Điện thoại: bảng 6 cột không vừa màn hình — xếp mỗi dòng thành một thẻ,
   nhãn cột lấy từ data-nhan thay vì bắt người dùng cuộn ngang. */
@media (max-width: 640px) {
    .hoso-tg-duoi .hoso-cat-bang thead { display: none; }
    .hoso-tg-duoi .hoso-cat-bang tbody tr {
        display: block;
        padding: 14px 16px;
        border-bottom: 1px solid #EDE0CE;
    }
    .hoso-tg-duoi .hoso-cat-bang tbody tr:last-child { border-bottom: none; }
    .hoso-tg-duoi .hoso-cat-bang td {
        display: flex;
        justify-content: space-between;
        gap: 16px;
        padding: 5px 0;
        border: none;
        text-align: right;
    }
    .hoso-tg-duoi .hoso-cat-bang td::before {
        content: attr(data-nhan);
        color: #8a6a4a;
        font-size: 13.5px;
        text-align: left;
        flex: 0 0 auto;
    }
    .hoso-tg-duoi .hoso-cat-bang td:first-child { padding-bottom: 8px; }
    .hoso-tg-duoi .hoso-cat-bang td:first-child::before { content: ""; }
    .hoso-tg-duoi .hoso-cat-bang td:first-child .hoso-cat-ten { font-size: 17px; }
}

/* ── Dải promo trên mobile: nút Trung Thu phải là thứ nổi nhất.
      Trước đây nó là pill trắng mờ trông như nhãn, còn nút "Tin tức" nền đậm
      lại hút mắt — người xem tưởng dải này chỉ có nút Tin tức. ── */
@media (max-width: 767.98px) {
    /* nút Trung Thu: nền trắng đặc, chữ đỏ — tương phản mạnh trên nền gradient */
    .pixfort-area-content[data-area="m_topbar"] .hoso-tt-nut {
        background: #fff !important;
        border-color: #fff !important;
        color: var(--tt-do-dam, #6E1210) !important;
        font-weight: 700;
        box-shadow: 0 1px 6px rgba(60, 20, 8, .18);
    }
    .pixfort-area-content[data-area="m_topbar"] .hoso-tt-nut * { color: inherit !important; }
    .pixfort-area-content[data-area="m_topbar"] .hoso-tt-nut:hover {
        background: #FFF6E8 !important;
        border-color: #FFF6E8 !important;
    }
    /* "Tin tức" đã có trong menu — bỏ khỏi dải promo để không tranh vai trò */
    .pixfort-area-content[data-area="m_topbar"] .btn:not(.hoso-tt-nut) { display: none !important; }
}

/* ── Khối CTA cuối đang sát mép vùng nền của phần nội dung. Cho thở ra
      phía dưới, và nới đệm trong khối cho cân với ba nút. ── */
.hoso-tg-duoi { padding-bottom: 8px; }
.hoso-tg-duoi > .hoso-tg-hoi-cuoi { margin-bottom: 56px; padding: 28px; }
.hoso-tg-hoi-cuoi .hoso-tg-hoi-nut > *:last-child .btn { margin-top: 4px; }

@media (max-width: 767.98px) {
    .hoso-tg-duoi > .hoso-tg-hoi-cuoi { margin-bottom: 40px; padding: 22px; }
}


/* ── CLS: ô giữ chỗ cho header trong suốt bị JS pixfort gán chiều cao SAU khi
      trang load, trước đó bằng 0 nên #content nhảy xuống 156px ⇒ CLS 0,104.
      JS chỉ chạy khi placeholder.height() < 1, nên đặt sẵn đúng giá trị đó
      bằng CSS chặn render sẽ khiến JS bỏ qua và không còn cú dịch nào.
      156px = dải promo 39 + topbar 41 + header 76 (đo ở 1350px).
      ⚠ Dưới 1200px JS đặt 0 nên không khai báo gì.
      ⚠ Gỡ dải promo Trung Thu khỏi topbar thì phải đo lại con số này. ── */
@media (min-width: 1200px) {
    .pix-main-intro-placeholder { display: block; width: 100%; height: 156px; min-height: auto; }
}



/* ── Dropdown "Về HOSO": cho hộp ôm sát nội dung.
      pixfort khoá MỌI dropdown ở min-width 240px
      (.nav-style-megamenu>li.nav-item .dropdown-menu), nên mục dài nhất
      "Dự án, chiến dịch nổi bật" bẻ xuống dòng hai và tràn khỏi nền trắng.

      ⚠ BẪY: chỉ đặt min-width:max-content thì hộp phình ra 806px.
      `.submenu-box > .container` là flex-direction:row + flex-wrap:wrap.
      Các mục nằm mỗi cái một dòng chỉ vì chúng có .w-100, còn max-content của
      một flex container BIẾT XUỐNG DÒNG là TỔNG bề rộng mọi mục xếp trên
      cùng một hàng (237+159+171+240 = 807px), không phải mục rộng nhất.
      Xoay trục về column thì max-content trở thành mục rộng nhất — đúng cái
      ta cần — mà hình thức không đổi, vì các mục vốn đã xếp dọc rồi.
      Đo 21/08/2026 tại 1440px: row → 806,18px; column → 240,16px.

      Dùng max-content thay một con số cứng để chủ site thêm mục dài hơn
      về sau không phải chỉnh lại.
      ⚠ Loại trừ .mega-item: mega menu "Sản phẩm" trải ngang cả container. ── */
@media (min-width: 992px) {
    .nav-style-megamenu > li.nav-item:not(.mega-item) .dropdown-menu {
        min-width: max-content;
    }
    .nav-style-megamenu > li.nav-item:not(.mega-item) .dropdown-menu .submenu-box > .container {
        flex-direction: column;
    }
}
