/* =====================================================================
   VITIMEX v14.1 – ƯU ĐÃI RIÊNG QUA LINK (assets/vtm-uu-dai.css, đi cùng vtm-uu-dai.js)
   Chỉ có tác dụng khi khách đã mở link ưu đãi (html.vtm-ud-on). Khách thường không bị ảnh hưởng.
   Màu: navy #00155b · vàng #C9A96E · ngà #F5F1EA · nâu #2e1100 · đỏ giá #A4161A
   Quy ước: số tiền giá riêng màu đỏ giá; nhãn "−x%" giá riêng nền navy chữ vàng (khác nhãn giảm giá thường nền đỏ).
   ===================================================================== */
.vtm-ud-on { --ud-navy: #00155b; --ud-ink: #000022; --ud-gold: #C9A96E; --ud-ivory: #F5F1EA; --ud-sand: #D9C8AC; --ud-brown: #2e1100; --ud-red: #A4161A; --ud-grey: #5F6066; }

/* ---------- thanh trên đầu trang ---------- */
.vtm-ud-bar { display: flex; width: 100%; min-height: 34px; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 16px; margin: 0; border: 0; border-radius: 0; background: var(--ud-navy); color: #fff; font: inherit; font-size: 12px; font-weight: 600; line-height: 1.3; text-align: left; cursor: pointer; box-sizing: border-box; }
.vtm-ud-bar__t { display: flex; align-items: center; gap: 8px; min-width: 0; }
.vtm-ud-bar__t i { font-style: normal; color: var(--ud-gold); }
.vtm-ud-bar svg { width: 18px; height: 18px; flex: 0 0 18px; fill: none; stroke: var(--ud-gold); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.vtm-ud-bar__left { flex: 0 0 auto; color: var(--ud-sand); font-weight: 500; }
.vtm-ud-bar:focus-visible { outline: 2px solid var(--ud-gold); outline-offset: -3px; }
@media (min-width: 992px) { .vtm-ud-bar { justify-content: center; gap: 28px; font-size: 13px; } }

/* ---------- thẻ sản phẩm (danh mục, trang chủ, tìm kiếm…) ---------- */
.vtm-ud-has > :not(.vtm-ud-pr) { display: none !important; }
.vtm-ud-pr { display: block; }
.vtm-ud-pr__row { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; }
.vtm-ud-pr__now { color: var(--ud-red); font-weight: 700; font-size: 15px; white-space: nowrap; }
.vtm-ud-pr__was { color: #6B6B6B; font-size: 12px; white-space: nowrap; }
.vtm-ud-pr__chip { display: inline-block; max-width: 100%; margin-top: 3px; padding: 1px 6px; background: var(--ud-navy); color: var(--ud-gold); font-size: 10px; font-weight: 700; line-height: 1.5; white-space: nowrap; }
.vtm-ud-badge { display: inline-block; margin: 0 4px 4px 0; padding: 3px 7px; background: var(--ud-navy); color: var(--ud-gold); font-size: 10px; font-weight: 700; letter-spacing: .08em; line-height: 1.3; }
@media (max-width: 767px) { .vtm-ud-pr__now { font-size: 14px; } .vtm-ud-pr__chip { font-size: 9.5px; } }

/* ---------- khối giá dựng sẵn dùng chung (thanh mua dính dưới, menu, ô tìm kiếm, lookbook) ----------
   .vtm-ud-px          : 1 hàng  [giá riêng] [giá cũ gạch] [−x%]
   .vtm-ud-px.is-mini  : 2 dòng gọn – giá riêng to ở trên, giá cũ + nhãn nhỏ ở dưới (không bao giờ xuống dòng giữa số) */
.vtm-ud-px { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; line-height: 1.2; max-width: 100%; }
.vtm-ud-px > b { color: var(--ud-red); font-weight: 700; font-size: 15px; white-space: nowrap; }
.vtm-ud-px__sub { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.vtm-ud-px__sub del { color: #6B6B6B; font-size: 12px; font-weight: 400; }
.vtm-ud-px__sub i { font-style: normal; padding: 0 5px; background: var(--ud-navy); color: var(--ud-gold); font-size: 10px; font-weight: 700; line-height: 16px; }
.vtm-ud-px.is-mini { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 1px; }
.vtm-ud-px.is-mini > b { font-size: 16px; line-height: 1.15; }
.vtm-ud-px.is-mini .vtm-ud-px__sub del { font-size: 11.5px; }
.vtm-ud-slot > :not(.vtm-ud-px) { display: none !important; }
.vtm-ud-slot { display: block; }

/* ---------- trang chi tiết + xem nhanh ---------- */
.vtm-ud-hasp > .pr-price, .vtm-ud-hasp > .qv-price { display: none !important; }
.vtm-ud-pp__row { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.vtm-ud-pp__now { color: var(--ud-red); font-weight: 700; font-size: 18px; line-height: 1.2; white-space: nowrap; }
.vtm-ud-pp del { color: #6B6B6B; font-size: 13px; white-space: nowrap; }
.vtm-ud-pp__chip { padding: 2px 6px; background: var(--ud-navy); color: var(--ud-gold); font-size: 11px; font-weight: 700; white-space: nowrap; }
.vtm-ud-pp.is-main { display: flex; flex-direction: column; gap: 6px; padding: 12px 14px; background: var(--ud-ivory); border: 1px solid var(--ud-sand); }
.vtm-ud-pp.is-main .vtm-ud-pp__now { font-size: 26px; }
.vtm-ud-pp.is-main del { font-size: 14px; }
.vtm-ud-pp__lb { font-size: 10px; font-weight: 700; letter-spacing: .14em; color: var(--ud-brown); }
.vtm-ud-pp__note { display: flex; align-items: flex-start; gap: 6px; font-size: 12px; line-height: 1.4; color: var(--ud-brown); }
.vtm-ud-pp__note svg { width: 16px; height: 16px; flex: 0 0 16px; fill: none; stroke: var(--ud-brown); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
/* thanh mua dính dưới (mobile) + popup chọn kho: 1 khối gọn 2 dòng.
   Ô giá của theme trên mobile chỉ rộng ~23px (giá thường tràn ra ngoài) → JS gắn .vtm-ud-stk để ô tự rộng theo giá */
.vtm-ud-pp.is-mini { display: block; min-width: 0; }
@media (max-width: 767px) {
  .vtm-ud-on .sticky-pr__main.vtm-ud-stk { flex: 0 0 auto !important; width: auto !important; min-width: 96px; max-width: 48%; }
  .vtm-ud-on .sticky-pr__main.vtm-ud-stk .sticky-pr-info { width: auto !important; flex: 1 1 auto; min-width: 0; }
}
@media (max-width: 767px) {
  .vtm-ud-pp.is-main { padding: 10px 12px; }
  .vtm-ud-pp.is-main .vtm-ud-pp__now { font-size: 23px; }
  .sticky-pr .vtm-ud-px.is-mini > b { font-size: 15px; }
  .sticky-pr .vtm-ud-px__sub i { font-size: 9.5px; }
}

/* ---------- giỏ hàng + giỏ nhanh + mua nhanh (main.js / general.js vẽ dòng giá .is-ud) ---------- */
.vtm-ud-on .vtm-sale-price__percent.is-ud,
.vtm-ud-on #cart-page .cart-order .line-item.cart-summary-item .vtm-sale-price__percent.is-ud,
.vtm-ud-on #minicart .minicart-item.minicart-checkout-item .vtm-sale-price__percent.is-ud { background: var(--ud-navy) !important; color: var(--ud-gold) !important; }
.vtm-ud-on .vtm-sale-price__main.is-ud .vtm-sale-price__current,
.vtm-ud-on .vtm-sale-price.is-ud .vtm-sale-price__current { color: var(--ud-red) !important; }
.vtm-ud-on .vtm-sale-price__saving.is-ud:after { content: none !important; }
.vtm-ud-on #cart-page .cart-summary .summary-line .vtm-summary-ud-line { display: flex !important; align-items: center; justify-content: space-between; gap: 16px; width: 100%; font-size: 14px; color: var(--ud-brown) !important; }
.vtm-ud-on #cart-page .cart-summary .summary-line .vtm-summary-ud-line span:last-child { color: var(--ud-red) !important; font-weight: 800; }
.vtm-ud-on #minicart .sidebar-foot .vtm-minicart-ud-line { display: block; margin: 0 0 6px; color: var(--ud-navy); font-size: 12px; font-weight: 700; }
.vtm-ud-on .vtm-order-info-row--ud { color: var(--ud-brown); }
.vtm-ud-on .vtm-order-info-row--ud strong { color: var(--ud-red); }

/* trạng thái mã ở trang giỏ */
.vtm-ud-sum { margin: 12px 0 4px; padding: 12px 14px; background: var(--ud-ivory); border: 1px solid var(--ud-gold); display: flex; flex-direction: column; gap: 8px; font-size: 13px; line-height: 1.45; color: var(--ud-brown); }
.vtm-ud-sum__top, .vtm-ud-sum__st { display: flex; align-items: flex-start; gap: 8px; }
.vtm-ud-sum svg { width: 18px; height: 18px; flex: 0 0 18px; margin-top: 1px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.vtm-ud-sum__top svg { stroke: var(--ud-navy); }
.vtm-ud-sum__st { padding-top: 8px; border-top: 1px dashed var(--ud-sand); }
.vtm-ud-sum.is-ok .vtm-ud-sum__st { color: #14532d; }
.vtm-ud-sum.is-ok .vtm-ud-sum__st b { color: var(--ud-red); }
.vtm-ud-sum.is-bad { border-color: #e0b4b4; background: #fff7f6; }
.vtm-ud-sum.is-bad .vtm-ud-sum__st { color: #7f1d1d; }
.vtm-ud-sum.is-bad a { color: var(--ud-navy); font-weight: 700; }
.vtm-ud-sum.is-wait .vtm-ud-sum__st { color: var(--ud-grey); }
.vtm-ud-code { font-family: ui-monospace, Menlo, Consolas, monospace; letter-spacing: .06em; color: var(--ud-navy); }

/* ---------- Mua cả bộ / Đã thêm vào giỏ / gợi ý phối (vtm-upsell.js) ---------- */
.vtm-price.is-ud b { color: var(--ud-red); }
.vtm-price.is-ud em { padding: 0 5px; background: var(--ud-navy); color: var(--ud-gold); font-size: 10.5px; line-height: 16px; white-space: nowrap; }
.vtm-price.is-ud em i { font-style: normal; }
/* hàng Mua cả bộ (mobile hẹp): nhãn chỉ "−x%" cho gọn 1 dòng */
.vtm-pair__meta .vtm-price__r { display: none; }
.vtm-pair__total.is-ud del, .vtm-look__total.is-ud del { display: block; font-size: 12px; color: #6B6B6B; line-height: 1.2; }
.vtm-pair__total.is-ud b, .vtm-look__total.is-ud b { color: var(--ud-red); }
.vtm-lcard__meta.is-ud del { margin-right: 4px; font-size: 12px; }
.vtm-lcard__meta.is-ud b { color: var(--ud-red); }
.vtm-look__alt.is-ud span { color: var(--ud-red); }
.vtm-up__ud { display: flex; align-items: flex-start; gap: 8px; margin: 10px 0 0; padding: 9px 12px; background: var(--ud-ivory); border: 1px solid var(--ud-sand); font-size: 13px; line-height: 1.4; color: var(--ud-brown); }
.vtm-up__ud[hidden] { display: none; }
.vtm-up__ud .vtm-i { width: 18px; height: 18px; flex: 0 0 18px; color: var(--ud-navy); }
.vtm-up__ud b { color: var(--ud-red); }
/* gợi ý món thêm cho đủ freeship (vtm-cart.js) */
.vtm-add__p.is-ud b { color: var(--ud-red); }
.vtm-add__p.is-ud del { margin-left: 4px; font-size: 11px; font-weight: 400; color: #6B6B6B; }

/* ---------- khung chào / khung đang áp mã ---------- */
.vtm-ud-lock, .vtm-ud-lock body { overflow: hidden; }
.vtm-ud-sheet { position: fixed; inset: 0; z-index: 100000; display: flex; align-items: flex-end; justify-content: center; }
.vtm-ud-sheet__bg { position: absolute; inset: 0; background: rgba(0, 0, 22, .55); opacity: 0; transition: opacity .2s; }
.vtm-ud-sheet__box { position: relative; width: 100%; max-width: 440px; max-height: 92vh; overflow: auto; box-sizing: border-box; padding: 26px 22px 22px; background: var(--ud-ivory); color: var(--ud-ink); border-radius: 18px 18px 0 0; transform: translateY(24px); opacity: 0; transition: transform .22s ease, opacity .22s ease; outline: none; }
.vtm-ud-sheet.is-on .vtm-ud-sheet__bg { opacity: 1; }
.vtm-ud-sheet.is-on .vtm-ud-sheet__box { transform: none; opacity: 1; }
@media (min-width: 768px) { .vtm-ud-sheet { align-items: center; } .vtm-ud-sheet__box { border-radius: 6px; } }
@media (prefers-reduced-motion: reduce) { .vtm-ud-sheet__bg, .vtm-ud-sheet__box { transition: none; } }
.vtm-ud-sheet__x { position: absolute; top: 6px; right: 6px; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; padding: 0; border: 0; background: none; color: var(--ud-brown); cursor: pointer; }
.vtm-ud-sheet__x svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; }
.vtm-ud-sheet.is-wait .vtm-ud-sheet__x { display: none; }
.vtm-ud-w { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; }
.vtm-ud-w__ic { width: 60px; height: 60px; border-radius: 50%; background: var(--ud-navy); display: flex; align-items: center; justify-content: center; }
.vtm-ud-w__ic svg { width: 30px; height: 30px; fill: none; stroke: var(--ud-gold); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.vtm-ud-w__eb, .vtm-ud-go__eb { font-size: 11px; font-weight: 700; letter-spacing: .16em; color: var(--ud-brown); text-align: center; }
.vtm-ud-go__eb.is-bad { display: flex; align-items: center; justify-content: center; gap: 6px; color: #7f1d1d; }
.vtm-ud-go__eb svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.vtm-ud-w__big { display: flex; align-items: baseline; justify-content: center; gap: 10px; line-height: 1; }
.vtm-ud-w__big span { font-size: 26px; font-weight: 800; color: var(--ud-navy); }
.vtm-ud-w__big b { font-size: 60px; font-weight: 800; color: var(--ud-red); letter-spacing: -.02em; }
.vtm-ud-w__sub { margin-top: -4px; font-size: 15px; font-weight: 500; color: var(--ud-brown); }
.vtm-ud-w__list { width: 100%; margin: 4px 0 0; padding: 12px 0 0; border-top: 1px solid var(--ud-sand); list-style: none; display: flex; flex-direction: column; gap: 9px; text-align: left; font-size: 14px; line-height: 1.45; }
.vtm-ud-w__list li { display: flex; gap: 10px; align-items: flex-start; }
.vtm-ud-w__list svg { width: 20px; height: 20px; flex: 0 0 20px; margin-top: 1px; fill: none; stroke: var(--ud-navy); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.vtm-ud-btn { width: 100%; min-height: 52px; margin-top: 6px; padding: 0 16px; border: 0; border-radius: 2px; background: var(--ud-navy); color: #fff; font: inherit; font-size: 14px; font-weight: 700; letter-spacing: .06em; cursor: pointer; }
.vtm-ud-btn:focus-visible { outline: 2px solid var(--ud-gold); outline-offset: 2px; }
.vtm-ud-w__note { margin: 0; font-size: 12px; line-height: 1.45; color: #5A4A3A; text-align: center; }
.vtm-ud-go { display: flex; flex-direction: column; gap: 12px; }
.vtm-ud-go__code { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 14px; background: #fff; border: 1px dashed var(--ud-gold); }
.vtm-ud-go__code span { font-size: 12px; color: var(--ud-grey); }
.vtm-ud-go__code .vtm-ud-code { font-size: 24px; font-weight: 700; }
.vtm-ud-go__msg { margin: 0; font-size: 14px; line-height: 1.5; color: var(--ud-brown); text-align: center; }
.vtm-ud-go__msg svg { width: 18px; height: 18px; vertical-align: -4px; fill: none; stroke: #14532d; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.vtm-ud-go__msg b { color: var(--ud-red); }
.vtm-ud-go__msg a { color: var(--ud-navy); font-weight: 700; }
.vtm-ud-go__spin { width: 34px; height: 34px; margin: 2px auto 0; border-radius: 50%; border: 3px solid var(--ud-sand); border-top-color: var(--ud-navy); animation: vtmUdSpin .8s linear infinite; }
@keyframes vtmUdSpin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .vtm-ud-go__spin { animation-duration: 2.4s; } }
.vtm-ud-go__steps { margin: 0; padding-left: 20px; font-size: 14px; line-height: 1.5; display: flex; flex-direction: column; gap: 6px; }

/* ---------- thông báo nhỏ ---------- */
.vtm-ud-toast { position: fixed; left: 50%; bottom: 88px; z-index: 100001; max-width: calc(100% - 32px); padding: 10px 16px; border-radius: 6px; background: var(--ud-ink, #000022); color: #fff; font-size: 13px; line-height: 1.45; text-align: center; transform: translate(-50%, 10px); opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; }
.vtm-ud-toast.is-on { opacity: 1; transform: translate(-50%, 0); }
