/* style-go88-vb.css — per-site override cho go88-vb.com.co
   KHÔNG viết lại component CSS dùng chung — mọi component vẫn từ design/library/lib.css.
   File này CHỈ: (1) đặt palette riêng site (biến --brand/--brand2/--heading/--bg),
   (2) vá các state hover/box-shadow trong lib.css đang HARDCODE màu vàng casino
       (không đọc qua biến --brand) — nếu không vá, nút/card của site này sẽ "brand xanh
       lá nhưng hover lại nhảy sang vàng" (bug tương tự lỗi gold-hover đã ghi nhận, chỉ khác
       chiều: ở đây do state hover không dùng biến mà hardcode rgba(255,200,61,...)).
   KHÔNG đụng sites khác / lib.css dùng chung — chỉ ảnh hưởng site này.
   ============================================================ */

:root{
  /* Màu TỰ TRÍCH bằng PIL đếm pixel trên ảnh mainsite go88.tw THẬT (không bịa,
     không dùng navy mặc định — xem log trích màu trong _shell.py docstring):
     --brand  : 100% pixel (sau lọc nền) của chungnhan-175x55-0ad74d.png (badge chứng nhận/cấp phép,
                mảng xanh lá thật trên mainsite) → #68b840
     --brand2 : darken(--brand, 68%) → #467d2b (tự tính, dùng cho gradient/hover)
     --bg     : mẫu vùng nền tối mainsite (screencapture gốc #040201) nâng nhẹ → #0a0906
     --heading: giữ #fff (mặc định lib.css, đủ tương phản trên nền tối) */
  --brand: #68b840;
  --brand2: #467d2b;
  --heading: #ffffff;
  --bg: #0a0906;
  --brand-grad: linear-gradient(135deg,#82e650,#467d2b);
  --glow: 0 0 0 1px rgba(104,184,64,.35),0 8px 26px -8px rgba(104,184,64,.45);
}

/* Heading: thống nhất H1/H2/H3 theo brand xanh lá (đồng bộ với --brand, không còn vàng) */
.h1, .h2, .read h2, .read h3 { color: var(--brand); }

/* Hero trang chủ: H1 căn giữa (CHỈ H1 hero — .home-hero chỉ bọc hero cột giữa index.html) */
.home-hero .h1 { text-align: center; }

/* "4 sảnh game" (game_grid, trang chủ): 1 CỘT DỌC (.gg-stack), mỗi card 1 hàng full chiều rộng
   cột giữa (6/12) của layout 3-6-3 liền mạch — KHÔNG chia cột ngang (đã bỏ .grid-4 theo yêu cầu
   Bruce 2026-07-10: chia 4 cột làm chữ bị bó/ngắt dòng xấu), KHÔNG tách full-width khỏi trang.
   Scope riêng .gg-tile/.gg-stack — KHÔNG đụng .card dùng chung ở cột phải (bài mới nhất) hay
   nơi khác. Card CHỈ CÒN CHỮ (không ảnh thumbnail sảnh) -> full-width nên chữ ăn hết chiều
   ngang, không ngắt dòng vụn. */
.gg-stack { display: flex; flex-direction: column; gap: 14px; }
.gg-tile .pad { padding: 16px 20px; }

/* ── Vá hover/box-shadow hardcode vàng (không đọc var --brand) — CHỈ site này ── */
.btn-main:hover{
  background: linear-gradient(135deg,#82e650,#467d2b);
  box-shadow: 0 0 0 1px rgba(104,184,64,.55), 0 12px 30px -8px rgba(104,184,64,.6);
}
.btn:not(.btn-main):hover{ background: rgba(104,184,64,.12); }
.lib a:hover{ color:#9be36c; }
.card:hover{ border-color: rgba(104,184,64,.35); }
.gcard:hover{ border-color: rgba(104,184,64,.4); }
.box:hover{ border-color: rgba(104,184,64,.3); }
.tabs .tab.on{ box-shadow: 0 6px 16px -6px rgba(104,184,64,.5); }
.acc details[open]{ border-color: rgba(104,184,64,.35); }
.faq details[open]{ border-color: rgba(104,184,64,.3); }
.h2{ background: linear-gradient(90deg,rgba(104,184,64,.10),transparent 40%); }

/* Caption anh long-content (D1 loop-back dot 2 muc 4-5): chu nho, nghieng nhe, canh giua
   ngay duoi anh — thay cho <p><em>> lan trong acc-body (gay lap noi dung). */
.img-cap{
  margin: 6px 0 0; text-align: center; font-style: italic;
  font-size: 12.5px; color: #9aa5b8; line-height: 1.5;
}

/* Reviews (R1): avatar CHU CAI DAU ten (khong anh mat nguoi that) — hinh tron brand xanh la */
.rv-avatar{
  flex-shrink:0; width:36px; height:36px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background: var(--brand-grad); color:#0a0906; font-weight:700; font-size:15px;
}