/* Companaya Chat Widget v1.1.0 — Elementor/theme-hardened */

/* ── RESET + ROOT ── */
.ccw-widget,
.ccw-widget * {
  box-sizing: border-box !important;
  -webkit-box-sizing: border-box !important;
}
.ccw-widget * {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  outline: none !important;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  line-height: normal !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  list-style: none !important;
  float: none !important;
  position: static !important;
}

/* ── WIDGET SHELL ── */
.ccw-widget {
  display: grid !important;
  grid-template-columns: 1fr 280px !important;
  width: 100% !important;
  max-width: 960px !important;
  height: 460px !important;
  margin: 0 auto !important;
  background: #09090b !important;
  border-radius: 16px !important;
  border: 0.5px solid rgba(232,87,63,0.3) !important;
  overflow: hidden !important;
  box-shadow: 0 0 60px rgba(232,87,63,0.08) !important;
  position: relative !important;
}

/* ── LEFT PANEL ── */
.ccw-widget .cl {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  min-height: 0 !important;
  border-right: 0.5px solid rgba(255,255,255,0.06) !important;
  background: #09090b !important;
  height: 460px !important;
}

.ccw-widget .cl-head {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  padding: 11px 15px !important;
  border-bottom: 0.5px solid rgba(255,255,255,0.06) !important;
  flex-shrink: 0 !important;
  background: #09090b !important;
}

.ccw-widget .cl-ico {
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg,#e8573f,#f59b45) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 13px !important;
  color: #fff !important;
  flex-shrink: 0 !important;
}

.ccw-widget .cl-name {
  font-size: 12.5px !important;
  font-weight: 700 !important;
  color: #f4f4f5 !important;
  display: block !important;
}

.ccw-widget .cl-sub {
  font-size: 10px !important;
  color: #52525b !important;
  margin-top: 1px !important;
  display: block !important;
}

.ccw-widget .cl-dot {
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: #4ade80 !important;
  margin-left: auto !important;
  flex-shrink: 0 !important;
  box-shadow: 0 0 5px rgba(74,222,128,.5) !important;
  animation: ccw-pulse 2s infinite !important;
}

/* messages area */
.ccw-widget .cl-msgs {
  flex: 1 !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  padding: 12px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(232,87,63,0.15) transparent !important;
  background: #09090b !important;
}
.ccw-widget .cl-msgs::-webkit-scrollbar { width: 3px !important; }
.ccw-widget .cl-msgs::-webkit-scrollbar-thumb { background: rgba(232,87,63,0.2) !important; border-radius: 2px !important; }

/* message row */
.ccw-widget .cm {
  display: flex !important;
  gap: 7px !important;
  align-items: flex-start !important;
  animation: ccw-in .2s ease !important;
}
.ccw-widget .cm.cm-u {
  flex-direction: row-reverse !important;
  align-self: flex-end !important;
}

@keyframes ccw-in {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes ccw-dot {
  0%,60%,100% { opacity:.3; transform:scale(.8); }
  30%          { opacity:1;  transform:scale(1);  }
}
@keyframes ccw-pulse {
  0%,100% { opacity:1; }
  50%     { opacity:.5; }
}

.ccw-widget .cm-av {
  width: 24px !important;
  height: 24px !important;
  border-radius: 8px !important;
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  margin-top: 1px !important;
  color: #fff !important;
}
.ccw-widget .cm-av.bot {
  background: linear-gradient(135deg,#e8573f,#f59b45) !important;
  font-size: 12px !important;
}
.ccw-widget .cm-av.usr {
  background: #1a1a22 !important;
  border: 0.5px solid rgba(255,255,255,0.08) !important;
  color: #52525b !important;
  font-size: 9px !important;
}

.ccw-widget .cm-wrap {
  max-width: 84% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
}
.ccw-widget .cm.cm-u .cm-wrap {
  align-items: flex-end !important;
}

.ccw-widget .cm-bub {
  padding: 9px 12px !important;
  border-radius: 13px !important;
  font-size: 13px !important;
  line-height: 1.57 !important;
  color: #d4d4d8 !important;
  display: block !important;
}
.ccw-widget .cm .cm-bub {
  background: #18181f !important;
  border: 0.5px solid rgba(255,255,255,0.07) !important;
  border-top-left-radius: 3px !important;
}
.ccw-widget .cm.cm-u .cm-bub {
  background: linear-gradient(135deg,#e8573f,#f59b45) !important;
  color: #fff !important;
  border-top-right-radius: 3px !important;
  border-top-left-radius: 13px !important;
}

/* inline card */
.ccw-widget .cm-card {
  background: #111118 !important;
  border: 0.5px solid rgba(232,87,63,0.3) !important;
  border-radius: 11px !important;
  padding: 11px 12px !important;
  width: 100% !important;
  display: block !important;
}
.ccw-widget .cm-card-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 4px !important;
}
.ccw-widget .cm-card-name {
  font-size: 12.5px !important;
  font-weight: 700 !important;
  color: #f4f4f5 !important;
}
.ccw-widget .cm-card-score {
  font-size: 10px !important;
  font-weight: 600 !important;
  color: #f4f4f5 !important;
  background: rgba(232,87,63,0.1) !important;
  padding: 2px 7px !important;
  border-radius: 8px !important;
}
.ccw-widget .cm-card-desc {
  font-size: 11.5px !important;
  color: #71717a !important;
  line-height: 1.5 !important;
  margin-bottom: 8px !important;
  display: block !important;
}
.ccw-widget .cm-card-btn {
  display: inline-block !important;
  padding: 5px 14px !important;
  background: linear-gradient(135deg,#e8573f,#f59b45) !important;
  border-radius: 7px !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  color: #fff !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

/* category chips */
.ccw-widget .cl-cats {
  padding: 7px 12px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 5px !important;
  border-top: 0.5px solid rgba(255,255,255,0.05) !important;
  flex-shrink: 0 !important;
  background: #09090b !important;
}
.ccw-widget .cat {
  padding: 5px 10px !important;
  background: #111118 !important;
  border: 0.5px solid rgba(232,87,63,0.28) !important;
  border-radius: 15px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  color: #f4f4f5 !important;
  cursor: pointer !important;
  transition: all .15s !important;
  white-space: nowrap !important;
  display: inline-flex !important;
  align-items: center !important;
}
.ccw-widget .cat:hover {
  background: rgba(232,87,63,0.12) !important;
  border-color: rgba(232,87,63,0.5) !important;
}

/* input area */
.ccw-widget .cl-inp {
  padding: 8px 11px !important;
  border-top: 0.5px solid rgba(255,255,255,0.06) !important;
  display: flex !important;
  gap: 7px !important;
  align-items: flex-end !important;
  flex-shrink: 0 !important;
  background: #09090b !important;
}
.ccw-widget .cl-inp-box {
  flex: 1 !important;
  background: #111118 !important;
  border: 0.5px solid rgba(255,255,255,0.08) !important;
  border-radius: 12px !important;
  display: flex !important;
  align-items: center !important;
  padding: 0 12px !important;
  transition: border-color .15s !important;
}
.ccw-widget .cl-inp-box:focus-within {
  border-color: rgba(232,87,63,0.5) !important;
}
.ccw-widget textarea.cl-ta {
  flex: 1 !important;
  background: transparent !important;
  border: none !important;
  outline: none !important;
  color: #d4d4d8 !important;
  font-family: inherit !important;
  font-size: 12.5px !important;
  resize: none !important;
  padding: 9px 0 !important;
  max-height: 65px !important;
  line-height: 1.5 !important;
  box-shadow: none !important;
  width: 100% !important;
  min-height: 0 !important;
}
.ccw-widget textarea.cl-ta::placeholder { color: #3f3f46 !important; }

.ccw-widget .cl-send {
  width: 32px !important;
  height: 32px !important;
  background: linear-gradient(135deg,#e8573f,#f59b45) !important;
  border: none !important;
  border-radius: 9px !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  padding: 0 !important;
}
.ccw-widget .cl-send:disabled { opacity: .4 !important; cursor: not-allowed !important; }
.ccw-widget .cl-send svg {
  width: 13px !important;
  height: 13px !important;
  fill: #fff !important;
  display: block !important;
}

/* typing dots */
.ccw-widget .dots {
  display: flex !important;
  align-items: center !important;
  gap: 3px !important;
  padding: 9px 12px !important;
  background: #18181f !important;
  border: 0.5px solid rgba(255,255,255,0.07) !important;
  border-radius: 13px !important;
  border-top-left-radius: 3px !important;
  width: fit-content !important;
}
.ccw-widget .dots span {
  width: 5px !important;
  height: 5px !important;
  background: #e8573f !important;
  border-radius: 50% !important;
  display: block !important;
  animation: ccw-dot .85s infinite !important;
}
.ccw-widget .dots span:nth-child(2) { animation-delay: .17s !important; }
.ccw-widget .dots span:nth-child(3) { animation-delay: .34s !important; }

/* footer */
.ccw-widget .cl-foot {
  padding: 5px 14px !important;
  border-top: 0.5px solid rgba(255,255,255,0.04) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-shrink: 0 !important;
  background: #09090b !important;
}
.ccw-widget .cl-fl { font-size: 10px !important; color: #3f3f46 !important; }
.ccw-widget .cl-fr {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 10px !important;
  color: #3f3f46 !important;
}
.ccw-widget .cl-frd {
  width: 5px !important;
  height: 5px !important;
  background: #4ade80 !important;
  border-radius: 50% !important;
  box-shadow: 0 0 4px rgba(74,222,128,.4) !important;
  animation: ccw-dot 2s infinite !important;
}

/* ── RIGHT PANEL ── */
.ccw-widget .cr {
  display: flex !important;
  flex-direction: column !important;
  background: #0a0a0e !important;
  overflow: hidden !important;
  min-height: 0 !important;
  height: 460px !important;
}
.ccw-widget .cr-head {
  padding: 11px 13px !important;
  border-bottom: 0.5px solid rgba(255,255,255,0.06) !important;
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  background: #0a0a0e !important;
}
.ccw-widget .cr-title {
  font-size: 10px !important;
  font-weight: 600 !important;
  color: #52525b !important;
  text-transform: uppercase !important;
  letter-spacing: .7px !important;
}
.ccw-widget .cr-badge {
  font-size: 10px !important;
  font-weight: 500 !important;
  color: #f4f4f5 !important;
  background: rgba(232,87,63,0.1) !important;
  padding: 2px 7px !important;
  border-radius: 8px !important;
}
.ccw-widget .cr-body {
  flex: 1 !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  padding: 10px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(232,87,63,0.15) transparent !important;
  background: #0a0a0e !important;
}
.ccw-widget .cr-body::-webkit-scrollbar { width: 3px !important; }
.ccw-widget .cr-body::-webkit-scrollbar-thumb { background: rgba(232,87,63,0.2) !important; border-radius: 2px !important; }

/* quiz */
.ccw-widget .qz-intro {
  font-size: 11px !important;
  color: #52525b !important;
  line-height: 1.6 !important;
  display: block !important;
}
.ccw-widget .qz-q {
  background: #111118 !important;
  border: 0.5px solid rgba(255,255,255,0.07) !important;
  border-radius: 10px !important;
  padding: 11px !important;
}
.ccw-widget .qz-qlabel {
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #f4f4f5 !important;
  margin-bottom: 7px !important;
  display: block !important;
}
.ccw-widget .qz-chips {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 5px !important;
}
.ccw-widget .qz-chip {
  padding: 5px 10px !important;
  background: #18181f !important;
  border: 0.5px solid rgba(232,87,63,0.22) !important;
  border-radius: 13px !important;
  font-size: 11px !important;
  color: #f4f4f5 !important;
  cursor: pointer !important;
  transition: all .15s !important;
  display: inline-flex !important;
  align-items: center !important;
}
.ccw-widget .qz-chip:hover { background: rgba(232,87,63,0.1) !important; border-color: rgba(232,87,63,0.45) !important; }
.ccw-widget .qz-chip.picked { background: rgba(232,87,63,0.18) !important; border-color: #e8573f !important; color: #fff0e8 !important; }

.ccw-widget .qz-nav {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-top: 9px !important;
}
.ccw-widget .qz-prog-dots {
  display: flex !important;
  gap: 5px !important;
}
.ccw-widget .qz-dot {
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,0.1) !important;
  display: block !important;
}
.ccw-widget .qz-dot.active { background: #e8573f !important; }
.ccw-widget .qz-dot.done   { background: rgba(232,87,63,0.4) !important; }
.ccw-widget .qz-skip {
  font-size: 10.5px !important;
  color: #3f3f46 !important;
  cursor: pointer !important;
  text-decoration: underline !important;
  background: none !important;
  border: none !important;
  display: inline !important;
}
.ccw-widget .qz-skip:hover { color: #52525b !important; }

/* result cards */
.ccw-widget .rcard {
  background: #111118 !important;
  border: 0.5px solid rgba(255,255,255,0.07) !important;
  border-radius: 10px !important;
  padding: 10px 11px !important;
  animation: ccw-in .2s ease !important;
  display: block !important;
}
.ccw-widget .rcard.top {
  border-color: rgba(232,87,63,0.4) !important;
  background: #110e1a !important;
}
.ccw-widget .rcard-best {
  font-size: 9px !important;
  font-weight: 600 !important;
  color: #f4f4f5 !important;
  background: rgba(232,87,63,0.12) !important;
  padding: 1px 7px !important;
  border-radius: 7px !important;
  display: inline-block !important;
  margin-bottom: 4px !important;
}
.ccw-widget .rcard-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 3px !important;
}
.ccw-widget .rcard-name { font-size: 12px !important; font-weight: 700 !important; color: #f4f4f5 !important; }
.ccw-widget .rcard-score {
  font-size: 9.5px !important;
  font-weight: 600 !important;
  color: #e8573f !important;
  background: rgba(232,87,63,0.1) !important;
  padding: 1px 6px !important;
  border-radius: 7px !important;
}
.ccw-widget .rcard-reason {
  font-size: 11px !important;
  color: #71717a !important;
  line-height: 1.45 !important;
  margin-bottom: 7px !important;
  display: block !important;
}
.ccw-widget .rcard-btns {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 4px !important;
}
.ccw-widget .rcard-v {
  display: block !important;
  padding: 5px !important;
  background: linear-gradient(135deg,#e8573f,#f59b45) !important;
  border: none !important;
  border-radius: 6px !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
  color: #fff !important;
  text-align: center !important;
  text-decoration: none !important;
  cursor: pointer !important;
}
.ccw-widget .rcard-r {
  display: block !important;
  padding: 5px !important;
  background: transparent !important;
  border: 0.5px solid rgba(232,87,63,0.28) !important;
  border-radius: 6px !important;
  font-size: 10.5px !important;
  font-weight: 500 !important;
  color: #f4f4f5 !important;
  text-align: center !important;
  text-decoration: none !important;
}
.ccw-widget .rcard-r:hover { background: rgba(232,87,63,0.07) !important; }

/* empty state */
.ccw-widget .cr-empty {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  height: 100% !important;
  text-align: center !important;
  gap: 7px !important;
  padding: 16px !important;
}
.ccw-widget .cr-empty-icon { font-size: 24px !important; opacity: .2 !important; }
.ccw-widget .cr-empty-txt  { font-size: 11.5px !important; color: #3f3f46 !important; line-height: 1.7 !important; }

/* ── MOBILE ── */
@media (max-width: 640px) {
  .ccw-widget {
    grid-template-columns: 1fr !important;
    height: auto !important;
    min-height: 460px !important;
  }
  .ccw-widget .cl { height: auto !important; min-height: 460px !important; }
  .ccw-widget .cr { display: none !important; }
}