/* Trang chủ thử nghiệm. Chỉ dùng biến --dv-* của dv-hethong.css, không thêm màu riêng.
   Bố cục theo bản vẽ đã duyệt: từ 900px là hàng kiểu cuống phiếu, dưới 900px là thẻ điện thoại.
   Cỡ chữ màn đầu bản máy tính gói trong năm cỡ: 40, 26, 20, 16, 13. Thêm cỡ thứ sáu là trượt luật
   đo ở DESIGN.md §10.3, nên cỡ nào mới cũng phải chọn trong năm cỡ này. */

.tc{font-variant-numeric:tabular-nums}
.tc-khung{width:100%;max-width:1232px;margin:0 auto;padding:0 16px}
.tc-an{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.tc-bo-qua{position:absolute;left:16px;top:-60px;z-index:5;padding:10px 16px;border-radius:var(--dv-bo-vien);background:var(--dv-be-mat);font-weight:600}
.tc-bo-qua:focus{top:10px}
.tc button{font-family:var(--dv-font)}

/* con Dê: ảnh ở assets/de/, một hình dùng chung cho sáng và tối */
.tc-de-svg{flex:none;display:block}

/* ---------- đầu trang ---------- */
.tc-dau{border-bottom:1px solid var(--dv-duong-ke)}
.tc-dau-hang{display:flex;align-items:center;gap:40px;min-height:64px}
.tc-logo{flex:none;display:inline-flex;align-items:center;gap:9px;min-height:44px;color:var(--dv-tieu-de);text-decoration:none;font-size:16px;font-weight:800;letter-spacing:-.01em}
.tc-menu{flex:1;display:flex;align-items:center;gap:28px}
.tc-menu a{display:inline-flex;align-items:center;min-height:44px;color:var(--dv-chu-phu);font-size:16px;font-weight:600;text-decoration:none}
.tc-menu a[aria-current]{color:var(--dv-tieu-de)}
.tc-menu a:hover{color:var(--dv-tieu-de)}
.tc-dau-cong-cu{display:none}
.tc-lien-ket-nut{display:inline-flex;align-items:center;min-height:44px;padding:0;border:0;background:none;color:var(--dv-lien-ket);font:600 16px/1.2 var(--dv-font);cursor:pointer;text-decoration:none}
.tc-lien-ket-nut:hover{text-decoration:underline}

/* ---------- mở đầu ---------- */
.tc-mo-dau{display:flex;align-items:center;justify-content:space-between;gap:32px;padding-top:24px}
.tc-mo-dau h1{font-size:40px;font-weight:900;line-height:48px;letter-spacing:-.01em}
.tc-lien{white-space:nowrap}
/* bút dạ quang dưới hai chữ hành động, kiểu Rakuten. Dùng màu nhấn duy nhất, pha loãng */
.tc-h1-nhan{padding:0 .08em;background:linear-gradient(transparent 58%,color-mix(in srgb,var(--dv-diem-nhan) 30%,transparent) 58%);color:inherit;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.tc-phu{max-width:680px;margin-top:6px;font-size:16px;line-height:24px;color:var(--dv-chu-phu)}
/* dòng cập nhật thành nhãn nhỏ trên tiêu đề, kèm chấm "còn sống" */
.tc-meta{display:inline-flex;align-items:center;gap:8px;margin-bottom:8px;padding:4px 12px 4px 10px;border-radius:var(--dv-bo-vien);background:var(--dv-nen-nhan);color:var(--dv-tieu-de);font-size:13px;font-weight:600;line-height:18px}
.tc-meta[hidden]{display:none}
.tc-cham-song{position:relative;width:8px;height:8px;border-radius:50%;background:var(--dv-diem-nhan)}
.tc-cham-song::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--dv-diem-nhan);animation:tc-song 1.8s ease-out infinite}
@keyframes tc-song{from{transform:scale(1);opacity:.6}to{transform:scale(2.6);opacity:0}}
/* dòng số lượng: 20px, số in màu nhấn */
.tc-so-luong{margin-top:6px;font-size:20px;font-weight:700;line-height:28px;color:var(--dv-tieu-de)}
.tc-so-luong strong{color:var(--dv-diem-nhan);font-weight:900}
/* lối tắt sang chặng 2 (mẹo) và chặng 3 (công cụ) */
.tc-loi-tat{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.tc-loi-tat a{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 14px;border:1px solid var(--dv-duong-ke);border-radius:var(--dv-bo-vien);background:var(--dv-be-mat);color:var(--dv-tieu-de);font-size:13px;font-weight:600;text-decoration:none;transition:border-color .15s,color .15s}
.tc-loi-tat a svg{color:var(--dv-diem-nhan)}
.tc-loi-tat a:hover{border-color:var(--dv-diem-nhan);color:var(--dv-lien-ket)}
.tc-mua-sale{flex:none;display:flex;align-items:center;gap:16px;padding:12px 16px 12px 20px;border-radius:var(--dv-bo-the);background:var(--dv-nen-dam);color:var(--dv-chu-tren-dam)}
.tc-mua-sale-so{font-size:40px;font-weight:900;line-height:48px;letter-spacing:-.01em}
.tc-mua-sale-chu{display:flex;flex-direction:column}
.tc-mua-sale-ten{font-size:16px;font-weight:700;line-height:22px}
.tc-mua-sale-phu{font-size:13px;line-height:18px;color:var(--dv-chu-phu-tren-dam)}

/* họa tiết phiếu: mức giảm thật của deal còn hạn, hiện một lần */
.tc-hoa-tiet{flex:none;display:flex;align-items:center;gap:14px;padding-right:8px}
.tc-ve{--xoay:-4deg;position:relative;display:inline-flex;align-items:center;height:48px;padding:0 18px 0 22px;border:1.5px dashed var(--dv-vien-o);border-radius:var(--dv-bo-o);background:var(--dv-be-mat);color:var(--dv-tieu-de);font-size:20px;font-weight:900;letter-spacing:-.01em;white-space:nowrap;transform:rotate(var(--xoay));animation:tc-ve-vao .45s ease-out both}
.tc-ve::before{content:"";position:absolute;left:-8px;top:50%;width:14px;height:14px;margin-top:-7px;border-radius:var(--dv-bo-vien);background:var(--dv-nen);border:1.5px dashed var(--dv-vien-o);clip-path:inset(0 0 0 50%)}
.tc-ve-2{--xoay:3deg;animation-delay:.06s}
.tc-ve-3{--xoay:-2deg;animation-delay:.12s}
@keyframes tc-ve-vao{from{opacity:0;transform:translateY(8px) rotate(var(--xoay))}to{opacity:1;transform:rotate(var(--xoay))}}

/* ---------- dải nhãn hàng và chip ---------- */
.tc-dai-nhan{display:flex;align-items:center;gap:16px;margin-top:16px}
.tc-dai-nhan-ten{flex:none;font-size:13px;font-weight:700;color:var(--dv-chu-phu)}
/* Khung cuộn ngang cắt mọi thứ tràn ra ngoài, kể cả vòng focus của chip. Đệm 4px rồi kéo lề âm
   đúng 4px: vòng focus nằm gọn trong khung mà vị trí chip không xê dịch. */
.tc-nhan-cuon{display:flex;gap:8px;min-width:0;overflow-x:auto;scrollbar-width:none;padding:4px;margin:-4px}
.tc-nhan-cuon::-webkit-scrollbar{display:none}
/* Thanh cuộn bị ẩn theo bản vẽ, nên mép còn chip khuất được làm mờ để báo là còn. */
.tc-nhan-cuon.tc-con-phai{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 40px),transparent)}
.tc-nhan-cuon.tc-con-trai{-webkit-mask-image:linear-gradient(to right,transparent,#000 40px);mask-image:linear-gradient(to right,transparent,#000 40px)}
.tc-nhan-cuon.tc-con-trai.tc-con-phai{-webkit-mask-image:linear-gradient(to right,transparent,#000 40px,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(to right,transparent,#000 40px,#000 calc(100% - 40px),transparent)}
/* Nhãn chưa có logo: chip chữ đủ tên. Góc bo như ô logo để khác chip ngành ở hàng dưới. */
.tc-chip.tc-chip-nhan{border-radius:var(--dv-bo-o)}
.tc-nut-nhan{flex:none;display:flex;padding:0;border:0;border-radius:var(--dv-bo-o);background:none;cursor:pointer}
.tc-nut-nhan[aria-pressed="true"] .tc-o-logo{border:2px solid var(--dv-diem-nhan)}
.tc-o-logo{flex:none;display:flex;align-items:center;justify-content:center;width:40px;height:40px;overflow:hidden;border:1px solid var(--dv-duong-ke);border-radius:var(--dv-bo-o);background:var(--dv-chu-tren-dam)}
.tc-o-logo img{width:30px;height:30px;border-radius:var(--dv-bo-vien);object-fit:cover}
.tc-o-logo-lon{width:44px;height:44px}
.tc-o-logo-chu{border:1px dashed var(--dv-vien-o);background:var(--dv-be-mat);color:var(--dv-chu-phu);font-size:13px;font-weight:700;line-height:1}
.tc-loc{display:flex;gap:8px;margin-top:8px;margin-bottom:-4px;padding-top:4px;padding-bottom:4px;overflow-x:auto;scrollbar-width:none}
.tc-loc::-webkit-scrollbar{display:none}
.tc-chip{flex:none;display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 16px;border:0;border-radius:var(--dv-bo-vien);background:var(--dv-be-mat);color:var(--dv-tieu-de);box-shadow:inset 0 0 0 1px var(--dv-duong-ke);font-size:13px;font-weight:700;cursor:pointer}
.tc-chip-so{color:var(--dv-chu-phu)}
.tc-chip[aria-pressed="true"]{background:var(--dv-tieu-de);color:var(--dv-nen);box-shadow:none}
.tc-chip[aria-pressed="true"] .tc-chip-so{color:inherit;opacity:.75}
.tc-chip-bo{color:var(--dv-lien-ket)}

/* ---------- lưới chính ---------- */
.tc-luoi{display:grid;grid-template-columns:minmax(0,920px) 256px;justify-content:space-between;gap:24px;align-items:start;margin-top:16px}
.tc-ds:focus{outline:none}
.tc-cot-phu{display:flex;flex-direction:column;gap:16px}

/* ---------- hàng deal kiểu cuống phiếu ---------- */
.tc-nhom-dau{display:flex;align-items:baseline;gap:10px;margin:22px 0 10px;padding:0 4px}
.tc-nhom-dau h2{font-size:20px;font-weight:700;line-height:28px}
.tc-nhom-dau span{font-size:13px;color:var(--dv-chu-phu)}
.tc-nhom-con-dau{display:flex;align-items:baseline;gap:8px;margin:16px 0 8px;padding:0 4px}
.tc-nhom-con-dau h3{font-size:16px;font-weight:700;line-height:24px;color:var(--dv-tieu-de)}
.tc-nhom-con-dau span{font-size:13px;color:var(--dv-chu-phu)}
.tc-nhom{overflow:hidden;border:1px solid var(--dv-duong-ke);border-radius:var(--dv-bo-the);background:var(--dv-be-mat);box-shadow:var(--dv-bong)}
/* 23/10: hàng cũ không có đệm dọc, deal nhiều dòng chạm sát đường kẻ. Thêm 16px trên dưới và giãn dòng chữ. */
.tc-deal{position:relative;display:flex;align-items:center;gap:20px;min-height:96px;padding:16px 24px;background:var(--dv-be-mat);border-bottom:1px solid var(--dv-duong-ke)}
.tc-nhom>.tc-deal:last-child{border-bottom:0}
.tc-lo{position:absolute;left:239px;width:14px;height:14px;border-radius:var(--dv-bo-vien);background:var(--dv-nen);border:1px solid var(--dv-duong-ke)}
.tc-lo-tren{top:-7px}
.tc-lo-duoi{bottom:-7px}
.tc-cot-giam{flex:none;width:212px}
.tc-nhan-the,.tc-chon-loc>span:first-child,.tc-ma-goi,.tc-chan-the{display:none}
/* Không tô Deal Blue: nhãn này không bấm được, mà Deal Blue trên chữ nghĩa là liên kết (DESIGN §3). */
.tc-chon-loc{margin-bottom:4px;font-size:13px;font-weight:700;line-height:18px;letter-spacing:.06em;text-transform:uppercase;color:var(--dv-tieu-de)}
.tc-muc{color:var(--dv-tieu-de);white-space:nowrap}
.tc-muc-so{font-size:22px;font-weight:900;line-height:28px;letter-spacing:-.01em}
.tc-muc-chu{font-size:18px;font-weight:700;line-height:24px;white-space:normal}
.tc-phu-giam{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:13px;line-height:18px;color:var(--dv-chu-phu)}
.tc-sao{display:inline-flex;gap:1px;color:var(--dv-tieu-de)}
.tc-sao-day{fill:currentColor}
.tc-sao-rong{fill:none;stroke:currentColor;stroke-width:1.2}
.tc-dau-kiem{display:inline-flex;align-items:center;padding:0 8px;border:1.5px solid var(--dv-tieu-de);border-radius:var(--dv-bo-o);transform:rotate(-3deg);color:var(--dv-tieu-de);font-weight:800;line-height:22px;letter-spacing:.02em}
.tc-het-nhan{display:inline-flex;align-items:center;gap:5px;padding:0 8px;border-radius:var(--dv-bo-vien);background:var(--dv-xau-nen);color:var(--dv-xau-chu);font-weight:700;line-height:22px}
.tc-than-deal{flex:1;min-width:0;align-self:stretch;display:flex;align-items:center;gap:12px;margin:0 0 0 -10px;padding:0 0 0 20px;border:0;border-left:1.5px dashed var(--dv-duong-ke);background:none;color:inherit;font-size:16px;text-align:left;cursor:pointer}
.tc-than-deal:hover .tc-ten,.tc-than-deal:hover .tc-ten-nhan{color:var(--dv-lien-ket)}
/* Nút thân cao bằng cả hàng, mà nhóm hàng có overflow:hidden để bo góc. Vòng focus vẽ vào trong. */
.tc-than-deal:focus-visible{outline-offset:-3px}
.tc-chu{min-width:0;flex:1;display:flex;flex-direction:column;gap:4px}
/* Tên hãng đậm và gần cỡ mức giảm (18 so với 22px), để thẻ đọc ra "của ai" cùng lúc với "giảm bao nhiêu". */
.tc-ten-nhan{font-size:18px;font-weight:800;line-height:24px;color:var(--dv-tieu-de);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tc-ten{font-size:16px;font-weight:600;line-height:22px;color:var(--dv-chu);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tc-huong-dan{font-size:13px;font-weight:600;line-height:18px;color:var(--dv-tieu-de)}
.tc-dk{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:13px;line-height:20px;color:var(--dv-chu-phu);overflow:hidden}
.tc-ma{flex:none;display:flex;align-items:center;justify-content:center;gap:8px;width:148px;height:44px;padding:0 8px;border:1.5px dashed var(--dv-diem-nhan);border-radius:var(--dv-bo-o);background:var(--dv-nen-nhan);color:var(--dv-lien-ket);font:700 16px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.04em;cursor:pointer}
.tc-ma:hover{border-style:solid}
.tc .tc-ma.tc-da-chep{border-style:solid;background:var(--dv-diem-nhan);color:var(--dv-chu-tren-nhan);font-family:var(--dv-font);letter-spacing:0}
.tc-ma-trong{border:0;background:none;cursor:default}
/* Mã dài hơn 10 ký tự (DULICHNN101026) không lọt ô 148px ở cỡ 16px: lùi chữ về 13px, vẫn đọc trọn mã.
   Chặn thêm dấu ba chấm cho mã dài bất thường, để không bao giờ tràn ra ngoài viền. */
.tc-ma-dai{font-size:13px;letter-spacing:0}
.tc-ma-chu{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tc-ma-het{border-color:var(--dv-vien-o);background:none;color:var(--dv-chu-phu);cursor:default}
.tc-nut{flex:none;display:inline-flex;align-items:center;justify-content:center;width:132px;min-height:44px;padding:0 14px;border:0;border-radius:var(--dv-bo-vien);background:transparent;color:var(--dv-tieu-de);box-shadow:inset 0 0 0 1.5px var(--dv-vien-o);font-size:16px;font-weight:600;line-height:1.2;text-align:center;text-decoration:none;cursor:pointer}
.tc-nut:hover{box-shadow:inset 0 0 0 1.5px var(--dv-tieu-de)}
.tc-nut-chinh{background:var(--dv-diem-nhan);color:var(--dv-chu-tren-nhan);box-shadow:none}
.tc-nut-chinh:hover{box-shadow:none;text-decoration:underline}
.tc-nut-trong{box-shadow:none}
.tc-nut-vua{width:auto;margin-top:12px;padding:0 18px}

/* deal nổi bật */
.tc-noi-bat{padding:20px 24px;border:1px solid var(--dv-duong-ke);border-radius:var(--dv-bo-the);background:var(--dv-nen-nhan)}
.tc-noi-bat .tc-muc-so{font-size:32px;line-height:40px}
.tc-noi-bat .tc-muc-so.tc-dai{font-size:24px;line-height:32px}
.tc-muc-so.tc-rat-dai{font-size:19px;line-height:28px}
.tc-noi-bat .tc-ten-nhan{font-size:20px;line-height:26px}
.tc-noi-bat .tc-than-deal{border-left-color:var(--dv-vien-o)}
.tc-noi-bat .tc-dk{-webkit-line-clamp:3}
.tc-noi-bat .tc-ma{background:var(--dv-be-mat)}
/* Mỗi ngành một deal nổi bật đứng trên khung danh sách, và một nút xem hết khi trang chủ chỉ hiện lát 5 deal. */
.tc-nhom-khoi .tc-noi-bat{margin-bottom:10px}
.tc-nhom-khoi>.tc-dai-meo{margin-top:16px}
.tc-nhom:empty{display:none}
.tc-xem-het{display:flex;width:100%;justify-content:center;margin-top:10px}

/* deal hết hạn: tự nhận ra từ hạn dùng */
.tc-deal.tc-het{background:var(--dv-nen)}
.tc-het .tc-muc,.tc-het .tc-ten,.tc-het .tc-ten-nhan{color:var(--dv-chu-phu)}

/* dải mẹo trong danh sách */
.tc-dai-meo{display:flex;align-items:center;gap:20px;padding:18px 24px;background:var(--dv-nen);border-bottom:1px solid var(--dv-duong-ke)}
.tc-nhom>.tc-dai-meo:last-child{border-bottom:0}
.tc-dai-meo-nhan{flex:none;width:212px;display:flex;flex-direction:column;gap:4px}
.tc-dai-meo-de{display:flex;align-items:center;gap:8px}
.tc-dai-meo-chu{flex:1;min-width:0}
.tc-dai-meo-ten{font-size:16px;font-weight:700;line-height:22px;color:var(--dv-tieu-de)}
.tc-dai-meo-tom{margin-top:4px;font-size:13px;line-height:19px;color:var(--dv-chu-phu)}
.tc-nut-meo{width:auto}
.tc-nhan-nho{font-size:13px;font-weight:700;line-height:18px;letter-spacing:.06em;text-transform:uppercase;color:var(--dv-chu-phu)}
.tc-goi-y-nho{margin-top:8px;font-size:13px;line-height:18px;color:var(--dv-chu-phu)}

/* ---------- cột phụ ---------- */
.tc-the-phu{padding:20px;border:1px solid var(--dv-duong-ke);border-radius:var(--dv-bo-the);background:var(--dv-be-mat)}
.tc-the-phu h2.tc-the-tieu,.tc-the-tieu{font-size:16px;font-weight:700;line-height:22px;color:var(--dv-tieu-de)}
.tc-nhan-nho+.tc-the-tieu{margin-top:8px}
.tc-the-chu{margin-top:8px;font-size:13px;line-height:19px;color:var(--dv-chu-phu)}
.tc-the-chu strong{color:var(--dv-chu);font-weight:700}
.tc-dong-so{display:flex;justify-content:space-between;align-items:baseline;padding:10px 0;border-bottom:1px solid var(--dv-duong-ke);font-size:13px;color:var(--dv-chu-phu)}
.tc-dong-so:last-child{border-bottom:0;padding-bottom:0}
.tc-dong-so strong{font-size:16px;font-weight:700;color:var(--dv-chu)}
.tc-the-tieu+.tc-dong-so{margin-top:4px}
.tc-the-de{display:flex;align-items:center;gap:8px}
.tc-the-de h2.tc-nhan-nho{font-size:13px;line-height:18px;color:var(--dv-chu-phu)}
.tc-meo-ds,.tc-cc-ds{margin:8px 0 0;padding:0;list-style:none}
.tc-meo-nut{display:flex;align-items:center;width:100%;min-height:44px;padding:8px 0;border:0;border-bottom:1px solid var(--dv-duong-ke);background:none;color:var(--dv-lien-ket);font-size:16px;font-weight:600;line-height:22px;text-align:left;cursor:pointer}
.tc-meo-nut{text-decoration:none}
.tc-meo-nut:hover{text-decoration:underline}
.tc-cc-ds a{display:flex;align-items:center;min-height:44px;border-bottom:1px solid var(--dv-duong-ke);font-size:16px;font-weight:600;text-decoration:none}
.tc-cc-ds li:last-child a{border-bottom:0}
.tc-cc-ds a:hover{text-decoration:underline}
.tc-lien-ket-the{display:inline-flex;align-items:center;min-height:44px;font-size:16px;font-weight:600}
.tc-form{display:grid;gap:12px;margin-top:12px}
.tc-form .tc-nut-vua{margin-top:0;justify-self:start}
/* Trên điện thoại .tc-nut nhận grid-area "nut" cho thẻ deal. Trong form không có vùng đó, trình duyệt
   sẽ đẻ thêm một cột và bóp ô nhập. Trả nút về chỗ bình thường. */
.tc-form .tc-nut{grid-area:auto}
.tc-loi{font-size:13px;line-height:1.5;font-weight:600;color:var(--dv-xau-chu)}
.dv-o[aria-invalid="true"]{border-color:var(--dv-xau-vien)}

/* ---------- trạng thái rỗng ---------- */
.tc-rong{display:flex;align-items:center;gap:20px;margin-top:4px;padding:24px;border:1.5px dashed var(--dv-vien-o);border-radius:var(--dv-bo-the);background:var(--dv-be-mat)}
.tc-rong-tieu{font-size:20px;font-weight:700;line-height:28px}
.tc-rong .tc-nut{width:auto;margin-top:12px;padding:0 18px}

/* ---------- dải công cụ nền tối ---------- */
.tc-dai-toi{margin-top:56px;background:var(--dv-nen-dam);color:var(--dv-chu-phu-tren-dam)}
.tc-dai-toi-hang{display:flex;align-items:center;justify-content:space-between;gap:48px;padding-top:40px;padding-bottom:40px}
.tc-dai-toi-chu{max-width:620px}
.tc-dai-toi .tc-nhan-nho{color:var(--dv-chu-phu-tren-dam)}
.tc-dai-toi h2{margin-top:8px;font-size:26px;font-weight:800;line-height:34px;letter-spacing:-.01em;color:var(--dv-chu-tren-dam)}
.tc-dai-toi p:last-child{margin-top:8px;font-size:16px;line-height:26px}
.tc-dai-toi-nut{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:8px;max-width:520px}
.tc-nut-toi{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:var(--dv-bo-vien);box-shadow:inset 0 0 0 1.5px var(--dv-chu-phu-tren-dam);color:var(--dv-chu-tren-dam);font-size:16px;font-weight:600;text-decoration:none}
.tc-nut-toi:hover{box-shadow:inset 0 0 0 1.5px var(--dv-chu-tren-dam)}
.tc-lien-ket-toi{display:inline-flex;align-items:center;min-height:44px;padding:0 8px;color:var(--dv-chu-tren-dam);font-size:16px;font-weight:600}
/* Vòng focus Deal Blue trên nền tối chỉ đạt khoảng 2,6:1. Trên hai dải tối dùng màu chữ sáng. */
.tc-dai-toi :focus-visible,.tc-chan :focus-visible{outline-color:var(--dv-chu-tren-dam)}
.tc-luoi-2{margin-top:0}
.tc-luoi-2 .tc-cot-phu{margin-top:60px}

/* ---------- chân trang ---------- */
.tc-chan{margin-top:56px;background:var(--dv-nen-dam);color:var(--dv-chu-phu-tren-dam)}
.tc-chan-hang{display:flex;align-items:center;gap:28px;padding-top:32px;padding-bottom:32px}
.tc-chan-chu{flex:1;min-width:0}
.tc-chan-chu p{font-size:13px;line-height:20px}
.tc-chan-chu p+p{margin-top:4px}
.tc-chan-chu .tc-chan-ten{font-size:16px;font-weight:700;color:var(--dv-chu-tren-dam)}
.tc-chan-lk{flex:none;display:flex;flex-direction:column;align-items:flex-end}
.tc-chan-lk a,.tc-chan-lk .tc-lien-ket-nut{display:inline-flex;align-items:center;min-height:44px;color:var(--dv-chu-tren-dam);font-size:13px;font-weight:600}

/* ---------- hộp thoại ---------- */
.tc-hop{width:min(560px,calc(100% - 32px));max-height:calc(100% - 32px);padding:24px;border:1px solid var(--dv-vien-the);border-radius:var(--dv-bo-the);background:var(--dv-be-mat);color:var(--dv-chu);box-shadow:var(--dv-bong-noi)}
.tc-hop::backdrop{background:color-mix(in srgb,var(--dv-nen-dam,#0B3A46) 55%,transparent)}
.tc-hop-dau{display:flex;align-items:center;justify-content:space-between;gap:16px}
.tc-hop-nhan{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--dv-chu-phu)}
.tc-dong{flex:none;min-height:44px;padding:0 16px;border:0;border-radius:var(--dv-bo-vien);background:none;color:var(--dv-tieu-de);box-shadow:inset 0 0 0 1.5px var(--dv-vien-o);font-size:16px;font-weight:600;cursor:pointer}
.tc-hop h2{margin-top:8px;font-size:24px;line-height:1.3}
.tc-hop-giam{margin-top:6px;font-size:16px;font-weight:700;color:var(--dv-tieu-de)}
.tc-hop-mo-ta{margin-top:10px;color:var(--dv-chu-phu)}
.tc-meo-noi-dung p+p{margin-top:10px}
.tc-meo-anh{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px;margin-top:14px}
.tc-meo-anh img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:var(--dv-bo-o);background:var(--dv-nen)}
.tc-meo-nguon{margin-top:12px;font-size:13px;color:var(--dv-chu-phu)}
.tc-hop-khoi{margin-top:20px;padding-top:16px;border-top:1px solid var(--dv-duong-ke)}
.tc-hop-tieu{font-size:16px;font-weight:700;color:var(--dv-tieu-de)}
.tc-hop-sao{display:flex;align-items:center;gap:8px;margin-top:6px;font-size:13px;color:var(--dv-chu-phu)}
.tc-hop-hang{display:flex;align-items:center;gap:12px;margin-top:16px}
.tc-cham{display:flex;gap:4px;margin-top:8px}
.tc-nut-sao{display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:0;border-radius:var(--dv-bo-o);background:var(--dv-nen);color:var(--dv-tieu-de);cursor:pointer}
.tc-nut-sao svg{width:24px;height:24px}
.tc-nut-sao:disabled{cursor:default;opacity:.8}
/* Sao góp ý là nhóm radio: ô radio ẩn, vòng focus hiện trên ô sao chứa nó. */
label.tc-nut-sao:has(input:focus-visible){outline:2px solid var(--dv-diem-nhan);outline-offset:2px}
.tc-cham-chon{margin:0;padding:0;border:0}
.tc-bl{margin:10px 0 0;padding:0;list-style:none}
.tc-bl li{padding:10px 0;border-bottom:1px solid var(--dv-duong-ke);font-size:16px;line-height:1.5}
.tc-bl-ai{font-size:13px;color:var(--dv-chu-phu)}
.tc-bl-ai strong{color:var(--dv-chu)}
.tc-bl .tc-bl-rong{color:var(--dv-chu-phu);font-size:13px;border-bottom:0}
textarea.dv-o{resize:vertical;line-height:1.5}

/* thông báo: popover để nổi trên cả hộp thoại modal */
.tc-thong-bao{position:fixed;inset:auto auto 24px 50%;z-index:20;max-width:calc(100% - 32px);width:max-content;margin:0;padding:12px 18px;border:0;border-radius:var(--dv-bo-o);background:var(--dv-tieu-de);color:var(--dv-nen);font-size:16px;font-weight:600;line-height:1.4;transform:translateX(-50%);opacity:0;pointer-events:none;transition:opacity .2s}
.tc-thong-bao.tc-hien{opacity:1}

@media (prefers-reduced-motion:reduce){
  .tc-ve{animation:none}
  .tc-cham-song::after{animation:none}
  .tc-thong-bao{transition:none}
}

/* ---------- dưới 900px: bản điện thoại đã duyệt ---------- */
/* Máy tính màn vừa (900-1279px): cột giữa từng chỉ còn khoảng 110px, tên deal và điều kiện vỡ thành
   cột chữ hẹp (chủ dự án báo 09/10). Thu cột mức giảm, ô mã, nút; bỏ ô mã trống của deal không có mã. */
@media (min-width:900px) and (max-width:1279px){
  .tc-deal{gap:14px;padding:16px}
  .tc-cot-giam{width:160px}
  .tc-lo{left:173px}
  .tc-than-deal{padding-left:14px}
  .tc-ma{width:136px}
  .tc-ma-trong{display:none}
  .tc-nut:not(.tc-xem-het,.tc-nut-vua){width:112px;padding:0 10px}
  .tc-muc-chu{font-size:16px;line-height:22px}
  .tc-noi-bat{padding:20px 16px}
  .tc-noi-bat .tc-muc-so{font-size:28px;line-height:36px}
  .tc-noi-bat .tc-muc-so.tc-dai,.tc-muc-so.tc-rat-dai{font-size:19px}
}
@media (max-width:899px){
  .tc-dau-hang{gap:16px;min-height:52px}
  .tc-logo{font-size:17px}
  .tc-menu,.tc-dau-gop-y,.tc-hoa-tiet{display:none}
  .tc-dau-cong-cu{display:inline-flex;align-items:center;min-height:44px;margin-left:auto;font-size:14px;font-weight:600;text-decoration:none}
  .tc-mo-dau{flex-direction:column;align-items:stretch;gap:12px;padding-top:16px}
  .tc-mo-dau h1{font-size:28px;line-height:1.25}
  .tc-phu{font-size:15px;line-height:1.5}
  .tc-meta{margin-bottom:6px}
  .tc-so-luong{font-size:16px;line-height:24px}
  .tc-xuong-may{display:none}
  .tc-loi-tat{display:none}
  .tc-mua-sale{gap:12px;padding:10px 14px}
  .tc-mua-sale-so{font-size:28px;line-height:1.2}
  .tc-dai-nhan{gap:10px;margin-top:12px}
  .tc-dai-nhan-ten{max-width:64px;line-height:1.3}
  .tc-loc{margin-top:4px}
  .tc-luoi{display:block;margin-top:12px}
  .tc-cot-phu{margin-top:24px}
  .tc-luoi-2 .tc-cot-phu{margin-top:24px}

  .tc-nhom{display:grid;gap:12px;overflow:visible;border:0;border-radius:0;background:none;box-shadow:none}
  .tc-deal{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"nhan" "muc" "phu" "than" "ma" "nut" "chan";align-items:stretch;gap:0;padding:16px;border:1px solid var(--dv-vien-the);border-radius:var(--dv-bo-the);box-shadow:var(--dv-bong)}
  .tc-nhom>.tc-deal{border-bottom:1px solid var(--dv-vien-the)}
  .tc-nhom>.tc-deal:last-child{border-bottom:1px solid var(--dv-vien-the)}
  .tc-noi-bat{margin-bottom:4px;border-color:var(--dv-duong-ke)}
  /* Dải trượt ngang ở trang chủ chưa lọc: thẻ sau ló 15% để người đọc biết còn. */
  .tc-truot{display:flex;gap:12px;margin:0 -16px;padding:0 16px 6px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 16px;scrollbar-width:none;overscroll-behavior-x:contain}
  .tc-truot::-webkit-scrollbar{display:none}
  .tc-truot>.tc-nhom{display:contents}
  .tc-truot .tc-deal{flex:0 0 85%;min-width:0;margin:0;scroll-snap-align:start}
  .tc-nhom-khoi .tc-truot .tc-noi-bat{margin-bottom:0}
  .tc-lo{display:none}
  .tc-cot-giam{display:contents}
  .tc-nhan-the{display:block;grid-area:nhan;font-size:13px;font-weight:700;line-height:18px;letter-spacing:.08em;text-transform:uppercase;color:var(--dv-chu-phu)}
  .tc-chon-loc{grid-area:nhan;display:flex;justify-content:space-between;gap:12px;margin:0}
  .tc-chon-loc>span:first-child{display:inline;color:var(--dv-chu-phu)}
  .tc-chon-loc-nhan{color:var(--dv-tieu-de)}
  .tc-muc{grid-area:muc;margin-top:6px;white-space:normal}
  .tc-muc-so,.tc-muc-so.tc-rat-dai,.tc-noi-bat .tc-muc-so,.tc-noi-bat .tc-muc-so.tc-dai{font-size:24px;line-height:1.2}
  .tc-muc-chu{font-size:22px;font-weight:800;line-height:1.2;color:var(--dv-tieu-de)}
  .tc-ten-nhan,.tc-noi-bat .tc-ten-nhan{font-size:19px;line-height:24px}
  .tc-phu-giam{grid-area:phu;margin-top:6px}
  .tc-phu-giam:not(:has(.tc-het-nhan,.tc-dau-kiem)){display:none}
  .tc-than-deal{grid-area:than;margin:10px 0 0;padding:0;border-left:0;min-height:44px}
  .tc-dk{-webkit-line-clamp:4}
  .tc-ma{grid-area:ma;width:100%;height:48px;margin-top:12px;justify-content:space-between;padding:0 14px}
  .tc-ma-goi{display:inline-flex;align-items:center;gap:6px;font:700 13px/1 var(--dv-font);letter-spacing:.04em}
  .tc-ma-trong{display:none}
  .tc-ma.tc-da-chep{justify-content:center}
  .tc-nut{grid-area:nut;width:100%;min-height:48px;margin-top:10px}
  .tc-nut-trong{display:none}
  .tc-chan-the{grid-area:chan;display:flex;align-items:center;gap:6px;min-height:44px;margin-top:12px;padding:8px 0 0;border:0;border-top:1px solid var(--dv-duong-ke);background:none;color:var(--dv-chu-phu);font-size:13px;text-align:left;cursor:pointer}
  .tc-chan-bl{color:var(--dv-lien-ket);font-weight:600}
  .tc-dai-meo{flex-direction:column;align-items:flex-start;gap:10px;padding:16px;border:1.5px dashed var(--dv-vien-o);border-radius:var(--dv-bo-the)}
  .tc-nhom>.tc-dai-meo:last-child{border-bottom:1.5px dashed var(--dv-vien-o)}
  .tc-dai-meo-nhan{width:auto}
  .tc-rong{flex-direction:column;align-items:flex-start}

  .tc-dai-toi{margin-top:40px}
  .tc-dai-toi-hang{flex-direction:column;align-items:flex-start;gap:20px;padding-top:32px;padding-bottom:32px}
  .tc-dai-toi h2{font-size:22px;line-height:1.35}
  .tc-dai-toi-nut{justify-content:flex-start}
  .tc-chan-hang{flex-direction:column;align-items:flex-start;gap:16px}
  .tc-chan-lk{align-items:flex-start}
  .tc-hop{padding:20px}
  .tc-hop h2{font-size:20px}
}
/* Mẹo bạn đọc gửi: nhãn nhỏ dưới tiêu đề, phân biệt với mẹo "Dê mách" mà DealVerse đã kiểm. */
.tc-meo-ban-doc{display:block;margin-top:2px;font-size:13px;font-weight:600;color:var(--dv-chu-phu)}
/* Ô bẫy máy dò form: ra khỏi màn hình, không ẩn bằng display:none vì nhiều máy bỏ qua ô ẩn kiểu đó. */
.tc-bay{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
