/* Spa & Wellness Design — visitor chat widget */
.swd-chat-bubble{
  position:fixed; right:22px; bottom:22px; z-index:9998;
  width:60px; height:60px; border-radius:50%;
  background:var(--color-accent,#C8A96E); color:#fff; border:none; cursor:pointer;
  box-shadow:0 6px 24px rgba(0,0,0,.22);
  display:flex; align-items:center; justify-content:center;
  transition:transform .25s ease, background .25s ease;
}
.swd-chat-bubble:hover{ transform:translateY(-2px); background:#b9965c; }
.swd-chat-bubble svg{ width:26px; height:26px; }
.swd-chat-bubble .swd-badge{
  position:absolute; top:-2px; right:-2px; min-width:20px; height:20px; padding:0 5px;
  background:#c0392b; color:#fff; border-radius:10px; font:600 11px/20px system-ui,sans-serif;
  text-align:center; display:none;
}
.swd-chat-bubble.has-unread .swd-badge{ display:block; }

/* "Chat with a human" label floating above the bubble */
.swd-bubble-label{
  position:absolute; right:0; bottom:70px; white-space:nowrap;
  background:#1C1410; color:#F5EDE3; font:600 12px/1 'Inter',system-ui,sans-serif;
  padding:9px 13px; border-radius:10px; box-shadow:0 4px 16px rgba(0,0,0,.22);
  pointer-events:none; opacity:0; transform:translateY(6px);
  transition:opacity .3s ease, transform .3s ease;
}
.swd-label-ico{ width:14px; height:14px; margin-left:6px; vertical-align:-3px; }
.swd-bubble-label::after{ content:""; position:absolute; right:18px; bottom:-5px; width:10px; height:10px; background:#1C1410; transform:rotate(45deg); }
/* show the label by default after load, and on hover; hide once panel opens */
.swd-chat-bubble .swd-bubble-label{ opacity:1; transform:translateY(0); }
.swd-chat-bubble:hover .swd-bubble-label{ opacity:1; transform:translateY(0); }
body.swd-open .swd-bubble-label{ opacity:0 !important; }

/* Pre-chat form */
.swd-prechat{ flex:1; display:flex; flex-direction:column; gap:10px; padding:22px 20px; overflow-y:auto; }
.swd-prechat-intro{ color:#6B6B6B; font-size:13px; line-height:1.5; margin-bottom:4px; }
.swd-prechat-intro strong{ display:block; font-family:'Playfair Display',Georgia,serif; font-size:17px; color:#1C1C1C; margin-bottom:.4rem; }
.swd-prechat input{ border:1px solid #E4DDD3; border-radius:10px; padding:12px 13px; font-size:14px; font-family:inherit; outline:none; }
.swd-prechat input:focus{ border-color:var(--color-accent,#C8A96E); }
.swd-prechat button{ background:var(--color-accent,#C8A96E); color:#fff; border:none; border-radius:10px; padding:12px; font-weight:600; font-size:14px; cursor:pointer; margin-top:4px; }
.swd-prechat button:hover{ background:#b9965c; }
.swd-prechat-err{ color:#c0392b; font-size:12px; min-height:14px; }

.swd-chat-panel{
  position:fixed; right:22px; bottom:94px; z-index:9999;
  width:360px; max-width:calc(100vw - 32px); height:520px; max-height:calc(100vh - 130px);
  background:#fff; border-radius:14px; overflow:hidden;
  box-shadow:0 18px 60px rgba(0,0,0,.28);
  display:none; flex-direction:column;
  font-family:'Inter',system-ui,sans-serif;
}
.swd-chat-panel.open{ display:flex; animation:swdRise .28s ease; }
@keyframes swdRise{ from{opacity:0; transform:translateY(14px);} to{opacity:1; transform:none;} }

.swd-chat-head{
  background:linear-gradient(135deg,#1a1410,#2d2218); color:#fff; padding:18px 20px;
  display:flex; align-items:center; justify-content:space-between;
}
.swd-chat-head .swd-title{ font-family:'Playfair Display',Georgia,serif; font-size:17px; font-weight:700; }
.swd-chat-head .swd-sub{ font-size:11.5px; color:rgba(255,255,255,.7); margin-top:2px; display:flex; align-items:center; gap:6px; }
.swd-dot{ width:8px; height:8px; border-radius:50%; background:#7FA37F; display:inline-block; }
.swd-dot.away{ background:#A89888; }
.swd-chat-close{ background:none; border:none; color:rgba(255,255,255,.8); font-size:22px; cursor:pointer; line-height:1; }
.swd-head-actions{ position:relative; display:flex; align-items:center; gap:6px; }
.swd-chat-menu{ background:none; border:none; color:rgba(255,255,255,.8); font-size:20px; cursor:pointer; line-height:1; padding:0 2px; }
.swd-menu{ position:absolute; top:34px; right:0; background:#fff; border:1px solid #E4DDD3; border-radius:10px; box-shadow:0 10px 30px rgba(0,0,0,.18); overflow:hidden; display:none; min-width:180px; z-index:5; }
.swd-menu.open{ display:block; }
.swd-menu button{ display:block; width:100%; text-align:left; background:none; border:none; padding:11px 14px; font:500 13px/1 'Inter',system-ui,sans-serif; color:#1C1C1C; cursor:pointer; }
.swd-menu button:hover{ background:#F9F6F1; color:var(--color-accent-dark,#A88A50); }
.swd-filelink{ color:#fff; text-decoration:underline; font-weight:600; word-break:break-word; }
.swd-msg.operator .swd-filelink{ color:#1C1C1C; }

.swd-chat-msgs{ flex:1; overflow-y:auto; padding:18px; background:#F9F6F1; display:flex; flex-direction:column; gap:10px; }
.swd-msg{ max-width:80%; padding:10px 13px; border-radius:12px; font-size:13.5px; line-height:1.5; }
.swd-msg.visitor{ align-self:flex-end; background:var(--color-accent,#C8A96E); color:#fff; border-bottom-right-radius:3px; }
.swd-msg.operator{ align-self:flex-start; background:#fff; color:#1C1C1C; border:1px solid #E4DDD3; border-bottom-left-radius:3px; }
.swd-msg.system{ align-self:center; background:transparent; color:#8a8276; font-size:12px; font-style:italic; }
.swd-msg-time{ display:block; font-size:10px; opacity:.6; margin-top:4px; text-align:right; }
.swd-msg.operator .swd-msg-time{ text-align:left; }

.swd-chat-intro{ text-align:center; color:#6B6B6B; font-size:13px; padding:1.5rem 1rem; }
.swd-chat-intro strong{ display:block; font-family:'Playfair Display',Georgia,serif; font-size:16px; color:#1C1C1C; margin-bottom:.4rem; }

.swd-chat-foot{ border-top:1px solid #E4DDD3; padding:10px; background:#fff; display:flex; gap:8px; }
.swd-chat-foot input{
  flex:1; border:1px solid #E4DDD3; border-radius:10px; padding:11px 13px; font-size:13.5px;
  font-family:inherit; outline:none;
}
.swd-chat-foot input:focus{ border-color:var(--color-accent,#C8A96E); }
.swd-chat-foot button{
  background:var(--color-accent,#C8A96E); color:#fff; border:none; border-radius:10px;
  width:44px; cursor:pointer; display:flex; align-items:center; justify-content:center;
}
.swd-chat-foot button:hover{ background:#b9965c; }
.swd-chat-foot button svg{ width:18px; height:18px; }

@media (max-width:480px){
  .swd-chat-panel{ right:8px; left:8px; bottom:88px; width:auto; height:calc(100vh - 120px); }
}