/* ============================================================
   PAY Buddy 智能客服 · 样式
   ============================================================ */

/* —— 我的页入口卡片 —— */
.pb-entry{
  display:flex;align-items:center;gap:13px;margin:14px 14px 0;padding:15px 16px;
  border-radius:18px;color:#fff;position:relative;overflow:hidden;cursor:pointer;
  background:linear-gradient(135deg,#2b5cff 0%,#2347ff 60%,#16256b 100%);
  box-shadow:0 12px 26px rgba(43,92,255,.30);
}
.pb-entry::after{content:"";position:absolute;right:-34px;top:-34px;width:128px;height:128px;border-radius:50%;background:rgba(255,255,255,.10);}
.pb-entry:active{transform:scale(.99);}
.pb-entry-ava{width:46px;height:46px;flex:none;border-radius:14px;overflow:hidden;background:rgba(255,255,255,.18);box-shadow:0 4px 12px rgba(0,0,0,.18);position:relative;z-index:1;}
.pb-entry-ava svg{width:100%;height:100%;display:block;}
.pb-entry-tx{flex:1;min-width:0;position:relative;z-index:1;}
.pb-entry-t{font-size:16px;font-weight:800;letter-spacing:.3px;}
.pb-entry-s{font-size:12.5px;opacity:.92;margin-top:2px;line-height:1.4;}
.pb-entry-go{font-size:22px;opacity:.9;flex:none;position:relative;z-index:1;}

/* —— 客服面板 —— */
.pb-root{position:fixed;inset:0;z-index:120;}
.pb-root.hidden{display:none;}
.pb-mask{position:absolute;inset:0;background:rgba(10,16,40,.5);backdrop-filter:blur(2px);animation:pbFade .2s ease;}
.pb-panel{
  position:absolute;left:0;right:0;bottom:0;height:86vh;max-height:86vh;
  background:#fff;border-radius:22px 22px 0 0;display:flex;flex-direction:column;overflow:hidden;
  box-shadow:0 -10px 40px rgba(10,16,40,.25);animation:pbSlide .28s cubic-bezier(.2,.8,.2,1);
}
@keyframes pbFade{from{opacity:0}to{opacity:1}}
@keyframes pbSlide{from{transform:translateY(100%)}to{transform:translateY(0)}}

.pb-head{display:flex;align-items:center;gap:11px;padding:14px 14px 12px;border-bottom:1px solid var(--line-2);}
.pb-ava{width:42px;height:42px;flex:none;border-radius:13px;overflow:hidden;background:var(--brand-soft);box-shadow:0 4px 10px rgba(43,92,255,.18);}
.pb-ava svg{width:100%;height:100%;display:block;}
.pb-head-tx{flex:1;min-width:0;}
.pb-name{font-size:16px;font-weight:800;color:#16224f;}
.pb-sub{font-size:12px;color:var(--sub);margin-top:1px;}
.pb-reset{font-size:12px;font-weight:700;color:var(--brand);background:var(--brand-soft);border:0;border-radius:11px;padding:7px 11px;cursor:pointer;flex:none;}
.pb-reset:active{background:#dde7ff;}
.pb-close{width:30px;height:30px;flex:none;border:0;background:#f0f2f7;border-radius:50%;font-size:15px;color:#6b7390;cursor:pointer;}
.pb-close:active{background:#e6e9f1;}

.pb-msgs{flex:1;overflow:auto;-webkit-overflow-scrolling:touch;padding:14px 14px 6px;background:#fafbff;}

/* 气泡 */
.pb-bubble{display:flex;margin:8px 0;align-items:flex-end;}
.pb-bot{justify-content:flex-start;}
.pb-user{justify-content:flex-end;}
.pb-ava-mini{width:30px;height:30px;flex:none;margin-right:8px;border-radius:9px;overflow:hidden;background:var(--brand-soft);}
.pb-ava-mini svg{width:100%;height:100%;display:block;}
.pb-bubble-in{max-width:78%;padding:10px 13px;border-radius:15px;font-size:14px;line-height:1.6;word-break:break-word;}
.pb-bot .pb-bubble-in{background:#eef1f8;color:#1a2238;border-bottom-left-radius:5px;}
.pb-user .pb-bubble-in{background:linear-gradient(135deg,var(--brand-3),var(--brand));color:#fff;border-bottom-right-radius:5px;}
.pb-bubble-in code{background:rgba(43,92,255,.10);color:var(--brand);padding:1px 5px;border-radius:5px;font-size:12.5px;font-family:ui-monospace,Menlo,Consolas,monospace;}

/* 打字指示 */
.pb-typing .pb-bubble-in{padding:13px 15px;}
.pb-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#b9c2dc;margin:0 2px;animation:pbBlink 1s infinite;}
.pb-dot:nth-child(2){animation-delay:.15s;}
.pb-dot:nth-child(3){animation-delay:.3s;}
@keyframes pbBlink{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}

/* 快捷入口 */
.pb-quick{margin:8px 0 4px;}
.pb-quick-sec{margin:11px 0;}
.pb-quick-cat{font-size:12px;font-weight:700;color:var(--brand);margin:0 2px 7px;display:flex;align-items:center;gap:6px;}
.pb-quick-cat::before{content:"";width:4px;height:13px;border-radius:2px;background:linear-gradient(var(--brand-3),var(--brand-2));}
.pb-quick-row{display:flex;flex-wrap:wrap;gap:8px;}
.pb-chip{background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:8px 13px;font-size:13px;font-weight:600;color:#2a3354;cursor:pointer;transition:transform .12s,border-color .15s,background .15s;max-width:100%;text-align:left;line-height:1.3;}
.pb-chip:active{transform:scale(.97);border-color:var(--brand);background:var(--brand-soft);color:var(--brand);}

/* 输入栏 */
.pb-input{display:flex;gap:9px;padding:11px 12px calc(11px + var(--safe-b));border-top:1px solid var(--line-2);background:#fff;}
.pb-input input{flex:1;border:1.5px solid var(--line);border-radius:13px;padding:11px 14px;font-size:14px;outline:none;background:#f7f8fc;min-width:0;}
.pb-input input:focus{border-color:var(--brand);background:#fff;}
.pb-input button{flex:none;border:0;background:linear-gradient(135deg,var(--brand-3),var(--brand));color:#fff;font-weight:700;font-size:14px;border-radius:13px;padding:0 18px;cursor:pointer;}
.pb-input button:active{opacity:.9;}