/* ============================================================================
   LGCT portal theme "Gon 1 - Hoang Cung"  (v3)
   Nap SAU main.css / user.css / main-login.css.
   Toan bo quy tac deu bi khoa trong html.lgct-v3 -> khong bat thi giao dien cu
   giu nguyen 100%.
   Ngay: 2026-09-03
   ========================================================================== */

/* --- phan tu chrome moi cua v3: mac dinh an (inline style="display:none") --- */
html.lgct-v3 .lgv3            { display: flex !important; }
html.lgct-v3 .lgv3-block      { display: block !important; }

:root {
  --lg-gold:  #f3c95a;
  --lg-gold2: #c9932a;
  --lg-paper: #f6ead0;
  --lg-cream: #fff7e6;
  --lg-ink:   #3a2413;
  --lg-lac:   #8f1d14;
  --lg-wood1: #4a2314;
  --lg-wood2: #2c140c;
}

/* ==========================================================================
   1. KHUNG CHUNG
   ========================================================================== */
html.lgct-v3,
html.lgct-v3 body {
  height: 100%;
  font-family: "Be Vietnam Pro", system-ui, "Segoe UI", Roboto, sans-serif !important;
  color: var(--lg-ink) !important;
}

/* nen dat tren <html>: neu dat tren <body> thi body::before (z-index am)
   se bi chinh nen cua body che mat */
html.lgct-v3 { background: #1a0c07 !important; }

html.lgct-v3 body {
  background: none !important;
  background-color: transparent !important;
  font-size: 14px;
  line-height: 1.35;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
}

/* anh cung dien lam mo - dung body::before (WebView Android bo qua
   background-attachment: fixed) */
html.lgct-v3 body::before {
  content: "";
  position: fixed;
  inset: -24px;
  background: url(/assets/lgct/ui/palace_hall.jpg) center center / cover no-repeat;
  filter: blur(6px) brightness(.48);
  z-index: -2;
  pointer-events: none;
}
html.lgct-v3 body::after {
  content: "";
  position: fixed;
  inset: 0;
  background: linear-gradient(180deg, rgba(26,12,7,.35), rgba(26,12,7,.78));
  z-index: -1;
  pointer-events: none;
}

/* --- da dang nhap: khung dung yen, chi noi dung cuon --- */
html.lgct-v3 body.pagein {
  display: flex;
  flex-direction: column;
  height: 100vh;
  height: 100dvh;
  overflow: hidden !important; /* thang ca inline overflow:auto cua app.js */
  padding: 0;
}

html.lgct-v3 body.pagein > .topBarLogin,
html.lgct-v3 body.pagein > .footer-btngroup { display: none !important; }

/* muc tieu nap ngam cua SPAY: giu trong DOM nhung khong chiem cho */
html.lgct-v3 #index_content_hidden {
  position: fixed;
  left: -9999px;
  top: 0;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

html.lgct-v3 .maincontainer {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 0 !important;
  overscroll-behavior: contain;
}
/* chua cho nut tron "Mua goi" noi len khoi thanh day */
html.lgct-v3 .maincontainer > .container-fluid {
  padding: 10px 12px 36px !important;
  max-width: 100%;
}

/* thanh cuon manh kieu go */
html.lgct-v3 .maincontainer::-webkit-scrollbar { width: 6px; }
html.lgct-v3 .maincontainer::-webkit-scrollbar-thumb {
  background: rgba(201,147,42,.55); border-radius: 3px;
}
html.lgct-v3 .maincontainer::-webkit-scrollbar-track { background: transparent; }

/* ==========================================================================
   2. THANH TREN (doc)
   ========================================================================== */
html.lgct-v3 .lgv3-top {
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
  padding: 7px 12px 6px;
  background: linear-gradient(180deg, var(--lg-wood1), var(--lg-wood2));
  border-bottom: 2px solid var(--lg-gold2);
  position: relative;
  z-index: 30;
}
html.lgct-v3 .lgv3-top .lgv3-logo { height: 34px; width: auto; display: block; }

html.lgct-v3 .lgv3-bal {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border-radius: 999px;
  padding: 5px 11px;
  font-weight: 700;
  white-space: nowrap;
  font-size: 13px;
  background: rgba(0,0,0,.38);
  border: 1px solid rgba(243,201,90,.5);
  color: var(--lg-gold);
  text-decoration: none;
  cursor: pointer;
}
html.lgct-v3 .lgv3-bal small { opacity: .75; font-weight: 600; font-size: 10px; }

html.lgct-v3 .lgv3-gear {
  width: 34px; height: 34px;
  border-radius: 50%;
  background: rgba(0,0,0,.38);
  border: 1px solid rgba(243,201,90,.4);
  color: var(--lg-gold);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 15px;
  padding: 0;
  flex: none;
}

/* hop so du bung ra khi bam pill */
html.lgct-v3 .lgv3-baldrop {
  display: none !important;
  position: absolute;
  top: calc(100% + 6px);
  right: 52px;
  min-width: 208px;
  z-index: 40;
  background: linear-gradient(180deg, var(--lg-cream), var(--lg-paper));
  border: 1.5px solid #7a4a22;
  box-shadow: 0 0 0 2px #2a1108, 0 8px 22px rgba(0,0,0,.55);
  border-radius: 10px;
  padding: 8px;
}
html.lgct-v3 .lgv3-baldrop.open { display: block !important; }
html.lgct-v3 .lgv3-baldrop .r {
  display: flex; justify-content: space-between; gap: 10px;
  font-size: 12.5px; padding: 4px 4px;
  border-bottom: 1px dashed rgba(122,74,34,.28);
}
html.lgct-v3 .lgv3-baldrop .r:last-of-type { border-bottom: 0; }
html.lgct-v3 .lgv3-baldrop .r b { color: var(--lg-lac); font-weight: 800; }
html.lgct-v3 .lgv3-baldrop .r.ok b { color: #1f6b33; }
html.lgct-v3 .lgv3-baldrop .lgv3-btn { width: 100%; margin-top: 7px; padding: 9px; }

/* ==========================================================================
   3. DAI NGUOI DUNG
   ========================================================================== */
html.lgct-v3 .lgv3-user {
  flex: 0 0 auto;
  margin: 9px 12px 0;
  align-items: center;
  gap: 9px;
  padding: 7px 9px;
  border-radius: 12px;
  background: linear-gradient(180deg, var(--lg-cream), var(--lg-paper));
  border: 1.5px solid #7a4a22;
  box-shadow: 0 0 0 2px #2a1108, 0 0 0 3px #b98a3c;
}
html.lgct-v3 .lgv3-user .av {
  width: 40px; height: 40px; border-radius: 50%;
  overflow: hidden; border: 2px solid var(--lg-gold); flex: none;
  background: #2c140c;
}
html.lgct-v3 .lgv3-user .av img,
html.lgct-v3 .lgv3-user .av figure { width: 100%; height: 100%; object-fit: cover; margin: 0; }
html.lgct-v3 .lgv3-user .txt { min-width: 0; flex: 1 1 auto; }
html.lgct-v3 .lgv3-user .nm {
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 700; font-size: 15px; color: #5a1c0c;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
html.lgct-v3 .lgv3-user .sv {
  font-size: 11px; opacity: .8;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
html.lgct-v3 .lgv3-user .lgv3-vip {
  display: inline-block; padding: 0 6px; border-radius: 999px;
  background: linear-gradient(180deg, #f7d271, #c98d1f);
  color: #4a1d0a; font-size: 9.5px; font-weight: 800; margin-left: 4px;
  vertical-align: 1px;
}
html.lgct-v3 .lgv3-user .lgv3-btn { margin-left: auto; flex: none; }
html.lgct-v3 .lgv3-user .lgv3-mini { display: none; }

/* nut cam kieu "Vao Game" */
html.lgct-v3 .lgv3-btn {
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 11px; font-weight: 800; white-space: nowrap;
  padding: 9px 14px; font-size: 13px;
  background: linear-gradient(180deg, #ffb35c, #f0842a 55%, #d9631a);
  color: #5a1a05 !important;
  border: 1.5px solid #8a3b0d;
  box-shadow: inset 0 1px 0 #ffe0a8, 0 3px 8px rgba(0,0,0,.4);
  text-decoration: none;
}

/* bang quang cao tester (neu co) */
html.lgct-v3 body.pagein > .container-fluid { flex: 0 0 auto; margin: 8px 0 0 !important; padding: 0 12px !important; }
html.lgct-v3 body.pagein > .container-fluid a { font-size: 11.5px !important; padding: 7px 10px !important; }

/* ==========================================================================
   4. THANH DAY (doc)
   ========================================================================== */
html.lgct-v3 .lgv3-bnav {
  flex: 0 0 auto;
  align-items: center; justify-content: space-around;
  padding: 5px 4px 6px;
  background: linear-gradient(180deg, var(--lg-wood1), var(--lg-wood2));
  border-top: 2px solid var(--lg-gold2);
  color: #cbb188;
  position: relative;
  z-index: 20;
}
html.lgct-v3 .lgv3-bnav a,
html.lgct-v3 .lgv3-bnav button {
  display: flex; flex-direction: column; align-items: center; gap: 1px;
  font-size: 10.5px; font-weight: 700; flex: 1 1 0;
  color: #cbb188; text-decoration: none;
  background: none; border: 0; padding: 0;
}
html.lgct-v3 .lgv3-bnav .ico {
  font-size: 18px; line-height: 1.15;
  display: inline-grid; place-items: center; font-style: normal;
}
html.lgct-v3 .lgv3-bnav .lb,
html.lgct-v3 .lgv3-rail .lb {
  display: block; max-width: 100%;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  text-align: center; line-height: 1.2;
}
html.lgct-v3 .lgv3-bnav a.on { color: var(--lg-gold); }
html.lgct-v3 .lgv3-bnav .mid .ico {
  width: 46px; height: 46px; border-radius: 50%;
  margin-top: -20px; font-size: 20px;
  background: linear-gradient(180deg, #ffb35c, #f0842a 55%, #d9631a);
  color: #5a1a05; border: 2px solid #8a3b0d;
  box-shadow: 0 4px 10px rgba(0,0,0,.5);
}

/* ==========================================================================
   5. RAIL TRAI (ngang / desktop)
   ========================================================================== */
html.lgct-v3 .lgv3-rail {
  display: none !important;
  position: fixed; left: 0; top: 0; bottom: 0; width: 64px;
  flex-direction: column; align-items: center; gap: 12px;
  padding: 8px 0;
  background: linear-gradient(180deg, var(--lg-wood1), var(--lg-wood2));
  border-right: 2px solid var(--lg-gold2);
  color: #cbb188; font-size: 9.5px; font-weight: 700;
  z-index: 25;
}
html.lgct-v3 .lgv3-rail img { width: 42px; height: auto; display: block; margin-top: 2px; }
html.lgct-v3 .lgv3-rail a,
html.lgct-v3 .lgv3-rail button {
  display: flex; flex-direction: column; align-items: center; gap: 1px;
  color: #cbb188; text-decoration: none; background: none; border: 0; padding: 0;
  width: 100%;
}
html.lgct-v3 .lgv3-rail .ico { font-size: 17px; font-style: normal; }
html.lgct-v3 .lgv3-rail a.on { color: var(--lg-gold); }

/* ==========================================================================
   6. NGAN KEO PHAI (dung lai .stickymenu cua app.js)
   ========================================================================== */
html.lgct-v3 .stickymenu {
  width: 84% !important;
  max-width: 320px;
  right: -84%;
  z-index: 1052 !important;
  background: linear-gradient(180deg, #2c140c, #1a0c07) !important;
  border-left: 2px solid var(--lg-gold2);
  color: #f0dfb8 !important;
}
html.lgct-v3 .stickymenu.show { right: 0; }
html.lgct-v3 .stickymenu_bg { z-index: 1051 !important; background: rgba(10,5,2,.62) !important; }
html.lgct-v3 .stickymenu .logobar-m img { max-width: 132px; margin: 0 auto; }
html.lgct-v3 .stickymenu .btn-close {
  filter: invert(1) sepia(1) saturate(3) hue-rotate(5deg);
  opacity: .85;
}
html.lgct-v3 .stickymenu .nav-link {
  color: #f0dfb8 !important;
  font-size: 13.5px !important;
  padding: 9px 16px !important;
  border-bottom: 1px solid rgba(201,147,42,.18);
}
html.lgct-v3 .stickymenu .nav-link i { color: var(--lg-gold); width: 20px; text-align: center; }
html.lgct-v3 .stickymenu .dropdown-item { color: #f0dfb8 !important; font-size: 12.5px; }
html.lgct-v3 .stickymenu .dropdown-item:hover { background: rgba(243,201,90,.12); }
html.lgct-v3 .stickymenu .lgv3-drawer-head {
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  color: var(--lg-gold); font-size: 11px; letter-spacing: .06em;
  text-transform: uppercase; padding: 10px 16px 4px; opacity: .8;
}

/* ==========================================================================
   7. NOI DUNG: bo cac dai lap, dong khung giay do
   ========================================================================== */
html.lgct-v3 #index_content .userbar,
html.lgct-v3 #index_content .breadcrumbBar { display: none !important; }

html.lgct-v3 .form-bg-s1 {
  background: linear-gradient(180deg, var(--lg-cream), var(--lg-paper)) !important;
  border: 1.5px solid #7a4a22;
  box-shadow: 0 0 0 2px #2a1108, 0 0 0 3px #b98a3c !important;
  border-radius: 12px !important;
  padding: 12px 12px !important;
  margin-bottom: 12px !important;
  color: var(--lg-ink);
}
html.lgct-v3 .webbg-s1 {
  background: linear-gradient(180deg, var(--lg-cream), var(--lg-paper)) !important;
  border: 1.5px solid #7a4a22;
  border-radius: 10px !important;
  box-shadow: 0 0 0 2px #2a1108 !important;
}

/* tieu de trong khung */
html.lgct-v3 .lgv3-h {
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 700; color: #5a1c0c; font-size: 16px;
  margin-bottom: 8px;
}

/* thong bao */
html.lgct-v3 .alert {
  border-radius: 10px !important;
  font-size: 12.5px !important;
  padding: 8px 11px !important;
  margin-bottom: 10px !important;
  border: 1px solid var(--lg-gold2) !important;
}
html.lgct-v3 .alert-info {
  background: #fff3d6 !important; color: #6b4a1c !important; border-color: #e6c877 !important;
}
html.lgct-v3 .alert-success {
  background: linear-gradient(90deg, #7a1e10, #4e120a) !important;
  color: #ffe9b0 !important; border-color: var(--lg-gold2) !important;
}
html.lgct-v3 .alert-success b { color: var(--lg-gold) !important; }
html.lgct-v3 .alert-primary,
html.lgct-v3 .alert-secondary,
html.lgct-v3 .alert-light,
html.lgct-v3 .alert-dark {
  background: #fff3d6 !important; color: #6b4a1c !important; border-color: #e6c877 !important;
}
html.lgct-v3 .alert-warning { background: #fbe6c4 !important; color: #6b4a1c !important; }
html.lgct-v3 .alert-danger  { background: #f7dcd8 !important; color: #7a1e10 !important; border-color: #c8261c !important; }

/* form */
html.lgct-v3 .form-control,
html.lgct-v3 .form-select {
  background: #fffdf5 !important;
  border: 1.5px solid #b98a3c !important;
  border-radius: 9px !important;
  color: #3a2413 !important;
  font-size: 14px !important;
  padding: 10px 12px !important;
  box-shadow: none !important;
}
html.lgct-v3 .form-control::placeholder { color: #a08a63 !important; }
html.lgct-v3 .form-control:focus { border-color: var(--lg-gold2) !important; }
html.lgct-v3 .form-label,
html.lgct-v3 .col-form-label,
html.lgct-v3 .form-check-label { color: #5a3a1c !important; font-size: 13px !important; }
html.lgct-v3 .form-check-input:checked { background-color: #d9631a !important; border-color: #8a3b0d !important; }

/* nut */
html.lgct-v3 .btn-primary-s1,
html.lgct-v3 #index_content .btn-primary,
html.lgct-v3 .btn-danger,
html.lgct-v3 .btn-success {
  background: linear-gradient(180deg, #ffb35c, #f0842a 55%, #d9631a) !important;
  border: 1.5px solid #8a3b0d !important;
  color: #5a1a05 !important;
  font-weight: 800 !important;
  border-radius: 11px !important;
  box-shadow: inset 0 1px 0 #ffe0a8, 0 3px 8px rgba(0,0,0,.35) !important;
  top: 0 !important; left: 0 !important;
  text-transform: none !important;
  font-size: 15px !important;
  padding: 11px 16px !important;
}
html.lgct-v3 .btn-primary-s1 .iconarrowbtn-right { display: none !important; }
html.lgct-v3 .btn-info,
html.lgct-v3 .btn-warning {
  background: linear-gradient(180deg, #f7d271, #c98d1f) !important;
  border: 1px solid #a8761a !important;
  color: #4a1d0a !important;
  font-weight: 700 !important;
  border-radius: 9px !important;
  font-size: 12.5px !important;
}
html.lgct-v3 .btn.disabled,
html.lgct-v3 .btn:disabled {
  filter: grayscale(.75); opacity: .6 !important;
}
html.lgct-v3 .btn-link { color: #e6cfa0 !important; }
html.lgct-v3 .form-bg-s1 .btn-link,
html.lgct-v3 .boxlogin .btn-link,
html.lgct-v3 .modal .btn-link { color: #8a5a1c !important; }

/* ==========================================================================
   8. MUA GOI: chip tab + luoi the giay do
   ========================================================================== */
html.lgct-v3 #myshop {
  flex-wrap: nowrap !important;
  overflow-x: auto;
  overflow-y: hidden;
  justify-content: flex-start !important;
  scrollbar-width: none;
  gap: 6px;
  margin: 0 0 10px !important;
  padding: 2px 0 4px;
  position: sticky; top: -2px; z-index: 6;
  background: linear-gradient(180deg, var(--lg-cream) 82%, rgba(246,234,208,0));
}
html.lgct-v3 #myshop::-webkit-scrollbar { display: none; }
html.lgct-v3 #myshop .nav-item {
  background-color: transparent !important;
  margin: 0 !important;
  flex: none;
}
html.lgct-v3 #myshop .nav-link {
  padding: 6px 13px !important;
  border-radius: 999px !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  background: rgba(90,28,12,.10) !important;
  color: #6b4a1c !important;
  border: 1px solid rgba(201,147,42,.55) !important;
  white-space: nowrap;
}
html.lgct-v3 #myshop .nav-link.active {
  background: linear-gradient(180deg, #f7d271, #c98d1f) !important;
  color: #4a1d0a !important;
  border-color: #c98d1f !important;
}
html.lgct-v3 #myshop .nav-link .icon { display: none !important; }
html.lgct-v3 #myshop #more-tab {
  background: linear-gradient(180deg, #ffb35c, #d9631a) !important;
  color: #5a1a05 !important; border-color: #8a3b0d !important;
  display: flex; align-items: center; gap: 5px;
  padding: 6px 11px !important;
}
html.lgct-v3 #myshop #more-tab .icon { display: inline-flex !important; font-size: 12px !important; }
html.lgct-v3 #myshop #more-tab .icon center { display: inline; }
html.lgct-v3 #myshop #more-tab .title { font-size: 11px !important; }

html.lgct-v3 #myshopContent { padding: 0 !important; max-width: 820px; }
html.lgct-v3 #myshopContent .row {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
  margin: 0 !important;
}
html.lgct-v3 #myshopContent .col {
  width: auto !important; max-width: none !important; flex: none !important;
  padding: 0 !important; margin: 0 !important;
}
html.lgct-v3 #myshopContent .col.pb-3 { padding-bottom: 0 !important; }

/* --- the goi: bien khung beijing151 thanh the giay do --- */
html.lgct-v3 .my-lgct_package > a { width: 100%; text-decoration: none; }
html.lgct-v3 .my-lgct_package > a > div {
  min-width: 0 !important; width: 100%; position: static !important;
}
html.lgct-v3 .my-lgct_package > a > div > div,
html.lgct-v3 .my-gold_package > a > div > div,
html.lgct-v3 .my-vip_package > a > div > div {
  padding-top: 0 !important;
  background: linear-gradient(180deg, var(--lg-cream), var(--lg-paper)) !important;
  border: 1.5px solid #7a4a22;
  border-radius: 10px;
  box-shadow: 0 0 0 2px #2a1108, 0 0 0 3px #b98a3c;
  position: relative;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 1px;
  padding: 9px 7px 9px !important;
  text-align: center;
  overflow: hidden;
  min-height: 0;
}
html.lgct-v3 .my-gold_package > a > div > div {
  background: linear-gradient(180deg, #fff1c8, #f5dc9a) !important;
}
html.lgct-v3 .my-lgct_package .my-box {
  position: static !important;
  order: 1;
  width: 58px !important; height: 58px !important;
  left: auto !important; top: auto !important;
  background-size: contain !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  flex: none;
}
html.lgct-v3 .my-lgct_package .my-reward {
  position: static !important;
  order: 2;
  left: auto !important; top: auto !important; width: 100% !important;
  background: none !important;
  color: #5a1c0c !important;
  font-weight: 800; font-size: 13px !important; line-height: 1.2;
  padding: 2px 0 0;
  overflow: hidden; text-overflow: ellipsis;
}
html.lgct-v3 .my-lgct_package .my-price {
  position: static !important;
  order: 3;
  left: auto !important; bottom: auto !important; top: auto !important;
  width: auto !important;
  color: var(--lg-lac) !important;
  font-weight: 800 !important;
  font-size: 15px !important;
  line-height: 1.25;
}
html.lgct-v3 .my-lgct_package .my-price.text-decoration-line-through {
  color: #9a8461 !important;
  font-size: 11px !important;
  opacity: .8;
  order: 3;
}
html.lgct-v3 .my-lgct_package .my-price.text-decoration-line-through + .my-price { order: 4; }

/* nhan goc the */
html.lgct-v3 .giftPack,
html.lgct-v3 .limitPack,
html.lgct-v3 .limitPack2 {
  position: absolute !important;
  top: 5px !important; left: 5px !important;
  width: auto !important; height: auto !important;
  padding: 2px 7px !important;
  border-radius: 999px !important;
  background-image: none !important;
  font-size: 9.5px !important;
  font-weight: 800 !important;
  line-height: 1.25;
  border: 1px solid #ffd27a;
  z-index: 2;
}
html.lgct-v3 .giftPack  { background-color: #c8261c !important; color: #fff !important; }
html.lgct-v3 .limitPack { background-color: #c8261c !important; color: #fff !important; }
html.lgct-v3 .limitPack2{ background-color: #f39c12 !important; color: #3a1207 !important; }
html.lgct-v3 .giftPack::after  { content: "Nạp đầu"; }
html.lgct-v3 .limitPack::after { content: "1 lần"; }
html.lgct-v3 .limitPack2::after{ content: " lượt"; }

html.lgct-v3 .item-info {
  font-size: 10.5px !important;
  display: block; padding: 3px 2px 0; line-height: 1.2;
}

/* ==========================================================================
   9. TAM TRUOT (Bootstrap modal -> bottom sheet)
   ========================================================================== */
html.lgct-v3 .modal { padding: 0 !important; }
html.lgct-v3 .modal-dialog,
html.lgct-v3 .modal-dialog-centered {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  width: 100%; max-width: none !important;
  margin: 0 !important;
  min-height: 0 !important;
  align-items: flex-end !important;
  display: block !important;
}
html.lgct-v3 .modal.fade .modal-dialog { transform: translate(0, 100%); }
html.lgct-v3 .modal.show .modal-dialog { transform: none; }
html.lgct-v3 .modal-content {
  border: 0 !important;
  border-top: 3px solid var(--lg-gold2) !important;
  border-radius: 18px 18px 0 0 !important;
  background: linear-gradient(180deg, var(--lg-cream), var(--lg-paper)) !important;
  box-shadow: 0 -10px 30px rgba(0,0,0,.55) !important;
  padding-top: 9px;
  max-height: 92vh;
  max-height: 92dvh;
  overflow-y: auto;
}
html.lgct-v3 .modal-content::before {
  content: "";
  display: block; width: 44px; height: 5px; border-radius: 3px;
  background: #7a4a22; opacity: .45; margin: 0 auto 6px;
  flex: none;
}
html.lgct-v3 .modal-backdrop.show { opacity: .62; }
html.lgct-v3 .modal-footer { border-top: 0 !important; padding: 6px 14px 16px !important; }
html.lgct-v3 .modal-body { padding: 4px 14px 0 !important; }

/* the goi trong tam truot: to hon, nam ngang */
html.lgct-v3 .modal[id^="pack"] .modal-body .my-lgct_package > a > div > div {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  text-align: left;
  gap: 2px 12px;
  padding: 10px 12px !important;
}
html.lgct-v3 .modal[id^="pack"] .modal-body .my-lgct_package .my-box {
  width: 78px !important; height: 78px !important; flex: none;
}
html.lgct-v3 .modal[id^="pack"] .modal-body .my-lgct_package .my-reward {
  width: auto !important;
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-size: 17px !important;
  text-align: left;
  flex: 1 1 calc(100% - 96px);
  min-width: 0;
}
html.lgct-v3 .modal[id^="pack"] .modal-body .my-lgct_package .my-price {
  font-size: 20px !important;
  margin-left: 90px;
  flex: none;
}
html.lgct-v3 .modal[id^="pack"] .modal-body .my-lgct_package .my-price.text-decoration-line-through {
  font-size: 12.5px !important;
}
html.lgct-v3 .modal[id^="pack"] .modal-body .my-lgct_package .my-price.text-decoration-line-through + .my-price {
  margin-left: 0;
}

html.lgct-v3 .modal[id^="pack"] #paypack,
html.lgct-v3 .modal[id^="pack"] form { width: 100%; }
html.lgct-v3 .modal[id^="pack"] .modal-footer .btn {
  min-width: 0 !important;
  width: 100%;
  padding: 13px !important;
  font-size: 15px !important;
  border-width: 2px !important;
}
html.lgct-v3 .modal[id^="pack"] .modal-footer::after {
  content: "Bấm là trừ tiền ngay, không hỏi lại.";
  display: block; width: 100%;
  text-align: center;
  font-size: 11px; opacity: .72; margin-top: 8px;
  color: #6b4a1c;
}

/* ==========================================================================
   10. NAP TIEN
   ========================================================================== */
html.lgct-v3 .lgv3-pay-grid,
html.lgct-v3 #index_content .form-bg-s1 > .text-center:first-child {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}
html.lgct-v3 #index_content .form-bg-s1 > .text-center > a.btn {
  margin: 0 !important;
  background: linear-gradient(180deg, var(--lg-cream), #f2e2c2) !important;
  border: 1.5px solid #7a4a22 !important;
  box-shadow: 0 0 0 2px #2a1108 !important;
  border-radius: 12px !important;
  padding: 9px 6px !important;
  color: #5a3a1c !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
}
html.lgct-v3 #index_content .form-bg-s1 > .text-center > a.btn img {
  height: 46px !important; width: auto; object-fit: contain; margin-bottom: 2px;
}
html.lgct-v3 #index_content .form-bg-s1 > .text-center > a.btn hr { display: none !important; }
html.lgct-v3 #index_content .form-bg-s1 > .text-center > a.btn b { color: var(--lg-lac); }

html.lgct-v3 #form-check {
  background: #fff3d6; border: 1px solid #e6c877;
  border-radius: 9px; padding: 8px 10px; margin-top: 4px;
}

/* carousel banner VietQR thu nho */
html.lgct-v3 .swiper-container,
html.lgct-v3 .swiper { max-height: 150px; }
html.lgct-v3 .swiper-slide img { max-height: 150px; width: auto; margin: 0 auto; }

/* --- the "so tien" cua VietQR / cac cong the (my-dola / my-baht) --- */
html.lgct-v3 .my-money_package > a > div > div,
html.lgct-v3 .my-vnqr_package > a > div > div,
html.lgct-v3 .my-gbprimepay_package > a > div > div,
html.lgct-v3 .my-thaiqr_package > a > div > div,
html.lgct-v3 .my-gcashcard_package > a > div > div {
  padding-top: 0 !important;
  background: linear-gradient(180deg, #fff1c8, #f5dc9a) !important;
}
html.lgct-v3 .my-dola {
  position: static !important; order: 1;
  top: auto !important; left: auto !important; width: auto !important;
  color: var(--lg-lac) !important;
  font-size: 19px !important; font-weight: 800;
}
html.lgct-v3 .my-baht {
  position: static !important; order: 2;
  top: auto !important; left: auto !important; width: auto !important;
  color: #5a3a1c !important; font-size: 12px !important;
}

/* --- carousel banner VietQR --- */
html.lgct-v3 .carousel .carousel-item img { max-height: 132px; object-fit: cover; border-radius: 8px; }
html.lgct-v3 .carousel-control-prev, html.lgct-v3 .carousel-control-next { width: 34px; }

/* --- bang phu (lich su the cao...) --- */
html.lgct-v3 #index_content .table {
  font-size: 11.5px; color: #4a3520;
}
html.lgct-v3 #index_content .table th,
html.lgct-v3 #index_content .table td { padding: 4px 6px; }
html.lgct-v3 #index_content .table thead th {
  background: #7a4a22 !important; color: #ffe9b0 !important; border-color: #7a4a22 !important;
}

/* ==========================================================================
   11b. TRANG TIEN ICH (home.tpl ?tienich=1)
   ========================================================================== */
html.lgct-v3 .boxContainer {
  background: linear-gradient(180deg, var(--lg-cream), var(--lg-paper));
  border: 1.5px solid #7a4a22;
  box-shadow: 0 0 0 2px #2a1108, 0 0 0 3px #b98a3c;
  border-radius: 12px;
  padding: 12px 10px !important;
}
html.lgct-v3 .boxContainer .box { padding: 0 !important; }
html.lgct-v3 .boxContainer .row {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin: 0 !important;
  padding: 0 !important;
}
html.lgct-v3 .boxContainer .row > div {
  width: auto !important; max-width: none !important; flex: none !important;
  padding: 0 !important; margin: 0 !important;
}
html.lgct-v3 .my-menu-button { max-width: none !important; }
html.lgct-v3 .my-menu-button .icon-wrap {
  width: 52px !important; height: 52px !important;
  border: 2px solid var(--lg-gold2) !important;
  box-shadow: 0 2px 6px rgba(0,0,0,.35) !important;
}
html.lgct-v3 .my-menu-button .icon-wrap .icon { font-size: 24px !important; line-height: 52px !important; }
html.lgct-v3 .my-menu-button .icon-wrap i { font-size: 26px !important; line-height: 52px !important; }
html.lgct-v3 .my-menu-button + div a,
html.lgct-v3 .my-menu-button .text-center a {
  font-size: 11px !important; color: #5a1c0c !important; font-weight: 700;
  display: block; line-height: 1.2; margin-top: 3px;
}

/* ==========================================================================
   11. LICH SU GIAO DICH -> danh sach dong
   ========================================================================== */
html.lgct-v3 #my-logtrade-log table { width: 100%; border: 0 !important; }
/* bo van soc / vien cua Bootstrap table */
html.lgct-v3 #my-logtrade-log table > :not(caption) > * > *,
html.lgct-v3 #my-logtrade-log td,
html.lgct-v3 #my-logtrade-log th {
  background-color: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}
html.lgct-v3 #my-logtrade-log .table-responsive { overflow: visible; }
html.lgct-v3 #my-logtrade-log thead { display: none; }
html.lgct-v3 #my-logtrade-log table,
html.lgct-v3 #my-logtrade-log tbody,
html.lgct-v3 #my-logtrade-log tr,
html.lgct-v3 #my-logtrade-log td { display: block; border: 0 !important; }
html.lgct-v3 #my-logtrade-log tbody th { display: none; }
html.lgct-v3 #my-logtrade-log tr {
  display: flex; flex-wrap: wrap; align-items: baseline;
  background: #fffdf5 !important;
  border: 1px solid #e0cba0 !important;
  border-radius: 9px;
  padding: 7px 10px;
  margin-bottom: 7px;
  gap: 2px 8px;
}
html.lgct-v3 #my-logtrade-log td:nth-child(2) {
  order: 1; flex: 1 1 100%;
  font-size: 12.5px; font-weight: 600; color: #4a3520;
  line-height: 1.3;
}
html.lgct-v3 #my-logtrade-log td:nth-child(4) {
  order: 2; flex: 1 1 auto;
  font-size: 11px; opacity: .7; text-align: left !important;
}
html.lgct-v3 #my-logtrade-log td:nth-child(3) {
  order: 3; flex: none;
  font-size: 14.5px; font-weight: 800; text-align: right !important;
  margin-left: auto;
}
html.lgct-v3 #my-logtrade-log td.text-danger  { color: var(--lg-lac) !important; }
html.lgct-v3 #my-logtrade-log td.text-success { color: #1f6b33 !important; }
html.lgct-v3 #my-logtrade-log td:nth-child(5) { display: none !important; }

html.lgct-v3 .pagination { margin: 6px 0 0; }
html.lgct-v3 .page-link {
  background: linear-gradient(180deg, #f7d271, #c98d1f) !important;
  border: 1px solid #a8761a !important;
  color: #4a1d0a !important;
  border-radius: 8px !important;
  margin: 0 2px;
  font-size: 12px !important;
  padding: 5px 10px !important;
}
html.lgct-v3 .page-item.disabled .page-link { opacity: .45; }

/* ==========================================================================
   12. TAI KHOAN / cac form khac
   ========================================================================== */
html.lgct-v3 #index_content .form-group.row {
  border-bottom: 1px dashed rgba(122,74,34,.25);
  padding: 6px 0 !important; margin: 0 !important;
  align-items: center;
}
html.lgct-v3 #index_content .form-group.row:last-child { border-bottom: 0; }
html.lgct-v3 #index_content .form-group.row .btn-sm {
  width: auto !important; min-width: 92px; font-size: 11.5px !important;
  padding: 6px 8px !important;
}

/* ==========================================================================
   13. DANG NHAP / DANG KY (chua dang nhap)
   ========================================================================== */
html.lgct-v3:not(.pagein),
html.lgct-v3:not(.pagein) body {
  height: auto; min-height: 100%;
}
html.lgct-v3:not(.pagein) body {
  overflow-y: auto !important;
  overflow-x: hidden;
  min-height: 100vh;
  min-height: 100dvh;
}
html.lgct-v3:not(.pagein) .maincontainer { padding-bottom: 24px !important; overflow: visible; }
html.lgct-v3:not(.pagein) #index_content > .d-flex {
  padding-top: 16px !important; padding-bottom: 16px !important;
}
html.lgct-v3 .logologin img { max-width: 132px; margin: 0 auto 4px; }
html.lgct-v3 .boxlogin {
  background: linear-gradient(180deg, var(--lg-cream), var(--lg-paper)) !important;
  border: 1.5px solid #7a4a22 !important;
  box-shadow: 0 0 0 2px #2a1108, 0 0 0 3px #b98a3c !important;
  border-radius: 14px !important;
  padding: 20px 18px !important;
}
html.lgct-v3 .boxlogin-title h6 {
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  color: #5a1c0c !important;
  font-size: 20px !important;
}
html.lgct-v3 .boxlogin-title h6.font-weight-light {
  font-size: 12.5px !important; opacity: .8; font-family: inherit;
}
/* hop ghi chu dau trang dang ky (p-5 bg-light) */
html.lgct-v3 .boxlogin .bg-light,
html.lgct-v3 .form-bg-s1 .bg-light {
  background: #fff3d6 !important;
  border: 1px solid #e6c877;
  color: #6b4a1c !important;
  padding: 10px 12px !important;
  font-size: 12.5px !important;
  border-radius: 10px !important;
  margin-bottom: 10px !important;
}
html.lgct-v3 .boxlogin .form-control { text-align: center; border-radius: 999px !important; }
html.lgct-v3 .boxlogin .btn-primary {
  border-radius: 999px !important;
  width: 100%;
}
html.lgct-v3 .boxlogin .btn-link {
  border-radius: 999px !important;
  border: 1px solid rgba(122,74,34,.4) !important;
  background: rgba(255,255,255,.35) !important;
  padding: 10px !important; font-size: 14px !important;
}
html.lgct-v3 .boxlogin #btn-forget { border: 0 !important; background: none !important; padding: 0 !important; font-size: 12.5px !important; }
html.lgct-v3:not(.pagein) .fss-1,
html.lgct-v3:not(.pagein) .text-pink { color: #e6cfa0 !important; }
html.lgct-v3 .changelang .dropdown-toggle {
  background: rgba(0,0,0,.35) !important;
  border: 1px solid rgba(243,201,90,.45) !important;
  border-radius: 999px !important;
  color: var(--lg-gold) !important;
  padding: 4px 10px !important;
}
html.lgct-v3 .dropdown-menu {
  background: linear-gradient(180deg, var(--lg-cream), var(--lg-paper)) !important;
  border: 1.5px solid #7a4a22 !important;
  border-radius: 10px !important;
}
html.lgct-v3 .dropdown-item { color: #4a3520 !important; font-size: 13px !important; }

/* Khoi popup cu DA GO 04/09/2026.
   Ly do: no nham vao .swal2-html-container, ma thu vien tren may la SweetAlert2 ban 7.15.1
   — ban do KHONG CO lop ay (ban 7 dung .swal2-content). Da kiem: chuoi 'swal2-html-container'
   xuat hien 0 lan trong CSS cua thu vien. Nghia la dong do chua tung co tac dung ngay nao,
   nen phan chu trong than hop van la giao dien mac dinh cua thu vien.
   Thay bang khoi "Bang go" o cuoi tep (VA 9), nham DUNG ca hai ten lop. */

/* ==========================================================================
   14. NGANG (dien thoai xoay) + DESKTOP RONG
   ========================================================================== */
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 .lgv3-rail { display: flex !important; }
  html.lgct-v3 .lgv3-top,
  html.lgct-v3 .lgv3-bnav { display: none !important; }
  html.lgct-v3 body.pagein { padding-left: 64px; }
  html.lgct-v3 .lgv3-user { margin: 8px 12px 0; padding: 5px 9px; }
  html.lgct-v3 .lgv3-user .av { width: 34px; height: 34px; }
  html.lgct-v3 .lgv3-user .nm { font-size: 14px; }
  html.lgct-v3 .lgv3-user .lgv3-mini {
    display: block; margin-left: auto; text-align: right;
    font-size: 10.5px; line-height: 1.15; flex: none;
  }
  html.lgct-v3 .lgv3-user .lgv3-mini b { display: block; font-size: 14px; color: var(--lg-lac); }
  html.lgct-v3 .lgv3-user .lgv3-btn { margin-left: 10px; padding: 7px 12px; font-size: 12px; }
  html.lgct-v3 .maincontainer > .container-fluid { padding: 8px 12px 10px !important; }
  html.lgct-v3 #myshopContent .row { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  html.lgct-v3 .my-lgct_package > a > div > div {
    flex-direction: row; text-align: left; gap: 9px; padding: 6px 9px !important;
  }
  html.lgct-v3 .my-lgct_package .my-box { width: 46px !important; height: 46px !important; }
  html.lgct-v3 .my-lgct_package .my-reward { font-size: 12px !important; width: auto !important; flex: 1 1 auto; }
  html.lgct-v3 .my-lgct_package .my-price { font-size: 13.5px !important; }
  html.lgct-v3 #myshopContent .my-price.text-decoration-line-through { display: none !important; }
  html.lgct-v3 .giftPack, html.lgct-v3 .limitPack, html.lgct-v3 .limitPack2 {
    top: 3px !important; left: auto !important; right: 3px !important; font-size: 8.5px !important;
  }
  html.lgct-v3 #index_content .form-bg-s1 > .text-center:first-child { grid-template-columns: repeat(4, 1fr); }
  html.lgct-v3 .modal-content { max-height: 100dvh; }
  html.lgct-v3 .lgv3-baldrop { right: 12px; top: 8px; }

  /* trang dang nhap: nen gon trong 1 khung hinh ngang */
  html.lgct-v3:not(.pagein) #index_content > .d-flex { padding-top: 8px !important; padding-bottom: 8px !important; }
  html.lgct-v3:not(.pagein) .logologin img { max-width: 74px; }
  html.lgct-v3:not(.pagein) .boxlogin { padding: 12px 16px !important; max-width: 520px; margin: 0 auto; }
  html.lgct-v3:not(.pagein) .boxlogin-title { margin-bottom: .3rem !important; }
  html.lgct-v3:not(.pagein) .boxlogin-title h6 { font-size: 17px !important; }
  html.lgct-v3:not(.pagein) .boxlogin-title h6.font-weight-light { display: none; }
  html.lgct-v3:not(.pagein) .boxlogin .form-control { padding: 7px 12px !important; }
  html.lgct-v3:not(.pagein) .boxlogin .mb-3 { margin-bottom: .5rem !important; }
  html.lgct-v3:not(.pagein) .boxlogin .mb-5 { margin-bottom: .55rem !important; }
  html.lgct-v3:not(.pagein) .boxlogin .btn-primary,
  html.lgct-v3:not(.pagein) .boxlogin .btn-link:not(#btn-forget) { padding: 8px !important; font-size: 13.5px !important; }
}

@media (min-width: 900px) {
  html.lgct-v3 .lgv3-rail { display: flex !important; }
  html.lgct-v3 .lgv3-top,
  html.lgct-v3 .lgv3-bnav { display: none !important; }
  html.lgct-v3 body.pagein { padding-left: 64px; }
  html.lgct-v3 .lgv3-user { max-width: 1180px; margin: 12px auto 0; width: calc(100% - 32px); }
  html.lgct-v3 .maincontainer > .container-fluid { max-width: 1180px; margin: 0 auto; padding: 12px 16px 18px !important; }
  html.lgct-v3 #myshopContent { max-width: 1100px; }
  html.lgct-v3 #myshopContent .row { grid-template-columns: repeat(4, 1fr); gap: 12px; }
  html.lgct-v3 .my-lgct_package .my-box { width: 68px !important; height: 68px !important; }
  html.lgct-v3 .modal-dialog {
    /* Center without a negative margin: the portal may be a tall desktop iframe. */
    left: max(8px, var(--tvk-left)); right: max(8px, var(--tvk-right));
    transform: none; width: 560px; max-width: calc(100% - 16px) !important;
    margin-left: auto !important; margin-right: auto !important;
  }
  html.lgct-v3 .modal.fade .modal-dialog { transform: translate(0, 100%); }
  html.lgct-v3 .modal.show .modal-dialog { transform: none; }
  html.lgct-v3 .modal-content { border-radius: 18px 18px 0 0 !important; }
  html.lgct-v3 #index_content .form-bg-s1 > .text-center:first-child { grid-template-columns: repeat(4, 1fr); }
  html.lgct-v3:not(.pagein) .boxlogin { max-width: 460px; margin: 0 auto; }
}

/* man hinh rat thap (VD 390x320 khi ban phim bat) */
@media (max-height: 380px) {
  html.lgct-v3 .lgv3-user { display: none !important; }
}

/* ============================================================================
   VA 03/09/2026 — man NGANG cua 2 trang chua dang nhap (dang nhap / dang ky)
   Loi: o 844x390 trang dang nhap thua 81px, trang dang ky thua 111px -> phai keo truot,
        vi pham yeu cau "gon trong 1 khung hinh".
   Cach sua: khi xoay ngang, chuyen khung ngoai sang 2 cot (logo+ngon ngu+dong tai game
        ben trai, o nhap ben phai), bo cac khoang dem thua, an ghi chu fanpage.
   Da do tren web that: 844x390, 740x360, 667x375, 932x430 -> thua = 0 o ca 2 trang.
   ============================================================================ */
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3:not(.pagein) .maincontainer { padding-bottom: 0 !important; }
  html.lgct-v3:not(.pagein) .maincontainer > .container-fluid {
    padding-top: 3px !important; padding-bottom: 3px !important;
  }
  html.lgct-v3:not(.pagein) .maincontainer > .container-fluid > .d-flex.flex-column {
    display: grid !important;
    grid-template-columns: minmax(140px, 30%) 1fr;
    column-gap: 16px;
    align-content: center;
    justify-items: center;
    padding: 0 !important;
    min-height: calc(100vh - 6px);
    min-height: calc(100dvh - 6px);
  }
  html.lgct-v3:not(.pagein) .maincontainer > .container-fluid > .d-flex.flex-column > * {
    grid-column: 1; width: 100%;
  }
  html.lgct-v3:not(.pagein) .maincontainer > .container-fluid > .d-flex.flex-column > .container-s1 {
    grid-column: 2; grid-row: 1 / span 6; align-self: center; max-width: 100%;
  }
  html.lgct-v3:not(.pagein) .logologin img { max-width: 132px !important; }
  html.lgct-v3:not(.pagein) .maincontainer .mt-3.mb-4 { margin-top: 8px !important; margin-bottom: 0 !important; }
  html.lgct-v3:not(.pagein) .boxlogin { padding: 8px 12px !important; }
  html.lgct-v3:not(.pagein) .boxlogin .p-5.bg-light { display: none !important; }
  html.lgct-v3:not(.pagein) .boxlogin-title { margin-bottom: .25rem !important; }
  html.lgct-v3:not(.pagein) .boxlogin .mb-3 { margin-bottom: .35rem !important; }
  html.lgct-v3:not(.pagein) .boxlogin .form-text,
  html.lgct-v3:not(.pagein) .boxlogin small { margin-top: 1px !important; font-size: 11px !important; line-height: 1.25; }
}

/* ============================================================================
   VA 2 — 03/09/2026 (Fable 5.1), sau khi to kiem chung doc lap xac nhan 38 loi.
   Sua 5 nhom: (1) nut mua chong nut thanh day, (2) nut mua bam duoc luc dang bay,
   (3) canh bao tru tien hien duoi nut da tat, (4) khong thay so du o man ngang/rong,
   (5) 2 muc nav cung sang. Chi CSS, moi selector deu co pham vi html.lgct-v3.
   ============================================================================ */

/* --- (1) Nut xac nhan mua: tach khoi vung ngon cai cua thanh day + doi mau do dam ---
   Thanh day cao ~45px, nut tron giua nho len 20px => can chua >=70px. */
html.lgct-v3 .modal[id^="pack"] .modal-footer { padding-bottom: 84px !important; }
html.lgct-v3 .modal[id^="pack"] .modal-footer .btn,
html.lgct-v3 .modal[id^="pack"] .modal-footer .btn-danger {
  background: linear-gradient(180deg, #c0392b, #8f1d14 55%, #6d140d) !important;
  border: 2px solid #5a1008 !important;
  color: #ffe9c9 !important;
  box-shadow: inset 0 1px 0 rgba(255,220,180,.30), 0 3px 10px rgba(0,0,0,.45) !important;
}
/* man ngang / desktop khong co thanh day => khong can chua cho */
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 .modal[id^="pack"] .modal-footer { padding-bottom: 16px !important; }
}
@media (min-width: 900px) {
  html.lgct-v3 .modal[id^="pack"] .modal-footer { padding-bottom: 18px !important; }
}

/* --- (2) Khoa nut trong luc tam truot con dang bay (280ms) ---
   lgct-ui.js gan lop lgv3-armed khi tam truot da dung yen. */
html.lgct-v3 .modal[id^="pack"] .modal-footer .btn { pointer-events: none !important; }
html.lgct-v3 .modal[id^="pack"].lgv3-armed .modal-footer .btn { pointer-events: auto !important; }
html.lgct-v3 .modal[id^="pack"].lgv3-armed .modal-footer .btn.disabled,
html.lgct-v3 .modal[id^="pack"].lgv3-armed .modal-footer .btn[disabled] { pointer-events: none !important; }

/* --- (3) Dong canh bao: goi da tat thi doi chu, khong doa tru tien --- */
html.lgct-v3 .modal[id^="pack"] .modal-footer.lgv3-sold::after {
  content: "Gói này hiện không mua được.";
  color: #7a6748;
}

/* --- (4) Luon co cho xem Cash / Bac kha dung / Bac khoa ---
   lgct-ui.js chuyen #lgv3BalDrop ra thang body (vi .lgv3-top bi an o man ngang va >=900px). */
html.lgct-v3 .lgv3-baldrop.lgv3-floating {
  position: fixed !important;
  top: 56px; right: 12px; left: auto;
  z-index: 1200;
}
html.lgct-v3 .lgv3-user .lgv3-mini {
  cursor: pointer;
  padding: 2px 8px; border-radius: 9px;
  border: 1px solid rgba(122,74,34,.30);
  background: rgba(255,255,255,.45);
}
html.lgct-v3 .lgv3-user .lgv3-mini b::after {
  content: " \25BE"; font-size: 11px; opacity: .75;
}
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 .lgv3-baldrop.lgv3-floating { top: 54px; right: 14px; }
}
@media (min-width: 900px) {
  html.lgct-v3 .lgv3-user .lgv3-mini {
    display: block !important; margin-left: auto; text-align: right;
    font-size: 12px; line-height: 1.2; flex: none;
  }
  html.lgct-v3 .lgv3-user .lgv3-mini b { display: block; font-size: 16px; color: var(--lg-lac); }
  html.lgct-v3 .lgv3-user .lgv3-btn { margin-left: 12px; }
  html.lgct-v3 .lgv3-baldrop.lgv3-floating { top: 78px; right: 24px; }
}

/* ============================================================================
   VA 3 — 03/09/2026. Anh Trung bao 3 loi tren man hinh that:
   (1) bo bang "TUYEN TESTER" (xu ly o index.tpl)
   (2) man vua rong vua thap bi tran ngang, cot thu 4 bi cat
   (3) ten goi qua dai lam vo chu / vo the
   Nguyen nhan (2): o luoi dung "1fr" = minmax(auto,1fr), khong co lai duoi
   min-content, nen ten goi dai ep cot rong ra, tong vuot container roi bi
   overflow:hidden cat cut. Sua bang minmax(0,1fr) + min-width:0.
   ============================================================================ */

html.lgct-v3 #myshopContent .row { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 #myshopContent .row { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
@media (min-width: 900px) {
  html.lgct-v3 #myshopContent .row { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
}
html.lgct-v3 #myshopContent .col { min-width: 0 !important; max-width: 100% !important; }
html.lgct-v3 .my-lgct_package > a,
html.lgct-v3 .my-lgct_package > a > div,
html.lgct-v3 .my-lgct_package > a > div > div { min-width: 0 !important; max-width: 100% !important; }

/* ten goi dai: xuong dong duoc, toi da 2 dong, khong ep rong the */
html.lgct-v3 .my-lgct_package .my-reward {
  min-width: 0 !important;
  overflow-wrap: anywhere;
  word-break: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
html.lgct-v3 .my-lgct_package .my-price { min-width: 0 !important; white-space: nowrap; }

/* man vua rong vua thap: thu gon lai cho vua khung */
@media (min-width: 900px) and (max-height: 660px) {
  html.lgct-v3 .my-lgct_package > a > div > div { padding: 6px 7px !important; }
  html.lgct-v3 .my-lgct_package .my-box { width: 44px !important; height: 44px !important; }
  html.lgct-v3 .my-lgct_package .my-reward { font-size: 12px !important; }
  html.lgct-v3 .my-lgct_package .my-price { font-size: 13.5px !important; }
  html.lgct-v3 #myshopContent .row { gap: 8px !important; }
  html.lgct-v3 .lgv3-user { margin-top: 8px !important; padding: 5px 10px !important; }
  html.lgct-v3 .maincontainer > .container-fluid { padding: 8px 16px 12px !important; }
}

/* chan tran ngang tan goc */
html.lgct-v3 body.pagein { overflow-x: hidden !important; }

/* ============================================================================
   VA 4 — 03/09/2026: man CHON KHU kieu 3 (luoi o khu giong bang chon khu trong game).
   Phu len trang /chooserole. Khong dung PHP, khong dung luong tien:
   luoi chi DIEN GIA TRI vao 2 the <select> san co roi de form cu tu gui.
   ============================================================================ */
html.lgct-v3 .lgv3-cr{ display:flex; flex-direction:column; gap:9px; min-height:0; }
html.lgct-v3 .lgv3-cr-acc{
  display:flex; align-items:center; gap:9px; padding:7px 10px; border-radius:10px;
  background:linear-gradient(180deg,#5b2a18,#3b1d12); border:2px solid var(--lg-gold2); color:#ffe9b0;
}
html.lgct-v3 .lgv3-cr-acc b{ color:var(--lg-gold); }
html.lgct-v3 .lgv3-cr-acc .t{ flex:1; min-width:0; font-size:12px; line-height:1.25; }
html.lgct-v3 .lgv3-cr-acc .t i{ font-style:normal; opacity:.8; font-size:10.5px; display:block; }
html.lgct-v3 .lgv3-soc{ display:flex; gap:5px; flex-wrap:wrap; }
html.lgct-v3 .lgv3-soc span{
  font-size:10px; font-weight:800; padding:2px 7px; border-radius:999px;
  background:#f3ead6; color:#6b4a22; border:1px solid #ddcaa4; white-space:nowrap;
}
html.lgct-v3 .lgv3-soc span.on{ background:#dff0d8; color:#1f6b33; border-color:#b9dfae; }

html.lgct-v3 .lgv3-cr-tabs{ display:flex; gap:6px; }
html.lgct-v3 .lgv3-cr-tabs button{
  flex:1; padding:6px 0; border-radius:999px; font-size:11.5px; font-weight:800; cursor:pointer;
  background:rgba(255,255,255,.14); color:#e6cfa0; border:1px solid rgba(243,201,90,.35);
}
html.lgct-v3 .lgv3-cr-tabs button.on{
  background:linear-gradient(180deg,#f7d271,#c98d1f); color:#4a1d0a; border-color:#c98d1f;
}
html.lgct-v3 .lgv3-cr-grid{
  display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:7px;
  overflow:auto; min-height:0; padding:1px;
}
html.lgct-v3 .lgv3-sv{
  position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:2px; padding:8px 5px; min-height:64px; border-radius:9px; text-align:center; cursor:pointer;
  background:linear-gradient(180deg,var(--lg-cream),var(--lg-paper));
  border:1.5px solid #7a4a22; box-shadow:0 0 0 1px #2a1108;
}
html.lgct-v3 .lgv3-sv .n{ font-size:15px; font-weight:800; color:#5a1c0c; line-height:1; }
html.lgct-v3 .lgv3-sv .t{ font-size:9.5px; font-weight:700; line-height:1.1; color:#5a3a1c; }
html.lgct-v3 .lgv3-sv .c{ font-size:9px; font-weight:700; color:#1f6b33; line-height:1.1; }
html.lgct-v3 .lgv3-sv.on{
  background:linear-gradient(180deg,#fff1c8,#f5dc9a); border-color:#c98d1f;
  box-shadow:0 0 0 1px #2a1108, 0 0 0 3px rgba(243,201,90,.55);
}
html.lgct-v3 .lgv3-sv.no{ opacity:.32; border-style:dashed; box-shadow:none; cursor:not-allowed; }
html.lgct-v3 .lgv3-sv.no .c{ color:#a33; }
html.lgct-v3 .lgv3-sv .lk{ position:absolute; top:3px; right:5px; font-size:10px; opacity:.75; }
html.lgct-v3 .lgv3-sv .vip{
  position:absolute; top:3px; left:5px; font-size:8.5px; font-weight:800;
  background:linear-gradient(180deg,#f7d271,#c98d1f); color:#4a1d0a; border-radius:999px; padding:0 5px;
}
html.lgct-v3 .lgv3-cr-note{
  font-size:11px; color:#6b4a1c; background:#fdf1d4; border:1px solid #e0a91f;
  border-radius:9px; padding:6px 9px;
}
html.lgct-v3 .lgv3-cr-pick{
  display:none; align-items:center; gap:9px; padding:8px 10px; border-radius:10px;
  background:linear-gradient(180deg,var(--lg-cream),var(--lg-paper));
  border:1.5px solid #7a4a22; box-shadow:0 0 0 2px #2a1108, 0 0 0 3px #b98a3c;
}
html.lgct-v3 .lgv3-cr-pick.show{ display:flex; }
html.lgct-v3 .lgv3-cr-pick .who{ flex:1; min-width:0; font-size:12px; line-height:1.25; color:#5a1c0c; }
html.lgct-v3 .lgv3-cr-pick .who b{ font-size:14px; }
html.lgct-v3 .lgv3-subs{ display:flex; gap:6px; flex-wrap:wrap; }
html.lgct-v3 .lgv3-subs span{
  font-size:10.5px; font-weight:700; padding:3px 8px; border-radius:999px;
  background:rgba(255,255,255,.14); color:#e6cfa0; border:1px solid rgba(243,201,90,.3);
}
/* an form cu khi luoi da dung xong */
html.lgct-v3 .lgv3-cr-hide{ display:none !important; }
@media (orientation: landscape) and (max-height: 560px){
  html.lgct-v3 .lgv3-cr-grid{ grid-template-columns:repeat(5, minmax(0,1fr)); }
  html.lgct-v3 .lgv3-sv{ min-height:56px; padding:6px 4px; }
}
@media (min-width: 900px){
  html.lgct-v3 .lgv3-cr-grid{ grid-template-columns:repeat(5, minmax(0,1fr)); }
}

/* khu CO nhan vat nhung web chua biet ma nhan vat (cong game ban cu chua tra 'id') */
html.lgct-v3 .lgv3-sv.wait{
  background:linear-gradient(180deg,#fdf1d4,#f6e3b4); border-color:#e0a91f; border-style:dashed;
  box-shadow:0 0 0 1px #6b4a1c; opacity:1; cursor:pointer;
}
html.lgct-v3 .lgv3-sv.wait .c{ color:#8a5a10; }
html.lgct-v3 .lgv3-sv.wait .lk{ color:#c8261c; font-weight:800; }

/* ============================================================================
   VA 5 — 03/09/2026: gia goi bi cat cut o the nam ngang, va nut "Tro ve" tho.
   Nguyen nhan gia bi cat: trong the nam ngang, .my-price mac dinh la flex 0 1 auto
   nen NO bi co lai truoc, con .my-reward (ten goi) thi khong. Ket qua: "140,000d"
   bi xen mat duoi. Sua: cho GIA giu nguyen be rong, cho TEN co lai va cat bang dau ...
   ============================================================================ */
html.lgct-v3 .my-lgct_package .my-price { flex: 0 0 auto !important; }
html.lgct-v3 .my-lgct_package .my-price.text-decoration-line-through { flex: 0 0 auto !important; }
html.lgct-v3 .my-lgct_package .my-reward { flex: 1 1 auto !important; min-width: 0 !important; }
html.lgct-v3 .my-lgct_package > a > div > div { gap: 3px 8px !important; }
html.lgct-v3 .my-lgct_package .my-box { flex: 0 0 auto !important; }

/* nut "Tro ve" cua khung form: cho ra dang nut phu thay vi chu tran */
html.lgct-v3 #index_content a.btn-link {
  display: inline-flex; align-items: center; gap: 5px;
  color: var(--lg-gold) !important;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(243,201,90,.35);
  border-radius: 999px;
  padding: 6px 15px !important;
  font-size: 12.5px !important; font-weight: 700;
  text-decoration: none !important;
  margin-top: 6px;
}
html.lgct-v3 #index_content .d-flex > a.btn-link { margin-left: 0; }

/* ============================================================================
   VA 6 — 03/09/2026, SUA LAI 05/09/2026.
     Truoc: than chu Nunito, tieu de Baloo 2.
     Nay  : CA HAI deu la "Be Vietnam Pro", cho khop trang chu lgct.net.
     Ly do doi: Nunito va Baloo 2 la phong Latin, dau tieng Viet la phan them vao sau —
     o co chu nho thi dau chong len nhau. Be Vietnam Pro thiet ke rieng cho tieng Viet.
     Tieu de van noi bat nho font-weight (700/800), khong con nho phong khac nhau.
   Luu y: o nhap va nut bam KHONG tu ke thua phong cua body, phai chi dinh ro.
   Theme cu khong dung khoi nay (moi luat deu trong pham vi html.lgct-v3).
   ============================================================================ */
html.lgct-v3 input,
html.lgct-v3 select,
html.lgct-v3 textarea,
html.lgct-v3 button,
html.lgct-v3 .form-control,
html.lgct-v3 .form-select,
html.lgct-v3 .btn { font-family: inherit !important; }

/* Baloo 2 cho tieu de, so khu, so tien */
html.lgct-v3 h1, html.lgct-v3 h2, html.lgct-v3 h3,
html.lgct-v3 h4, html.lgct-v3 h5, html.lgct-v3 h6,
html.lgct-v3 .lgv3-bal,
html.lgct-v3 .lgv3-user .lgv3-mini b,
html.lgct-v3 .lgv3-sv .n,
html.lgct-v3 .lgv3-cr-acc b,
html.lgct-v3 .lgv3-cr-pick .who b,
html.lgct-v3 .lgv3-cr-tabs button,
html.lgct-v3 .my-lgct_package .my-price,
html.lgct-v3 .lgv3-baldrop .r b,
html.lgct-v3 .titlepage {
  font-family: "Be Vietnam Pro", system-ui, sans-serif !important;
  line-height: 1.18;
}
/* Baloo 2 cao hon Nunito mot chut, siet lai cho khoi doi khung */
html.lgct-v3 .lgv3-sv .n { line-height: 1 !important; }
html.lgct-v3 .lgv3-bal { line-height: 1.1; }


/* ============================================================================
   VA 7a — MAN CHON KENH NAP (giao dien moi). 04/09/2026.
   Ba kenh: The nap (da gop the cao + Zing), VietQR/VNPay, USDT.
   Moi bo chon deu bat dau bang html.lgct-v3 => giao dien cu khong bi anh huong.
   ========================================================================== */
html.lgct-v3 #index_content .lgv3-pick{
  display:flex; flex-direction:column; gap:8px; margin:2px 0 10px;
}
html.lgct-v3 #index_content .lgv3-pick-it{
  position:relative; display:flex; align-items:center; gap:10px;
  padding:9px 11px; text-decoration:none;
  background:linear-gradient(180deg,#fff7e6,#f6ead0);
  border:1.5px solid #7a4a22; border-radius:10px;
  box-shadow:0 0 0 2px #2a1108, 0 0 0 3px #b98a3c;
  color:#3a2413;
}
html.lgct-v3 #index_content .lgv3-pick-it:active{ transform:translateY(1px); }
html.lgct-v3 #index_content .lgv3-pick-hot{
  border-color:#8f1d14;
  box-shadow:0 0 0 2px #2a1108, 0 0 0 3px #e0a91f;
}
html.lgct-v3 #index_content .lgv3-pick-ic{
  flex:0 0 auto; width:46px; height:46px; display:flex; align-items:center; justify-content:center;
  background:#fffdf6; border:1px solid #c9a86a; border-radius:9px; overflow:hidden;
}
html.lgct-v3 #index_content .lgv3-pick-ic img{
  max-width:40px; max-height:40px; width:auto; height:auto; display:block;
}
html.lgct-v3 #index_content .lgv3-pick-tx{
  flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:1px;
}
html.lgct-v3 #index_content .lgv3-pick-tx b{
  font-family:"Be Vietnam Pro", system-ui, sans-serif; font-size:14.5px; font-weight:700;
  color:#5a1c0c; line-height:1.2;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
html.lgct-v3 #index_content .lgv3-pick-tx i{
  font-style:normal; font-size:11px; color:#7a6748; line-height:1.25;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
html.lgct-v3 #index_content .lgv3-pick-rt{
  flex:0 0 auto; text-align:right; font-size:11px; color:#7a6748; line-height:1.3;
}
html.lgct-v3 #index_content .lgv3-pick-rt b{
  display:block; font-family:"Be Vietnam Pro", system-ui, sans-serif;
  font-size:15px; font-weight:700; color:#8f1d14; line-height:1.15;
}
html.lgct-v3 #index_content .lgv3-pick-tag{
  position:absolute; top:-7px; right:8px;
  background:linear-gradient(180deg,#f7d271,#c98d1f); color:#4a1d0a;
  border:1px solid #8a5a12; border-radius:999px;
  font-family:"Be Vietnam Pro", system-ui, sans-serif; font-size:10.5px; font-weight:700;
  padding:0 7px; line-height:16px;
}

/* khung ngang cua dien thoai: xep 3 kenh thanh 3 cot cho lot mot man */
@media (orientation:landscape) and (max-height:560px){
  html.lgct-v3 #index_content .lgv3-pick{
    flex-direction:row; gap:6px;
  }
  html.lgct-v3 #index_content .lgv3-pick-it{
    flex:1 1 0; min-width:0; flex-direction:column; align-items:flex-start; gap:4px; padding:7px 8px;
  }
  html.lgct-v3 #index_content .lgv3-pick-ic{ width:34px; height:34px; }
  html.lgct-v3 #index_content .lgv3-pick-ic img{ max-width:28px; max-height:28px; }
  html.lgct-v3 #index_content .lgv3-pick-tx b{ font-size:13px; }
  html.lgct-v3 #index_content .lgv3-pick-tx i{ font-size:10px; }
  html.lgct-v3 #index_content .lgv3-pick-rt{ text-align:left; font-size:10px; }
  html.lgct-v3 #index_content .lgv3-pick-rt b{ font-size:13.5px; }
}
/* ============================================================================
   VA7 - 04/09/2026. Trang nap THE CAO + ZING gop lam mot (mobilecard_v3.tpl).
   Khoi nay duoc NOI vao cuoi assets/lgct-ui.css.
   Moi bo chon deu bat dau bang "html.lgct-v3" -> khong bat co v3 thi giao dien
   cu giu nguyen 100%. Moi ten lop deu bat dau bang "lgv3-card-".
   Bo cuc: doc = 1 cot; ngang / man rong = 3 cot (menh gia | nhap the | lich su).
   ========================================================================== */

/* --- khung giay: bot dem, an cai dem 36px duoi cua container-fluid --- */
html.lgct-v3 .lgv3-card-box {
  padding: 9px !important;
  margin-bottom: -28px !important;
}

/* --- thanh buoc 1-2-3 (nam NGOAI khung giay, tren nen toi) --- */
html.lgct-v3 .lgv3-card-steps {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 0 2px;
  margin: 0 0 7px;
}
html.lgct-v3 .lgv3-card-step {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11.5px;
  font-weight: 700;
  color: #cbb188;
  white-space: nowrap;
  line-height: 1.2;
}
html.lgct-v3 .lgv3-card-dot {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  font-style: normal;
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-size: 12px;
  line-height: 1;
  flex: none;
  background: rgba(255, 255, 255, .14);
  border: 1px solid rgba(243, 201, 90, .35);
  color: #e6cfa0;
}
html.lgct-v3 .lgv3-card-step-on { color: var(--lg-gold); }
html.lgct-v3 .lgv3-card-step-on .lgv3-card-dot {
  background: linear-gradient(180deg, #f7d271, #c98d1f);
  border-color: #c98d1f;
  color: #4a1d0a;
}
html.lgct-v3 .lgv3-card-step-done .lgv3-card-dot {
  background: #1f6b33;
  border-color: #1f6b33;
  color: #fff;
  font-size: 11px;
}
html.lgct-v3 .lgv3-card-stepline {
  flex: 1 1 auto;
  min-width: 8px;
  height: 1px;
  background: rgba(243, 201, 90, .35);
}

/* --- luoi cot --- */
html.lgct-v3 .lgv3-card-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
}
html.lgct-v3 .lgv3-card-col { min-width: 0; }
html.lgct-v3 .lgv3-card-fld { margin-bottom: 6px; }

/* --- nhan + goi y do dai --- */
html.lgct-v3 .lgv3-card-lb {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin: 0 0 3px !important;
  font-size: 12px !important;
  font-weight: 700;
  color: #5a3a1c !important;
  line-height: 1.2;
}
html.lgct-v3 .lgv3-card-lb small {
  font-size: 10.5px;
  font-weight: 600;
  color: #7a6748;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
html.lgct-v3 .lgv3-card-money {
  margin-left: auto;
  flex: none;
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 700;
  font-size: 14.5px;
  color: var(--lg-lac);
  white-space: nowrap;
}

/* --- o nhap gon lai (36px thay vi 42px) --- */
html.lgct-v3 .lgv3-card-box .form-control,
html.lgct-v3 .lgv3-card-box .form-select {
  padding: 7px 10px !important;
  font-size: 14px !important;
  border-radius: 9px !important;
}
/* hop tha loai the: tra lai mui ten (v3 dat background rut gon nen mat mui ten) */
html.lgct-v3 .lgv3-card-telco {
  padding-right: 30px !important;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2016%2016'%3E%3Cpath%20fill='none'%20stroke='%238a5a1c'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20d='M4%206l4%204%204-4'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 9px center !important;
  background-size: 15px 15px !important;
}

html.lgct-v3 .lgv3-card-inwrap { position: relative; }
html.lgct-v3 .lgv3-card-inwrap .form-control { padding-right: 46px !important; }
html.lgct-v3 .lgv3-card-cnt {
  position: absolute;
  right: 9px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 10.5px;
  color: #7a6748;
  white-space: nowrap;
  pointer-events: none;
}

/* --- menh gia: <select> THAT nam de len luoi nut, trong suot --- */
html.lgct-v3 .lgv3-card-amtbox { position: relative; }
html.lgct-v3 .lgv3-card-amtsel {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 0;
  pointer-events: none;
  background-image: none !important;
}
html.lgct-v3 .lgv3-card-amtgrid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}
html.lgct-v3 .lgv3-card-amtgrid[hidden] { display: none; }
html.lgct-v3 .lgv3-card-amt {
  -webkit-appearance: none;
  appearance: none;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 31px;
  min-width: 0;
  padding: 0 3px;
  border-radius: 9px;
  background: linear-gradient(180deg, var(--lg-cream), var(--lg-paper));
  border: 1.5px solid #7a4a22;
  box-shadow: 0 0 0 1px #2a1108;
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 700;
  font-size: 13px;
  line-height: 1;
  color: #5a1c0c;
  white-space: nowrap;
  overflow: hidden;
}
html.lgct-v3 .lgv3-card-amt-on {
  background: linear-gradient(180deg, #f7d271, #c98d1f);
  border-color: #a8761a;
  color: #4a1d0a;
  box-shadow: 0 0 0 1px #2a1108, 0 0 0 3px rgba(243, 201, 90, .55);
}
/* may chu bao loi menh gia -> vien do quanh luoi nut */
html.lgct-v3 .lgv3-card-amtsel.is-invalid ~ .lgv3-card-amtgrid {
  outline: 2px solid #c8261c;
  outline-offset: 2px;
  border-radius: 10px;
}

/* --- ma bao ve (do {call ui_form_captcha1} sinh ra) --- */
html.lgct-v3 .lgv3-card-cap { margin-bottom: 7px; }
html.lgct-v3 .lgv3-card-cap .form-label { margin-bottom: 3px !important; font-size: 12px !important; }
html.lgct-v3 .lgv3-card-cap .mb-3 { margin-bottom: 0 !important; }
html.lgct-v3 .lgv3-card-cap .form-control.inputleft { padding-right: 104px !important; }
html.lgct-v3 .lgv3-card-cap .btn-inputright { right: 6px !important; }
html.lgct-v3 .lgv3-card-cap .captcha_img {
  height: 28px !important;
  width: auto !important;
  max-width: 92px;
  padding: 0 !important;
  margin: 0 !important;
  border: 1px solid #d9c9a3;
  border-radius: 6px;
  background: #ece4cf;
  display: block;
}

/* --- nut nap + nut mua the Zing --- */
html.lgct-v3 .lgv3-card-go { margin-top: 6px; }
html.lgct-v3 .lgv3-card-go .btn-primary-s1 {
  padding: 9px 12px !important;
  font-size: 14.5px !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
}
html.lgct-v3 .lgv3-card-btnamt { white-space: nowrap; }
html.lgct-v3 .lgv3-card-zingbuy {
  padding: 7px 10px !important;
  font-size: 12.5px !important;
  line-height: 1.2 !important;
}
html.lgct-v3 .lgv3-card-zingbuy[hidden] { display: none !important; }

html.lgct-v3 .lgv3-card-note {
  margin-top: 6px;
  font-size: 10.5px;
  line-height: 1.25;
  color: #7a6748;
  text-align: center;
}

/* --- 5 the gan day --- */
html.lgct-v3 .lgv3-card-hist {
  margin-top: 6px;
  padding: 5px 8px 3px;
  border-radius: 10px;
  background: #fffdf5;
  border: 1px solid #e0cba0;
}
html.lgct-v3 .lgv3-card-histhd {
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 700;
  font-size: 13.5px;
  line-height: 1.25;
  color: #5a1c0c;
  margin-bottom: 2px;
}
html.lgct-v3 .lgv3-card-hl {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0 7px;
  padding: 3px 0;
  border-bottom: 1px dashed rgba(122, 74, 34, .25);
}
html.lgct-v3 .lgv3-card-hl:last-child { border-bottom: 0; }
html.lgct-v3 .lgv3-card-hl-d {
  font-size: 10px;
  line-height: 1.15;
  color: #7a6748;
  white-space: nowrap;
}
html.lgct-v3 .lgv3-card-hl-dd { margin-left: 3px; }
html.lgct-v3 .lgv3-card-hl-t {
  font-size: 10.5px;
  font-weight: 700;
  color: var(--lg-ink);
  white-space: nowrap;
}
html.lgct-v3 .lgv3-card-hl-s {
  min-width: 0;
  font-size: 10px;
  color: #7a6748;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* loi tra ve co the rat dai -> chan o 2 dong, khong cho lam vo khung */
html.lgct-v3 .lgv3-card-bd {
  justify-self: end;
  max-width: 100px;
  padding: 1px 6px;
  border-radius: 999px;
  font-size: 9.5px;
  font-weight: 800;
  line-height: 1.15;
  text-align: center;
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: break-word;
}
html.lgct-v3 .lgv3-card-bd-ok { background: #dff0d8; color: #1f6b33; border: 1px solid #b9dfae; }
html.lgct-v3 .lgv3-card-bd-wait { background: #fdf1d4; color: #8a5a10 !important; border: 1px solid #e0a91f; }
html.lgct-v3 .lgv3-card-bd-err { background: #f7dcd8; color: #7a1e10; border: 1px solid #c8261c; }
html.lgct-v3 .lgv3-card-empty {
  padding: 8px 0 10px;
  font-size: 11px;
  color: #7a6748;
  text-align: center;
}

/* ==========================================================================
   NGANG (dien thoai xoay) - cung nguong voi phan con lai cua lgct-ui.css
   ========================================================================== */
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 .lgv3-card-box { padding: 8px !important; margin-bottom: -10px !important; }
  html.lgct-v3 .lgv3-card-steps { margin-bottom: 6px; }
  html.lgct-v3 .lgv3-card-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0 12px;
  }
  html.lgct-v3 .lgv3-card-amtgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  html.lgct-v3 .lgv3-card-cap .form-control.inputleft { padding-right: 96px !important; }
  html.lgct-v3 .lgv3-card-hist { margin-top: 0; }

  /* lich su 2 dong cho vua cot hep */
  html.lgct-v3 .lgv3-card-hl {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0 6px;
    padding: 3px 0;
  }
  html.lgct-v3 .lgv3-card-hl-d { grid-column: 1; grid-row: 1 / span 2; }
  html.lgct-v3 .lgv3-card-hl-dd { display: block; margin-left: 0; }
  html.lgct-v3 .lgv3-card-hl-t { grid-column: 2; grid-row: 1; }
  html.lgct-v3 .lgv3-card-hl-s { grid-column: 2; grid-row: 2; }
  html.lgct-v3 .lgv3-card-bd { grid-column: 3; grid-row: 1 / span 2; max-width: 84px; }
}

/* ==========================================================================
   MAN RONG (may tinh) - dung lai bo cuc 3 cot
   ========================================================================== */
@media (min-width: 900px) {
  html.lgct-v3 .lgv3-card-box { margin-bottom: 0 !important; padding: 12px !important; }
  html.lgct-v3 .lgv3-card-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0 16px;
  }
  html.lgct-v3 .lgv3-card-hist { margin-top: 0; }
  html.lgct-v3 .lgv3-card-step { font-size: 12.5px; }
}
/* ============================================================================
   VA 7 - 04/09/2026 - Nap USDT theo phuong an 1 "Lo trinh 3 buoc".
   Noi khoi nay vao CUOI assets/lgct-ui.css.

   HTML tuong ung do sync-usdt.php sinh ra (nhanh cookie lgct_ui=v3) roi
   recharge.tpl nhet vao .modal-content#contentusdt bang innerHTML, cho nen moi
   thu o day phai song duoc BEN TRONG khung modal cua Bootstrap: khong dat lai
   nen trang, khong dung position:fixed, khong dung chieu cao 100vh.

   Moi bo chon deu bat dau bang html.lgct-v3 -> khong bat cookie thi giao dien
   cu giu nguyen 100%. Moi ten lop deu bat dau bang lgv3-usdt-.
   Man ngang dung @media (orientation:landscape) and (max-height:560px),
   dung y het cac khoi ngang co san trong lgct-ui.css.

   Vong dem nguoc: khong dung JS. SVG ve san 2 vong tron, vong ngoai chay
   keyframes lgv3-usdt-drain trong 1800s (30 phut) dung mot lan; PHP truyen
   animation-delay AM bang so giay da troi nen mo modal giua chung van dung cho.
   Chu so trong vong la #countdown - do startTimer() cua recharge.tpl ghi.
   ============================================================================ */

/* --- khoi tuong thich: #progressusdt phai con trong DOM vi startTimer() ghi
       vao no moi giay; an o THE CHA vi startTimer ghi de class cua chinh no --- */
html.lgct-v3 .lgv3-usdt-compat { display: none !important; }

/* --- dau trang cua tam truot --- */
html.lgct-v3 #infousdt .modal-content { padding-bottom: 0; }
html.lgct-v3 .lgv3-usdt-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 2px 14px 8px !important;
  border-bottom: 0 !important;
}
html.lgct-v3 .lgv3-usdt-ttl {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1 1 auto;
  min-width: 0;
}
html.lgct-v3 .lgv3-usdt-head .modal-title {
  font-family: "Be Vietnam Pro", system-ui, sans-serif !important;
  font-weight: 700;
  font-size: 17px;
  line-height: 1.2;
  color: #5a1c0c;
  margin: 0;
}
html.lgct-v3 .lgv3-usdt-net {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 9px;
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 800;
  white-space: nowrap;
  background: linear-gradient(180deg, #4bd1a2, #1f9c6b);
  color: #fff;
  border: 1.5px solid #146b49;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .3);
}
html.lgct-v3 .lgv3-usdt-head .btn-close { flex: none; opacity: .6; }

/* --- than --- */
html.lgct-v3 .lgv3-usdt-wrap {
  display: flex;
  flex-direction: column;
  gap: 9px;
  padding: 0 14px;
  color: var(--lg-ink);
}

/* --- thanh 3 buoc --- */
html.lgct-v3 .lgv3-usdt-steps {
  list-style: none;
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0 2px;
}
html.lgct-v3 .lgv3-usdt-steps li {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1 1 auto; /* moi buoc no theo do dai chu, phan thua roi vao vach noi ::after */
  min-width: 0;
  font-size: 11.5px;
  font-weight: 700;
  color: #8a7758;
  white-space: nowrap;
}
html.lgct-v3 .lgv3-usdt-steps li b {
  width: 23px;
  height: 23px;
  border-radius: 50%;
  flex: none;
  display: inline-grid;
  place-items: center;
  font-size: 12px;
  font-weight: 800;
  color: #8a7758;
  background: rgba(122, 74, 34, .12);
  border: 1.5px solid rgba(122, 74, 34, .32);
}
html.lgct-v3 .lgv3-usdt-steps li::after {
  content: "";
  flex: 1 1 auto;
  min-width: 8px;
  height: 2px;
  margin: 0 7px;
  background: rgba(122, 74, 34, .22);
}
/* buoc cuoi khong co vach noi -> dung cho no, keo phan thua ve 2 vach truoc */
html.lgct-v3 .lgv3-usdt-steps li:last-child { flex: 0 1 auto; }
html.lgct-v3 .lgv3-usdt-steps li:last-child::after { display: none; }
html.lgct-v3 .lgv3-usdt-steps li.lgv3-usdt-done { color: #5a3a1c; }
html.lgct-v3 .lgv3-usdt-steps li.lgv3-usdt-done b {
  background: linear-gradient(180deg, #f7d271, #c98d1f);
  border-color: #8a5a1c;
  color: #4a1d0a;
}
html.lgct-v3 .lgv3-usdt-steps li.lgv3-usdt-done::after { background: var(--lg-gold2); }
html.lgct-v3 .lgv3-usdt-steps li.lgv3-usdt-now { color: var(--lg-lac); }
html.lgct-v3 .lgv3-usdt-steps li.lgv3-usdt-now b {
  background: linear-gradient(180deg, #ffb35c, #f0842a 55%, #d9631a);
  border-color: #8a3b0d;
  color: #5a1a05;
  box-shadow: 0 0 0 3px rgba(243, 201, 90, .35);
}

/* --- 2 cot: doc thi xep chong, ngang thi canh nhau --- */
html.lgct-v3 .lgv3-usdt-cols {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
}
html.lgct-v3 .lgv3-usdt-cq,
html.lgct-v3 .lgv3-usdt-ci {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}

/* --- vong dem nguoc om quanh ma QR --- */
html.lgct-v3 .lgv3-usdt-ring {
  position: relative;
  width: 196px;
  height: 196px;
  flex: none;
  margin: 2px auto 12px;
}
html.lgct-v3 .lgv3-usdt-rg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  overflow: visible;
}
html.lgct-v3 .lgv3-usdt-rg .lgv3-usdt-bg {
  fill: none;
  stroke: rgba(42, 17, 8, .15);
  stroke-width: 9;
}
/* chu vi vong tron r=94.5 la 2*pi*94.5 = 593.76 -> dat lam do dai net */
html.lgct-v3 .lgv3-usdt-rg .lgv3-usdt-arc {
  fill: none;
  stroke: var(--lg-gold2);
  stroke-width: 9;
  stroke-linecap: round;
  stroke-dasharray: 593.76;
  stroke-dashoffset: 0;
  animation: lgv3-usdt-drain 1800s linear forwards,
             lgv3-usdt-hue   1800s linear forwards;
}
@keyframes lgv3-usdt-drain {
  from { stroke-dashoffset: 0; }
  to   { stroke-dashoffset: 593.76; }
}
@keyframes lgv3-usdt-hue {
  0%, 49.9%   { stroke: #c9932a; }
  50%, 89.9%  { stroke: #e0a020; }
  90%, 100%   { stroke: #c0392b; }
}
html.lgct-v3 .lgv3-usdt-qr {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 118px;
  height: 118px;
  transform: translate(-50%, -50%);
  background: #fff;
  border-radius: 8px;
  padding: 5px;
  box-shadow: 0 2px 8px rgba(42, 17, 8, .28);
}
html.lgct-v3 .lgv3-usdt-qr img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
html.lgct-v3 .lgv3-usdt-tm {
  position: absolute;
  left: 50%;
  bottom: -11px;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  white-space: nowrap;
  padding: 3px 12px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--lg-wood1), var(--lg-wood2));
  border: 1.5px solid var(--lg-gold2);
  box-shadow: 0 2px 6px rgba(0, 0, 0, .4);
}
html.lgct-v3 .lgv3-usdt-tm b {
  font-family: "Be Vietnam Pro", system-ui, sans-serif !important;
  font-size: 17px;
  font-weight: 800;
  line-height: 1;
  color: var(--lg-gold);
}
html.lgct-v3 .lgv3-usdt-tm span {
  font-size: 10.5px;
  font-weight: 700;
  color: #cbb188;
}
html.lgct-v3 .lgv3-usdt-hint {
  text-align: center;
  font-size: 11px;
  line-height: 1.35;
  color: #7a6748;
}

/* --- dia chi vi + nut Sao chep --- */
html.lgct-v3 .lgv3-usdt-addr {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 6px 6px 10px;
  border-radius: 10px;
  background: rgba(255, 255, 255, .55);
  border: 1.5px solid rgba(122, 74, 34, .28);
}
html.lgct-v3 .lgv3-usdt-lbl {
  display: flex;
  flex-direction: column;
  gap: 1px;
  flex: 1 1 auto;
  min-width: 0;
  font-size: 10.5px;
  font-weight: 700;
  color: #7a6748;
  white-space: nowrap;
}
html.lgct-v3 .lgv3-usdt-lbl code {
  font-family: Consolas, "Cascadia Mono", Menlo, monospace;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .3px;
  color: #2a1108;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
html.lgct-v3 .lgv3-usdt-copy {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 7px 11px;
  border-radius: 9px;
  font-family: inherit !important;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.1;
  white-space: nowrap;
  cursor: pointer;
  background: linear-gradient(180deg, #f7d271, #c98d1f);
  color: #4a1d0a;
  border: 1.5px solid #8a5a1c;
  box-shadow: inset 0 1px 0 #fff0bd, 0 2px 6px rgba(0, 0, 0, .28);
}
html.lgct-v3 .lgv3-usdt-copy.lgv3-usdt-ok {
  background: linear-gradient(180deg, #7fd6a5, #2e9c68);
  border-color: #146b49;
  color: #08301f;
}

/* --- canh bao sai mang: nen son do, chu vang --- */
html.lgct-v3 .lgv3-usdt-warn {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 8px 10px;
  border-radius: 10px;
  font-size: 12px;
  line-height: 1.32;
  background: linear-gradient(90deg, #7a1e10, #4e120a);
  color: #ffe9b0;
  border: 1px solid var(--lg-gold2);
}
html.lgct-v3 .lgv3-usdt-warn i {
  font-style: normal;
  font-size: 20px;
  line-height: 1;
  color: var(--lg-gold);
  flex: none;
}
html.lgct-v3 .lgv3-usdt-warn b { color: var(--lg-gold); font-weight: 800; }

/* --- dong ti gia --- */
html.lgct-v3 .lgv3-usdt-rt {
  font-size: 11.5px;
  line-height: 1.4;
  color: #7a6748;
}
html.lgct-v3 .lgv3-usdt-rt b {
  color: var(--lg-lac);
  font-family: "Be Vietnam Pro", system-ui, sans-serif !important;
  font-weight: 800;
}

/* --- dong thoi gian 4 moc --- */
html.lgct-v3 .lgv3-usdt-tl {
  list-style: none;
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
}
html.lgct-v3 .lgv3-usdt-tl li {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 0 0 9px 0;
}
html.lgct-v3 .lgv3-usdt-tl li::before {
  content: "";
  position: absolute;
  left: 11px;
  top: 24px;
  bottom: 0;
  width: 2px;
  background: rgba(122, 74, 34, .24);
}
html.lgct-v3 .lgv3-usdt-tl li:last-child { padding-bottom: 0; }
html.lgct-v3 .lgv3-usdt-tl li:last-child::before { display: none; }
html.lgct-v3 .lgv3-usdt-tl li i {
  position: relative;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  flex: none;
  display: inline-grid;
  place-items: center;
  font-style: normal;
  font-size: 12px;
  font-weight: 800;
  color: #8a7758;
  background: rgba(122, 74, 34, .12);
  border: 1.5px solid rgba(122, 74, 34, .32);
}
html.lgct-v3 .lgv3-usdt-tl li div {
  display: flex;
  flex-direction: column;
  gap: 1px;
  flex: 1 1 auto;
  min-width: 0;
}
html.lgct-v3 .lgv3-usdt-tl li div b {
  font-size: 13px;
  font-weight: 800;
  color: #4a1d0a;
}
html.lgct-v3 .lgv3-usdt-tl li div span {
  font-size: 11.5px;
  line-height: 1.3;
  color: #7a6748;
}
html.lgct-v3 .lgv3-usdt-tl li.lgv3-usdt-done i {
  background: linear-gradient(180deg, #f7d271, #c98d1f);
  border-color: #8a5a1c;
  color: #4a1d0a;
}
html.lgct-v3 .lgv3-usdt-tl li.lgv3-usdt-done::before { background: var(--lg-gold2); }
html.lgct-v3 .lgv3-usdt-tl li.lgv3-usdt-now i {
  background: linear-gradient(180deg, #ffb35c, #f0842a 55%, #d9631a);
  border-color: #8a3b0d;
  box-shadow: 0 0 0 3px rgba(243, 201, 90, .3);
}
html.lgct-v3 .lgv3-usdt-tl li.lgv3-usdt-now i::after {
  content: "";
  position: absolute;
  inset: 5px;
  border-radius: 50%;
  background: var(--lg-cream);
}
html.lgct-v3 .lgv3-usdt-tl li.lgv3-usdt-now div b { color: var(--lg-lac); }

/* --- chan tam truot --- */
html.lgct-v3 .lgv3-usdt-foot {
  display: flex;
  gap: 8px;
  border-top: 0 !important;
  padding: 10px 14px 16px !important;
}
html.lgct-v3 .lgv3-usdt-bt {
  flex: 1 1 0;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin: 0;
  padding: 10px 12px;
  border-radius: 11px;
  font-family: inherit !important;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.1;
  white-space: nowrap;
  cursor: pointer;
  text-decoration: none;
  background: rgba(255, 247, 230, .62);
  color: #7a4a22 !important;
  border: 1.5px solid #b98a3c;
}

/* ============================================================================
   MAN NGANG (dien thoai xoay). Chieu cao con ~390px nen chuyen sang 2 cot,
   thu nho vong dem nguoc va siet cac khoang dem lai cho gon 1 khung hinh.
   ============================================================================ */
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 .lgv3-usdt-head { padding: 0 14px 5px !important; }
  html.lgct-v3 .lgv3-usdt-head .modal-title { font-size: 15.5px; }
  html.lgct-v3 .lgv3-usdt-wrap { gap: 6px; }
  html.lgct-v3 .lgv3-usdt-steps li { font-size: 11px; }
  html.lgct-v3 .lgv3-usdt-steps li b { width: 21px; height: 21px; font-size: 11px; }

  html.lgct-v3 .lgv3-usdt-cols {
    display: grid;
    grid-template-columns: 184px minmax(0, 1fr);
    align-items: start;
    column-gap: 16px;
    row-gap: 0;
  }
  html.lgct-v3 .lgv3-usdt-ring { width: 148px; height: 148px; margin: 0 auto 11px; }
  html.lgct-v3 .lgv3-usdt-qr { width: 88px; height: 88px; padding: 4px; }
  html.lgct-v3 .lgv3-usdt-tm { padding: 2px 10px; bottom: -10px; }
  html.lgct-v3 .lgv3-usdt-tm b { font-size: 15px; }
  html.lgct-v3 .lgv3-usdt-hint { font-size: 10.5px; }

  html.lgct-v3 .lgv3-usdt-ci { gap: 6px; }
  html.lgct-v3 .lgv3-usdt-addr { padding: 5px 5px 5px 9px; }
  html.lgct-v3 .lgv3-usdt-lbl code { font-size: 14px; }
  html.lgct-v3 .lgv3-usdt-warn { padding: 6px 9px; font-size: 11.5px; }
  html.lgct-v3 .lgv3-usdt-warn i { font-size: 18px; }
  html.lgct-v3 .lgv3-usdt-rt { font-size: 11px; }
  /* chi giu loi giai thich o moc dang cho; 3 moc con lai chi can ten -> do cao
     cot phai giam ~42px, du cho tam truot gon trong 1 khung hinh ngang */
  html.lgct-v3 .lgv3-usdt-tl li:not(.lgv3-usdt-now) div span { display: none; }
  html.lgct-v3 .lgv3-usdt-tl li { padding-bottom: 5px; }
  html.lgct-v3 .lgv3-usdt-tl li::before { top: 22px; left: 10px; }
  html.lgct-v3 .lgv3-usdt-tl li i { width: 22px; height: 22px; font-size: 11px; }
  html.lgct-v3 .lgv3-usdt-tl li div b { font-size: 12px; }
  html.lgct-v3 .lgv3-usdt-tl li div span { font-size: 10.5px; }

  html.lgct-v3 .lgv3-usdt-foot { padding: 6px 14px 10px !important; }
  html.lgct-v3 .lgv3-usdt-bt { padding: 8px 12px; font-size: 12.5px; }
}

/* --- man doc hep (360x800 kieu Galaxy A...): cot chu hep hon nen canh bao va
       dong thoi gian de xuong them dong -> thu nho vong dem nguoc mot chut --- */
@media (orientation: portrait) and (max-width: 380px) {
  html.lgct-v3 .lgv3-usdt-ring { width: 176px; height: 176px; margin: 2px auto 11px; }
  html.lgct-v3 .lgv3-usdt-qr { width: 108px; height: 108px; }
}

/* --- man rat thap (VD 390x320 khi ban phim bat): bo dong thoi gian --- */
@media (max-height: 380px) {
  html.lgct-v3 .lgv3-usdt-tl { display: none; }
}

/* --- man rong THAT (>=900px va khong phai dien thoai xoay ngang):
       tam truot rong 560px, van 2 cot. Phai chan them min-height de khoi
       chong len khoi ngang o may nhu 932x430. --- */
@media (min-width: 900px) and (min-height: 561px) {
  html.lgct-v3 .lgv3-usdt-cols {
    display: grid;
    grid-template-columns: 216px minmax(0, 1fr);
    align-items: start;
    column-gap: 16px;
  }
  html.lgct-v3 .lgv3-usdt-ring { margin: 0 auto 12px; }
}
/* ============================================================================
   va7_qr.css  —  khoi CSS cho trang NAP VNPay / VietQR ban v3 (vnqr_v3.tpl)
   Noi vao cuoi assets/lgct-ui.css.  MOI bo chon deu bat dau bang html.lgct-v3
   -> khong bat cookie lgct_ui=v3 thi giao dien cu giu nguyen 100%.
   Tien to lop: lgv3-qr-   (khong dung chung voi agent khac)
   Mau / phong lay tu bien co san cua lgct-ui.css: --lg-gold --lg-gold2
   --lg-paper --lg-cream --lg-ink --lg-lac --lg-wood1 --lg-wood2
   Ngay: 2026-09-04
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. KHUNG TRANG
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv3-qr-page {
  display: flex;
  flex-direction: column;
  gap: 9px;
  min-width: 0;
}

/* --------------------------------------------------------------------------
   2. THANH BUOC 1-2-3  (dung ca o trang va trong modal, ban modal them .sm)
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv3-qr-steps {
  display: flex;
  align-items: center;
  gap: 4px;
  width: 100%;
  min-width: 0;
}
html.lgct-v3 .lgv3-qr-steps .st {
  display: flex;
  align-items: center;
  gap: 5px;
  font-weight: 700;
  font-size: 11px;
  line-height: 1;
  color: #9a8461;
  white-space: nowrap;
  min-width: 0;
}
html.lgct-v3 .lgv3-qr-steps .st b {
  width: 20px; height: 20px; flex: none;
  border-radius: 50%;
  display: grid; place-items: center;
  background: #e8d9b8;
  color: #7a6748;
  border: 1px solid var(--lg-gold2);
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 800; font-size: 11px; line-height: 1;
}
html.lgct-v3 .lgv3-qr-steps .st span {
  overflow: hidden; text-overflow: ellipsis;
}
html.lgct-v3 .lgv3-qr-steps .st.on { color: #5a1c0c; }
html.lgct-v3 .lgv3-qr-steps .st.on b {
  background: linear-gradient(180deg, #ffb35c, #d9631a);
  color: #5a1a05;
  border-color: #8a3b0d;
}
html.lgct-v3 .lgv3-qr-steps .st.done { color: #1f6b33; }
html.lgct-v3 .lgv3-qr-steps .st.done b {
  background: #1f6b33; color: #fff; border-color: #155024;
}
html.lgct-v3 .lgv3-qr-steps i {
  flex: 1 1 auto;
  height: 2px;
  min-width: 8px;
  background: #d8c9a6;
  border-radius: 1px;
}
html.lgct-v3 .lgv3-qr-steps.sm { margin-bottom: 2px; }
html.lgct-v3 .lgv3-qr-steps.sm .st { font-size: 10.5px; }
html.lgct-v3 .lgv3-qr-steps.sm .st b { width: 18px; height: 18px; font-size: 10px; }

/* Ngoai trang (nen anh cung dien toi) phai doi sang mau sang, khong the dung
   mau nau/xanh dam nhu ban trong tam truot (nen giay kem). */
html.lgct-v3 .lgv3-qr-page > .lgv3-qr-steps { justify-content: center; }
html.lgct-v3 .lgv3-qr-page > .lgv3-qr-steps i { max-width: 220px; background: rgba(243, 201, 90, .32); }
html.lgct-v3 .lgv3-qr-page > .lgv3-qr-steps .st { color: #cbb188; }
html.lgct-v3 .lgv3-qr-page > .lgv3-qr-steps .st.on { color: var(--lg-gold); }
html.lgct-v3 .lgv3-qr-page > .lgv3-qr-steps .st.done { color: #7fc36a; }
html.lgct-v3 .lgv3-qr-page > .lgv3-qr-steps .st.done b { background: #2f8f45; border-color: #7fc36a; }

/* --------------------------------------------------------------------------
   3. DAI +20%
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv3-qr-ribbon {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 10px;
  background: linear-gradient(90deg, #7a1e10, #4e120a);
  border: 1px solid var(--lg-gold2);
  color: #ffe9b0;
  min-width: 0;
}
html.lgct-v3 .lgv3-qr-ribbon > b {
  flex: none;
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 800;
  font-size: 27px;
  line-height: 1;
  color: var(--lg-gold);
  white-space: nowrap;
}
html.lgct-v3 .lgv3-qr-ribbon .rb { min-width: 0; }
html.lgct-v3 .lgv3-qr-ribbon .t {
  font-weight: 700; font-size: 13px; line-height: 1.25;
}
html.lgct-v3 .lgv3-qr-ribbon .s {
  font-size: 12px; line-height: 1.3; opacity: .93; margin-top: 2px;
}
html.lgct-v3 .lgv3-qr-ribbon .s em {
  font-style: normal;
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 800; font-size: 15px;
  color: var(--lg-gold);
}

/* --------------------------------------------------------------------------
   4. TIEU DE NHO
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv3-qr-sec {
  font-weight: 700;
  font-size: 11.5px;
  line-height: 1.2;
  color: #d8bd8c;            /* nam tren nen anh toi */
  text-transform: uppercase;
  letter-spacing: .05em;
}
html.lgct-v3 .lgv3-qr-sec small {
  text-transform: none;
  letter-spacing: 0;
  font-weight: 600;
  color: #8fd6a0;
}

/* --------------------------------------------------------------------------
   5. LUOI 6 MENH GIA
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv3-qr-amts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}
html.lgct-v3 .lgv3-qr-amt {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
  min-width: 0;
  padding: 8px 3px 7px;
  border-radius: 10px;
  background: linear-gradient(180deg, #fff1c8, #f5dc9a);
  border: 1.5px solid #7a4a22;
  box-shadow: 0 0 0 2px #2a1108;
  color: #5a3a1c !important;
  text-align: center;
  text-decoration: none !important;
}
html.lgct-v3 .lgv3-qr-amt b {
  display: block;
  width: 100%;
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 800;
  font-size: 16px;
  line-height: 1.15;
  color: var(--lg-lac);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
html.lgct-v3 .lgv3-qr-amt span {
  display: block;
  width: 100%;
  font-size: 10.5px;
  line-height: 1.2;
  color: #7a6748;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
html.lgct-v3 .lgv3-qr-amt:active {
  background: linear-gradient(180deg, #ffb35c, #f0842a 55%, #d9631a);
  border-color: #8a3b0d;
}

/* --------------------------------------------------------------------------
   6. GHI CHU / CANH BAO
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv3-qr-note,
html.lgct-v3 .lgv3-qr-warn {
  border-radius: 9px;
  padding: 7px 10px;
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
html.lgct-v3 .lgv3-qr-note {
  background: #fff3d6;
  border: 1px solid #e6c877;
  color: #6b4a1c;
}
html.lgct-v3 .lgv3-qr-note b { color: var(--lg-lac); font-weight: 800; }
html.lgct-v3 .lgv3-qr-warn {
  background: #f7dcd8;
  border: 1px solid #c8261c;
  color: #7a1e10;
  font-weight: 600;
}
html.lgct-v3 .lgv3-qr-warn b { font-weight: 800; }
html.lgct-v3 .lgv3-qr-warn.strong {
  border-width: 1.5px;
  font-size: 12.5px;
}

/* --------------------------------------------------------------------------
   7. HANG NUT + KHOI HUONG DAN (dong san, bam moi mo)
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv3-qr-acts { display: flex; gap: 8px; }
html.lgct-v3 .lgv3-qr-gbtn {
  flex: 1 1 0;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9px;
  padding: 8px 8px;
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
  background: linear-gradient(180deg, var(--lg-cream), #f2e2c2);
  border: 1.5px solid #7a4a22;
  box-shadow: 0 0 0 2px #2a1108;
  color: #5a3a1c !important;
  text-decoration: none !important;
}
html.lgct-v3 .lgv3-qr-guide {
  display: block;
  padding: 9px;
  border-radius: 10px;
  background: linear-gradient(180deg, var(--lg-cream), var(--lg-paper));
  border: 1.5px solid #7a4a22;
  box-shadow: 0 0 0 2px #2a1108;
}
html.lgct-v3 .lgv3-qr-guide[hidden] { display: none !important; }
html.lgct-v3 .lgv3-qr-guide .carousel-item img {
  max-height: 132px;
  object-fit: cover;
  border-radius: 8px;
}
html.lgct-v3 .lgv3-qr-steplist {
  margin: 8px 0 0;
  padding-left: 20px;
  font-size: 12px;
  line-height: 1.45;
  color: #5a3a1c;
}
html.lgct-v3 .lgv3-qr-steplist li { margin-bottom: 3px; }
html.lgct-v3 .lgv3-qr-steplist li:last-child { margin-bottom: 0; }
html.lgct-v3 .lgv3-qr-steplist b { color: var(--lg-lac); font-weight: 800; }

/* --------------------------------------------------------------------------
   8. RUOT MODAL #contenpay  (JS dung vao truoc .modal-footer)
   -------------------------------------------------------------------------- */
html.lgct-v3 #contenpay .lgv3-qr-src { display: none !important; }

html.lgct-v3 .lgv3-qr-sheet {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 4px 14px 2px;
  min-width: 0;
}

/* the QR + cac dong thong tin */
html.lgct-v3 .lgv3-qr-pay {
  display: flex;
  gap: 10px;
  padding: 8px;
  border-radius: 10px;
  background: rgba(255, 255, 255, .55);
  border: 1px solid rgba(122, 74, 34, .35);
  min-width: 0;
}
html.lgct-v3 .lgv3-qr-qrwrap {
  flex: none;
  width: 136px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
}
html.lgct-v3 .lgv3-qr-img {
  display: block;
  width: 136px;
  height: 136px;
  background: #fff;
  border-radius: 8px;
  padding: 4px;
  border: 1px solid rgba(122, 74, 34, .3);
}
html.lgct-v3 .lgv3-qr-cap {
  display: block;
  width: 100%;
  font-size: 10px;
  line-height: 1.25;
  color: #7a6748;
  text-align: center;
}
html.lgct-v3 .lgv3-qr-fields {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
}
html.lgct-v3 .lgv3-qr-f {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
  padding: 0 32px 4px 0;
  border-bottom: 1px dashed rgba(122, 74, 34, .28);
}
html.lgct-v3 .lgv3-qr-f:last-child { border-bottom: 0; padding-bottom: 0; }
html.lgct-v3 .lgv3-qr-f > span {
  font-size: 9.5px;
  line-height: 1.2;
  font-weight: 700;
  color: #7a6748;
  text-transform: uppercase;
  letter-spacing: .05em;
}
html.lgct-v3 .lgv3-qr-f > b {
  font-weight: 700;
  font-size: 13.5px;
  line-height: 1.25;
  color: var(--lg-ink);
  overflow-wrap: anywhere;
}
html.lgct-v3 .lgv3-qr-f > b.lgv3-qr-price {
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 800;
  font-size: 19px;
  line-height: 1.15;
  color: var(--lg-lac);
}
html.lgct-v3 .lgv3-qr-cp {
  position: absolute;
  right: 0;
  top: 8px;
  width: 26px; height: 26px;
  flex: none;
  padding: 0;
  border-radius: 7px;
  display: grid;
  place-items: center;
  background: linear-gradient(180deg, #f7d271, #c98d1f);
  color: #4a1d0a;
  border: 1px solid #8a5a0d;
  font-size: 12px;
  line-height: 1;
}

/* dai do: NOI DUNG CHUYEN KHOAN - thu quan trong nhat cua man hinh */
html.lgct-v3 .lgv3-qr-ctt {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 10px;
  background: #fff;
  border: 2px solid var(--lg-lac);
  box-shadow: 0 0 0 3px rgba(143, 29, 20, .14);
  min-width: 0;
}
html.lgct-v3 .lgv3-qr-ctt-l { flex: 1 1 auto; min-width: 0; }
html.lgct-v3 .lgv3-qr-ctt-l > span {
  display: block;
  font-weight: 800;
  font-size: 10.5px;
  line-height: 1.2;
  color: var(--lg-lac);
  text-transform: uppercase;
  letter-spacing: .04em;
}
html.lgct-v3 .lgv3-qr-ctt-l > span em {
  font-style: normal;
  background: var(--lg-lac);
  color: #fff;
  padding: 1px 6px;
  border-radius: 999px;
  font-size: 9px;
  margin-left: 4px;
  letter-spacing: 0;
  text-transform: none;
}
html.lgct-v3 .lgv3-qr-ctt-l > b {
  display: block;
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 800;
  font-size: 29px;
  line-height: 1.15;
  color: var(--lg-ink);
  letter-spacing: .08em;
  overflow-wrap: anywhere;
}
html.lgct-v3 .lgv3-qr-btn {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9px;
  padding: 8px 11px;
  font-weight: 800;
  font-size: 12.5px;
  line-height: 1;
  white-space: nowrap;
  background: linear-gradient(180deg, #ffb35c, #f0842a 55%, #d9631a);
  color: #5a1a05 !important;
  border: 1.5px solid #8a3b0d;
  box-shadow: inset 0 1px 0 #ffe0a8, 0 3px 8px rgba(0, 0, 0, .35);
}
html.lgct-v3 .lgv3-qr-btn.lgv3-qr-copied,
html.lgct-v3 .lgv3-qr-cp.lgv3-qr-copied {
  background: linear-gradient(180deg, #4fae63, #1f6b33);
  color: #fff !important;
  border-color: #155024;
}

/* dong ho dem nguoc + thanh chay (#countdown / #progressusdt) */
html.lgct-v3 .lgv3-qr-cd {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
html.lgct-v3 .lgv3-qr-cd-t {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  font-size: 11.5px;
  line-height: 1.25;
  font-weight: 600;
  color: #7a6748;
  min-width: 0;
}
html.lgct-v3 .lgv3-qr-cd-t > span { min-width: 0; overflow-wrap: anywhere; }
html.lgct-v3 .lgv3-qr-cd-t > b {
  flex: none;
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 800;
  font-size: 15px;
  line-height: 1.1;
  color: #1f6b33;
  white-space: nowrap;
}
html.lgct-v3 .lgv3-qr-bar {
  height: 6px;
  border-radius: 3px;
  background: #e2d3b1;
  overflow: hidden;
}
html.lgct-v3 .lgv3-qr-bar > * {
  display: block;
  height: 100%;
  border-radius: 3px;
  background: linear-gradient(90deg, #2f8f45, #7fc36a);
  transition: width .6s linear;
}
html.lgct-v3 .lgv3-qr-bar > *[data-lv="warn"] { background: linear-gradient(90deg, #b8860b, #e0b040); }
html.lgct-v3 .lgv3-qr-bar > *[data-lv="low"]  { background: linear-gradient(90deg, #9b1c12, #d4483a); }
html.lgct-v3 .lgv3-qr-cd[data-out="1"] .lgv3-qr-cd-t > b { color: #9b1c12; }

html.lgct-v3 .lgv3-qr-expired {
  border-radius: 9px;
  padding: 7px 10px;
  font-size: 12px;
  line-height: 1.35;
  background: #fff3d6;
  border: 1px solid #e6c877;
  color: #6b4a1c;
  overflow-wrap: anywhere;
}
html.lgct-v3 .lgv3-qr-expired[hidden] { display: none !important; }
html.lgct-v3 .lgv3-qr-expired b { color: var(--lg-lac); font-weight: 800; }

/* --------------------------------------------------------------------------
   9. MAN NGANG (dien thoai xoay) — dung dung breakpoint cua lgct-ui.css
   -------------------------------------------------------------------------- */
@media (orientation: landscape) and (max-height: 560px) {

  /* trang: hai cot, luoi menh gia trai dai 6 o */
  html.lgct-v3 .lgv3-qr-page { gap: 6px; }
  html.lgct-v3 .lgv3-qr-steps .st { font-size: 10.5px; }
  html.lgct-v3 .lgv3-qr-steps .st b { width: 18px; height: 18px; font-size: 10px; }
  html.lgct-v3 .lgv3-qr-ribbon { padding: 6px 10px; gap: 8px; }
  html.lgct-v3 .lgv3-qr-ribbon > b { font-size: 22px; }
  html.lgct-v3 .lgv3-qr-ribbon .t { font-size: 12px; }
  html.lgct-v3 .lgv3-qr-ribbon .s { font-size: 11px; }
  html.lgct-v3 .lgv3-qr-ribbon .s em { font-size: 13.5px; }
  html.lgct-v3 .lgv3-qr-amts { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; }
  html.lgct-v3 .lgv3-qr-amt { padding: 6px 2px 5px; }
  html.lgct-v3 .lgv3-qr-amt b { font-size: 14px; }
  html.lgct-v3 .lgv3-qr-amt span { font-size: 9.5px; }
  html.lgct-v3 .lgv3-qr-note,
  html.lgct-v3 .lgv3-qr-warn { font-size: 11px; padding: 5px 9px; }
  html.lgct-v3 .lgv3-qr-warn.strong { font-size: 11.5px; }
  html.lgct-v3 .lgv3-qr-gbtn { padding: 6px 8px; font-size: 11.5px; }
  html.lgct-v3 .lgv3-qr-guide .carousel-item img { max-height: 96px; }

  /* modal: chia hai cot cho vua chieu cao 390 */
  html.lgct-v3 .lgv3-qr-sheet {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-auto-rows: min-content;
    gap: 6px 10px;
    padding: 2px 12px 2px;
  }
  html.lgct-v3 .lgv3-qr-sheet > .lgv3-qr-steps { grid-column: 1 / -1; justify-content: center; }
  html.lgct-v3 .lgv3-qr-sheet > .lgv3-qr-steps i { max-width: 170px; }
  html.lgct-v3 .lgv3-qr-sheet > .lgv3-qr-pay { grid-column: 1; grid-row: 2 / span 3; padding: 6px; gap: 8px; }
  html.lgct-v3 .lgv3-qr-sheet > .lgv3-qr-ctt { grid-column: 2; grid-row: 2; padding: 5px 9px; }
  html.lgct-v3 .lgv3-qr-sheet > .lgv3-qr-warn { grid-column: 2; grid-row: 3; }
  html.lgct-v3 .lgv3-qr-sheet > .lgv3-qr-cd { grid-column: 2; grid-row: 4; }
  html.lgct-v3 .lgv3-qr-sheet > .lgv3-qr-expired { grid-column: 1 / -1; }
  html.lgct-v3 .lgv3-qr-qrwrap { width: 108px; }
  html.lgct-v3 .lgv3-qr-img { width: 108px; height: 108px; }
  html.lgct-v3 .lgv3-qr-cap { font-size: 9px; }
  html.lgct-v3 .lgv3-qr-fields { gap: 2px; }
  html.lgct-v3 .lgv3-qr-f { padding-bottom: 2px; }
  html.lgct-v3 .lgv3-qr-f > b { font-size: 12.5px; }
  html.lgct-v3 .lgv3-qr-f > b.lgv3-qr-price { font-size: 16px; }
  html.lgct-v3 .lgv3-qr-cp { top: 4px; width: 22px; height: 22px; font-size: 11px; }
  html.lgct-v3 .lgv3-qr-ctt-l > b { font-size: 23px; }
  html.lgct-v3 .lgv3-qr-btn { padding: 6px 9px; font-size: 11.5px; }
  html.lgct-v3 .lgv3-qr-cd-t { font-size: 10.5px; }
  html.lgct-v3 .lgv3-qr-cd-t > b { font-size: 13.5px; }
  html.lgct-v3 .lgv3-qr-expired { font-size: 10.5px; padding: 5px 9px; }
}

/* --------------------------------------------------------------------------
   10. MAN RONG (may tinh / may tinh bang)
   -------------------------------------------------------------------------- */
@media (min-width: 900px) {
  html.lgct-v3 .lgv3-qr-amts { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  html.lgct-v3 .lgv3-qr-amt b { font-size: 17px; }
  html.lgct-v3 .lgv3-qr-qrwrap,
  html.lgct-v3 .lgv3-qr-img { width: 152px; }
  html.lgct-v3 .lgv3-qr-img { height: 152px; }
  html.lgct-v3 .lgv3-qr-ctt-l > b { font-size: 32px; }
}

/* --------------------------------------------------------------------------
   11. VA LAI DAU/CHAN MODAL MA sync-vnqr.php IN RA (khong doi HTML ben PHP)
   -------------------------------------------------------------------------- */
html.lgct-v3 #infopay .modal-header {
  padding: 0 14px 4px !important;
  border-bottom: 0 !important;
}
html.lgct-v3 #infopay .modal-header .modal-title {
  margin: 0 !important;               /* PHP in inline margin-left:25% */
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-size: 17px;
  line-height: 1.2;
  color: #5a1c0c;
}
html.lgct-v3 #infopay .modal-footer {
  gap: 8px;
  padding: 6px 14px 14px !important;
}
html.lgct-v3 #infopay .modal-footer .btn {
  border-radius: 9px !important;
  padding: 8px 12px !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  background: rgba(255, 255, 255, .45);
  border: 1px solid rgba(122, 74, 34, .45);
  color: #5a3a1c !important;
}

/* man rat hep (<=340px): tranh vo luoi va tran chu */
@media (max-width: 340px) {
  html.lgct-v3 .lgv3-qr-amts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html.lgct-v3 .lgv3-qr-pay { flex-direction: column; align-items: center; }
  html.lgct-v3 .lgv3-qr-fields { width: 100%; }
  html.lgct-v3 .lgv3-qr-ctt { flex-wrap: wrap; }
  html.lgct-v3 .lgv3-qr-btn { width: 100%; }
  html.lgct-v3 .lgv3-qr-ctt-l > b { font-size: 26px; }
}

/* ==========================================================================
   LGCT · PHUONG AN 1 — "BANG GO"
   Hop thoai co THANH TIEU DE GO DO nam ngang tren cung, bieu tuong nho nam
   trong thanh, noi dung can trai, 2 nut xep ngang o goc phai duoi.
   --------------------------------------------------------------------------
   Ap cho SweetAlert2 v7.15.1 (dung ban dang chay o
   /assets/component/sweetalert2/). v7 KHONG co .swal2-html-container,
   .swal2-deny, .swal2-timer-progress-bar — cac lop do la cua v11.
   v7 dung: .swal2-content (boc #swal2-content) va .swal2-validationerror.
   Man che la .swal2-container.swal2-shown chu khong phai .swal2-backdrop-show.
   --------------------------------------------------------------------------
   Moi bo chon deu bat dau bang html.lgct-v3 nen giao dien cu khong bi dung.
   ========================================================================== */

/* --- man che ------------------------------------------------------------ */
html.lgct-v3 .swal2-container { padding: 14px; }
html.lgct-v3 .swal2-container.swal2-shown { background-color: rgba(26, 10, 4, .64); }

/* --- khung hop: tam bang go, giay do ben trong --------------------------- */
html.lgct-v3 .swal2-popup {
  width: 100%;
  max-width: 336px;
  padding: 0;
  overflow: hidden;
  border: 1.5px solid #7a4a22;
  border-radius: 10px;
  /* Nen dat background-color dac chu khong chi linear-gradient: SweetAlert2 v7
     doc getComputedStyle(popup).background-color roi chep vao 3 manh che cua
     bieu tuong "thanh cong". Chi co gradient thi mau do ra trong suot, hieu ung
     ve dan dau tich mat tac dung (hinh cuoi cung van dung). */
  background-color: #fff7e6;
  background-image: linear-gradient(180deg, #fff7e6, #f6ead0);
  box-shadow: 0 0 0 2px #2a1108, 0 0 0 3px #b98a3c, 0 16px 38px rgba(0, 0, 0, .5);
  color: #3a2413;
  font-family: "Be Vietnam Pro", system-ui, "Segoe UI", Roboto, sans-serif;
  font-size: 15px;
}

/* --- thanh go do tren cung ---------------------------------------------- */
html.lgct-v3 .swal2-popup .swal2-header {
  flex-direction: row;
  align-items: center;
  margin: 0;
  padding: 9px 34px 9px 11px;
  border-bottom: 2px solid #c9932a;
  background: linear-gradient(180deg, #4a2314, #2c140c);
}

html.lgct-v3 .swal2-popup .swal2-title {
  flex: 1 1 auto;
  margin: 0 0 0 9px;
  padding: 0;
  color: #f7d271;
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
  text-align: left;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .6);
}

/* --- bieu tuong: thu nho ve 28px va nhet vao thanh go -------------------- */
/* Toan bo hinh hoc cua .swal2-icon trong v7 tinh theo em (width:5em, cac vach
   dat top/left theo em) nen chi can doi font-size la scale duoc ca cum. */
html.lgct-v3 .swal2-popup .swal2-icon {
  flex: 0 0 auto;
  margin: 0;
  border-width: .26em;
  font-size: 5.6px;               /* 5em = 28px */
}
html.lgct-v3 .swal2-popup .swal2-icon-text {
  font-size: 3em;
  font-weight: 800;
}

html.lgct-v3 .swal2-popup .swal2-icon.swal2-warning  { border-color: #f3c95a; background: rgba(243, 201, 90, .16); color: #f7d271; }
html.lgct-v3 .swal2-popup .swal2-icon.swal2-info     { border-color: #7fc4e8; background: rgba(127, 196, 232, .16); color: #a9dcf5; }
html.lgct-v3 .swal2-popup .swal2-icon.swal2-question { border-color: #d9b06a; background: rgba(217, 176, 106, .16); color: #efd39a; }
html.lgct-v3 .swal2-popup .swal2-icon.swal2-error    { border-color: #e2705f; background: rgba(226, 112, 95, .16); }
html.lgct-v3 .swal2-popup .swal2-icon.swal2-success  { border-color: #7fd08e; background: rgba(127, 208, 142, .16); }

html.lgct-v3 .swal2-popup .swal2-icon.swal2-error [class^="swal2-x-mark-line"] { background-color: #ffb3a6; }
html.lgct-v3 .swal2-popup .swal2-icon.swal2-success [class^="swal2-success-line"] { background-color: #a8f0b8; }

/* v7 ve bieu tuong "thanh cong" bang 3 manh che mau nen + 1 vong mo.
   Nen giay do khong hop voi cach do — bo han, chi giu vien tron + dau tich. */
html.lgct-v3 .swal2-popup .swal2-icon.swal2-success .swal2-success-circular-line-left,
html.lgct-v3 .swal2-popup .swal2-icon.swal2-success .swal2-success-circular-line-right,
html.lgct-v3 .swal2-popup .swal2-icon.swal2-success .swal2-success-fix,
html.lgct-v3 .swal2-popup .swal2-icon.swal2-success .swal2-success-ring { display: none; }

/* --- nut dong (dau nhan) ------------------------------------------------ */
html.lgct-v3 .swal2-popup .swal2-close {
  top: 7px;
  right: 9px;
  width: 22px;
  min-width: 22px;
  height: 22px;
  border-radius: 5px;
  color: #e0b558;
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-size: 19px;
  line-height: 20px;
}
html.lgct-v3 .swal2-popup .swal2-close:hover { background: rgba(243, 201, 90, .16); color: #ffe7a8; }

/* --- than hop ----------------------------------------------------------- */
html.lgct-v3 .swal2-popup .swal2-content {
  margin: 0;
  padding: 12px 14px 0;
  color: #3a2413;
  font-size: 13.5px;
  font-weight: 500;
  line-height: 1.55;
}
html.lgct-v3 .swal2-popup #swal2-content { text-align: left; }
html.lgct-v3 .swal2-popup .swal2-content b {
  color: #8f1d14;
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-size: 15px;
  font-weight: 700;
}
html.lgct-v3 .swal2-popup .swal2-content i { color: #7a6748; font-style: normal; font-weight: 700; }

/* --- o nhap ------------------------------------------------------------- */
html.lgct-v3 .swal2-popup .swal2-content .swal2-input,
html.lgct-v3 .swal2-popup .swal2-content .swal2-textarea {
  /* KHONG dong vao "display": v7 an cac o nhap khong dung bang inline
     display:none, ghi de bang !important se lam chung hien het ra. */
  width: 100%;
  height: auto;
  margin: 11px 0 0;
  padding: 10px 12px;
  border: 1.5px solid #b98a3c;
  border-radius: 8px;
  background: #fffdf6;
  color: #3a2413;
  font-family: "Be Vietnam Pro", system-ui, "Segoe UI", Roboto, sans-serif;
  font-size: 14px;
  font-weight: 700;
  box-shadow: inset 0 2px 4px rgba(122, 74, 34, .14);
}
html.lgct-v3 .swal2-popup .swal2-content .swal2-input:focus {
  border: 1.5px solid #f0842a;
  box-shadow: inset 0 2px 4px rgba(122, 74, 34, .12), 0 0 0 3px rgba(240, 132, 42, .25);
}
html.lgct-v3 .swal2-popup .swal2-content .swal2-input::placeholder { color: #a9987a; font-weight: 500; }

html.lgct-v3 .swal2-popup .swal2-validationerror {
  margin: 9px 0 0;
  padding: 7px 10px;
  border-radius: 7px;
  background: rgba(143, 29, 20, .1);
  color: #8f1d14;
  font-size: 12.5px;
  font-weight: 700;
}
html.lgct-v3 .swal2-popup .swal2-validationerror::before { background-color: #8f1d14; }

/* --- hang nut ----------------------------------------------------------- */
html.lgct-v3 .swal2-popup .swal2-actions {
  margin: 0;
  padding: 13px 14px 14px;
  /* dao chieu de nut chinh nam ben PHAI (thu tu trong DOM la confirm truoc) */
  flex-direction: row-reverse;
  justify-content: flex-start;
}
html.lgct-v3 .swal2-popup .swal2-actions .swal2-styled {
  margin: 0 0 0 8px;
  padding: 9px 15px;
  min-width: 92px;
  border-radius: 8px;
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-size: 14px;
  font-weight: 700;
}
html.lgct-v3 .swal2-popup .swal2-actions .swal2-styled.swal2-confirm {
  border: 1.5px solid #8a3b0d;
  /* thu vien ghi inline background-color / border-left-color / border-right-color
     tu tuy chon confirmButtonColor — chi ghi de duoc bang !important */
  border-color: #8a3b0d !important;
  background: linear-gradient(180deg, #ffb35c, #f0842a 55%, #d9631a) !important;
  color: #5a1a05;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .35);
  box-shadow: 0 2px 0 #a34a12, 0 3px 6px rgba(0, 0, 0, .25);
}
html.lgct-v3 .swal2-popup .swal2-actions .swal2-styled.swal2-cancel {
  border: 1.5px solid #8a5a2a;
  background: linear-gradient(180deg, #f7d271, #c98d1f) !important;   /* cancelButtonColor inline */
  color: #4a1d0a;
  box-shadow: 0 2px 0 #9a6b17, 0 3px 6px rgba(0, 0, 0, .22);
}
html.lgct-v3 .swal2-popup .swal2-actions .swal2-styled:focus {
  box-shadow: 0 0 0 2px #fff7e6, 0 0 0 4px rgba(201, 147, 42, .85);
}

/* --- chan hop ----------------------------------------------------------- */
html.lgct-v3 .swal2-popup .swal2-footer {
  margin: 0;
  padding: 9px 14px 12px;
  border-top: 1px dashed #d9c49a;
  color: #7a6748;
  font-size: 12px;
}

/* --- man ngang: nen thap lai -------------------------------------------- */
@media (max-height: 460px) {
  html.lgct-v3 .swal2-container { padding: 10px; }
  html.lgct-v3 .swal2-popup { max-width: 400px; font-size: 14px; }
  html.lgct-v3 .swal2-popup .swal2-header { padding: 7px 32px 7px 10px; }
  html.lgct-v3 .swal2-popup .swal2-title { font-size: 15px; }
  html.lgct-v3 .swal2-popup .swal2-content { padding: 9px 12px 0; font-size: 13px; }
  html.lgct-v3 .swal2-popup .swal2-content .swal2-input { margin-top: 8px; padding: 8px 11px; }
  html.lgct-v3 .swal2-popup .swal2-actions { padding: 10px 12px 11px; }
  html.lgct-v3 .swal2-popup .swal2-actions .swal2-styled { padding: 8px 14px; font-size: 13.5px; }
}

/* --- phong khi nao nang SweetAlert2 len v11 ------------------------------ */
html.lgct-v3 .swal2-popup .swal2-html-container {
  margin: 0;
  padding: 12px 14px 0;
  color: #3a2413;
  font-size: 13.5px;
  font-weight: 500;
  line-height: 1.55;
  text-align: left;
}
html.lgct-v3 .swal2-popup .swal2-actions .swal2-styled.swal2-deny {
  border: 1.5px solid #8a2a1a;
  background: linear-gradient(180deg, #d9695c, #8f1d14) !important;
  color: #fff2ea;
}

/* 04/09/2026 — sua sau khi xem tren web that:
   chu tren nut bi be dong ("Nap / ngay") khi chu dai hoac may co co chu lon.
   Ep khong xuong dong va cho nut TU GIAN theo chu, thay vi giu be ngang co dinh.
   Dat cuoi khoi de chac chan de len cac luat o tren. */
html.lgct-v3 .swal2-popup .swal2-actions .swal2-styled {
  /* 04/09/2026 — do tren web that moi thay: luat cua chinh thu vien SweetAlert2 v7 co
     do uu tien CAO HON luat o day, nen nhung dong KHONG co !important deu bi bo qua
     (co chu that ra 19.5px chu khong phai 14px, dem 29.25px chu khong phai 15px,
     phong van la Nunito chu khong phai Baloo 2). Vi vay cac thuoc tinh quyet dinh
     BO CUC buoc phai ep, neu khong chu tren nut bi cat cut hoac nut nhay xuong hang. */
  font-family: "Be Vietnam Pro", system-ui, sans-serif !important;
  font-size: 14px !important;
  line-height: 1.25 !important;
  padding: 9px 14px !important;
  white-space: nowrap !important;
  flex: 0 1 auto !important;
  min-width: 0 !important;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}
html.lgct-v3 .swal2-popup .swal2-actions {
  /* KHONG cho xuong hang: truoc do thieu dung 3 pixel la hai nut nhay thanh hai dong */
  flex-wrap: nowrap;
  column-gap: 8px;
}
html.lgct-v3 .swal2-popup .swal2-actions .swal2-styled + .swal2-styled {
  margin-left: 0;
}


/* ==========================================================================
   VA 10 — CON MAT HIEN/AN MAT KHAU (04/09/2026)
   Nut nam de len goc phai o nhap. Chua o (.mb-3) von la khoi thuong, phai
   cho no position:relative thi nut moi neo dung cho.
   ========================================================================== */
html.lgct-v3 #index_content .lgv3-eyewrap { position: relative; }
html.lgct-v3 #index_content .lgv3-eyewrap > input[type="password"],
html.lgct-v3 #index_content .lgv3-eyewrap > input[data-lgv3eye="1"] {
  padding-right: 44px;
}
html.lgct-v3 #index_content .lgv3-eye {
  position: absolute;
  top: 0;
  right: 0;
  height: calc(100% - 1rem);   /* tru khoang cach duoi cua .mb-3 */
  min-height: 34px;
  width: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  background: transparent;
  color: #8a6a3a;
  cursor: pointer;
  border-radius: 0 9px 9px 0;
}
html.lgct-v3 #index_content .lgv3-eye:hover { color: #5a1c0c; }
html.lgct-v3 #index_content .lgv3-eye:active { transform: translateY(1px); }
html.lgct-v3 #index_content .lgv3-eye:focus-visible {
  outline: 2px solid #c9932a;
  outline-offset: -2px;
}
html.lgct-v3 #index_content .lgv3-eye[aria-pressed="true"] { color: #8f1d14; }
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 #index_content .lgv3-eye { height: calc(100% - 1.5rem); }
}

/* ============================================================================
   VA8 - 04/09/2026. O CHON LOAI THE kieu "nut mot dong + tam truot day"
   (phuong an 3). Khoi nay duoc NOI vao cuoi assets/lgct-ui.css.

   Moi bo chon deu bat dau bang "html.lgct-v3" -> khong bat co v3 thi giao dien
   cu giu nguyen 100%. Moi ten lop deu bat dau bang "lgv3-tel-" (KHONG dung lai
   "lgv3-card-" de khoi dung khoi va7_card dang chay).

   NANG CAP DAN (quan trong):
     - Trong HTML, <select name="telco"> HIEN BINH THUONG, nut .lgv3-tel-trig va
       tam truot .lgv3-tel-sheet deu co hidden="hidden".
     - Chi khi JS chay duoc, JS moi them lop .lgv3-tel-off vao select (ep trong
       suot, de dung cho cu) va bo hidden cua nut.
     - JS hong / trinh duyet cu / WebView la -> nguoi choi van thay hop tha cu
       va van nap duoc tien.

   Select bi "an" theo dung cach ma luoi menh gia dang lam voi name="amount":
   nam de LEN nut, trong suot, khong an chuot. Nho vay khi may chu bao loi va tro
   popover vao #recharge-zing select[name="telco"] thi bong bong loi van hien
   dung cho, va vien do (.is-invalid) duoc JS chep sang nut bang .lgv3-tel-bad.
   ========================================================================== */

/* --- khung boc: select that + nut mo tam truot nam chong len nhau --- */
html.lgct-v3 .lgv3-tel-box { position: relative; }

/* --- select goc sau khi JS tiep quan --- */
html.lgct-v3 .lgv3-tel-sel.lgv3-tel-off {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 0;
  pointer-events: none;
  background-image: none !important;
}

/* --- nut mot dong --- */
html.lgct-v3 .lgv3-tel-trig[hidden] { display: none !important; }
html.lgct-v3 .lgv3-tel-trig {
  -webkit-appearance: none;
  appearance: none;
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 6px 8px;
  border-radius: 10px;
  background: linear-gradient(180deg, var(--lg-cream), var(--lg-paper));
  border: 1.5px solid #7a4a22;
  box-shadow: 0 0 0 1px #2a1108;
  text-align: left;
  font-family: inherit;
  cursor: pointer;
}
html.lgct-v3 .lgv3-tel-trig:focus { outline: 2px solid var(--lg-gold2); outline-offset: 2px; }
/* may chu bao loi loai the -> JS chep .is-invalid cua select sang day */
html.lgct-v3 .lgv3-tel-trig.lgv3-tel-bad {
  border-color: #c8261c;
  box-shadow: 0 0 0 1px #2a1108, 0 0 0 3px rgba(200, 38, 28, .45);
}

html.lgct-v3 .lgv3-tel-plate {
  width: 82px;
  height: 32px;
  flex: none;
  background: #fff;
  border: 1px solid #e3d2ac;
  border-radius: 6px;
  display: grid;
  place-items: center;
  overflow: hidden;
}
html.lgct-v3 .lgv3-tel-plate img {
  max-height: 28px;
  max-width: 94%;
  display: block;
}
/* khong co anh logo -> in ten len tam trang */
html.lgct-v3 .lgv3-tel-plate-tx {
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 700;
  font-size: 10.5px;
  line-height: 1;
  color: #5a1c0c;
  text-align: center;
  padding: 0 3px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}

html.lgct-v3 .lgv3-tel-tx {
  min-width: 0;
  flex: 1 1 auto;
  line-height: 1.15;
}
html.lgct-v3 .lgv3-tel-tx b {
  display: block;
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 700;
  font-size: 13.5px;
  color: #5a1c0c;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
html.lgct-v3 .lgv3-tel-tx i {
  display: block;
  font-style: normal;
  font-size: 10px;
  color: #7a6748;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
html.lgct-v3 .lgv3-tel-chev {
  flex: none;
  display: flex;
  align-items: center;
  gap: 3px;
  padding: 3px 8px;
  border-radius: 999px;
  background: linear-gradient(180deg, #f7d271, #c98d1f);
  border: 1px solid #a8761a;
  color: #4a1d0a;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}
html.lgct-v3 .lgv3-tel-chev i { font-style: normal; }

/* --- nen mo --- */
html.lgct-v3 .lgv3-tel-back[hidden] { display: none !important; }
html.lgct-v3 .lgv3-tel-back {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 1210;
  background: rgba(20, 9, 4, .62);
  opacity: 0;
  transition: opacity .18s ease-out;
}
html.lgct-v3 .lgv3-tel-back.lgv3-tel-in { opacity: 1; }

/* --- tam truot tu day --- */
html.lgct-v3 .lgv3-tel-sheet[hidden] { display: none !important; }
html.lgct-v3 .lgv3-tel-sheet {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1211;
  background: linear-gradient(180deg, var(--lg-cream), var(--lg-paper));
  border-top: 1.5px solid #7a4a22;
  box-shadow: 0 -3px 0 0 #2a1108, 0 -6px 0 0 #b98a3c, 0 -14px 28px rgba(0, 0, 0, .5);
  border-radius: 16px 16px 0 0;
  padding: 8px 12px 14px;
  padding-bottom: calc(14px + env(safe-area-inset-bottom, 0px));
  color: var(--lg-ink);
  max-height: 86vh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  transform: translateY(105%);
  transition: transform .18s ease-out;
}
html.lgct-v3 .lgv3-tel-sheet.lgv3-tel-in { transform: translateY(0); }
/* man rong: khoi noi dung khong keo dai het be ngang */
html.lgct-v3 .lgv3-tel-wrap { max-width: 560px; margin: 0 auto; }

html.lgct-v3 .lgv3-tel-grab {
  width: 44px;
  height: 4px;
  border-radius: 2px;
  background: #c9ab74;
  margin: 0 auto 7px;
}
html.lgct-v3 .lgv3-tel-hd {
  display: flex;
  align-items: center;
  margin-bottom: 7px;
}
html.lgct-v3 .lgv3-tel-hd b {
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 700;
  font-size: 15px;
  color: #5a1c0c;
}
html.lgct-v3 .lgv3-tel-x {
  -webkit-appearance: none;
  appearance: none;
  margin-left: auto;
  width: 26px;
  height: 26px;
  flex: none;
  border-radius: 50%;
  border: 1.5px solid #7a4a22;
  background: #fff7e6;
  display: grid;
  place-items: center;
  font-size: 12px;
  line-height: 1;
  font-weight: 800;
  color: #5a1c0c;
  font-family: inherit;
  cursor: pointer;
}
html.lgct-v3 .lgv3-tel-x:focus { outline: 2px solid var(--lg-gold2); outline-offset: 2px; }

html.lgct-v3 .lgv3-tel-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
html.lgct-v3 .lgv3-tel-row {
  -webkit-appearance: none;
  appearance: none;
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  padding: 6px 8px;
  border-radius: 10px;
  background: #fffdf5;
  border: 1.5px solid #cdb283;
  text-align: left;
  font-family: inherit;
  cursor: pointer;
}
html.lgct-v3 .lgv3-tel-row:focus { outline: 2px solid var(--lg-gold2); outline-offset: 2px; }
html.lgct-v3 .lgv3-tel-row .lgv3-tel-plate { width: 86px; height: 34px; }
html.lgct-v3 .lgv3-tel-row .lgv3-tel-plate img { max-height: 30px; }
html.lgct-v3 .lgv3-tel-row .lgv3-tel-tx b { font-size: 13px; }
html.lgct-v3 .lgv3-tel-row .lgv3-tel-tx i { font-size: 9.5px; }
html.lgct-v3 .lgv3-tel-row img { filter: grayscale(1); opacity: .6; }
html.lgct-v3 .lgv3-tel-rd {
  flex: none;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 2px solid #b98a3c;
  background: #fff;
  display: grid;
  place-items: center;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  color: transparent;
}
html.lgct-v3 .lgv3-tel-row-on {
  background: linear-gradient(180deg, #fdeec4, #f7dfa8);
  border-color: #a8761a;
  box-shadow: 0 0 0 2px rgba(243, 201, 90, .5);
}
html.lgct-v3 .lgv3-tel-row-on img { filter: none; opacity: 1; }
html.lgct-v3 .lgv3-tel-row-on .lgv3-tel-rd {
  background: #1f6b33;
  border-color: #1f6b33;
  color: #fff;
}
html.lgct-v3 .lgv3-tel-nt {
  margin-top: 8px;
  font-size: 10.5px;
  line-height: 1.25;
  color: #7a6748;
  text-align: center;
}

/* --- khoa cuon nen khi tam truot dang mo --- */
html.lgct-v3.lgv3-tel-lock .maincontainer { overflow: hidden !important; }

/* ==========================================================================
   NGANG (dien thoai xoay) - cung nguong voi phan con lai cua lgct-ui.css
   ========================================================================== */
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 .lgv3-tel-trig { gap: 6px; padding: 5px 7px; }
  html.lgct-v3 .lgv3-tel-plate { width: 64px; height: 28px; }
  html.lgct-v3 .lgv3-tel-plate img { max-height: 24px; }
  html.lgct-v3 .lgv3-tel-tx b { font-size: 12.5px; }
  html.lgct-v3 .lgv3-tel-tx i { font-size: 9.5px; }
  html.lgct-v3 .lgv3-tel-chev { font-size: 10px; padding: 2px 6px; }
  /* cot hep: bo khoang menh gia o NUT (danh sach trong tam truot van giu day du) */
  html.lgct-v3 .lgv3-tel-trig .lgv3-tel-rg { display: none; }

  html.lgct-v3 .lgv3-tel-sheet { max-height: 92vh; padding: 6px 12px 10px; }
  html.lgct-v3 .lgv3-tel-wrap { max-width: 100%; }
  html.lgct-v3 .lgv3-tel-grab { margin-bottom: 5px; }
  html.lgct-v3 .lgv3-tel-hd { margin-bottom: 5px; }
  /* xoay ngang chi cao 390px -> xep 2 cot cho khoi tran */
  html.lgct-v3 .lgv3-tel-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }
  html.lgct-v3 .lgv3-tel-row { padding: 5px 7px; gap: 7px; }
  html.lgct-v3 .lgv3-tel-row .lgv3-tel-plate { width: 68px; height: 28px; }
  html.lgct-v3 .lgv3-tel-row .lgv3-tel-plate img { max-height: 24px; }
  html.lgct-v3 .lgv3-tel-row .lgv3-tel-tx b { font-size: 12px; }
  html.lgct-v3 .lgv3-tel-row .lgv3-tel-tx i { font-size: 9px; }
  html.lgct-v3 .lgv3-tel-nt { margin-top: 6px; }
}

/* --- may khong thich hoat canh --- */
@media (prefers-reduced-motion: reduce) {
  html.lgct-v3 .lgv3-tel-sheet,
  html.lgct-v3 .lgv3-tel-back { transition: none; }
}

/* ============================================================================
   VA 12 — 04/09/2026: trang THONG TIN TAI KHOAN kieu "the lon + hai the tab".
   Dung chung voi assets/lgct-ui.css (nap SAU tep do).
   Chi phu len account_v3.tpl; KHONG dung den account.tpl cu.

   Quy uoc:
   - Tien to rieng lgv12- (khong dung lgv3-card-, lgv3-tel-, lgv3-qr-,
     lgv3-usdt-, lgv3-pick-, lgv3-cr-, lgv11-).
   - MOI bo chon deu bat dau bang html.lgct-v3 -> khong bat v3 thi khong anh huong.
   - Hai the tab chay bang CSS thuan (input radio an + selector ~), KHONG can JS.
   - Man ngang: @media (orientation:landscape) and (max-height:560px)
   ============================================================================ */

/* --------------------------------------------------------------------------
   1. KHUNG CHUNG
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv12 {
  display: block;
  font-family: "Be Vietnam Pro", system-ui, "Segoe UI", Roboto, sans-serif;
  color: var(--lg-ink);
}

/* tam giay do dung chung cho the lon va khung tab */
html.lgct-v3 .lgv12-pn {
  background: linear-gradient(180deg, var(--lg-cream), var(--lg-paper));
  border: 1.5px solid #7a4a22;
  border-radius: 10px;
  box-shadow: 0 0 0 2px #2a1108, 0 0 0 3px #b98a3c;
  padding: 11px 12px;
  min-width: 0;
}

/* nhan nho in hoa */
html.lgct-v3 .lgv12-lb {
  font-size: 10.5px;
  font-weight: 700;
  color: #7a6748;
  letter-spacing: .04em;
  text-transform: uppercase;
  line-height: 1.2;
  margin-bottom: 2px;
}

/* --------------------------------------------------------------------------
   2. NUT
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv12-b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  height: 36px;
  padding: 0 14px;
  border-radius: 8px;
  font-size: 13.5px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none;
  cursor: pointer;
}
html.lgct-v3 a.lgv12-b:hover { text-decoration: none; }
html.lgct-v3 .lgv12-b-main {
  background: linear-gradient(180deg, #ffb35c, #f0842a 55%, #d9631a);
  border: 1.5px solid #8a3b0d;
  color: #5a1a05;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.5), 0 1px 0 rgba(0,0,0,.25);
}
html.lgct-v3 .lgv12-b-main:hover { color: #5a1a05; }
html.lgct-v3 .lgv12-b-gold {
  background: linear-gradient(180deg, #f7d271, #c98d1f);
  border: 1.5px solid #8a5b12;
  color: #4a1d0a;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.45);
}
html.lgct-v3 .lgv12-b-gold:hover { color: #4a1d0a; }
html.lgct-v3 .lgv12-b-ghost {
  background: rgba(255,255,255,.6);
  border: 1.5px solid #b08a55;
  color: #6a3a15;
}
html.lgct-v3 .lgv12-b-ghost:hover { color: #6a3a15; }
html.lgct-v3 .lgv12-b-sm { height: 27px; padding: 0 11px; font-size: 11.5px; }
html.lgct-v3 .lgv12-b-full { width: 100%; }

/* --------------------------------------------------------------------------
   3. THE LON (danh tinh + vi + hai nut)
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv12-hero { background: linear-gradient(180deg, #fff7e6, #f2e2c2); }

html.lgct-v3 .lgv12-hero-top {
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
}
html.lgct-v3 .lgv12-av {
  width: 52px; height: 52px; flex: none;
  border-radius: 50%;
  overflow: hidden;
  border: 2px solid #8a5b12;
  background: linear-gradient(180deg, #f7d271, #c98d1f);
  display: flex; align-items: center; justify-content: center;
  box-shadow: inset 0 2px 3px rgba(255,255,255,.5), 0 1px 2px rgba(0,0,0,.3);
}
html.lgct-v3 .lgv12-av img,
html.lgct-v3 .lgv12-av figure,
html.lgct-v3 .lgv12-av svg {
  width: 100%; height: 100%; object-fit: cover; margin: 0; display: block;
}
html.lgct-v3 .lgv12-hero-top .t { flex: 1; min-width: 0; }
html.lgct-v3 .lgv12-nm {
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 700;
  font-size: 19px;
  color: #5a1c0c;
  line-height: 1.18;
  word-break: break-word;
  overflow-wrap: anywhere;
}
html.lgct-v3 .lgv12-rule {
  height: 2px; border-radius: 2px; margin: 9px 0 8px;
  background: linear-gradient(90deg, rgba(201,147,42,0), rgba(201,147,42,.6), rgba(201,147,42,0));
}
html.lgct-v3 .lgv12-hero-bot {
  display: flex; align-items: flex-end; gap: 10px;
}
html.lgct-v3 .lgv12-hero-bot .idc { flex: 1; min-width: 0; }
html.lgct-v3 .lgv12-idrow {
  display: flex; align-items: center; gap: 8px; min-width: 0;
}
/* break-word (KHONG dung break-all): giu duoc be rong min-content nen o ngang
   ten dang nhap khong bi be doc tung chu cai khi cho hep */
html.lgct-v3 .lgv12-idn {
  flex: 1 1 auto; min-width: 0;
  font-size: 14px; font-weight: 800; color: #4a2a12;
  line-height: 1.28;
  word-break: normal; overflow-wrap: break-word;
}
html.lgct-v3 .lgv12-hero-bot .balc { flex: none; text-align: right; }
html.lgct-v3 .lgv12-money {
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-size: 22px; font-weight: 800; color: var(--lg-lac);
  line-height: 1.1; white-space: nowrap;
}
html.lgct-v3 .lgv12-money i {
  font-style: normal; font-size: .62em; font-weight: 700; margin-left: 2px;
}
html.lgct-v3 .lgv12-acts { display: flex; gap: 7px; margin-top: 10px; }
html.lgct-v3 .lgv12-acts .lgv12-b { flex: 1; min-width: 0; }

/* --------------------------------------------------------------------------
   4. HAI THE TAB — CSS thuan, khong JS
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv12-rad {
  position: absolute;
  width: 1px; height: 1px;
  opacity: 0;
  margin: 0; padding: 0; border: 0;
  clip: rect(0 0 0 0);
  overflow: hidden;
  pointer-events: none;
}
html.lgct-v3 .lgv12-tabs { display: flex; gap: 6px; margin-top: 9px; }
html.lgct-v3 .lgv12-tab {
  flex: 1; min-width: 0;
  margin: 0;
  padding: 9px 6px;
  border-radius: 9px 9px 0 0;
  border: 1.5px solid rgba(243,201,90,.4);
  border-bottom: 0;
  background: rgba(255,247,230,.16);
  color: #e6cfa0;
  font-size: 12.5px; font-weight: 800; line-height: 1.1;
  text-align: center;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  cursor: pointer;
  -webkit-user-select: none; user-select: none;
}
html.lgct-v3 .lgv12-tab b {
  font-weight: 800; opacity: .85; margin-left: 3px;
}
html.lgct-v3 #lgv12t1:checked ~ .lgv12-tabs .lgv12-tab1,
html.lgct-v3 #lgv12t2:checked ~ .lgv12-tabs .lgv12-tab2 {
  background: linear-gradient(180deg, #f7d271, #c98d1f);
  border-color: #8a5b12;
  color: #4a1d0a;
}
html.lgct-v3 #lgv12t1:focus-visible ~ .lgv12-tabs .lgv12-tab1,
html.lgct-v3 #lgv12t2:focus-visible ~ .lgv12-tabs .lgv12-tab2 {
  outline: 2px solid #ffd97a; outline-offset: 2px;
}
html.lgct-v3 .lgv12-pane {
  /* 04/09/2026 — sua loi nhin thay: goc vuong PHAI nam duoi the tab dang chon.
     Truoc day co dinh o goc trai, nen khi dang o the tab thu hai thi mep trai
     bi khuyet mot bac trong rat lo. */
  border-radius: 10px;
  margin-top: -1px;
}
html.lgct-v3 #lgv12t1:checked ~ .lgv12-pane { border-top-left-radius: 0; }
html.lgct-v3 #lgv12t2:checked ~ .lgv12-pane { border-top-right-radius: 0; }
/* trang thai mac dinh: hien phan Lien ket, an phan Tai khoan phu.
   Neu CSS nay khong nap duoc thi CA HAI phan van hien (khong an cung trong HTML). */
html.lgct-v3 .lgv12-p2 { display: none; }
html.lgct-v3 #lgv12t2:checked ~ .lgv12-p1 { display: none; }
html.lgct-v3 #lgv12t2:checked ~ .lgv12-p2 { display: block; }

/* --------------------------------------------------------------------------
   5. DONG LIEN KET SOCIAL
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv12-lks { display: flex; flex-direction: column; gap: 8px; }
html.lgct-v3 .lgv12-lk {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 10px;
  border-radius: 9px;
  min-width: 0;
  background: linear-gradient(180deg, #fffdf6, #f4e8cd);
  border: 1.5px solid #7a4a22;
  box-shadow: 0 0 0 1px #2a1108;
}
/* chua lien ket: vien DUT — phan biet duoc ma khong can nhin mau */
html.lgct-v3 .lgv12-lk.lgv12-off {
  background: linear-gradient(180deg, #f7f0e2, #eadfc6);
  border-style: dashed;
  border-color: #a9814a;
  box-shadow: none;
}
html.lgct-v3 .lgv12-ic {
  width: 34px; height: 34px; flex: none;
  padding: 6px;
  border-radius: 9px;
  background: #fff;
  border: 1.5px solid #d8c49a;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
html.lgct-v3 .lgv12-ic svg { width: 100%; height: 100%; display: block; }
html.lgct-v3 .lgv12-lk .t { flex: 1; min-width: 0; }
html.lgct-v3 .lgv12-lk .t .s {
  font-size: 13px; font-weight: 800; color: #4a2a12; line-height: 1.2;
}
html.lgct-v3 .lgv12-lk .t .d {
  font-size: 11px; color: #7a6748; line-height: 1.3; margin-top: 2px;
  word-break: break-word; overflow-wrap: anywhere;
}
html.lgct-v3 .lgv12-lk .r {
  flex: none; display: flex; align-items: center; gap: 7px;
}

html.lgct-v3 .lgv12-st {
  display: inline-flex; align-items: center; gap: 4px;
  flex: none;
  border-radius: 999px;
  padding: 4px 8px;
  font-size: 10.5px; font-weight: 800; line-height: 1;
  white-space: nowrap;
}
html.lgct-v3 .lgv12-st .g { font-size: 11px; line-height: 1; font-weight: 800; }
html.lgct-v3 .lgv12-st-on {
  background: #dff0d8; color: #1a5c2c; border: 1.5px solid #6ea36a;
}
html.lgct-v3 .lgv12-st-off {
  background: #f2e7d2; color: #8a4a12; border: 1.5px dashed #b0822f;
}

/* --------------------------------------------------------------------------
   6. THANH TIEN DO LIEN KET
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv12-prg { margin-top: 10px; }
html.lgct-v3 .lgv12-prg .lb2 {
  display: flex; justify-content: space-between;
  font-size: 10.5px; font-weight: 800; color: #7a6748;
  letter-spacing: .03em; margin-bottom: 4px;
}
html.lgct-v3 .lgv12-prg .lb2 b { color: #6a3a15; font-weight: 800; }
html.lgct-v3 .lgv12-prg .bar2 {
  height: 9px; border-radius: 999px;
  background: #e4d4b2; border: 1px solid #c2a877;
  overflow: hidden; display: flex;
}
html.lgct-v3 .lgv12-prg .bar2 i {
  display: block; height: 100%;
  background: linear-gradient(180deg, #f7d271, #c98d1f);
}
html.lgct-v3 .lgv12-w0 i { width: 0; }
html.lgct-v3 .lgv12-w1 i { width: 33.33%; }
html.lgct-v3 .lgv12-w2 i { width: 66.66%; }
html.lgct-v3 .lgv12-w3 i { width: 100%; }

/* --------------------------------------------------------------------------
   7. TAI KHOAN PHU
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv12-subs { display: flex; flex-direction: column; gap: 7px; }
html.lgct-v3 .lgv12-sub {
  display: flex; align-items: center; gap: 9px;
  padding: 7px 9px;
  border-radius: 9px;
  min-width: 0;
  background: linear-gradient(180deg, #fffdf6, #f4e8cd);
  border: 1.5px solid #7a4a22;
  box-shadow: 0 0 0 1px #2a1108;
}
html.lgct-v3 .lgv12-sub.lgv12-cur {
  background: linear-gradient(180deg, #fff1c8, #f5dc9a);
  border-color: #c98d1f;
  box-shadow: 0 0 0 1px #2a1108, 0 0 0 3px rgba(243,201,90,.45);
}
html.lgct-v3 .lgv12-dot {
  width: 26px; height: 26px; flex: none;
  border-radius: 50%;
  background: linear-gradient(180deg, #f7d271, #c98d1f);
  border: 1.5px solid #8a5b12;
  display: flex; align-items: center; justify-content: center;
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-size: 13px; font-weight: 800; color: #5a2a08; line-height: 1;
}
html.lgct-v3 .lgv12-sub .n {
  flex: 1; min-width: 0;
  font-size: 12.5px; font-weight: 800; color: #4a2a12; line-height: 1.25;
  word-break: break-word; overflow-wrap: anywhere;
}
html.lgct-v3 .lgv12-sub .n i {
  display: block; font-style: normal;
  font-size: 10px; font-weight: 800; color: #6a3a15;
  margin-top: 2px; letter-spacing: .02em;
}
html.lgct-v3 .lgv12-sub .n i.mut { color: #7a6748; font-weight: 700; }
html.lgct-v3 .lgv12-empty {
  padding: 14px 10px;
  border-radius: 9px;
  border: 1.5px dashed #a9814a;
  background: linear-gradient(180deg, #f7f0e2, #eadfc6);
  text-align: center;
  font-size: 12px; font-weight: 700; color: #6a3a15; line-height: 1.5;
}

/* --------------------------------------------------------------------------
   8. GHI CHU CHAN KHUNG
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv12-note {
  margin-top: 10px;
  padding-top: 9px;
  border-top: 1px dashed rgba(122,74,34,.3);
  font-size: 11px; color: #7a6748; line-height: 1.5;
}
html.lgct-v3 .lgv12-note b { color: #6a3a15; font-weight: 800; }

/* --------------------------------------------------------------------------
   9. MAN NGANG (dien thoai nam ngang)
   -------------------------------------------------------------------------- */
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 .lgv12-pn { padding: 9px 11px; border-radius: 9px; }

  /* the lon trai het chieu ngang: anh - ten - ten dang nhap - so du - hai nut.
     Moi o deu co min-width de khi cho hep thi chu xuong dong tu nhien,
     KHONG bao gio bi ep thanh cot mot chu cai. */
  html.lgct-v3 .lgv12-hero { display: flex; align-items: center; gap: 10px; }
  html.lgct-v3 .lgv12-hero-top { flex: 1 1 30%; min-width: 160px; }
  html.lgct-v3 .lgv12-av { width: 42px; height: 42px; }
  html.lgct-v3 .lgv12-nm { font-size: 16.5px; }
  html.lgct-v3 .lgv12-rule {
    width: 2px; height: auto; margin: 0; flex: none; align-self: stretch;
    background: linear-gradient(180deg, rgba(201,147,42,0), rgba(201,147,42,.6), rgba(201,147,42,0));
  }
  html.lgct-v3 .lgv12-hero-bot {
    flex: 1 1 26%; min-width: 190px;
    align-items: center; gap: 12px;
  }
  html.lgct-v3 .lgv12-hero-bot .idc { min-width: 96px; }
  html.lgct-v3 .lgv12-idrow { flex-wrap: wrap; gap: 5px 8px; }
  html.lgct-v3 .lgv12-idn { flex: 1 1 100%; }
  html.lgct-v3 .lgv12-acts { margin-top: 0; flex: 0 0 auto; }
  html.lgct-v3 .lgv12-acts .lgv12-b { flex: none; }

  html.lgct-v3 .lgv12-tabs { margin-top: 8px; max-width: 430px; }
  html.lgct-v3 .lgv12-pane { border-radius: 0 9px 9px 9px; }

  /* ba cong lien ket xep thanh 3 cot */
  html.lgct-v3 .lgv12-lks {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    align-items: start;
  }
  html.lgct-v3 .lgv12-lk { flex-wrap: wrap; padding: 7px 9px; gap: 8px; }
  html.lgct-v3 .lgv12-lk .r { width: 100%; justify-content: flex-start; }

  /* tai khoan phu xep 3 cot */
  html.lgct-v3 .lgv12-subs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    align-items: start;
  }
  /* khung rong trai het be ngang luoi, khong nam gon mot cot */
  html.lgct-v3 .lgv12-lks .lgv12-empty,
  html.lgct-v3 .lgv12-subs .lgv12-empty { grid-column: 1 / -1; }

  html.lgct-v3 .lgv12-note { margin-top: 8px; padding-top: 7px; font-size: 10.5px; }
  html.lgct-v3 .lgv12-prg { margin-top: 8px; }
}

/* --------------------------------------------------------------------------
   10. MAN RAT THAP (ngang tren may nho)
   -------------------------------------------------------------------------- */
@media (orientation: landscape) and (max-height: 400px) {
  html.lgct-v3 .lgv12-av { width: 38px; height: 38px; }
  html.lgct-v3 .lgv12-nm { font-size: 15.5px; }
  html.lgct-v3 .lgv12-money { font-size: 20px; }
  html.lgct-v3 .lgv12-b { height: 32px; font-size: 12.5px; padding: 0 12px; }
}

/* nut "Vao tai khoan" o tung dong tai khoan phu (04/09/2026) */
html.lgct-v3 .lgv12-swf { margin: 0; flex: 0 0 auto; }
html.lgct-v3 .lgv12-sub { display: flex; align-items: center; gap: 8px; }
html.lgct-v3 .lgv12-sub .n { flex: 1 1 auto; min-width: 0; }

/* ============================================================================
   VA 11 - Trang MUA GOI (ajax/buypackage/buypackage_v3.tpl)
   Ban duoc duyet: PHUONG AN 2 = luoi 2 cot + bang gia, chi tiet kieu bien lai.
   Ngay: 04/09/2026

   QUY TAC:
   - Nap SAU /assets/lgct-ui.css (the <link> nam ngay dau buypackage_v3.tpl).
   - MOI bo chon deu bat dau bang html.lgct-v3  -> giao dien cu khong doi 1 pixel.
   - Tien to lop rieng: lgv11-  (khong dung lai lgv3-card-/tel-/qr-/usdt-/pick-/cr-)
   - Khong dong toi cac quy tac an toan tien bac cua VA2 trong lgct-ui.css:
     .modal[id^="pack"] .modal-footer  (padding-bottom 84px, nut do dam,
     pointer-events khoa 400ms cho toi khi co lop lgv3-armed, chu ::after
     "Bam la tru tien ngay, khong hoi lai." / "Goi nay hien khong mua duoc.").
     O day CHI doi thu tu (order:-1) de dong canh bao nam TREN nut.
   ============================================================================ */

html.lgct-v3 {
  --g11-knb: #2f6db5;
  --g11-vip: #b8860b;
  --g11-qua: #3f7d4a;
  --g11-dac: #7a3f9b;
  --g11-tp:  #1f7a86;
  --g11-ev:  #b5432f;
  --g11-sp:  #8a6a2a;
}

/* ==========================================================================
   1. KHUNG TRANG
   ========================================================================== */
html.lgct-v3 .lgv11-wrap {
  background: none;
  border: 0;
  box-shadow: none;
  padding: 0;
  margin: 0 0 4px;
  color: var(--lg-ink);
}
html.lgct-v3 .lgv11-wrap * { min-width: 0; }

/* ==========================================================================
   2. BANG SU KIEN GIAM GIA
   ========================================================================== */
html.lgct-v3 .lgv11-evt {
  display: block;
  margin: 0 0 8px;
  padding: 6px 10px;
  border-radius: 9px;
  background: linear-gradient(90deg, rgba(143,29,20,.94), rgba(89,17,11,.94));
  border: 1px solid #c9932a;
  color: #ffe9c9;
  font-size: 11px;
  line-height: 1.35;
}
html.lgct-v3 .lgv11-evt b { color: #ffd97a; }

/* ==========================================================================
   3. THANH THE LOAI (nav-pills goc, chi doi cach bay)
   ========================================================================== */
html.lgct-v3 .lgv11-tabrow {
  margin: 0 !important;
  --bs-gutter-x: 0;
}
/* lgct-ui.css da co #myshop (sticky, vien kem, nen giay do) danh cho ban cu -
   ban nay bo khung giay ngoai nen phai ve lai thanh dai toi. Dung #myshop
   trong bo chon de thang do dac hieu (1,3,1) > (1,2,1). */
html.lgct-v3 #myshop.lgv11-tabs {
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: flex-start !important;
  gap: 5px !important;
  max-width: none !important;
  margin: 0 -12px 9px !important;
  padding: 3px 12px 7px !important;
  list-style: none;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  background: linear-gradient(180deg, rgba(22,10,6,.94) 72%, rgba(22,10,6,0)) !important;
}
html.lgct-v3 #myshop.lgv11-tabs::-webkit-scrollbar { height: 0; width: 0; display: none; }
html.lgct-v3 #myshop.lgv11-tabs > .nav-item {
  flex: 0 0 auto;
  margin: 0 !important;
  padding: 0 !important;
  background-color: transparent !important;
  border-radius: 0 !important;
}
html.lgct-v3 #myshop.lgv11-tabs .nav-link {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px 10px !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, rgba(255,247,230,.15), rgba(255,247,230,.05)) !important;
  border: 1px solid rgba(247,210,113,.42) !important;
  color: #ecd8b0 !important;
  font-weight: 800 !important;
  font-size: 11.5px !important;
  line-height: 1.15;
  white-space: nowrap;
}
/* #more-tab bat/tat cac the loai phu bang lop d-none - phai giu nguyen hieu luc */
html.lgct-v3 #myshop.lgv11-tabs .nav-link.d-none,
html.lgct-v3 #myshop.lgv11-tabs .d-none { display: none !important; }
html.lgct-v3 #myshop.lgv11-tabs .nav-link .icon { display: none !important; }
html.lgct-v3 #myshop.lgv11-tabs .nav-link.active {
  background: linear-gradient(180deg, #ffb35c, #f0842a 55%, #d9631a) !important;
  border-color: #8a3b0d !important;
  color: #5a1a05 !important;
  box-shadow: inset 0 1px 0 #ffe0a8, 0 2px 6px rgba(0,0,0,.35);
}
html.lgct-v3 #myshop.lgv11-tabs #more-tab {
  padding: 6px 9px !important;
  background: linear-gradient(180deg, #f7d271, #c98d1f) !important;
  color: #4a1d0a !important;
  border-color: #a8761a !important;
}
html.lgct-v3 #myshop.lgv11-tabs #more-tab .icon { display: inline-flex !important; font-size: 12px !important; }
html.lgct-v3 #myshop.lgv11-tabs #more-tab .icon center { display: inline; }
html.lgct-v3 #myshop.lgv11-tabs #more-tab .title { font-size: 11px !important; }

html.lgct-v3 .lgv11-wrap #myshopContent { margin-left: auto; margin-right: auto; }

/* ==========================================================================
   4. LUOI GOI - 2 COT
   ========================================================================== */
html.lgct-v3 .lgv11-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  align-items: stretch;
}
html.lgct-v3 .lgv11-cell { min-width: 0; display: flex; }

html.lgct-v3 .lgv11-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  min-width: 0;
  overflow: hidden;
  text-decoration: none !important;
  color: var(--lg-ink);
  background: linear-gradient(180deg, var(--lg-cream), var(--lg-paper));
  border: 1.5px solid #7a4a22;
  border-radius: 10px;
  box-shadow: 0 0 0 2px #2a1108, 0 0 0 3px #b98a3c;
}
html.lgct-v3 .lgv11-card.lgv11-off { filter: grayscale(.55); opacity: .78; }

/* dai mau nhom tren noc o */
html.lgct-v3 .lgv11-rib { display: block; width: 100%; height: 4px; flex: none; }
html.lgct-v3 .lgv11-rib.lgv11-g-knb { background: linear-gradient(90deg, #2f6db5, #7fb0e6); }
html.lgct-v3 .lgv11-rib.lgv11-g-vip { background: linear-gradient(90deg, #b8860b, #f3d071); }
html.lgct-v3 .lgv11-rib.lgv11-g-qua { background: linear-gradient(90deg, #3f7d4a, #8ecb99); }
html.lgct-v3 .lgv11-rib.lgv11-g-dac { background: linear-gradient(90deg, #7a3f9b, #c79ae0); }
html.lgct-v3 .lgv11-rib.lgv11-g-tp  { background: linear-gradient(90deg, #1f7a86, #7fd0da); }
html.lgct-v3 .lgv11-rib.lgv11-g-ev  { background: linear-gradient(90deg, #b5432f, #eb9179); }
html.lgct-v3 .lgv11-rib.lgv11-g-sp  { background: linear-gradient(90deg, #8a6a2a, #dfc079); }

/* nhan goc o */
html.lgct-v3 .lgv11-bd {
  position: absolute; top: 7px; left: 6px; z-index: 2;
  display: flex; flex-direction: column; align-items: flex-start; gap: 3px;
  max-width: 62%;
}
html.lgct-v3 .lgv11-gt { position: absolute; top: 7px; right: 6px; z-index: 2; max-width: 56%; }

html.lgct-v3 .lgv11-tag {
  display: inline-flex; align-items: center;
  font-size: 9px; font-weight: 800; line-height: 1;
  padding: 2.5px 6px; border-radius: 999px; white-space: nowrap;
  border: 1px solid rgba(0,0,0,.18);
  max-width: 100%; overflow: hidden; text-overflow: ellipsis;
}
html.lgct-v3 .lgv11-tag.lgv11-g-knb { background: #e3edfa; color: #1d4a80; border-color: #8fb4de; }
html.lgct-v3 .lgv11-tag.lgv11-g-vip { background: #fbf0d2; color: #7a5806; border-color: #dcbb63; }
html.lgct-v3 .lgv11-tag.lgv11-g-qua { background: #e4f2e5; color: #28572f; border-color: #8bbd93; }
html.lgct-v3 .lgv11-tag.lgv11-g-dac { background: #f0e6f7; color: #552877; border-color: #b48fcd; }
html.lgct-v3 .lgv11-tag.lgv11-g-tp  { background: #ddf2f4; color: #14545c; border-color: #86c3cb; }
html.lgct-v3 .lgv11-tag.lgv11-g-ev  { background: #fbe4de; color: #8a2f1e; border-color: #dfa08c; }
html.lgct-v3 .lgv11-tag.lgv11-g-sp  { background: #f6eed6; color: #6a4f13; border-color: #cbae6a; }

html.lgct-v3 .lgv11-lim {
  display: inline-flex; align-items: center;
  font-size: 9px; font-weight: 800; line-height: 1;
  padding: 2.5px 6px; border-radius: 999px; white-space: nowrap;
  background: #c8261c; color: #fff; border: 1px solid #ffd27a;
}
html.lgct-v3 .lgv11-lim.lgv11-n2 { background: #f39c12; color: #3a1207; }
html.lgct-v3 .lgv11-lim.lgv11-nd { background: #8f1d14; color: #ffe1b0; }

/* than o */
html.lgct-v3 .lgv11-in {
  display: flex; flex-direction: column; align-items: center;
  gap: 4px; width: 100%; min-width: 0;
  padding: 25px 8px 6px;
}

/* khung anh goi: mau vien phan biet nhom (goi dung chung anh tui tien) */
html.lgct-v3 .lgv11-art {
  position: relative; flex: none; display: block;
  border-radius: 9px; border: 2px solid #b98a3c; overflow: hidden;
  background: radial-gradient(circle at 50% 40%, #fffaf0, #efdfbe);
}
html.lgct-v3 .lgv11-art.lgv11-g-knb { border-color: var(--g11-knb); background: radial-gradient(circle at 50% 40%, #f2f7fd, #d9e6f5); }
html.lgct-v3 .lgv11-art.lgv11-g-vip { border-color: var(--g11-vip); background: radial-gradient(circle at 50% 40%, #fff9e8, #f3e3b8); }
html.lgct-v3 .lgv11-art.lgv11-g-qua { border-color: var(--g11-qua); background: radial-gradient(circle at 50% 40%, #f3faf3, #dcecdd); }
html.lgct-v3 .lgv11-art.lgv11-g-dac { border-color: var(--g11-dac); background: radial-gradient(circle at 50% 40%, #faf4fd, #e8daf2); }
html.lgct-v3 .lgv11-art.lgv11-g-tp  { border-color: var(--g11-tp);  background: radial-gradient(circle at 50% 40%, #f0fafb, #d6ecef); }
html.lgct-v3 .lgv11-art.lgv11-g-ev  { border-color: var(--g11-ev);  background: radial-gradient(circle at 50% 40%, #fef4f1, #f6ddd4); }
html.lgct-v3 .lgv11-art.lgv11-g-sp  { border-color: var(--g11-sp);  background: radial-gradient(circle at 50% 40%, #fdf8ea, #eee0bf); }

/* .my-box giu nguyen (anh goi la background do user.css cap theo lop $pic),
   chi doi kich thuoc. Do dac hieu (0,4,1) > quy tac 58px/46px/68px cua lgct-ui.css. */
html.lgct-v3 .lgv11-art.my-lgct_package .my-box {
  display: block !important;
  position: static !important;
  top: auto !important; left: auto !important;
  width: 100% !important; height: 100% !important;
  background-size: contain !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  flex: none !important;
}
html.lgct-v3 .lgv11-grid .lgv11-art { width: 54px; height: 54px; }

/* ten goi: KHONG cat cut, xuong toi da 3 dong */
html.lgct-v3 .lgv11-nm {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  width: 100%; min-width: 0;
  text-align: center;
  font-weight: 800; font-size: 12px; line-height: 1.2;
  color: #5a1c0c;
  min-height: 29px;
  overflow-wrap: break-word;
  word-break: break-word;
}

/* bang gia duoi chan o */
html.lgct-v3 .lgv11-bar {
  margin-top: auto; width: 100%;
  display: flex; align-items: baseline; justify-content: center;
  flex-wrap: wrap; gap: 2px 6px;
  padding: 5px 6px;
  border-top: 1px dashed rgba(122,74,34,.4);
  background: linear-gradient(180deg, rgba(255,242,212,.6), rgba(240,223,182,.85));
}
html.lgct-v3 .lgv11-old {
  font-size: 10.5px; font-weight: 700; color: #9a8461;
  text-decoration: line-through; white-space: nowrap;
}
html.lgct-v3 .lgv11-now {
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 800; color: var(--lg-lac);
  white-space: nowrap; font-size: 15px; line-height: 1.15;
}

/* ly do goi bi khoa */
html.lgct-v3 .lgv11-card .lgv11-why {
  display: block; width: 100%;
  text-align: center;
  font-size: 9.5px !important;
  font-weight: 800; font-style: italic;
  color: #8f1d14;
  line-height: 1.2;
  padding: 3px 4px !important;
  background: rgba(143,29,20,.10);
}

/* ==========================================================================
   5. TRANG CHI TIET KIEU BIEN LAI (bootstrap modal #pack{k})
   ========================================================================== */
html.lgct-v3 .lgv11-sheet .modal-content {
  display: flex;
  flex-direction: column;
  overflow: hidden !important;
  max-height: 95vh;
  max-height: 95dvh;
}
html.lgct-v3 .lgv11-dbody {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  padding: 2px 14px 10px;
}
html.lgct-v3 .lgv11-dbody::-webkit-scrollbar { width: 5px; }
html.lgct-v3 .lgv11-dbody::-webkit-scrollbar-thumb { background: rgba(201,147,42,.55); border-radius: 3px; }

/* dau hop: khoi gon anh + ten + nhan */
html.lgct-v3 .lgv11-dhead {
  display: flex; align-items: center; gap: 10px;
  padding: 7px 9px;
  border-radius: 10px;
  border: 1px solid #c9932a;
  background: linear-gradient(180deg, #fffaf0, #f4e7c9);
}
html.lgct-v3 .lgv11-dhead .lgv11-art { width: 66px; height: 66px; }
html.lgct-v3 .lgv11-dhm { flex: 1 1 auto; min-width: 0; }
html.lgct-v3 .lgv11-dhn {
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 700; font-size: 16px; line-height: 1.18;
  color: #5a1c0c;
  overflow-wrap: break-word; word-break: break-word;
}
html.lgct-v3 .lgv11-dhb { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 5px; }

/* dai gia rieng */
html.lgct-v3 .lgv11-rcp {
  margin-top: 7px;
  padding: 6px 10px;
  border-radius: 9px;
  border: 1px solid #c9932a;
  background: linear-gradient(180deg, #fffaf0, #f4e7c9);
}
html.lgct-v3 .lgv11-ln {
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 8px; padding: 2px 0;
  font-size: 11.5px; color: #5f4526;
}
html.lgct-v3 .lgv11-ln .lgv11-v {
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 700; color: #4b3620; white-space: nowrap;
}
html.lgct-v3 .lgv11-ln.lgv11-sale .lgv11-v { color: #2b6b3a; }
html.lgct-v3 .lgv11-ln .lgv11-v.lgv11-old { font-family: "Be Vietnam Pro", system-ui, sans-serif; }
html.lgct-v3 .lgv11-cut { height: 0; border-top: 1px dashed rgba(122,74,34,.5); margin: 5px 0; }
html.lgct-v3 .lgv11-tot { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
html.lgct-v3 .lgv11-tot .lgv11-k { font-size: 12px; font-weight: 800; color: #5a3416; letter-spacing: .02em; }
html.lgct-v3 .lgv11-tot .lgv11-now { font-size: 22px; line-height: 1.05; }

html.lgct-v3 .lgv11-dwhy {
  margin-top: 7px;
  padding: 5px 9px;
  border-radius: 8px;
  background: rgba(143,29,20,.10);
  border: 1px solid rgba(143,29,20,.30);
  color: #8f1d14; font-weight: 800; font-size: 11px; line-height: 1.25;
  text-align: center;
}

/* tieu de muc */
html.lgct-v3 .lgv11-sec { display: flex; align-items: baseline; gap: 6px; margin: 8px 0 4px; }
html.lgct-v3 .lgv11-sec h3 {
  margin: 0; font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-size: 13px; font-weight: 700; color: #5a3416;
}
html.lgct-v3 .lgv11-hr {
  flex: 1 1 auto; height: 1px;
  background: linear-gradient(90deg, rgba(122,74,34,.35), rgba(122,74,34,0));
}

/* ---- luoi vat pham 4 cot ----
   HTML vat pham do buypackage.php sinh san: hang <div class="d-flex ..."> boc 3 o
   <div class="itembg"><div class="boxitem" data-bs-title="ten"><img></div>
   <div class="textitem" style="margin-left:NNpx !important">so luong</div></div>
   -> display:contents de bo hang 3, roi bay lai thanh luoi 4 cot.
   -> .textitem dinh goc phai bang "right", nen margin-left noi tuyen khong con y nghia. */
html.lgct-v3 .lgv11-items {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}
html.lgct-v3 .lgv11-items > .d-flex { display: contents !important; }
html.lgct-v3 .lgv11-items .itembg {
  width: auto !important;
  height: auto !important;
  background: none !important;
  position: relative;
  min-width: 0;
  margin: 0;
  padding: 0 0 27px;
}
html.lgct-v3 .lgv11-items .itembg .boxitem {
  position: relative;
  width: 100%;
  height: 0;
  padding: 100% 0 0 0 !important;
  border-radius: 8px;
  border: 1.5px solid #8a6a3a;
  background: #2a1c12;
}
html.lgct-v3 .lgv11-items .itembg .boxitem img {
  position: absolute;
  top: 0; left: 0;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain;
  display: block;
  padding: 3px;
}
html.lgct-v3 .lgv11-items .itembg .boxitem::after {
  content: attr(data-bs-title);
  position: absolute;
  left: -3px; right: -3px;
  top: 100%;
  margin-top: 3px;
  font-size: 9px; line-height: 1.15; font-weight: 600;
  color: #5f4526; text-align: center;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
/* so luong: the nen toi vien vang, doc duoc tren anh sang */
html.lgct-v3 .lgv11-items .itembg .textitem {
  position: absolute;
  right: 3px; bottom: 30px;
  left: auto; top: auto;
  margin-top: 0 !important;
  white-space: nowrap;
  background: rgba(20,9,4,.88);
  border: 1px solid rgba(247,210,113,.70);
  border-radius: 5px;
  padding: 2px 4px;
  color: #ffd97a !important;
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-shadow: none !important;
}
html.lgct-v3 .lgv11-items .itembg .textitem:empty { display: none; }
html.lgct-v3 .lgv11-items .itembg .boxitem:empty { background: none; border: 0; }
html.lgct-v3 .lgv11-items .itembg:not(:has(img)) { display: none; }
html.lgct-v3 .lgv11-items .itembg.lgv11-void { display: none; }

/* ghi chu rieng cua goi */
html.lgct-v3 .lgv11-note {
  margin-top: 9px;
  padding: 6px 9px;
  border-left: 3px solid var(--lg-gold2);
  border-radius: 0 7px 7px 0;
  background: rgba(122,74,34,.07);
  color: #6b5334;
  font-size: 10.5px; line-height: 1.4;
}
html.lgct-v3 .lgv11-note b { color: #8f1d14; }
html.lgct-v3 .lgv11-note img { max-width: 100%; height: auto; }

/* ---- chan hop: canh bao + nut mua ----
   Giu nguyen lop .modal-footer de cac quy tac an toan VA2 trong lgct-ui.css
   va lgct-ui.js (lgv3-armed / lgv3-sold) tiep tuc chay. Chi doi cho dat. */
html.lgct-v3 .lgv11-sheet .modal-footer {
  flex: 0 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  padding-top: 8px !important;
  padding-left: 14px !important;
  padding-right: 14px !important;
  background: linear-gradient(180deg, rgba(246,234,208,0), rgba(238,220,178,.92) 42%);
  box-shadow: 0 -1px 0 rgba(122,74,34,.22);
}
/* dua dong "Bam la tru tien ngay, khong hoi lai." len TREN nut */
html.lgct-v3 .lgv11-sheet .modal-footer::after {
  order: -1;
  margin-top: 0 !important;
  margin-bottom: 7px !important;
  font-size: 11px;
  font-weight: 700;
  color: #8f1d14;
  opacity: 1;
}
html.lgct-v3 .lgv11-sheet .modal-footer.lgv3-sold::after { color: #7a6748; font-weight: 700; }

html.lgct-v3 .lgv11-sheet .modal-footer form { width: 100%; margin: 0; }
html.lgct-v3 .lgv11-sheet .modal-footer .lgv11-buy {
  width: 100%;
  min-width: 0 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 13px 12px !important;
  border-radius: 11px !important;
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-size: 15px !important;
  font-weight: 800 !important;
  letter-spacing: .01em;
}
html.lgct-v3 .lgv11-sheet .modal-footer .lgv11-buy .lgv11-amt { font-size: 16px; }
html.lgct-v3 .lgv11-sheet .modal-footer .lgv11-buy .spinner-border { flex: none; }

/* con quay khi dang gui (truoc day nam trong <style> cua buypackage.tpl) */
html.lgct-v3 .has-spinner.loading { cursor: progress; }
html.lgct-v3 .has-spinner.loading .spinner-border { display: block !important; margin-top: 5px; }

/* ==========================================================================
   6. MAN NGANG (dien thoai xoay ngang)
   ========================================================================== */
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 .lgv11-evt { font-size: 10px; padding: 5px 8px; margin-bottom: 6px; }
  html.lgct-v3 #myshop.lgv11-tabs { margin-bottom: 7px !important; padding-bottom: 5px !important; }
  html.lgct-v3 #myshop.lgv11-tabs .nav-link { padding: 5px 10px !important; font-size: 11px !important; }

  html.lgct-v3 .lgv11-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }
  html.lgct-v3 .lgv11-grid .lgv11-art { width: 42px; height: 42px; }
  html.lgct-v3 .lgv11-in { padding: 22px 6px 5px; gap: 3px; }
  html.lgct-v3 .lgv11-nm { font-size: 11px; min-height: 26px; }
  html.lgct-v3 .lgv11-now { font-size: 13.5px; }
  html.lgct-v3 .lgv11-old { font-size: 9.5px; }
  html.lgct-v3 .lgv11-bd { top: 5px; left: 4px; }
  html.lgct-v3 .lgv11-gt { top: 5px; right: 4px; }

  html.lgct-v3 .lgv11-sheet .modal-content { max-height: 100dvh; }
  html.lgct-v3 .lgv11-dbody {
    display: grid;
    grid-template-columns: 38% 1fr;
    grid-template-areas: "l r" "n r";
    align-content: start;
    gap: 8px 11px;
    padding: 2px 12px 8px;
  }
  html.lgct-v3 .lgv11-dl { grid-area: l; min-width: 0; }
  html.lgct-v3 .lgv11-dr { grid-area: r; min-width: 0; }
  html.lgct-v3 .lgv11-dn { grid-area: n; min-width: 0; }

  html.lgct-v3 .lgv11-dhead { padding: 6px 9px; gap: 8px; }
  html.lgct-v3 .lgv11-dhead .lgv11-art { width: 48px; height: 48px; }
  html.lgct-v3 .lgv11-dhn { font-size: 14px; }
  html.lgct-v3 .lgv11-rcp { margin-top: 6px; padding: 5px 10px; }
  html.lgct-v3 .lgv11-ln { padding: 1px 0; font-size: 11px; }
  html.lgct-v3 .lgv11-cut { margin: 3px 0; }
  html.lgct-v3 .lgv11-tot .lgv11-now { font-size: 20px; }
  html.lgct-v3 .lgv11-sec { margin: 0 0 4px; }
  html.lgct-v3 .lgv11-items { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; }
  html.lgct-v3 .lgv11-items .itembg { padding-bottom: 24px; }
  html.lgct-v3 .lgv11-items .itembg .textitem { bottom: 27px; font-size: 9.5px !important; }
  html.lgct-v3 .lgv11-items .itembg .boxitem::after { font-size: 8.5px; -webkit-line-clamp: 2; }
  html.lgct-v3 .lgv11-note { margin-top: 0; font-size: 9.5px; padding: 5px 8px; }
  html.lgct-v3 .lgv11-dwhy { font-size: 10px; padding: 4px 8px; }
  html.lgct-v3 .lgv11-sheet .modal-footer { padding-top: 6px !important; }
  html.lgct-v3 .lgv11-sheet .modal-footer::after { margin-bottom: 5px !important; font-size: 10.5px; }
  html.lgct-v3 .lgv11-sheet .modal-footer .lgv11-buy { padding: 9px 12px !important; font-size: 14px !important; }
}

/* ==========================================================================
   7. MAN RONG
   ========================================================================== */
@media (min-width: 560px) and (min-height: 561px) {
  html.lgct-v3 .lgv11-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 900px) {
  html.lgct-v3 .lgv11-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; }
  html.lgct-v3 .lgv11-grid .lgv11-art { width: 62px; height: 62px; }
  html.lgct-v3 .lgv11-nm { font-size: 13px; }
  html.lgct-v3 .lgv11-now { font-size: 16px; }
  html.lgct-v3 #myshop.lgv11-tabs {
    justify-content: center !important;
    flex-wrap: wrap !important;
    margin-left: 0 !important; margin-right: 0 !important;
    padding-left: 0 !important; padding-right: 0 !important;
  }
  html.lgct-v3 .lgv11-items { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

/* man rat thap: giam chieu cao o */
@media (max-height: 380px) {
  html.lgct-v3 .lgv11-grid .lgv11-art { width: 36px; height: 36px; }
  html.lgct-v3 .lgv11-in { padding: 20px 5px 4px; }
  html.lgct-v3 .lgv11-nm { font-size: 10.5px; min-height: 24px; }
}

/* ==========================================================================
   VA 13 — o chon tai khoan tren man CHON NHAN VAT (04/09/2026)
   Truoc day day chi la nhan de xem. Nay bam duoc de doi sang tai khoan phu,
   vi muon mua goi cho nhan vat cua tai khoan phu thi phai dang o tai khoan do.
   ========================================================================== */
html.lgct-v3 #index_content .lgv3-subs {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
  margin: 6px 0 2px;
}
/* Nhan "Chon tai khoan:" — PHAI xoa han nen/vien, vi luat CU
   'html.lgct-v3 .lgv3-subs span' to nen toi cho MOI the span, lam chu chim vao nen. */
html.lgct-v3 #index_content .lgv3-subs > span:first-child {
  font-size: 11.5px;
  font-weight: 600;
  color: #cbb188;
  margin-right: 2px;
  background: none;
  border: 0;
  padding: 0;
  border-radius: 0;
}
html.lgct-v3 #index_content .lgv3-subs .go,
html.lgct-v3 #index_content .lgv3-subs > span:not(:first-child) {
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-size: 12px; font-weight: 700; line-height: 1;
  padding: 6px 11px; border-radius: 999px;
  max-width: 46vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
/* dong DANG DUNG: khong bam duoc, to ro la dang o day */
html.lgct-v3 #index_content .lgv3-subs > span.on {
  background: linear-gradient(180deg, #f7d271, #c98d1f);
  color: #4a1d0a; border: 1.5px solid #8a5b12;
}
/* dong bam duoc */
html.lgct-v3 #index_content .lgv3-subs .go {
  background: linear-gradient(180deg, #fff7e6, #f6ead0);
  color: #5a1c0c; border: 1.5px solid #7a4a22;
  cursor: pointer;
}
html.lgct-v3 #index_content .lgv3-subs .go:active { transform: translateY(1px); }
html.lgct-v3 #index_content .lgv3-subs .go[disabled] { opacity: .55; cursor: default; }
html.lgct-v3 #index_content .lgv3-subs .go:focus-visible {
  outline: 2px solid #c9932a; outline-offset: 2px;
}
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 #index_content .lgv3-subs .go,
  html.lgct-v3 #index_content .lgv3-subs > span:not(:first-child) {
    font-size: 11.5px; padding: 5px 9px; max-width: 30vw;
  }
}


/* ==========================================================================
   VA 14 — Trang HO TRO NGUOI CHOI (hoi thoai nhu nhan tin). 04/09/2026.
   Moi luat deu boc trong html.lgct-v3 nen khong do sang giao dien cu.
   ========================================================================== */
/* ============================================================================
   VA 14 - 04/09/2026: trang HO TRO NGUOI CHOI kieu "hoi thoai nhu nhan tin"
   (phuong an 3). Dung chung voi assets/lgct-ui.css (nap SAU tep do).
   Chi phu len ajax/report/report_v3.tpl; KHONG dung den report.tpl cu.

   Quy uoc:
   - Tien to rieng lgv14- (KHONG dung lgv3-*, lgv11-, lgv12-).
   - MOI bo chon deu bat dau bang html.lgct-v3 -> khong bat v3 thi khong anh huong.
   - Man ngang: @media (orientation:landscape) and (max-height:560px)
   - Chieu cao khung .lgv14-box do va dat bang JS (va14_hotro.js -> fit()),
     o day chi de min-height phong khi JS chet.
   ============================================================================ */

/* --------------------------------------------------------------------------
   1. KHUNG NGOAI
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv14 {
  display: block;
  font-family: "Be Vietnam Pro", system-ui, "Segoe UI", Roboto, sans-serif;
  color: var(--lg-ink);
  min-width: 0;
}

html.lgct-v3 .lgv14-box {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 340px;
  min-width: 0;
}

/* mot man hinh con: an/hien bang JS */
html.lgct-v3 .lgv14-view {
  display: none;
  flex-direction: column;
  gap: 8px;
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
}
html.lgct-v3 .lgv14-view.on { display: flex; }

/* tam giay do dung chung */
html.lgct-v3 .lgv14-pn {
  background: linear-gradient(180deg, var(--lg-cream), var(--lg-paper));
  border: 1.5px solid #7a4a22;
  border-radius: 10px;
  box-shadow: 0 0 0 2px #2a1108, 0 0 0 3px #b98a3c;
  padding: 9px 10px;
  min-width: 0;
}

/* --------------------------------------------------------------------------
   2. THANH TIEU DE CUA TRANG CON
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv14-hd {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  background: linear-gradient(180deg, var(--lg-cream), var(--lg-paper));
  border: 1.5px solid #7a4a22;
  border-radius: 10px;
  box-shadow: 0 0 0 2px #2a1108, 0 0 0 3px #b98a3c;
  padding: 6px 9px;
}
html.lgct-v3 .lgv14-bk {
  flex: none;
  width: 30px; height: 30px;
  border-radius: 8px;
  border: 1.5px solid #8a5a12;
  background: linear-gradient(180deg, #f7d271, #c98d1f);
  color: #4a1d0a;
  font-size: 17px;
  line-height: 1;
  padding: 0;
  cursor: pointer;
}
html.lgct-v3 .lgv14-hd .t { flex: 1 1 auto; min-width: 0; }
html.lgct-v3 .lgv14-hd .t b {
  display: block;
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 700;
  font-size: 15px;
  color: #5a1c0c;
  line-height: 1.2;
  word-break: break-word;
  overflow-wrap: anywhere;
}
html.lgct-v3 .lgv14-hd .t span {
  display: block;
  font-size: 11px;
  color: #7a6748;
  line-height: 1.25;
  word-break: break-word;
}

/* ma phieu */
html.lgct-v3 .lgv14-code {
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 800;
  letter-spacing: .04em;
  color: #8f1d14;
}

/* --------------------------------------------------------------------------
   3. HUY HIEU TRANG THAI
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv14-st {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border-radius: 999px;
  padding: 3px 10px;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.25;
  white-space: nowrap;
  border: 1.5px solid #c9a86a;
  background: #fffdf6;
  color: #5a3c1c;
}
html.lgct-v3 .lgv14-st::before {
  content: "";
  width: 7px; height: 7px;
  border-radius: 50%;
  background: #c9932a;
  flex: none;
}
html.lgct-v3 .lgv14-st-cho {
  background: linear-gradient(180deg, #fbeec6, #f3dda2);
  border-color: #b08a55; color: #6a4a12;
}
html.lgct-v3 .lgv14-st-cho::before { background: #c9932a; }
html.lgct-v3 .lgv14-st-xuly {
  background: linear-gradient(180deg, #ffd9ac, #f7b878);
  border-color: #8a3b0d; color: #6b2a06;
}
html.lgct-v3 .lgv14-st-xuly::before { background: #d9631a; }
html.lgct-v3 .lgv14-st-xong {
  background: linear-gradient(180deg, #dcecc4, #bcd79a);
  border-color: #557a2c; color: #33501a;
}
html.lgct-v3 .lgv14-st-xong::before { background: #4a7a24; }

/* --------------------------------------------------------------------------
   4. VUNG CUON (danh sach / hoi thoai)
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv14-body {
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  display: flex;
  flex-direction: column;
  gap: 7px;
  padding: 2px 3px 2px 3px;
}
html.lgct-v3 .lgv14-body::-webkit-scrollbar { width: 5px; }
html.lgct-v3 .lgv14-body::-webkit-scrollbar-thumb {
  background: rgba(201,147,42,.55); border-radius: 3px;
}
html.lgct-v3 .lgv14-body::-webkit-scrollbar-track { background: transparent; }

/* --------------------------------------------------------------------------
   5. BONG BONG HOI THOAI
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv14-bub {
  max-width: 86%;
  padding: 7px 10px;
  border-radius: 12px;
  font-size: 13px;
  line-height: 1.45;
  word-break: break-word;
  overflow-wrap: anywhere;
  min-width: 0;
}
html.lgct-v3 .lgv14-bub-htv {
  align-self: flex-start;
  background: linear-gradient(180deg, var(--lg-cream), var(--lg-paper));
  border: 1.5px solid #7a4a22;
  border-radius: 12px 12px 12px 4px;
  color: var(--lg-ink);
  box-shadow: 0 0 0 2px rgba(42,17,8,.5);
}
html.lgct-v3 .lgv14-bub-toi {
  align-self: flex-end;
  background: linear-gradient(180deg, #ffb35c, #f0842a 60%, #e2701f);
  border: 1.5px solid #8a3b0d;
  border-radius: 12px 12px 4px 12px;
  color: #4a1505;
  font-weight: 600;
  box-shadow: 0 2px 7px rgba(0,0,0,.35);
}
html.lgct-v3 .lgv14-bub .who {
  display: block;
  font-size: 10px;
  font-weight: 800;
  color: #7a6748;
  margin-bottom: 2px;
}
html.lgct-v3 .lgv14-bub-toi .who { color: #7a3208; }
html.lgct-v3 .lgv14-bub .tm {
  display: block;
  margin-top: 3px;
  font-size: 9.5px;
  color: #8a755a;
  text-align: right;
}
html.lgct-v3 .lgv14-bub-toi .tm { color: #7a3208; }

/* dinh kem: hien so anh (may chu chi tra ve so luong) */
html.lgct-v3 .lgv14-att {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-top: 4px;
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 10.5px;
  font-weight: 700;
  background: rgba(255,255,255,.55);
  border: 1px solid #b08a55;
  color: #6a4a12;
}
html.lgct-v3 .lgv14-bub-toi .lgv14-att {
  background: rgba(255,255,255,.35);
  border-color: #8a3b0d;
  color: #5a1a05;
}
/* anh vua gui (con giu duoc o may nguoi choi) */
html.lgct-v3 .lgv14-bubimg {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  margin-top: 5px;
}
html.lgct-v3 .lgv14-bubimg img {
  width: 54px; height: 54px;
  object-fit: cover;
  border-radius: 7px;
  border: 1.5px solid #8a5a12;
  display: block;
}

/* moc ngay */
html.lgct-v3 .lgv14-day {
  align-self: center;
  font-size: 10.5px;
  font-weight: 700;
  color: #ffe9b0;
  background: rgba(42,17,8,.6);
  border: 1px solid rgba(201,147,42,.6);
  border-radius: 999px;
  padding: 2px 11px;
  margin: 2px 0;
}

/* dong bao "dang gui" / cho tra loi */
html.lgct-v3 .lgv14-wait {
  align-self: flex-start;
  font-size: 11.5px;
  color: #ffe9b0;
  background: rgba(42,17,8,.5);
  border-radius: 999px;
  padding: 3px 11px;
}

/* --------------------------------------------------------------------------
   6. NUT BAM
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv14-b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: 38px;
  padding: 0 14px;
  border-radius: 9px;
  font-size: 13.5px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none;
  cursor: pointer;
  border: 1.5px solid #8a3b0d;
  background: linear-gradient(180deg, #ffb35c, #f0842a 55%, #d9631a);
  color: #5a1a05;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.5), 0 1px 0 rgba(0,0,0,.25);
}
html.lgct-v3 a.lgv14-b:hover,
html.lgct-v3 .lgv14-b:hover { color: #5a1a05; text-decoration: none; }
html.lgct-v3 .lgv14-b-gold {
  background: linear-gradient(180deg, #f7d271, #c98d1f);
  border-color: #8a5b12;
  color: #4a1d0a;
}
html.lgct-v3 .lgv14-b-gold:hover { color: #4a1d0a; }
html.lgct-v3 .lgv14-b-ghost {
  background: rgba(255,255,255,.66);
  border-color: #b08a55;
  color: #6a3a15;
  box-shadow: none;
}
html.lgct-v3 .lgv14-b-ghost:hover { color: #6a3a15; }
html.lgct-v3 .lgv14-b-full { width: 100%; }
html.lgct-v3 .lgv14-b[disabled],
html.lgct-v3 .lgv14-b.off {
  opacity: .5;
  cursor: default;
  box-shadow: none;
}

/* --------------------------------------------------------------------------
   7. NUT CHON LOAI VAN DE
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv14-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}
html.lgct-v3 .lgv14-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: #fffdf6;
  border: 1.5px solid #c9a86a;
  border-radius: 999px;
  padding: 6px 11px;
  font-size: 12px;
  font-weight: 700;
  color: #5a3c1c;
  line-height: 1.2;
  cursor: pointer;
  max-width: 100%;
  min-width: 0;
  text-align: left;
}
html.lgct-v3 .lgv14-chip .ic { font-size: 13.5px; line-height: 1; flex: none; }
html.lgct-v3 .lgv14-chip span { min-width: 0; }
html.lgct-v3 .lgv14-chip.on {
  background: linear-gradient(180deg, #ffb35c, #f0842a 55%, #d9631a);
  color: #5a1a05;
  border-color: #8a3b0d;
  box-shadow: inset 0 1px 0 #ffe0a8;
}
html.lgct-v3 .lgv14-chip-sm { padding: 4px 9px; font-size: 11px; }
html.lgct-v3 .lgv14-chip-sm.on {
  background: linear-gradient(180deg, #f7d271, #c98d1f);
  color: #4a1d0a;
  border-color: #8a5a12;
}

/* --------------------------------------------------------------------------
   8. O NHAP PHU THEO TUNG LOAI
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv14-fields { display: block; }
html.lgct-v3 .lgv14-fd { margin-bottom: 7px; min-width: 0; }
html.lgct-v3 .lgv14-fd:last-child { margin-bottom: 0; }
html.lgct-v3 .lgv14-lb {
  display: block;
  font-size: 10.5px;
  font-weight: 700;
  color: #7a6748;
  letter-spacing: .03em;
  text-transform: uppercase;
  line-height: 1.25;
  margin-bottom: 3px;
  word-break: break-word;
}
html.lgct-v3 .lgv14-in {
  width: 100%;
  box-sizing: border-box;
  background: #fffdf6;
  border: 1.5px solid #c9a86a;
  border-radius: 8px;
  padding: 7px 10px;
  font-size: 13px;
  font-family: inherit;
  color: var(--lg-ink);
  line-height: 1.3;
}
html.lgct-v3 .lgv14-in:focus {
  outline: none;
  border-color: #c9932a;
  box-shadow: 0 0 0 2px rgba(201,147,42,.3);
}
html.lgct-v3 .lgv14-in::-webkit-input-placeholder { color: #a4906f; }
html.lgct-v3 .lgv14-in::placeholder { color: #a4906f; }

html.lgct-v3 .lgv14-hint {
  display: block;           /* 04/09: dung duoi o nhap nen phai xuong dong rieng */
  margin-top: 3px;
  font-size: 10.5px;
  font-style: italic;
  color: #8a7350;
  line-height: 1.4;
  word-break: break-word;
}
html.lgct-v3 .lgv14-hint b { color: #5a1c0c; }

/* --------------------------------------------------------------------------
   9. O SOAN TIN
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv14-foot {
  flex: 0 0 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

html.lgct-v3 .lgv14-cp {
  display: flex;
  align-items: flex-end;
  gap: 7px;
  background: linear-gradient(180deg, var(--lg-cream), var(--lg-paper));
  border: 1.5px solid #7a4a22;
  border-radius: 12px;
  box-shadow: 0 0 0 2px #2a1108, 0 0 0 3px #b98a3c;
  padding: 6px 7px;
  min-width: 0;
}
html.lgct-v3 .lgv14-clip {
  flex: none;
  width: 36px; height: 36px;
  border-radius: 9px;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(180deg, #f7d271, #c98d1f);
  border: 1.5px solid #8a5a12;
  font-size: 17px;
  color: #4a1d0a;
  padding: 0;
  cursor: pointer;
}
html.lgct-v3 .lgv14-cp .mid { flex: 1 1 auto; min-width: 0; }
html.lgct-v3 .lgv14-ta {
  width: 100%;
  box-sizing: border-box;
  display: block;
  background: #fffdf6;
  border: 1.5px solid #c9a86a;
  border-radius: 8px;
  padding: 7px 9px;
  font-size: 13px;
  font-family: inherit;
  line-height: 1.35;
  color: var(--lg-ink);
  resize: none;
  max-height: 200px;        /* 04/09: noi dan 108 -> 168 -> 200px */
}
html.lgct-v3 .lgv14-ta:focus {
  outline: none;
  border-color: #c9932a;
  box-shadow: 0 0 0 2px rgba(201,147,42,.3);
}
html.lgct-v3 .lgv14-send {
  flex: none;
  width: 40px; height: 40px;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(180deg, #ffb35c, #f0842a 55%, #d9631a);
  border: 1.5px solid #8a3b0d;
  color: #5a1a05;
  font-size: 18px;
  padding: 0;
  cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.5);
}
html.lgct-v3 .lgv14-send[disabled] { opacity: .45; cursor: default; box-shadow: none; }

/* anh dinh kem dang chon */
html.lgct-v3 .lgv14-thumbs {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  min-width: 0;
}
html.lgct-v3 .lgv14-th {
  position: relative;
  width: 54px; height: 54px;
  border-radius: 8px;
  overflow: hidden;
  border: 1.5px solid #8a5a12;
  background: #2a1108;
  flex: none;
}
html.lgct-v3 .lgv14-th img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
html.lgct-v3 .lgv14-th .x {
  position: absolute;
  top: 1px; right: 1px;
  width: 18px; height: 18px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: #8f1d14;
  border: 1px solid #ffd98a;
  color: #fff3d6;
  font-size: 12px;
  line-height: 1;
  padding: 0;
  cursor: pointer;
}
html.lgct-v3 .lgv14-th-add {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fffdf6;
  border-style: dashed;
  border-color: #b98a3c;
  color: #8a5a12;
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
  padding: 0;
  cursor: pointer;
}
html.lgct-v3 .lgv14-th .kb {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  background: rgba(42,17,8,.72);
  color: #ffe9b0;
  font-size: 8.5px;
  font-weight: 700;
  text-align: center;
  line-height: 1.5;
}

/* dong ghi chu duoi o soan tin */
html.lgct-v3 .lgv14-note {
  display: flex;
  align-items: baseline;
  gap: 6px;
  flex-wrap: wrap;
  font-size: 10.5px;
  color: #e6cfa6;
  line-height: 1.4;
  word-break: break-word;
}
html.lgct-v3 .lgv14-note .cnt { margin-left: auto; white-space: nowrap; opacity: .85; }

/* dong bao loi */
html.lgct-v3 .lgv14-err {
  background: linear-gradient(180deg, #ffe3d6, #f8c6ae);
  border: 1.5px solid #8f1d14;
  border-radius: 8px;
  padding: 6px 9px;
  font-size: 12px;
  font-weight: 700;
  color: #6b1a0c;
  line-height: 1.35;
  word-break: break-word;
}

/* --------------------------------------------------------------------------
   10. DANH SACH PHIEU
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv14-tk {
  display: block;
  width: 100%;
  box-sizing: border-box;
  text-align: left;
  background: linear-gradient(180deg, var(--lg-cream), var(--lg-paper));
  border: 1.5px solid #7a4a22;
  border-radius: 10px;
  box-shadow: 0 0 0 2px rgba(42,17,8,.5);
  padding: 8px 10px;
  cursor: pointer;
  min-width: 0;
  font-family: inherit;
  color: var(--lg-ink);
}
html.lgct-v3 .lgv14-tk .r1 {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  margin-bottom: 3px;
}
html.lgct-v3 .lgv14-tk .ty {
  flex: 1 1 auto;
  min-width: 0;
  font-family: "Be Vietnam Pro", system-ui, sans-serif;
  font-weight: 700;
  font-size: 14px;
  color: #5a1c0c;
  line-height: 1.2;
  word-break: break-word;
  overflow-wrap: anywhere;
}
html.lgct-v3 .lgv14-tk .r2 {
  display: flex;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
  font-size: 10.5px;
  color: #7a6748;
  margin-bottom: 2px;
}
html.lgct-v3 .lgv14-tk .r2 .tm { margin-left: auto; white-space: nowrap; }
html.lgct-v3 .lgv14-tk .sm {
  font-size: 12px;
  color: #5a4630;
  line-height: 1.4;
  word-break: break-word;
  overflow-wrap: anywhere;
}
html.lgct-v3 .lgv14-nb {
  flex: none;
  min-width: 19px;
  height: 19px;
  border-radius: 999px;
  padding: 0 5px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #8f1d14;
  border: 1px solid #ffd98a;
  color: #fff3d6;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
}

html.lgct-v3 .lgv14-empty {
  padding: 14px 10px;
  text-align: center;
  font-size: 12.5px;
  color: #7a6748;
  line-height: 1.5;
}
html.lgct-v3 .lgv14-load {
  padding: 18px 10px;
  text-align: center;
  font-size: 12.5px;
  color: #e6cfa6;
}

/* --------------------------------------------------------------------------
   11. LOI DAN THAT THA (Telegram khong tra loi ngay)
   -------------------------------------------------------------------------- */
html.lgct-v3 .lgv14-tele {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  background: rgba(42,17,8,.5);
  border: 1px solid rgba(201,147,42,.55);
  border-radius: 9px;
  padding: 6px 9px;
  font-size: 11px;
  line-height: 1.45;
  color: #f0dcb4;
  word-break: break-word;
}
html.lgct-v3 .lgv14-tele i { font-style: normal; font-size: 14px; line-height: 1.2; flex: none; }
html.lgct-v3 .lgv14-tele b { color: #ffd98a; }

/* --------------------------------------------------------------------------
   12. KHO NGANG - hai cot: hoi thoai trai, o soan tin phai
   -------------------------------------------------------------------------- */
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 .lgv14-box { min-height: 240px; gap: 6px; }

  html.lgct-v3 .lgv14-view.on {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(250px, 320px);
    grid-template-rows: auto minmax(0, 1fr);
    gap: 6px 8px;
    align-items: stretch;
  }
  html.lgct-v3 .lgv14-hd   { grid-column: 1 / -1; padding: 5px 8px; }
  html.lgct-v3 .lgv14-body { grid-column: 1; grid-row: 2; }
  html.lgct-v3 .lgv14-foot {
    grid-column: 2; grid-row: 2;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    gap: 5px;
  }

  html.lgct-v3 .lgv14-hd .t b { font-size: 13.5px; }
  html.lgct-v3 .lgv14-hd .t span { font-size: 10px; }
  html.lgct-v3 .lgv14-bk { width: 27px; height: 27px; font-size: 15px; }
  html.lgct-v3 .lgv14-st { font-size: 10px; padding: 2px 8px; }

  html.lgct-v3 .lgv14-pn { padding: 7px 8px; border-radius: 9px; }
  html.lgct-v3 .lgv14-bub { font-size: 12px; padding: 6px 9px; max-width: 88%; }
  html.lgct-v3 .lgv14-chip { padding: 4px 9px; font-size: 11px; }
  html.lgct-v3 .lgv14-chip .ic { font-size: 12px; }
  html.lgct-v3 .lgv14-in { padding: 5px 8px; font-size: 12px; }
  html.lgct-v3 .lgv14-lb { font-size: 9.5px; margin-bottom: 2px; }
  html.lgct-v3 .lgv14-fd { margin-bottom: 5px; }
  html.lgct-v3 .lgv14-ta { font-size: 12px; padding: 5px 8px; max-height: 120px; }
  html.lgct-v3 .lgv14-clip { width: 32px; height: 32px; font-size: 15px; }
  html.lgct-v3 .lgv14-send { width: 34px; height: 34px; font-size: 16px; }
  html.lgct-v3 .lgv14-th { width: 44px; height: 44px; }
  html.lgct-v3 .lgv14-note { font-size: 9.5px; }
  html.lgct-v3 .lgv14-tele { font-size: 10px; padding: 5px 8px; }
  html.lgct-v3 .lgv14-b { height: 34px; font-size: 12.5px; padding: 0 12px; }
  html.lgct-v3 .lgv14-tk { padding: 6px 9px; }
  html.lgct-v3 .lgv14-tk .ty { font-size: 13px; }
  html.lgct-v3 .lgv14-tk .sm { font-size: 11px; }
  html.lgct-v3 .lgv14-bubimg img { width: 44px; height: 44px; }

  /* the phieu hep lai -> cho tieng dau de rieng mot dong, dung ep xuong cot */
  html.lgct-v3 .lgv14-tk .r1 { flex-wrap: wrap; gap: 5px 7px; }
  html.lgct-v3 .lgv14-tk .ty { flex: 1 1 100%; }

  /* danh sach phieu: hai cot cho do trong */
  html.lgct-v3 .lgv14-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; align-content: start; }
  html.lgct-v3 .lgv14-list .lgv14-empty,
  html.lgct-v3 .lgv14-list .lgv14-load { grid-column: 1 / -1; }
}

/* man ngang rat thap (VD 640x360) */
@media (orientation: landscape) and (max-height: 400px) {
  html.lgct-v3 .lgv14-bub { font-size: 11.5px; }
  html.lgct-v3 .lgv14-th { width: 40px; height: 40px; }
  html.lgct-v3 .lgv14-note { font-size: 9px; }
}

/* --------------------------------------------------------------------------
   13. MAN RONG (may tinh) - gioi han be ngang cho de doc
   -------------------------------------------------------------------------- */
@media (min-width: 900px) and (min-height: 561px) {
  html.lgct-v3 .lgv14 { max-width: 720px; margin: 0 auto; }
  html.lgct-v3 .lgv14-bub { max-width: 78%; }
}


/* ==========================================================================
   LAM GON MAN GUI BAO CAO. 04/09/2026.
   Bang 8 nut gap lai sau khi chon, nhan di cung dong voi nut, hai o ngan
   xep canh nhau — de danh cho o "ke ro chuyen gi" nhieu cho hon.
   ========================================================================== */

/* --- dong "da chon", thay cho ca bang 8 nut --- */
html.lgct-v3 .lgv14-picked {
  display: none;
  align-items: center;
  gap: 7px;
  background: linear-gradient(180deg, #ffb35c, #f0842a 55%, #d9631a);
  border: 1.5px solid #8a3b0d;
  border-radius: 999px;
  padding: 5px 6px 5px 12px;
  box-shadow: inset 0 1px 0 #ffe0a8;
  min-width: 0;
}
html.lgct-v3 .lgv14-picked > .ic { font-size: 14px; line-height: 1; flex: none; }
html.lgct-v3 .lgv14-picked > b {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 12.5px;
  font-weight: 800;
  color: #5a1a05;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
html.lgct-v3 .lgv14-doi {
  flex: none;
  background: #fffdf6;
  border: 1.5px solid #8a3b0d;
  border-radius: 999px;
  padding: 3px 11px;
  font: 700 11px/1.2 inherit;
  color: #7a3a10;
  cursor: pointer;
}
html.lgct-v3 .lgv14-doi:active { background: #f3e4c4; }

/* --- o phu: hai o ngan xep canh nhau --- */
html.lgct-v3 .lgv14-fields {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 7px;
}
html.lgct-v3 .lgv14-fd { flex: 1 1 100%; margin-bottom: 0; }
html.lgct-v3 .lgv14-w4 { flex: 4 1 96px;  }
html.lgct-v3 .lgv14-w5 { flex: 5 1 108px; }
html.lgct-v3 .lgv14-w6 { flex: 6 1 120px; }

/* --- o bam-chon: nhan nam cung dong voi cac nut --- */
html.lgct-v3 .lgv14-fd-ngang {
  display: flex;
  align-items: baseline;
  gap: 4px 8px;
  flex-wrap: wrap;
}
html.lgct-v3 .lgv14-fd-ngang > .lgv14-lb {
  flex: none;
  margin-bottom: 0;
  padding-top: 2px;
}
html.lgct-v3 .lgv14-fd-ngang > .lgv14-chips { flex: 1 1 150px; }

/* --- thu nho vien tam giay va nhan cho do chiem cho --- */
html.lgct-v3 #lgv14ExtraPn { padding: 8px 9px; }
html.lgct-v3 #lgv14ExtraTt {
  font-size: 9.5px;
  margin-bottom: 5px;
  opacity: .75;
}

@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 .lgv14-picked { padding: 4px 5px 4px 10px; gap: 6px; }
  html.lgct-v3 .lgv14-picked > b { font-size: 11.5px; }
  html.lgct-v3 .lgv14-doi { padding: 2px 9px; font-size: 10px; }
  html.lgct-v3 .lgv14-fields { gap: 5px 6px; }
  html.lgct-v3 #lgv14ExtraPn { padding: 6px 7px; }
}


/* Dau bao "co tra loi moi" tren muc Ho tro. Dung o CA HAI giao dien (cu va moi)
   nen CO Y khong boc trong html.lgct-v3. Ten lop rieng, khong dung ai. */
.lgv14-mbadge {
  display: inline-block; min-width: 18px; height: 18px; padding: 0 5px; margin-left: 6px;
  border-radius: 9px; background: #e5484d; color: #fff;
  font: 700 11px/18px system-ui, -apple-system, "Segoe UI", sans-serif;
  text-align: center; vertical-align: middle;
}

/* ==========================================================================
   16. GON 1 THANH (06/09/2026, anh Trung; sua lan 2 cung toi): man doc BO thanh tren (logo / pill tien / banh rang),
       gop so du + banh rang vao dai nguoi dung; GIU anh dai dien; BO nut Nap tren dai (thanh day da co Nap).
       Hop so du van la #lgv3BalDrop (lgct-ui.js da noi ra body, mo bang .lgv3-mini). Landscape/desktop giu rail nhu cu.
   ========================================================================== */
html.lgct-v3 .lgv3-top { display: none !important; }
/* dai nguoi dung len DAU (body.pagein la flex column): thanh Khai Quoc nam ngay duoi no */
html.lgct-v3 .lgv3-user { order: -1; margin: 8px 12px 0; padding: 5px 9px 5px 7px; gap: 9px; }
html.lgct-v3 .lgv3-user .av { width: 38px; height: 38px; }
html.lgct-v3 .lgv3-user .nm { font-size: 14px; }
html.lgct-v3 .lgv3-user .sv { font-size: 10.5px; }
html.lgct-v3 .lgv3-user .lgv3-mini {
  display: block !important; margin-left: auto; text-align: right;
  font-size: 10px; line-height: 1.1; flex: none;
}
html.lgct-v3 .lgv3-user .lgv3-mini b { display: block; font-size: 13.5px; color: var(--lg-lac); }
html.lgct-v3 .lgv3-user .lgv3-gear2 {
  display: inline-grid; place-items: center; flex: none;
  width: 32px; height: 32px; border-radius: 50%; padding: 0; margin: 0;
  background: linear-gradient(180deg, var(--lg-wood1), var(--lg-wood2));
  color: var(--lg-gold); border: 1px solid #b98a3c; font-size: 14px;
}
/* nut Nap tren dai nguoi dung: bo (thanh day co Nap; hop so du cung co nut Nap) */
html.lgct-v3 .lgv3-user > .lgv3-btn { display: none !important; }
html.lgct-v3 .lgv3-baldrop.lgv3-floating { top: 50px; }
@media (max-width: 345px) {
  html.lgct-v3 .lgv3-user { gap: 6px; }
  html.lgct-v3 .lgv3-user .av { width: 34px; height: 34px; }
}
/* ngang / desktop: rail trai da co "Them" -> khong can banh rang trong dai nguoi dung; nut Nap giu nhu cu o do */
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 .lgv3-user .lgv3-gear2 { display: none !important; }
  html.lgct-v3 .lgv3-user > .lgv3-btn { display: inline-flex !important; }
}
@media (min-width: 900px) {
  html.lgct-v3 .lgv3-user .lgv3-gear2 { display: none !important; }
  html.lgct-v3 .lgv3-user > .lgv3-btn { display: inline-flex !important; }
}


/* ===== 15/09/2026 Tieu Vuong Ky: icon rail + logo ngang lon + avatar lao gia ===== */
html.lgct-v3 .lgv3-rail > a:first-child img { width: 50px !important; height: 50px !important; object-fit: contain; margin: 6px auto 4px !important; }
html.lgct-v3 .lgv3-user { position: relative; }
html.lgct-v3 .lgv3-user .tvk-logo { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); height: 62px; width: auto; pointer-events: none; filter: drop-shadow(0 2px 5px rgba(0,0,0,.55)); z-index: 2; }
@media (min-width: 900px) { html.lgct-v3 .lgv3-user { min-height: 62px; } }
@media (max-width: 899px) { html.lgct-v3 .lgv3-user .tvk-logo { display: none; } }
html.lgct-v3 .lgv3-top .lgv3-logo { height: 46px !important; }
html.lgct-v3 .stickymenu .logobar-m img { max-width: 200px !important; }


/* ==========================================================================
   VA 16 - 16/09/2026 (Fable 5.1): trai nghiem dien thoai, theo 4 nhan xet cua anh Trung
   1. Tam mua goi (modal #pack*) co NUT DONG nhin thay + vach keo bam duoc + vuot xuong de dong (JS).
   2. Man NGANG: tam mua goi thanh HOP GIUA MAN rong 90%, chua le hai ben de bam ra ngoai van dong;
      chan hop gom 1 hang (canh bao trai, nut Mua phai), bo khoang chua 84px danh cho thanh day.
   3. Luoi goi DOC: o goi thap hon ~18px de 2x3 goi nam gon trong mot khung hinh (712px), khong bi
      thanh day che hang cuoi.
   4. Goi y "Them vao man hinh chinh" (hop nho, 1 lan / 7 ngay) khi mo bang trinh duyet dien thoai.
   Moi bo chon deu co pham vi html.lgct-v3 -> ban cu (?ui=old) khong doi.
   ========================================================================== */

/* ---- 1. nut dong + vach keo tren tam mua goi ---- */
html.lgct-v3 .lgv11-sheet .modal-content { position: relative; }
html.lgct-v3 .lgv11-sheet .modal-content::before { display: none; }
html.lgct-v3 .lgv11-grab {
  display: block; flex: none;
  width: 140px; height: 34px; margin: -9px auto 0; padding: 0;
  border: 0; background: none; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
html.lgct-v3 .lgv11-grab::before {
  content: ""; display: block; width: 44px; height: 5px; border-radius: 3px;
  background: #7a4a22; opacity: .45; margin: 14px auto 0;
}
html.lgct-v3 .lgv11-grab:active::before { opacity: .8; }
html.lgct-v3 .lgv11-x {
  position: absolute; top: 7px; right: 9px; z-index: 6;
  width: 32px; height: 32px; border-radius: 50%; padding: 0;
  border: 1.5px solid #b98a3c; background: #fff7e6; color: #5a1c0c;
  font-size: 22px; line-height: 1; cursor: pointer;
  box-shadow: 0 1px 3px rgba(0,0,0,.28);
  -webkit-tap-highlight-color: transparent;
}
html.lgct-v3 .lgv11-x:active { transform: scale(.94); }
html.lgct-v3 .lgv11-x:focus-visible { outline: 2px solid #f3c95a; outline-offset: 2px; }
/* dang keo xuong: khong hieu ung chuyen dong cua bootstrap de tay keo toi dau hop di toi do */
html.lgct-v3 .lgv11-sheet.lgv11-dragging .modal-dialog { transition: none !important; }

/* ---- 2. man ngang: hop giua man ---- */
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 .modal.lgv11-sheet .modal-dialog {
    position: fixed; left: 5vw; right: 5vw; top: 50%; bottom: auto;
    width: auto; max-width: 820px !important; margin: 0 auto !important;
    transform: translateY(-50%);
  }
  html.lgct-v3 .modal.lgv11-sheet.fade .modal-dialog { transform: translateY(-46%); }
  html.lgct-v3 .modal.lgv11-sheet.show .modal-dialog { transform: translateY(-50%); }
  html.lgct-v3 .modal.lgv11-sheet .modal-content {
    border: 2px solid #c9932a !important;
    border-radius: 16px !important;
    box-shadow: 0 0 0 2px #2a1108, 0 14px 36px rgba(0,0,0,.6) !important;
    max-height: 92vh; max-height: 92dvh;
    padding-top: 6px;
  }
  html.lgct-v3 .lgv11-grab { display: none; }
  html.lgct-v3 .lgv11-x { top: 6px; right: 7px; width: 30px; height: 30px; }
  html.lgct-v3 .lgv11-dbody { padding-top: 4px; }
  html.lgct-v3 .lgv11-dr .lgv11-sec { padding-right: 34px; }   /* chua cho nut x */
  /* chan hop 1 hang: canh bao ben trai, nut mua ben phai */
  html.lgct-v3 .modal.lgv11-sheet[id^="pack"] .modal-footer {
    padding: 6px 12px 10px !important;
    flex-wrap: nowrap !important;
    gap: 10px;
  }
  html.lgct-v3 .modal.lgv11-sheet .modal-footer::after {
    flex: 1 1 auto; order: -1; text-align: left;
    margin: 0 !important; font-size: 10.5px;
  }
  html.lgct-v3 .modal.lgv11-sheet .modal-footer form { width: auto !important; flex: 0 0 46%; }
  html.lgct-v3 .modal.lgv11-sheet .modal-footer .lgv11-buy { width: 100%; }
}

/* ---- 3. luoi goi doc: 2x3 gon trong 1 khung ---- */
@media (orientation: portrait) and (max-width: 480px) {
  html.lgct-v3 .lgv11-in { padding: 20px 8px 4px; gap: 3px; }
  html.lgct-v3 .lgv11-nm { min-height: 15px; }
  html.lgct-v3 .lgv11-bar { padding: 4px 6px; }
  html.lgct-v3 .lgv11-grid { gap: 8px; }
  html.lgct-v3 .lgv11-bd { top: 6px; left: 5px; }
  html.lgct-v3 .lgv11-gt { top: 6px; right: 5px; }
}

/* ---- 4. goi y "Them vao man hinh chinh" (chi trinh duyet dien thoai, JS bat/tat) ---- */
html.lgct-v3 .lgv3-pwa {
  position: fixed; left: 10px; right: 10px; bottom: 66px; z-index: 1190;
  display: flex; align-items: center; gap: 10px;
  padding: 9px 10px 9px 12px; border-radius: 14px;
  background: linear-gradient(180deg, #fff7e6, #f6ead0);
  border: 1.5px solid #c9932a; box-shadow: 0 0 0 2px #2a1108, 0 8px 22px rgba(0,0,0,.5);
  color: #3a2413; font-size: 12.5px; line-height: 1.35;
  font-family: "Be Vietnam Pro", system-ui, "Segoe UI", Roboto, sans-serif;
  transform: translateY(12px); opacity: 0; transition: transform .25s ease-out, opacity .25s ease-out;
}
html.lgct-v3 .lgv3-pwa.on { transform: none; opacity: 1; }
html.lgct-v3 .lgv3-pwa img { width: 40px; height: 40px; border-radius: 10px; flex: none; border: 1px solid #b98a3c; }
html.lgct-v3 .lgv3-pwa .t { flex: 1 1 auto; min-width: 0; }
html.lgct-v3 .lgv3-pwa .t > b { display: block; color: #5a1c0c; font-size: 13px; }
html.lgct-v3 .lgv3-pwa .t small { display: block; color: #6b5334; font-size: 11px; margin-top: 1px; }
html.lgct-v3 .lgv3-pwa .t small b { color: #8f1d14; }
html.lgct-v3 .lgv3-pwa .t small.how { display: none; }
html.lgct-v3 .lgv3-pwa.how-on .t small.how { display: block; }
html.lgct-v3 .lgv3-pwa.how-on .t small.lead { display: none; }
html.lgct-v3 .lgv3-pwa .b {
  flex: none; padding: 8px 12px; border-radius: 10px; border: 1px solid #6b4a1c;
  background: linear-gradient(180deg, #f7d271, #c98d1f 60%, #a8721a); color: #3a1207;
  font: inherit; font-weight: 800; font-size: 12px; cursor: pointer;
}
html.lgct-v3 .lgv3-pwa .x {
  flex: none; width: 28px; height: 28px; border-radius: 50%; border: 1px solid #b98a3c;
  background: #fff; color: #5a1c0c; font-size: 18px; line-height: 1; padding: 0; cursor: pointer;
}
html.lgct-v3 .lgv3-pwa.how-on .b { display: none; }
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 .lgv3-pwa { left: 80px; right: 16px; bottom: 12px; }
}
@media (min-width: 900px) { html.lgct-v3 .lgv3-pwa { display: none !important; } }
@media (prefers-reduced-motion: reduce) { html.lgct-v3 .lgv3-pwa { transition: none; } }


/* ==========================================================================
   VA 17 - 17/09/2026 (Fable 5.1): 6 nhan xet cua anh Trung sau khi cai VA 16
   1. Tam mua goi DOC: nut Mua cach day qua xa (dem 84px) -> 44px.
   2. Tam mua goi NGANG: ghi chu goi chay het be ngang duoi 2 cot (bot khoang trong cot phai).
   3. Trang NAP: chu "d" khong con roi xuong dong rieng (markup moi trong recharge_v3.tpl).
   4. Trang NAP ngang: 3 o kenh xep hang ngang (logo | ten | gia) - het khoang trong ben phai o.
   5. Ngan keo "Them" ngang: bo logo to, muc menu 2 cot, dong thap -> lot mot man.
   6. Nhat ky giao dich: dong gon hon; ngang xep 2 cot.
   7. Trang TAI KHOAN: bo khoi anh + ten + so du trong the lon (dai nguoi dung phia tren da co).
   Moi bo chon deu co html.lgct-v3.
   ========================================================================== */

/* ---- 1. tam mua goi doc: dem day 44px (thanh day nam DUOI tam, khong can chua 84px) ---- */
html.lgct-v3 .modal.lgv11-sheet[id^="pack"] .modal-footer {
  padding-bottom: 44px !important;
  padding-bottom: calc(40px + env(safe-area-inset-bottom, 0px)) !important;
}

/* ---- 2. tam mua goi ngang ---- */
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 .modal.lgv11-sheet[id^="pack"] .modal-footer { padding: 6px 12px 10px !important; }
  html.lgct-v3 .lgv11-dbody { grid-template-areas: "l r" "n n"; }
  html.lgct-v3 .lgv11-dn:empty { display: none; }
  html.lgct-v3 .lgv11-note { margin-top: 2px; }
}

/* ---- 3. trang nap: gia "10.000 -> 12.000d" tren 2 dong, d dinh vao so ---- */
html.lgct-v3 #index_content .lgv3-pick-rt { display: flex; flex-direction: column; align-items: flex-end; gap: 0; }
html.lgct-v3 #index_content .lgv3-pick-rt small { display: block; font-size: 11px; color: #7a6748; line-height: 1.25; white-space: nowrap; }
html.lgct-v3 #index_content .lgv3-pick-rt b { display: block; white-space: nowrap; }
html.lgct-v3 #index_content .lgv3-pick-rt b i { font-style: normal; font-size: .68em; font-weight: 700; margin-left: 1px; color: #8f1d14; }

/* ---- 4. trang nap ngang: 3 o kenh, moi o van la HANG (logo | ten | gia) ---- */
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 #index_content .lgv3-pick { flex-direction: row; gap: 8px; }
  html.lgct-v3 #index_content .lgv3-pick-it {
    flex: 1 1 0; min-width: 0;
    flex-direction: row; align-items: center; gap: 8px; padding: 7px 9px;
  }
  html.lgct-v3 #index_content .lgv3-pick-ic { width: 36px; height: 36px; }
  html.lgct-v3 #index_content .lgv3-pick-ic img { max-width: 30px; max-height: 30px; }
  html.lgct-v3 #index_content .lgv3-pick-tx b { font-size: 12.5px; }
  html.lgct-v3 #index_content .lgv3-pick-tx i { font-size: 10px; }
  html.lgct-v3 #index_content .lgv3-pick-rt { align-items: flex-end; text-align: right; }
  html.lgct-v3 #index_content .lgv3-pick-rt small { font-size: 9.5px; }
  html.lgct-v3 #index_content .lgv3-pick-rt b { font-size: 13.5px; }
  html.lgct-v3 #index_content .lgv3-pick-tag { top: -8px; right: 6px; }
  /* ghi chu + o dong y: mot hang, chu nho */
  html.lgct-v3 #index_content .form-bg-s1 .alert { margin-top: 8px !important; margin-bottom: 6px !important; font-size: 11px !important; padding: 6px 10px !important; }
  html.lgct-v3 #index_content .form-bg-s1 .form-check { font-size: 12px; }
}

/* ---- 5. ngan keo "Them" ngang: 2 cot, khong logo to ---- */
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 .stickymenu { width: 62% !important; max-width: 520px; right: -62%; }
  html.lgct-v3 .stickymenu.show { right: 0; }
  html.lgct-v3 .stickymenu .logobar-m { margin: 2px 0 0 !important; }
  html.lgct-v3 .stickymenu .logobar-m img { max-width: 110px !important; }
  html.lgct-v3 .stickymenu > ul.navbar-nav {
    display: grid !important; grid-template-columns: 1fr 1fr; gap: 0 6px; padding: 2px 6px 8px;
  }
  html.lgct-v3 .stickymenu > ul.navbar-nav > .nav-item { min-width: 0; }
  html.lgct-v3 .stickymenu .nav-link { font-size: 12.5px !important; padding: 7px 8px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  html.lgct-v3 .stickymenu ul.collapse.navbar-nav:not(.show) { display: none !important; }
  html.lgct-v3 .stickymenu ul.collapse.navbar-nav.show { display: block !important; padding-left: 8px !important; }
  html.lgct-v3 .stickymenu .lgv3-drawer-head { grid-column: 1 / -1; padding: 6px 8px 2px; }
}
@media (orientation: landscape) and (max-height: 400px) {
  html.lgct-v3 .stickymenu .logobar-m { display: none !important; }
  html.lgct-v3 .stickymenu .nav-link { padding: 5px 8px !important; }
}

/* ---- 6. nhat ky giao dich: gon; ngang 2 cot ---- */
html.lgct-v3 #my-logtrade-log tr { padding: 6px 9px; margin-bottom: 6px; gap: 1px 8px; }
html.lgct-v3 #my-logtrade-log td:nth-child(2) { font-size: 12px; }
html.lgct-v3 #my-logtrade-log td:nth-child(3) { font-size: 14px; }
html.lgct-v3 #my-logtrade-log td:nth-child(4) { font-size: 10.5px; }
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 #my-logtrade-log tbody { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; align-items: start; }
  html.lgct-v3 #my-logtrade-log tr { margin-bottom: 0; }
  html.lgct-v3 #my-logtrade-log .container-fluid { padding: 0; }
  html.lgct-v3 .pagination { margin: 4px 0 0; }
}
@media (min-width: 900px) {
  html.lgct-v3 #my-logtrade-log tbody { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; align-items: start; }
  html.lgct-v3 #my-logtrade-log tr { margin-bottom: 0; }
}

/* ---- 7. trang tai khoan: the lon KHONG lap lai anh + ten + so du (dai nguoi dung o tren da co) ---- */
html.lgct-v3 .lgv12-hero-top,
html.lgct-v3 .lgv12-rule,
html.lgct-v3 .lgv12-hero-bot .balc { display: none !important; }
html.lgct-v3 .lgv12-hero-bot { align-items: center; }
html.lgct-v3 .lgv12-hero-bot .idc .lgv12-lb { margin-bottom: 1px; }
html.lgct-v3 .lgv12-acts { margin-top: 8px; }
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 .lgv12-hero { gap: 12px; }
  html.lgct-v3 .lgv12-hero-bot { flex: 1 1 auto; min-width: 0; }
  html.lgct-v3 .lgv12-hero-bot .idc { min-width: 0; flex: 1 1 auto; }
  html.lgct-v3 .lgv12-idn { flex: 1 1 auto; }
}


/* ==========================================================================
   VA 19 - 17/09/2026 (Fable 5.1): anh Trung chon bo nut x tren tam mua goi; vach keo la nut dong duy nhat
   (bam vach = dong, vuot xuong = dong o man doc). Man ngang truoc day khong co vach -> them vach, bo x.
   ========================================================================== */
html.lgct-v3 .lgv11-x { display: none !important; }
html.lgct-v3 .lgv11-grab::before { width: 56px; height: 6px; opacity: .6; }
html.lgct-v3 .lgv11-grab:active::before { opacity: .95; }
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 .lgv11-grab { display: block; height: 28px; margin: -4px auto 0; }
  html.lgct-v3 .lgv11-grab::before { margin-top: 9px; }
  html.lgct-v3 .lgv11-dbody { padding-top: 0; }
  html.lgct-v3 .lgv11-dr .lgv11-sec { padding-right: 0; }
}

/* Same gold icon family and alignment throughout the drawer. */
html.lgct-v3 .stickymenu > ul.navbar-nav > .nav-item > .nav-link {
  display: flex; align-items: center; gap: 9px; min-height: 38px;
}
html.lgct-v3 .stickymenu > ul.navbar-nav > .nav-item > .nav-link > i {
  display: inline-flex; align-items: center; justify-content: center;
  flex: 0 0 22px; width: 22px; height: 22px; margin: 0;
  font-size: 17px; line-height: 1; color: var(--lg-gold);
}
/* Landscape purchase sheet, 2026-09-17. Portrait remains unchanged. */
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 .modal.lgv11-sheet .modal-dialog {
    left: max(8px, env(safe-area-inset-left, 0px));
    right: max(8px, env(safe-area-inset-right, 0px));
    width: auto; max-width: none !important;
  }
  html.lgct-v3 .modal.lgv11-sheet .modal-content {
    min-height: calc(100vh - 16px); min-height: calc(100dvh - 16px);
    max-height: calc(100vh - 16px); max-height: calc(100dvh - 16px);
    border-radius: 18px !important; padding-top: 0;
  }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-grab {
    height: 30px; margin: 0 auto; width: 144px;
  }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-grab::before { margin-top: 10px; }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-dbody {
    display: grid; grid-template-columns: minmax(220px, 36%) minmax(0, 1fr);
    grid-template-areas: "l r" "l n";
    grid-template-rows: max-content 1fr;
    align-content: start; align-items: start;
    gap: 8px 20px; padding: 2px 18px 12px;
  }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-dl { grid-area: l; }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-dr { grid-area: r; }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-dn { grid-area: n; }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-dhead { padding: 10px; gap: 12px; }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-dhead .lgv11-art { width: 58px; height: 58px; flex: none; }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-dhn { font-size: 18px; }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-rcp { margin-top: 10px; padding: 8px 12px; }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-ln { font-size: 12px; padding: 2px 0; }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-tot .lgv11-now { font-size: 26px; }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-sec { margin: 3px 0 10px; padding: 0; }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-sec h3 { font-size: 16px; }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-note {
    margin: 0; padding: 12px 14px; font-size: 13px; line-height: 1.55;
    border-radius: 0 10px 10px 0; background: rgba(180,130,45,.10);
  }
  html.lgct-v3 .modal.lgv11-sheet[id^="pack"] .modal-footer {
    padding: 10px 18px max(12px, env(safe-area-inset-bottom, 0px)) !important;
    gap: 20px;
  }
  html.lgct-v3 .modal.lgv11-sheet .modal-footer::after { font-size: 11px; line-height: 1.4; }
  html.lgct-v3 .modal.lgv11-sheet .modal-footer form { flex: 0 0 60%; min-width: 0; }
  html.lgct-v3 .modal.lgv11-sheet .modal-footer .lgv11-buy {
    min-height: 46px; padding: 11px 14px !important; font-size: 16px !important;
  }
}
@media (orientation: landscape) and (max-height: 360px) {
  html.lgct-v3 .modal.lgv11-sheet .lgv11-dhead { padding: 6px 9px; }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-dhead .lgv11-art { width: 44px; height: 44px; }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-rcp { margin-top: 6px; padding: 5px 10px; }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-note { padding: 8px 12px; font-size: 12px; }
}

/* Safari safe areas and keyboard, 20260917. */
html.lgct-v3 { --tvk-top: env(safe-area-inset-top, 0px); --tvk-left: env(safe-area-inset-left, 0px); --tvk-right: env(safe-area-inset-right, 0px); --tvk-bottom: env(safe-area-inset-bottom, 0px); }
html.lgct-v3 body.pagein {
  box-sizing: border-box; width: 100%; max-width: 100%;
  padding-top: var(--tvk-top); padding-left: var(--tvk-left); padding-right: var(--tvk-right);
}
html.lgct-v3 .maincontainer, html.lgct-v3 #index_content { min-width: 0; max-width: 100%; }
html.lgct-v3 .lgv3-bnav { box-sizing: border-box; min-height: calc(52px + var(--tvk-bottom)); padding-bottom: calc(6px + var(--tvk-bottom)); }
html.lgct-v3 .stickymenu { padding-top: var(--tvk-top); padding-bottom: var(--tvk-bottom); padding-right: var(--tvk-right); max-height: 100dvh; }
html.lgct-v3 .lgv3-pwa { bottom: calc(66px + var(--tvk-bottom)); left: max(10px, var(--tvk-left)); right: max(10px, var(--tvk-right)); }
@media (min-width: 900px) { html.lgct-v3 .lgv3-pwa { display: flex !important; max-width: 600px; margin: 0 auto; } }
html.lgct-v3 .lgv3-pwa .already { background: transparent; border: 0; color: #6b5334; padding: 4px 0; text-decoration: underline; font: inherit; font-size: 11px; }
html.lgct-v3 .modal .modal-content { max-height: calc(100dvh - var(--tvk-top) - var(--tvk-bottom) - 8px); }
@media (orientation: portrait) and (max-width: 899px) {
 html.lgct-v3 .modal .modal-dialog { left: var(--tvk-left); right: var(--tvk-right); bottom: var(--tvk-bottom); width: auto; }
}
@media (orientation: landscape) and (max-height: 560px) {
 html.lgct-v3 body.pagein { padding-left: calc(64px + var(--tvk-left)); }
 html.lgct-v3 .lgv3-rail { left: var(--tvk-left); top: var(--tvk-top); bottom: var(--tvk-bottom); height: auto; overflow-y: auto; }
 html.lgct-v3 .modal.lgv11-sheet .modal-dialog { left: max(8px, var(--tvk-left)); right: max(8px, var(--tvk-right)); top: calc(50% + (var(--tvk-top) - var(--tvk-bottom))/2); }
 html.lgct-v3 .modal.lgv11-sheet .modal-content { min-height: calc(100dvh - var(--tvk-top) - var(--tvk-bottom) - 16px); max-height: calc(100dvh - var(--tvk-top) - var(--tvk-bottom) - 16px); }
}
@media (min-width: 900px) and (min-height: 561px) { html.lgct-v3 body.pagein { padding-left: calc(64px + var(--tvk-left)); } }
html.lgct-v3.tvk-ios input:not([type=checkbox]):not([type=radio]):not([type=button]):not([type=submit]),
html.lgct-v3.tvk-ios select, html.lgct-v3.tvk-ios textarea { font-size: 16px !important; max-width: 100%; }


/* Landscape audit 20260917: safe shell, independent overlays, readable forms. */
html.lgct-v3 body.pagein { padding-right: var(--tvk-right) !important; }
html.lgct-v3:not(.pagein) body { box-sizing: border-box; padding: var(--tvk-top) var(--tvk-right) var(--tvk-bottom) var(--tvk-left) !important; }
html.lgct-v3 .modal { z-index: 1300; }
html.lgct-v3 .modal-backdrop { z-index: 1290; }
html.lgct-v3 .swal2-container { z-index: 1400; padding: max(8px, var(--tvk-top)) max(8px, var(--tvk-right)) max(8px, var(--tvk-bottom)) max(8px, var(--tvk-left)); }
html.lgct-v3 .swal2-popup { max-height: calc(100dvh - var(--tvk-top) - var(--tvk-bottom) - 16px); overflow-y: auto; }
html.lgct-v3 .lgv3-baldrop.lgv3-floating { right: max(12px, var(--tvk-right)); max-width: calc(100vw - var(--tvk-left) - var(--tvk-right) - 24px); }
html.lgct-v3 .lgv3-tel-sheet { left: var(--tvk-left); right: var(--tvk-right); width: auto; max-height: calc(100dvh - var(--tvk-top) - 8px); padding-bottom: max(12px, var(--tvk-bottom)); }
html.lgct-v3 #kqSheet { max-height: calc(100dvh - var(--tvk-top) - var(--tvk-bottom) - 16px); }
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3:not(.pagein) .maincontainer > .container-fluid > .d-flex.flex-column { min-height: calc(100dvh - var(--tvk-top) - var(--tvk-bottom) - 6px); }
  html.lgct-v3 body.pagein { padding-bottom: var(--tvk-bottom); }
  html.lgct-v3 .lgv3-user { min-height: 42px; margin: 4px 8px 0; width: auto; padding: 4px 8px; gap: 8px; }
  html.lgct-v3 .lgv3-user .av { width: 30px; height: 30px; flex: 0 0 30px; }
  html.lgct-v3 .lgv3-user .nm { font-size: 12px; }
  html.lgct-v3 .lgv3-user .sv { font-size: 10px; }
  html.lgct-v3 .lgv3-user .tvk-logo { display: none; }
  html.lgct-v3 .lgv3-user .lgv3-mini b { font-size: 12px; }
  html.lgct-v3 .lgv3-user > .lgv3-btn { min-height: 32px; margin-left: 0; padding: 6px 10px; }
  html.lgct-v3 #kqStrip { min-height: 28px; padding: 3px 7px; margin: 4px 8px 0; width: auto; gap: 6px; }
  html.lgct-v3 #kqStrip .kq-ico { width: 22px; height: 22px; }
  html.lgct-v3 #kqStrip .kq-lb, html.lgct-v3 #kqStrip .kq-pct { font-size: 11px; }
  html.lgct-v3 .maincontainer > #index_content { padding: 6px 8px 12px !important; }
  html.lgct-v3 .lgv3-rail { gap: 4px; padding: 4px 0; }
  html.lgct-v3 .lgv3-rail > a:first-child img { width: 40px !important; height: 40px !important; margin: 2px auto !important; }
  html.lgct-v3 .lgv3-rail > a:not(:first-child), html.lgct-v3 .lgv3-rail > button { min-height: 40px; justify-content: center; flex-shrink: 0; }
  html.lgct-v3 .modal .modal-dialog { left: max(8px, var(--tvk-left)); right: max(8px, var(--tvk-right)); width: auto; margin-left: 0 !important; margin-right: 0 !important; }
  html.lgct-v3 .modal:not(.lgv11-sheet) .modal-dialog { bottom: max(8px, var(--tvk-bottom)); }
  html.lgct-v3 .modal.lgv11-sheet .modal-content { min-height: 0; height: calc(100dvh - var(--tvk-top) - var(--tvk-bottom) - 16px); }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-dbody { grid-template-columns: minmax(0, 38%) minmax(0, 1fr); gap: 8px 16px; min-height: 0; padding: 0 14px 10px; }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-dl, html.lgct-v3 .modal.lgv11-sheet .lgv11-dr, html.lgct-v3 .modal.lgv11-sheet .lgv11-dn { min-width: 0; }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-dhn { font-size: clamp(14px, 2.2vw, 18px); overflow-wrap: anywhere; }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-tot .lgv11-now { font-size: clamp(22px, 3.5vw, 28px); white-space: nowrap; }
  html.lgct-v3 .modal.lgv11-sheet .modal-footer { flex-shrink: 0; }
  html.lgct-v3 .modal.lgv11-sheet[id^="pack"] .modal-footer { padding: 8px 14px 10px !important; }
  html.lgct-v3 .lgv3-card-grid { grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); gap: 10px 14px; }
  html.lgct-v3 .lgv3-card-grid > * { min-width: 0; }
  html.lgct-v3 .lgv3-card-grid > .lgv3-card-col:last-child { grid-column: 1 / -1; }
  html.lgct-v3 .lgv3-card-hist { grid-column: 1 / -1; margin: 0; }
  html.lgct-v3 #index_content .lgv3-pick-it { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 6px 8px; align-items: center; padding: 9px !important; }
  html.lgct-v3 #index_content .lgv3-pick-it .lgv3-pick-tx b { white-space: normal; overflow: visible; font-size: 12px; }
  html.lgct-v3 #index_content .lgv3-pick-it .lgv3-pick-rt { grid-column: 1 / -1; display: flex; flex-direction: row; align-items: baseline; justify-content: space-between; border-top: 1px solid #d9bf8d; padding-top: 4px; }
  html.lgct-v3 .lgv3-card-amtgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  html.lgct-v3 .lgv3-card-amtgrid > * { min-width: 0; }
  html.lgct-v3 .lgv12-lks { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  html.lgct-v3 .lgv12-lk { min-width: 0; }
  html.lgct-v3 .lgv12-lk .r { flex-wrap: wrap; gap: 5px; }
  html.lgct-v3 .lgv12-lk a { max-width: 100%; white-space: normal; }
  html.lgct-v3 #role-login .form-bg-s1 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px 14px; padding: 12px !important; }
  html.lgct-v3 #role-login .titlepage, html.lgct-v3 #role-login .alert { grid-column: 1 / -1; margin: 0 !important; }
  html.lgct-v3 #role-login .form-label { grid-row: 3; margin: 0; }
  html.lgct-v3 #role-login .form-bg-s1 > div.mb-3 { grid-row: 4; min-width: 0; margin: 0 !important; }
  html.lgct-v3 #role-login .form-bg-s1 > .alert { grid-row: 2; }
  html.lgct-v3 #role-login .form-bg-s1 > button { grid-column: 1 / -1; }
  html.lgct-v3 #giftcode > .form-bg-s1 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px 12px; padding: 12px !important; margin-bottom: 8px !important; }
  html.lgct-v3 #giftcode > .form-bg-s1 > .alert, html.lgct-v3 #giftcode #msgret, html.lgct-v3 #giftcode > .form-bg-s1 > .mb-3:last-child { grid-column: 1 / -1; }
  html.lgct-v3 #giftcode > .form-bg-s1 > .mb-3, html.lgct-v3 #giftcode .alert { min-width: 0; margin: 0 !important; }
  html.lgct-v3 #account-changepwd > .form-bg-s1 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px 12px; padding: 12px !important; margin-bottom: 8px !important; }
  html.lgct-v3 #account-changepwd .alert { grid-column: 1 / -1; margin: 0 !important; }
  html.lgct-v3 #account-changepwd .form-bg-s1 > .mb-3 { margin: 0 !important; min-width: 0; }
  html.lgct-v3 #kqSheet { left: max(8px, var(--tvk-left)); right: max(8px, var(--tvk-right)); bottom: max(8px, var(--tvk-bottom)); width: auto; max-width: 740px; margin-left: auto; margin-right: auto; border-radius: 16px; }
  html.lgct-v3 .lgv3-pwa { left: calc(72px + var(--tvk-left)); right: max(8px, var(--tvk-right)); bottom: calc(8px + var(--tvk-bottom)); }
  html.lgct-v3 .stickymenu { max-width: calc(100vw - var(--tvk-left)); padding-right: max(8px, var(--tvk-right)); }
}
@media (orientation: landscape) and (max-height: 560px) and (max-width: 740px) {
  html.lgct-v3 .lgv12-lk .r { display: flex; flex-wrap: wrap; gap: 4px; }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-dhead { gap: 7px; padding: 7px; }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-dhead .lgv11-art { width: 40px; height: 40px; }
  html.lgct-v3 .modal.lgv11-sheet .lgv11-rcp { padding: 6px 8px; }
}

/* iOS only. Keep the shell inside Safari's panned visual viewport, not just
   its height. No body transform, no global scrollIntoView, no zoom lock. */
html.lgct-v3.tvk-keyboard body.pagein {
  position: fixed !important;
  top: var(--tvk-visible-top) !important;
  left: 0; right: 0; bottom: auto;
  height: var(--tvk-visible-height) !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding-bottom: 0 !important;
}
html.lgct-v3.tvk-keyboard .lgv3-bnav,
html.lgct-v3.tvk-keyboard .lgv3-pwa { display: none !important; }
html.lgct-v3.tvk-keyboard body.pagein .maincontainer {
  padding-bottom: 12px !important;
  scroll-padding: 12px;
  scroll-behavior: auto;
}
html.lgct-v3.tvk-keyboard .lgv3-rail {
  top: calc(var(--tvk-visible-top) + var(--tvk-top));
  bottom: auto;
  height: calc(var(--tvk-visible-height) - var(--tvk-top));
}
html.lgct-v3.tvk-keyboard-short body.pagein > .lgv3-user,
html.lgct-v3.tvk-keyboard-short body.pagein > #kqStrip { display: none !important; }

/* A handle is now a real, keyboard-accessible close button, on ALL sheets. */
html.lgct-v3 .modal-content.tvk-sheet-surface::before { display: none !important; }
html.lgct-v3 .modal .modal-content > button.tvk-sheet-grab,
html.lgct-v3 button.tvk-sheet-grab {
  appearance: none; -webkit-appearance: none;
  display: block !important; position: sticky; top: 0; z-index: 6;
  flex: 0 0 40px; width: 144px; height: 40px; min-height: 40px;
  margin: -8px auto 0; padding: 0; border: 0; border-radius: 12px;
  background: transparent; box-shadow: none; cursor: grab;
  touch-action: pan-x pinch-zoom;
  -webkit-user-select: none; user-select: none;
  -webkit-tap-highlight-color: transparent;
}
html.lgct-v3 .modal .modal-content > button.tvk-sheet-grab::before,
html.lgct-v3 button.tvk-sheet-grab::before {
  content: ''; display: block; width: 48px; height: 5px; margin: 0 auto;
  border-radius: 999px; background: #7a4a22; opacity: .5;
}
html.lgct-v3 button.tvk-sheet-grab:active { cursor: grabbing; }
html.lgct-v3 button.tvk-sheet-grab:focus-visible { outline: 2px solid #c9932a; outline-offset: -3px; }
html.lgct-v3 .stickymenu > button.tvk-sheet-grab::before { background: #f3c95a; }
html.lgct-v3 .tvk-sheet-drag-zone { touch-action: pan-x pinch-zoom; }
html.lgct-v3 .tvk-sheet-dragging { transition: none !important; will-change: transform; user-select: none; }
@media (orientation: landscape) and (max-height: 560px) {
  html.lgct-v3 .modal .modal-content > button.tvk-sheet-grab,
  html.lgct-v3 button.tvk-sheet-grab { flex-basis: 32px; height: 32px; min-height: 32px; }
}
@media (prefers-reduced-motion: reduce) {
  html.lgct-v3 .modal .modal-dialog, html.lgct-v3 .kq-sheet, html.lgct-v3 .lgv3-tel-sheet { transition: none !important; }
}

/* Log cards: fit the available content area, independent of screen orientation. */
.tvk-log{box-sizing:border-box;display:flex;flex-direction:column;gap:6px;min-width:0;padding:10px;background:linear-gradient(#fff8e8,#f7ebcf);border:2px solid #b77c29;border-radius:16px;box-shadow:0 0 0 2px #442712;color:#53391f;min-height:200px}
.tvk-log-head{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-shrink:0;min-width:0}
.tvk-log-head h1{margin:0!important;font-size:16px!important;font-weight:800;color:#66270f;line-height:1.3}
.tvk-log-head>span{font-size:11px;color:#816c50;text-align:right}
#index_content.tvk-log-host{padding-bottom:0!important}
.tvk-log-list{display:grid;grid-template-columns:minmax(0,1fr);grid-auto-rows:74px;gap:6px;align-content:start;flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.tvk-log-card{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:minmax(0,1fr) 20px;gap:4px 8px;text-align:left;width:100%;min-width:0;padding:7px 11px;border:1px solid #e6cda0;border-radius:10px;background:#fffdf5;color:#53391f;cursor:pointer;font:inherit;box-shadow:none;touch-action:manipulation}
.tvk-log-card:hover{border-color:#bd852a;background:#fff9e9}
.tvk-log-card:focus-visible,.tvk-log-pager button:focus-visible{outline:3px solid #a9520f;outline-offset:-3px}
.tvk-log-note{grid-column:1/-1;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;font-size:12.5px;line-height:17px;font-weight:600}
.tvk-log-time{font-size:11px;color:#817562;align-self:end}
.tvk-log-amount{font-size:16px;font-weight:800;white-space:nowrap;align-self:end;line-height:20px;font-variant-numeric:tabular-nums}
.tvk-log-amount.is-in{color:#207538}.tvk-log-amount.is-out{color:#a82416}
.tvk-log-status{font-size:11px;line-height:16px;color:#897353;margin:0!important;text-align:center;flex-shrink:0;min-height:16px}
.tvk-log-status.is-error{color:#a82416}.tvk-log-status button{margin-left:6px;border:0;background:transparent;text-decoration:underline;color:inherit;padding:0 4px;font-weight:700}
.tvk-log-pager{display:flex;justify-content:center;align-items:center;gap:5px;flex-shrink:0}
.tvk-log-pager button{width:40px;height:40px;flex:0 0 40px;border:1px solid #a66d20;border-radius:11px;background:linear-gradient(#ffdc7c,#c69122);color:#563214;box-shadow:0 1px 2px #60381530;font-size:15px;touch-action:manipulation}
.tvk-log-pager button:disabled{opacity:.4;cursor:default}.tvk-log-range{min-width:65px;text-align:center;font-size:12px;font-weight:700;white-space:nowrap}
.tvk-log-detail .modal-title{font-size:18px;font-weight:800}.tvk-log-detail-note{white-space:pre-wrap;overflow-wrap:anywhere}.tvk-log-detail-amount{font-size:24px;font-weight:800}.tvk-log-detail-id{color:#816c50}
@media(orientation:landscape) and (min-width:560px),(min-width:900px){.tvk-log-list{grid-template-columns:repeat(2,minmax(0,1fr))}.tvk-log{padding:9px 12px;gap:6px}}
@media(max-width:359px){.tvk-log{padding:8px}.tvk-log-head>span{display:none}.tvk-log-pager{gap:3px}.tvk-log-range{min-width:54px}}
@media(prefers-reduced-motion:reduce){.tvk-log-detail.fade{transition:none}}
