/* v140 — (1) store card: divider centered under name, Feedback/Update buttons smaller
          (2) QR page: bottom progress line removed
          (3) payment Processing / Verifying / Successful box redesigned
   Remove: delete the <link ... gks-v140.css> line at the end of index.html */

/* ---------- 1. STORE CARD ---------- */
html:root:root:root body #main-app #page-home #pc-list .pc-card .pc-div{
  display:block!important;position:relative!important;
  width:72%!important;height:14px!important;margin:2px auto 12px!important;
  background:none!important;border:0!important}
html:root:root:root body #main-app #page-home #pc-list .pc-card .pc-div::before{
  content:""!important;display:block!important;position:absolute!important;
  left:0!important;right:0!important;top:50%!important;height:1px!important;
  transform:translateY(-50%)!important;
  background:linear-gradient(90deg,transparent,rgba(171,113,237,.85) 30%,rgba(171,113,237,.85) 70%,transparent)!important}
html:root:root:root body #main-app #page-home #pc-list .pc-card .pc-div i{
  display:block!important;position:absolute!important;
  left:50%!important;top:50%!important;width:9px!important;height:9px!important;
  background:linear-gradient(135deg,#bd8df3,#8042c6)!important;border-radius:2px!important;
  transform:translate(-50%,-50%) rotate(45deg)!important;
  box-shadow:0 0 8px rgba(171,113,237,.7)!important}
html:root:root:root body #main-app #page-home #pc-list .pc-card .pc-div::after{
  content:none!important;display:none!important}

/* smaller Feedback / Update File buttons + smaller text */
html:root:root:root body #main-app #page-home #pc-list .pc-card .pc-btns{
  gap:8px!important;margin:8px 0 8px!important}
html:root:root:root body #main-app #page-home #pc-list .pc-card .pc-btns>.pc-btn{
  min-height:48px!important;height:48px!important;padding:6px 9px!important;
  gap:8px!important;border-radius:15px!important}
html:root:root:root body #main-app #page-home #pc-list .pc-card .pc-btns .pc-ic.pc-ic.pc-ic{
  flex:0 0 30px!important;width:30px!important;height:30px!important;
  border-radius:10px!important;font-size:15px!important}
html:root:root:root body #main-app #page-home #pc-list .pc-card .pc-btns .pc-ic svg{
  width:16px!important;height:16px!important}
html:root:root:root body #main-app #page-home #pc-list .pc-card .pc-btns>.pc-fb .pc-lbl b,
html:root:root:root body #main-app #page-home #pc-list .pc-card .pc-btns>.pc-up .pc-lbl b,
html:root:root:root body #main-app #page-home #pc-list .pc-card .pc-btns .pc-lbl b{
  font-size:clamp(12.5px,3.7vw,14.5px)!important;letter-spacing:.01em!important;font-weight:700!important}

/* ---------- 2. QR PAGE: bottom line removed ---------- */
html body #page-pay-qr .gp-bar,
html body #page-pay-qr #manual-qr-bar{display:none!important}

/* ---------- 3. PAYMENT STATUS BOX ---------- */
html body #page-pay-qr .gp-proc{
  position:relative;margin:14px 0 4px;padding:22px 14px 18px;border-radius:20px;
  background:radial-gradient(120% 90% at 50% 0%,rgba(168,124,218,.14),transparent 60%),
             linear-gradient(165deg,rgba(255,255,255,.06),rgba(255,255,255,.015));
  border:1px solid rgba(168,124,218,.38);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 10px 30px rgba(0,0,0,.35);
  overflow:hidden}
html body #page-pay-qr .gp-proc::before{ /* soft top glow line */
  content:"";position:absolute;left:18%;right:18%;top:0;height:2px;border-radius:2px;
  background:linear-gradient(90deg,transparent,#bb96e6,transparent);opacity:.9}

/* ring + core */
html body #page-pay-qr .gp-ring{width:112px;height:112px;margin:2px auto 16px}
html body #page-pay-qr .gp-ring::after{ /* outer glow halo */
  content:"";position:absolute;inset:-10px;border-radius:50%;
  background:radial-gradient(circle,rgba(168,124,218,.22),transparent 68%);
  animation:gpHalo 2.2s ease-in-out infinite;pointer-events:none}
html body #page-pay-qr .gp-ring::before{border-width:4px!important}
html body #page-pay-qr .gp-core{inset:10px;
  background:radial-gradient(circle at 50% 30%,#7a2c38,#1e122c 75%);
  box-shadow:inset 0 0 0 1px rgba(168,124,218,.35),inset 0 6px 14px rgba(255,255,255,.06)}
html body #page-pay-qr #gp-proc-view[data-stage=verifying] .gp-ring::after{
  background:radial-gradient(circle,rgba(52,211,153,.24),transparent 68%)}
html body #page-pay-qr #gp-proc-view[data-stage=success] .gp-ring::after{
  background:radial-gradient(circle,rgba(34,213,138,.38),transparent 68%);
  animation:gpHalo 1.6s ease-in-out infinite}
html body #page-pay-qr #gp-proc-view[data-stage=error] .gp-ring::after{
  background:radial-gradient(circle,rgba(162,97,236,.24),transparent 68%)}
@keyframes gpHalo{0%,100%{transform:scale(.92);opacity:.7}50%{transform:scale(1.08);opacity:1}}

/* title + sub */
html body #page-pay-qr .gp-ptitle{
  font:800 16px/1.2 'Space Grotesk','JetBrains Mono',sans-serif;letter-spacing:.14em;
  color:#cfb2f1;text-shadow:0 2px 12px rgba(0,0,0,.45)}
html body #page-pay-qr #gp-proc-view[data-stage=verifying] .gp-ptitle{color:#7ee8c4}
html body #page-pay-qr #gp-proc-view[data-stage=success] .gp-ptitle{color:#3be8a0}
html body #page-pay-qr #gp-proc-view[data-stage=error] .gp-ptitle{color:#a261ec}
html body #page-pay-qr .gp-psub{
  margin:8px 10px 0;font:500 12px/1.5 'Inter',sans-serif;color:#c3b1d8;min-height:36px}

/* steps as a connected timeline */
html body #page-pay-qr .gp-steps{
  display:flex;justify-content:space-between;gap:0;list-style:none;
  margin:14px 2px 16px;padding:12px 6px 10px;border-radius:14px;
  background:rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.06)}
html body #page-pay-qr .gp-steps li{
  position:relative;flex:1;display:flex;flex-direction:column;align-items:center;gap:7px;
  font:700 9.5px 'JetBrains Mono',monospace;letter-spacing:.08em;text-transform:uppercase;color:#8f7f68}
html body #page-pay-qr .gp-steps li+li::before{
  content:"";position:absolute;top:8px;right:50%;width:100%;height:2px;
  background:rgba(255,255,255,.1);border-radius:2px;z-index:0}
html body #page-pay-qr .gp-steps li.done+li::before{background:linear-gradient(90deg,#34d399,#7ee8c4)}
html body #page-pay-qr .gp-steps li.act::before,
html body #page-pay-qr .gp-steps li.act::before{background:linear-gradient(90deg,#34d399,#a87cda)}
html body #page-pay-qr .gp-steps li i{
  position:relative;z-index:1;width:18px;height:18px;border-radius:50%;
  border:2px solid #4a2c6d;background:#1e122c;display:grid;place-items:center;transition:all .3s}
html body #page-pay-qr .gp-steps li.act{color:#cfb2f1}
html body #page-pay-qr .gp-steps li.act i{
  border-color:#a87cda;background:#2c1a40;box-shadow:0 0 12px rgba(168,124,218,.75);
  animation:gpPulse 1.3s infinite}
html body #page-pay-qr .gp-steps li.act i::after{
  content:"";width:6px;height:6px;border-radius:50%;background:#a87cda}
html body #page-pay-qr .gp-steps li.done{color:#4de3a9}
html body #page-pay-qr .gp-steps li.done i{background:#22d58a;border-color:#22d58a}
html body #page-pay-qr .gp-steps li.done i::after{
  content:"";width:5px;height:9px;margin-top:-2px;border:solid #06180f;
  border-width:0 2px 2px 0;transform:rotate(45deg)}

/* progress bar */
html body #page-pay-qr .gp-pbar{height:6px;margin:0 8px 8px;border-radius:6px;
  background:rgba(255,255,255,.08);box-shadow:inset 0 1px 2px rgba(0,0,0,.4)}
html body #page-pay-qr .gp-pbar i{border-radius:6px}

/* success state: green glow card */
html body #page-pay-qr #gp-proc-view[data-stage=success]{
  border-color:rgba(52,232,160,.6);
  background:radial-gradient(120% 90% at 50% 0%,rgba(52,232,160,.2),transparent 62%),
             linear-gradient(165deg,rgba(255,255,255,.06),rgba(255,255,255,.015));
  box-shadow:0 0 0 1px rgba(52,232,160,.18),0 12px 34px rgba(34,213,138,.18)}
html body #page-pay-qr #gp-proc-view[data-stage=success]::before{
  background:linear-gradient(90deg,transparent,#3be8a0,transparent)}
html body #page-pay-qr #gp-proc-view[data-stage=success] .gp-steps{border-color:rgba(52,232,160,.25)}
html body #page-pay-qr #gp-proc-view[data-stage=error]{border-color:rgba(162,97,236,.5)}
html body #page-pay-qr #gp-proc-view[data-stage=success] .gp-done{
  width:100%!important;max-width:240px;height:42px!important;margin:14px auto 2px!important;
  border-radius:12px!important;font:800 13px 'Inter',sans-serif!important;letter-spacing:.04em;
  box-shadow:0 8px 20px rgba(127,66,196,.35)!important}

@media(prefers-reduced-motion:reduce){
  html body #page-pay-qr .gp-ring::after{animation:none}}
