/* SAMSHEYS chat & calls widget. Uses the site's existing theme variables so it
   automatically matches whichever theme is active. */
:root{
  --sv-chat-primary: var(--sv-primary, #d7ad52);
  --sv-chat-bg: var(--sv-surface, #14181e);
  --sv-chat-bg2: var(--sv-stone, #1b2028);
  --sv-chat-text: var(--sv-text, #f2f2ee);
  --sv-chat-muted: var(--sv-muted, #9aa0a8);
  --sv-chat-line: var(--sv-line, rgba(255,255,255,.1));
  --sv-chat-bubble-mine: linear-gradient(135deg,#d7ad52,#9e762d);
  --sv-chat-bubble-theirs: #ffffff;
  --sv-chat-theirs-text: #17202a;
  --sv-chat-mine-text: #1b1407;
}

#sv-chat-launcher{
  position:fixed; right:18px; bottom:18px; z-index:99990;
  width:58px; height:58px; border-radius:50%; border:0; cursor:pointer;
  background:var(--sv-chat-bubble-mine); color:#100c04;
  box-shadow:0 10px 30px rgba(0,0,0,.35); font-size:24px;
  display:flex; align-items:center; justify-content:center;
  transition:transform .18s ease;
}
#sv-chat-launcher:hover{transform:translateY(-2px) scale(1.03)}
#sv-chat-launcher .sv-chat-badge{
  position:absolute; top:-4px; right:-4px; min-width:20px; height:20px; padding:0 5px;
  border-radius:99px; background:#e0334a; color:#fff; font:800 11px/20px DM Sans, sans-serif;
  text-align:center; box-shadow:0 0 0 2px var(--sv-chat-bg);
}
#sv-chat-launcher .sv-chat-badge[hidden]{display:none}

#sv-chat-panel{
  position:fixed; right:18px; bottom:86px; z-index:99991;
  width:380px; max-width:calc(100vw - 24px); height:min(600px, calc(100vh - 120px));
  background:var(--sv-chat-bg); color:var(--sv-chat-text); border:1px solid var(--sv-chat-line);
  border-radius:16px; box-shadow:0 24px 70px rgba(0,0,0,.45); overflow:hidden;
  display:flex; flex-direction:column; font-family:'DM Sans',system-ui,sans-serif;
}
#sv-chat-panel[hidden]{display:none}
@media (max-width:480px){
  #sv-chat-panel{right:0; bottom:0; width:100vw; height:100vh; max-width:100vw; border-radius:0}
}

.sv-chat-header{
  display:flex; align-items:center; gap:8px; padding:12px 14px;
  background:var(--sv-chat-bg2); border-bottom:1px solid var(--sv-chat-line); flex-shrink:0;
}
.sv-chat-header button{background:none; border:0; color:var(--sv-chat-text); cursor:pointer; font-size:17px; padding:4px}
.sv-chat-header .sv-chat-title{flex:1; min-width:0}
.sv-chat-header .sv-chat-title b{display:block; font-size:13px; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.sv-chat-header .sv-chat-title span{display:block; font-size:10px; color:var(--sv-chat-muted)}
.sv-chat-header .sv-chat-actions{display:flex; gap:4px}
.sv-chat-header .sv-chat-actions button{font-size:16px}

.sv-chat-list{flex:1; overflow-y:auto; padding:6px}
.sv-chat-thread-row{
  display:flex; gap:10px; align-items:center; padding:10px; border-radius:12px; cursor:pointer;
}
.sv-chat-thread-row:hover{background:rgba(255,255,255,.05)}
.sv-chat-avatar{
  width:38px; height:38px; border-radius:50%; background:var(--sv-chat-bubble-mine);
  color:#100c04; display:flex; align-items:center; justify-content:center; font-weight:800; flex-shrink:0;
}
.sv-chat-thread-meta{flex:1; min-width:0}
.sv-chat-thread-meta .sv-t-name{font-size:12.5px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.sv-chat-thread-meta .sv-t-preview{font-size:11px; color:var(--sv-chat-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.sv-chat-thread-unread{
  min-width:18px; height:18px; padding:0 5px; border-radius:99px; background:#e0334a; color:#fff;
  font:800 10px/18px DM Sans,sans-serif; text-align:center;
}
.sv-chat-empty{padding:30px 16px; text-align:center; color:var(--sv-chat-muted); font-size:12px}
.sv-chat-new-btn{
  margin:8px; padding:10px; border-radius:10px; border:1px dashed var(--sv-chat-line);
  background:none; color:var(--sv-chat-primary); font-weight:700; font-size:12px; cursor:pointer; width:calc(100% - 16px);
}

.sv-chat-messages{flex:1; min-height:0; overflow-y:auto; padding:14px 12px; display:flex; flex-direction:column; gap:4px; background:var(--sv-chat-bg); background-image:radial-gradient(rgba(255,255,255,.025) 1px,transparent 1px); background-size:18px 18px}
.sv-chat-msg{width:fit-content; max-width:min(78%, 520px); min-width:44px; box-sizing:border-box; padding:7px 9px 5px; border-radius:9px; font-size:13px; line-height:1.42; white-space:pre-wrap; overflow-wrap:anywhere; word-break:break-word; box-shadow:0 1px 1px rgba(0,0,0,.12)}
.sv-chat-msg.mine{align-self:flex-end; background:var(--sv-chat-bubble-mine); color:var(--sv-chat-mine-text); border-bottom-right-radius:3px}
.sv-chat-msg.theirs{align-self:flex-start; background:var(--sv-chat-bubble-theirs); color:var(--sv-chat-theirs-text); border-bottom-left-radius:3px}
.sv-chat-msg.system{box-shadow:none}
.sv-chat-msg .sv-msg-time{color:inherit; opacity:.62; text-align:right; white-space:nowrap; margin-left:12px}
.sv-chat-msg .sv-msg-sender{color:inherit; opacity:.72}
@media (max-width:600px){.sv-chat-msg{max-width:88%; font-size:14px; padding:8px 10px 6px}.sv-chat-messages{padding:12px 8px}}
.sv-chat-msg.system{align-self:center; background:none; color:var(--sv-chat-muted); font-size:11px; text-align:center}
.sv-chat-msg img{max-width:100%; border-radius:10px; display:block; margin-top:4px; cursor:zoom-in}
.sv-chat-msg .sv-msg-time{display:block; font-size:9px; opacity:.6; margin-top:3px}
.sv-chat-msg .sv-msg-sender{display:block; font-size:9.5px; font-weight:800; opacity:.75; margin-bottom:2px}

.sv-chat-composer{display:flex; align-items:flex-end; gap:6px; padding:8px 10px; border-top:1px solid var(--sv-chat-line); background:var(--sv-chat-bg2); flex-shrink:0}
.sv-chat-composer textarea{
  flex:1; resize:none; max-height:120px; min-height:38px; border-radius:20px; border:1px solid var(--sv-chat-line);
  background:var(--sv-chat-bg); color:var(--sv-chat-text); padding:8px 12px; font:12.5px 'DM Sans',sans-serif;
}
.sv-chat-composer button{
  width:36px; height:36px; border-radius:50%; border:0; background:var(--sv-chat-bubble-mine); color:#191204;
  font-size:15px; cursor:pointer; flex-shrink:0; display:flex; align-items:center; justify-content:center;
}
.sv-chat-composer .sv-chat-attach{background:none; color:var(--sv-chat-muted); font-size:19px}
.sv-chat-image-preview{display:flex; align-items:center; gap:8px; padding:6px 10px; background:var(--sv-chat-bg2); border-top:1px solid var(--sv-chat-line)}
.sv-chat-image-preview img{width:44px; height:44px; object-fit:cover; border-radius:8px}
.sv-chat-image-preview button{background:none; border:0; color:#e0334a; cursor:pointer; font-size:15px}

.sv-chat-newchat{padding:10px}
.sv-chat-newchat .sv-colleague{display:flex; align-items:center; gap:8px; padding:9px 6px; border-radius:10px; cursor:pointer}
.sv-chat-newchat .sv-colleague:hover{background:rgba(255,255,255,.05)}

/* Calls */
.sv-call-overlay{position:absolute; inset:0; background:rgba(6,8,10,.97); z-index:5; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; color:#fff; text-align:center; padding:20px}
.sv-call-avatar{width:84px; height:84px; border-radius:50%; background:var(--sv-chat-bubble-mine); display:flex; align-items:center; justify-content:center; font-size:30px; font-weight:800; color:#191204; animation:svCallPulse 1.6s infinite}
@keyframes svCallPulse{0%{box-shadow:0 0 0 0 rgba(215,173,82,.5)}70%{box-shadow:0 0 0 22px rgba(215,173,82,0)}100%{box-shadow:0 0 0 0 rgba(215,173,82,0)}}
.sv-call-name{font-size:16px; font-weight:800}
.sv-call-status{font-size:11.5px; color:#a9b0b8}
.sv-call-actions{display:flex; gap:20px; margin-top:10px}
.sv-call-actions button{width:52px; height:52px; border-radius:50%; border:0; font-size:20px; cursor:pointer}
.sv-call-accept{background:#2fbf5e; color:#06210f}
.sv-call-decline,.sv-call-hangup{background:#e0334a; color:#280809}
.sv-call-mute,.sv-call-cam{background:#333a44; color:#fff}
.sv-call-mute.is-active,.sv-call-cam.is-active{background:var(--sv-chat-primary); color:#191204}

.sv-call-video-stage{position:absolute; inset:0; background:#000; z-index:6; display:flex; align-items:center; justify-content:center}
.sv-call-video-stage video.remote{width:100%; height:100%; object-fit:cover}
.sv-call-video-stage video.local{position:absolute; width:96px; height:128px; right:12px; bottom:76px; object-fit:cover; border-radius:10px; border:2px solid rgba(255,255,255,.4)}
.sv-call-video-stage .sv-call-actions{position:absolute; bottom:16px; left:0; right:0}
.sv-call-video-stage .sv-call-timer{position:absolute; top:12px; left:0; right:0; text-align:center; color:#fff; font-size:12px; font-weight:700; text-shadow:0 1px 3px rgba(0,0,0,.6)}

.sv-chat-toast{
  position:fixed; right:18px; bottom:90px; z-index:99992; max-width:300px; background:var(--sv-chat-bg2);
  color:var(--sv-chat-text); border:1px solid var(--sv-chat-line); border-radius:12px; padding:10px 12px;
  box-shadow:0 12px 30px rgba(0,0,0,.4); font-size:12px; cursor:pointer; animation:svToastIn .2s ease;
}
@keyframes svToastIn{from{opacity:0; transform:translateY(8px)}to{opacity:1; transform:translateY(0)}}
.sv-chat-toast b{display:block; font-size:11.5px; margin-bottom:2px}

.sv-chat-picker-title{padding:8px 4px 10px}.sv-chat-picker-title b{display:block;font-size:13px}.sv-chat-picker-title span{display:block;margin-top:3px;color:var(--sv-chat-muted);font-size:10px;line-height:1.35}.sv-chat-staff-search{width:100%;box-sizing:border-box;padding:9px 10px;border:1px solid var(--sv-chat-line);border-radius:10px;background:var(--sv-chat-bg);color:var(--sv-chat-text);font:12px 'DM Sans',sans-serif;margin-bottom:6px}.sv-chat-staff-list{display:grid;gap:2px}.sv-chat-newchat .sv-colleague{width:100%;border:0;background:transparent;text-align:left;color:var(--sv-chat-text);font:inherit}.sv-colleague-copy{min-width:0;display:grid}.sv-colleague-copy strong{font-size:12px}.sv-colleague-copy small{font-size:10px;color:var(--sv-chat-muted);margin-top:2px}.cc-chat-link b{font-size:16px}

.sv-chat-urgent{font-size:10px;font-weight:800;white-space:nowrap;border:1px solid rgba(255,90,70,.35);border-radius:8px;padding:6px 7px;background:transparent;color:inherit;cursor:pointer}.sv-chat-urgent.is-active{background:rgba(255,70,50,.15);border-color:rgba(255,70,50,.7);color:#ff725f}

.sv-msg-moderation{display:flex;gap:4px;margin-top:5px}.sv-msg-moderation button{border:0;background:rgba(255,255,255,.08);color:inherit;border-radius:5px;padding:3px 6px;font-size:9px;cursor:pointer}.sv-msg-edited{opacity:.55;font-size:9px;margin-left:4px}

/* Compact top-right communication dock. Both actions remain visible without
   covering the page content or being pushed below the document. */
.sv-whatsapp-float{
  position:fixed !important;
  top:18px !important;
  right:86px !important;
  bottom:auto !important;
  z-index:2147483000 !important;
  width:48px !important;
  height:48px !important;
  min-width:48px !important;
  min-height:48px !important;
  max-width:48px !important;
  max-height:48px !important;
  padding:0 !important;
  margin:0 !important;
  box-sizing:border-box !important;
  border-radius:50% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
  text-decoration:none !important;
  background:#25D366 !important;
  color:#fff !important;
  border:2px solid rgba(255,255,255,.9) !important;
  box-shadow:0 8px 24px rgba(0,0,0,.28),0 0 0 4px rgba(37,211,102,.12) !important;
  line-height:0 !important;
  font-size:0 !important;
  transform:translateZ(0);
}
.sv-whatsapp-float:hover{transform:translateY(-2px) scale(1.04) !important}
.sv-whatsapp-icon{
  width:28px !important; height:28px !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  flex:0 0 28px !important;
}
.sv-whatsapp-float svg{
  display:block !important; width:28px !important; height:28px !important;
  min-width:28px !important; min-height:28px !important;
  max-width:28px !important; max-height:28px !important;
  margin:0 !important; padding:0 !important;
  flex:0 0 28px !important;
  overflow:visible !important;
}
.sv-whatsapp-float svg path{fill:#fff !important}

/* Move the website chat launcher to the same top-right dock. */
#sv-chat-launcher{
  top:18px !important;
  right:18px !important;
  bottom:auto !important;
  z-index:2147483001 !important;
}
#sv-chat-panel{
  top:78px !important;
  right:18px !important;
  bottom:auto !important;
  z-index:2147483002 !important;
}

@media(max-width:560px){
  .sv-whatsapp-float{top:12px !important;right:72px !important;width:46px !important;height:46px !important;min-width:46px !important;min-height:46px !important;max-width:46px !important;max-height:46px !important}
  .sv-whatsapp-icon,.sv-whatsapp-float svg{width:26px !important;height:26px !important;min-width:26px !important;min-height:26px !important;max-width:26px !important;max-height:26px !important}
  #sv-chat-launcher{top:12px !important;right:14px !important;width:46px !important;height:46px !important}
  #sv-chat-panel{top:68px !important;right:6px !important;max-width:calc(100vw - 12px) !important}
}