/* ============================================================
   Premium Butcher Chat — Frontend Styles
   ============================================================ */

:root {
  --pbc-gold:    #C9A84C;
  --pbc-gold-l:  #E8C96A;
  --pbc-gold-d:  #9A7A2E;
  --pbc-red:     #8B1A1A;
  --pbc-red-l:   #B02020;
  --pbc-dark:    #0D0D0D;
  --pbc-dark2:   #1A1A1A;
  --pbc-surface: #1C1C1C;
  --pbc-text:    #F0EAD6;
  --pbc-muted:   #9A9078;
}

/* ── Launcher ──────────────────────────────────────────────── */
#pbc-launcher {
  position: fixed;
  bottom: 30px;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--pbc-red), var(--pbc-gold-d));
  border: 2px solid var(--pbc-gold);
  cursor: pointer;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 30px rgba(201,168,76,.4), 0 8px 25px rgba(0,0,0,.5);
  transition: transform .3s ease, box-shadow .3s ease;
  animation: pbc-pulse 3s infinite;
}
#pbc-launcher:hover {
  transform: scale(1.1);
  box-shadow: 0 0 50px rgba(201,168,76,.7), 0 8px 25px rgba(0,0,0,.5);
}
@keyframes pbc-pulse {
  0%,100% { box-shadow: 0 0 20px rgba(201,168,76,.3),0 0 40px rgba(139,26,26,.2),0 10px 30px rgba(0,0,0,.5); }
  50%      { box-shadow: 0 0 40px rgba(201,168,76,.7),0 0 60px rgba(139,26,26,.4),0 10px 30px rgba(0,0,0,.5); }
}
.pbc-launch-icon, .pbc-close-icon {
  width: 34px; height: 34px;
  fill: var(--pbc-gold);
  transition: all .3s;
}
.pbc-badge {
  position: absolute;
  top: -4px; right: -4px;
  width: 20px; height: 20px;
  background: var(--pbc-red-l);
  border-radius: 50%;
  border: 2px solid #111;
  display: flex; align-items: center; justify-content: center;
  font-size: 10px; color: #fff; font-weight: 700;
  animation: pbc-bounce 2s infinite;
}
@keyframes pbc-bounce {
  0%,100% { transform: translateY(0); }
  50%      { transform: translateY(-4px); }
}

/* ── Chat Window ───────────────────────────────────────────── */
#pbc-window {
  position: fixed;
  bottom: 115px;
  width: 400px;
  height: 620px;
  background: var(--pbc-dark2);
  border-radius: 20px;
  border: 1px solid rgba(201,168,76,.3);
  box-shadow: 0 0 60px rgba(0,0,0,.8), 0 0 30px rgba(201,168,76,.12);
  z-index: 99998;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transform: scale(0) translateY(20px);
  transform-origin: bottom right;
  opacity: 0;
  transition: all .4s cubic-bezier(.34,1.56,.64,1);
  pointer-events: none;
  font-family: 'Cairo', 'Segoe UI', sans-serif;
}
#pbc-window.pbc-open {
  transform: scale(1) translateY(0);
  opacity: 1;
  pointer-events: all;
}
#pbc-window::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg,transparent,var(--pbc-gold),var(--pbc-gold-l),var(--pbc-gold),transparent);
  animation: pbc-shimmer 3s infinite;
}
@keyframes pbc-shimmer {
  0%,100% { opacity: .5; } 50% { opacity: 1; }
}

/* ── Language Screen ───────────────────────────────────────── */
#pbc-lang-screen {
  position: absolute; inset: 0;
  background: var(--pbc-dark2);
  z-index: 20;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  padding: 30px; gap: 20px;
  transition: all .4s ease;
}
#pbc-lang-screen.pbc-hidden {
  opacity: 0; pointer-events: none; transform: scale(.95);
}
.pbc-lang-logo  { font-size: 46px; animation: pbc-float 3s ease-in-out infinite; }
@keyframes pbc-float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }
.pbc-lang-brand { font-size: 1.2rem; font-weight: 700; color: var(--pbc-gold); letter-spacing: 2px; text-align: center; }
.pbc-lang-hint  { color: var(--pbc-muted); font-size: .8rem; text-align: center; }
.pbc-lang-options { display: flex; gap: 14px; width: 100%; }
.pbc-lang-btn {
  flex: 1; padding: 18px 12px; border-radius: 14px;
  background: rgba(201,168,76,.05); border: 1px solid rgba(201,168,76,.25);
  color: var(--pbc-text); cursor: pointer; text-align: center;
  transition: all .3s; display: flex; flex-direction: column; align-items: center; gap: 4px;
}
.pbc-lang-btn:hover {
  border-color: var(--pbc-gold); transform: translateY(-3px);
  box-shadow: 0 10px 30px rgba(201,168,76,.2);
  background: rgba(201,168,76,.1);
}
.pbc-flag   { font-size: 1.8rem; display: block; }
.pbc-lname  { font-weight: 600; font-size: .95rem; color: var(--pbc-gold); }
.pbc-lnative{ font-size: .72rem; color: var(--pbc-muted); }

/* ── Header ────────────────────────────────────────────────── */
.pbc-header {
  background: linear-gradient(135deg,var(--pbc-dark) 0%,#1a0800 50%,var(--pbc-dark) 100%);
  padding: 14px 18px; display: flex; align-items: center; gap: 12px;
  border-bottom: 1px solid rgba(201,168,76,.2); position: relative; flex-shrink: 0;
}
.pbc-avatar {
  width: 46px; height: 46px; border-radius: 50%;
  background: linear-gradient(135deg,var(--pbc-red),var(--pbc-gold-d));
  border: 2px solid var(--pbc-gold);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 0 15px rgba(201,168,76,.4); flex-shrink: 0; position: relative;
}
.pbc-avatar-emoji { font-size: 20px; }
.pbc-status-dot {
  position: absolute; bottom: 1px; right: 1px;
  width: 11px; height: 11px; background: #22c55e;
  border-radius: 50%; border: 2px solid var(--pbc-dark);
  animation: pbc-status 2s infinite;
}
@keyframes pbc-status {
  0%,100%{ box-shadow: 0 0 0 0 rgba(34,197,94,.4); }
  50%     { box-shadow: 0 0 0 5px rgba(34,197,94,0); }
}
.pbc-header-info { flex: 1; }
.pbc-bot-name    { color: var(--pbc-gold); font-size: .95rem; font-weight: 700; letter-spacing: 1px; }
.pbc-bot-sub     { color: var(--pbc-muted); font-size: .7rem; margin-top: 2px; }
.pbc-header-btns { display: flex; gap: 6px; }
.pbc-hbtn {
  width: 30px; height: 30px; border-radius: 7px;
  background: rgba(201,168,76,.08); border: 1px solid rgba(201,168,76,.2);
  color: var(--pbc-gold); cursor: pointer; font-size: 13px;
  display: flex; align-items: center; justify-content: center; transition: all .2s;
}
.pbc-hbtn:hover { background: rgba(201,168,76,.2); border-color: var(--pbc-gold); }

/* ── Messages ──────────────────────────────────────────────── */
#pbc-messages {
  flex: 1; overflow-y: auto; padding: 14px;
  display: flex; flex-direction: column; gap: 10px; scroll-behavior: smooth;
}
#pbc-messages::-webkit-scrollbar { width: 3px; }
#pbc-messages::-webkit-scrollbar-thumb { background: rgba(201,168,76,.3); border-radius: 2px; }

.pbc-msg { display: flex; gap: 8px; animation: pbc-msgIn .3s ease; max-width: 90%; }
@keyframes pbc-msgIn { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:translateY(0)} }
.pbc-msg.bot  { align-self: flex-start; }
.pbc-msg.user { align-self: flex-end; flex-direction: row-reverse; }
/* RTL overrides */
.pbc-rtl .pbc-msg.bot  { align-self: flex-end; }
.pbc-rtl .pbc-msg.user { align-self: flex-start; }

.pbc-msg-av {
  width: 30px; height: 30px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; flex-shrink: 0; margin-top: 4px;
}
.pbc-msg.bot  .pbc-msg-av { background: linear-gradient(135deg,var(--pbc-red),var(--pbc-gold-d)); border: 1px solid var(--pbc-gold); }
.pbc-msg.user .pbc-msg-av { background: #2a2a2a; border: 1px solid rgba(255,255,255,.1); }

.pbc-bubble {
  padding: 9px 13px; border-radius: 15px;
  font-size: .855rem; line-height: 1.55; max-width: 100%;
}
.pbc-msg.bot  .pbc-bubble { background: rgba(201,168,76,.07); border: 1px solid rgba(201,168,76,.15); color: var(--pbc-text); border-top-left-radius: 4px; }
.pbc-msg.user .pbc-bubble { background: linear-gradient(135deg,var(--pbc-red),#6B1010); color: #fff; border: 1px solid rgba(201,168,76,.2); border-top-right-radius: 4px; box-shadow: 0 4px 14px rgba(139,26,26,.3); }
.pbc-rtl .pbc-msg.bot .pbc-bubble  { border-top-left-radius: 15px; border-top-right-radius: 4px; text-align: right; direction: rtl; }
.pbc-rtl .pbc-msg.user .pbc-bubble { border-top-right-radius: 15px; border-top-left-radius: 4px; }

.pbc-time { font-size: .62rem; color: var(--pbc-muted); margin-top: 3px; text-align: right; }
.pbc-msg.bot .pbc-time { text-align: left; }

/* Typing dots */
.pbc-typing-dots { display: flex; gap: 4px; align-items: center; padding: 10px 14px; }
.pbc-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--pbc-gold); animation: pbc-tdot 1.2s infinite; }
.pbc-dot:nth-child(2){ animation-delay:.2s }
.pbc-dot:nth-child(3){ animation-delay:.4s }
@keyframes pbc-tdot { 0%,60%,100%{transform:translateY(0);opacity:.4} 30%{transform:translateY(-6px);opacity:1} }

/* ── Rich Cards ────────────────────────────────────────────── */
.pbc-product-card {
  background: linear-gradient(135deg,rgba(201,168,76,.05),rgba(139,26,26,.05));
  border: 1px solid rgba(201,168,76,.25); border-radius: 13px; overflow: hidden;
  margin-top: 5px; transition: all .3s; cursor: pointer; width: 240px;
}
.pbc-product-card:hover { border-color: var(--pbc-gold); transform: translateY(-2px); box-shadow: 0 10px 24px rgba(0,0,0,.4); }
.pbc-product-thumb { width:100%; height:100px; display:flex; align-items:center; justify-content:center; font-size:38px; background: linear-gradient(135deg,#2a1a0a,#3a0a0a); }
.pbc-product-body  { padding: 9px 11px; }
.pbc-product-name  { color: var(--pbc-gold); font-size: .88rem; font-weight: 700; }
.pbc-product-tag   { display:inline-block; background: var(--pbc-red); color:#fff; font-size:.6rem; padding:2px 7px; border-radius:4px; margin:4px 0; font-weight:700; }
.pbc-product-desc  { color: var(--pbc-muted); font-size: .74rem; line-height: 1.4; }
.pbc-product-foot  { display:flex; justify-content:space-between; align-items:center; margin-top:7px; padding-top:7px; border-top:1px solid rgba(201,168,76,.1); }
.pbc-product-price { color: var(--pbc-gold); font-weight:700; font-size:.9rem; }
.pbc-product-btn   { background: linear-gradient(135deg,var(--pbc-red),var(--pbc-gold-d)); color:#fff; border:none; padding:5px 11px; border-radius:7px; font-size:.71rem; cursor:pointer; transition:all .2s; }
.pbc-product-btn:hover { transform:scale(1.05); box-shadow:0 4px 12px rgba(201,168,76,.3); }

.pbc-video-card { border-radius:11px; overflow:hidden; border:1px solid rgba(201,168,76,.2); margin-top:5px; cursor:pointer; background:#000; transition:all .3s; width:240px; }
.pbc-video-card:hover { border-color: var(--pbc-gold); }
.pbc-video-thumb { width:100%; height:100px; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#1a0000,#0a0a1a); gap:10px; }
.pbc-play-btn { width:40px;height:40px;border-radius:50%;background:rgba(201,168,76,.9);display:flex;align-items:center;justify-content:center;font-size:14px;color:#000;transition:all .2s; }
.pbc-video-card:hover .pbc-play-btn { background:var(--pbc-gold);transform:scale(1.1);box-shadow:0 0 20px rgba(201,168,76,.6); }
.pbc-video-info  { padding:7px 11px; background:rgba(0,0,0,.4); }
.pbc-video-title { color:var(--pbc-text); font-size:.78rem; font-weight:600; }
.pbc-video-dur   { color:var(--pbc-muted); font-size:.68rem; margin-top:2px; }

.pbc-audio-msg { display:flex;align-items:center;gap:9px;background:rgba(201,168,76,.07);border:1px solid rgba(201,168,76,.2);border-radius:11px;padding:9px 13px;cursor:pointer;margin-top:5px;transition:all .2s;width:240px; }
.pbc-audio-msg:hover { background:rgba(201,168,76,.14);border-color:var(--pbc-gold); }
.pbc-audio-play { width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--pbc-red),var(--pbc-gold-d));display:flex;align-items:center;justify-content:center;font-size:14px;border:1px solid var(--pbc-gold);flex-shrink:0; }
.pbc-waves { flex:1;display:flex;align-items:center;gap:2px;height:22px; }
.pbc-wbar { width:3px;background:var(--pbc-gold);border-radius:2px;opacity:.6;animation:pbc-wave 1.2s ease-in-out infinite; }
@keyframes pbc-wave { 0%,100%{height:4px} 50%{height:16px} }
.pbc-audio-dur { color:var(--pbc-muted);font-size:.7rem; }

.pbc-link-card { display:flex;align-items:center;gap:9px;background:rgba(201,168,76,.05);border:1px solid rgba(201,168,76,.2);border-radius:11px;padding:9px 13px;cursor:pointer;margin-top:5px;text-decoration:none;transition:all .2s;width:240px; }
.pbc-link-card:hover { border-color:var(--pbc-gold);background:rgba(201,168,76,.1);transform:translateX(3px); }
.pbc-link-icon { width:34px;height:34px;border-radius:7px;background:linear-gradient(135deg,var(--pbc-red),var(--pbc-gold-d));display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0; }
.pbc-link-info { flex:1; }
.pbc-link-title { color:var(--pbc-gold);font-size:.8rem;font-weight:600; }
.pbc-link-url   { color:var(--pbc-muted);font-size:.68rem; }
.pbc-link-arr   { color:var(--pbc-gold);font-size:16px; }

/* ── Quick Replies ──────────────────────────────────────────── */
#pbc-quick-replies { display:flex;gap:6px;flex-wrap:wrap;padding:7px 14px 0; }
.pbc-qr {
  background:rgba(201,168,76,.08); border:1px solid rgba(201,168,76,.25);
  color:var(--pbc-gold); padding:5px 12px; border-radius:20px;
  font-size:.73rem; cursor:pointer; transition:all .2s; white-space:nowrap; font-family:inherit;
}
.pbc-qr:hover { background:rgba(201,168,76,.2);border-color:var(--pbc-gold);transform:translateY(-1px); }

/* ── Input ─────────────────────────────────────────────────── */
.pbc-input-area {
  padding: 11px 14px; background: var(--pbc-dark);
  border-top: 1px solid rgba(201,168,76,.15);
  display: flex; gap: 9px; align-items: flex-end; position: relative; flex-shrink: 0;
}
.pbc-input-area::before { content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(201,168,76,.3),transparent); }
#pbc-input {
  flex:1; background:rgba(255,255,255,.05); border:1px solid rgba(201,168,76,.2);
  border-radius:13px; padding:9px 13px; color:var(--pbc-text); font-family:inherit;
  font-size:.855rem; resize:none; outline:none; min-height:40px; max-height:100px;
  transition:all .2s; line-height:1.4;
}
#pbc-input:focus { border-color:rgba(201,168,76,.5);background:rgba(255,255,255,.07);box-shadow:0 0 14px rgba(201,168,76,.1); }
#pbc-input::placeholder { color:var(--pbc-muted); }
#pbc-send {
  width:40px;height:40px;border-radius:11px;
  background:linear-gradient(135deg,var(--pbc-red),var(--pbc-gold-d));
  border:1px solid rgba(201,168,76,.3);color:var(--pbc-gold);cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0;
}
#pbc-send:hover { transform:scale(1.08);box-shadow:0 0 18px rgba(201,168,76,.4); }
#pbc-send:active{ transform:scale(.95); }

/* ── Footer ────────────────────────────────────────────────── */
.pbc-footer { text-align:center;padding:5px;color:var(--pbc-muted);font-size:.62rem;letter-spacing:1px;background:rgba(0,0,0,.3);border-top:1px solid rgba(201,168,76,.07);flex-shrink:0; }
.pbc-footer span { color:var(--pbc-gold); }

/* ── Particles ─────────────────────────────────────────────── */
.pbc-particle { position:fixed;width:5px;height:5px;border-radius:50%;pointer-events:none;animation:pbc-part .9s forwards;z-index:100000; }
@keyframes pbc-part { 0%{opacity:1;transform:scale(1) translate(0,0)} 100%{opacity:0;transform:scale(0) translate(var(--tx),var(--ty))} }

/* ── Responsive ────────────────────────────────────────────── */
@media(max-width:480px){
  #pbc-window  { right:10px !important;left:10px !important;width:auto;bottom:100px;height:75vh; }
  #pbc-launcher{ bottom:18px; }
}

/* ── Country grid ──────────────────────────────────────────── */
.pbc-country-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; width:100%; max-height:280px; overflow-y:auto; }
.pbc-country-btn  { padding:10px 8px; border-radius:10px; background:rgba(201,168,76,.05); border:1px solid rgba(201,168,76,.2); color:var(--pbc-text); cursor:pointer; text-align:center; transition:all .25s; display:flex; flex-direction:column; align-items:center; gap:3px; }
.pbc-country-btn:hover { border-color:var(--pbc-gold); background:rgba(201,168,76,.12); transform:translateY(-2px); box-shadow:0 6px 18px rgba(201,168,76,.2); }
.pbc-flag   { font-size:1.5rem; display:block; }
.pbc-lname  { font-weight:600; font-size:.72rem; color:var(--pbc-gold); line-height:1.2; }
.pbc-lnative{ font-size:.65rem; color:var(--pbc-muted); }
.pbc-flag-badge { font-size:1.2rem; margin-left:auto; margin-right:4px; }

/* ── Lead capture form ─────────────────────────────────────── */
#pbc-lead-form { background:rgba(0,0,0,.4); border-top:1px solid rgba(201,168,76,.2); padding:12px 14px; flex-shrink:0; animation:pbc-msgIn .3s ease; }
.pbc-lead-inner { display:flex; flex-direction:column; gap:7px; }
.pbc-lead-title { color:var(--pbc-gold); font-weight:700; font-size:.88rem; margin-bottom:2px; }
.pbc-lead-input { background:rgba(255,255,255,.06); border:1px solid rgba(201,168,76,.2); border-radius:9px; padding:8px 11px; color:var(--pbc-text); font-family:inherit; font-size:.82rem; outline:none; transition:border .2s; resize:none; }
.pbc-lead-input:focus { border-color:rgba(201,168,76,.5); background:rgba(255,255,255,.09); }
.pbc-lead-input::placeholder { color:var(--pbc-muted); }
.pbc-lead-btns { display:flex; gap:7px; margin-top:2px; }
.pbc-lead-btn-submit { flex:1; background:linear-gradient(135deg,var(--pbc-red),var(--pbc-gold-d)); color:#fff; border:none; border-radius:9px; padding:8px; font-size:.8rem; font-weight:600; cursor:pointer; font-family:inherit; transition:all .2s; }
.pbc-lead-btn-submit:hover { opacity:.88; transform:translateY(-1px); box-shadow:0 4px 14px rgba(201,168,76,.3); }
.pbc-lead-btn-wa { flex:1; background:#25d366; color:#fff; border-radius:9px; padding:8px; font-size:.8rem; font-weight:600; text-decoration:none; text-align:center; display:flex; align-items:center; justify-content:center; transition:all .2s; }
.pbc-lead-btn-wa:hover { background:#1ebe5d; }
.pbc-lead-btn-cancel { background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.1); color:var(--pbc-muted); border-radius:9px; padding:8px 12px; cursor:pointer; font-size:.8rem; transition:all .2s; }
.pbc-lead-btn-cancel:hover { background:rgba(255,255,255,.12); }

/* ── Custom launcher icon ──────────────────────────────────── */
.pbc-custom-icon { width:70%; height:70%; object-fit:contain; border-radius:50%; }

/* ── Product extra info ────────────────────────────────────── */
.pbc-product-extra { color:var(--pbc-muted); font-size:.7rem; margin-top:4px; padding-top:4px; border-top:1px solid rgba(201,168,76,.1); }

/* ── Bell notification button ───────────────────────────────── */
#pbc-bell-wrap {
  position: fixed;
  bottom: 115px;
  z-index: 99997;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}
#pbc-bell-btn {
  width: 42px; height: 42px; border-radius: 50%;
  background: linear-gradient(135deg,var(--pbc-red),var(--pbc-gold-d));
  border: 2px solid var(--pbc-gold); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 0 18px rgba(201,168,76,.35), 0 4px 12px rgba(0,0,0,.4);
  transition: all .3s; position: relative;
  animation: pbc-bell-swing 4s ease-in-out infinite;
}
@keyframes pbc-bell-swing {
  0%,100%{transform:rotate(0)}
  5%{transform:rotate(15deg)}
  10%{transform:rotate(-12deg)}
  15%{transform:rotate(8deg)}
  20%{transform:rotate(-5deg)}
  25%{transform:rotate(0)}
}
#pbc-bell-btn:hover { transform:scale(1.12); box-shadow:0 0 28px rgba(201,168,76,.6); }
.pbc-bell-icon { font-size: 18px; }
.pbc-bell-count {
  position: absolute; top: -5px; right: -5px;
  min-width: 18px; height: 18px; background: #ef4444;
  border-radius: 10px; border: 2px solid #111;
  font-size: 9px; font-weight: 700; color: #fff;
  display: flex; align-items: center; justify-content: center;
  padding: 0 3px; animation: pbc-bounce 1.5s infinite;
}

/* ── Notification panel ─────────────────────────────────────── */
#pbc-notif-panel {
  width: 300px; background: var(--pbc-dark2);
  border: 1px solid rgba(201,168,76,.3); border-radius: 14px;
  box-shadow: 0 20px 50px rgba(0,0,0,.7), 0 0 20px rgba(201,168,76,.1);
  overflow: hidden; animation: pbc-msgIn .3s ease;
  max-height: 400px; overflow-y: auto;
}
.pbc-notif-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px; background: linear-gradient(135deg,var(--pbc-dark),#1a0800);
  border-bottom: 1px solid rgba(201,168,76,.2);
}
#pbc-notif-title { color:var(--pbc-gold); font-weight:700; font-size:.88rem; }
#pbc-notif-close { background:none; border:none; color:var(--pbc-muted); cursor:pointer; font-size:14px; padding:0; }
#pbc-notif-close:hover { color:var(--pbc-gold); }
.pbc-notif-item {
  padding: 12px 14px; border-bottom: 1px solid rgba(255,255,255,.05);
  cursor: pointer; transition: background .2s;
}
.pbc-notif-item:hover { background: rgba(201,168,76,.07); }
.pbc-notif-item-icon { font-size: 1.3rem; margin-bottom: 4px; }
.pbc-notif-item-title { color:var(--pbc-gold); font-weight:700; font-size:.82rem; margin-bottom:3px; }
.pbc-notif-item-text { color:var(--pbc-text); font-size:.78rem; line-height:1.4; }
.pbc-notif-empty { padding:20px; text-align:center; color:var(--pbc-muted); font-size:.82rem; }

/* ── Product card with image ────────────────────────────────── */
.pbc-product-img {
  width: 100%; height: 130px; object-fit: cover; display: block;
  background: linear-gradient(135deg,#2a1a0a,#3a0a0a);
}
.pbc-product-img-wrap {
  width: 100%; height: 130px; overflow: hidden;
  position: relative;
}
.pbc-product-on-sale {
  position: absolute; top: 8px; left: 8px;
  background: #ef4444; color: #fff; font-size: .65rem; font-weight: 700;
  padding: 3px 8px; border-radius: 6px; letter-spacing: .5px;
}