/* PM GAME SHOP neon theme — blue/gold brand from supplied logo/banner */
:root{
  --pm-bg:#020817;
  --pm-bg2:#061a3a;
  --pm-blue:#08d9ff;
  --pm-blue2:#005bff;
  --pm-gold:#ffd319;
  --pm-orange:#ff7b00;
  --pm-red:#ff174e;
  --pm-card:rgba(4,16,42,.78);
  --pm-stroke:rgba(8,217,255,.38);
  --pm-text:#eaf7ff;
  --pm-muted:#8bb8df;
  --pm-shadow:0 0 28px rgba(0,150,255,.35),0 20px 80px rgba(0,0,0,.55);
}
html,body{background:#020817!important;color:var(--pm-text)!important;overflow-x:hidden;font-family:'Kanit',system-ui,sans-serif!important;}
body{
  background-image:
    radial-gradient(circle at 18% 5%,rgba(0,217,255,.22),transparent 32%),
    radial-gradient(circle at 82% 12%,rgba(255,211,25,.12),transparent 28%),
    linear-gradient(135deg,#020817 0%,#061a3a 54%,#020817 100%)!important;
  background-attachment:fixed!important;background-size:cover!important;
}
body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:42px 42px;mask-image:radial-gradient(circle at 50% 0%,#000 0%,transparent 70%);}
a{color:inherit}.text-main,.ttcolor{background:linear-gradient(90deg,var(--pm-blue),var(--pm-gold),var(--pm-orange))!important;-webkit-background-clip:text!important;-webkit-text-fill-color:transparent!important;}
.navbar,.navbar .container-sm,.header-menu{background:rgba(2,8,23,.82)!important;background-image:linear-gradient(90deg,rgba(0,91,255,.23),rgba(0,217,255,.1),rgba(255,123,0,.12))!important;border-bottom:1px solid var(--pm-stroke);box-shadow:0 12px 45px rgba(0,0,0,.5),0 0 28px rgba(0,153,255,.2)!important;backdrop-filter:blur(14px);}
.navbar-brand img{height:58px!important;width:auto!important;max-width:175px;object-fit:contain;filter:drop-shadow(0 0 16px rgba(0,217,255,.8));animation:none!important;border-radius:16px;}
.navbar-toggler{background:linear-gradient(135deg,var(--pm-blue2),var(--pm-blue))!important;border:1px solid rgba(255,255,255,.25)!important;box-shadow:0 0 18px rgba(0,217,255,.45)!important;}
.offcanvas{background:rgba(2,8,23,.96)!important;border-left:1px solid var(--pm-stroke)!important;box-shadow:-12px 0 45px rgba(0,0,0,.65),0 0 30px rgba(0,217,255,.18)!important;margin-right:0!important;padding-right:0!important;}
.nav-link,.dropdown-item{color:#eaf7ff!important;border-radius:12px;font-weight:800!important;letter-spacing:.2px;}
.nav-link:hover,.dropdown-item:hover,.nav-link.active{background:linear-gradient(135deg,rgba(0,91,255,.32),rgba(0,217,255,.16))!important;color:#fff!important;text-shadow:0 0 10px rgba(0,217,255,.8);}
.dropdown-menu{background:rgba(3,14,36,.96)!important;border:1px solid var(--pm-stroke)!important;border-radius:18px!important;box-shadow:var(--pm-shadow)!important;}
.btn,.bg-cus,.shopbtn,.tblu-2{border-radius:14px!important;font-weight:900!important;border:1px solid rgba(255,255,255,.12)!important;background:linear-gradient(135deg,var(--pm-blue2),var(--pm-blue) 55%,var(--pm-gold))!important;color:#031027!important;box-shadow:0 0 22px rgba(0,217,255,.28)!important;}
.btn:hover,.bg-cus:hover,.shopbtn:hover{filter:brightness(1.12);transform:translateY(-1px);}
.form-control,.form-select,.input-group-text{background:rgba(2,8,23,.72)!important;color:#fff!important;border:1px solid rgba(8,217,255,.28)!important;border-radius:12px!important;}
.form-control::placeholder{color:#7aa9ca!important}.modal-content,.card,.card-glass,.content,.card-anim-main,.table-card{background:linear-gradient(180deg,rgba(6,26,58,.92),rgba(2,8,23,.86))!important;border:1px solid var(--pm-stroke)!important;border-radius:20px!important;box-shadow:var(--pm-shadow)!important;color:var(--pm-text)!important;}
.card-anim-main:hover,.game-tile:hover,.gcard:hover,.pm-card:hover{border-color:rgba(255,211,25,.75)!important;box-shadow:0 0 30px rgba(255,211,25,.22),0 0 34px rgba(0,217,255,.28)!important;}
.table,.table td,.table th{color:#eaf7ff!important}.text-secondary,.muted{color:var(--pm-muted)!important}.breadcrumb a{color:#9bddff!important}
.img-anim img,.hv-img,.gthumb img,.game-tile img{filter:saturate(1.08) contrast(1.04)}
.pm-wrap{max-width:1180px;margin:0 auto;padding:18px 12px 92px}.pm-section{margin-top:24px;padding:18px;border:1px solid var(--pm-stroke);border-radius:24px;background:linear-gradient(180deg,rgba(6,26,58,.78),rgba(2,8,23,.74));box-shadow:var(--pm-shadow);backdrop-filter:blur(12px)}
.pm-title{display:flex;align-items:center;gap:10px;font-size:clamp(20px,3vw,30px);font-weight:1000;line-height:1.2;background:linear-gradient(90deg,#fff,var(--pm-blue),var(--pm-gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 0 16px rgba(0,217,255,.4)}
.pm-sub{color:var(--pm-muted);font-size:14px}.pm-hero{position:relative;overflow:hidden;border-radius:26px;border:1px solid rgba(8,217,255,.52);box-shadow:0 0 45px rgba(0,217,255,.32),0 25px 80px rgba(0,0,0,.65);background:#010712}.pm-hero img{width:100%;display:block;aspect-ratio:1942/809;object-fit:cover}.pm-hero:after{content:"";position:absolute;inset:auto 0 0 0;height:42%;background:linear-gradient(0deg,rgba(2,8,23,.82),transparent)}
.pm-logo-float{position:absolute;left:16px;bottom:16px;z-index:2;display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:20px;background:rgba(2,8,23,.78);border:1px solid rgba(8,217,255,.4);box-shadow:0 0 28px rgba(0,217,255,.25);backdrop-filter:blur(10px)}.pm-logo-float img{width:78px;height:78px;object-fit:cover;border-radius:18px}.pm-logo-float b{font-size:20px;color:#fff}.pm-logo-float span{display:block;color:var(--pm-gold);font-weight:900}
.pm-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:14px}.pm-action{display:inline-flex;align-items:center;gap:9px;padding:12px 16px;border-radius:999px;background:linear-gradient(135deg,var(--pm-blue2),var(--pm-blue));color:#031027!important;font-weight:1000;box-shadow:0 0 22px rgba(0,217,255,.35);text-decoration:none}.pm-action.alt{background:linear-gradient(135deg,var(--pm-red),var(--pm-orange),var(--pm-gold));}.pm-action.dark{background:rgba(5,22,52,.8);border:1px solid var(--pm-stroke);color:#eaf7ff!important}.pm-action:hover{filter:brightness(1.1);transform:translateY(-2px)}
.pm-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.pm-grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.pm-card{position:relative;overflow:hidden;min-height:145px;border-radius:22px;background:linear-gradient(180deg,rgba(4,16,42,.9),rgba(2,8,23,.9));border:1px solid var(--pm-stroke);box-shadow:0 12px 40px rgba(0,0,0,.38);transition:.25s;text-decoration:none;color:#fff!important}.pm-card .pm-img{width:100%;height:155px;object-fit:cover;display:block}.pm-card .pm-info{padding:12px}.pm-card .pm-name{font-weight:1000;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pm-card .pm-desc{color:var(--pm-muted);font-size:13px}.pm-price{display:inline-flex;align-items:center;gap:4px;margin-top:6px;padding:4px 8px;border-radius:999px;background:rgba(255,211,25,.15);border:1px solid rgba(255,211,25,.38);color:#ffe776;font-weight:1000}.pm-stock{position:absolute;top:10px;left:10px;padding:4px 8px;border-radius:999px;background:rgba(0,217,255,.18);border:1px solid rgba(8,217,255,.48);font-size:12px;font-weight:900;color:#dffbff}.pm-tag-red{background:rgba(255,23,78,.2);border-color:rgba(255,23,78,.42);color:#ffb4c5}.pm-stat{padding:16px;border-radius:20px;background:rgba(2,8,23,.68);border:1px solid rgba(8,217,255,.25)}.pm-stat b{font-size:26px;color:var(--pm-gold)}.pm-stat span{display:block;color:var(--pm-muted);font-size:13px}.pm-warning{border-radius:20px;padding:14px 16px;background:linear-gradient(135deg,rgba(255,23,78,.18),rgba(255,123,0,.12));border:1px solid rgba(255,211,25,.3);color:#fff}.pm-bottom{position:fixed;left:0;right:0;bottom:0;z-index:1035;background:rgba(2,8,23,.92);border-top:1px solid var(--pm-stroke);box-shadow:0 -12px 38px rgba(0,0,0,.5);backdrop-filter:blur(12px)}.pm-bottom .inner{display:grid;grid-template-columns:repeat(5,1fr);max-width:620px;margin:0 auto}.pm-bottom a{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px 10px;color:#9bddff!important;text-decoration:none;font-size:12px;font-weight:900}.pm-bottom i{font-size:20px}.pm-bottom a:hover{color:#fff!important;background:rgba(8,217,255,.12)}
@media(max-width:991px){.pm-grid{grid-template-columns:repeat(3,1fr)}.pm-grid-3{grid-template-columns:1fr}.pm-logo-float{position:relative;left:auto;bottom:auto;margin:10px}.navbar-brand img{height:48px!important}.pm-hero img{min-height:180px}}
@media(max-width:576px){.pm-wrap{padding-left:8px;padding-right:8px}.pm-section{padding:12px;border-radius:18px}.pm-grid{grid-template-columns:repeat(2,1fr);gap:10px}.pm-card{border-radius:16px}.pm-card .pm-img{height:115px}.pm-card .pm-info{padding:9px}.pm-card .pm-name{font-size:13px}.pm-card .pm-desc{font-size:11px}.pm-logo-float img{width:56px;height:56px}.pm-logo-float b{font-size:16px}.pm-action{flex:1;justify-content:center;padding:10px 10px;font-size:13px}.pm-hero{border-radius:18px}.pm-hero img{object-position:center;min-height:160px}.offcanvas{width:84vw!important}.navbar-brand img{height:42px!important}.pm-stat b{font-size:20px}}


/* ===== PM professional menu fix 20260704: keep desktop menu, mobile drawer over everything ===== */
.pm-main-navbar{position:relative!important;z-index:1040!important;background:rgba(2,8,23,.88)!important;}
.pm-nav-inner{min-height:78px!important;background:transparent!important;display:flex!important;align-items:center!important;gap:16px!important;}
.pm-brand{display:flex!important;align-items:center!important;margin-right:18px!important;}
.pm-desktop-menu{flex-wrap:wrap;justify-content:flex-end;}
.pm-menu-link{display:inline-flex;align-items:center;gap:4px;padding:10px 13px;border-radius:16px;background:rgba(5,22,52,.62);border:1px solid rgba(8,217,255,.22);color:#eaf7ff!important;text-decoration:none!important;font-size:14px;font-weight:900!important;line-height:1;box-shadow:0 0 18px rgba(0,217,255,.08);transition:.18s ease;white-space:nowrap;}
.pm-menu-link:hover{transform:translateY(-1px);background:linear-gradient(135deg,rgba(0,91,255,.45),rgba(8,217,255,.22))!important;border-color:rgba(8,217,255,.58);color:#fff!important;}
.pm-menu-hot{background:linear-gradient(135deg,rgba(255,23,78,.9),rgba(255,123,0,.9),rgba(255,211,25,.88))!important;color:#081023!important;border-color:rgba(255,211,25,.75)!important;}
.pm-admin-link{background:rgba(255,211,25,.16)!important;border-color:rgba(255,211,25,.45)!important;color:#ffe776!important;}
.pm-mobile-menu-btn{margin-left:auto!important;padding:10px 15px!important;border-radius:15px!important;position:relative!important;z-index:1041!important;}
.pm-mobile-menu-btn span{color:#fff;font-weight:1000;text-shadow:0 0 10px rgba(0,217,255,.8)}
.pm-mobile-offcanvas{position:fixed!important;top:0!important;right:0!important;bottom:0!important;z-index:20000!important;width:min(86vw,360px)!important;transform:translateX(100%);visibility:hidden;background:linear-gradient(180deg,rgba(2,8,23,.98),rgba(6,26,58,.98))!important;border-left:1px solid rgba(8,217,255,.45)!important;box-shadow:-20px 0 80px rgba(0,0,0,.75),0 0 45px rgba(0,217,255,.28)!important;margin:0!important;padding:0!important;}
.pm-mobile-offcanvas.show{transform:none!important;visibility:visible!important;}
.offcanvas-backdrop{z-index:19990!important;}
body.offcanvas-open{overflow:hidden!important;padding-right:0!important;}
.pm-mobile-head{border-bottom:1px solid rgba(8,217,255,.32);background:rgba(2,8,23,.88);}
.pm-mobile-logo{width:54px;height:54px;object-fit:cover;border-radius:15px;box-shadow:0 0 18px rgba(8,217,255,.45)}
.pm-mobile-body{padding:14px!important;display:flex;flex-direction:column;gap:10px;}
.pm-drawer-link{display:flex;align-items:center;gap:12px;padding:13px 14px;border-radius:16px;background:rgba(5,22,52,.78);border:1px solid rgba(8,217,255,.22);color:#eaf7ff!important;text-decoration:none!important;font-weight:1000;box-shadow:inset 0 0 0 1px rgba(255,255,255,.02),0 10px 22px rgba(0,0,0,.22);}
.pm-drawer-link i{width:24px;text-align:center;color:#08d9ff;font-size:18px;}
.pm-drawer-link.hot{background:linear-gradient(135deg,rgba(255,23,78,.92),rgba(255,123,0,.92));color:#fff!important;border-color:rgba(255,211,25,.35);}
.pm-drawer-link.hot2{background:linear-gradient(135deg,rgba(0,91,255,.95),rgba(8,217,255,.72));color:#061026!important;border-color:rgba(8,217,255,.55);}
.pm-drawer-link.admin{border-color:rgba(255,211,25,.5);color:#ffe776!important;}
.pm-drawer-note{padding:12px;border-radius:16px;background:rgba(255,211,25,.1);border:1px solid rgba(255,211,25,.28);color:#fff;font-size:13px;}
@media (min-width:992px){.pm-mobile-offcanvas,.pm-mobile-menu-btn{display:none!important}.pm-main-navbar .container-sm{max-width:1200px!important}.pm-nav-inner{padding-left:12px!important;padding-right:12px!important}}
@media (max-width:991.98px){.pm-desktop-menu{display:none!important}.pm-nav-inner{min-height:68px!important;padding-left:10px!important;padding-right:10px!important}.pm-main-navbar{position:sticky!important;top:0!important}.pm-brand img{height:48px!important}.pm-bottom{z-index:1030!important}}

/* PM mobile hero badge fix 20260704: keep the PM GAME SHOP label on desktop, hide it on mobile */
@media (max-width: 767.98px){
  .pm-hero .pm-logo-float{display:none!important;}
}


/* PM homepage action/stat polish 20260704: center desktop quick buttons and make mobile buttons fit cleanly */
.pm-home-actions{
  justify-content:center!important;
  align-items:center!important;
  margin:14px auto 0!important;
  max-width:760px!important;
  width:100%!important;
}
.pm-home-actions .pm-action{
  min-width:158px;
  justify-content:center!important;
  text-align:center;
}
@media (min-width:768px){
  .pm-home-actions{display:flex!important;flex-wrap:wrap!important;}
}
@media (max-width:767.98px){
  .pm-home-actions{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    padding:0 2px!important;
    max-width:100%!important;
  }
  .pm-home-actions .pm-action{
    width:100%!important;
    min-width:0!important;
    min-height:50px!important;
    padding:9px 8px!important;
    border-radius:18px!important;
    font-size:12.5px!important;
    line-height:1.16!important;
    white-space:normal!important;
    word-break:keep-all!important;
    overflow-wrap:break-word!important;
    gap:6px!important;
    box-shadow:0 0 18px rgba(0,217,255,.22)!important;
  }
  .pm-home-actions .pm-action i{
    font-size:16px!important;
    flex:0 0 auto!important;
  }
  .pm-grid-3{
    gap:10px!important;
  }
  .pm-stat{
    padding:13px!important;
    border-radius:18px!important;
  }
}
@media (max-width:380px){
  .pm-home-actions{gap:8px!important;}
  .pm-home-actions .pm-action{font-size:11.5px!important;padding:8px 6px!important;}
}