/*
 * Yeu thich va So sanh (hai plugin YITH).
 *
 * Hai plugin nay in ra markup rieng cua chung kem mot bo CSS rieng. CSS do
 * VAN duoc nap (trang "Danh sach yeu thich" cua plugin can den no - xem ghi
 * chu cuoi inc/wishlist-compare.php); tep nay nap SAU va de len tren, mac
 * lai ao cho hai nut nhin nhu moi thu khac tren trang chu khong nhu do di
 * muon.
 *
 * KHONG SUA FILE PLUGIN - chi bam vao cac lop ma plugin sinh ra:
 *
 *   .yith-wcwl-add-to-wishlist   khung ngoai cua nut yeu thich
 *   .add_to_wishlist             the <a> bam vao
 *   .yith-wcwl-wishlistaddedbrowse / ...existsbrowse   khi da thich
 *   .compare-button > a.compare  nut so sanh
 *   .compare.added               khi da them vao bang so sanh
 *
 * Muc luc:
 *   1. Dung chung
 *   2. Nut tren trang san pham (icon + chu)
 *   3. Nut tren the san pham (chi icon, hinh tron)
 *   4. Trang danh sach yeu thich
 *   5. Bang so sanh
 *   6. Man hinh nho
 */

/* ================================================================
   1. DUNG CHUNG
   ================================================================ */

/* Plugin boc nut trong nhieu lop <div> long nhau, moi lop lai la block nen
   nut bi day xuong dong rieng. Cho chung thanh inline-flex de nut nam ngang
   hang voi cac hanh dong khac. */
.cps-wishlist,
.cps-wishlist .yith-wcwl-add-to-wishlist,
.cps-wishlist .yith-wcwl-add-button,
.cps-wishlist .yith-wcwl-wishlistaddedbrowse,
.cps-wishlist .yith-wcwl-wishlistexistsbrowse,
.cps-compare,
.cps-compare .compare-button {
	display: inline-flex;
	align-items: center;
	margin: 0;
	padding: 0;
}

/* Le VA kieu hien thi cua .yith-wcwl-add-button phai go rieng bang
   !important. Plugin dat cho no margin-bottom: 16px va display: block tu
   mot tep nap SAU tep nay, nen khai bao o tren khong an thua.

   Hai thu do gay hai loi khac nhau:
     - le 16px: noi rong ra ben duoi nut, day the san pham cao them
     - display: block: khoi bao ngoai cao 27px trong khi nut ben trong chi
       21px (khoang thua do line-height cua khoi block), lam muc "Yeu thich"
       lech 10px so voi ba muc cung hang tren trang san pham */
.cps-wishlist .yith-wcwl-add-to-wishlist,
.cps-wishlist .yith-wcwl-add-button {
	display: inline-flex !important;
	align-items: center;
	margin: 0 !important;
}

/* Plugin to icon bang bien rieng, mac dinh la mau den:
       svg { color: var(--add-to-wishlist-icon-color, #000) }
   Dat bien do thanh currentColor de icon an theo mau chu cua nut - nut
   xam thi icon xam, nut do thi icon do, khong phai viet de mau hai noi. */
.cps-wishlist {
	--add-to-wishlist-icon-color: currentColor;
}

/*
 * Trai tim CHUA thich: do nhat var(--cps-c-primary), chi ve net.
 * Trai tim DA thich:   vang dam #8a6a00, to dac ruot.
 *
 * Hai trang thai cung mot tong mau, phan biet bang do dam va dac/rong -
 * nhin la biet ngay cai nao da chon ma khong can doc chu.
 *
 * Chi to RIENG ICON chu khong to ca nut: var(--cps-c-primary) tren nen trang chi dat do
 * tuong phan khoang 2:1, du cho mot hinh ve nhung qua nhat cho chu. Tren
 * trang san pham chu "Yeu thich" van giu mau xanh nhu ba muc cung hang.
 */
.cps-wishlist svg.yith-wcwl-icon-svg {
	color: var(--cps-c-primary);
}

.cps-wishlist .add_to_wishlist:hover svg.yith-wcwl-icon-svg {
	color: var(--cps-c-primary-text);
}

/* SAU KHI DA THICH, plugin thay ca cai nut bang cum nay:
       <span class="feedback"><svg/> Da thich</span>
       <a href=".../wishlist/">Da thich</a>
   Tuc la chu "Da thich" nam o CA HAI phan tu.

   Cach xu ly: bo han <span> di, chi giu <a>, roi ve lai trai tim bang
   ::before. Nho vay tren man hinh thay dung mot muc, va trinh doc man hinh
   cung chi doc "Da thich" MOT lan - neu chi thu nho chu cua <span> xuong 0
   thi mat nhin khong thay nhung may doc van doc hai lan.

   (Truoc day o day an ca hai, thanh ra bam Yeu thich xong la muc bien mat
   khoi hang - do la loi.) */
/* Cum "da thich" bi ca plugin lan Flatsome dat lai display va margin tu tep
   nap sau tep nay - cung ly do voi .feedback ben duoi, nen cung phai
   !important. Khong co no thi cum bi day thanh khoi rieng, cao 43px trong
   khi ba muc con lai chi 21px. */
.cps-wishlist .yith-wcwl-wishlistaddedbrowse,
.cps-wishlist .yith-wcwl-wishlistexistsbrowse {
	display: inline-flex !important;
	flex-direction: row;
	align-items: center;
	gap: 6px;
	margin: 0 !important;
	color: var(--cps-c-primary-text);
}

/* Phai dung !important o dung mot cho nay.

   Ca plugin YITH lan phan tich hop wishlist san co cua Flatsome deu dat
   display cho .feedback, va tep cua ho duoc nap sau tep nay. Da thu nang
   len ba lop bo chon (.cps-wishlist .yith-wcwl-wishlistaddedbrowse
   .feedback) van khong an duoc - do la luc !important la cach dung, khong
   phai cach luoi. */
.cps-wishlist .feedback,
.cps-wishlist .yith-wcwl-add-to-wishlist-button--icon-only .separator {
	display: none !important;
}

/* Trai tim TO DAC cho trang thai da thich. Ve bang mask de hinh lay mau
   tu currentColor, dung mot net voi trai tim rong o trang thai chua thich. */
.cps-wishlist .yith-wcwl-wishlistaddedbrowse a::before,
.cps-wishlist .yith-wcwl-wishlistexistsbrowse a::before {
	content: "";
	display: block;
	flex: none;
	background: currentColor;
	-webkit-mask: var(--cps-heart) center / contain no-repeat;
	mask: var(--cps-heart) center / contain no-repeat;
}

.cps-wishlist {
	--cps-heart: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21 8.25c0-2.485-2.099-4.5-4.688-4.5-1.935 0-3.597 1.126-4.312 2.733-.715-1.607-2.377-2.733-4.313-2.733C5.1 3.75 3 5.765 3 8.25c0 7.22 9 12 9 12s9-4.78 9-12Z'/%3E%3C/svg%3E");
}

/* ================================================================
   2. NUT TREN TRANG SAN PHAM
   ================================================================ */

/* Mac cho nut cua plugin dung bo ao cua .cps-action, de bon muc
   Yeu thich / Hoi dap / Thong so / So sanh nhin nhu mot bo. */
.cps-wishlist--action .add_to_wishlist,
.cps-compare .compare {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	font-family: inherit;
	font-size: var(--cps-fs-md);
	line-height: var(--cps-lh-md);
	font-weight: var(--cps-fw-medium);
	color: var(--cps-c-blue);
	text-decoration: none;
	text-transform: none;
	letter-spacing: normal;
	white-space: nowrap;
	box-shadow: none;
	min-height: 0;
	cursor: pointer;
}

.cps-wishlist--action .add_to_wishlist:hover,
.cps-compare .compare:hover {
	background: none;
	color: var(--cps-c-primary-text);
}

/* Icon trai tim cua plugin la SVG net, chinh lai cho bang icon cua minh.

   Phai viet dai the nay vi plugin dat co bang
   ".yith-wcwl-add-to-wishlist svg.yith-wcwl-icon-svg" - hai lop mot the.
   Mot lop don o day se thua va icon giu nguyen 25px. */
.cps-wishlist--action .yith-wcwl-add-to-wishlist svg.yith-wcwl-icon-svg {
	width: 20px;
	height: 20px;
	margin: 0;
	stroke-width: 1.5;
}

/* Da thich roi: link "Da thich" mac cung bo ao voi ba nut con lai. */
.cps-wishlist--action .yith-wcwl-wishlistaddedbrowse a,
.cps-wishlist--action .yith-wcwl-wishlistexistsbrowse a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: var(--cps-fs-md);
	line-height: var(--cps-lh-md);
	font-weight: var(--cps-fw-medium);
	color: var(--cps-c-primary-text);
	text-decoration: none;
	white-space: nowrap;
}

.cps-wishlist--action .yith-wcwl-wishlistaddedbrowse a::before,
.cps-wishlist--action .yith-wcwl-wishlistexistsbrowse a::before {
	width: 20px;
	height: 20px;
}

/* Trai tim to dac de nhin la biet da thich. */
.cps-wishlist--action .yith-wcwl-add-to-wishlist svg.yith-wcwl-icon-svg {
	width: 20px;
	height: 20px;
}

.cps-wishlist .yith-wcwl-wishlistaddedbrowse svg.yith-wcwl-icon-svg,
.cps-wishlist .yith-wcwl-wishlistexistsbrowse svg.yith-wcwl-icon-svg,
.cps-wishlist .add_to_wishlist.added svg.yith-wcwl-icon-svg {
	fill: var(--cps-c-primary);
	stroke: var(--cps-c-primary);
}

/* Icon so sanh do PHP chen vao (xem cps_compare_button), chinh co cho bang
   icon cua ba nut con lai. */
.cps-compare .compare .cps-icon {
	width: 20px;
	height: 20px;
	flex: none;
}

/* Da nam trong bang so sanh.

   Mau bat o hai cho KHONG giong nhau, va co ly do:

     tren trang san pham  ca hang hanh dong ("Yeu thich / Hoi dap / Thong so
                          / So sanh") von da xanh, nen bat phai doi sang DO
                          moi thay khac - to xanh dam hon thi nhin y het ba
                          muc chua bam.
     tren the san pham    hai nut deu xam luc chua bam, va trai tim bat len
                          la do - nen so sanh bat len to XANH (xem muc 3) de
                          hai nut nam canh nhau van phan biet duoc. */
.cps-compare--action .compare.added {
	color: var(--cps-c-primary-text);
}

/* ================================================================
   3. NUT TREN THE SAN PHAM
   ================================================================ */

/* O the san pham chi con trai tim, khong co chu, va nam trong o tron 36x32
   giong nut cu.

   Ghim chieu cao cho CA BA lop bao ngoai: o trang thai chua thich, plugin
   long them mot lop .yith-wcwl-add-button co le rieng, lam ca cum cao 48px
   thay vi 32px - the do bi day cao hon nhung the khac 12px. */
.cps-wishlist--card,
.cps-wishlist--card .yith-wcwl-add-to-wishlist,
.cps-wishlist--card .yith-wcwl-add-button {
	flex: none;
	height: 32px;
	margin: 0;
	padding: 0;
}

.cps-wishlist--card .add_to_wishlist {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 32px;
	margin: 0;
	padding: 8px;
	border: 0;
	border-radius: 50%;
	background: none;
	color: var(--cps-c-muted);
	box-shadow: none;
	min-height: 0;
}

/* Chu "Yeu thich" khong co cho tren the - an di nhung van de lai cho trinh
   doc man hinh doc duoc. */
.cps-wishlist--card .add_to_wishlist span:not(.yith-wcwl-icon):not([class*="icon"]) {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

.cps-wishlist--card .yith-wcwl-add-to-wishlist svg.yith-wcwl-icon-svg {
	width: 18px;
	height: 18px;
	margin: 0;
}

.cps-wishlist--card .add_to_wishlist:hover {
	background: var(--cps-c-primary-pale);
	color: var(--cps-c-primary-text);
}

.cps-wishlist--card .add_to_wishlist.added {
	color: var(--cps-c-primary-text);
}

/* DA THICH tren the san pham: khong co cho cho chu "Da thich", nen giu lai
   moi trai tim do. Link van phu len toan bo o de bam duoc sang trang danh
   sach - neu khong, o nay thanh mot hinh trang tri khong bam duoc. */
.cps-wishlist--card .yith-wcwl-wishlistaddedbrowse,
.cps-wishlist--card .yith-wcwl-wishlistexistsbrowse {
	position: relative;
	justify-content: center;
	width: 36px;
	height: 32px;
	border-radius: 50%;
}

.cps-wishlist--card .yith-wcwl-wishlistaddedbrowse a,
.cps-wishlist--card .yith-wcwl-wishlistexistsbrowse a {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0;
	color: var(--cps-c-primary-text);
	text-decoration: none;
}

.cps-wishlist--card .yith-wcwl-wishlistaddedbrowse a::before,
.cps-wishlist--card .yith-wcwl-wishlistexistsbrowse a::before {
	width: 18px;
	height: 18px;
}

.cps-wishlist--card .yith-wcwl-wishlistaddedbrowse:hover,
.cps-wishlist--card .yith-wcwl-wishlistexistsbrowse:hover {
	background: var(--cps-c-primary-pale);
}

.cps-wishlist--card .yith-wcwl-add-to-wishlist svg.yith-wcwl-icon-svg {
	width: 18px;
	height: 18px;
}

/* ----- Nut so sanh tren the -----

   Cung khuon voi nut yeu thich: o tron 36x32, chi con icon. Chu "So sanh"
   van nam trong ma nguon nhung day ra ngoai tam nhin, khong dung
   display:none - trinh doc man hinh phai doc duoc nut nay lam gi. */
.cps-card__tools {
	display: flex;
	align-items: center;
	flex: none;
	gap: 2px;
}

.cps-compare--card,
.cps-compare--card .compare-button {
	flex: none;
	height: 32px;
	margin: 0;
	padding: 0;
}

.cps-compare--card .compare {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 32px;
	min-height: 0;
	margin: 0;
	padding: 8px;
	border: 0;
	border-radius: 50%;
	background: none;
	color: var(--cps-c-muted);
	box-shadow: none;
}

.cps-compare--card .compare .label {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

.cps-compare--card .compare .cps-icon {
	width: 18px;
	height: 18px;
	margin: 0;
}

.cps-compare--card .compare:hover {
	background: #fffae0;
	color: var(--cps-c-blue);
}

/* Da nam trong bang so sanh: to xanh cho de phan biet voi nut chua bam. */
.cps-compare--card .compare.added {
	color: var(--cps-c-blue);
}

/* ================================================================
   4. TRANG DANH SACH YEU THICH
   ================================================================

   Trang nay dung dung khuon THE SAN PHAM cua trang danh muc: template
   woocommerce/wishlist-view.php ghi de ban cua plugin va goi thang
   content-product.php cho tung mon. Nho vay sua giao dien the mot cho la ca
   hai trang cung doi theo, khong con mot ban song song phai bao tri.

   O day chi con nhung gi rieng cua trang: tieu de, nut bo khoi danh sach dan
   len goc the, hang chia se, va truong hop danh sach rong. */

/* Trang danh sach yeu thich la mot trang WordPress thuong nen no nam trong
   khung hep cua Flatsome (row-main, 1080px). The san pham thi tinh be ngang
   theo phan tram, nen trong khung do moi the chi con 191px thay vi 227px
   nhu trang danh muc - chu bi chat lai. Nong khung ve dung be ngang cua cac
   trang cua hang, va chi nong o RIENG trang nay. */
.woocommerce-wishlist .row-main,
.woocommerce-wishlist .content-area .col {
	max-width: none;
	padding-left: 0;
	padding-right: 0;
}

.woocommerce-wishlist .woocommerce {
	max-width: var(--cps-container);
	margin: 0 auto;
	padding: 0 var(--cps-sp-4);
}

.woocommerce-wishlist .woocommerce *,
.woocommerce-wishlist .woocommerce *::before,
.woocommerce-wishlist .woocommerce *::after {
	box-sizing: border-box;
}

/* ----- Tieu de trang ----- */

.wishlist-title {
	margin-bottom: var(--cps-sp-5);
}

.wishlist-title h2 {
	margin: 0;
	font-size: var(--cps-fs-price);
	line-height: 32px;
	font-weight: var(--cps-fw-bold);
	color: var(--cps-c-heading);
	text-transform: none;
	letter-spacing: normal;
}

/* ----- Moi mon trong danh sach ----- */

/* Lop boc them mot lop quanh the de co cho dat nut bo. Be ngang mot cot do
   ".cps-product-grid > *" trong product-card.css lo, o day chi can lam moc
   toa do cho nut bo va cho the ben trong lap day. */
.cps-wishlist-item {
	position: relative;
	display: flex;
}

.cps-wishlist-item > .cps-card {
	width: 100%;
}

/* Nut bo: dam tren goc tren PHAI cua the.

   The san pham da co nhan giam gia nho o goc tren TRAI (xem product-card.css)
   nen hai thu khong dam nhau. Nut chi ro han khi ro chuot vao the, giong
   cach trang mau lam voi nut xoa. */
.cps-wishlist-item__remove {
	position: absolute;
	top: 8px;
	right: 8px;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 1px 6px rgba(0, 0, 0, 0.16);
	color: var(--cps-c-muted);
	text-decoration: none;
	opacity: 0;
	transition: opacity 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}

.cps-wishlist-item:hover .cps-wishlist-item__remove,
.cps-wishlist-item__remove:focus-visible {
	opacity: 1;
}

.cps-wishlist-item__remove:hover {
	background: var(--cps-c-primary);
	color: var(--cps-c-on-primary);
}

.cps-wishlist-item__remove .cps-icon {
	width: 10px;
	height: 10px;
}

/* ----- Danh sach rong ----- */

/* Khoi nay la con truc tiep cua luoi nen no cung an mot cot theo quy tac
   ".cps-product-grid > *" (0,1,1). Viet kem ten luoi de manh hon quy tac do
   - chi ghi "flex" khong thi khong thang duoc, va khoi bao "chua co san
   pham nao" se co lai bang mot the. */
.cps-product-grid > .cps-wishlist-page__empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--cps-sp-3);
	flex: 1 1 100%;
	max-width: none;
	margin: 0;
	padding: var(--cps-sp-8) var(--cps-sp-4);
	border: 1px dashed var(--cps-c-border);
	border-radius: var(--cps-r-xl);
	background: var(--cps-c-bg-soft);
	font-size: var(--cps-fs-base);
	line-height: var(--cps-lh-base);
	color: var(--cps-c-muted);
	text-align: center;
}

.cps-wishlist-page__shop {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 38px;
	padding: 0 var(--cps-sp-5);
	border-radius: var(--cps-r-sm);
	background: var(--cps-c-cta);
	font-size: var(--cps-fs-md);
	font-weight: var(--cps-fw-semibold);
	color: var(--cps-c-on-primary);
	text-decoration: none;
}

.cps-wishlist-page__pagination {
	display: flex;
	justify-content: center;
	margin-top: var(--cps-sp-4);
}

/* ----- Hang chia se ----- */

.yith-wcwl-share {
	display: flex;
	align-items: center;
	gap: var(--cps-sp-2);
	margin-top: var(--cps-sp-5);
	padding-top: var(--cps-sp-4);
	border-top: 1px solid var(--cps-c-border);
}

.yith-wcwl-share .yith-wcwl-share-title {
	margin: 0;
	font-size: var(--cps-fs-md);
	font-weight: var(--cps-fw-medium);
	color: var(--cps-c-muted);
	text-transform: none;
}

.yith-wcwl-share ul {
	display: flex;
	gap: 6px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.yith-wcwl-share li {
	margin: 0;
}

/* Chi chinh co va hinh dang; mau thi de nguyen mau thuong hieu cua tung
   mang xa hoi ma Flatsome to san - do la mau nguoi dung quen mat. */
.yith-wcwl-share a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
}

/* ================================================================
   5. BANG SO SANH
   ================================================================ */

/* THANH SO SANH noi o day man hinh khi da chon san pham.
   Mac dinh cua plugin la mot dai den mo. Doi sang nen trang co do bong cho
   hop voi phan con lai cua trang. */
#yith-woocompare-preview-bar {
	background: #fff;
	box-shadow: 0 -4px 20px -6px rgba(0, 0, 0, 0.18);
}

#yith-woocompare-preview-bar .container {
	position: relative;
	max-width: 1200px;
	margin: 0 auto;
}

/*
 * Nut tat thanh (chen bang JS - plugin khong co san).
 *
 * Dat o goc tren ben phai cua thanh, ngoai luong noi dung, de khong day
 * hang anh san pham sang trai.
 */
#yith-woocompare-preview-bar .cps-bar-close {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 32px;
	height: 32px;
	/* Flatsome dat min-height cho moi <button>; khong go thi nut cao 39px
	   thay vi 32px va lech khoi goc. */
	min-height: 0;
	padding: 0;
	border: 0;
	border-radius: var(--cps-r-full);
	background: none;
	color: var(--cps-c-muted);
	cursor: pointer;
	transition: background-color 0.12s ease, color 0.12s ease;
}

#yith-woocompare-preview-bar .cps-bar-close:hover {
	background: var(--cps-c-bg-grey);
	color: var(--cps-c-strong);
}

#yith-woocompare-preview-bar .cps-bar-close:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px rgba(255, 215, 0, 0.55);
}

#yith-woocompare-preview-bar .cps-bar-close .cps-icon {
	width: 14px;
	height: 14px;
}

/*
 * Da bam tat. Dung "display: none" chu khong phai bo class "shown" cua
 * plugin: plugin tu gan lai class do moi lan ve lai thanh, sua cua no thi
 * lan sau thanh lai hien len.
 */
#yith-woocompare-preview-bar.cps-bar-hidden {
	display: none;
}

#yith-woocompare-preview-bar p {
	font-size: var(--cps-fs-md);
	line-height: var(--cps-lh-md);
	font-weight: var(--cps-fw-medium);
	color: var(--cps-c-strong);
}

/* Nut "Xem so sanh" theo dung kieu nut chinh cua trang. */
#yith-woocompare-preview-bar .yith-woocompare-open,
#yith-woocompare-preview-bar a.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 40px;
	padding: 0 var(--cps-sp-5);
	border: 0;
	border-radius: var(--cps-r-sm);
	background: var(--cps-c-primary);
	font-size: var(--cps-fs-md);
	font-weight: var(--cps-fw-semibold);
	color: var(--cps-c-on-primary);
	text-transform: none;
	letter-spacing: normal;
}

/* O san pham da chon: vien mong, bo goc, anh nam gon.

   Anh goc cua cac san pham khong cung kich thuoc, nen dat KHUNG cao co dinh
   roi can anh vao giua - khong ep chieu cao len chinh anh de anh nho khong
   bi keo gian vo net. */
#yith-woocompare-preview-bar .preview-item,
#yith-woocompare-preview-bar li {
	border: 1px solid var(--cps-c-border);
	border-radius: var(--cps-r-sm);
	background: #fff;
}

#yith-woocompare-preview-bar .compare-list .image-wrap {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 78px;
}

#yith-woocompare-preview-bar img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

/* ----- BANG SO SANH -----

   Plugin ban 3.14 mo bang NGAY TRONG TRANG (khong phai iframe nhu ban cu),
   nen o day chinh duoc toan bo.

   Bo CSS cua plugin de cot rong 300px, anh an het be ngang o (thanh anh
   300x300) va o dem 40px hai ben - mot bang hai san pham da tran ra ngoai
   man hinh. Cac quy tac duoi day keo lai cho vua. */

.yith-woocompare-popup-container {
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(24, 24, 27, 0.55);
	padding: var(--cps-sp-5) var(--cps-sp-4);

	/* Lam mo nen phia sau cho bang noi han len. Trinh duyet nao khong hieu
	   thi bo qua dong nay, lop phu toi o tren van du toi de doc. */
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}

/* Nen trang phai viet kem !important: plugin dat
   "background: none !important" cho chinh lop nay (compare.css), nen khong
   co cach nao thang bang do dac hieu. Khong co nen thi ca bang trong suot,
   nhin xuyen xuong trang phia sau. */
.yith-woocompare-table-wrapper {
	width: 100%;
	max-width: 1100px;
	max-height: 100%;
	margin: 0 auto;
	border-radius: 20px;
	background: #fff !important;
	font-family: var(--cps-font);
	font-size: var(--cps-fs-md);
	color: var(--cps-c-text);
	box-shadow: 0 24px 70px -20px rgba(0, 0, 0, 0.5);

	/* Thanh cuon manh, khong con hai vach xam day cua he dieu hanh. */
	scrollbar-width: thin;
	scrollbar-color: #d6d6d6 transparent;
}

.yith-woocompare-table-wrapper::-webkit-scrollbar {
	width: 8px;
}

.yith-woocompare-table-wrapper::-webkit-scrollbar-thumb {
	border: 2px solid #fff;
	border-radius: var(--cps-r-full);
	background: #d6d6d6;
}

.yith-woocompare-table-scroll-wrapper {
	padding: var(--cps-sp-5);
}

/* Tieu de bang KHONG phai mot dong rieng phia tren: plugin nhet no vao
   chinh O GOC TRAI TREN cua bang (the <th> cua hang anh + ten). O do chi
   rong 150px nen chu 20px bi be thanh ba dong - ha xuong 17px cho vua hai
   dong, va can xuong day o cho thang hang voi ten san pham ben canh.

   (Truoc do o day co "position: sticky" - vo nghia khi tieu de nam trong
   mot o cua bang, va con lam no de len cac dong ben duoi khi cuon.) */
.yith-woocompare-table-wrapper h2 {
	margin: 0;
	font-size: 17px;
	line-height: 23px;
	font-weight: var(--cps-fw-bold);
	color: var(--cps-c-heading);
	text-transform: none;
}

#yith-woocompare table.compare-list tbody .product_info th {
	vertical-align: bottom;
	padding-bottom: var(--cps-sp-4);
}

/* Nut dong cung dinh theo tieu de, neu khong cuon xuong la mat nut. */
a.yith-woocompare-popup-close {
	position: sticky;
	float: right;
	z-index: 4;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	top: 0;
	right: 0;
	border-radius: 50%;
	background: #f4f4f4;
	font-size: 22px;
	line-height: 1;
	color: var(--cps-c-text);
	transition: background-color 0.15s ease, color 0.15s ease;
}

a.yith-woocompare-popup-close:hover {
	background: var(--cps-c-primary);
	color: var(--cps-c-on-primary);
}

/* Plugin ghim moi o rong 300px. Voi ba san pham la bang da rong 1116px
   trong khi hop chi 1100px, nen cot cuoi bi cat mat mot doan du con thua
   cho. Ha xuong de ba cot vua khit; tu bon san pham tro len thi van cuon
   ngang, va cot nhan da duoc DataTables ghim ben trai nen khong lac huong.

   Phai ha o CA thead va tfoot chu khong chi tbody: DataTables do chieu rong
   bang tu hang dau va hang cuoi, bo qua than bang. */
#yith-woocompare table.compare-list thead th:not(.filler),
#yith-woocompare table.compare-list thead td:not(.filler),
#yith-woocompare table.compare-list tfoot th:not(.filler),
#yith-woocompare table.compare-list tfoot td:not(.filler) {
	min-width: 150px;
	width: auto;
}

/* Cot: cot dau la nhan, cac cot sau la san pham. Viet kem "tbody" de thang
   quy tac "#yith-woocompare table.compare-list td:not(.filler)" cua plugin
   (1,2,1) - them mot the la du, khong phai dung !important. */
#yith-woocompare table.compare-list tbody th:not(.filler) {
	min-width: 150px;
	width: 22%;
	padding: 10px var(--cps-sp-3);
	font-size: var(--cps-fs-sm);
	font-weight: var(--cps-fw-medium);
	color: var(--cps-c-muted);
	text-transform: none;
	vertical-align: middle;
}

#yith-woocompare table.compare-list tbody td:not(.filler) {
	min-width: 180px;
	width: auto;
	padding: 10px var(--cps-sp-3);
	font-size: var(--cps-fs-md);
	line-height: var(--cps-lh-md);
	color: var(--cps-c-strong);
}

/* Hang xen ke cho mat de bam theo chieu ngang khi bang rong. */
#yith-woocompare table.compare-list tbody tr:nth-child(even) th,
#yith-woocompare table.compare-list tbody tr:nth-child(even) td {
	background: #fafafa;
}

/* Ro chuot vao dong nao thi to ca dong do - so hai may theo tung dong nen
   day la thao tac hay dung nhat o bang nay.

   Phai to o CA HAI bang: DataTables tach cot nhan ra mot bang phu ghim ben
   trai, hai bang la hai cay DOM rieng nen :hover cua ben nay khong voi sang
   ben kia duoc. Doan JS nho trong single-product.js noi hai ben lai. */
#yith-woocompare table.compare-list tbody tr:hover th,
#yith-woocompare table.compare-list tbody tr:hover td,
#yith-woocompare table.compare-list tbody tr.cps-row-hover th,
#yith-woocompare table.compare-list tbody tr.cps-row-hover td {
	background: #fffae0;
}

/* Duong ke mo giua cac dong, thay cho vien dam cua plugin. */
#yith-woocompare table.compare-list tbody th,
#yith-woocompare table.compare-list tbody td {
	border-top: 1px solid #f0f0f2;
}

/* Anh: plugin de width:100% nen anh phong to bang ca o.

   Dat KHUNG cao co dinh roi cho anh nam gon ben trong, thay vi ep chieu cao
   len chinh anh: anh goc cua vai san pham chi 50px, ep len 140px thi vo net.
   Anh nho van nam giua khung, cac cot van thang hang nhau. */
#yith-woocompare table.compare-list .product_info .image-wrap,
#yith-woocompare table.compare-list .product_info .container-image-and-badge {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 140px;
	padding: var(--cps-sp-2);
	border-radius: 12px;
	background: var(--cps-c-bg-soft);
	line-height: normal;
}

#yith-woocompare table.compare-list .product_info img {
	width: auto;
	max-width: 100%;
	max-height: 140px;
	margin: 0 auto;
	object-fit: contain;
}

#yith-woocompare table.compare-list .product_info td > * {
	margin-bottom: var(--cps-sp-2);
}

#yith-woocompare table.compare-list .product_title {
	font-size: var(--cps-fs-md);
	line-height: var(--cps-lh-md);
	font-weight: var(--cps-fw-medium);
	color: var(--cps-c-heading);
}

#yith-woocompare table.compare-list tr.price {
	font-size: var(--cps-fs-base);
	font-weight: var(--cps-fw-bold);
	color: var(--cps-c-primary-text);
}

/* Nut them vao gio trong bang: theo dung kieu nut chinh cua trang. */
#yith-woocompare table.compare-list .product_info .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 36px;
	padding: 0 var(--cps-sp-4);
	border: 0;
	border-radius: var(--cps-r-sm);
	background: var(--cps-c-cta);
	font-size: var(--cps-fs-md);
	font-weight: var(--cps-fw-semibold);
	color: var(--cps-c-on-primary);
	text-transform: none;
	letter-spacing: normal;
}

/* Lien ket "Bo" duoi moi cot san pham: vien thuoc nho, mo cho no lui ve sau
   nut "Mua" ngay tren no. */
#yith-woocompare table.compare-list .remove a {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 2px 10px;
	border: 1px solid var(--cps-c-border);
	border-radius: var(--cps-r-full);
	font-size: var(--cps-fs-xs);
	line-height: 18px;
	color: var(--cps-c-muted);
	text-decoration: none;
	text-transform: none;
	transition: border-color 0.12s ease, color 0.12s ease;
}

#yith-woocompare table.compare-list .remove a:hover {
	border-color: var(--cps-c-primary);
	color: var(--cps-c-primary-text);
}

/* Bang chua co san pham nao. */
.yith-woocompare-table-wrapper .woocommerce > p,
#yith-woocompare .yith-woocompare-empty {
	margin: 0;
	padding: var(--cps-sp-8) var(--cps-sp-4);
	border: 1px dashed var(--cps-c-border);
	border-radius: var(--cps-r-xl);
	background: var(--cps-c-bg-soft);
	font-size: var(--cps-fs-base);
	line-height: var(--cps-lh-base);
	color: var(--cps-c-muted);
	text-align: center;
}

/* Bang so sanh cua plugin dung DataTables: cot dau duoc nhan doi thanh mot
   bang phu ghim ben trai. Bang phu do phai cao dung bang bang chinh, neu
   khong hai ben lech dong. */
.DTFC_LeftBodyWrapper,
.DTFC_LeftBodyLiner {
	background: #fff;
}

/* Thanh dem so sanh o goc man hinh (widget cua plugin). */
.yith-woocompare-counter {
	font-size: var(--cps-fs-md);
}

.yith-woocompare-counter a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--cps-c-strong);
	text-decoration: none;
}

.yith-woocompare-counter a:hover {
	color: var(--cps-c-primary-text);
}

.yith-woocompare-counter img {
	width: 20px;
	height: 20px;
}

/* ================================================================
   6. MAN HINH NHO
   ================================================================ */

@media (max-width: 1023px) {

}

@media (max-width: 767px) {

	.wishlist-title h2 {
		font-size: var(--cps-fs-xl);
		line-height: 27px;
	}

	/* Tren dien thoai khong co thao tac ro chuot, nen nut bo phai hien san -
	   neu khong no thanh nut khong bao gio bam duoc. */
	.cps-wishlist-item__remove {
		opacity: 1;
	}

	/* Popup so sanh: bo phan dem cho bang rong ra, va cho phep keo ngang. */
	.yith-woocompare-popup-container {
		padding: var(--cps-sp-2);
	}

	.yith-woocompare-table-scroll-wrapper {
		padding: var(--cps-sp-4) var(--cps-sp-3);
	}

	#yith-woocompare table.compare-list tbody th:not(.filler),
	#yith-woocompare table.compare-list tbody td:not(.filler) {
		min-width: 130px;
		padding: var(--cps-sp-2);
		font-size: var(--cps-fs-xs);
	}

	#yith-woocompare table.compare-list .product_info .image-wrap {
		height: 90px;
	}

	#yith-woocompare table.compare-list .product_info img {
		max-height: 90px;
	}
}