/* ================================================================
   VALSKUY CHAT WIDGET
================================================================ */
#vsk-chat-btn{
  position:fixed;bottom:24px;right:20px;z-index:9002;
  display:flex;align-items:center;gap:10px;
  background:var(--surface);border:1px solid var(--border);
  padding:10px 16px 10px 12px;cursor:pointer;
  font-family:'DM Sans',sans-serif;
  transition:border-color .2s,background .2s;
}
#vsk-chat-btn:hover{border-color:var(--br2);background:var(--card)}
#vsk-chat-btn-icon{
  width:34px;height:34px;background:var(--gold);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
#vsk-chat-btn-icon svg{width:18px;height:18px;fill:var(--void)}
#vsk-chat-btn-label{
  font-size:11px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--cream);
}
#vsk-chat-badge{
  position:absolute;top:-6px;right:-6px;
  background:var(--red);color:var(--chalk);
  font-size:10px;font-weight:700;
  min-width:18px;height:18px;padding:0 4px;
  display:flex;align-items:center;justify-content:center;
  border-radius:50%;
}
#vsk-chat-badge.vsk-hidden{display:none}

#vsk-chat-panel{
  position:fixed;bottom:24px;right:20px;z-index:9003;
  width:368px;height:560px;max-height:80vh;
  background:var(--base);border:1px solid var(--border);
  display:flex;flex-direction:column;overflow:hidden;
  font-family:'DM Sans',sans-serif;
  box-shadow:0 20px 60px rgba(0,0,0,.5);
}
#vsk-chat-panel.vsk-hidden{display:none}

.vsk-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 18px;border-bottom:1px solid var(--border);background:var(--surface);
  flex-shrink:0;
}
.vsk-head-title{
  font-family:'Bebas Neue',sans-serif;letter-spacing:1.5px;font-size:18px;color:var(--chalk);
}
.vsk-head-sub{font-size:11px;color:var(--muted);margin-top:2px}
.vsk-admin-status{display:flex;align-items:center;gap:6px;margin-top:3px;font-size:11px;color:var(--muted)}
.vsk-status-dot{width:6px;height:6px;border-radius:50%;background:var(--muted);flex-shrink:0}
.vsk-admin-status.vsk-online .vsk-status-dot{background:#3fbf6f}
.vsk-admin-status.vsk-online .vsk-status-text{color:#3fbf6f}
.vsk-close{
  background:none;border:1px solid var(--border);color:var(--muted);
  width:28px;height:28px;cursor:pointer;font-size:16px;line-height:1;
  display:flex;align-items:center;justify-content:center;
}
.vsk-close:hover{color:var(--cream);border-color:var(--br2)}

.vsk-body{flex:1;overflow-y:auto;padding:18px;scrollbar-width:thin;scrollbar-color:var(--border) transparent}

/* --- Auth forms --- */
.vsk-tabs{display:flex;border:1px solid var(--border);margin-bottom:18px}
.vsk-tab{
  flex:1;background:none;border:none;padding:10px;cursor:pointer;
  font-size:11px;font-weight:600;letter-spacing:1px;text-transform:uppercase;
  color:var(--muted);border-right:1px solid var(--border);
}
.vsk-tab:last-child{border-right:none}
.vsk-tab.vsk-active{color:var(--chalk);background:var(--card)}

.vsk-field{margin-bottom:12px}
.vsk-field label{display:block;font-size:11px;color:var(--muted);margin-bottom:6px;letter-spacing:.5px}
.vsk-field input{
  width:100%;background:var(--card);border:1px solid var(--border);color:var(--cream);
  padding:10px 12px;font-size:14px;font-family:'DM Sans',sans-serif;
}
.vsk-field input:focus{outline:none;border-color:var(--br2)}

.vsk-btn{
  width:100%;background:var(--gold);color:var(--void);border:none;
  padding:11px;font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;
  cursor:pointer;margin-top:4px;
}
.vsk-btn:hover{opacity:.9}
.vsk-btn:disabled{opacity:.5;cursor:not-allowed}

.vsk-btn-ghost{
  width:100%;background:none;color:var(--muted);border:1px solid var(--border);
  padding:10px;font-size:11px;letter-spacing:.5px;cursor:pointer;margin-top:8px;
}
.vsk-btn-ghost:hover{color:var(--cream);border-color:var(--br2)}

.vsk-msg-err{
  font-size:12px;color:var(--red);margin-bottom:12px;padding:8px 10px;
  border:1px solid var(--red);background:rgba(184,64,64,.08);
}
.vsk-msg-info{
  font-size:12px;color:var(--silver2);margin-bottom:12px;padding:8px 10px;
  border:1px solid var(--border);
}
.vsk-hidden{display:none !important}

.vsk-otp-hint{font-size:12px;color:var(--muted);margin-bottom:14px;line-height:1.5}
.vsk-otp-input{
  width:100%;background:var(--card);border:1px solid var(--border);color:var(--chalk);
  padding:12px;font-size:22px;letter-spacing:8px;text-align:center;
  font-family:'DM Sans',sans-serif;margin-bottom:12px;
}

/* --- Chat thread --- */
#vsk-chat-panel.vsk-mode-chat .vsk-body{padding:14px;display:flex;flex-direction:column;gap:10px}

.vsk-bubble-row{display:flex}
.vsk-bubble-row.vsk-from-user{justify-content:flex-end}
.vsk-bubble-row > div{max-width:78%;min-width:0}
.vsk-bubble{
  padding:9px 12px;font-size:13.5px;line-height:1.45;
  border:1px solid var(--border);
}
.vsk-from-admin .vsk-bubble{background:var(--surface);color:var(--cream)}
.vsk-from-user .vsk-bubble{background:var(--gold);color:var(--void);border-color:var(--gold)}
.vsk-bubble img{max-width:100%;display:block;margin-bottom:4px;cursor:pointer}
.vsk-bubble audio{width:220px;height:34px;margin-top:2px}
.vsk-bubble-time{font-size:9.5px;opacity:.6;margin-top:4px;display:block}

.vsk-empty-state{
  margin:auto;text-align:center;color:var(--muted);font-size:12px;padding:20px;
}

.vsk-intent-box{
  border:1px solid var(--border);background:var(--surface);padding:16px;margin:4px 0;
}
.vsk-intent-title{font-size:13px;font-weight:600;color:var(--chalk);margin-bottom:8px}
.vsk-intent-preview{
  font-size:12.5px;color:var(--muted);background:var(--card);border:1px solid var(--border);
  padding:8px 10px;margin-bottom:12px;white-space:pre-wrap;
}
.vsk-intent-btn{
  width:100%;padding:11px;font-size:12px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;
  cursor:pointer;margin-top:8px;border:1px solid var(--border);background:var(--card);color:var(--cream);
}
.vsk-intent-btn:hover{border-color:var(--br2)}
.vsk-intent-btn.vsk-intent-beli{background:var(--gold);color:var(--void);border-color:var(--gold)}
.vsk-intent-btn.vsk-intent-beli:hover{opacity:.9}

.vsk-composer{
  border-top:1px solid var(--border);background:var(--surface);
  padding:10px;display:flex;align-items:flex-end;gap:8px;flex-shrink:0;
}
.vsk-composer textarea{
  flex:1;resize:none;background:var(--card);border:1px solid var(--border);color:var(--cream);
  padding:9px 11px;font-size:13.5px;font-family:'DM Sans',sans-serif;max-height:90px;min-height:38px;
}
.vsk-composer textarea:focus{outline:none;border-color:var(--br2)}
.vsk-icon-btn{
  background:none;border:1px solid var(--border);color:var(--muted);
  width:38px;height:38px;flex-shrink:0;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
}
.vsk-icon-btn:hover{color:var(--cream);border-color:var(--br2)}
.vsk-icon-btn svg{width:16px;height:16px;fill:currentColor}
.vsk-icon-btn.vsk-recording{background:var(--red);border-color:var(--red);color:var(--chalk)}
.vsk-send-btn{background:var(--gold);border:1px solid var(--gold);color:var(--void)}
.vsk-send-btn:hover{opacity:.9;color:var(--void)}

.vsk-recording-bar{
  display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--card);
  border:1px solid var(--red);margin-bottom:8px;font-size:12px;color:var(--cream);
}
.vsk-rec-dot{width:8px;height:8px;border-radius:50%;background:var(--red);animation:vsk-pulse 1s infinite}
@keyframes vsk-pulse{0%,100%{opacity:1}50%{opacity:.3}}

.vsk-lightbox{
  position:fixed;inset:0;background:rgba(0,0,0,.85);z-index:9010;
  display:flex;align-items:center;justify-content:center;padding:30px;cursor:zoom-out;
}
.vsk-lightbox img{max-width:100%;max-height:100%}
.vsk-lightbox.vsk-hidden{display:none}

@media(max-width:480px){
  #vsk-chat-panel{
    width:100vw;height:100vh;max-height:100vh;bottom:0;right:0;left:0;top:0;
  }
  #vsk-chat-btn-label{display:none}
  #vsk-chat-btn{padding:0;border:none;background:transparent}
  #vsk-chat-btn-icon{width:44px;height:44px}
}