/* ============================================================
   KEY v66 — chat text visibility + expert action bar under composer
   ============================================================ */

/* ---------- 1. Global chat text contrast ---------- */
.chat-box, .kx-chat,
.chat-box .chat-msgs, .chat-box .chat-msgs-pro,
.kx-chat .chat-msgs-pro {
  color: var(--text, #0F1F1C) !important;
}

.chat-box .bubble, .chat-box .bubble-pro,
.kx-chat .bubble-pro {
  color: var(--text, #0F1F1C) !important;
  text-shadow: none !important;
}

.chat-box .bubble.mine, .chat-box .bubble-pro.mine,
.kx-chat .bubble-pro.mine {
  color: #fff !important;
  background: linear-gradient(135deg, #087f68, #0b9a7c) !important;
  border: 0 !important;
  box-shadow: 0 4px 14px rgba(8,127,104,.22) !important;
}
.chat-box .bubble.mine small, .chat-box .bubble-pro.mine small,
.kx-chat .bubble-pro.mine small {
  color: rgba(255,255,255,.85) !important;
}

.chat-box .bubble.theirs, .chat-box .bubble-pro.theirs,
.kx-chat .bubble-pro.theirs {
  color: var(--text, #0F1F1C) !important;
  background: var(--card, #ffffff) !important;
  border: 1px solid var(--border, rgba(15,31,28,.10)) !important;
}
.chat-box .bubble.theirs small, .chat-box .bubble-pro.theirs small,
.kx-chat .bubble-pro.theirs small {
  color: var(--muted, #60736e) !important;
}

/* Timestamps, info texts, contexts */
.chat-box .info-text,
.kx-chat .info-text,
.chat-box .chat-ctx,
.kx-chat .kx-chat-ctx,
.chat-box .chat-day span,
.kx-chat .chat-day span,
.chat-box .chat-ts,
.kx-chat .chat-ts {
  color: var(--muted, #60736e) !important;
}

/* Headers (dark gradient) — force white text */
.chat-box .chat-head, .kx-chat .kx-chat-head {
  color: #fff !important;
}
.chat-box .chat-head strong, .kx-chat .kx-chat-head strong,
.chat-box .chat-head div, .kx-chat .kx-chat-head div {
  color: #fff !important;
}
.chat-box .chat-head .status-bar-btn,
.kx-chat .kx-chat-head .status-bar-btn {
  color: #fff !important;
  background: rgba(255,255,255,.14) !important;
  border-color: rgba(255,255,255,.20) !important;
}

/* Inputs — always readable */
.chat-box input, .chat-box textarea,
.kx-chat input, .kx-chat textarea,
.chat-input input, .kx-composer input,
#chatInput, #supportInput {
  color: var(--text, #0F1F1C) !important;
  background: var(--input-bg, var(--card, #fff)) !important;
  caret-color: #087f68 !important;
  text-shadow: none !important;
}
.chat-box input::placeholder,
.kx-chat input::placeholder,
#chatInput::placeholder {
  color: var(--muted, #60736e) !important;
  opacity: .75 !important;
}

/* Composer bar */
.chat-input, .kx-composer {
  background: var(--card, #fff) !important;
  border-top: 1px solid var(--border, rgba(15,31,28,.10)) !important;
}

/* Dark theme adjustments */
[data-theme="dark"] .chat-box, [data-theme="dark"] .kx-chat,
[data-theme="dark"] .chat-box .chat-msgs,
[data-theme="dark"] .chat-box .chat-msgs-pro,
[data-theme="dark"] .kx-chat .chat-msgs-pro {
  color: #E8F5F0 !important;
}
[data-theme="dark"] .chat-box .bubble.theirs,
[data-theme="dark"] .chat-box .bubble-pro.theirs,
[data-theme="dark"] .kx-chat .bubble-pro.theirs {
  color: #E8F5F0 !important;
  background: #14211D !important;
  border-color: rgba(255,255,255,.08) !important;
}
[data-theme="dark"] .chat-box input,
[data-theme="dark"] .kx-chat input,
[data-theme="dark"] #chatInput {
  color: #E8F5F0 !important;
  background: #0a1818 !important;
}

/* ---------- 2. Expert action bar under composer ---------- */
.v66-expert-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  padding: 12px 12px calc(12px + env(safe-area-inset-bottom, 0px)) 12px !important;
  background: linear-gradient(180deg, transparent, rgba(8,127,104,.05)) !important;
  border-top: 1px dashed rgba(8,127,104,.20) !important;
  margin: 0 !important;
}
.v66-expert-actions .v66-btn {
  flex: 1 1 130px !important;
  min-width: 130px !important;
  margin: 0 !important;
  min-height: 48px !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  border-radius: 12px !important;
  padding: 0 14px !important;
  box-shadow: 0 4px 12px rgba(15,23,42,.06) !important;
}
.v66-expert-actions .v66-btn:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 16px rgba(15,23,42,.12) !important;
}
.v66-expert-actions .v66-btn.btn-success {
  background: linear-gradient(135deg, #047857, #059669) !important;
  color: #fff !important;
  border: 0 !important;
}
.v66-expert-actions .v66-btn.btn-gold {
  background: linear-gradient(135deg, #b45309, #d97706) !important;
  color: #fff !important;
  border: 0 !important;
}
.v66-expert-actions .v66-btn.secondary-btn {
  background: #fff !important;
  color: #087f68 !important;
  border: 1.5px solid rgba(8,127,104,.30) !important;
}
[data-theme="dark"] .v66-expert-actions {
  background: linear-gradient(180deg, transparent, rgba(16,185,129,.06)) !important;
  border-top-color: rgba(16,185,129,.20) !important;
}
[data-theme="dark"] .v66-expert-actions .v66-btn.secondary-btn {
  background: #14211D !important;
  color: #6ee7b7 !important;
  border-color: rgba(16,185,129,.30) !important;
}
@media (max-width: 560px) {
  .v66-expert-actions .v66-btn {
    flex: 1 1 100% !important;
    min-height: 46px !important;
  }
}