/* ==========================================================================
   Selltool.vn — Phần riêng từng trang (giữ ở mức tối thiểu)
   Mỗi khối có comment tên trang.
   ========================================================================== */

/* account-overview */
.greeting__title { font-size: var(--fs-2xl); line-height: var(--lh-2xl); font-weight: var(--fw-bold); letter-spacing: -0.02em; }
.promo-tool { display: flex; gap: var(--space-4); align-items: flex-start; padding: var(--space-4); border-radius: var(--radius-md); border: 1px solid var(--color-border); }
.promo-tool + .promo-tool { margin-top: var(--space-3); }

/* auth (register, verify, forgot, reset, activate, login-2fa) */
.auth-icon { width: 48px; height: 48px; border-radius: 14px; margin-bottom: var(--space-2); }
.auth-icon .icon { width: 22px; height: 22px; }
.auth__form .status-hero .auth__desc { max-width: 360px; }

/* account-orders */
.orders-toolbar { justify-content: space-between; }
.orders-toolbar__right { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); flex: 1 1 360px; justify-content: flex-end; }
.orders-toolbar__right .table-toolbar__search { flex: 1 1 220px; }
.orders-range { width: auto; min-width: 150px; }
.orders-filter { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.orders-filter .segmented__btn { white-space: nowrap; display: inline-flex; align-items: center; gap: 6px; }
.orders-svc { display: inline-flex; align-items: center; gap: var(--space-3); color: var(--color-text); }
.orders-svc .tool-icon { width: 28px; height: 28px; border-radius: 8px; }
.orders-svc .tool-icon .icon { width: 14px; height: 14px; }
.text-strong { color: var(--color-text); font-weight: var(--fw-semibold); }
.orders-amount { display: inline-flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.orders-strike { color: var(--color-text-3); text-decoration: line-through; }
.orders-actions { display: inline-flex; align-items: center; gap: var(--space-3); }
.orders-hold { display: inline-flex; align-items: center; gap: 4px; color: var(--color-warning-text); font-weight: var(--fw-medium); }
.orders-row--cancelled td { color: var(--color-text-3); }
.orders-note { display: flex; gap: var(--space-2); align-items: flex-start; margin-top: calc(-1 * var(--space-2)); }
.orders-note .icon { margin-top: 2px; }
.orders-skeleton__row { display: flex; align-items: center; gap: var(--space-5); padding: 18px var(--space-5); border-bottom: 1px solid var(--color-border); }
@media (max-width: 767px) {
  .orders-toolbar { padding: var(--space-3) var(--space-4); }
  .orders-toolbar__right { flex-basis: 100%; }
  .orders-range { flex: 1; }
  .orders-svc .tool-icon { display: none; }
  .orders-skeleton__hide { display: none; }
  .orders-skeleton__row { padding: var(--space-4); gap: var(--space-3); }
}
.orders-svc, .orders-amount span, .orders-date { white-space: nowrap; }
@media (max-width: 767px) {
  .orders-filter { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .orders-filter .segmented__btn { justify-content: center; }
}
.orders-svc__name { display: flex; flex-direction: column; gap: 1px; line-height: 1.3; }
.orders-status { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.orders-skeleton .skeleton { max-width: 100%; }
@media (max-width: 767px) {
  .orders-svc__name { align-items: flex-end; }
  .orders-status { align-items: flex-end; }
}
.auth-inline-icon { display: inline-block; vertical-align: -3px; margin-right: 6px; }

/* checkout (checkout-plan, checkout-pay, checkout-success) */
.checkout-steps { padding: var(--space-4) var(--space-5); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.checkout-steps .stepper { max-width: 640px; margin: 0 auto; }
.checkout-tool { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-4); }
.checkout-tool__name { font-size: var(--fs-xl); line-height: var(--lh-xl); }
.checkout-plans { border: 0; margin: 0; padding: 0; min-width: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.checkout-plans legend { padding: 0; }
.checkout-plans .radio-cards { margin-top: var(--space-4); }
.checkout-plans .radio-card { padding-top: var(--space-5); }
.checkout-voucher { display: flex; gap: var(--space-2); }
.checkout-voucher__ok { display: flex; align-items: center; gap: 6px; font-size: var(--fs-sm); color: var(--color-success-text); }
.checkout-summary { align-self: start; }
@media (min-width: 1024px) { .checkout-summary { position: sticky; top: calc(var(--topbar-h) + var(--space-6)); } }
.checkout-lines { display: flex; flex-direction: column; gap: var(--space-3); font-size: var(--fs-md); }
.checkout-lines > div { display: flex; justify-content: space-between; gap: var(--space-4); }
.checkout-lines dt { color: var(--color-text-3); }
.checkout-lines dd { font-weight: var(--fw-medium); text-align: right; }
.checkout-total { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-3); padding-top: var(--space-4); border-top: 1px dashed var(--color-border-strong); }
.checkout-total__value { font-size: var(--fs-3xl); line-height: var(--lh-3xl); font-weight: var(--fw-bold); letter-spacing: -0.02em; }
.checkout-trust { display: flex; flex-direction: column; gap: var(--space-2); font-size: var(--fs-sm); color: var(--color-text-3); }
.checkout-trust li { display: flex; gap: var(--space-2); align-items: flex-start; }
.checkout-trust .icon { color: var(--color-success); margin-top: 2px; }

/* checkout-pay */
.pay-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); }
.pay-body { display: grid; gap: var(--space-6); grid-template-columns: 1fr; }
@media (min-width: 768px) { .pay-body { grid-template-columns: auto minmax(0, 1fr); align-items: start; } }
.pay-qr { display: flex; flex-direction: column; align-items: center; gap: var(--space-3); }
.pay-bank { display: inline-flex; align-items: center; gap: var(--space-2); font-size: var(--fs-sm); font-weight: var(--fw-semibold); color: var(--color-text-2); }
.pay-bank__mark { width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; background: var(--color-surface-2); border: 1px solid var(--color-border-strong); color: var(--color-text); font-size: 11px; font-weight: var(--fw-bold); letter-spacing: .02em; }
.pay-qr__frame { position: relative; width: 260px; height: 260px; max-width: 100%; padding: 8px; background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); }
.pay-qr__svg { width: 100%; height: 100%; }
.pay-qr__logo { position: absolute; left: 50%; top: 50%; width: 52px; height: 52px; transform: translate(-50%, -50%); display: grid; place-items: center; background: #fff; border-radius: 12px; }
.pay-qr__logo .logo__mark { width: 40px; height: 40px; }
.pay-rows { display: flex; flex-direction: column; gap: var(--space-3); }
.pay-row { display: flex; flex-direction: column; gap: 4px; }
.pay-row__label { font-size: var(--fs-xs); color: var(--color-text-3); font-weight: var(--fw-medium); }
.pay-row__note { display: flex; gap: 6px; align-items: flex-start; font-size: var(--fs-xs); color: var(--color-danger-text); font-weight: var(--fw-medium); }
.pay-row__note .icon { margin-top: 1px; }
.pay-listen { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4) var(--space-5); border-top: 1px solid var(--color-border); background: var(--color-surface-2); border-radius: 0 0 var(--radius-lg) var(--radius-lg); }
.pay-radar { position: relative; width: 44px; height: 44px; flex: none; border-radius: 50%; display: grid; place-items: center; background: var(--color-primary-soft); color: var(--color-primary-text); }
.pay-radar::before, .pay-radar::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid var(--color-primary); opacity: 0; animation: pay-radar 2.4s var(--ease) infinite; }
.pay-radar::after { animation-delay: 1.2s; }
.pay-radar .icon { position: relative; }
@keyframes pay-radar { 0% { transform: scale(1); opacity: .55; } 100% { transform: scale(2.1); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .pay-radar::before, .pay-radar::after { animation: none; opacity: .25; transform: scale(1.35); } .pay-radar::after { display: none; } }
.pay-listen__text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pay-steps { display: flex; flex-direction: column; gap: var(--space-3); counter-reset: paystep; font-size: var(--fs-sm); color: var(--color-text-2); }
.pay-steps li { display: flex; align-items: center; gap: var(--space-3); counter-increment: paystep; }
.pay-steps li::before { content: counter(paystep); width: 24px; height: 24px; flex: none; border-radius: 50%; display: grid; place-items: center; background: var(--color-primary-soft); color: var(--color-primary-text); font-size: var(--fs-xs); font-weight: var(--fw-bold); }
.pay-result { display: flex; flex-direction: column; align-items: center; gap: var(--space-5); padding: var(--space-10) var(--space-5); text-align: center; }
.pay-result__inner { width: 100%; max-width: 440px; display: flex; flex-direction: column; gap: var(--space-4); text-align: left; }
.pay-result__title { font-size: var(--fs-2xl); line-height: var(--lh-2xl); font-weight: var(--fw-bold); letter-spacing: -0.02em; max-width: 460px; }
@media (max-width: 639px) { .pay-listen { padding: var(--space-4); } .pay-result { padding: var(--space-8) var(--space-4); } .pay-result__title { font-size: var(--fs-xl); line-height: var(--lh-xl); } }

/* checkout-success */
.done-wrap { width: 100%; max-width: 760px; margin: 0 auto; display: flex; flex-direction: column; gap: var(--space-6); }
.done-hero { padding: var(--space-10) var(--space-6) var(--space-8); }
.done-steps { display: grid; gap: var(--space-4); grid-template-columns: 1fr; counter-reset: donestep; }
@media (min-width: 768px) { .done-steps { grid-template-columns: repeat(3, 1fr); } }
.done-step { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-md); counter-increment: donestep; }
.done-step::before { content: "Bước " counter(donestep); font-size: var(--fs-xs); font-weight: var(--fw-semibold); color: var(--color-primary-text); text-transform: uppercase; letter-spacing: .04em; }
.done-step__title { font-weight: var(--fw-semibold); }

/* account-services */
.svc-filters { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.svc-filters .select { width: auto; min-width: 180px; }
.svc-toolbar__actions { margin-left: auto; }
.svc-table td { white-space: nowrap; }
.svc-expiry, .svc-devices { display: inline-flex; flex-direction: column; gap: 2px; }
.svc-expiry__left, .svc-devices__state { font-size: var(--fs-xs); font-weight: var(--fw-medium); }
.svc-devices__state { display: inline-flex; align-items: center; gap: 6px; color: var(--color-text-3); }
.svc-actions { display: inline-flex; align-items: center; gap: var(--space-2); }
.svc-row--expired .tool-icon { filter: grayscale(1); opacity: .55; }
.svc-row--expired .cell-main__title { color: var(--color-text-2); }
.svc-perpage { width: 76px; }
.svc-page-label { padding: 0 var(--space-2); white-space: nowrap; }
.svc-noresult__icon { width: 56px; height: 56px; border-radius: 50%; }
.svc-fieldset { border: 0; padding: 0; margin: 0; display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; }
.svc-plans { grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr)); padding-top: 6px; }
.svc-plans .radio-card { padding: var(--space-4); }
.svc-plans .radio-card__price { font-size: var(--fs-xl); line-height: var(--lh-xl); }
.svc-qr-row { display: flex; gap: var(--space-4); align-items: center; padding: var(--space-3); border: 1px dashed var(--color-border-strong); border-radius: var(--radius-md); }
.svc-qr { width: 72px; height: 72px; flex: none; display: grid; place-items: center; align-content: center; gap: 2px; border-radius: var(--radius-sm); background: var(--color-surface-2); border: 1px solid var(--color-border); color: var(--color-text-2); font-size: 10px; font-weight: var(--fw-semibold); letter-spacing: .04em; }
.svc-device-list { display: flex; flex-direction: column; gap: var(--space-3); }
.svc-device { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-md); }
.svc-device--empty { border-style: dashed; color: var(--color-text-3); }
.svc-device--empty .kpi__icon { background: var(--color-surface-2); color: var(--color-text-3); }
@media (max-width: 767px) {
  .svc-filters { flex: 1 1 100%; }
  .svc-filters .select { flex: 1 1 140px; min-width: 0; }
  .svc-toolbar__actions { margin-left: 0; }
  .svc-table td { white-space: normal; }
  .svc-expiry, .svc-devices { align-items: flex-end; }
  .svc-actions { flex-wrap: wrap; justify-content: flex-end; }
}
@media (max-width: 520px) {
  .svc-device { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; }
  .svc-device .btn { grid-column: 2; justify-self: start; }
  .svc-plans { grid-template-columns: 1fr; }
  .svc-plans .radio-card { padding: var(--space-3) var(--space-4); }
  .svc-qr-row { align-items: flex-start; }
}
@media (min-width: 768px) {
  .svc-table th, .svc-table td { padding-left: var(--space-3); padding-right: var(--space-3); }
}
.auth-code-input { font-size: var(--fs-xl); letter-spacing: .12em; text-transform: uppercase; height: 48px; }
/* checkout (bổ sung) */
.checkout-tool__info { display: flex; align-items: center; gap: var(--space-4); flex: 1 1 280px; min-width: 0; }
.checkout-plans .radio-card__meta { margin-top: auto; padding-top: var(--space-1); }
@media (max-width: 639px) { .checkout-tool .tool-icon--lg { width: 44px; height: 44px; border-radius: 12px; } .checkout-tool__switch { width: 100%; } .checkout-tool__switch .segmented__btn { flex: 1; } }

/* account-invoice */
.invoice-top { display: flex; flex-direction: column; gap: var(--space-3); width: 100%; max-width: 860px; margin: 0 auto; }
.invoice-sheet { width: 100%; max-width: 860px; margin: 0 auto; display: flex; flex-direction: column; gap: var(--space-8); padding: var(--space-10); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); box-shadow: var(--shadow-md); color: var(--color-text-2); }
.invoice-sheet__head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-6); padding-bottom: var(--space-6); border-bottom: 2px solid var(--color-text); }
.invoice-seller { display: flex; flex-direction: column; gap: var(--space-4); }
.invoice-seller__info { display: flex; flex-direction: column; gap: 2px; font-style: normal; font-size: var(--fs-sm); line-height: var(--lh-sm); }
.invoice-seller__info strong { color: var(--color-text); }
.invoice-meta { display: flex; flex-direction: column; align-items: flex-end; gap: var(--space-2); text-align: right; }
.invoice-meta__title { font-size: var(--fs-xl); line-height: var(--lh-xl); font-weight: var(--fw-bold); letter-spacing: .04em; color: var(--color-text); }
.invoice-meta__dl { display: grid; grid-template-columns: auto auto; gap: 2px var(--space-4); font-size: var(--fs-sm); }
.invoice-meta__dl dt { color: var(--color-text-3); }
.invoice-meta__dl dd { color: var(--color-text); font-weight: var(--fw-semibold); }
.invoice-meta__dl--left { justify-content: start; }
.invoice-parties { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: var(--space-6); }
.invoice-block { display: flex; flex-direction: column; gap: 2px; font-size: var(--fs-sm); line-height: var(--lh-sm); }
.invoice-block__title { margin-bottom: var(--space-2); font-size: var(--fs-xs); font-weight: var(--fw-semibold); color: var(--color-text-3); text-transform: uppercase; letter-spacing: .06em; }
.invoice-block__name { font-size: var(--fs-md); font-weight: var(--fw-semibold); color: var(--color-text); }
.invoice-items { border: 1px solid var(--color-border); border-radius: var(--radius-md); overflow: hidden; }
.invoice-items .table td { white-space: nowrap; }
.invoice-items .table td.td-primary { white-space: normal; }
.invoice-summary { display: flex; justify-content: flex-end; margin-top: calc(-1 * var(--space-4)); }
.invoice-totals { width: min(100%, 320px); display: grid; grid-template-columns: 1fr auto; gap: var(--space-2) var(--space-6); font-size: var(--fs-sm); }
.invoice-totals dt { color: var(--color-text-3); }
.invoice-totals dd { text-align: right; color: var(--color-text); }
.invoice-totals__grand { padding-top: var(--space-3); margin-top: var(--space-1); border-top: 1px solid var(--color-border); font-size: var(--fs-lg); font-weight: var(--fw-bold); color: var(--color-text) !important; }
.invoice-pay { padding: var(--space-5); border-radius: var(--radius-md); background: var(--color-surface-2); }
.invoice-pay__dl { font-size: var(--fs-sm); grid-template-columns: repeat(2, minmax(110px, max-content) 1fr); }
.invoice-sheet__foot { display: flex; flex-direction: column; gap: var(--space-1); padding-top: var(--space-5); border-top: 1px dashed var(--color-border-strong); font-size: var(--fs-xs); line-height: var(--lh-xs); color: var(--color-text-3); }
@media (max-width: 767px) {
  .invoice-sheet { padding: var(--space-5); gap: var(--space-6); }
  .invoice-meta { align-items: flex-start; text-align: left; }
  .invoice-pay__dl { grid-template-columns: minmax(110px, max-content) 1fr; }
  .invoice-items .table td { white-space: normal; }
  .invoice-summary { margin-top: 0; }
}
@media print {
  @page { size: A4; margin: 14mm; }
  html, body { background: #fff !important; }
  .sidebar, .sidebar-backdrop, .topbar, .banner, .bottom-nav, .demo-bar, .toast-region, .invoice-actions .cluster, .invoice-top .breadcrumb, .invoice-top { display: none !important; }
  .app { display: block; background: none !important; }
  .app__content { padding: 0 !important; max-width: none; }
  .invoice-sheet { max-width: none; padding: 0; border: 0; box-shadow: none; border-radius: 0;
    --color-surface: #fff; --color-surface-2: #f6f7f9; --color-text: #111827; --color-text-2: #374151; --color-text-3: #6b7280; --color-border: #e5e7eb; --color-border-strong: #d1d5db;
    background: #fff; color: #374151; }
  .invoice-sheet .table th { background: #f6f7f9; }
  .invoice-sheet .badge--success { background: #fff; border: 1px solid currentColor; }
  .invoice-sheet, .invoice-pay, .invoice-items { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
@media (min-width: 768px) {
  .svc-btn-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .svc-actions .btn:has(.svc-btn-text) { width: 32px; padding: 0; }
}
@media (min-width: 768px) and (max-width: 1439px) {
  .svc-table .btn .svc-ico-mid { display: none; }
  .svc-table .badge { height: 22px; padding: 0 8px; }
  .svc-table .col-stt { display: none; }
  .svc-table th, .svc-table td { padding-left: 10px; padding-right: 10px; }
}
.invoice-items .table td.td-primary { min-width: 200px; }
.invoice-totals { column-gap: 0; }
.invoice-totals dd { padding-left: var(--space-6); }
@media print {
  .invoice-sheet { --color-success-text: #15803d; --color-success-soft: #dcfce7; --color-primary-text: #4b3ce0; }
  .invoice-seller .logo__mark rect { fill: #5b4cf5; } /* gradient defs bị ẩn cùng sidebar khi in */
}
.invoice-top ~ .empty--error { width: 100%; max-width: 860px; margin: 0 auto; }
.activate { max-width: 460px; }
.activate__who { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); padding: var(--space-2) var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius-full); background: var(--color-surface-2); font-size: var(--fs-xs); color: var(--color-text-3); }
.activate__code { display: flex; flex-direction: column; align-items: center; gap: var(--space-1); padding: var(--space-5) var(--space-4); text-align: center; border: 1.5px dashed var(--color-primary-soft-2); border-radius: var(--radius-lg); background: var(--color-primary-soft); }
.activate__code-value { font-size: 40px; line-height: 48px; font-weight: var(--fw-semibold); letter-spacing: .08em; color: var(--color-primary-text); }
.activate__device { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-4) var(--space-5); border-bottom: 1px solid var(--color-border); }
.activate__dl { padding: var(--space-4) var(--space-5); grid-template-columns: max-content 1fr; gap: var(--space-2) var(--space-6); font-size: var(--fs-sm); }
.activate__devices { padding: 0; }
.activate__row { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-3) var(--space-4); }
.activate__row + .activate__row { border-top: 1px solid var(--color-border); }
.activate__row .grow { display: flex; flex-direction: column; }
.activate__actions { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); }
.activate__name { display: block; font-size: .8em; }
@media (max-width: 520px) { .activate__dl { grid-template-columns: max-content 1fr; } .activate__dl dd { margin-bottom: 0; } .activate__code-value { font-size: 34px; } }
/* checkout-pay (bổ sung) */
.pay-listen { gap: var(--space-5); padding-left: var(--space-6); overflow: hidden; }
@keyframes pay-radar { 0% { transform: scale(1); opacity: .5; } 100% { transform: scale(1.65); opacity: 0; } }
@media (max-width: 639px) { .pay-listen { flex-wrap: wrap; padding-left: var(--space-5); } .pay-listen__text { flex-basis: calc(100% - 80px); } .pay-listen > .btn { margin-left: auto; } }
@media (max-width: 479px) { .svc-filters .select { flex-basis: 100%; } }
.activate .activate__who { border-radius: var(--radius-md); }
.activate__logout { margin-left: auto; }

/* account-profile / account-password / account-security (dùng chung) */
.account-head { display: flex; flex-direction: column; gap: var(--space-4); }
.account-card { width: 100%; max-width: 880px; }
.account-card__footer { justify-content: space-between; flex-wrap: wrap; }
.profile-avatar { display: flex; align-items: center; gap: var(--space-5); padding-bottom: var(--space-6); border-bottom: 1px solid var(--color-border); }
.profile-avatar__btn { cursor: pointer; }
.profile-avatar:has(input:focus-visible) .profile-avatar__btn { box-shadow: var(--ring); }
.profile-grid { display: grid; grid-template-columns: 1fr; gap: var(--space-5); }
.profile-grid__spacer { display: none; }
@media (min-width: 640px) {
  .profile-grid { grid-template-columns: 1fr 1fr; gap: var(--space-5) var(--space-6); }
  .profile-grid__full { grid-column: 1 / -1; }
  .profile-grid__spacer { display: block; }
}
@media (max-width: 479px) {
  .profile-avatar { flex-direction: column; align-items: flex-start; gap: var(--space-4); }
  .account-card__footer > .cluster { width: 100%; }
  .account-card__footer > .cluster .btn--primary { flex: 1; }
}
.activate__actions:not(:has(.btn--primary:not(.is-hidden))) { grid-template-columns: 1fr; }
.svc-center { justify-content: center; }
@media (max-width: 559px) { .account-tab-more { display: none; } }
@media (max-width: 359px) { .profile-avatar { flex-direction: column; align-items: flex-start; } }
@media (max-width: 479px) { .profile-avatar { flex-direction: row; align-items: center; } }
@media (max-width: 359px) { .profile-avatar { flex-direction: column; align-items: flex-start; } }
.activate__who { flex-wrap: nowrap; }
.activate__who-text { display: flex; flex-direction: column; min-width: 0; overflow-wrap: anywhere; }
/* checkout-success (bổ sung) */
.done-hero { padding-bottom: var(--space-2); }
.done-hero + .card__body .dl { padding: var(--space-4) var(--space-5); border-radius: var(--radius-md); background: var(--color-surface-2); border: 1px solid var(--color-border); }
@media (max-width: 520px) {
  .done-wrap .copy-field--lg { flex-wrap: wrap; padding: var(--space-2) var(--space-2) var(--space-2) var(--space-3); }
  .done-wrap .copy-field--lg .copy-field__value { flex-basis: 100%; white-space: normal; overflow-wrap: anywhere; padding: 4px 0; }
  .done-wrap .copy-field--lg .btn { flex: 1; }
  .done-wrap .card__footer { flex-direction: column-reverse; align-items: stretch; }
}
@media (max-width: 559px) {
  .account-head .tabs__tab { padding: 12px 10px; font-size: var(--fs-sm); }
  .account-head .tabs__tab .icon { display: none; }
}
.account-head ~ .card, .account-head ~ .alert, .account-head ~ .empty--error { width: 100%; max-width: 880px; }
/* account-password */
.password-body > .stack, .password-otp { max-width: 520px; }
.password-otp { margin: 0; padding: var(--space-5); border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface-2); display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; }
.password-otp__legend { float: left; width: 100%; display: flex; align-items: center; gap: var(--space-2); padding: 0; font-weight: var(--fw-semibold); color: var(--color-text); }
.password-otp__legend + * { clear: both; }
.password-otp .otp { max-width: 360px; }
.password-foot-note { display: inline-flex; align-items: center; gap: 6px; }

/* account-service-detail */
.sd-alert { align-items: center; }
.sd-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-5); padding: var(--space-6); }
.sd-head__id { display: flex; align-items: center; gap: var(--space-4); min-width: 0; }
.sd-head__title { font-size: var(--fs-2xl); line-height: var(--lh-2xl); font-weight: var(--fw-bold); letter-spacing: -0.02em; }
.sd-head__actions { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.sd-grid { align-items: start; }
.sd-pin { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-4); border-radius: var(--radius-md); background: var(--color-primary-soft); }
.sd-pin__row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); }
.sd-pin__code { font-family: var(--font-mono); font-size: 34px; line-height: 44px; font-weight: 600; letter-spacing: .24em; color: var(--color-primary-text); }
.sd-pin__new { align-self: flex-start; margin-left: calc(-1 * var(--space-3)); }
.sd-seen { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.sd-devices td { white-space: normal; }
.sd-devices .col-actions { white-space: nowrap; }
@media (max-width: 767px) {
  .sd-head { padding: var(--space-5); }
  .sd-head__actions { width: 100%; }
  .sd-head__actions > .btn, .sd-head__actions > .dropdown { flex: 1 1 auto; }
  .sd-head__actions > .dropdown > .btn { width: 100%; }
  .sd-devices td { white-space: normal; }
  .sd-alert { flex-wrap: wrap; }
  .sd-alert .btn { margin-left: auto; }
}
@media (max-width: 400px) { .sd-pin__code { font-size: 28px; letter-spacing: .18em; } }
.sd-lease { align-items: flex-start; }
@media (max-width: 520px) {
  .sd-key { flex-wrap: wrap; padding: var(--space-2) var(--space-2) var(--space-2) var(--space-3); }
  .sd-key .copy-field__value { flex-basis: 100%; padding: 4px 0; }
  .sd-key .btn { flex: 1; }
}
.sd-alert .btn { color: #fff; text-decoration: none; flex: none; }
.sd-devices th { white-space: normal; }
@media (min-width: 768px) { .sd-devices th, .sd-devices td { padding-left: var(--space-3); padding-right: var(--space-3); } }
.sd-devices .mono { white-space: nowrap; }

/* account-security */
.security-rows { display: flex; flex-direction: column; }
.security-row { display: flex; align-items: flex-start; gap: var(--space-4); padding: var(--space-5); }
.security-row + .security-row, .security-setup + .security-row { border-top: 1px solid var(--color-border); }
.security-row__text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.security-row__title { font-size: var(--fs-md); font-weight: var(--fw-semibold); }
.security-row__desc { font-size: var(--fs-sm); color: var(--color-text-3); }
.security-row__switch { margin-top: 6px; }
.security-setup { margin: 0 var(--space-5) var(--space-5); padding: var(--space-5); border-radius: var(--radius-md); background: var(--color-surface-2); border: 1px solid var(--color-border); }
.security-steps { display: grid; gap: var(--space-6); grid-template-columns: 1fr; }
@media (min-width: 900px) { .security-steps { grid-template-columns: auto minmax(0, 1fr); } .security-step:last-child { grid-column: 1 / -1; } }
.security-step { display: flex; gap: var(--space-3); min-width: 0; }
.security-step__body { flex: 1; min-width: 0; }
.security-step__num { width: 24px; height: 24px; flex: none; border-radius: 50%; display: grid; place-items: center; background: var(--color-primary); color: #fff; font-size: var(--fs-xs); font-weight: var(--fw-bold); }
.security-step__title { font-weight: var(--fw-semibold); color: var(--color-text); }
.security-qr { width: 160px; height: 160px; padding: 6px; background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius-md); }
.security-qr__svg { width: 100%; height: 100%; }
.security-step .otp { max-width: 360px; }
.security-backup { display: flex; flex-direction: column; gap: var(--space-4); }
.security-codes { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-2); }
.security-codes li { padding: 10px; text-align: center; border-radius: var(--radius-sm); border: 1px dashed var(--color-border-strong); background: var(--color-surface); color: var(--color-text); font-weight: var(--fw-semibold); }
@media (max-width: 639px) { .security-codes { grid-template-columns: repeat(2, 1fr); } .security-setup { margin: 0 var(--space-4) var(--space-4); padding: var(--space-4); } .security-row { padding: var(--space-4); gap: var(--space-3); } .security-row > .kpi__icon { display: none; } }
.security-active { display: inline-flex; align-items: center; gap: 8px; color: var(--color-success-text); font-weight: var(--fw-medium); }
.security-session--current { background: color-mix(in srgb, var(--color-primary-soft) 45%, transparent); }
.security-modal-list { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-3) var(--space-4); border-radius: var(--radius-md); background: var(--color-surface-2); color: var(--color-text); font-size: var(--fs-sm); }
.security-modal-list li { display: flex; align-items: center; gap: var(--space-2); }
.security-session--current .badge { align-self: flex-start; }
.security-setup .copy-field__value { white-space: normal; }
/* checkout-success (màu hạn dùng trong .dl) */
.dl dd.text-success { color: var(--color-success-text); }

/* legal + guide (doc pages: legal-terms, legal-disclaimer, legal-refund, guide, guide-buy-activate, guide-voiceflash, guide-faq) */
.doc-hero { background: var(--color-bg); border-bottom: 1px solid var(--color-border); padding-top: var(--space-8); }
.doc-hero--plain { padding-bottom: var(--space-10); }
.doc-hero__title { margin-top: var(--space-4); font-size: var(--fs-3xl); line-height: var(--lh-3xl); font-weight: var(--fw-bold); letter-spacing: -0.025em; color: var(--color-text); }
.doc-hero__lead { margin-top: var(--space-3); max-width: 680px; font-size: var(--fs-lg); line-height: var(--lh-lg); color: var(--color-text-3); }
.doc-hero__lead:empty { display: none; }
.doc-hero__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px var(--space-3); margin-top: var(--space-4); font-size: var(--fs-sm); color: var(--color-text-3); }
@media (min-width: 1024px) { .doc-hero { padding-top: var(--space-12); } .doc-hero__title { font-size: var(--fs-4xl); line-height: var(--lh-4xl); } }
.doc-switch { display: flex; gap: var(--space-6); margin-top: var(--space-8); overflow-x: auto; scrollbar-width: none; }
.doc-switch::-webkit-scrollbar { display: none; }
.doc-switch__tab { display: inline-flex; align-items: center; gap: 8px; flex: none; padding: 12px 2px 14px; border-bottom: 2px solid transparent; color: var(--color-text-3); font-weight: var(--fw-medium); white-space: nowrap; text-decoration: none !important; }
.doc-switch__tab:hover { color: var(--color-text); border-bottom-color: var(--color-border-strong); }
.doc-switch__tab[aria-current="page"] { color: var(--color-primary-text); border-bottom-color: var(--color-primary); }
.doc-body { padding: var(--space-10) 0 var(--space-16); }
@media (min-width: 1024px) { .doc-body { padding: var(--space-12) 0 96px; } }
.doc-body .prose > h2:first-child, .doc-body .prose > section:first-child > h2:first-child { margin-top: 0; }
@media (max-width: 1023.98px) { .doc-toc { padding: var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface-2); } }
.doc-main { min-width: 0; max-width: 760px; display: flex; flex-direction: column; gap: var(--space-10); }
.prose dl { display: grid; gap: var(--space-3); }
.prose dt { font-weight: var(--fw-semibold); color: var(--color-text); }
.prose dd { margin: 2px 0 0; }
.prose .table-wrap, .prose .card, .prose .alert, .prose .guide-shot { margin-top: var(--space-5); }
.prose .alert { font-size: var(--fs-md); line-height: var(--lh-md); }
.prose .alert p { margin: 0; }
.prose .table { font-size: var(--fs-md); line-height: var(--lh-md); }
.prose .card { font-size: var(--fs-md); line-height: var(--lh-md); }
.doc-contact { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-4) var(--space-5); padding: var(--space-5); border: 1px solid var(--brand-200); border-radius: var(--radius-lg); background: var(--color-primary-soft); }
.doc-contact__text { flex: 1 1 260px; min-width: 0; }
.doc-contact__title { font-weight: var(--fw-semibold); color: var(--color-text); }
.doc-contact__desc { font-size: var(--fs-sm); color: var(--color-text-2); margin-top: 2px; }
.doc-note { display: flex; gap: 8px; align-items: flex-start; font-size: var(--fs-xs); line-height: var(--lh-xs); color: var(--color-text-3); }
/* guide-nav: chỉ hiện trong cột trái trên desktop */
.guide-nav { display: none; flex-direction: column; gap: 2px; margin-bottom: var(--space-6); }
@media (min-width: 1024px) { .guide-nav { display: flex; } }
.guide-step__num { display: inline-grid; place-items: center; width: 32px; height: 32px; margin-right: 10px; border-radius: 50%; background: var(--color-primary); color: #fff; font-size: var(--fs-md); vertical-align: 3px; font-variant-numeric: tabular-nums; }
/* khung minh hoạ (mockup) */
.guide-shot { margin: 0; font-size: var(--fs-md); line-height: var(--lh-md); }
.guide-shot__frame { border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-bg); box-shadow: var(--shadow-sm); overflow: hidden; }
.guide-shot__bar { display: flex; align-items: center; gap: 6px; padding: 10px 14px; border-bottom: 1px solid var(--color-border); background: var(--color-surface); }
.guide-shot__bar i { width: 9px; height: 9px; border-radius: 50%; background: var(--color-border-strong); }
.guide-shot__url { margin-left: 10px; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: var(--font-mono); font-size: var(--fs-xs); color: var(--color-text-3); padding: 3px 10px; border-radius: var(--radius-full); background: var(--color-surface-2); }
.guide-shot__body { padding: var(--space-5); display: flex; flex-direction: column; gap: var(--space-4); }
.guide-shot__split { display: grid; gap: var(--space-5); align-items: center; }
@media (min-width: 640px) { .guide-shot__split { grid-template-columns: 200px minmax(0, 1fr); } }
.guide-shot__phone { width: 180px; max-width: 100%; margin: 0 auto; display: block; }
.guide-shot__label { font-size: var(--fs-xs); font-weight: var(--fw-semibold); color: var(--color-text-3); text-transform: uppercase; letter-spacing: .06em; }
.guide-shot .timeline { padding-left: 0; list-style: none; }
.guide-shot .timeline li + li { margin-top: 0; }
.guide-shot .radio-card__title { font-size: var(--fs-md); }
.guide-shot .radio-card__price { font-size: var(--fs-xl); line-height: var(--lh-xl); }
.guide-shot .radio-cards { grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr)); }
.guide-app { border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); overflow: hidden; }
.guide-app__bar { display: flex; align-items: center; gap: 8px; padding: 8px 12px; background: var(--color-surface-2); border-bottom: 1px solid var(--color-border); font-size: var(--fs-xs); color: var(--color-text-3); }
.guide-app__body { padding: var(--space-4); display: flex; flex-direction: column; gap: var(--space-3); }
.guide-feedback { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-4) var(--space-5); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.guide-pager { display: grid; gap: var(--space-3); grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }
.guide-pager__link { display: flex; flex-direction: column; gap: 4px; padding: var(--space-4) var(--space-5); border: 1px solid var(--color-border); border-radius: var(--radius-lg); text-decoration: none !important; color: var(--color-text); font-weight: var(--fw-semibold); transition: border-color var(--dur) var(--ease); }
.guide-pager__link:hover { border-color: var(--color-primary); }
.guide-pager__link small { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-xs); font-weight: var(--fw-medium); color: var(--color-text-3); }
.guide-pager__link--next { text-align: right; align-items: flex-end; }
/* guide hub */
.guide-hero { background: radial-gradient(1200px 380px at 50% -40%, var(--color-primary-soft-2), transparent 70%), var(--color-bg); border-bottom: 1px solid var(--color-border); padding: var(--space-12) 0; }
@media (min-width: 1024px) { .guide-hero { padding: 80px 0; } }
.guide-search { width: 100%; max-width: 600px; margin: var(--space-6) auto 0; }
.guide-search .input { height: 52px; font-size: var(--fs-lg); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); padding-right: 104px; }
.guide-search .input-wrap__icon { left: 16px; }
.guide-search .input-wrap--icon > .input { padding-left: 46px; }
.guide-search__btn { position: absolute; right: 6px; }
.guide-topics { justify-content: center; margin-top: var(--space-4); font-size: var(--fs-sm); color: var(--color-text-3); }
.guide-topics a { padding: 4px 12px; border: 1px solid var(--color-border); border-radius: var(--radius-full); background: var(--color-surface); color: var(--color-text-2); text-decoration: none !important; }
.guide-topics a:hover { border-color: var(--color-primary); color: var(--color-primary-text); }
.guide-cat { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-6); color: var(--color-text-2); }
.guide-cat__title { font-size: var(--fs-xl); line-height: var(--lh-xl); font-weight: var(--fw-semibold); color: var(--color-text); }
.guide-cat__title a { color: inherit; text-decoration: none !important; }
.guide-cat__title a::after { content: ""; position: absolute; inset: 0; }
.guide-cat { position: relative; }
.guide-cat__list { list-style: none; padding: 0; margin: var(--space-2) 0 0; display: flex; flex-direction: column; gap: 8px; font-size: var(--fs-sm); }
.guide-cat__list li { display: flex; gap: 8px; align-items: flex-start; }
.guide-cat__list .icon { margin-top: 2px; color: var(--color-text-3); }
.guide-cat__more { margin-top: auto; padding-top: var(--space-2); font-size: var(--fs-sm); font-weight: var(--fw-semibold); color: var(--color-primary-text); display: inline-flex; align-items: center; gap: 6px; }
.guide-list { list-style: none; margin: 0; padding: 0; }
.guide-list li + li { border-top: 1px solid var(--color-border); }
.guide-list a { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4) var(--space-5); color: var(--color-text); text-decoration: none !important; }
.guide-list a:hover { background: var(--color-surface-hover); }
.guide-list__title { font-weight: var(--fw-medium); }
.guide-list__meta { font-size: var(--fs-xs); color: var(--color-text-3); margin-top: 2px; }
.guide-list .icon:last-child { margin-left: auto; color: var(--color-text-3); flex: none; }
.guide-contact { display: flex; gap: var(--space-4); align-items: flex-start; padding: var(--space-5); }
.guide-contact__title { font-weight: var(--fw-semibold); color: var(--color-text); }
/* guide-faq */
.faq-group + .faq-group { margin-top: var(--space-10); }
.faq-group__title { display: flex; align-items: center; gap: 10px; font-size: var(--fs-xl); line-height: var(--lh-xl); font-weight: var(--fw-semibold); margin-bottom: var(--space-4); scroll-margin-top: 96px; }
.faq-group .accordion__a p { margin: 0; }
.faq-group .accordion__a ul, .faq-group .accordion__a ol { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 4px; }

/* public: home + tool-voiceflash (dùng chung, tiền tố pub-) */
.pub-hero { position: relative; overflow: hidden; padding: var(--space-12) 0 var(--space-16); background:
  radial-gradient(900px 420px at 85% -10%, var(--brand-100), transparent 70%),
  radial-gradient(600px 300px at -10% 0%, var(--brand-50), transparent 70%), var(--color-surface); }
.pub-hero::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image: linear-gradient(var(--color-border) 1px, transparent 1px), linear-gradient(90deg, var(--color-border) 1px, transparent 1px);
  background-size: 48px 48px; -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 0%, #000 20%, transparent 75%); mask-image: radial-gradient(ellipse 70% 60% at 50% 0%, #000 20%, transparent 75%); }
.pub-hero__grid { position: relative; display: grid; gap: var(--space-12); align-items: center; }
@media (min-width: 1024px) { .pub-hero { padding: 88px 0 112px; } .pub-hero__grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: var(--space-16); } }
.pub-hero__copy { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-6); }
.pub-pill { display: inline-flex; align-items: center; gap: 10px; padding: 4px 12px 4px 4px; border: 1px solid var(--color-border); border-radius: var(--radius-full); background: var(--color-surface); box-shadow: var(--shadow-xs); font-size: var(--fs-sm); color: var(--color-text-2); text-decoration: none !important; max-width: 100%; }
.pub-pill > span:nth-child(2) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pub-pill:hover { border-color: var(--brand-200); color: var(--color-text); }
.pub-hero__title { font-size: 34px; line-height: 1.16; font-weight: var(--fw-bold); letter-spacing: -0.03em; color: var(--color-text); text-wrap: balance; }
@media (min-width: 640px) { .pub-hero__title { font-size: 44px; } }
@media (min-width: 1200px) { .pub-hero__title { font-size: 52px; line-height: 1.12; } }
.pub-hero__accent { color: var(--color-primary); }
.pub-hero__lead { font-size: var(--fs-lg); line-height: 28px; color: var(--color-text-3); max-width: 540px; }
@media (min-width: 1024px) { .pub-hero__lead { font-size: var(--fs-xl); line-height: 30px; } }
.pub-hero__ctas { display: flex; flex-wrap: wrap; gap: var(--space-3); }
@media (max-width: 479px) { .pub-hero__ctas { width: 100%; } .pub-hero__ctas .btn { flex: 1 1 100%; } }
.pub-hero__trust { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); font-size: var(--fs-sm); color: var(--color-text-3); }
.pub-hero__trust li { display: inline-flex; align-items: center; gap: 6px; }
.pub-hero__trust .icon { color: var(--color-success); }

/* Khung minh hoạ + thẻ nổi */
.pub-visual { position: relative; padding: clamp(20px, 5vw, 44px) clamp(12px, 3vw, 28px); border-radius: 24px; border: 1px solid var(--brand-100);
  background: radial-gradient(120% 90% at 100% 0%, var(--brand-200), transparent 60%), linear-gradient(160deg, var(--brand-50), #fff 70%); }
.pub-visual__img { display: block; width: 100%; height: auto; }
.pub-float { position: absolute; display: flex; align-items: center; gap: 10px; padding: 10px 14px 10px 10px; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 12px; box-shadow: var(--shadow-lg); font-size: var(--fs-sm); line-height: 18px; white-space: nowrap; }
.pub-float__text { display: flex; flex-direction: column; }
.pub-float__text strong { color: var(--color-text); font-weight: var(--fw-semibold); }
.pub-float__text span { color: var(--color-text-3); font-size: var(--fs-xs); }
.pub-float__icon { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; flex: none; }
.pub-float__icon--success { background: var(--color-success-soft); color: var(--color-success); }
.pub-float__qr { width: 44px; height: 44px; border-radius: 6px; border: 1px solid var(--color-border); flex: none; }
.pub-float--tl { top: -14px; left: 12px; }
.pub-float--br { bottom: -16px; right: 12px; }
.pub-float--key { top: 42%; right: -8px; padding: 6px 10px; gap: 6px; font-size: var(--fs-xs); color: var(--color-primary-text); }
@media (min-width: 1024px) { .pub-float--tl { top: 28px; left: -36px; } .pub-float--br { bottom: 24px; right: -28px; } .pub-float--key { right: -40px; } }
@media (max-width: 479px) { .pub-float--key { display: none; } }

/* Dải tin cậy */
.pub-trust { border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); background: var(--color-surface); }
.pub-trust__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; }
.pub-trust__item { display: flex; gap: var(--space-4); align-items: flex-start; padding: var(--space-6) 0; }
.pub-trust__item + .pub-trust__item { border-top: 1px solid var(--color-border); }
@media (min-width: 900px) {
  .pub-trust__list { grid-template-columns: repeat(3, 1fr); }
  .pub-trust__item { padding: var(--space-8) var(--space-8); }
  .pub-trust__item:first-child { padding-left: 0; }
  .pub-trust__item + .pub-trust__item { border-top: 0; border-left: 1px solid var(--color-border); }
}
.pub-trust__icon { width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center; flex: none; background: var(--color-primary-soft); color: var(--color-primary); }
.pub-trust__title { font-weight: var(--fw-semibold); color: var(--color-text); font-size: var(--fs-lg); line-height: var(--lh-lg); }
.pub-trust__text { margin-top: 4px; color: var(--color-text-3); font-size: var(--fs-sm); }

/* Thẻ công cụ */
.pub-tools { display: grid; gap: var(--space-5); grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
.pub-tool { position: relative; display: flex; flex-direction: column; gap: var(--space-5); padding: var(--space-6); border: 1px solid var(--color-border); border-radius: 16px; background: var(--color-surface); box-shadow: var(--shadow-xs); transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease), transform var(--dur) var(--ease); }
.pub-tool:not(.pub-tool--soon):hover { border-color: var(--brand-200); box-shadow: var(--shadow-md); transform: translateY(-2px); }
.pub-tool--featured { background: linear-gradient(180deg, var(--brand-50), var(--color-surface) 45%); border-color: var(--brand-100); }
.pub-tool--soon { background: var(--color-surface-2); }
.pub-tool__head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-3); }
.pub-tool__name { font-size: var(--fs-xl); line-height: var(--lh-xl); font-weight: var(--fw-semibold); color: var(--color-text); }
.pub-tool__name a { color: inherit; text-decoration: none !important; }
.pub-tool__name a::after { content: ""; position: absolute; inset: 0; border-radius: 16px; }
.pub-tool__name a:focus-visible { outline: none; }
.pub-tool__name a:focus-visible::after { box-shadow: var(--ring); }
.pub-tool__desc { color: var(--color-text-3); }
.pub-tool__foot { margin-top: auto; padding-top: var(--space-5); border-top: 1px solid var(--color-border); display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); flex-wrap: wrap; }
.pub-tool__foot .btn { position: relative; z-index: 1; }
.pub-tool__price { font-size: var(--fs-sm); }
.pub-tool__price strong { font-size: var(--fs-xl); color: var(--color-text); font-weight: var(--fw-bold); }
.pub-checks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; color: var(--color-text-2); }
.pub-checks li { display: flex; gap: 10px; align-items: flex-start; }
.pub-checks .icon { color: var(--color-success); margin-top: 3px; flex: none; }
.pub-checks--muted .icon { color: var(--color-text-3); }

/* Quy trình 3 bước */
.pub-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-8); position: relative; counter-reset: none; }
.pub-step { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--space-3); }
.pub-step__icon { position: relative; z-index: 1; width: 72px; height: 72px; border-radius: 20px; display: grid; place-items: center; background: var(--color-surface); color: var(--color-primary); border: 1px solid var(--color-border); box-shadow: var(--shadow-md); margin-bottom: var(--space-2); }
.pub-step__num { position: absolute; top: -8px; right: -8px; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: var(--color-primary); color: #fff; font-size: var(--fs-xs); font-weight: var(--fw-bold); box-shadow: 0 0 0 3px var(--color-bg); }
.pub-step__title { font-size: var(--fs-xl); line-height: var(--lh-xl); font-weight: var(--fw-semibold); }
.pub-step__text { color: var(--color-text-3); max-width: 300px; }
@media (min-width: 768px) {
  .pub-steps { grid-template-columns: repeat(3, 1fr); gap: var(--space-6); }
  .pub-steps::before { content: ""; position: absolute; top: 36px; left: 16.66%; right: 16.66%; border-top: 2px dashed var(--brand-200); }
}
.pub-steps__more { margin-top: var(--space-10); text-align: center; font-weight: var(--fw-medium); }
.pub-steps__more a { display: inline-flex; align-items: center; gap: 6px; }

/* FAQ teaser */
.pub-faq { display: grid; gap: var(--space-8); }
@media (min-width: 1024px) { .pub-faq { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-16); align-items: start; } }
.pub-faq__head { margin-bottom: 0; }

/* CTA cuối trang */
.pub-cta-wrap { padding: 0 0 var(--space-16); }
@media (min-width: 1024px) { .pub-cta-wrap { padding-bottom: 96px; } }
.pub-cta { position: relative; overflow: hidden; display: flex; flex-direction: column; gap: var(--space-6); padding: var(--space-10) var(--space-6); border-radius: 24px; color: #fff;
  background: radial-gradient(500px 260px at 100% 0%, rgba(255,255,255,.18), transparent 70%), linear-gradient(135deg, var(--brand-600), var(--brand-900)); }
@media (min-width: 900px) { .pub-cta { flex-direction: row; align-items: center; justify-content: space-between; padding: var(--space-12) var(--space-12); } }
.pub-cta__title { font-size: var(--fs-2xl); line-height: var(--lh-2xl); font-weight: var(--fw-bold); letter-spacing: -0.02em; color: #fff; }
@media (min-width: 1024px) { .pub-cta__title { font-size: var(--fs-3xl); line-height: var(--lh-3xl); } }
.pub-cta__text { color: rgba(255,255,255,.82); max-width: 520px; }
.pub-cta__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); flex: none; }
.pub-cta__primary { background: #fff; color: var(--brand-800); }
.pub-cta__primary:hover { background: var(--brand-50); color: var(--brand-900); }
.pub-cta__ghost { color: #fff; border-color: rgba(255,255,255,.4); background: transparent; }
.pub-cta__ghost:hover { background: rgba(255,255,255,.12); color: #fff; }
.pub-cta .btn:focus-visible { box-shadow: 0 0 0 3px rgba(255,255,255,.6); }
@media (max-width: 479px) { .pub-cta__actions .btn { flex: 1 1 100%; } }
.doc-body .prose code { white-space: nowrap; }
@media (max-width: 639.98px) { .doc-body .prose { font-size: var(--fs-md); line-height: 26px; } .doc-body .prose h2 { margin-top: var(--space-10); } }

/* account-affiliate */
.aff-link .copy-field { padding-left: var(--space-4); }
.aff-link .copy-field .copy-field__value { color: var(--color-primary-text); font-weight: var(--fw-semibold); }
.aff-share { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2) var(--space-3); padding-top: var(--space-4); border-top: 1px dashed var(--color-border); }
.aff-steps { display: flex; flex-direction: column; gap: var(--space-4); }
.aff-steps li { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: var(--space-3); }
.aff-steps strong { font-weight: var(--fw-semibold); color: var(--color-text); }
.aff-steps__n { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--color-primary-soft); color: var(--color-primary-text); font-size: var(--fs-sm); font-weight: var(--fw-bold); }
.aff-kpis .kpi__value { font-size: var(--fs-2xl); line-height: var(--lh-2xl); }
.aff-chart-head { flex-wrap: wrap; }
.aff-chart-tabs .tabs__tab { padding: 0 12px; }
.aff-chart-tabs .tabs__tab::after { display: none; }
.aff-chart__total { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; margin-bottom: var(--space-4); }
.aff-chart__total strong { font-size: var(--fs-2xl); line-height: var(--lh-2xl); font-weight: var(--fw-bold); }
.aff-chart { display: grid; grid-template-columns: 28px minmax(0, 1fr); grid-template-rows: 200px auto; column-gap: var(--space-2); row-gap: 6px; }
.aff-chart__y { display: flex; flex-direction: column; justify-content: space-between; margin: -8px 0; text-align: right; font-size: 11px; line-height: 16px; color: var(--color-text-3); font-variant-numeric: tabular-nums; }
.aff-chart__plot { width: 100%; height: 100%; max-width: none; overflow: visible; }
.aff-chart__grid { stroke: var(--color-border); stroke-width: 1; }
.aff-chart__grid:first-of-type { stroke: var(--color-border-strong); }
.aff-chart__bar { fill: var(--color-primary); }
.aff-chart__bar:hover { fill: var(--color-primary-hover); }
.aff-chart__x { grid-column: 2; display: flex; justify-content: space-between; font-size: 11px; line-height: 16px; color: var(--color-text-3); font-variant-numeric: tabular-nums; }
.aff-bank { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface-2); }
.aff-dl { grid-template-columns: 1fr auto; gap: var(--space-2) var(--space-4); }
.aff-dl dd { text-align: right; }
@media (max-width: 520px) { .aff-dl { grid-template-columns: 1fr auto; } .aff-dl dd { margin-bottom: 0; } }
.aff-prod { display: inline-flex; align-items: center; gap: var(--space-3); color: var(--color-text); font-weight: var(--fw-medium); white-space: nowrap; }
.aff-prod .tool-icon { width: 28px; height: 28px; border-radius: 8px; }
.aff-prod .tool-icon .icon { width: 14px; height: 14px; }
.aff-status { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.aff-void { color: var(--color-text-3); text-decoration: line-through; }
.aff-filter .select { width: auto; min-width: 180px; }
.aff-upper { text-transform: uppercase; }
.aff-skeleton__row { display: flex; align-items: center; gap: var(--space-5); padding: 18px var(--space-5); border-bottom: 1px solid var(--color-border); }
@media (max-width: 767px) {
  .aff-status { align-items: flex-end; }
  .aff-prod .tool-icon { display: none; }
  .aff-filter { flex: 1 1 100%; } .aff-filter .select { width: 100%; }
  .aff-skeleton__row { padding: var(--space-4); gap: var(--space-3); }
}
.doc-contact .kpi__icon { flex: none; width: 44px; height: 44px; background: var(--color-surface); box-shadow: var(--shadow-xs); }
.aff-link .card__body { height: 100%; }
.aff-note { display: flex; gap: 6px; align-items: flex-start; margin-top: auto; }
.aff-note .icon { margin-top: 1px; }

/* ticket (danh sách, gửi mới, chi tiết) */
.ticket-info { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: var(--space-4) var(--space-6); padding: var(--space-4) var(--space-5); }
.ticket-info__item { display: flex; align-items: center; gap: var(--space-3); min-width: 0; }
.ticket-info__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: var(--fs-sm); color: var(--color-text); }
.ticket-toolbar { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--space-3) var(--space-4); padding: var(--space-2) var(--space-5) 0; border-bottom: 1px solid var(--color-border); }
.ticket-tabs { border-bottom: 0; max-width: 100%; }
.ticket-search { flex: 0 1 280px; padding-bottom: var(--space-3); }
.ticket-title { color: var(--color-text); font-weight: var(--fw-medium); }
.ticket-title:hover { color: var(--color-primary-text); }
.ticket-title-cell { min-width: 220px; }
.ticket-dept { background: transparent; border: 1px solid color-mix(in srgb, currentColor 32%, transparent); }
.ticket-dept--tech { color: var(--color-primary-text); }
.ticket-dept--sales { color: #0f766e; }
.ticket-dept--license { color: #c2410c; }
[data-theme="dark"] .ticket-dept--sales { color: #5eead4; }
[data-theme="dark"] .ticket-dept--license { color: #fdba74; }
.ticket-svc { display: inline-flex; align-items: center; gap: var(--space-2); white-space: nowrap; color: var(--color-text); }
.ticket-svc .tool-icon { width: 24px; height: 24px; border-radius: 7px; }
.ticket-svc .tool-icon .icon { width: 13px; height: 13px; }
.ticket-replier { display: inline-flex; align-items: center; gap: var(--space-2); white-space: nowrap; }
.ticket-replier__name { display: flex; flex-direction: column; line-height: 1.3; font-size: var(--fs-sm); color: var(--color-text); }
.ticket-replier__name strong { font-weight: var(--fw-semibold); }
.ticket-avatar--staff { background: linear-gradient(135deg, #14b8a6, #0f766e); }
.ticket-date { white-space: nowrap; color: var(--color-text-2); }
.ticket-row--closed .ticket-title { color: var(--color-text-3); }
.ticket-skeleton__row { display: flex; align-items: center; gap: var(--space-5); padding: 18px var(--space-5); border-bottom: 1px solid var(--color-border); }
.ticket-skeleton__row .skeleton { max-width: 100%; }
.ticket-empty-actions { justify-content: center; }
@media (max-width: 767px) {
  .ticket-toolbar { padding: var(--space-2) var(--space-4) 0; }
  .ticket-search { flex-basis: 100%; order: -1; padding: var(--space-2) 0 0; }
  .ticket-title-cell { min-width: 0; }
  .table--stack td.ticket-title-cell { justify-content: flex-start; text-align: left; padding-bottom: 8px !important; }
  .table--stack td.ticket-title-cell::before { display: none; }
  .ticket-title { font-weight: var(--fw-semibold); }
  .ticket-replier__name { align-items: flex-end; }
  .ticket-skeleton__hide { display: none; }
  .ticket-skeleton__row { padding: var(--space-4); gap: var(--space-3); }
}
.aff-payout .card__header { align-items: flex-start; }
@media (max-width: 479px) {
  .aff-link .copy-field { flex-wrap: wrap; padding: var(--space-3); }
  .aff-link .copy-field .copy-field__value { flex-basis: calc(100% - 32px); }
  .aff-link .copy-field .btn { width: 100%; }
}
.ticket-title-cell { min-width: 180px; max-width: 280px; }
.ticket-when { display: inline-flex; flex-direction: column; line-height: 1.35; }
.ticket-table th, .ticket-table td { padding-left: 14px; padding-right: 14px; }
@media (max-width: 767px) { .ticket-title-cell { max-width: none; } .ticket-when { flex-direction: row; gap: 6px; align-items: baseline; } }

/* tool-voiceflash (tiền tố vf-) */
.vf-hero { padding-top: var(--space-6); }
@media (min-width: 1024px) { .vf-hero { padding-top: var(--space-8); padding-bottom: 96px; } }
.vf-breadcrumb { position: relative; margin-bottom: var(--space-8); }
@media (min-width: 1024px) { .vf-breadcrumb { margin-bottom: var(--space-12); } }
.vf-hero__bullets { font-size: var(--fs-lg); line-height: var(--lh-lg); }
.vf-hero__price { font-size: var(--fs-sm); }
.vf-hero__price strong { color: var(--color-text); }
.pub-float__icon--brand { background: var(--color-primary-soft); color: var(--color-primary); }

/* Mẫu giọng */
.vf-voices { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); }
.vf-voice { display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-5); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 16px; box-shadow: var(--shadow-xs); transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease); }
.vf-voice:hover { border-color: var(--brand-200); }
.vf-voice.is-playing { border-color: var(--brand-300); box-shadow: 0 0 0 3px var(--brand-50), var(--shadow-md); }
.vf-voice__top { display: flex; align-items: center; gap: var(--space-3); }
.vf-voice__play { width: 44px; height: 44px; flex: none; border-radius: 50%; border: 0; display: grid; place-items: center; cursor: pointer; background: var(--color-primary-soft); color: var(--color-primary); transition: background var(--dur) var(--ease), color var(--dur) var(--ease); }
.vf-voice__play .icon { fill: currentColor; }
.vf-voice__play:hover, .vf-voice.is-playing .vf-voice__play { background: var(--color-primary); color: #fff; }
.vf-voice__play:focus-visible { outline: none; box-shadow: var(--ring); }
.vf-voice__info { min-width: 0; flex: 1; }
.vf-voice__name { font-size: var(--fs-lg); line-height: var(--lh-lg); font-weight: var(--fw-semibold); }
.vf-voice__meta { font-size: var(--fs-sm); color: var(--color-text-3); }
.vf-voice__now { align-self: flex-start; }
.vf-wave { display: block; width: 100%; height: 40px; }
.vf-wave rect { fill: var(--brand-200); }
.vf-voice.is-playing .vf-wave rect { fill: var(--color-border-strong); }
.vf-voice.is-playing .vf-wave rect.is-played { fill: var(--color-primary); }
.vf-voice__foot { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); }
.vf-voice__time { font-size: var(--fs-sm); color: var(--color-text-3); white-space: nowrap; }
.vf-voice.is-playing .vf-voice__time > span:first-child { color: var(--color-primary-text); font-weight: var(--fw-semibold); }

/* Tính năng */
.vf-features { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-8) var(--space-6); grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.vf-feature { display: flex; flex-direction: column; gap: var(--space-2); }
.vf-feature .pub-trust__icon { margin-bottom: var(--space-2); }
.vf-feature__title { font-size: var(--fs-lg); line-height: var(--lh-lg); font-weight: var(--fw-semibold); }
.vf-feature__text { color: var(--color-text-3); }

/* Bảng giá: bảng so sánh (desktop) / thẻ xếp chồng (mobile) — cùng một markup */
.vf-plans { display: grid; gap: var(--space-5); grid-template-columns: 1fr; max-width: 1040px; margin: 0 auto; }
.vf-plans__labels { display: none; }
.vf-plan { position: relative; display: flex; flex-direction: column; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 16px; box-shadow: var(--shadow-xs); }
.vf-plan__head { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-6) var(--space-5) var(--space-5); }
.vf-plan__head .btn { margin-top: var(--space-3); }
.vf-plan__name { font-size: var(--fs-lg); font-weight: var(--fw-semibold); color: var(--color-text); }
.vf-plan__price { display: flex; align-items: baseline; gap: var(--space-2); flex-wrap: wrap; font-size: 30px; line-height: 38px; font-weight: var(--fw-bold); letter-spacing: -0.02em; color: var(--color-text); }
.vf-plan__strike { font-size: var(--fs-md); font-weight: var(--fw-regular); color: var(--color-text-3); letter-spacing: 0; }
.vf-plan__note { font-size: var(--fs-sm); color: var(--color-text-3); min-height: 24px; display: flex; align-items: center; }
.vf-plan__flag { position: absolute; top: -12px; left: var(--space-5); }
.vf-plan__row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: 12px var(--space-5); border-top: 1px solid var(--color-border); font-size: var(--fs-md); }
.vf-plan__label { color: var(--color-text-3); }
.vf-plan__value { color: var(--color-text); font-weight: var(--fw-medium); text-align: right; }
.vf-plan--popular { border: 2px solid var(--color-primary); box-shadow: var(--shadow-lg); }
.vf-plan--popular .vf-plan__head { background: linear-gradient(180deg, var(--brand-50), transparent); border-radius: 14px 14px 0 0; }
@media (min-width: 900px) {
  .vf-plans { grid-template-columns: minmax(170px, .9fr) repeat(3, minmax(0, 1fr)); gap: 0 var(--space-4); align-items: start; }
  .vf-plans__labels { display: flex; flex-direction: column; padding-top: 2px; }
  .vf-plans__labels .vf-plan__row { border-top-color: transparent; color: var(--color-text-2); font-weight: var(--fw-medium); padding-left: 0; }
  .vf-plan__head { height: 236px; }
  .vf-plans__labels .vf-plan__head { padding: 0; }
  .vf-plan__row { height: 52px; justify-content: center; text-align: center; }
  .vf-plan__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .vf-plan__value { text-align: center; }
  .vf-plan > .vf-plan__row:last-child { border-radius: 0 0 16px 16px; }
  .vf-plan--popular { margin-top: -1px; }
  .vf-plans__labels .vf-plan__row { justify-content: flex-start; border-top: 1px solid var(--color-border); }
}
.vf-plans__foot { margin-top: var(--space-8); display: flex; align-items: center; justify-content: center; gap: var(--space-2); text-align: center; font-size: var(--fs-sm); flex-wrap: wrap; }
.vf-plans__foot .icon { color: var(--color-success); }

/* Tải ứng dụng */
.vf-download { display: grid; gap: var(--space-5); }
@media (min-width: 1024px) { .vf-download { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: start; } }
.vf-dl { list-style: none; margin: 0; padding: 0; }
.vf-dl__item { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4) var(--space-5); }
.vf-dl__item + .vf-dl__item { border-top: 1px solid var(--color-border); }
.vf-dl__icon { width: 44px; height: 44px; border-radius: 12px; flex: none; display: grid; place-items: center; background: var(--color-surface-2); border: 1px solid var(--color-border); color: var(--color-text-2); }
.vf-dl__info { flex: 1; min-width: 0; }
.vf-dl__name { font-weight: var(--fw-semibold); color: var(--color-text); }
.vf-dl__meta { font-size: var(--fs-sm); color: var(--color-text-3); overflow-wrap: anywhere; }
.vf-dl__meta .mono { font-size: var(--fs-xs); }
@media (max-width: 559px) {
  .vf-dl__item { flex-wrap: wrap; }
  .vf-dl__item .btn { flex: 1 1 100%; }
}
.vf-req__dl { grid-template-columns: minmax(96px, max-content) 1fr; }
.vf-req__note { margin-top: var(--space-5); }
.vf-cta { padding-top: var(--space-16); }
@media (min-width: 1024px) { .vf-cta { padding-top: 96px; } }
@media (max-width: 639.98px) {
  .doc-switch { flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-6); padding-bottom: var(--space-6); overflow: visible; }
  .doc-switch__tab { padding: 6px 12px; border: 1px solid var(--color-border); border-radius: var(--radius-full); background: var(--color-surface); font-size: var(--fs-sm); }
  .doc-switch__tab:hover { border-color: var(--color-border-strong); }
  .doc-switch__tab[aria-current="page"] { border-color: var(--brand-200); background: var(--color-primary-soft); }
  .doc-hero__meta > [aria-hidden="true"] { display: none; }
  .doc-hero__meta { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 639.98px) { .doc-switch__tab .icon { display: none; } }
/* tool-voiceflash (bổ sung) */
.vf-plan__head .btn { flex: none; margin-top: auto; }
.vf-plan__note { gap: var(--space-2); flex-wrap: wrap; }
.vf-plan__head .vf-plan__strike { font-size: var(--fs-sm); }
@media (max-width: 899px) { .vf-plan__head .btn { margin-top: var(--space-3); } }
@media (min-width: 900px) { .vf-plan__head { height: 214px; } }
/* ticket-add */
.ticket-fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.ticket-fieldset legend { margin-bottom: var(--space-2); width: 100%; }
.ticket-priority { grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr)); gap: var(--space-2); }
.ticket-priority .radio-card { padding: var(--space-3) var(--space-4); gap: 2px; }
.ticket-priority .radio-card__title { font-size: var(--fs-md); }
.ticket-priority .radio-card__mark { top: 12px; right: 12px; width: 18px; height: 18px; }
.ticket-priority .radio-card__meta { font-size: var(--fs-xs); }
.ticket-editor { border: 1px solid var(--color-border-strong); border-radius: var(--radius-md); background: var(--color-surface); overflow: hidden; }
.ticket-editor:focus-within { border-color: var(--color-primary); box-shadow: var(--ring); }
.ticket-editor__bar { display: flex; align-items: center; gap: 2px; padding: 4px 6px; border-bottom: 1px solid var(--color-border); background: var(--color-surface-2); }
.ticket-editor__btn { width: 32px; height: 32px; }
.ticket-editor__sep { width: 1px; height: 18px; background: var(--color-border); margin: 0 4px; }
.ticket-editor__input { border: 0; border-radius: 0; box-shadow: none !important; min-height: 160px; }
.ticket-editor__input:hover, .ticket-editor__input:focus { border: 0; }
.ticket-link { color: var(--color-primary-text); text-decoration: underline; text-underline-offset: 2px; }
.ticket-file__text { min-width: 0; display: flex; flex-direction: column; }
.ticket-file__thumb--error { background: var(--color-surface); color: var(--color-danger-text); }
.field.is-invalid .dropzone { border-color: var(--color-danger); }
.ticket-mail-note { align-items: flex-start; }
.ticket-form-foot { display: flex; justify-content: flex-end; align-items: center; gap: var(--space-3); }
.ticket-checklist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-3); font-size: var(--fs-sm); color: var(--color-text-2); }
.ticket-checklist li { display: flex; gap: var(--space-2); align-items: flex-start; }
.ticket-checklist .icon { color: var(--color-success); flex: none; margin-top: 2px; }
.ticket-aside-links { padding-top: var(--space-3); border-top: 1px solid var(--color-border); font-size: var(--fs-sm); }
.ticket-aside-links a { display: inline-flex; align-items: center; gap: var(--space-2); font-weight: var(--fw-medium); }
.ticket-contact { margin: 0; display: flex; flex-direction: column; gap: var(--space-2); font-size: var(--fs-sm); }
.ticket-contact div { display: flex; justify-content: space-between; gap: var(--space-3); }
.ticket-contact dt { color: var(--color-text-3); }
.ticket-contact dd { margin: 0; color: var(--color-text); text-align: right; }
.ticket-success { max-width: 640px; width: 100%; margin: var(--space-6) auto; padding: var(--space-10) var(--space-6); }
.ticket-success .alert { text-align: left; width: 100%; }
.ticket-success__actions { justify-content: center; margin-top: var(--space-2); }
@media (max-width: 767px) {
  .ticket-form-foot { flex-direction: column-reverse; align-items: stretch; }
  .ticket-form-foot .btn { width: 100%; }
  .ticket-editor__code span { display: none; }
}
.guide-popular { margin-top: var(--space-4); }
.guide-contact .kpi__icon { flex: none; }
.guide-cat .tool-icon, .guide-cat .kpi__icon { margin-bottom: var(--space-1); }
.guide-list__title, .guide-list__meta { display: block; }
.guide-list .kpi__icon { flex: none; }
.guide-contact .btn { align-self: flex-start; }
.guide-cats { padding-bottom: 0; }
@media (min-width: 1024px) { .guide-cats { padding-top: var(--space-12); } }

/* error pages (404, 403, 500, maintenance) */
.err { max-width: 560px; gap: var(--space-5); }
.err-art { width: 220px; height: auto; margin-bottom: calc(-1 * var(--space-2)); }
.err .error-code { font-size: 72px; margin-bottom: calc(-1 * var(--space-2)); background: linear-gradient(180deg, var(--brand-500), var(--brand-800)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.err__title { font-size: var(--fs-3xl); line-height: var(--lh-3xl); font-weight: var(--fw-bold); letter-spacing: -0.025em; }
.err__text { color: var(--color-text-3); font-size: var(--fs-lg); line-height: var(--lh-lg); }
.err-search { display: flex; gap: var(--space-2); width: 100%; max-width: 460px; }
.err-search .input { height: 44px; }
.err-search .btn { height: 44px; }
.err-links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); width: 100%; margin-top: var(--space-2); }
.err-link { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-3); padding: var(--space-4); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); text-align: left; color: inherit; text-decoration: none !important; transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease); }
.err-link:hover { border-color: var(--brand-300); box-shadow: var(--shadow-md); }
.err-link__text { display: flex; flex-direction: column; gap: 2px; }
.err-link__text strong { color: var(--color-text); font-weight: var(--fw-semibold); }
.err-link__text span { font-size: var(--fs-xs); color: var(--color-text-3); }
.err-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-3); }
.err-note { width: 100%; text-align: left; }
.err-incident { width: 100%; max-width: 360px; display: flex; flex-direction: column; gap: 6px; text-align: left; }
.err-incident .copy-field__value { font-weight: var(--fw-semibold); letter-spacing: .04em; }
.err-eta { display: grid; grid-template-columns: 1fr 1fr; width: 100%; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.err-eta__item { display: flex; flex-direction: column; gap: 4px; padding: var(--space-4); }
.err-eta__item + .err-eta__item { border-left: 1px solid var(--color-border); }
.err-eta__item strong { font-size: var(--fs-xl); line-height: var(--lh-xl); color: var(--color-text); }
.err-eta__count { font-family: var(--font-mono); color: var(--color-primary-text) !important; }
.err-subscribe { width: 100%; text-align: left; }
.err-subscribe__row { display: flex; gap: var(--space-2); }
.err-subscribe__row .input { flex: 1; min-width: 0; }
@media (max-width: 560px) {
  .err-art { width: 180px; }
  .err .error-code { font-size: 56px; }
  .err__title { font-size: var(--fs-2xl); line-height: var(--lh-2xl); }
  .err__text { font-size: var(--fs-md); line-height: var(--lh-md); }
  .err-links { grid-template-columns: 1fr; }
  .err-link { flex-direction: row; align-items: center; }
  .err-actions { flex-direction: column; width: 100%; }
  .err-actions .btn { width: 100%; }
  .err-subscribe__row { flex-direction: column; }
}
.err-eta__item strong { white-space: nowrap; }
@media (max-width: 560px) {
  .err-subscribe__row .input { flex: none; }
  .err-eta__item { padding: var(--space-3); }
  .err-eta__item strong { font-size: var(--fs-lg); line-height: var(--lh-lg); }
}
.err-subscribe { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-2); align-items: start; }
.err-subscribe__btn { margin-top: 26px; height: 42px; }
@media (max-width: 560px) { .err-subscribe { grid-template-columns: 1fr; } .err-subscribe__btn { margin-top: 0; width: 100%; } }
/* ticket-reply */
.ticket-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: var(--space-4) var(--space-6); padding: var(--space-5) var(--space-6); }
.ticket-head__main { display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; flex: 1 1 480px; }
.ticket-head__title { overflow-wrap: anywhere; }
.ticket-head__meta { margin: 0; display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-8); font-size: var(--fs-sm); }
.ticket-head__meta div { display: flex; flex-direction: column; gap: 4px; }
.ticket-head__meta dt { font-size: var(--fs-xs); color: var(--color-text-3); }
.ticket-head__meta dd { margin: 0; color: var(--color-text); font-weight: var(--fw-medium); min-height: 24px; display: flex; align-items: center; }
.ticket-head__actions { display: flex; gap: var(--space-2); }
.ticket-filechip { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; align-self: flex-start; padding: 6px 12px; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface-2); font-size: var(--fs-sm); max-width: 100%; }
.ticket-filechip .mono { overflow-wrap: anywhere; color: var(--color-text); }
.ticket-contact-link { display: inline-flex; align-items: center; gap: 6px; color: var(--color-text-2); }
.thread__event > span { display: inline-flex; align-items: center; gap: 6px; text-align: center; }
.ticket-composer__foot { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); }
.ticket-composer__foot .btn--primary { margin-left: auto; }
.ticket-attach { cursor: pointer; }
.ticket-attach:focus-within { box-shadow: var(--ring); }
.ticket-skeleton__msg { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: var(--space-3); }
.ticket-contact dd a { overflow-wrap: anywhere; }
@media (max-width: 767px) {
  .ticket-head { padding: var(--space-4); }
  .ticket-head__actions, .ticket-head__actions .btn { width: 100%; }
  .ticket-head__meta { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); }
  .message { grid-template-columns: minmax(0, 1fr); }
  .message > .avatar { display: none; }
  .ticket-composer__hint { flex-basis: 100%; order: 3; }
  .ticket-composer__foot .btn--primary { margin-left: auto; }
}
@media (max-width: 767px) {
  .ticket-page-event, .thread__event > span { flex-wrap: wrap; justify-content: center; }
  .thread__event::before, .thread__event::after { flex: 0 0 16px; }
}
.prose figure img.guide-shot__phone { border: 0; border-radius: 0; }
.guide-app .input { display: flex; align-items: center; overflow: hidden; white-space: nowrap; }
.guide-title-row { margin-top: var(--space-4); flex-wrap: nowrap; }
.guide-title-row .doc-hero__title { margin-top: 0; }
.guide-device { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-3) var(--space-4); flex-wrap: wrap; }
.guide-device .grow { min-width: 140px; }
.prose kbd { font-family: var(--font-mono); font-size: .8em; padding: 1px 6px; border: 1px solid var(--color-border-strong); border-bottom-width: 2px; border-radius: 5px; background: var(--color-surface); }
@media (max-width: 639.98px) { .guide-title-row .tool-icon--lg { width: 44px; height: 44px; } }
.faq-search { margin-top: var(--space-6); max-width: 560px; }
.faq-search .input { height: 48px; font-size: var(--fs-md); box-shadow: var(--shadow-xs); }
.faq-group__title .kpi__icon { flex: none; }
[data-state="search"] + .card.empty, [data-state="search"] { margin-bottom: var(--space-4); }
#faq-lien-he { scroll-margin-top: 96px; }

/* admin-products (tiền tố adm-prd-) */
.adm-prd-filter { width: auto; min-width: 170px; }
.adm-prd-count { margin-left: auto; }
.adm-prd-name { color: inherit; text-decoration: none !important; }
.adm-prd-name:hover .cell-main__title { color: var(--color-primary-text); }
.adm-prd-codes { align-items: flex-start; }
.adm-prd-rev { display: inline-flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.adm-prd-share { width: 80px; }
.adm-prd-share .progress__track { height: 4px; }
.adm-prd-bar--1 { background: var(--chart-1); }
.adm-prd-bar--2 { background: var(--chart-2); }
@media (max-width: 767px) {
  .adm-prd-count { display: none; }
  .adm-prd-filter { flex: 1 1 auto; }
  .adm-prd-codes, .adm-prd-rev { align-items: flex-end; }
}
.adm-prd-table .td-primary { min-width: 220px; }
.adm-prd-plans .badge { flex: none; }
.adm-prd-rev, .adm-prd-table .badge, .adm-prd-table .cell-main__sub .num { white-space: nowrap; }
.adm-prd-table .td-primary .cell-main__sub { white-space: normal; }
.adm-prd-plans { display: flex; flex-wrap: wrap; gap: 4px; width: 200px; }

/* admin-customers / admin-customer-detail (adm-cus-) */
.adm-cus-filters { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.adm-cus-filters .select { width: auto; min-width: 150px; }
.adm-cus-toolbar .table-toolbar__bulk { margin-left: auto; }
.adm-cus-chips { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); padding: var(--space-3) var(--space-5); border-bottom: 1px solid var(--color-border); background: var(--color-surface-2); }
.adm-cus-ident { min-width: 0; }
.adm-cus-ident .cell-main__title { font-weight: var(--fw-semibold); color: var(--color-text); }
.adm-cus-tools { display: inline-flex; align-items: center; gap: 8px; }
.adm-cus-tools__icons { display: inline-flex; }
.adm-cus-tools__icons .tool-icon { width: 22px; height: 22px; border-radius: 6px; box-shadow: 0 0 0 2px var(--color-surface); }
.adm-cus-tools__icons .tool-icon + .tool-icon { margin-left: -5px; }
.adm-cus-tools__icons .tool-icon .icon { width: 12px; height: 12px; }
.adm-cus-empty-icon { width: 56px; height: 56px; border-radius: 50%; }
.adm-cus-perpage { width: auto; }
.adm-cus-ellipsis { border-color: transparent; background: transparent; }
@media (max-width: 767px) {
  .adm-cus-filters, .adm-cus-filters .select { width: 100%; }
  .adm-cus-filters .select { flex: 1 1 140px; min-width: 0; }
  .adm-cus-chips { padding: var(--space-3) var(--space-4); }
  .table--stack.adm-cus-table td.td-primary { padding-right: 40px !important; }
}

/* admin-dashboard (tiền tố adm-) */
.adm-head-actions { gap: var(--space-3); }
.adm-kpis { display: grid; gap: var(--space-4); grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 768px) { .adm-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 479px) { .adm-kpis { grid-template-columns: 1fr; } }
.adm-kpis .kpi__value { font-size: var(--fs-2xl); line-height: var(--lh-2xl); }
.adm-kpis .kpi__delta .icon { vertical-align: -2px; }
.adm-chart { display: flex; flex-direction: column; gap: var(--space-4); }
.adm-chart__svg { display: block; width: 100%; height: auto; overflow: visible; }
.adm-chart__grid line { stroke: var(--chart-grid); stroke-width: 1; stroke-dasharray: 2 4; }
.adm-chart__grid line.is-base { stroke-dasharray: none; stroke: var(--color-border-strong); }
.adm-chart__svg text { fill: var(--color-text-3); font-size: 11px; font-family: inherit; font-variant-numeric: tabular-nums; }
.adm-fill-1, .adm-swatch-1 { fill: var(--chart-1); background: var(--chart-1); }
.adm-fill-2, .adm-swatch-2 { fill: var(--chart-2); background: var(--chart-2); }
.adm-bar__hit { fill: transparent; }
.adm-bar:hover .adm-bar__hit { fill: var(--color-surface-hover); }
.adm-chart__bars:hover .adm-bar:not(:hover) :is(.adm-fill-1, .adm-fill-2) { opacity: .45; }
.adm-chart__table summary { cursor: pointer; font-size: var(--fs-sm); color: var(--color-text-3); width: max-content; }
.adm-chart__table summary:hover { color: var(--color-text); }
.adm-chart__table .table-wrap { max-height: 280px; overflow: auto; margin-top: var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius-md); }
.adm-donut { display: flex; flex-direction: column; align-items: center; gap: var(--space-5); }
.adm-donut__svg { width: 188px; height: 188px; }
.adm-plan-1 { stroke: color-mix(in oklab, var(--chart-3) 38%, var(--color-surface)); }
.adm-plan-2 { stroke: color-mix(in oklab, var(--chart-3) 68%, var(--color-surface)); }
.adm-plan-3 { stroke: var(--chart-3); }
.adm-plan-sw-1 { background: color-mix(in oklab, var(--chart-3) 38%, var(--color-surface)); }
.adm-plan-sw-2 { background: color-mix(in oklab, var(--chart-3) 68%, var(--color-surface)); }
.adm-plan-sw-3 { background: var(--chart-3); }
.adm-donut__svg circle:hover { stroke-width: 22; }
.adm-donut__value { fill: var(--color-text); font-size: 15px; font-weight: 700; font-variant-numeric: tabular-nums; }
.adm-donut__label { fill: var(--color-text-3); font-size: 9px; }
.adm-donut__legend { list-style: none; margin: 0; padding: 0; width: 100%; display: flex; flex-direction: column; gap: var(--space-2); font-size: var(--fs-sm); }
.adm-donut__legend li { display: flex; align-items: center; gap: var(--space-3); padding: 6px 0; border-bottom: 1px dashed var(--color-border); }
.adm-donut__legend li:last-child { border-bottom: 0; }
.adm-donut__legend strong { min-width: 40px; text-align: right; }
.adm-card-danger { border-top: 3px solid var(--color-danger); }
.adm-card-danger .card__header { background: var(--color-danger-soft); }
.adm-card-danger .card__title { display: flex; align-items: center; gap: var(--space-2); }
.adm-txcontent { font-size: 12.5px; color: var(--color-text); background: var(--color-surface-2); border: 1px solid var(--color-border); border-radius: var(--radius-xs); padding: 2px 6px; white-space: nowrap; }
.adm-alerts { list-style: none; margin: 0; padding: 0; }
.adm-alert { display: flex; gap: var(--space-3); padding: var(--space-4) var(--space-5); border-bottom: 1px solid var(--color-border); }
.adm-alert:last-child { border-bottom: 0; }
.adm-alert__title { font-weight: var(--fw-semibold); color: var(--color-text); }
.adm-alert__text { font-size: var(--fs-sm); color: var(--color-text-3); margin-top: 2px; }
.adm-alert__link { display: inline-block; margin-top: 6px; font-size: var(--fs-sm); font-weight: var(--fw-medium); }
@media (max-width: 767px) { .adm-head-actions { width: 100%; } .adm-head-actions .segmented { overflow-x: auto; max-width: 100%; } }
.adm-kpis .kpi__delta { display: inline; }
.adm-kpis .kpi__delta .icon { display: inline-block; vertical-align: -2px; margin-right: 2px; }
.adm-time { display: flex; flex-direction: column; line-height: 1.3; }
@media (min-width: 768px) {
  .adm-cus-table th, .adm-cus-table td { padding-left: 12px; padding-right: 12px; }
  .adm-cus-table th:first-child, .adm-cus-table td:first-child { padding-left: var(--space-5); }
  .adm-cus-table .col-actions { position: sticky; right: 0; background: var(--color-surface); padding-right: var(--space-4); }
  .adm-cus-table th.col-actions { background: var(--color-surface-2); }
  .adm-cus-table tbody tr:hover .col-actions { background: var(--color-surface-hover); }
  .adm-cus-table tbody tr.is-selected .col-actions { background: var(--color-primary-soft); }
}
@media (min-width: 768px) and (max-width: 1399px) {
  .adm-cus-table .td-primary .avatar { display: none; }
  .adm-cus-ident .cell-main__title { display: block; max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
.adm-cus-th-short { display: none; }
@media (min-width: 768px) {
  .adm-cus-table th, .adm-cus-table td { padding-left: 10px; padding-right: 10px; }
}
@media (min-width: 768px) and (max-width: 1399px) {
  .adm-cus-th-long { display: none; } .adm-cus-th-short { display: inline; }
  .adm-cus-ident .cell-main__title { max-width: 170px; }
}
@media (min-width: 768px) { .adm-cus-table .col-check { width: 40px; padding-right: 0; } }
@media (min-width: 768px) and (max-width: 1399px) { .adm-cus-ident .cell-main__title { max-width: 156px; } }
.adm-cus-toolbar:has(.table-toolbar__bulk.is-active) .adm-cus-filters { display: none; }

/* admin-orders + admin-order-detail (tiền tố adm-ord-) */
.adm-ord-statusbar { padding-bottom: var(--space-3); border-bottom: 0; }
.adm-ord-seg { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.adm-ord-seg .segmented__btn { white-space: nowrap; }
.adm-ord-count { display: inline-grid; place-items: center; min-width: 20px; height: 18px; padding: 0 6px; margin-left: 2px; border-radius: var(--radius-full); background: var(--color-info-soft); color: var(--color-info-text); font-size: 11px; font-weight: var(--fw-semibold); font-variant-numeric: tabular-nums; }
.adm-ord-filters { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--space-3); padding: 0 var(--space-5) var(--space-4); }
.adm-ord-filters .field__label { font-size: var(--fs-xs); }
.adm-ord-filters fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.adm-ord-filters legend { padding: 0; margin-bottom: 6px; }
.adm-ord-filters__search { flex: 1 1 240px; max-width: 340px; }
.adm-ord-filters__tool { flex: 0 1 160px; }
.adm-ord-range__inputs { display: flex; align-items: center; gap: 6px; }
.adm-ord-range .input-wrap { width: 138px; }
.adm-ord-range--money .input { width: 104px; }
.adm-ord-chips { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); padding: var(--space-3) var(--space-5); border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); background: var(--color-surface-2); }
.adm-ord-chips__sum { margin-left: auto; }
.adm-ord-cust { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.adm-ord-cust__name { color: var(--color-text); font-weight: var(--fw-medium); }
.adm-ord-prod { display: inline-flex; align-items: center; gap: 10px; }
.adm-ord-prod__text, .adm-ord-voucher, .adm-ord-status { display: inline-flex; flex-direction: column; gap: 2px; }
.adm-ord-status { align-items: flex-start; }
.adm-ord-amount { display: inline-flex; flex-direction: column; align-items: flex-end; gap: 1px; }
.adm-ord-strike { color: var(--color-text-3); text-decoration: line-through; }
.adm-ord-hold { display: inline-flex; align-items: center; gap: 4px; }
.adm-ord-table td { white-space: nowrap; }
.adm-ord-time { color: var(--color-text-2); }
.adm-ord-row--muted .adm-ord-cust__name, .adm-ord-row--muted .text-strong { color: var(--color-text-2); }
.adm-ord-skeleton__row { display: flex; align-items: center; gap: var(--space-5); padding: 14px var(--space-5); border-bottom: 1px solid var(--color-border); }
.adm-ord-note { display: flex; align-items: center; gap: 8px; }
@media (max-width: 1599px) { .adm-ord-act-label { display: none; } }
@media (max-width: 767px) {
  .adm-ord-filters__search { max-width: none; flex-basis: 100%; }
  .adm-ord-filters__tool { flex: 1 1 100%; }
  .adm-ord-range { flex: 1 1 100%; }
  .adm-ord-range .input-wrap, .adm-ord-range--money .input { flex: 1; width: auto; }
  .adm-ord-chips__sum { margin-left: 0; flex-basis: 100%; }
  .adm-ord-table td { white-space: normal; }
  .adm-ord-skeleton__row > :nth-child(n+4) { display: none; }
  .adm-ord-status, .adm-ord-voucher, .adm-ord-cust, .adm-ord-amount { align-items: flex-end; text-align: right; }
  .adm-ord-act-label { display: inline; }
}
.adm-ord-when { display: inline-flex; flex-direction: column; gap: 1px; }
@media (max-width: 767px) { .adm-ord-when { flex-direction: row; gap: 6px; align-items: baseline; } }
.adm-ord-table th:not(:first-child):not(:last-child), .adm-ord-table td:not(:first-child):not(:last-child) { padding-left: 12px; padding-right: 12px; }
@media (min-width: 768px) and (max-width: 1439px) { .adm-ord-prod .tool-icon { display: none; } .adm-ord-filters__search { max-width: 280px; } }
@media (min-width: 768px) and (max-width: 1439px) { .adm-ord-quick { display: none; } }

/* admin-transactions (tiền tố adm-) */
.adm-live { display: inline-flex; align-items: center; gap: 6px; color: var(--color-success-text); font-weight: var(--fw-medium); }
.adm-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
@media (min-width: 768px) { .adm-summary { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.adm-summary__item { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; padding: var(--space-3) var(--space-4); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-md); color: var(--color-text); text-decoration: none !important; box-shadow: var(--shadow-xs); }
a.adm-summary__item:hover { border-color: var(--color-border-strong); }
.adm-summary__item[aria-current="page"] { border-color: var(--color-primary); box-shadow: var(--ring); }
.adm-summary__label { flex-basis: 100%; display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-xs); font-weight: var(--fw-medium); color: var(--color-text-3); }
.adm-summary__item strong { font-size: var(--fs-xl); line-height: var(--lh-xl); }
.adm-summary__unit { font-size: var(--fs-xs); color: var(--color-text-3); }
.adm-summary__item--success .adm-summary__label { color: var(--color-success-text); }
.adm-summary__item--danger { border-color: var(--danger-200); background: var(--color-danger-soft); }
.adm-summary__item--danger .adm-summary__label, .adm-summary__item--danger strong { color: var(--color-danger-text); }
.adm-summary__item--warning .adm-summary__label { color: var(--color-warning-text); }
.adm-summary__item--total { background: var(--color-surface-2); box-shadow: none; }
[data-theme="dark"] .adm-summary__item--danger { border-color: rgba(220,38,38,.35); }
.adm-filters .select { width: auto; }
.adm-filter-date { width: 150px; }
.adm-range { display: inline-flex; align-items: center; gap: 6px; }
.adm-range .input { width: 100px; }
.adm-bank { display: flex; flex-direction: column; line-height: 1.35; white-space: nowrap; }
.adm-tx-table tr.adm-tx--attn td { background: color-mix(in oklab, var(--color-danger-soft) 55%, transparent); }
.adm-tx-table tr.adm-tx--attn td:first-child { box-shadow: inset 3px 0 0 var(--color-danger); }
.adm-tx-table .row-actions { align-items: center; }
.adm-tx-table .row-actions .btn { white-space: nowrap; }
.adm-tx-table td .stack { align-items: flex-start; }
.adm-txcard { display: grid; gap: var(--space-4); padding: var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface-2); }
.adm-txcard__amount { display: flex; flex-direction: column; gap: 2px; }
.adm-txcard__amount strong { font-size: var(--fs-3xl); line-height: var(--lh-3xl); color: var(--color-text); }
.adm-txcard__dl { display: grid; grid-template-columns: max-content 1fr; gap: var(--space-2) var(--space-5); margin: 0; font-size: var(--fs-sm); }
.adm-txcard__dl dt { color: var(--color-text-3); }
.adm-txcard__dl dd { margin: 0; color: var(--color-text); font-weight: var(--fw-medium); }
.adm-candidates { border: 0; padding: 0; margin: 0; min-width: 0; }
.adm-candidates legend { padding: 0; margin-bottom: var(--space-2); }
.adm-cand { padding: var(--space-3) var(--space-4); }
.adm-cand__row { display: flex; align-items: flex-start; gap: var(--space-3); }
.adm-cand__row .radio-card__mark { margin-top: 3px; flex: none; }
.adm-cand__amt { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; white-space: nowrap; }
.adm-cand__amt .icon { vertical-align: -2px; display: inline-block; }
.adm-hl { background: var(--color-warning-soft); color: inherit; border-radius: 3px; padding: 0 1px; }
.adm-drawer-foot { align-items: center; }
@media (max-width: 767px) { .adm-range, .adm-filter-date, .adm-filters .select { width: 100%; } .adm-range .input { flex: 1; width: auto; } }
.adm-cand .radio-card__mark { position: static; }
@media (max-width: 767px) { .adm-ord-range__inputs > * { min-width: 0; flex: 1 1 0; } .adm-ord-range__inputs > span { flex: none; } .adm-ord-range .input { min-width: 0; } }
.adm-filters .table-toolbar__search { flex: 1 1 200px; }
.adm-filter-date { width: 140px; }
.adm-ord-empty { border-top: 1px solid var(--color-border); }
.adm-split { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
@media (min-width: 1280px) { .adm-split { grid-template-columns: minmax(0, 1fr) 340px; } }
@media (min-width: 1440px) { .adm-split { grid-template-columns: minmax(0, 1fr) 380px; } }
@media (min-width: 768px) and (max-width: 1279px) { .adm-tx-table .adm-col-ref { display: none; } }
/* admin-product-detail (tiền tố adm-prd-) */
.adm-prd-head { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-5); flex-wrap: wrap; }
.adm-prd-head__main { flex: 1 1 320px; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.adm-prd-head__meta { display: flex; flex-wrap: wrap; gap: 4px var(--space-5); }
.adm-prd-head__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.adm-prd-status { width: auto; min-width: 140px; }
.adm-prd-form { display: flex; flex-direction: column; gap: var(--space-5); }
.adm-prd-form__row { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
.adm-prd-prefix { display: flex; align-items: stretch; }
.adm-prd-prefix__text { display: inline-flex; align-items: center; padding: 0 var(--space-3); border: 1px solid var(--color-border-strong); border-right: 0; border-radius: var(--radius-md) 0 0 var(--radius-md); background: var(--color-surface-2); color: var(--color-text-3); font-size: var(--fs-sm); white-space: nowrap; }
.adm-prd-prefix .input { border-radius: 0 var(--radius-md) var(--radius-md) 0; min-width: 0; }
.adm-prd-icon { display: flex; align-items: center; gap: var(--space-4); }
.adm-prd-upload { align-self: flex-start; cursor: pointer; }
.adm-prd-icon:has(input:focus-visible) .adm-prd-upload { box-shadow: var(--ring); }
.adm-prd-fieldset { border: 0; padding: 0; margin: 0; }
.adm-prd-fieldset legend { padding: 0; margin-bottom: 6px; }
.adm-prd-scopes { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.adm-prd-scope { position: relative; display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 14px 0 10px; border: 1.5px solid var(--color-border); border-radius: var(--radius-full); background: var(--color-surface); cursor: pointer; font-size: var(--fs-sm); color: var(--color-text-2); transition: border-color var(--dur) var(--ease), background var(--dur) var(--ease); }
.adm-prd-scope input { appearance: none; width: 16px; height: 16px; margin: 0; border: 1.5px solid var(--color-border-strong); border-radius: 50%; display: grid; place-content: center; flex: none; }
.adm-prd-scope input:checked { background: var(--color-primary); border-color: var(--color-primary); }
.adm-prd-scope input:checked::after { content: ""; width: 7px; height: 4px; border: 2px solid #fff; border-top: 0; border-right: 0; transform: translateY(-1px) rotate(-45deg); }
.adm-prd-scope:has(input:checked) { border-color: var(--color-primary); background: var(--color-primary-soft); color: var(--color-primary-text); }
.adm-prd-scope:has(input:focus-visible) { box-shadow: var(--ring); }
.adm-prd-mono-lg { font-size: var(--fs-lg); font-weight: var(--fw-semibold); letter-spacing: .06em; }
.adm-prd-dl { grid-template-columns: minmax(160px, max-content) 1fr; }
ul.adm-prd-changes { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 4px; list-style: disc; }
.adm-prd-resign { max-width: 420px; margin-top: 4px; }
.adm-prd-resign .progress__meta, .adm-prd-resign .progress__meta strong { color: inherit; }
.adm-prd-danger { border-color: var(--danger-200); }
[data-theme="dark"] .adm-prd-danger { border-color: color-mix(in srgb, var(--color-danger) 40%, transparent); }
.adm-prd-danger__body { display: flex; align-items: center; gap: var(--space-4); flex-wrap: wrap; }
.adm-prd-head .page-header__title { word-break: break-word; }
@media (max-width: 767px) {
  .adm-prd-head__actions { width: 100%; }
  .adm-prd-head__actions > * { flex: 1 1 auto; }
  .adm-prd-dl { grid-template-columns: 1fr; }
}
@media (min-width: 768px) and (max-width: 1279px) {
  .adm-tx-table .adm-btn-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .adm-tx-table .adm-txcontent { white-space: normal; word-break: break-word; }
}
@media (max-width: 767px) {
  .adm-range .input { min-width: 0; }
  .adm-filters > * { min-width: 0; max-width: 100%; }
  .adm-tx-table tr.adm-tx--attn td:first-child { box-shadow: none; }
  .adm-tx-table tr.adm-tx--attn { box-shadow: inset 3px 0 0 var(--color-danger); }
  .adm-drawer-foot { flex-wrap: wrap; }
  .adm-drawer-foot .grow { display: none; }
  .adm-drawer-foot .btn--danger-ghost { order: 3; flex-basis: 100%; }
  .adm-drawer-foot .btn--secondary, .adm-drawer-foot .btn--primary { flex: 1; }
}
.adm-cus-head { padding: var(--space-5) var(--space-6); display: flex; flex-direction: column; gap: var(--space-5); }
.adm-cus-head__main { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-4); }
.adm-cus-head__id { flex: 1 1 320px; min-width: 0; }
.adm-cus-head__name { font-size: var(--fs-2xl); line-height: var(--lh-2xl); font-weight: var(--fw-bold); letter-spacing: -0.02em; }
.adm-cus-head__line { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; font-size: var(--fs-sm); color: var(--color-text-2); }
.adm-cus-head__sep { color: var(--color-text-3); }
.adm-cus-head__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.adm-cus-stats { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--space-4); padding-top: var(--space-4); border-top: 1px solid var(--color-border); }
.adm-cus-stats > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.adm-cus-stats dt { font-size: var(--fs-xs); color: var(--color-text-3); }
.adm-cus-stats dd { font-size: var(--fs-lg); line-height: var(--lh-lg); font-weight: var(--fw-semibold); color: var(--color-text); }
.adm-cus-stats__sub { font-size: var(--fs-sm); font-weight: var(--fw-medium); }
@media (max-width: 1023px) { .adm-cus-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 639px) { .adm-cus-head { padding: var(--space-4); } .adm-cus-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } .adm-cus-head__actions { width: 100%; } }
.adm-cus-tip { position: relative; display: inline-flex; border-radius: var(--radius-sm); }
.adm-cus-tip::after { content: attr(data-tip); position: absolute; left: 50%; bottom: calc(100% + 8px); transform: translateX(-50%); z-index: var(--z-dropdown); width: max-content; max-width: 260px; padding: 6px 10px; border-radius: var(--radius-sm); background: #111827; color: #f3f4f6; font-size: var(--fs-xs); line-height: var(--lh-xs); font-weight: var(--fw-medium); box-shadow: var(--shadow-md); opacity: 0; pointer-events: none; transition: opacity var(--dur) var(--ease); }
.adm-cus-tip:hover::after, .adm-cus-tip:focus-visible::after { opacity: 1; }
.adm-cus-tip:focus-visible { outline: none; box-shadow: var(--ring); }
.adm-cus-info { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
@media (min-width: 1100px) { .adm-cus-info { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); align-items: start; } }
.adm-cus-normal { font-weight: var(--fw-regular); }
.adm-cus-auditnote { display: inline-flex; align-items: center; gap: 5px; }
.adm-cus-reveal { --btn-h: 26px; padding: 0 8px; }
.adm-cus-notes { display: flex; flex-direction: column; gap: var(--space-4); }
.adm-cus-note { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: var(--space-3); padding-top: var(--space-4); border-top: 1px solid var(--color-border); }
.adm-cus-note__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: var(--fs-xs); color: var(--color-text-3); }
.adm-cus-note__meta strong { font-size: var(--fs-sm); color: var(--color-text); }
.adm-cus-note__body { font-size: var(--fs-sm); color: var(--color-text-2); }
.adm-cus-note-input, .adm-cus-textarea-sm { min-height: 84px; }
.adm-cus-tool-off { filter: grayscale(1); opacity: .55; }
.adm-cus-mini { width: 22px; height: 22px; border-radius: 6px; }
.adm-cus-mini .icon { width: 12px; height: 12px; }
.adm-cus-tl-danger { background: var(--color-danger-soft); color: var(--color-danger-text); }
.adm-cus-lockalert { align-items: center; }
.adm-cus-form2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.adm-cus-fieldset { border: 0; margin: 0; padding: 0; }
.adm-cus-fieldset legend { padding: 0; margin-bottom: 6px; }
.adm-cus-days { width: 96px; }
.adm-cus-dl-sm { font-size: var(--fs-sm); padding: var(--space-4); border-radius: var(--radius-md); background: var(--color-surface-2); border: 1px solid var(--color-border); }
.adm-cus-preview { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-4); border-radius: var(--radius-md); border: 1px dashed var(--color-primary); background: var(--color-primary-soft); font-size: var(--fs-sm); }
.adm-cus-preview__row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); }
.adm-cus-preview__new { font-size: var(--fs-lg); color: var(--color-primary-text); }

/* admin-audit (tiền tố adm-) */
.adm-chain { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3) var(--space-5); padding: var(--space-4) var(--space-5); border-left: 3px solid var(--color-success); }
.adm-chain--broken { border-left-color: var(--color-danger); }
.adm-chain__main { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-4); }
.adm-chain__badge { height: 30px; padding: 0 12px; font-size: var(--fs-sm); }
.adm-chain__badge .icon { width: 16px; height: 16px; }
.adm-date, .adm-date-to { width: 130px; }
.adm-act { display: inline-block; font-family: var(--font-mono); font-size: 12px; line-height: 20px; padding: 1px 8px; border-radius: var(--radius-xs); border: 1px solid var(--color-border); background: var(--color-surface-2); color: var(--color-text); white-space: nowrap; }
.adm-act--danger { background: var(--color-danger-soft); color: var(--color-danger-text); border-color: transparent; }
.adm-act--warning { background: var(--color-warning-soft); color: var(--color-warning-text); border-color: transparent; }
.adm-act--info { background: var(--color-info-soft); color: var(--color-info-text); border-color: transparent; }
.adm-obj { color: var(--color-text); }
.adm-av--admin { background: linear-gradient(135deg, #f472b6, #9333ea); }
.adm-av--support { background: linear-gradient(135deg, #34d399, #0f766e); }
.adm-av--ctv { background: linear-gradient(135deg, #fbbf24, #c2410c); }
.adm-av--sys { background: var(--color-surface-2); color: var(--color-text-3); border: 1px solid var(--color-border); }
.adm-expand .icon { transition: transform var(--dur) var(--ease); }
.adm-audit-row.is-open td { background: var(--color-primary-soft); border-bottom-color: transparent; }
.adm-audit-detail td { background: var(--color-surface-2); padding: var(--space-4) var(--space-5) var(--space-5) !important; }
.adm-detail { display: flex; flex-direction: column; gap: var(--space-4); }
.adm-detail__diff { display: grid; gap: var(--space-4); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1280px) { .adm-detail__diff { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.adm-detail__label { font-size: var(--fs-xs); font-weight: var(--fw-semibold); text-transform: uppercase; letter-spacing: .04em; color: var(--color-text-3); }
.adm-detail__meta { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 6px var(--space-5); margin: 0; font-size: var(--fs-sm); }
.adm-detail__meta dt { color: var(--color-text-3); }
.adm-detail__meta dd { margin: 0; color: var(--color-text); min-width: 0; overflow-wrap: anywhere; }
.adm-detail__meta .mono { font-size: 12px; }
@media (max-width: 767px) {
  .adm-audit-detail td::before { display: none; }
  .adm-detail__meta { grid-template-columns: minmax(0, 1fr); }
  .adm-detail__meta dd { margin-bottom: var(--space-2); }
  .adm-date, .adm-date-to { width: 100%; }
  .adm-range .input-wrap { flex: 1; min-width: 0; }
}
.adm-audit-table .cell-main .stack { align-items: flex-start; }
.adm-range .adm-date { width: 150px; }
.adm-range .adm-date-to { width: 140px; }
@media (max-width: 767px) { .adm-range .adm-date, .adm-range .adm-date-to { width: 100%; } .adm-range .adm-date-to { flex: 1; min-width: 0; } }
/* admin-order-detail */
.adm-ord-head { align-items: flex-start; }
.adm-ord-head .page-header__title { font-size: var(--fs-xl); letter-spacing: 0; }
.adm-ord-head__actions { padding-top: 4px; }
.adm-ord-sum { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.adm-ord-sum__cell { display: flex; flex-direction: column; gap: 4px; padding: var(--space-4) var(--space-5); min-width: 0; }
.adm-ord-sum__cell + .adm-ord-sum__cell { border-left: 1px solid var(--color-border); }
.adm-ord-sum__label { font-size: var(--fs-xs); color: var(--color-text-3); font-weight: var(--fw-medium); }
.adm-ord-sum__value { font-size: var(--fs-2xl); line-height: var(--lh-2xl); font-weight: var(--fw-bold); color: var(--color-text); letter-spacing: -0.01em; }
.adm-ord-sum__value--sm { font-size: var(--fs-lg); line-height: var(--lh-2xl); font-weight: var(--fw-semibold); letter-spacing: 0; }
.adm-ord-refund { border-left: 3px solid var(--color-warning); }
.adm-ord-refund__dl { grid-template-columns: 140px 1fr; }
.adm-ord-ev { display: flex; justify-content: space-between; gap: var(--space-4); align-items: flex-start; padding-top: 5px; min-width: 0; }
.adm-ord-ev .timeline__meta { white-space: nowrap; padding-top: 2px; }
.adm-ord-ev--todo .timeline__title { color: var(--color-text-3); }
.adm-ord-ev--todo .timeline__icon { background: transparent; border: 1.5px dashed var(--color-border-strong); }
.adm-ord-ev-icon--danger { background: var(--color-danger-soft); color: var(--color-danger-text); }
.adm-ord-totals { display: flex; justify-content: flex-end; padding: var(--space-4) var(--space-5); border-top: 1px solid var(--color-border); }
.adm-ord-totals__dl { display: grid; grid-template-columns: auto auto; gap: 6px var(--space-8); font-size: var(--fs-sm); color: var(--color-text-2); }
.adm-ord-totals__dl dd { text-align: right; }
.adm-ord-totals__total { font-size: var(--fs-md); font-weight: var(--fw-semibold); color: var(--color-text); padding-top: 6px; border-top: 1px solid var(--color-border); }
.adm-ord-foot { justify-content: space-between; flex-wrap: wrap; }
.adm-ord-cust-card { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-5); }
.adm-ord-phone { display: inline-flex; align-items: center; gap: 6px; }
.adm-ord-cust-stats { display: flex; gap: var(--space-6); list-style: none; margin: 0; padding: 0; }
.adm-ord-cust-stats li { display: flex; flex-direction: column; gap: 2px; font-size: var(--fs-xs); color: var(--color-text-3); }
.adm-ord-cust-stats strong { font-size: var(--fs-lg); color: var(--color-text); }
.adm-ord-audit { display: flex; align-items: center; gap: 6px; padding: 0 var(--space-5) var(--space-4); }
.adm-ord-tx-amount { display: flex; align-items: center; gap: var(--space-3); padding-bottom: var(--space-4); margin-bottom: var(--space-4); border-bottom: 1px dashed var(--color-border); }
.adm-ord-tx-amount__v { font-size: var(--fs-xl); line-height: 1.2; }
.adm-ord-dl { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 10px var(--space-3); font-size: var(--fs-sm); }
.adm-ord-dl dt { color: var(--color-text-3); }
.adm-ord-dl dd { color: var(--color-text); min-width: 0; overflow-wrap: anywhere; }
.adm-ord-dl__copy { display: flex; align-items: center; gap: 4px; }
.adm-ord-icon-sm { width: 26px; height: 26px; }
.adm-ord-suggest__item { display: flex; flex-direction: column; gap: 6px; padding: var(--space-3); border: 1px solid var(--warning-200); background: var(--color-warning-soft); border-radius: var(--radius-md); }
.adm-ord-suggest__item .btn { margin-top: 6px; }
.adm-ord-suggest__content { color: var(--color-text); overflow-wrap: anywhere; }
.adm-ord-private { display: inline-flex; align-items: center; gap: 4px; }
.adm-ord-notes { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.adm-ord-note-item { padding: var(--space-3); border-radius: var(--radius-md); background: var(--color-surface-2); border: 1px solid var(--color-border); display: flex; flex-direction: column; gap: 4px; }
.adm-ord-note-input { min-height: 84px; }
.adm-ord-modal-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); }
.adm-ord-suffix-wrap .input { padding-right: 34px; }
.adm-ord-suffix { position: absolute; right: 12px; color: var(--color-text-3); pointer-events: none; }
.adm-ord-revoke { padding: var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius-md); }
.adm-ord-revoke__sub { display: block; margin-top: 2px; }
@media (max-width: 1023px) { .adm-ord-sum { grid-template-columns: repeat(2, minmax(0, 1fr)); } .adm-ord-sum__cell:nth-child(3) { border-left: 0; } .adm-ord-sum__cell:nth-child(n+3) { border-top: 1px solid var(--color-border); } }
@media (max-width: 767px) { .adm-ord-ev { flex-direction: column; gap: 2px; } .adm-ord-refund__dl { grid-template-columns: 1fr; gap: 2px; } .adm-ord-refund__dl dd { margin-bottom: 8px; } .adm-ord-sum__value { font-size: var(--fs-xl); } }
.adm-ord-lic .copy-field__value { font-size: 13px; letter-spacing: -0.01em; }
.adm-detail__meta .mono { word-break: break-all; }
@media (max-width: 767px) {
  .adm-audit-detail td { display: block; text-align: left; justify-content: flex-start; }
  .adm-audit-detail .adm-detail, .adm-audit-detail .code-block { text-align: left; width: 100%; min-width: 0; }
}
@media (min-width: 768px) { .adm-cus-devtable .td-primary { min-width: 230px; } .adm-cus-devtable .cell-main__title { white-space: nowrap; } }
.adm-ord-sans { font-family: var(--font-sans); }
.adm-ord-items td { white-space: nowrap; }
@media (max-width: 767px) { .adm-ord-items td { white-space: normal; } }
@media (min-width: 768px) { .adm-cus-devtable .cell-main__sub { white-space: nowrap; } }
@media (min-width: 768px) { .adm-cus-devtable td:not(:first-child):not(:last-child), .adm-cus-devtable th:not(:first-child):not(:last-child) { padding-left: 12px; padding-right: 12px; } }
/* admin-vouchers (tiền tố adm-vou-) */
.adm-vou-filter { width: auto; min-width: 150px; }
.adm-vou-sum { margin-left: auto; }
.adm-vou-code { color: var(--color-text); letter-spacing: .02em; }
.adm-vou-type { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; color: var(--color-text-2); }
.adm-vou-type .icon { color: var(--color-text-3); }
.adm-vou-table td { white-space: nowrap; }
.adm-vou-table td .cell-main__sub { white-space: normal; }
@media (min-width: 768px) and (max-width: 1365px) { .adm-vou-type__text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } .adm-vou-type .icon { width: 16px; height: 16px; } .adm-vou-btntext { display: none; } }
.adm-vou-usage { width: 124px; }
.adm-vou-usage .progress__track { height: 4px; }
.adm-vou-row--off .adm-vou-code, .adm-vou-row--off .adm-vou-val .fw-600 { color: var(--color-text-3); }
.adm-vou-codebox { display: flex; gap: var(--space-2); }
.adm-vou-codebox .input { flex: 1; min-width: 0; text-transform: uppercase; letter-spacing: .04em; }
.adm-vou-fieldset { border: 0; padding: 0; margin: 0; }
.adm-vou-fieldset legend { padding: 0; margin-bottom: 8px; }
.adm-vou-types { grid-template-columns: 1fr 1fr; }
.adm-vou-types .radio-card { padding: var(--space-3) var(--space-4); gap: 2px; }
.adm-vou-types .radio-card__mark { top: 14px; right: 14px; }
.adm-vou-rc-title { display: inline-flex; align-items: center; gap: 8px; font-size: var(--fs-md); }
.adm-vou-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); align-items: start; }
.adm-vou-suffix { position: relative; display: flex; align-items: center; }
.adm-vou-suffix .input { padding-right: 36px; }
.adm-vou-suffix__unit { position: absolute; right: 12px; color: var(--color-text-3); font-size: var(--fs-sm); pointer-events: none; }
.adm-vou-apply { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); padding: var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface-2); }
.adm-vou-disabled { opacity: .6; cursor: not-allowed; align-items: center; }
.adm-vou-switchfield .switch { min-height: 42px; }
@media (max-width: 767px) {
  .adm-vou-sum { display: none; }
  .adm-vou-filter { flex: 1 1 140px; }
  .adm-vou-table td { white-space: normal; }
}
@media (max-width: 479px) {
  .adm-vou-row, .adm-vou-apply, .adm-vou-types { grid-template-columns: 1fr; }
  .adm-vou-codebox { flex-wrap: wrap; }
  .adm-vou-codebox .btn { width: 100%; }
}
@media (min-width: 1366px) { .adm-vou-table .adm-vou-val .cell-main__sub { white-space: nowrap; } }
/* admin-admins (tiền tố adm-adm-) */
.adm-adm-filter { width: auto; min-width: 160px; }
.adm-adm-table td { white-space: nowrap; }
.adm-adm-table .adm-adm-when .text-xs { white-space: normal; }
.adm-adm-when { display: inline-flex; flex-direction: column; gap: 2px; align-items: flex-start; }
.adm-adm-scope { display: inline-flex; align-items: center; gap: 8px; color: var(--color-text-2); }
.adm-adm-2fa { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 2px; }
.adm-adm-danger { color: var(--color-danger-text); }
.adm-adm-danger:hover { background: var(--color-danger-soft); }
.adm-adm-table .icon-btn:disabled { opacity: .45; cursor: not-allowed; }
.adm-adm-row--warn td:first-child { box-shadow: inset 3px 0 0 var(--color-danger); }
.adm-adm-row--off td { color: var(--color-text-3); }
.adm-adm-row--off .text-strong { color: var(--color-text-3); }
.adm-adm-avatar--pending { background: var(--color-info-soft); color: var(--color-info-text); }
.adm-adm-avatar--off { background: var(--color-muted-soft); color: var(--color-muted-text); }
.adm-adm-fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.adm-adm-matrix-alert { padding: var(--space-4) var(--space-5) 0; }
.adm-adm-matrix-alert + .table-wrap { margin-top: var(--space-4); }
.adm-adm-matrix tbody th { position: static; text-transform: none; letter-spacing: 0; font-size: var(--fs-md); font-weight: var(--fw-regular); color: var(--color-text); background: transparent; padding: 10px var(--space-4) 10px var(--space-5); border-bottom: 1px solid var(--color-border); text-align: left; }
.adm-adm-matrix th:not(:first-child), .adm-adm-matrix td:not(:first-child) { width: 13%; }
.adm-adm-matrix tr.perm-matrix__group td { padding-top: 8px; padding-bottom: 8px; }
.adm-adm-colhead { display: inline-flex; flex-direction: column; align-items: center; gap: 2px; }
.adm-adm-colhead .text-3 { text-transform: none; letter-spacing: 0; font-weight: var(--fw-regular); }
.adm-adm-perm { display: flex; flex-direction: column; gap: 2px; }
.adm-adm-perm__name { display: inline-flex; align-items: center; gap: 8px; font-weight: var(--fw-medium); }
.adm-adm-sens { display: inline-flex; align-items: center; height: 18px; padding: 0 6px; border-radius: 5px; font-size: 10.5px; font-weight: var(--fw-semibold); background: var(--color-warning-soft); color: var(--color-warning-text); }
.adm-adm-cell { justify-content: center; }
.adm-adm-cell input { margin: 0; }
.adm-adm-cell input:disabled { cursor: not-allowed; opacity: .6; }
.adm-adm-savebar { position: sticky; bottom: 0; z-index: 2; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-3) var(--space-5); border-top: 1px solid var(--color-border); background: var(--color-surface-2); border-radius: 0 0 var(--radius-lg) var(--radius-lg); }
.adm-adm-savebar > span { display: inline-flex; align-items: center; gap: 6px; }
.adm-adm-skel { display: flex; align-items: center; gap: var(--space-6); padding: 16px var(--space-5); border-bottom: 1px solid var(--color-border); }
.adm-adm-tools { border: 0; margin: 0; padding: 0; min-width: 0; }
.adm-adm-tools legend { margin-bottom: 6px; padding: 0; }
.adm-adm-tools__list { display: flex; flex-direction: column; gap: 10px; padding: var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius-md); }
@media (max-width: 767px) {
  .adm-adm-table td { white-space: normal; }
  .adm-adm-when, .adm-adm-2fa { align-items: flex-end; }
  .adm-adm-skel > :nth-child(n+4) { display: none; }
  .adm-adm-matrix tbody th { padding-left: var(--space-4); min-width: 170px; }
}
.adm-adm-table th:not(:first-child):not(:last-child), .adm-adm-table td:not(:first-child):not(:last-child) { padding-left: 12px; padding-right: 12px; }
.adm-adm-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--chart-1); }
.adm-adm-dot:has(+ *), .adm-adm-dot { flex: none; }
.adm-adm-dot--cut { background: var(--chart-2); }

/* admin-licenses (adm-lic-) */
.adm-lic-alert { align-items: center; }
.adm-lic-alert__actions { display: flex; flex-wrap: wrap; gap: var(--space-2); flex: none; }
.adm-lic-key { display: inline-flex; align-items: center; gap: 2px; }
.adm-lic-key__value { color: var(--color-text); font-weight: var(--fw-medium); white-space: nowrap; }
.adm-lic-key__btn { --btn-h: 28px; color: var(--color-text-3); }
.adm-lic-cus { min-width: 0; }
.adm-lic-tool { width: 22px; height: 22px; border-radius: 6px; }
.adm-lic-tool .icon { width: 12px; height: 12px; }
.adm-lic-machines { flex-direction: row; align-items: center; gap: 8px; }
.adm-lic-machines .progress__track { width: 48px; flex: none; }
.adm-lic-table tbody tr.adm-lic-row--alert, .adm-lic-table tbody tr.adm-lic-row--alert:hover { background: var(--color-danger-soft); }
.adm-lic-table tbody tr.adm-lic-row--alert td:first-child { box-shadow: inset 3px 0 0 var(--color-danger); }
.adm-lic-subtitle { font-size: var(--fs-md); }
.adm-lic-log { border: 1px solid var(--color-border); border-radius: var(--radius-md); }
.adm-lic-log .table { font-size: var(--fs-sm); }
.adm-lic-log .table th:first-child, .adm-lic-log .table td:first-child { padding-left: var(--space-3); }
.adm-lic-devlist .svc-device { padding: var(--space-3); }
.adm-lic-suffix { max-width: 160px; letter-spacing: .12em; text-transform: uppercase; }
@media (min-width: 768px) {
  .adm-lic-table th, .adm-lic-table td { padding-left: 10px; padding-right: 10px; }
  .adm-lic-table .col-actions { position: sticky; right: 0; background: var(--color-surface); }
  .adm-lic-table th.col-actions { background: var(--color-surface-2); }
  .adm-lic-table tbody tr:hover .col-actions { background: var(--color-surface-hover); }
  .adm-lic-table tbody tr.adm-lic-row--alert .col-actions { background: var(--color-danger-soft); }
}
@media (max-width: 767px) { .adm-lic-alert { flex-wrap: wrap; } .adm-lic-alert__actions { width: 100%; } .table--stack.adm-lic-table .row-actions { flex-wrap: wrap; } }

.adm-adm-who { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.adm-adm-who__name { color: var(--color-text); }
.adm-adm-row--off .adm-adm-who__name .text-strong { color: var(--color-text-3); }
/* admin-affiliates (tiền tố adm-aff-) */
.adm-aff-filter { width: auto; min-width: 170px; }
.adm-aff-pending { margin-left: auto; }
.adm-aff-table td { white-space: nowrap; }
.adm-aff-table .cell-main__title .badge { margin-left: 6px; vertical-align: 1px; }
.adm-aff-stats { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; }
.adm-aff-stats > div { display: flex; flex-direction: column; gap: 2px; padding: var(--space-3) var(--space-4); }
.adm-aff-stats > div + div { border-left: 1px solid var(--color-border); }
.adm-aff-stats strong { font-size: var(--fs-lg); line-height: var(--lh-lg); color: var(--color-text); }
.adm-aff-stats strong.text-warning { color: var(--color-warning-text); }
.adm-aff-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: var(--space-4); }
.adm-aff-suffix { position: relative; display: flex; align-items: center; flex: 1; }
.adm-aff-suffix .input { padding-right: 36px; }
.adm-aff-suffix__unit { position: absolute; right: 12px; color: var(--color-text-3); font-size: var(--fs-sm); pointer-events: none; }
.adm-aff-com td { white-space: nowrap; }
.adm-aff-com .cell-main__sub { white-space: normal; }
.adm-aff-payto { display: flex; flex-direction: column; gap: 2px; padding: var(--space-3) var(--space-4); border-radius: var(--radius-md); background: var(--color-surface-2); border: 1px solid var(--color-border); color: var(--color-text); }
.adm-aff-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); align-items: start; }
@media (max-width: 767px) {
  .adm-aff-pending { margin-left: 0; }
  .adm-aff-filter { flex: 1 1 140px; }
  .adm-aff-table td, .adm-aff-com td { white-space: normal; }
  .adm-aff-grid { grid-template-columns: 1fr; }
  .adm-aff-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .adm-aff-stats > div { border-top: 1px solid var(--color-border); border-left: 0 !important; }
  .adm-aff-stats > div:nth-child(-n+2) { border-top: 0; }
  .adm-aff-stats > div:nth-child(even) { border-left: 1px solid var(--color-border) !important; }
  .drawer__footer > .grow { flex-basis: 100%; }
  .drawer__footer { flex-wrap: wrap; }
}
@media (max-width: 479px) { .adm-aff-row { grid-template-columns: 1fr; } }
.adm-lic-plan-sub { display: none; }
.adm-lic-toolname { white-space: nowrap; }
.adm-lic-email { display: block; max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.adm-lic-table td[data-label="Trạng thái"] { min-width: 112px; }
@media (min-width: 768px) and (max-width: 1399px) {
  .adm-lic-col-plan { display: none; }
  .adm-lic-plan-sub { display: inline; }
  .adm-lic-email { max-width: 150px; }
}
@media (max-width: 767px) { .adm-lic-email { max-width: 220px; } }
.adm-adm-cell { display: inline-flex; align-items: center; vertical-align: middle; }
.adm-adm-cell input { margin: 0 !important; }
.adm-adm-matrix tbody tr:last-child th { border-bottom: 0; }
.adm-lic-toolname { white-space: normal; }
.adm-lic-key__value { font-size: 13px; }
.adm-lic-email { max-width: 170px; }
@media (min-width: 768px) and (max-width: 1399px) {
  .adm-lic-btntext { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .adm-lic-table .row-actions > .btn:first-child { width: var(--btn-h); padding: 0; }
  .adm-lic-email { max-width: 140px; }
}
.adm-adm-fieldset:disabled .btn { opacity: .5; pointer-events: none; box-shadow: none; }
.adm-aff-stats, .drawer__body > .adm-aff-grid, .drawer__body > .card { flex: none; }
.adm-aff-of { display: block; }
.adm-aff-com td.col-num > span:first-child { display: block; }
@media (min-width: 768px) { .adm-aff-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); } }
@media (max-width: 767px) { .adm-adm-matrix-card .card__header .legend { display: none; } .adm-adm-savebar { position: static; } .adm-adm-savebar .cluster { width: 100%; justify-content: flex-end; } }
.adm-lic-email { max-width: 150px; }
@media (min-width: 768px) { .adm-lic-table th, .adm-lic-table td { padding-left: 8px; padding-right: 8px; } }
.adm-aff-of { white-space: nowrap; }
@media (max-width: 1365px) { .adm-aff-table .cell-main__sub { white-space: normal; word-break: break-all; } .adm-aff-table .td-primary { min-width: 200px; } }
.adm-lic-machines .progress__track, .adm-lic-machines .progress__bar { display: block; }
@media (max-width: 1365px) { .adm-aff-table .cell-main__title { white-space: normal; } .adm-aff-table .cell-main__title .badge { margin-left: 0; } }
.adm-lic-log td:nth-child(-n+2), .adm-lic-log td:last-child { white-space: nowrap; }
.adm-lic-key__btn { --btn-h: 24px; }
.adm-lic-machines .progress__track { width: 40px; }
@media (min-width: 768px) {
  .adm-lic-table tbody tr.adm-lic-row--alert .col-actions { background: linear-gradient(var(--color-danger-soft), var(--color-danger-soft)), var(--color-surface); }
  .adm-cus-table tbody tr.is-selected .col-actions { background: linear-gradient(var(--color-primary-soft), var(--color-primary-soft)), var(--color-surface); }
}
/* admin-settings (tiền tố adm-set-) */
.adm-set-layout { display: grid; grid-template-columns: 1fr; gap: var(--space-6); align-items: start; }
@media (min-width: 1024px) {
  .adm-set-layout { grid-template-columns: 220px minmax(0, 1fr); }
  .adm-set-nav.tabs { position: sticky; top: 88px; flex-direction: column; gap: 2px; border-bottom: 0; overflow: visible; }
  .adm-set-nav .tabs__tab { justify-content: flex-start; padding: 10px 12px; border-radius: var(--radius-md); color: var(--color-text-2); }
  .adm-set-nav .tabs__tab:hover { background: var(--color-surface-hover); color: var(--color-text); }
  .adm-set-nav .tabs__tab[aria-selected="true"] { background: var(--color-primary-soft); color: var(--color-primary-text); }
  .adm-set-nav .tabs__tab[aria-selected="true"]::after { display: none; }
}
.adm-set-nav .tabs__tab .badge, .adm-set-nav__dot { margin-left: auto; }
.adm-set-nav__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--color-danger); flex: none; }
.adm-set-panels { min-width: 0; }
.adm-set-row { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: var(--space-6); }
.adm-set-row + .adm-set-row { padding-top: var(--space-6); border-top: 1px solid var(--color-border); }
.adm-set-row__label { display: flex; flex-direction: column; gap: 2px; }
.adm-set-grid-2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: var(--space-4); }
.adm-set-logo { display: flex; align-items: center; gap: var(--space-4); }
.adm-set-logo__preview { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 14px; border: 1px dashed var(--color-border-strong); background: var(--color-surface-2); flex: none; }
.adm-set-logo__preview svg, .adm-set-logo__preview .logo__mark { width: 36px; height: 36px; }
.adm-set-upload { cursor: pointer; }
.adm-set-upload:focus-within { box-shadow: var(--ring); }
.adm-set-savebar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-3) var(--space-5); border-top: 1px solid var(--color-border); background: var(--color-surface-2); border-radius: 0 0 var(--radius-lg) var(--radius-lg); }
.adm-set-banks td { white-space: nowrap; }
.adm-set-bank { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; font-size: 12px; font-weight: var(--fw-bold); color: #fff; flex: none; }
.adm-set-bank--mb { background: #1e3a8a; }
.adm-set-bank--tp { background: #6d28d9; }
.adm-set-key { display: inline-flex; align-items: center; gap: 4px; }
.adm-set-icon-sm { width: 28px; height: 28px; }
.adm-set-radio { align-items: center; }
.adm-set-danger { color: var(--color-danger-text); }
.adm-set-danger:hover { background: var(--color-danger-soft); }
.adm-set-audit { display: flex; align-items: center; gap: 6px; padding: var(--space-3) var(--space-5); border-top: 1px solid var(--color-border); }
.adm-set-dl { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 8px var(--space-4); font-size: var(--fs-sm); }
.adm-set-dl dt { color: var(--color-text-3); }
.adm-set-dl dd { color: var(--color-text); }
.adm-set-tpl { display: grid; grid-template-columns: 240px minmax(0, 1fr); }
.adm-set-tpl__list { list-style: none; margin: 0; padding: var(--space-3); display: flex; flex-direction: column; gap: 2px; border-right: 1px solid var(--color-border); }
.adm-set-tpl__item { width: 100%; display: flex; flex-direction: column; align-items: flex-start; gap: 1px; padding: 8px 12px; border: 0; border-radius: var(--radius-md); background: transparent; color: var(--color-text-2); font-size: var(--fs-sm); text-align: left; cursor: pointer; }
.adm-set-tpl__item:hover { background: var(--color-surface-hover); color: var(--color-text); }
.adm-set-tpl__item[aria-current="true"] { background: var(--color-primary-soft); color: var(--color-primary-text); font-weight: var(--fw-medium); }
.adm-set-preview { display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-5); background: var(--color-surface-2); border-radius: 0 0 var(--radius-lg) 0; min-width: 0; }
.adm-set-preview__meta { display: flex; flex-direction: column; gap: 2px; }
.adm-set-mail { max-width: 520px; width: 100%; margin: 0 auto; background: #fff; color: #1f2937; border: 1px solid #e5e7eb; border-radius: 12px; overflow: hidden; box-shadow: var(--shadow-sm); font-size: 14px; line-height: 1.55; }
.adm-set-mail__head { display: flex; align-items: center; gap: 8px; padding: 14px 20px; border-bottom: 1px solid #eef0f4; color: #111827; }
.adm-set-mail__logo { display: inline-grid; width: 24px; height: 24px; }
.adm-set-mail__logo svg { width: 24px; height: 24px; }
.adm-set-mail__tld { color: #5b4cf5; }
.adm-set-mail__body { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 24px 28px; text-align: center; }
.adm-set-mail__check { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: #dcfce7; color: #15803d; }
.adm-set-mail__title { font-size: 20px; font-weight: 700; color: #111827; }
.adm-set-mail__box { width: 100%; display: grid; gap: 8px; padding: 14px 16px; border-radius: 10px; background: #f6f7fb; text-align: left; font-size: 13px; }
.adm-set-mail__box div { display: flex; justify-content: space-between; gap: 12px; }
.adm-set-mail__box span { color: #6b7280; }
.adm-set-mail__box strong { color: #111827; }
.adm-set-mail__btn { display: inline-block; padding: 10px 20px; border-radius: 8px; background: #5b4cf5; color: #fff; font-weight: 600; }
.adm-set-mail__small { font-size: 12px; color: #6b7280; }
.adm-set-mail__foot { padding: 12px 20px; border-top: 1px solid #eef0f4; font-size: 11px; color: #9ca3af; text-align: center; }
.adm-set-var { font-family: var(--font-mono); font-size: 11.5px; padding: 2px 6px; border-radius: 5px; background: var(--color-surface); border: 1px solid var(--color-border); color: var(--color-text-2); }
.adm-set-ip { height: 30px; }
.adm-set-ip-add { display: flex; gap: var(--space-2); }
.adm-set-ip-add .input { flex: 1; min-width: 0; }
.adm-set-switchrow { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding: var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-md); }
.adm-set-switchrow .switch input:disabled { opacity: .6; cursor: not-allowed; }
.adm-set-maint-opts { padding-top: 28px; }
.adm-set-close { margin-left: auto; }
.adm-set-fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.adm-set-fieldset legend { padding: 0; margin-bottom: 8px; }
@media (max-width: 1279px) { .adm-set-row { grid-template-columns: 1fr; gap: var(--space-3); } .adm-set-tpl { grid-template-columns: 200px minmax(0, 1fr); } }
@media (max-width: 767px) {
  .adm-set-tpl { grid-template-columns: 1fr; }
  .adm-set-tpl__list { flex-direction: row; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--color-border); }
  .adm-set-tpl__item { white-space: nowrap; }
  .adm-set-preview { padding: var(--space-4); border-radius: 0 0 var(--radius-lg) var(--radius-lg); }
  .adm-set-mail__body { padding: 20px 16px; }
  .adm-set-banks td { white-space: normal; }
  .adm-set-dl { grid-template-columns: 1fr; gap: 2px; }
  .adm-set-dl dd { margin-bottom: 8px; }
  .adm-set-maint-opts { padding-top: 0; }
}
.adm-set-banks th:not(:first-child):not(:last-child), .adm-set-banks td:not(:first-child):not(:last-child) { padding-left: 12px; padding-right: 12px; }
.adm-set-banks .adm-set-holder { white-space: nowrap; }
.adm-set-bank { width: 32px; height: 32px; border-radius: 9px; font-size: 11px; }
@media (min-width: 1024px) { .adm-set-layout { grid-template-columns: 200px minmax(0, 1fr); } }
@media (min-width: 768px) and (max-width: 1439px) { .adm-set-banks .adm-set-bank { display: none; } }
@media (min-width: 768px) { .adm-set-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 768px) and (max-width: 1439px) { .adm-ord-table td[data-label="Sản phẩm / Gói"], .adm-ord-table td[data-label="Voucher"] { white-space: normal; } .adm-ord-items td[data-label="Sản phẩm"] { white-space: normal; } }
@media (max-width: 767px) { .adm-ord-skel-head .skeleton { max-width: 100%; } }
@media (min-width: 768px) and (max-width: 1439px) {
  .adm-ord-table th:not(:first-child):not(:last-child), .adm-ord-table td:not(:first-child):not(:last-child) { padding-left: 9px; padding-right: 9px; }
  .adm-ord-table th:first-child, .adm-ord-table td:first-child { padding-left: 16px; }
  .adm-ord-table th:last-child, .adm-ord-table td:last-child { padding-right: 12px; }
}