/* CKM Canlı Destek widget v2 — sol-alt yüzen buton + sohbet kartı. Tema: navy/mavi. */
.ckm-cd-root{
  position:fixed; left:16px; bottom:16px; z-index:99997;
  display:flex; flex-direction:column; align-items:flex-start; gap:10px;
  font-family:-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}

/* --- Yüzen buton (headset logosu + yazı) --- */
.ckm-cd-fab{
  display:inline-flex; align-items:center; gap:8px;
  background:linear-gradient(135deg,#2563eb,#1d4ed8); color:#fff;
  border:0; border-radius:999px; padding:11px 17px 11px 14px;
  font-size:14.5px; font-weight:700; cursor:pointer; line-height:1;
  box-shadow:0 6px 20px rgba(37,99,235,.42); position:relative;
  transition:transform .15s ease, box-shadow .15s ease;
}
.ckm-cd-fab:hover{ transform:translateY(-2px); box-shadow:0 9px 26px rgba(37,99,235,.5); }
.ckm-cd-fab:active{ transform:translateY(0); }
.ckm-cd-fab__ic{ display:inline-flex; }
.ckm-cd-fab__ic svg{ display:block; }
.ckm-cd-fab__tx{ white-space:nowrap; }
.ckm-cd-fab__dot{
  position:absolute; top:-3px; right:-3px; width:14px; height:14px;
  background:#ef4444; border:2px solid #fff; border-radius:50%; animation:ckmCdPulse 1.4s infinite;
}
@keyframes ckmCdPulse{0%{box-shadow:0 0 0 0 rgba(239,68,68,.6)}70%{box-shadow:0 0 0 7px rgba(239,68,68,0)}100%{box-shadow:0 0 0 0 rgba(239,68,68,0)}}
.ckm-cd-root.is-open .ckm-cd-fab{ display:none; }

/* --- Panel --- */
.ckm-cd-panel{
  width:360px; max-width:calc(100vw - 32px); max-height:min(74vh,560px);
  background:#fff; border-radius:16px; overflow:hidden;
  box-shadow:0 18px 50px rgba(15,27,53,.28), 0 2px 8px rgba(15,27,53,.12);
  display:flex; flex-direction:column; animation:ckmCdIn .18s ease-out;
}
@keyframes ckmCdIn{from{opacity:0; transform:translateY(12px) scale(.98)}to{opacity:1; transform:none}}

.ckm-cd-hd{
  background:linear-gradient(135deg,#0f1b35,#1e293b); color:#fff;
  padding:12px 12px 12px 14px; display:flex; align-items:center; gap:10px; flex:0 0 auto;
}
.ckm-cd-hd__ic{ display:inline-flex; opacity:.95; flex:0 0 auto; }
.ckm-cd-hd__tt{ display:flex; flex-direction:column; flex:1; min-width:0; }
.ckm-cd-hd__t{ font-size:15px; font-weight:800; line-height:1.1; }
.ckm-cd-hd__s{ font-size:11px; opacity:.68; margin-top:2px; }
.ckm-cd-hd__end{ background:rgba(239,68,68,.16); border:1px solid rgba(239,68,68,.4); color:#fecaca; border-radius:8px; padding:5px 9px; font-size:11.5px; font-weight:700; cursor:pointer; flex:0 0 auto; }
.ckm-cd-hd__end:hover{ background:rgba(239,68,68,.3); color:#fff; }
.ckm-cd-hd__min{ width:30px; height:30px; background:rgba(255,255,255,.12); border:0; color:#fff; border-radius:8px; font-size:20px; line-height:1; cursor:pointer; flex:0 0 auto; display:flex; align-items:center; justify-content:center; }
.ckm-cd-hd__min:hover{ background:rgba(255,255,255,.22); }

.ckm-cd-body{ flex:1; display:flex; flex-direction:column; min-height:0; }
.ckm-cd-chat{ flex:1; display:flex; flex-direction:column; min-height:0; }

/* --- Kapı --- */
.ckm-cd-gate{ padding:16px; display:flex; flex-direction:column; gap:11px; overflow-y:auto; }
.ckm-cd-gate__lead{ margin:0; font-size:13.5px; color:#475569; line-height:1.5; }
.ckm-cd-gate label{ display:flex; flex-direction:column; gap:5px; font-size:12.5px; font-weight:700; color:#0f1b35; }
.ckm-cd-gate input, .ckm-cd-gate textarea{ border:1.5px solid #e2e8f0; border-radius:10px; padding:10px 12px; font:inherit; font-size:16px; font-weight:500; color:#0f1b35; background:#f8fafc; }
.ckm-cd-gate input:focus, .ckm-cd-gate textarea:focus{ outline:none; border-color:#2563eb; background:#fff; }
.ckm-cd-gate textarea{ resize:none; }
.ckm-cd-gate__go{ background:linear-gradient(135deg,#16a34a,#15803d); color:#fff; border:0; border-radius:10px; padding:12px; font-size:15px; font-weight:800; cursor:pointer; margin-top:2px; }
.ckm-cd-gate__go:hover{ filter:brightness(1.05); }
.ckm-cd-gate__go:disabled{ opacity:.6; cursor:default; }
.ckm-cd-gate__kv{ margin:0; font-size:10.5px; color:#94a3b8; text-align:center; }
.ckm-cd-err{ background:#fef2f2; border:1px solid #fecaca; color:#b91c1c; border-radius:8px; padding:8px 11px; font-size:12.5px; }

/* --- Sohbet --- */
.ckm-cd-msgs{ flex:1; overflow-y:auto; padding:14px; display:flex; flex-direction:column; gap:8px; background:#f1f5f9; min-height:150px; }
.ckm-cd-m{ max-width:82%; padding:8px 12px; border-radius:13px; font-size:13.5px; line-height:1.42; white-space:pre-wrap; word-break:break-word; box-shadow:0 1px 1px rgba(15,27,53,.05); }
.ckm-cd-m--visitor{ align-self:flex-end; background:#2563eb; color:#fff; border-bottom-right-radius:4px; }
.ckm-cd-m--admin{ align-self:flex-start; background:#fff; color:#0f1b35; border:1px solid #e2e8f0; border-bottom-left-radius:4px; }
.ckm-cd-m--auto{ align-self:flex-start; background:#ecfdf5; color:#065f46; border:1px solid #a7f3d0; border-bottom-left-radius:4px; }
.ckm-cd-m--system{ align-self:center; background:#e2e8f0; color:#64748b; font-size:11.5px; text-align:center; }
.ckm-cd-m__t{ display:block; font-size:9.5px; opacity:.65; margin-top:3px; text-align:right; }

.ckm-cd-typing{ padding:2px 16px 6px; font-size:11.5px; color:#64748b; background:#f1f5f9; display:flex; align-items:center; gap:3px; }
.ckm-cd-typing span{ width:5px; height:5px; border-radius:50%; background:#94a3b8; display:inline-block; animation:ckmCdBlink 1.2s infinite; }
.ckm-cd-typing span:nth-child(2){ animation-delay:.2s; } .ckm-cd-typing span:nth-child(3){ animation-delay:.4s; margin-right:5px; }
@keyframes ckmCdBlink{0%,60%,100%{opacity:.25}30%{opacity:1}}

.ckm-cd-faqs{ display:flex; flex-wrap:wrap; gap:6px; padding:10px 12px; border-top:1px solid #e2e8f0; background:#fff; max-height:118px; overflow-y:auto; }
.ckm-cd-faq{ background:#eff6ff; border:1px solid #bfdbfe; color:#1d4ed8; border-radius:999px; padding:6px 11px; font-size:12px; font-weight:600; cursor:pointer; line-height:1.2; }
.ckm-cd-faq:hover{ background:#dbeafe; }

.ckm-cd-input{ display:flex; gap:8px; padding:10px; border-top:1px solid #e2e8f0; background:#fff; align-items:flex-end; }
.ckm-cd-input textarea{ flex:1; border:1.5px solid #e2e8f0; border-radius:12px; padding:9px 12px; font:inherit; font-size:16px; resize:none; height:42px; max-height:90px; background:#f8fafc; color:#0f1b35; }
.ckm-cd-input textarea:focus{ outline:none; border-color:#2563eb; background:#fff; }
.ckm-cd-input button{ flex:0 0 auto; width:40px; height:40px; border-radius:50%; background:#2563eb; color:#fff; border:0; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.ckm-cd-input button:hover{ background:#1d4ed8; }

/* --- Sonlandı ekranı + puanlama --- */
.ckm-cd-ended{ padding:14px 16px 16px; border-top:1px solid #e2e8f0; background:#fff; text-align:center; }
.ckm-cd-ended__t{ font-size:13px; color:#334155; font-weight:600; margin-bottom:8px; }
.ckm-cd-stars{ display:flex; justify-content:center; gap:4px; margin-bottom:12px; }
.ckm-cd-stars button{ background:none; border:0; font-size:26px; line-height:1; color:#cbd5e1; cursor:pointer; padding:0 2px; transition:color .1s; }
.ckm-cd-stars button:hover, .ckm-cd-stars button.on{ color:#f59e0b; }
.ckm-cd-new{ background:#0f1b35; color:#fff; border:0; border-radius:10px; padding:10px 18px; font-size:13.5px; font-weight:700; cursor:pointer; }
.ckm-cd-new:hover{ background:#1e293b; }

@media (max-width:420px){
  .ckm-cd-root{ left:12px; }
  .ckm-cd-fab{ padding:10px 14px 10px 12px; font-size:13.5px; }
  .ckm-cd-panel{ width:calc(100vw - 24px); }
}