
.wplm2-root{
  position:fixed;
  bottom:var(--wplm2-offset-bottom,20px);
  z-index:99999;
  font-family:Arial,sans-serif;
}
.wplm2-root.side-right{right:var(--wplm2-offset-side,20px);left:auto}
.wplm2-root.side-left{left:var(--wplm2-offset-side,20px);right:auto}

.wplm2-root .wplm2-toggle{
  background:var(--wplm2-launcher-bg,#111827);
  color:var(--wplm2-launcher-text,#fff);
  border:0;
  border-radius:12px;
  padding:14px 18px;
  cursor:pointer;
  font-weight:700;
  box-shadow:0 10px 30px rgba(0,0,0,.18);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1.2;
  position:relative;
}

.wplm2-root .wplm2-toggle.is-circle{
  width:var(--wplm2-launcher-size,84px) !important;
  height:var(--wplm2-launcher-size,84px) !important;
  min-width:var(--wplm2-launcher-size,84px) !important;
  min-height:var(--wplm2-launcher-size,84px) !important;
  max-width:var(--wplm2-launcher-size,84px) !important;
  max-height:var(--wplm2-launcher-size,84px) !important;
  padding:0 !important;
  border-radius:50% !important;
  overflow:visible !important;
}

.wplm2-root .wplm2-toggle.has-image{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  padding:0 !important;
}

.wplm2-root .wplm2-toggle-image-wrap{
  position:relative !important;
  display:block !important;
  width:var(--wplm2-launcher-size,84px) !important;
  height:var(--wplm2-launcher-size,84px) !important;
  min-width:var(--wplm2-launcher-size,84px) !important;
  min-height:var(--wplm2-launcher-size,84px) !important;
  max-width:var(--wplm2-launcher-size,84px) !important;
  max-height:var(--wplm2-launcher-size,84px) !important;
  overflow:visible !important;
}

.wplm2-root .wplm2-toggle-image{
  display:block !important;
  width:var(--wplm2-launcher-size,84px) !important;
  height:var(--wplm2-launcher-size,84px) !important;
  min-width:var(--wplm2-launcher-size,84px) !important;
  min-height:var(--wplm2-launcher-size,84px) !important;
  max-width:var(--wplm2-launcher-size,84px) !important;
  max-height:var(--wplm2-launcher-size,84px) !important;
  object-fit:cover !important;
  object-position:center center !important;
  border-radius:50% !important;
  box-sizing:border-box !important;
  border:var(--wplm2-launcher-border,4px) solid #ffffff !important;
  box-shadow:0 10px 30px rgba(0,0,0,.18) !important;
  overflow:hidden !important;
}

.wplm2-root .wplm2-online-dot{
  position:absolute !important;
  left:4px !important;
  top:4px !important;
  width:var(--wplm2-online-dot-size,22px) !important;
  height:var(--wplm2-online-dot-size,22px) !important;
  border-radius:999px !important;
  background:#5dd100 !important;
  box-shadow:0 2px 8px rgba(0,0,0,.16) !important;
  animation:wplm2PulseDot 1.8s infinite ease-out !important;
  z-index:5 !important;
  border:none !important;
}

.wplm2-root .wplm2-online-dot::before{
  content:'' !important;
  position:absolute !important;
  left:50% !important;
  top:50% !important;
  width:100% !important;
  height:100% !important;
  border-radius:999px !important;
  background:rgba(93,209,0,.45) !important;
  transform:translate(-50%,-50%) !important;
  animation:wplm2PulseRing 1.8s infinite ease-out !important;
  z-index:-1 !important;
}

@keyframes wplm2PulseDot{
  0%,100%{transform:scale(1)}
  50%{transform:scale(1.08)}
}
@keyframes wplm2PulseRing{
  0%{transform:translate(-50%,-50%) scale(1);opacity:.75}
  70%{transform:translate(-50%,-50%) scale(2.2);opacity:0}
  100%{transform:translate(-50%,-50%) scale(2.2);opacity:0}
}

.wplm2-box{
  width:340px;
  max-width:calc(100vw - 20px);
  background:var(--wplm2-panel-bg,#fff);
  border:1px solid #dcdcdc;
  border-radius:16px;
  box-shadow:0 10px 30px rgba(0,0,0,.15);
  overflow:hidden;
  margin-top:10px;
}
.wplm2-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:12px 14px;
  background:#f7f7f9;
  border-bottom:1px solid #ececf1;
}
.wplm2-close{
  border:0;
  background:transparent;
  font-size:24px;
  line-height:1;
  cursor:pointer;
}
.wplm2-notice{
  display:none;
  padding:10px 14px 0;
  font-size:13px;
}
.wplm2-messages{
  height:220px;
  overflow-y:auto;
  padding:12px;
  background:transparent;
}
.wplm2-msg{
  margin-bottom:10px;
  padding:10px 12px;
  background:#eef2ff;
  border-radius:12px;
}
.wplm2-meta{
  display:flex;
  justify-content:space-between;
  gap:8px;
  font-size:12px;
  opacity:.8;
  margin-bottom:6px;
}
.wplm2-form{
  display:grid;
  gap:8px;
  padding:12px;
  border-top:1px solid #ececf1;
}
.wplm2-form input,
.wplm2-form textarea{
  width:100%;
  padding:10px 12px;
  border:1px solid #d0d5dd;
  border-radius:10px;
  font:inherit;
  box-sizing:border-box;
}
.wplm2-form textarea{
  min-height:90px;
  resize:vertical;
}
.wplm2-send{
  border:0;
  border-radius:var(--wplm2-send-radius,10px);
  padding:0 14px;
  height:var(--wplm2-send-height,44px);
  background:var(--wplm2-send-bg,#111827);
  color:#fff;
  font-weight:700;
  cursor:pointer;
}
.wplm2-no-access{
  padding:16px;
  border:1px solid #ddd;
  background:#fff;
  border-radius:12px;
}

.wplm2op-panel{
  border:1px solid #ddd;
  border-radius:18px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 10px 30px rgba(0,0,0,.06);
  font-family:Arial,sans-serif;
}
.wplm2op-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:18px 20px;
  border-bottom:1px solid #e5e7eb;
  background:#f8fafc;
  gap:16px;
}
.wplm2op-title{
  font-size:20px;
  font-weight:700;
}
.wplm2op-active{
  font-size:14px;
  color:#666;
}
.wplm2op-body{
  display:grid;
  grid-template-columns:320px 1fr;
  min-height:640px;
}
.wplm2op-sidebar{
  border-right:1px solid #e5e7eb;
  background:#fcfcfd;
}
.wplm2op-rooms{
  height:100%;
  overflow:auto;
}
.wplm2op-room{
  display:block;
  width:100%;
  text-align:left;
  padding:14px 16px;
  border:0;
  border-bottom:1px solid #eee;
  background:#fff;
  cursor:pointer;
}
.wplm2op-room.is-active{
  background:#eef2ff;
}
.wplm2op-room-title{
  font-weight:700;
  margin-bottom:6px;
}
.wplm2op-room-email,
.wplm2op-room-phone,
.wplm2op-room-time{
  font-size:12px;
  color:#666;
  margin-bottom:4px;
}
.wplm2op-room-last{
  font-size:13px;
  color:#333;
}
.wplm2op-main{
  display:grid;
  grid-template-rows:auto 1fr auto;
  min-height:640px;
}
.wplm2op-notice{
  display:none;
  padding:10px 16px;
  font-size:14px;
}
.wplm2op-messages{
  padding:16px;
  overflow:auto;
  background:#f9fafb;
  min-height:360px;
}
.wplm2op-msg{
  margin-bottom:12px;
  padding:12px 14px;
  border-radius:14px;
  background:#e8eefc;
}
.wplm2op-msg.is-operator{
  background:#dbeafe;
}
.wplm2op-msg-meta{
  display:flex;
  justify-content:space-between;
  gap:8px;
  font-size:12px;
  color:#666;
  margin-bottom:6px;
}
.wplm2op-form{
  padding:16px;
  border-top:1px solid #e5e7eb;
  background:#fff;
}
.wplm2op-textarea{
  width:100%;
  min-height:120px;
  border:1px solid #d0d5dd;
  border-radius:12px;
  padding:12px 14px;
  font:inherit;
  resize:vertical;
  box-sizing:border-box;
}
.wplm2op-actions{
  display:flex;
  gap:10px;
  margin-top:10px;
}
.wplm2op-send,
.wplm2op-refresh,
.wplm2op-delete{
  border:0;
  border-radius:10px;
  padding:12px 16px;
  font-weight:700;
  cursor:pointer;
}
.wplm2op-send{background:#111827;color:#fff}
.wplm2op-refresh{background:#e5e7eb;color:#111827}
.wplm2op-delete{background:#b42318;color:#fff}
.wplm2op-empty{padding:18px;color:#666}

@media (max-width:900px){
  .wplm2op-body{grid-template-columns:1fr}
  .wplm2op-sidebar{border-right:0;border-bottom:1px solid #e5e7eb;max-height:240px}
  .wplm2op-header{flex-direction:column;align-items:flex-start}
}
@media (max-width:480px){
  .wplm2-root.side-right{right:10px}
  .wplm2-root.side-left{left:10px}
  .wplm2-box{width:calc(100vw - 20px)}
}


@media (max-width:1024px){
  .wplm2-root{
    bottom:var(--wplm2-offset-bottom-tablet,var(--wplm2-offset-bottom,20px));
  }
  .wplm2-root.side-right{right:var(--wplm2-offset-side-tablet,var(--wplm2-offset-side,20px))}
  .wplm2-root.side-left{left:var(--wplm2-offset-side-tablet,var(--wplm2-offset-side,20px))}
  .wplm2-root .wplm2-toggle.is-circle,
  .wplm2-root .wplm2-toggle.has-image,
  .wplm2-root .wplm2-toggle-image-wrap,
  .wplm2-root .wplm2-toggle-image{
    width:var(--wplm2-launcher-size-tablet,var(--wplm2-launcher-size,84px)) !important;
    height:var(--wplm2-launcher-size-tablet,var(--wplm2-launcher-size,84px)) !important;
    min-width:var(--wplm2-launcher-size-tablet,var(--wplm2-launcher-size,84px)) !important;
    min-height:var(--wplm2-launcher-size-tablet,var(--wplm2-launcher-size,84px)) !important;
    max-width:var(--wplm2-launcher-size-tablet,var(--wplm2-launcher-size,84px)) !important;
    max-height:var(--wplm2-launcher-size-tablet,var(--wplm2-launcher-size,84px)) !important;
  }
  .wplm2-send{height:var(--wplm2-send-height-tablet,var(--wplm2-send-height,44px))}
}
@media (max-width:767px){
  .wplm2-root{
    bottom:var(--wplm2-offset-bottom-mobile,var(--wplm2-offset-bottom-tablet,var(--wplm2-offset-bottom,20px)));
  }
  .wplm2-root.side-right{right:var(--wplm2-offset-side-mobile,var(--wplm2-offset-side-tablet,var(--wplm2-offset-side,20px)))}
  .wplm2-root.side-left{left:var(--wplm2-offset-side-mobile,var(--wplm2-offset-side-tablet,var(--wplm2-offset-side,20px)))}
  .wplm2-root .wplm2-toggle.is-circle,
  .wplm2-root .wplm2-toggle.has-image,
  .wplm2-root .wplm2-toggle-image-wrap,
  .wplm2-root .wplm2-toggle-image{
    width:var(--wplm2-launcher-size-mobile,var(--wplm2-launcher-size-tablet,var(--wplm2-launcher-size,84px))) !important;
    height:var(--wplm2-launcher-size-mobile,var(--wplm2-launcher-size-tablet,var(--wplm2-launcher-size,84px))) !important;
    min-width:var(--wplm2-launcher-size-mobile,var(--wplm2-launcher-size-tablet,var(--wplm2-launcher-size,84px))) !important;
    min-height:var(--wplm2-launcher-size-mobile,var(--wplm2-launcher-size-tablet,var(--wplm2-launcher-size,84px))) !important;
    max-width:var(--wplm2-launcher-size-mobile,var(--wplm2-launcher-size-tablet,var(--wplm2-launcher-size,84px))) !important;
    max-height:var(--wplm2-launcher-size-mobile,var(--wplm2-launcher-size-tablet,var(--wplm2-launcher-size,84px))) !important;
  }
  .wplm2-send{height:var(--wplm2-send-height-mobile,var(--wplm2-send-height-tablet,var(--wplm2-send-height,44px)))}
}
