/* MC Assistant chat window. Everything is scoped under .mc-ai so the theme is not affected (and vice versa).
   Mind Center chat window. Fonts Lato (text) and Playfair Display (title), as on the site theme.
   Colours come from the Mind Center theme's own CSS variables (secondary blue and skin green), with #09B8E2 / #b4d251
   as fallbacks. Blue backgrounds carry WHITE, bold text with a soft shadow.
   White on the green is too faint (1.9:1), so the green button carries a navy icon. */
.mc-ai {
  --mc-brand: var(--prt-secondary-bg, #09B8E2);     /* header, launcher, visitor messages – white text */
  --mc-brand-2: #09B8E2;   /* header (same blue – no gradient) */
  --mc-on-shadow: 0 1px 2px rgba(0, 40, 60, .45);
  --mc-blue: #19BAD4;      /* bright blue accents: borders, focus ring */
  --mc-blue-2: #09B8E2;
  --mc-green: var(--prt-skincolor-bg, #b4d251);    /* green accents: header stripe, send button, icons */
  --mc-on-brand: #ffffff;
  --mc-ink: #242864;       /* links and text on green (site heading colour) */
  --mc-text: #2f3542;
  --mc-muted: #6a6b76;
  --mc-line: #e1e8ec;
  --mc-bg: #ffffff;
  --mc-soft: #f4fafb;
  --mc-bottom: 90px;   /* above the theme's scroll-to-top arrow */
  position: fixed;
  bottom: var(--mc-bottom);
  right: 24px;
  z-index: 99990;
  font-family: "Lato", Tahoma, Geneva, sans-serif;
  font-size: 15px;
  line-height: 1.5;
  color: var(--mc-text);
}
.mc-ai[data-pos="left"] { right: auto; left: 24px; }
.mc-ai *, .mc-ai *::before, .mc-ai *::after { box-sizing: border-box; }
.mc-ai [hidden] { display: none !important; }
.mc-ai button { font: inherit; color: inherit; margin: 0; text-transform: none; letter-spacing: normal; box-shadow: none; min-height: 0; }
.mc-ai svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.mc-ai .mc-ai-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.mc-ai button:focus-visible, .mc-ai a:focus-visible, .mc-ai textarea:focus-visible { outline: 3px solid var(--mc-ink); outline-offset: 2px; }

/* Launcher */
.mc-ai-launcher {
  display: flex; align-items: center; gap: 8px; margin-left: auto;
  height: 52px; padding: 0 20px 0 16px; border: 0; border-radius: 26px; cursor: pointer;
  background: var(--mc-brand); color: var(--mc-on-brand) !important; font-weight: 700; font-size: 15.5px; text-shadow: var(--mc-on-shadow);
  box-shadow: 0 6px 20px rgba(9, 60, 80, .25); border-bottom: 3px solid var(--mc-green);
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.mc-ai[data-pos="left"] .mc-ai-launcher { margin-left: 0; }
.mc-ai-launcher svg { color: var(--mc-on-brand); filter: drop-shadow(0 1px 1px rgba(0, 40, 60, .45)); }
.mc-ai-launcher:hover { transform: translateY(-1px); background: #07a6cc; box-shadow: 0 8px 24px rgba(9, 60, 80, .3); }
.mc-ai-launcher:focus-visible, .mc-ai-header button:focus-visible { outline-color: var(--mc-green); }
.mc-ai-open .mc-ai-launcher { display: none; }

/* Panel */
.mc-ai-panel {
  display: flex; flex-direction: column;
  width: 380px; height: min(620px, calc(100vh - var(--mc-bottom) - 24px));
  background: var(--mc-bg); border-radius: 16px; overflow: hidden;
  box-shadow: 0 18px 48px rgba(9, 40, 60, .25); border: 1px solid var(--mc-line);
}
.mc-ai-header { display: flex; align-items: center; gap: 4px; padding: 14px 10px 14px 18px; background: var(--mc-brand); color: var(--mc-on-brand); border-bottom: 4px solid var(--mc-green); text-shadow: var(--mc-on-shadow); }
.mc-ai[dir="rtl"] .mc-ai-header { padding: 14px 18px 14px 10px; }
.mc-ai-heading { flex: 1; min-width: 0; }
.mc-ai .mc-ai-title {
  margin: 0; padding: 0; font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 20px; line-height: 1.25; font-weight: 700; color: var(--mc-on-brand); letter-spacing: 0; text-transform: none;
}
.mc-ai[lang="ar"] .mc-ai-title { font-family: inherit; font-weight: 700; } /* Playfair has no Arabic letters */
.mc-ai .mc-ai-subtitle { margin: 2px 0 0; font-size: 13px; font-weight: 700; color: var(--mc-on-brand); }
.mc-ai-icon-btn { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--mc-on-brand) !important; cursor: pointer; filter: drop-shadow(0 1px 1px rgba(0, 40, 60, .45)); }
.mc-ai-icon-btn svg { stroke-width: 2.5; }
.mc-ai-icon-btn:hover { background: rgba(255, 255, 255, .18); }

/* Messages */
.mc-ai-log { flex: 1; overflow-y: auto; padding: 16px; background: var(--mc-soft); display: flex; flex-direction: column; gap: 10px; overscroll-behavior: contain; }
.mc-ai-msg { max-width: 88%; padding: 10px 14px; border-radius: 14px; word-wrap: break-word; overflow-wrap: anywhere; }
.mc-ai-msg p { margin: 0 0 8px; }
.mc-ai-msg p:last-child { margin-bottom: 0; }
.mc-ai-msg ul, .mc-ai-msg ol { margin: 4px 0 8px; padding-inline-start: 20px; }
.mc-ai-msg li { margin: 2px 0; }
.mc-ai-msg a { color: var(--mc-ink); text-decoration: underline; text-decoration-color: var(--mc-green); text-decoration-thickness: 2px; text-underline-offset: 2px; font-weight: 700; }
.mc-ai-bot { align-self: flex-start; background: #fff; border: 1px solid var(--mc-line); border-end-start-radius: 4px; }
.mc-ai-user { align-self: flex-end; background: var(--mc-brand); color: var(--mc-on-brand); border-end-end-radius: 4px; font-weight: 700; text-shadow: var(--mc-on-shadow); }
.mc-ai-user a { color: var(--mc-on-brand); }
.mc-ai-safety { border: 2px solid #c0392b; background: #fff6f5; }
.mc-ai-error, .mc-ai-offline { background: #fffaf0; border-color: #f0dfb4; }
.mc-ai-sources { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--mc-line); font-size: 13px; color: var(--mc-muted); display: flex; flex-wrap: wrap; gap: 4px 10px; }
.mc-ai-sources span { width: 100%; }

.mc-ai-typing { display: flex; gap: 4px; padding: 14px; }
.mc-ai-typing span { width: 7px; height: 7px; border-radius: 50%; background: var(--mc-blue); opacity: .4; animation: mc-ai-blink 1.2s infinite; }
.mc-ai-typing span:nth-child(2) { background: var(--mc-green); }
.mc-ai-typing span:nth-child(2) { animation-delay: .2s; }
.mc-ai-typing span:nth-child(3) { animation-delay: .4s; }
@keyframes mc-ai-blink { 0%, 80%, 100% { opacity: .25; } 40% { opacity: 1; } }

/* Quick questions + contact */
.mc-ai-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 10px 16px 4px; background: var(--mc-soft); }
.mc-ai-chip { padding: 6px 12px; border: 1.5px solid var(--mc-green); border-radius: 16px; background: #fff; color: var(--mc-ink) !important; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.mc-ai-chip:hover { background: var(--mc-green); }
.mc-ai-contact { display: flex; gap: 6px; padding: 8px 12px; border-top: 1px solid var(--mc-line); background: #fff; }
.mc-ai .mc-ai-contact-link { flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 6px 4px; border-radius: 8px; color: var(--mc-ink); text-decoration: none; font-size: 13.5px; font-weight: 700; }
.mc-ai .mc-ai-contact-link:hover { background: var(--mc-soft); }
.mc-ai-contact-link svg { width: 17px; height: 17px; color: #0789a8; }

/* Input */
.mc-ai-form { display: flex; align-items: flex-end; gap: 8px; padding: 10px 12px 6px; background: #fff; border-top: 1px solid var(--mc-line); margin: 0; }
.mc-ai .mc-ai-input {
  flex: 1; min-height: 42px; max-height: 120px; resize: none; margin: 0;
  padding: 10px 12px; border: 1px solid #c9d1d8; border-radius: 10px; background: #fff; color: var(--mc-text);
  font: inherit; font-size: 15px; line-height: 1.4; box-shadow: none;
}
.mc-ai .mc-ai-input:focus { border-color: var(--mc-blue-2); outline: none; box-shadow: 0 0 0 2px rgba(9, 184, 226, .25); }
.mc-ai-send, .mc-ai-stop { display: grid; place-items: center; width: 42px; height: 42px; padding: 0; border: 0; border-radius: 10px; cursor: pointer; background: var(--mc-green); color: var(--mc-ink) !important; }
.mc-ai-send:hover { background: #a3c23f; }
.mc-ai-stop { background: #dfe5ea; }
.mc-ai-stop svg { fill: currentColor; }
.mc-ai[dir="rtl"] .mc-ai-send svg { transform: scaleX(-1); }
.mc-ai .mc-ai-notice { margin: 0; padding: 4px 14px 10px; background: #fff; font-size: 11.5px; line-height: 1.4; color: var(--mc-muted); }

/* Phones: full screen */
@media (max-width: 600px) {
  .mc-ai { right: 16px; bottom: calc(var(--mc-bottom) - 8px); }
  .mc-ai[data-pos="left"] { left: 16px; }
  .mc-ai-open { inset: 0; }
  .mc-ai-open .mc-ai-panel { width: 100vw; height: 100vh; height: 100dvh; border-radius: 0; border: 0; }
  .mc-ai-launcher-text { display: none; }
  .mc-ai-launcher { width: 56px; height: 56px; padding: 0; justify-content: center; border-radius: 50%; }
  .mc-ai-launcher svg { width: 26px; height: 26px; }
  .mc-ai .mc-ai-input { font-size: 16px; } /* stops iOS zooming in */
}
@media (prefers-reduced-motion: reduce) {
  .mc-ai-launcher, .mc-ai-typing span { transition: none; animation: none; }
}
@media print { .mc-ai { display: none; } }
