/* MKOR — Sales meeting agent. Immersive full-bleed chat: warm ember-on-charcoal background with
   drifting coral glows, glassmorphism surfaces, Plus Jakarta Sans, MKOR brand strip.
   Everything scoped under .mkor-sales-chat so it can't clash with the Uncode theme. */
.mkor-sales-chat {
  --ms-coral: #FF6B4A; --ms-coral-2: #ff8c5a; --ms-ember: #e24a2b; --ms-amber: #ffb16b; --ms-rose: #c4564a;
  --ms-trust: #2fcf86;
  --ms-ink: #f5f1ee; --ms-mut: #aa9d97; --ms-glass: rgba(255,255,255,0.05); --ms-line: rgba(255,255,255,0.085);
  /* Full-bleed: break out of the theme container so it's never a centered little box. */
  position: relative; width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw);
  padding: 0; box-sizing: border-box; color: var(--ms-ink);
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  overflow: hidden; isolation: isolate;
}
.mkor-sales-chat * { box-sizing: border-box; }

/* ---- Panel = the fullscreen stage ---- */
.mkor-sales-chat .ms-panel {
  position: relative; display: flex; flex-direction: column; overflow: hidden;
  height: clamp(560px, calc(100vh - 96px), 1080px);
  background:
    radial-gradient(1100px 720px at 14% -8%, rgba(255,107,74,0.20), transparent 60%),
    radial-gradient(950px 640px at 90% 2%, rgba(255,177,107,0.13), transparent 58%),
    radial-gradient(900px 720px at 50% 118%, rgba(226,74,43,0.16), transparent 62%),
    linear-gradient(180deg, #161010 0%, #110c0d 55%, #0c0809 100%);
  animation: msPanelIn 0.55s cubic-bezier(0.2,0.8,0.2,1) both;
}
@keyframes msPanelIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

/* ---------- Ambient orb field behind the glass (warm, living, sleek) ----------
   Two large signature blobs (panel ::before/::after) drift on long organic paths and gently
   breathe; a layer of smaller parallax orbs (.ms-orbs) adds depth. Transform-only + screen blend
   so the glass header/bubbles frost over them. All warm coral/ember/amber — no cold pastels. */
.mkor-sales-chat .ms-panel::before,
.mkor-sales-chat .ms-panel::after {
  content: ''; position: absolute; z-index: 0; width: 48vw; height: 48vw; max-width: 640px; max-height: 640px;
  border-radius: 50%; filter: blur(95px); opacity: 0.44; pointer-events: none;
  mix-blend-mode: screen; will-change: transform;
}
.mkor-sales-chat .ms-panel::before { left: -12vw; top: -10vw; background: radial-gradient(circle at 35% 35%, var(--ms-coral), transparent 66%); animation: msFloatA 30s ease-in-out infinite; }
.mkor-sales-chat .ms-panel::after  { right: -14vw; bottom: -12vw; background: radial-gradient(circle at 35% 35%, var(--ms-ember), transparent 66%); animation: msFloatB 36s ease-in-out infinite; }
@keyframes msFloatA {
  0%   { transform: translate(0,0) scale(1); }
  25%  { transform: translate(7vw,5vw) scale(1.12); }
  50%  { transform: translate(4vw,11vw) scale(1.04); }
  75%  { transform: translate(-3vw,5vw) scale(1.16); }
  100% { transform: translate(0,0) scale(1); }
}
@keyframes msFloatB {
  0%   { transform: translate(0,0) scale(1); }
  25%  { transform: translate(-6vw,-4vw) scale(1.1); }
  50%  { transform: translate(-10vw,2vw) scale(1.18); }
  75%  { transform: translate(-4vw,-5vw) scale(1.05); }
  100% { transform: translate(0,0) scale(1); }
}
.mkor-sales-chat .ms-orbs { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.mkor-sales-chat .ms-orbs i {
  position: absolute; display: block; border-radius: 50%;
  opacity: 0.38; mix-blend-mode: screen; will-change: transform; filter: blur(54px);
}
.mkor-sales-chat .ms-orbs i:nth-child(1) { width: 30vw; height: 30vw; max-width: 360px; max-height: 360px; left: 58%; top: 4%;  background: radial-gradient(circle at 35% 35%, var(--ms-amber), transparent 68%); animation: msOrbA 28s ease-in-out infinite; }
.mkor-sales-chat .ms-orbs i:nth-child(2) { width: 22vw; height: 22vw; max-width: 270px; max-height: 270px; left: 12%; top: 52%; background: radial-gradient(circle at 35% 35%, var(--ms-coral-2), transparent 68%); animation: msOrbB 34s ease-in-out infinite; }
.mkor-sales-chat .ms-orbs i:nth-child(3) { width: 16vw; height: 16vw; max-width: 200px; max-height: 200px; left: 80%; top: 58%; background: radial-gradient(circle at 35% 35%, var(--ms-rose), transparent 70%); animation: msOrbC 24s ease-in-out infinite; filter: blur(44px); }
.mkor-sales-chat .ms-orbs i:nth-child(4) { width: 11vw; height: 11vw; max-width: 140px; max-height: 140px; left: 42%; top: 30%; background: radial-gradient(circle at 35% 35%, var(--ms-coral), transparent 70%); animation: msOrbD 20s ease-in-out infinite; opacity: 0.26; filter: blur(38px); }
@keyframes msOrbA { 0%,100% { transform: translate(0,0) scale(1); } 33% { transform: translate(-7vw,6vw) scale(1.14); } 66% { transform: translate(4vw,-3vw) scale(0.92); } }
@keyframes msOrbB { 0%,100% { transform: translate(0,0) scale(1); } 33% { transform: translate(6vw,-5vw) scale(1.1); } 66% { transform: translate(-3vw,4vw) scale(1.2); } }
@keyframes msOrbC { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(-8vw,-6vw) scale(1.18); } }
@keyframes msOrbD { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(5vw,7vw) scale(0.86); } }

/* ---- Header: ONE glass bar — rep on the left, MKOR logo on the right ---- */
.mkor-sales-chat .ms-head {
  position: relative; z-index: 2; display: flex; align-items: center; gap: 0.85rem;
  padding: 0.9rem clamp(1rem, 4vw, 2.4rem); flex-shrink: 0;
  background: rgba(18,12,12,0.55); backdrop-filter: blur(20px) saturate(140%); -webkit-backdrop-filter: blur(20px) saturate(140%);
  border-bottom: 1px solid rgba(255,255,255,0.07);
}
.mkor-sales-chat .ms-logo {
  height: 20px; width: auto; margin-left: auto; flex: 0 0 auto; align-self: center; opacity: 0.9;
  filter: drop-shadow(0 1px 5px rgba(0,0,0,0.45));
}
.mkor-sales-chat .ms-avatar {
  width: 46px; height: 46px; border-radius: 50%; object-fit: cover; flex: 0 0 auto;
  background: #241716; border: 2px solid transparent;
  box-shadow: 0 0 0 2px rgba(255,107,74,0.6), 0 0 18px -2px rgba(255,107,74,0.5);
}
.mkor-sales-chat .ms-avatar--f { display: grid; place-items: center; font-weight: 800; color: #fff;
  background: linear-gradient(135deg, var(--ms-coral), var(--ms-ember)); }
.mkor-sales-chat .ms-meta { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; gap: 3px; }
.mkor-sales-chat .ms-title { font-weight: 700; font-size: 1.12rem; letter-spacing: -0.015em; color: #fff; }
.mkor-sales-chat .ms-online { display: inline-flex; align-items: center; gap: 0.45rem; font-size: 0.78rem; color: var(--ms-mut); font-weight: 500; }
.mkor-sales-chat .ms-online i { width: 8px; height: 8px; border-radius: 50%; background: var(--ms-trust); flex: 0 0 auto;
  box-shadow: 0 0 10px var(--ms-trust); animation: msLive 2.4s ease-out infinite; }
@keyframes msLive { 0% { box-shadow: 0 0 0 0 rgba(47,207,134,0.6), 0 0 10px var(--ms-trust); } 70% { box-shadow: 0 0 0 8px rgba(47,207,134,0), 0 0 10px var(--ms-trust); } 100% { box-shadow: 0 0 0 0 rgba(47,207,134,0), 0 0 10px var(--ms-trust); } }

/* ---- Conversation (full-bleed scroll, centered column) ---- */
.mkor-sales-chat .ms-log {
  position: relative; z-index: 1; flex: 1 1 auto; min-height: 0; overflow-y: auto;
  padding: clamp(1.1rem, 3vw, 2rem) clamp(0.8rem, 4vw, 2rem); display: flex; flex-direction: column; gap: 0.7rem;
  overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,0.18) transparent;
}
.mkor-sales-chat .ms-log::-webkit-scrollbar { width: 9px; }
.mkor-sales-chat .ms-log::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.14); border-radius: 9px; }
.mkor-sales-chat .ms-row {
  display: flex; align-items: flex-end; gap: 0.6rem; width: 100%; max-width: 760px; margin: 0 auto;
  animation: msRowIn 0.36s cubic-bezier(0.2,0.7,0.2,1) both;
}
@keyframes msRowIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.mkor-sales-chat .ms-row--user { justify-content: flex-end; }
.mkor-sales-chat .ms-row-av { width: 28px; height: 28px; align-self: flex-end; box-shadow: 0 0 0 1.5px rgba(255,107,74,0.45); border-width: 1.5px; }
.mkor-sales-chat .ms-msg { max-width: 78%; padding: 0.74rem 0.98rem; border-radius: 16px; font-size: 0.97rem; line-height: 1.55; word-wrap: break-word; }
.mkor-sales-chat .ms-msg p { margin: 0 0 0.5rem; } .mkor-sales-chat .ms-msg p:last-child { margin: 0; }
.mkor-sales-chat .ms-msg--bot {
  background: var(--ms-glass); color: var(--ms-ink); border: 1px solid var(--ms-line);
  border-bottom-left-radius: 6px; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 8px 30px -18px rgba(0,0,0,0.8);
}
.mkor-sales-chat .ms-msg--user {
  background: linear-gradient(135deg, var(--ms-coral), var(--ms-coral-2)); color: #2a1209; font-weight: 600;
  border-bottom-right-radius: 6px; box-shadow: 0 10px 30px -10px rgba(255,107,74,0.55), inset 0 1px 0 rgba(255,255,255,0.3);
}
.mkor-sales-chat .ms-msg--bot a { color: #ffb59f; text-decoration: underline; text-underline-offset: 2px; }
.mkor-sales-chat .ms-msg--bot strong { font-weight: 700; color: #fff; }

/* ---- Thinking dots ---- */
.mkor-sales-chat .ms-think { display: inline-flex; gap: 6px; align-items: center; padding: 0.85rem 1rem; }
.mkor-sales-chat .ms-think span { width: 7px; height: 7px; border-radius: 50%; background: var(--ms-coral); box-shadow: 0 0 8px var(--ms-coral); animation: msBlink 1.2s infinite ease-in-out; }
.mkor-sales-chat .ms-think span:nth-child(2) { animation-delay: 0.18s; background: var(--ms-amber); box-shadow: 0 0 8px var(--ms-amber); }
.mkor-sales-chat .ms-think span:nth-child(3) { animation-delay: 0.36s; background: var(--ms-ember); box-shadow: 0 0 8px var(--ms-ember); }
@keyframes msBlink { 0%, 80%, 100% { opacity: 0.35; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-3px); } }

/* ---- Composer (glass, centered) ---- */
.mkor-sales-chat .ms-form {
  position: relative; z-index: 2; display: flex; align-items: flex-end; gap: 0.6rem; flex-shrink: 0;
  width: 100%; max-width: 792px; margin: 0 auto; padding: 0.9rem clamp(0.8rem, 4vw, 1rem) 0.6rem;
}
.mkor-sales-chat .ms-input {
  flex: 1; resize: none; margin: 0; border-radius: 16px; padding: 0.8rem 1rem;
  font-family: inherit; font-size: 16px; line-height: 1.45; max-height: 130px; overflow-y: hidden;
  color: var(--ms-ink); background: rgba(255,255,255,0.06); border: 1px solid var(--ms-line);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}
.mkor-sales-chat .ms-input::placeholder { color: var(--ms-mut); }
.mkor-sales-chat .ms-input:focus { outline: none; border-color: rgba(255,107,74,0.6); background: rgba(255,255,255,0.09);
  box-shadow: 0 0 0 3px rgba(255,107,74,0.18), 0 0 22px -6px rgba(255,107,74,0.5); }
.mkor-sales-chat .ms-send {
  position: relative; flex-shrink: 0; width: 50px; height: 50px; margin: 0; padding: 0 0 0 2px;
  border: none; border-radius: 16px; cursor: pointer; color: #2a1209; font-size: 1.2rem; line-height: 1;
  display: grid; place-items: center; background: linear-gradient(135deg, var(--ms-coral), var(--ms-coral-2));
  box-shadow: 0 10px 26px -8px rgba(255,107,74,0.7), inset 0 1px 0 rgba(255,255,255,0.35);
  transition: transform 0.12s ease, box-shadow 0.2s ease, filter 0.15s ease;
}
.mkor-sales-chat .ms-send:hover { filter: brightness(1.06); box-shadow: 0 14px 34px -8px rgba(255,107,74,0.85); }
.mkor-sales-chat .ms-send:active { transform: scale(0.93); }
.mkor-sales-chat .ms-send.is-busy { cursor: default; color: transparent; box-shadow: none; padding: 0; }
.mkor-sales-chat .ms-send.is-busy::after { content: ''; position: absolute; inset: 0; margin: auto; width: 20px; height: 20px;
  border: 2px solid rgba(42,18,9,0.4); border-top-color: #2a1209; border-radius: 50%; animation: msSpin 0.7s linear infinite; }
@keyframes msSpin { to { transform: rotate(360deg); } }
.mkor-sales-chat .ms-disc { position: relative; z-index: 2; margin: 0; padding: 0.2rem 1rem 0.95rem; font-size: 0.72rem; color: var(--ms-mut); text-align: center; font-weight: 500; }

/* ---- Mobile ---- */
@media (max-width: 600px) {
  .mkor-sales-chat .ms-panel { height: calc(100dvh - 64px); }
  .mkor-sales-chat .ms-msg { max-width: 88%; font-size: 0.95rem; }
  .mkor-sales-chat .ms-title { font-size: 1.02rem; }
  .mkor-sales-chat .ms-logo { height: 17px; }
}

/* ---- Reduced motion ---- */
@media (prefers-reduced-motion: reduce) {
  .mkor-sales-chat .ms-panel, .mkor-sales-chat .ms-row { animation: none; }
  .mkor-sales-chat .ms-panel::before, .mkor-sales-chat .ms-panel::after, .mkor-sales-chat .ms-orbs i,
  .mkor-sales-chat .ms-online i, .mkor-sales-chat .ms-think span, .mkor-sales-chat .ms-send.is-busy::after { animation: none; }
}