/* ============================================================================
   gaming.css — "Gaming · Dark Red" skin · Visual / Component layer
   ----------------------------------------------------------------------------
   เลเยอร์ "ความสวย" ที่ token เพียว ๆ ทำไม่ได้ (พื้นหลังแดงฟุ้ง, noise, glass blur,
   glow ตอน hover, แอนิเมชัน modal). ทุกค่า "สี/เงา/ขอบ" อ้าง var(--token) จากไฟล์
   token กลาง include/themes/gaming.theme.php เท่านั้น — ห้าม hardcode รายจุด.

   ทุกกฎ scope ใต้ html[data-theme="gaming"] → ปิดสกินเมื่อไหร่ก็หายเกลี้ยง
   ไม่รั่วไปธีมคลาสสิก. โหลดผ่าน header.php (slot เดียวกับ dark.css).
   ============================================================================ */

/* ── พื้นหลังเว็บไซต์: ดำแดง gaming + gradient มืด + radial glow แดงฟุ้ง ── */
html[data-theme="gaming"],
html[data-theme="gaming"] body {
  background: var(--app-bg) !important;
  background-attachment: fixed !important;
  color: var(--color-text);
}

/* Texture / Noise เบา ๆ + glow จาง — overlay เต็มจอ ไม่จับ pointer, ไม่รกตา */
html[data-theme="gaming"] body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
  background-size: 160px 160px;
  opacity: .035;
  mix-blend-mode: screen;
}
/* แสงแดงฟุ้งบาง ๆ มุมบน (Overlay แบบ Gaming) */
html[data-theme="gaming"] body::after {
  content: "";
  position: fixed;
  top: -20vh;
  left: 50%;
  width: 120vw;
  height: 60vh;
  transform: translateX(-50%);
  z-index: 0;
  pointer-events: none;
  background: radial-gradient(ellipse at center, var(--gm-glow-soft), transparent 70%);
  filter: blur(40px);
  opacity: .7;
}
/* ให้เนื้อหาอยู่เหนือ overlay */
html[data-theme="gaming"] #kt_app_wrapper,
html[data-theme="gaming"] .wrapper,
html[data-theme="gaming"] main,
html[data-theme="gaming"] .app-wrapper { position: relative; z-index: 1; }

/* ── Scrollbar โทนแดง ── */
html[data-theme="gaming"] ::-webkit-scrollbar { width: 10px; height: 10px; }
html[data-theme="gaming"] ::-webkit-scrollbar-track { background: var(--color-bg); }
html[data-theme="gaming"] ::-webkit-scrollbar-thumb {
  background: var(--gm-scrollbar);
  border-radius: var(--radius-pill);
  border: 2px solid var(--color-bg);
}
html[data-theme="gaming"] * { scrollbar-color: var(--gm-scrollbar) var(--color-bg); }

/* ── Card: glass อ่อน ๆ + hover ยกขึ้น + เงาแดงจาง ── */
html[data-theme="gaming"] .card,
html[data-theme="gaming"] .tkt-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: var(--card-radius);
  box-shadow: var(--shadow-card);
  backdrop-filter: blur(6px);
  transition: transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base);
}
html[data-theme="gaming"] .card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-lift);
  border-color: var(--color-line-red);
}

/* ── Button Primary: พื้นแดง + hover เรืองแดง + active กดเข้มขึ้น ── */
html[data-theme="gaming"] .btn-primary,
html[data-theme="gaming"] .btn.btn-primary {
  background: var(--grad-primary);
  border: none;
  color: var(--color-white);
  transition: all var(--transition-base);
}
html[data-theme="gaming"] .btn-primary:hover {
  box-shadow: var(--shadow-glow);
  transform: translateY(-1px);
  filter: brightness(1.06);
}
html[data-theme="gaming"] .btn-primary:active { filter: brightness(.9); transform: translateY(0); }

/* Secondary: พื้นเข้ม + border แดงจาง */
html[data-theme="gaming"] .btn-secondary,
html[data-theme="gaming"] .btn-light,
html[data-theme="gaming"] .btn-outline {
  background: var(--color-surface-alt);
  border: 1px solid var(--color-line-red);
  color: var(--color-text);
  transition: all var(--transition-base);
}
html[data-theme="gaming"] .btn-secondary:hover,
html[data-theme="gaming"] .btn-light:hover {
  border-color: var(--color-primary);
  color: var(--color-text);
}

/* Ghost: โปร่งใส + hover แดงจาง */
html[data-theme="gaming"] .btn-ghost,
html[data-theme="gaming"] .btn-active-light,
html[data-theme="gaming"] .btn-icon {
  background: transparent;
  color: var(--color-text-soft);
  transition: all var(--transition-base);
}
html[data-theme="gaming"] .btn-ghost:hover,
html[data-theme="gaming"] .btn-icon:hover {
  background: var(--nv-hover);
  color: var(--color-text);
}

/* ── Input: พื้น muted + ขอบบาง + focus ขอบแดงเรือง + transition นุ่ม ── */
html[data-theme="gaming"] .form-control,
html[data-theme="gaming"] .form-select,
html[data-theme="gaming"] input[type="text"],
html[data-theme="gaming"] input[type="email"],
html[data-theme="gaming"] input[type="password"],
html[data-theme="gaming"] input[type="number"],
html[data-theme="gaming"] input[type="search"],
html[data-theme="gaming"] textarea {
  background: var(--field-bg);
  border: 1px solid var(--field-border);
  color: var(--color-text);
  transition: border-color var(--transition-base), box-shadow var(--transition-base), background var(--transition-base);
}
html[data-theme="gaming"] .form-control:focus,
html[data-theme="gaming"] .form-select:focus,
html[data-theme="gaming"] input:focus,
html[data-theme="gaming"] textarea:focus {
  background: var(--field-bg-focus);
  border-color: var(--field-border-focus);
  box-shadow: var(--field-focus-ring);
  outline: none;
}
html[data-theme="gaming"] ::placeholder { color: var(--color-text-soft) !important; opacity: 1; }

/* ── Navbar: glass + blur + เส้นล่างจาง ── */
html[data-theme="gaming"] .app-navbar,
html[data-theme="gaming"] .app-header,
html[data-theme="gaming"] .ao-topbar,
html[data-theme="gaming"] .header {
  background: var(--nv-bg) !important;
  backdrop-filter: blur(14px) saturate(140%);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  border-bottom: 1px solid var(--nv-border);
}

/* ── พื้นหลังแถบเมนูบน (#kt_header + #kt_header_nav) → ทึบสีเดียวเรียบ ──
   เดิมเป็นพื้นโปร่งแสง (var(--nv-bg)=rgba ...0.82) → แสงแดงฟุ้งจากพื้นหลังเว็บ
   ทะลุขึ้นมาไม่เท่ากัน เห็นเป็นหย่อมจาง/เข้ม. ทับเป็นสีทึบล้วน + ปิด backdrop blur
   → สีพื้นเรียบสม่ำเสมอทั้งแถบ ── */
html[data-theme="gaming"] #kt_header,
html[data-theme="gaming"] #kt_header_nav {
  background: #0d090b !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* ── Sidebar: พื้นเข้ม + active menu แถบแดง + hover แดงจาง ── */
html[data-theme="gaming"] .app-sidebar,
html[data-theme="gaming"] .aside {
  background: var(--color-bg-subtle) !important;
  border-right: 1px solid var(--color-line);
}
html[data-theme="gaming"] .menu-link {
  border-radius: var(--radius-md);
  transition: background var(--transition-base), color var(--transition-base);
}
html[data-theme="gaming"] .menu-link:hover { background: var(--nv-hover); color: var(--color-text); }
html[data-theme="gaming"] .menu-item .menu-link.active,
html[data-theme="gaming"] .menu-link.active {
  background: var(--nv-pink-bg);
  color: var(--color-text);
  box-shadow: inset 3px 0 0 0 var(--color-primary);
}
html[data-theme="gaming"] .menu-link.active .menu-icon i,
html[data-theme="gaming"] .menu-link.active .menu-title { color: var(--color-primary) !important; }

/* ── Table: header เข้ม + hover แถวแดงจาง + border เบามาก ── */
html[data-theme="gaming"] .table { color: var(--color-text); border-color: var(--color-line); }
html[data-theme="gaming"] .table thead th,
html[data-theme="gaming"] .table th {
  background: var(--color-surface-alt);
  color: var(--color-text-soft);
  border-color: var(--color-line);
}
html[data-theme="gaming"] .table td { border-color: var(--color-line-soft); }
html[data-theme="gaming"] .table tbody tr { transition: background var(--transition-fast); }
html[data-theme="gaming"] .table tbody tr:hover { background: var(--nv-hover); }

/* ── Modal / Popup: พื้นเข้ม + blur ด้านหลัง + แอนิเมชันเปิดนุ่ม ── */
html[data-theme="gaming"] .modal-backdrop,
html[data-theme="gaming"] .modal-backdrop.show {
  background: var(--modal-backdrop) !important;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  opacity: 1;
}
html[data-theme="gaming"] .modal-content {
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  border-radius: var(--card-radius);
  box-shadow: var(--shadow-lg);
}
html[data-theme="gaming"] .modal.show .modal-dialog { animation: gmModalIn .25s var(--ease-out-soft); }
@keyframes gmModalIn {
  from { opacity: 0; transform: translateY(12px) scale(.98); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* ── Dropdown / Offcanvas ── */
html[data-theme="gaming"] .dropdown-menu,
html[data-theme="gaming"] .menu-sub-dropdown,
html[data-theme="gaming"] .offcanvas {
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  box-shadow: var(--shadow-lg);
}

/* ── หัวข้อไล่เฉด (gradient heading) ── */
html[data-theme="gaming"] .grad,
html[data-theme="gaming"] .text-gradient {
  background: var(--grad-heading);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* ── Animation กลาง: fade-in เนื้อหาเบา ๆ ── */
@keyframes gmFade { from { opacity: 0; } to { opacity: 1; } }
html[data-theme="gaming"] .card,
html[data-theme="gaming"] .modal-content { animation-fill-mode: both; }

/* ============================================================================
   OVERRIDES สำหรับชุด CSS เฉพาะหน้า (bespoke) ที่ hardcode พื้นสว่าง
   ทุกตัว scope ใต้ html[data-theme="gaming"] + อ้าง var(--token) เท่านั้น
   ตั้ง background-COLOR เป็นหลัก (ไม่แตะ background-image → รูปสินค้า/โลโก้รอด)
   ============================================================================ */

/* ── พื้นเพจให้มืดแน่นอน (กันพื้นโปร่งโชว์ canvas ขาว) ── */
html[data-theme="gaming"] body,
html[data-theme="gaming"] body#kt_body {
  background: transparent !important;
  color: var(--color-text);
}

/* ── Navbar กระจก (.gnav — template/navbar.php hardcode ขาว) ── */
html[data-theme="gaming"] .gnav {
  background: var(--nv-bg) !important;
  border-bottom: 1px solid var(--nv-border) !important;
  backdrop-filter: saturate(160%) blur(14px);
  -webkit-backdrop-filter: saturate(160%) blur(14px);
}
html[data-theme="gaming"] .gnav-link,
html[data-theme="gaming"] .gnav-lang,
html[data-theme="gaming"] .gnav-burger {
  color: var(--nv-text-soft) !important;
  background: transparent !important;
  border-color: var(--nv-border) !important;
}
html[data-theme="gaming"] .gnav-link:hover,
html[data-theme="gaming"] .gnav-lang:hover,
html[data-theme="gaming"] .gnav-burger:hover {
  color: var(--nv-text) !important;
  background: var(--nv-hover) !important;
}
/* เฉพาะแผง dropdown (.gnav-dd-menu) เท่านั้นที่ควรมีกรอบ/เงา — เดิมเผลอใส่
   .gnav-dd (กล่อง wrapper) ด้วย ทำให้เกิดกรอบถาวรรอบปุ่ม "สินค้า". .gnav-dd
   เป็นแค่ตัวจัดตำแหน่ง relative ต้องโปร่งใสเหมือนลิงก์อื่น */
html[data-theme="gaming"] .gnav-dd {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html[data-theme="gaming"] .gnav-dd-menu {
  background: var(--color-surface) !important;
  border: 1px solid var(--color-line) !important;
  box-shadow: var(--shadow-lg) !important;
  color: var(--color-text) !important;
}
html[data-theme="gaming"] .gnav-btn.is-login {
  background: var(--color-surface-alt) !important;
  border: 1px solid var(--color-line-red) !important;
  color: var(--color-text) !important;
}
html[data-theme="gaming"] .gnav-btn:not(.is-login) {
  background: var(--grad-primary) !important;
  border: none !important;
  color: var(--color-white) !important;
}

/* ── พื้นผิว bespoke ทั่วไป → surface ของธีม (background-color เท่านั้น) ──
   ครอบชุด in-/mn-/ap- + รูปแบบ -card/-panel/-sheet/-tile/-box/-chip/-item */
html[data-theme="gaming"] [class*="-card"],
html[data-theme="gaming"] [class*="-panel"],
html[data-theme="gaming"] [class*="-sheet"],
html[data-theme="gaming"] [class*="-tile"],
html[data-theme="gaming"] [class*="-box"],
html[data-theme="gaming"] .in-section,
html[data-theme="gaming"] .in-news,
html[data-theme="gaming"] .in-ticker,
html[data-theme="gaming"] .in-topup,
html[data-theme="gaming"] .in-community {
  background-color: var(--color-surface) !important;
  border-color: var(--color-line) !important;
  color: var(--color-text);
}

/* ── Chip/eyebrow/badge สว่าง → พื้นแดงจาง (เก็บ chip สถานะที่อิ่มสีไว้ทาง JS) ── */
html[data-theme="gaming"] .in-hero-eyebrow,
html[data-theme="gaming"] .in-cat-chip,
html[data-theme="gaming"] [class*="-chip"] {
  background-color: var(--color-surface-alt) !important;
  border-color: var(--color-line) !important;
  color: var(--color-text-soft) !important;
}

/* ── ปุ่ม hero (.in-hero-btn.is-primary ใช้ var(--color-text)=ขาว → ขาวบนขาว!) ── */
html[data-theme="gaming"] .in-hero-btn.is-primary {
  background: var(--grad-primary) !important;
  color: var(--color-white) !important;
  box-shadow: var(--shadow-glow) !important;
}
html[data-theme="gaming"] .in-hero-btn.is-ghost {
  background: var(--color-surface-alt) !important;
  border: 1px solid var(--color-line-red) !important;
  color: var(--color-text) !important;
}

/* ── ตัวอักษรหลักของชุด in-* ให้อ่านชัด ── */
html[data-theme="gaming"] .in-hero-title,
html[data-theme="gaming"] .in-section-title,
html[data-theme="gaming"] [class*="-title"] { color: var(--color-text); }
html[data-theme="gaming"] [class*="-sub"],
html[data-theme="gaming"] [class*="-desc"],
html[data-theme="gaming"] [class*="-text"] { color: var(--color-text-soft); }

/* ── inline-style พื้นขาวที่ฝังในมาร์กอัป → surface ของธีม ── */
html[data-theme="gaming"] [style*="background:#fff"],
html[data-theme="gaming"] [style*="background: #fff"],
html[data-theme="gaming"] [style*="background:#ffffff"],
html[data-theme="gaming"] [style*="background-color:#fff"],
html[data-theme="gaming"] [style*="rgba(255,255,255"] {
  background-color: var(--color-surface) !important;
  border-color: var(--color-line) !important;
}

/* ── เส้น/divider ── hr เป็นเส้นจริง (มี bg) แต่ container ที่ชื่อมี -divider/-sep
   ให้แค่ border-color (อย่าใส่ background → ไม่งั้นกลายเป็น "กล่อง" ครอบ) ── */
html[data-theme="gaming"] hr { border-color: var(--color-line) !important; background-color: var(--color-line) !important; }
html[data-theme="gaming"] [class*="-divider"],
html[data-theme="gaming"] [class*="-sep"] { border-color: var(--color-line) !important; }

/* ── ปุ่มชุดกลาง .ao-btn (ใช้ทั่วเว็บ: login/register/profile/marketplace/…)
   .ao-btn--solid เดิม bg = var(--color-ink) → กลายเป็นขาวในธีม → ทำเป็นแดง CTA ── */
html[data-theme="gaming"] .ao-btn--solid {
  background: var(--grad-primary) !important;
  color: var(--color-white) !important;
  border: none !important;
}
html[data-theme="gaming"] .ao-btn--solid:hover {
  box-shadow: var(--shadow-glow) !important;
  filter: brightness(1.06);
}
html[data-theme="gaming"] .ao-btn--solid:disabled { background: var(--color-surface-mut) !important; color: var(--color-text-muted) !important; filter: none; }
html[data-theme="gaming"] .ao-btn--outline {
  background: var(--color-surface-alt) !important;
  border: 1px solid var(--color-line-red) !important;
  color: var(--color-text) !important;
}
html[data-theme="gaming"] .ao-btn--ghost { color: var(--color-text-soft) !important; }
html[data-theme="gaming"] .ao-btn--ghost:hover { background: var(--nv-hover) !important; color: var(--color-text) !important; }

/* ── ปุ่ม "ดำ" อื่น ๆ ที่ใช้ ink/text เป็นพื้น (จะกลายเป็นขาว) → แดง ── */
html[data-theme="gaming"] .btn-dark,
html[data-theme="gaming"] .in-stat-icon.is-prod { background: var(--grad-primary) !important; color: var(--color-white) !important; }

/* ── ปุ่ม action/save/confirm/add ที่ bg = var(--color-text)/ink (= ขาวในธีม → ขาวบนขาว
   มองไม่เห็น) → แดง CTA. mirror สิ่งที่ dark.css ทำไว้แล้วแต่ gaming.css ยังขาด.
   รวม inline-style ผ่าน attribute selector (ปุ่ม add ในหน้าสินค้า / save ใน modal) ── */
html[data-theme="gaming"] .ap-add-btn,
html[data-theme="gaming"] .ap-add-btn-green,
html[data-theme="gaming"] .ap-add-btn-blue,
html[data-theme="gaming"] .apf-btn-save,
html[data-theme="gaming"] .aps-btn-save,
html[data-theme="gaming"] .qas-btn-save,
html[data-theme="gaming"] .disc-modal .swal2-confirm,
html[data-theme="gaming"] .om-modal .swal2-confirm,
html[data-theme="gaming"] .pf-src-btn.active,
html[data-theme="gaming"] [style*="background:var(--color-text)"],
html[data-theme="gaming"] [style*="background: var(--color-text)"] {
  background: var(--grad-primary) !important;
  color: var(--color-white) !important;
  border-color: transparent !important;
}
html[data-theme="gaming"] .ap-action-btn:hover,
html[data-theme="gaming"] .ap-disc-apply-btn:hover {
  background: var(--grad-primary) !important;
  color: var(--color-white) !important;
  border-color: transparent !important;
}

/* ── พื้นหลังแอนิเมชันกลาง (.kt-anim-bg / .kt-anim-grid — ทุกหน้า) ──
   ต้นเหตุหลักของ "พื้นสว่างทุกหน้า": base #fafafa + พาสเทลสว่าง 3 ชั้น
   → เปลี่ยนเป็น aurora แดงจาง ๆ บนพื้นมืดธีม (mirror วิธีของ dark.css) */
html[data-theme="gaming"] .kt-anim-bg {
  background:
    radial-gradient(ellipse 55% 50% at 18% 22%, rgba(255,32,32,0.16) 0%, transparent 60%),
    radial-gradient(ellipse 50% 45% at 82% 78%, rgba(255,64,64,0.11) 0%, transparent 60%),
    radial-gradient(ellipse 45% 40% at 50% 55%, rgba(255,0,0,0.07) 0%, transparent 55%),
    var(--color-bg) !important;
}
/* เอาเส้นตารางพื้นหลังออกตามคำขอ (ไม่ต้องมีเส้น) */
html[data-theme="gaming"] .kt-anim-grid {
  background-image: none !important;
  display: none !important;
}
/* falling_blocks deco (พาสเทลอ่อน) → เกล็ดแดงจาง ๆ ไม่รบกวน */
html[data-theme="gaming"] .fb-layer-back { opacity: .22; }
html[data-theme="gaming"] .fb-c1, html[data-theme="gaming"] .fb-c2, html[data-theme="gaming"] .fb-c3,
html[data-theme="gaming"] .fb-c4, html[data-theme="gaming"] .fb-c5, html[data-theme="gaming"] .fb-c6,
html[data-theme="gaming"] .fb-c7, html[data-theme="gaming"] .fb-c8, html[data-theme="gaming"] .fb-c9 {
  background: rgba(255,40,40,0.06) !important;
  border-color: rgba(255,40,40,0.10) !important;
  box-shadow: none !important;
}
/* footer */
html[data-theme="gaming"] .ao-footer { background: var(--color-bg-subtle) !important; border-top-color: var(--color-line) !important; }
html[data-theme="gaming"] .ao-footer-dot { background: var(--color-surface-mut) !important; }

/* ============================================================================
   NEON FX — สีสัน + เอฟเฟกต์เรืองแสง (โทน lastvegashop)
   ทุกตัว scope html[data-theme="gaming"] เท่านั้น → ปิด skin = หายหมด
   ปิดอนิเมชันอัตโนมัติเมื่อผู้ใช้ตั้ง prefers-reduced-motion (ดู block ท้าย)
   ============================================================================ */

/* keyframes กลาง */
@keyframes gmRGBShift { to { background-position: 300% center; } }
@keyframes gmGlowPulse {
  0%, 100% { box-shadow: 0 8px 24px rgba(255,32,32,.28), 0 0 8px rgba(255,40,40,.20); }
  50%      { box-shadow: 0 8px 30px rgba(255,40,40,.45), 0 0 26px rgba(255,56,56,.55); }
}
@keyframes gmFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }

/* ── โลโก้แบรนด์: ไล่สี RGB เลื่อนนุ่ม ๆ + เรืองแสง (เหมือน LASTVEGA SHOP) ── */
html[data-theme="gaming"] .ao-logo-name {
  background: linear-gradient(90deg,#ff2d55,#ff8a00,#ffd60a,#34d399,#3aa7ff,#a855f7,#ff2d55);
  background-size: 300% auto;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  filter: drop-shadow(0 0 10px rgba(255,72,128,.35));
  font-weight: 800; letter-spacing: .5px;
  animation: gmRGBShift 8s linear infinite;
}
html[data-theme="gaming"] .ao-logo-icon { filter: drop-shadow(0 0 8px rgba(255,48,80,.45)); }

/* ── หัวข้อ hero ไล่เฉดนีออน + เรืองแสง ── */
html[data-theme="gaming"] .in-hero-title .grad,
html[data-theme="gaming"] .in-hero-title.grad {
  background: linear-gradient(90deg,#ff3d5a,#ff7a18,#ffd166,#ff3d5a);
  background-size: 200% auto;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  filter: drop-shadow(0 0 16px rgba(255,45,90,.4));
  animation: gmRGBShift 7s linear infinite;
}

/* ── ปุ่มหลัก hero: เรืองแสงเต้นจังหวะ ── */
html[data-theme="gaming"] .in-hero-btn.is-primary {
  animation: gmGlowPulse 2.8s ease-in-out infinite;
}
html[data-theme="gaming"] .in-hero-btn.is-primary:hover { filter: brightness(1.12); transform: translateY(-2px); }

/* ── ปุ่มโซเชียล CTA: คงสีแบรนด์ + เพิ่มเรืองแสงสีนั้น ๆ (สีสันแบบ lastvegashop) ── */
html[data-theme="gaming"] .ao-btn.is-telegram { box-shadow: 0 0 16px rgba(34,158,217,.45) !important; }
html[data-theme="gaming"] .ao-btn.is-line     { box-shadow: 0 0 16px rgba(6,199,85,.45)  !important; }
html[data-theme="gaming"] .ao-btn.is-discord  { box-shadow: 0 0 16px rgba(88,101,242,.48) !important; }
html[data-theme="gaming"] .ao-btn.is-telegram:hover { box-shadow: 0 0 30px rgba(34,158,217,.75) !important; transform: translateY(-2px); }
html[data-theme="gaming"] .ao-btn.is-line:hover     { box-shadow: 0 0 30px rgba(6,199,85,.75)  !important; transform: translateY(-2px); }
html[data-theme="gaming"] .ao-btn.is-discord:hover  { box-shadow: 0 0 30px rgba(88,101,242,.8)  !important; transform: translateY(-2px); }

/* ── ตัวเลขสถิติเรืองแสง (80% / 95% / 99%) ── */
html[data-theme="gaming"] .in-stat-num {
  color: #eafff5 !important;
  text-shadow: 0 0 10px rgba(0,217,127,.55), 0 0 22px rgba(0,217,127,.30);
}
html[data-theme="gaming"] .in-stat { transition: transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base); }
html[data-theme="gaming"] .in-stat:hover {
  transform: translateY(-3px);
  border-color: rgba(0,217,127,.42) !important;
  box-shadow: 0 0 26px rgba(0,217,127,.20), 0 12px 32px rgba(0,0,0,.45) !important;
}
/* ไอคอนสถิติ: เรืองแสงตามสี gradient ของแต่ละแบบ */
html[data-theme="gaming"] .in-stat-icon.is-cat  { box-shadow: 0 0 18px rgba(139,92,246,.5); }
html[data-theme="gaming"] .in-stat-icon.is-ord  { box-shadow: 0 0 18px rgba(34,197,94,.5); }
html[data-theme="gaming"] .in-stat-icon.is-prod { box-shadow: 0 0 18px rgba(255,48,48,.5); }

/* ── การ์ดหมวด/เกม: ขอบนีออน + ยกลอย + เรืองแสงตอน hover ── */
html[data-theme="gaming"] .mn-cat-card,
html[data-theme="gaming"] .in-cat-link {
  transition: transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base);
}
html[data-theme="gaming"] .in-cat-link:hover .mn-cat-card,
html[data-theme="gaming"] .mn-cat-card:hover {
  transform: translateY(-4px);
  border-color: rgba(255,56,90,.5) !important;
  box-shadow: 0 0 28px rgba(255,45,90,.28), 0 14px 36px rgba(0,0,0,.5) !important;
}
html[data-theme="gaming"] .in-cat-img { transition: filter var(--transition-base); }
html[data-theme="gaming"] .mn-cat-card:hover .in-cat-img,
html[data-theme="gaming"] .in-cat-link:hover .in-cat-img { filter: saturate(1.15) brightness(1.06); }

/* ── การ์ดทั่วไป: เพิ่มเรืองแดงนีออนตอน hover (ต่อยอด .card เดิม) ── */
html[data-theme="gaming"] .card:hover {
  box-shadow: 0 0 24px rgba(255,40,40,.18), var(--shadow-lift);
}

/* ── หัวข้อ section: เส้นใต้เรืองแสงเล็ก ๆ ── */
html[data-theme="gaming"] .in-card-icon {
  box-shadow: 0 0 14px rgba(255,48,80,.35);
}

/* ============================================================================
   AMBIENT FX — ดาวตก + คลิก burst + เข้าหน้า (สร้าง DOM โดย gaming-skin.js)
   ============================================================================ */

/* ── 1) ดาวตก (shooting stars) — overlay หลังเนื้อหา, ไม่จับ pointer ── */
html[data-theme="gaming"] #gm-stars {
  position: fixed; inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: 0;
}
html[data-theme="gaming"] .gm-star {
  position: absolute;
  top: var(--gm-top, 20%);
  left: var(--gm-left, 50%);
  width: 92px; height: 2px;
  border-radius: 2px;
  background: linear-gradient(90deg, rgba(180,214,255,0) 0%, var(--gm-star-b, rgba(190,222,255,.65)) 60%, var(--gm-star-c, #ffffff) 100%);
  filter: drop-shadow(0 0 6px var(--gm-star-g, rgba(150,200,255,.85)));
  opacity: 0;
  will-change: transform, opacity;
  animation: gmShoot var(--gm-dur, 5s) linear var(--gm-delay, 0s) infinite;
}
@keyframes gmShoot {
  0%   { opacity: 0; transform: rotate(35deg) translateX(-80px); }
  8%   { opacity: 1; }
  72%  { opacity: 1; }
  100% { opacity: 0; transform: rotate(35deg) translateX(380px); }
}

/* ── 2) คลิก = พลุแตก — วงแหวนกระแทกขยาย + ละอองพลุหลากสีกระจายรอบทิศ
   แล้วร่วงตามแรงโน้มถ่วง (ตำแหน่ง/สี/ขนาด/เวลา สุ่มโดย gaming-skin.js) ── */
html[data-theme="gaming"] .gm-click,
html[data-theme="gaming"] .gm-fx {
  position: fixed;
  pointer-events: none;
  z-index: 9999;
}
/* วงแหวนกระแทกตรงกลาง (shockwave) */
html[data-theme="gaming"] .gm-click {
  width: 14px; height: 14px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  border: 2px solid rgba(255,96,116,.95);
  box-shadow: 0 0 18px rgba(255,72,92,.8);
  animation: gmClickRing .5s ease-out forwards;
}
@keyframes gmClickRing {
  0%   { opacity: 1; width: 6px; height: 6px; border-width: 3px; }
  100% { opacity: 0; width: 74px; height: 74px; border-width: 1px; }
}
/* ละอองพลุ: ยิงออกตามมุม+ระยะที่สุ่ม → ปลายทางมี gravity ดึงลง → จางหายพร้อมหด */
html[data-theme="gaming"] .gm-fx {
  width: var(--gm-sz, 6px); height: var(--gm-sz, 6px);
  border-radius: 50%;
  background: var(--gm-col, #ff5a6e);
  box-shadow: 0 0 8px var(--gm-col, #ff5a6e), 0 0 16px var(--gm-col, #ff5a6e);
  transform: translate(-50%, -50%);
  animation: gmFirework var(--gm-dur, .8s) cubic-bezier(.12,.62,.3,1) forwards;
}
@keyframes gmFirework {
  0%   { opacity: 1; transform: translate(-50%,-50%) translate(0,0) scale(1.1); }
  75%  { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%,-50%) translate(var(--gm-tx,0), var(--gm-ty,0)) scale(.25); }
}

/* ── ปิดแอนิเมชันโหลดหน้า "แบบเดิม" (motion.css: ktPageFadeIn/ktFadeUp + stagger
   ของ index.php) เฉพาะธีม gaming → ปล่อยให้ scroll-reveal คุมแทน.
   ⚠️ ตั้งแค่ animation:none เท่านั้น (ห้ามแตะ opacity/transform) เพราะ fill-mode
   'both' ของของเดิมจะไป "ทับ" opacity:0 ของ .gm-reveal ทำให้การ์ดล่างจอไม่ถูกซ่อน
   = scroll-reveal ไม่ทำงาน. พอ animation:none ของเดิมหายไป สถานะซ่อนของเราจึงมีผล */
html[data-theme="gaming"] body main,
html[data-theme="gaming"] body #kt_wrapper > .container,
html[data-theme="gaming"] body #kt_wrapper > div.container,
html[data-theme="gaming"] body #kt_wrapper > div[class*="container"],
html[data-theme="gaming"] body > .auth-wrap,
html[data-theme="gaming"] body > .ao-layout,
html[data-theme="gaming"] body > .hp-wrap,
html[data-theme="gaming"] body > .st-container,
html[data-theme="gaming"] body > .container,
html[data-theme="gaming"] body > div.container,
html[data-theme="gaming"] body > div[class*="container"],
html[data-theme="gaming"] body main > section,
html[data-theme="gaming"] body main > div,
html[data-theme="gaming"] body main > article,
html[data-theme="gaming"] body main > .row,
html[data-theme="gaming"] body #kt_wrapper > [class*="container"] > *,
html[data-theme="gaming"] body > .container > *,
html[data-theme="gaming"] body > div[class*="container"] > *,
html[data-theme="gaming"] body .ao-page-content > *,
html[data-theme="gaming"] body .hp-wrap > *,
html[data-theme="gaming"] body .st-container > *,
html[data-theme="gaming"] .in-cat-grid .in-cat-link,
html[data-theme="gaming"] .in-stats .in-stat {
  -webkit-animation: none !important;
          animation: none !important;
}

/* ── 3) SCROLL REVEAL — เนื้อหา/สินค้า "ค่อย ๆ เด้งขึ้น" ตอนเลื่อนถึง ──
   ไม่มีดีเลย์ตอนโหลดอีกแล้ว: ของที่อยู่ในจอตั้งแต่แรกโชว์ทันที (JS ติด is-visible
   ให้เลย), ของที่อยู่ล่างจอค่อยเผยตอนเลื่อนมาเห็น. คลาส gm-reveal-on ติดที่ <html>
   โดย JS เฉพาะเมื่อรองรับ IntersectionObserver + ไม่ใช่ reduced-motion → ถ้า JS ปิด
   หรือไม่รองรับ เนื้อหาจะโชว์ปกติ (FALLBACK-SAFE ไม่มีของหาย). ใช้ได้ทั้ง PC/มือถือ */
html[data-theme="gaming"].gm-reveal-on .gm-reveal {
  opacity: 0;
  transform: translateY(34px) scale(.965);
  transition: opacity .55s cubic-bezier(.22,.61,.36,1), transform .55s cubic-bezier(.34,1.3,.5,1);
  will-change: opacity, transform;
}
html[data-theme="gaming"].gm-reveal-on .gm-reveal.is-visible {
  opacity: 1;
  transform: none;
}

/* ── ป้ายสถานะ/Semantic โทนเข้มจัด อิ่มสี (ไม่เรืองซีด) ── ชิปที่ hardcode สี
   เข้ม (ออกแบบเพื่อโหมดสว่าง) จะ "ดับ" บนพื้นมืด → ดันเป็นสีเข้มอิ่มของธีม ── */
html[data-theme="gaming"] .sp-status.is-on {
  background: rgba(0,200,83,0.16) !important; color: var(--color-success) !important;
  border-color: rgba(0,200,83,0.50) !important; text-shadow: none;
}
html[data-theme="gaming"] .sp-status.is-off {
  background: rgba(255,38,38,0.16) !important; color: var(--color-danger) !important;
  border-color: rgba(255,38,38,0.50) !important; text-shadow: none;
}
html[data-theme="gaming"] .sp-status-dot.on  { background: var(--color-success) !important; box-shadow: 0 0 4px var(--color-success) !important; }
html[data-theme="gaming"] .sp-status-dot.off { background: var(--color-danger) !important; box-shadow: 0 0 4px var(--color-danger) !important; }

/* Metronic/utility semantic — สีเข้มอิ่มของธีม (ไม่ใส่เงาเรือง) */
html[data-theme="gaming"] .text-success { color: var(--color-success) !important; text-shadow: none; }
html[data-theme="gaming"] .text-danger,
html[data-theme="gaming"] .text-danger-pink { color: var(--color-danger) !important; text-shadow: none; }
html[data-theme="gaming"] .text-warning { color: var(--color-warning) !important; text-shadow: none; }
html[data-theme="gaming"] .text-info,
html[data-theme="gaming"] .text-primary { color: var(--color-info) !important; text-shadow: none; }

/* ── searchable_select (.ssel-* — dropdown ค้นหาเลือก ใช้หลายหน้าหลังบ้าน)
   คอมโพเนนต์นี้ hardcode สีอ่อนทั้งชุด (เพื่อโหมดสว่าง) + ตัวเลือก render ตอนเปิด
   → ตัวอักษรเข้มมองไม่เห็นบนพื้นมืด. override เป็น token ของธีมทั้งชุด ── */
html[data-theme="gaming"] .ssel-trigger { background: var(--field-bg) !important; border-color: var(--field-border) !important; color: var(--color-text) !important; }
html[data-theme="gaming"] .ssel-trigger:hover { border-color: var(--color-primary) !important; background: var(--field-bg-focus) !important; }
html[data-theme="gaming"] .ssel-trigger.is-empty .ssel-trig-label { color: var(--color-text-muted) !important; }
html[data-theme="gaming"] .ssel-trig-label { color: var(--color-text) !important; }
html[data-theme="gaming"] .ssel-trig-chev { color: var(--color-text-soft) !important; }
html[data-theme="gaming"] .ssel-overlay { background: var(--modal-backdrop) !important; backdrop-filter: blur(5px); }
html[data-theme="gaming"] .ssel-panel,
html[data-theme="gaming"] .ssel-head { background: var(--color-surface) !important; border-color: var(--color-line) !important; }
html[data-theme="gaming"] .ssel-title { color: var(--color-text) !important; }
html[data-theme="gaming"] .ssel-close { background: var(--color-surface-alt) !important; color: var(--color-text-soft) !important; }
html[data-theme="gaming"] .ssel-close:hover { background: var(--nv-hover) !important; color: var(--color-text) !important; }
html[data-theme="gaming"] .ssel-search { background: var(--field-bg) !important; border-color: var(--field-border) !important; color: var(--color-text) !important; }
html[data-theme="gaming"] .ssel-search:focus { border-color: var(--color-primary) !important; background: var(--field-bg-focus) !important; }
html[data-theme="gaming"] .ssel-search-ic { color: var(--color-text-muted) !important; }
html[data-theme="gaming"] .ssel-group-h { background: var(--color-surface) !important; color: var(--color-text-muted) !important; }
html[data-theme="gaming"] .ssel-group-n { background: var(--color-surface-mut) !important; color: var(--color-text-soft) !important; }
html[data-theme="gaming"] .ssel-row { color: var(--color-text) !important; }
html[data-theme="gaming"] .ssel-row:hover { background: var(--nv-hover) !important; }
html[data-theme="gaming"] .ssel-row-tag { color: var(--color-text-muted) !important; }
html[data-theme="gaming"] .ssel-row-check { color: var(--color-text) !important; }
html[data-theme="gaming"] .ssel-row.is-selected { background: var(--nv-pink-bg) !important; color: var(--color-text) !important; box-shadow: inset 3px 0 0 0 var(--color-primary); }
html[data-theme="gaming"] .ssel-row.is-selected .ssel-row-tag { color: var(--color-text-soft) !important; }
html[data-theme="gaming"] .ssel-row.is-selected .ssel-row-check { color: var(--color-primary) !important; }
html[data-theme="gaming"] .ssel-empty { color: var(--color-text-muted) !important; }

/* ── AOBulk รายการที่ถูกเลือก (.is-picked) ──
   ค่ากลางใน backend.php ใช้ ring ทึบ inset 2px var(--color-primary) ซึ่งในธีมนี้
   primary = แดง → กลายเป็น "กรอบแดงทึบ" รอบการ์ดดูแข็ง/แปลก. แทนด้วยเส้นบาง 1px
   + เงาแดงนุ่ม ๆ ให้เข้ากับแนว glow ของธีม. (พื้นอิงโทเคนแล้วจาก backend.php) */
html[data-theme="gaming"] body.ao-bulk-on tr[data-bulk-item].is-picked {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--color-primary) 60%, transparent),
              0 0 16px -3px color-mix(in srgb, var(--color-primary) 55%, transparent) !important;
}
html[data-theme="gaming"] body.ao-bulk-on [data-bulk-item].is-picked:not(tr) {
  border-color: color-mix(in srgb, var(--color-primary) 60%, transparent) !important;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-primary) 60%, transparent),
              0 0 16px -3px color-mix(in srgb, var(--color-primary) 55%, transparent) !important;
}

/* ── โลโก้ badge หน้า auth (.auth-mark) : เดิม bg = var(--color-text) ซึ่งในธีม
   กลายเป็นขาว → กล่องเทาขาว + ไอคอนขาวบนขาว มองไม่ออก → ทำเป็น badge แดงเรืองแสง */
html[data-theme="gaming"] .auth-mark {
  background: var(--grad-primary) !important;
  color: var(--color-white) !important;
  box-shadow: 0 0 20px -2px rgba(255,42,42,0.65), 0 8px 22px -8px rgba(0,0,0,0.6), 0 1px 0 rgba(255,255,255,0.18) inset !important;
}

/* ── Divider "หรือ" : เส้นแดง + ดาวตกแสงไหลเข้าหากลางแล้วออก ──
   ::before = เส้นซ้าย, ::after = เส้นขวา. แต่ละเส้นซ้อน 2 เลเยอร์:
   (1) ดาวตก = แถบแดงสว่างเลื่อนตำแหน่ง  (2) ฐานเส้นแดงเข้มทางด้านกลาง.
   ดาวตกวิ่งจากขอบนอก→กลาง พร้อมกันทั้งสองข้าง (มาเจอกลาง) แล้ว alternate ออก. */
html[data-theme="gaming"] .auth-divider {
  background: transparent !important; border: 0 !important; box-shadow: none !important;
  color: var(--color-text-soft);
}
html[data-theme="gaming"] .auth-divider span {
  color: var(--color-text);
  text-shadow: 0 0 8px rgba(255,48,48,0.75), 0 0 18px rgba(255,28,28,0.45);
}
html[data-theme="gaming"] .auth-divider::before,
html[data-theme="gaming"] .auth-divider::after {
  height: 2px; border-radius: 3px; background-repeat: no-repeat;
  filter: drop-shadow(0 0 5px rgba(255,46,46,0.95)) drop-shadow(0 0 13px rgba(255,24,24,0.6));
}
/* แกนดาวตก = ไส้ขาวร้อน + หางแดง (เท่ ๆ), ฐานเส้นแดงเรืองเข้มทางกลาง */
html[data-theme="gaming"] .auth-divider::before {
  background-image:
    linear-gradient(90deg, transparent 0%, rgba(255,50,50,0.65) 38%, #ffffff 50%, rgba(255,50,50,0.65) 62%, transparent 100%),
    linear-gradient(90deg, rgba(255,32,32,0), rgba(255,40,40,0.55));
  background-size: 55% 100%, 100% 100%;
  background-position: -60% 0, 0 0;
  animation: gmDivCometL 2.4s ease-in-out infinite alternate;
}
html[data-theme="gaming"] .auth-divider::after {
  background-image:
    linear-gradient(90deg, transparent 0%, rgba(255,50,50,0.65) 38%, #ffffff 50%, rgba(255,50,50,0.65) 62%, transparent 100%),
    linear-gradient(90deg, rgba(255,40,40,0.55), rgba(255,32,32,0));
  background-size: 55% 100%, 100% 100%;
  background-position: 110% 0, 0 0;
  animation: gmDivCometR 2.4s ease-in-out infinite alternate;
}
@keyframes gmDivCometL { from { background-position: -60% 0, 0 0; } to { background-position: 110% 0, 0 0; } }
@keyframes gmDivCometR { from { background-position: 110% 0, 0 0; } to { background-position: -60% 0, 0 0; } }
@media (prefers-reduced-motion: reduce) {
  html[data-theme="gaming"] .auth-divider::before,
  html[data-theme="gaming"] .auth-divider::after { animation: none; background-position: 50% 0, 0 0; }
}

/* ── อนิเมชันคลิกปุ่ม (กดยุบ + ripple แดง-ขาว) ──────────────────────────────
   ripple ถูกฉีดด้วย JS (gaming-skin.js) ลงในปุ่มตรงจุดที่คลิก. ปุ่มต้อง
   position:relative + overflow:hidden เพื่อคุม ripple ไม่ให้ล้น (box-shadow/เงา
   เรืองยังอยู่นอก overflow ได้ปกติ ไม่ถูกตัด) ── */
html[data-theme="gaming"] button,
html[data-theme="gaming"] [class*="btn"],
html[data-theme="gaming"] .uik-chip,
html[data-theme="gaming"] .uik-fab__main {
  position: relative;
  overflow: hidden;
}
html[data-theme="gaming"] button:active,
html[data-theme="gaming"] [class*="btn"]:active,
html[data-theme="gaming"] .uik-chip:active,
html[data-theme="gaming"] .uik-fab__main:active {
  transform: scale(0.95);
  transition: transform .08s ease;
}
/* .ao-user-btn (รูปโปรไฟล์ admin มุมขวาบน) เข้าเงื่อนไข [class*="btn"] ด้านบนด้วย
   จึงโดน overflow:hidden ของ ripple ไปตัดเมนู dropdown ที่ position:absolute วางอยู่
   "ใต้" ปุ่มทิ้งทั้งก้อน — กดรูปแล้วเมนูเปิด (display:block) แต่ถูก clip จนมองไม่เห็น.
   ปุ่มนี้เป็นตัวครอบเมนู ไม่ใช่ปุ่ม ripple จริง จึงคืน overflow ให้มองเห็นเมนูได้. */
html[data-theme="gaming"] .ao-user-btn { overflow: visible; }
.gm-ripple {
  position: absolute; border-radius: 50%; pointer-events: none; z-index: 1;
  background: radial-gradient(circle, rgba(255,255,255,0.55) 0%, rgba(255,60,60,0.30) 55%, transparent 72%);
  transform: scale(0); opacity: .85; mix-blend-mode: screen;
  animation: gmRipple .6s ease-out forwards;
}
@keyframes gmRipple { to { transform: scale(1); opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  html[data-theme="gaming"] button:active,
  html[data-theme="gaming"] [class*="btn"]:active,
  html[data-theme="gaming"] .uik-chip:active { transform: none; }
}

/* ============================================================================
   LOADING-LINE FX — เปลี่ยน "เส้นสี/ขอบนิ่ง ๆ" ให้เป็นแอนิเมชันแบบโหลดดิ้ง
   ----------------------------------------------------------------------------
   คอนเซปต์: ทุก "เส้นสี" ในธีม (เส้นใต้ navbar, แถบเมนู active, hr, ขอบการ์ด)
   ไม่อยู่นิ่ง — มีแสงไหลวิ่งแบบ loading bar / running border ให้รู้สึก "เกมมิ่ง"
   ทุกค่าอ้าง var(--token) เดิม, scope ใต้ html[data-theme="gaming"] เท่านั้น,
   และปิดทั้งหมดเมื่อ prefers-reduced-motion (ดู guard ท้าย section).
   ============================================================================ */

/* @property ให้ angle ของ conic-gradient แอนิเมตได้ (รองรับ Chrome/Safari ใหม่;
   เบราเซอร์เก่า → ขอบหยุดนิ่งที่เฉดเริ่มต้น ไม่พัง) */
@property --gm-bd-angle { syntax: "<angle>"; initial-value: 0deg; inherits: false; }

/* keyframes กลางของ loading line */
@keyframes gmLineFlow   { to { background-position: -200% 0; } }   /* เส้นนอนไหลซ้าย */
@keyframes gmBarFlow    { to { background-position: 0 -200%; } }   /* แถบตั้งไหลขึ้น */
@keyframes gmBorderRun  { to { --gm-bd-angle: 360deg; } }          /* แสงวิ่งรอบขอบ */
@keyframes gmSheen      { 0% { left: -60%; } 55%, 100% { left: 140%; } }

/* ── 1) เส้นใต้ navbar → เส้นแดงเรียบ "เท่ากันทั้งเส้น" + เรืองแสงสม่ำเสมอ ──
   (เลิกใช้แสงไหล/gradient เลื่อน เพราะบนเส้นยาวเต็มจอจะเป็นหย่อมสว่าง-จาง ดูไม่สวย) */
html[data-theme="gaming"] .gnav,
html[data-theme="gaming"] .app-navbar,
html[data-theme="gaming"] .app-header,
html[data-theme="gaming"] .ao-topbar,
html[data-theme="gaming"] .header { position: relative; }
html[data-theme="gaming"] .gnav::after,
html[data-theme="gaming"] .app-navbar::after,
html[data-theme="gaming"] .app-header::after,
html[data-theme="gaming"] .ao-topbar::after,
html[data-theme="gaming"] .header::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  height: 1px;
  pointer-events: none;
  background: rgba(255,46,46,.42);          /* สีเดียวเรียบทั้งเส้น */
  box-shadow: 0 0 6px rgba(255,40,40,.30);  /* เรืองแสงเบา ๆ เท่ากันตลอด */
  z-index: 2;
}

/* ── 2) แถบเมนู SIDEBAR หลังบ้าน ตอน active → แท่งแสงไหลขึ้น-ลง (แทน inset bar นิ่ง)
   จำกัดเฉพาะ .app-sidebar/.aside เท่านั้น → ไม่รั่วไปโดนเมนูบน (top navbar)
   ที่มีเส้นใต้ ::after ของตัวเองอยู่แล้ว ── */
html[data-theme="gaming"] .app-sidebar .menu-link.active,
html[data-theme="gaming"] .aside .menu-link.active {
  position: relative;
  box-shadow: none;
}
html[data-theme="gaming"] .app-sidebar .menu-link.active::before,
html[data-theme="gaming"] .aside .menu-link.active::before {
  content: "";
  position: absolute;
  left: 0; top: 6px; bottom: 6px;
  width: 3px;
  border-radius: var(--radius-pill);
  background: linear-gradient(180deg, var(--color-primary), #ff8a8a, var(--color-primary));
  background-size: 100% 200%;
  box-shadow: 0 0 10px rgba(255,40,40,.7);
  animation: gmBarFlow 2.2s linear infinite;
}

/* ── 2b) เมนูบน (top navbar) ตอน active → เส้นใต้แดงไหลแบบ gaming (แทนเส้นขาวเดิม)
   navbar.php ตั้ง ::after เป็น var(--nv-text)=ขาว → ทับเป็นไล่เฉดแดง+เรืองแสง
   ให้สีสม่ำเสมอกับธีม. คง transform scaleX (reveal) ของเดิมไว้ ── */
html[data-theme="gaming"] #kt_header_nav .menu .menu-item > .menu-link::after {
  height: 2px;
  background: var(--color-primary) !important;   /* แดงเรียบเท่ากันทั้งเส้น */
  box-shadow: 0 0 7px rgba(255,40,40,.45);       /* เรืองแสงเบา ๆ สม่ำเสมอ */
  border-radius: var(--radius-pill);
}

/* ── 3) hr / divider → เส้นแดงเรียบ เท่ากันทั้งเส้น + เรืองแสงเบา สม่ำเสมอ ── */
html[data-theme="gaming"] hr {
  border: 0 !important;
  height: 1px !important;
  background: rgba(255,46,46,.32) !important;
  box-shadow: 0 0 5px rgba(255,40,40,.22);
}

/* ── 4) ขอบการ์ดโชว์เคส → แสงนีออนวิ่งรอบขอบ (running border)
   จาง ๆ ตลอดเวลา, สว่างเต็มตอน hover. ใช้ mask เจาะกลางให้เหลือแค่ "กรอบ" ── */
html[data-theme="gaming"] .mn-cat-card,
html[data-theme="gaming"] .in-cat-link .mn-cat-card,
html[data-theme="gaming"] .in-stat { position: relative; }
html[data-theme="gaming"] .mn-cat-card::after,
html[data-theme="gaming"] .in-stat::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1.5px;
  pointer-events: none;
  background: conic-gradient(from var(--gm-bd-angle),
    transparent 0deg, var(--color-primary) 55deg, #ff9a9a 90deg,
    transparent 150deg, transparent 360deg);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  opacity: .4;
  animation: gmBorderRun 4s linear infinite;
  z-index: 2;
}
html[data-theme="gaming"] .mn-cat-card:hover::after,
html[data-theme="gaming"] .in-stat:hover::after { opacity: 1; }

/* ── 5) การ์ดทั่วไป → แสงวิ่งรอบขอบ "เฉพาะตอน hover" (โชว์ตอนชี้เท่านั้น) ── */
html[data-theme="gaming"] .card { position: relative; }
html[data-theme="gaming"] .card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1.5px;
  pointer-events: none;
  background: conic-gradient(from var(--gm-bd-angle),
    transparent 0deg, var(--color-primary) 55deg, #ff9a9a 90deg,
    transparent 150deg, transparent 360deg);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  opacity: 0;
  transition: opacity var(--transition-base);
  z-index: 2;
}
html[data-theme="gaming"] .card:hover::after {
  opacity: 1;
  animation: gmBorderRun 4s linear infinite;
}

/* ── 6) ปุ่ม CTA หลัก → แสงกวาด (sheen) วิ่งผ่านแบบโหลดดิ้งเป็นจังหวะ ──
   ปุ่มมี position:relative + overflow:hidden อยู่แล้ว (จาก ripple section) ── */
html[data-theme="gaming"] .btn-primary::before,
html[data-theme="gaming"] .ao-btn--solid::before,
html[data-theme="gaming"] .in-hero-btn.is-primary::before {
  content: "";
  position: absolute;
  top: 0; bottom: 0; left: -60%;
  width: 38%;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.40), transparent);
  transform: skewX(-20deg);
  animation: gmSheen 3.4s ease-in-out infinite;
  z-index: 1;
}

/* ── เคารพ prefers-reduced-motion: หยุด loading-line ทั้งหมด (เหลือเส้นนิ่งอ่านง่าย) ── */
@media (prefers-reduced-motion: reduce) {
  html[data-theme="gaming"] .gnav::after,
  html[data-theme="gaming"] .app-navbar::after,
  html[data-theme="gaming"] .app-header::after,
  html[data-theme="gaming"] .ao-topbar::after,
  html[data-theme="gaming"] .header::after,
  html[data-theme="gaming"] .menu-link.active::before,
  html[data-theme="gaming"] #kt_header_nav .menu .menu-item > .menu-link.active::after,
  html[data-theme="gaming"] hr,
  html[data-theme="gaming"] .mn-cat-card::after,
  html[data-theme="gaming"] .in-stat::after,
  html[data-theme="gaming"] .card::after,
  html[data-theme="gaming"] .btn-primary::before,
  html[data-theme="gaming"] .ao-btn--solid::before,
  html[data-theme="gaming"] .in-hero-btn.is-primary::before { animation: none !important; }
}

/* ── Responsive: ลดความแรงของ glow/blur บนมือถือ (เบาเครื่อง + ไม่รกตา) ── */
@media (max-width: 768px) {
  html[data-theme="gaming"] body::after { opacity: .45; filter: blur(28px); }
  html[data-theme="gaming"] .card { backdrop-filter: none; }
  html[data-theme="gaming"] .app-navbar,
  html[data-theme="gaming"] .ao-topbar { backdrop-filter: blur(10px); }
  /* ลดความฟุ้งของ neon glow บนจอเล็ก */
  html[data-theme="gaming"] .in-stat:hover,
  html[data-theme="gaming"] .mn-cat-card:hover { box-shadow: 0 8px 22px rgba(0,0,0,.45) !important; }
  html[data-theme="gaming"] .ao-btn.is-telegram,
  html[data-theme="gaming"] .ao-btn.is-line,
  html[data-theme="gaming"] .ao-btn.is-discord { box-shadow: none !important; }
  html[data-theme="gaming"] .gm-star { width: 64px; }
  /* บนมือถือ: ปิด running-border ที่หมุนตลอดเวลาบนกริดการ์ด (เปลือง GPU/แบต)
     เหลือเป็นกรอบนีออนนิ่งจาง ๆ — navbar line / active bar / sheen ยังวิ่งปกติ */
  html[data-theme="gaming"] .mn-cat-card::after,
  html[data-theme="gaming"] .in-stat::after { animation: none !important; opacity: .5; }
}

/* ── เคารพ prefers-reduced-motion: ไม่มีดาวตก + scroll-reveal โชว์ทันที ── */
@media (prefers-reduced-motion: reduce) {
  html[data-theme="gaming"] #gm-stars { display: none !important; }
  html[data-theme="gaming"].gm-reveal-on .gm-reveal {
    opacity: 1 !important; transform: none !important; transition: none !important;
  }
}

/* ── เคารพผู้ใช้ที่ปิดแอนิเมชัน: หยุดทุก keyframe ── */
@media (prefers-reduced-motion: reduce) {
  html[data-theme="gaming"] .ao-logo-name,
  html[data-theme="gaming"] .in-hero-title .grad,
  html[data-theme="gaming"] .in-hero-title.grad,
  html[data-theme="gaming"] .in-hero-btn.is-primary { animation: none !important; }
}