/* GTA Junkies site add-ons: chat widget, sales pops, CTA animation */

/* ---------- animated buy buttons ---------- */
.btn-primary{position:relative;overflow:hidden;animation:gjPulse 2.2s ease-in-out infinite}
.btn-primary::after{content:"";position:absolute;top:0;bottom:0;left:-80%;width:50%;
  background:linear-gradient(105deg,transparent 0%,rgba(255,255,255,.55) 50%,transparent 100%);
  transform:skewX(-20deg);animation:gjShine 3.4s ease-in-out infinite}
@keyframes gjPulse{
  0%,100%{box-shadow:0 8px 30px rgba(255,46,151,.45)}
  50%{box-shadow:0 8px 30px rgba(255,46,151,.55),0 0 0 9px rgba(255,46,151,.14)}
}
@keyframes gjShine{0%,55%{left:-80%}75%,100%{left:130%}}
.btn-blue{animation:gjPulseB 2.6s ease-in-out infinite}
@keyframes gjPulseB{
  0%,100%{box-shadow:0 8px 30px rgba(42,212,255,.4)}
  50%{box-shadow:0 8px 30px rgba(42,212,255,.5),0 0 0 8px rgba(42,212,255,.12)}
}

/* ---------- sales pop ---------- */
.gj-pop{position:fixed;left:16px;bottom:16px;z-index:9000;display:flex;align-items:center;gap:11px;
  max-width:320px;background:#1a0f2e;border:1px solid rgba(255,255,255,.12);border-radius:14px;
  padding:11px 15px 11px 11px;box-shadow:0 14px 40px rgba(0,0,0,.55),0 0 24px rgba(255,46,151,.12);
  color:#f6eefb;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-size:.85rem;line-height:1.35;
  transform:translateY(120%);opacity:0;transition:transform .45s cubic-bezier(.2,.9,.3,1.2),opacity .4s}
.gj-pop.on{transform:translateY(0);opacity:1}
.gj-pop .av{width:38px;height:38px;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;
  font-weight:900;color:#12001a;background:linear-gradient(135deg,#ff2e97,#2ad4ff)}
.gj-pop b{color:#fff}
.gj-pop .meta{display:block;color:#b7a6cf;font-size:.72rem;margin-top:2px}
.gj-pop .meta .ok{color:#33e39a;font-weight:700}

/* ---------- chat widget ---------- */
.gj-chat-btn{position:fixed;right:16px;bottom:16px;z-index:9100;width:58px;height:58px;border-radius:50%;
  border:none;cursor:pointer;display:grid;place-items:center;color:#12001a;
  background:linear-gradient(135deg,#ff2e97,#ff6ab0);box-shadow:0 10px 30px rgba(255,46,151,.5);
  animation:gjPulse 2.2s ease-in-out infinite}
.gj-chat-btn svg{width:26px;height:26px}
.gj-chat{position:fixed;right:16px;bottom:86px;z-index:9100;width:min(340px,calc(100vw - 32px));
  background:#140a24;border:1px solid rgba(255,46,151,.3);border-radius:18px;overflow:hidden;
  box-shadow:0 24px 70px rgba(0,0,0,.65),0 0 40px rgba(255,46,151,.15);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  display:none;flex-direction:column}
.gj-chat.open{display:flex}
.gj-chat header{position:static;display:flex;align-items:center;gap:10px;padding:13px 15px;
  background:linear-gradient(135deg,#1a0f2e,#0f0720);border-bottom:1px solid rgba(255,255,255,.09);backdrop-filter:none}
.gj-chat header img{width:34px;height:34px;border-radius:9px}
.gj-chat header .t{flex:1;color:#f6eefb;font-weight:800;font-size:.92rem;line-height:1.2}
.gj-chat header .t small{display:block;color:#33e39a;font-weight:600;font-size:.7rem}
.gj-chat header button{background:none;border:none;color:#b7a6cf;font-size:1.1rem;cursor:pointer;padding:4px}
.gj-msgs{height:260px;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:8px}
.gj-m{max-width:82%;padding:8px 12px;border-radius:13px;font-size:.86rem;line-height:1.4;color:#f6eefb;overflow-wrap:break-word}
.gj-m.me{align-self:flex-end;background:linear-gradient(135deg,#ff2e97,#ff6ab0);color:#12001a;border-bottom-right-radius:4px}
.gj-m.them{align-self:flex-start;background:#241638;border:1px solid rgba(255,255,255,.08);border-bottom-left-radius:4px}
.gj-m.sys{align-self:center;background:none;color:#b7a6cf;font-size:.74rem;text-align:center}
.gj-in{display:flex;gap:8px;padding:11px;border-top:1px solid rgba(255,255,255,.09)}
.gj-in input{flex:1;background:#0f0720;border:1px solid rgba(255,255,255,.12);border-radius:10px;
  color:#f6eefb;padding:10px 12px;font-size:.88rem;outline:none}
.gj-in input:focus{border-color:#ff2e97}
.gj-in button{border:none;border-radius:10px;padding:0 16px;font-weight:800;cursor:pointer;
  color:#12001a;background:linear-gradient(135deg,#ff2e97,#ff6ab0)}

@media (max-width:640px){.gj-pop{max-width:260px;font-size:.8rem}}
@media (prefers-reduced-motion:reduce){
  .btn-primary,.btn-blue,.gj-chat-btn{animation:none!important}
  .btn-primary::after{animation:none!important;display:none}
  .gj-pop{transition:opacity .3s}
}
