/* South Cross Logistics - Live Chat Widget */
#scl-chat-wrap, #scl-chat-wrap * { box-sizing: border-box; }
#scl-chat-wrap {
  position: fixed; right: 22px; bottom: 22px; z-index: 99999;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
#scl-chat-toggle {
  width: 60px; height: 60px; border-radius: 50%; border: none; cursor: pointer;
  background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
  color: #fff; font-size: 26px; box-shadow: 0 6px 20px rgba(0,0,0,0.25);
  display: flex; align-items: center; justify-content: center; transition: transform .15s ease;
}
#scl-chat-toggle:hover { transform: scale(1.06); }
#scl-chat-toggle .scl-badge {
  position: absolute; top: -4px; right: -4px; min-width: 20px; height: 20px; padding: 0 5px;
  background: #e53935; color: #fff; border-radius: 10px; font-size: 12px; line-height: 20px;
  text-align: center; display: none;
}
#scl-chat-panel {
  position: absolute; right: 0; bottom: 74px; width: 340px; max-width: calc(100vw - 30px);
  height: 460px; max-height: calc(100vh - 120px); background: #fff; border-radius: 14px;
  box-shadow: 0 12px 40px rgba(0,0,0,0.28); display: none; flex-direction: column; overflow: hidden;
}
#scl-chat-panel.scl-open { display: flex; }
.scl-head {
  background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%); color: #fff; padding: 16px 18px;
}
.scl-head h3 { margin: 0; font-size: 16px; font-weight: 600; }
.scl-head p { margin: 3px 0 0; font-size: 12px; opacity: .8; }
.scl-head .scl-close {
  position: absolute; top: 14px; right: 16px; background: none; border: none; color: #fff;
  font-size: 20px; cursor: pointer; opacity: .85;
}
.scl-body { flex: 1; overflow-y: auto; padding: 14px; background: #f5f7fa; }
.scl-msg { max-width: 80%; margin-bottom: 10px; padding: 9px 12px; border-radius: 12px; font-size: 14px; line-height: 1.4; word-wrap: break-word; }
.scl-msg.visitor { margin-left: auto; background: #f5a623; color: #1a1a2e; border-bottom-right-radius: 3px; }
.scl-msg.admin { margin-right: auto; background: #fff; color: #222; border: 1px solid #e3e7ee; border-bottom-left-radius: 3px; }
.scl-msg .scl-time { display: block; font-size: 10px; opacity: .6; margin-top: 3px; }
.scl-foot { border-top: 1px solid #e3e7ee; padding: 10px; background: #fff; }
.scl-form-row { display: flex; gap: 8px; }
.scl-foot input, .scl-foot textarea {
  width: 100%; border: 1px solid #d6dbe5; border-radius: 8px; padding: 9px 11px; font-size: 14px;
  font-family: inherit; resize: none; outline: none;
}
.scl-foot input:focus, .scl-foot textarea:focus { border-color: #f5a623; }
.scl-foot button {
  border: none; background: #1a1a2e; color: #fff; border-radius: 8px; padding: 0 16px; cursor: pointer;
  font-size: 14px; font-weight: 600;
}
.scl-foot button:disabled { opacity: .5; cursor: default; }
.scl-prechat { padding: 18px 14px; }
.scl-prechat label { display: block; font-size: 13px; color: #555; margin: 10px 0 4px; font-weight: 500; }
.scl-prechat .scl-start { width: 100%; margin-top: 14px; padding: 10px; }
.scl-note { font-size: 11px; color: #888; text-align: center; padding: 6px 0 0; }
.scl-empty { text-align: center; color: #999; font-size: 13px; margin-top: 30px; }