/* ==========================================================
   ShareCardLink - Status viewer (WhatsApp jaise features)
   Maujooda #statusModal / #statusBox ke upar kaam karta hai.
   PDF wale hisse ko haath nahi lagata - naye controls par
   data-html2canvas-ignore laga hai, wo PDF me aate hi nahi.
   ========================================================== */

/* ---------- header: avatar + naam + time ---------- */
#companyName.sclst-head{
  display:flex !important;
  align-items:center;
  gap:9px;
  min-width:0;
}
#companyName .sclst-av{
  width:34px;height:34px;flex:0 0 34px;
  border-radius:50%;object-fit:cover;
  background:#e9eef3;
  border:2px solid #fff;
  box-shadow:0 0 0 1.5px #d7dee6;
}
#companyName .sclst-meta{
  display:flex;flex-direction:column;align-items:flex-start;
  line-height:1.25;min-width:0;
}
#companyName .sclst-nm{
  font-size:14px;font-weight:700;color:#222;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  max-width:42vw;
}
#companyName .sclst-ago{
  font-size:11px;font-weight:500;color:#8a94a2;
}

/* ---------- pause indicator ---------- */
#sclst-pause{
  position:absolute;top:50%;left:50%;
  transform:translate(-50%,-50%) scale(.85);
  z-index:2200;pointer-events:none;
  background:rgba(0,0,0,.55);color:#fff;
  border-radius:50%;width:56px;height:56px;
  display:flex;align-items:center;justify-content:center;
  font-size:22px;opacity:0;
  transition:opacity .2s ease, transform .2s ease;
}
#sclst-pause.on{opacity:1;transform:translate(-50%,-50%) scale(1)}

/* ---------- mute button ---------- */
#sclst-mute{
  position:absolute;top:10px;right:10px;z-index:2300;
  width:36px;height:36px;border:0;border-radius:50%;
  background:rgba(0,0,0,.5);color:#fff;font-size:15px;
  cursor:pointer;display:none;
  align-items:center;justify-content:center;
  -webkit-tap-highlight-color:transparent;
  transition:background .25s,transform .2s;
}
#sclst-mute:hover{background:rgba(0,0,0,.72)}
#sclst-mute:active{transform:scale(.9)}
#sclst-mute.show{display:flex}

/* ---------- reply + share row ---------- */
#sclst-actions{
  display:flex;gap:8px;align-items:center;
  margin:0 0 12px;
}
#sclst-actions input{
  flex:1;min-width:0;
  padding:10px 13px;border-radius:22px;
  border:1px solid #d9e0e8;background:#fff;
  font:14px/1.3 inherit;color:#222;outline:none;
  transition:border-color .2s, box-shadow .2s;
}
#sclst-actions input:focus{
  border-color:#25d366;box-shadow:0 0 0 3px rgba(37,211,102,.16);
}
#sclst-actions input::placeholder{color:#9aa5b1}

#sclst-actions button{
  flex:0 0 auto;border:0;cursor:pointer;
  width:40px;height:40px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:15px;color:#fff;
  -webkit-tap-highlight-color:transparent;
  transition:transform .18s cubic-bezier(.34,1.56,.64,1), filter .2s;
}
#sclst-actions button:active{transform:scale(.9)}
#sclst-reply-send{background:#25d366}
#sclst-share{background:#2978af}
#sclst-actions button:hover{filter:brightness(1.08)}

/* ---------- toast ---------- */
#sclst-toast{
  position:fixed;left:50%;bottom:26px;
  transform:translate(-50%,16px);
  z-index:99999;pointer-events:none;
  background:rgba(18,20,28,.94);color:#fff;
  padding:10px 16px;border-radius:22px;
  font:500 13px/1.3 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  opacity:0;transition:opacity .28s ease, transform .28s ease;
  max-width:80vw;text-align:center;
}
#sclst-toast.on{opacity:1;transform:translate(-50%,0)}

/* swipe ke waqt text select na ho */
#statusBox.sclst-drag{user-select:none;-webkit-user-select:none}

@media (prefers-reduced-motion:reduce){
  #sclst-pause,#sclst-toast,#sclst-actions button,#sclst-mute{transition:none}
}
@media print{#sclst-actions,#sclst-mute,#sclst-pause,#sclst-toast{display:none !important}}