/* Гостевой чат на публичных страницах (templates/guest_chat_widget.php). Страницы, куда он
   подключается, не все линкуют style.css, поэтому у каждой переменной есть запасное значение
   из брендбука (--primary #5E2B9A и т.д.). Правый нижний угол - как у .chat-launcher в кабинете. */
.gc-root { font-family: var(--font, 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, Roboto, Arial, sans-serif); }
.gc-root [hidden] { display: none !important; }

.gc-launcher {
  position: fixed; right: 20px; bottom: 20px; z-index: 900;
  display: inline-flex; align-items: center; gap: 8px;
  padding: 11px 18px 11px 12px;
  background: var(--primary, #5E2B9A); color: #fff;
  border: 0; border-radius: 999px; cursor: pointer;
  font: inherit; font-size: 13px; font-weight: 700;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .18);
  transition: transform .12s, opacity .12s;
}
.gc-launcher:hover { opacity: .92; transform: translateY(-2px); }
.gc-launcher:focus-visible { outline: 3px solid rgba(94, 43, 154, .35); outline-offset: 2px; }
.gc-launcher-icon { position: relative; width: 20px; height: 20px; flex-shrink: 0; }
.gc-launcher-icon svg { width: 100%; height: 100%; }
.gc-badge {
  position: absolute; top: -7px; right: -9px;
  min-width: 16px; height: 16px; padding: 0 3px;
  display: flex; align-items: center; justify-content: center;
  background: var(--danger, #dc2626); color: #fff; border: 2px solid var(--primary, #5E2B9A);
  border-radius: 999px; font-size: 10px; font-weight: 800; line-height: 1;
}
.gc-root.is-open .gc-launcher { display: none; }

.gc-panel {
  position: fixed; right: 20px; bottom: 20px; z-index: 10000;
  width: 370px; max-width: calc(100vw - 32px);
  height: 540px; max-height: calc(100vh - 40px);
  display: flex; flex-direction: column;
  background: var(--bg-card, #fff); color: var(--text, #1A1A1F);
  border: 1px solid var(--border, #E4E2DC); border-radius: var(--r-lg, 14px);
  box-shadow: 0 18px 50px rgba(26, 26, 31, .22);
  overflow: hidden;
}
.gc-head {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 14px 14px 12px 18px;
  background: var(--primary-light, #ECE6F3);
  border-bottom: 1px solid rgba(94, 43, 154, .12);
}
.gc-head-text { flex: 1; min-width: 0; }
.gc-title { font-family: var(--font-heading, 'Space Grotesk', sans-serif); font-weight: 700; font-size: 16px; color: var(--primary-dark, #4D237E); }
.gc-sub { font-size: 12px; color: var(--text-secondary, #55555c); margin-top: 2px; }
.gc-close {
  flex-shrink: 0; width: 32px; height: 32px; border: 0; border-radius: var(--r-sm, 6px);
  background: transparent; color: var(--text-secondary, #55555c); cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
}
.gc-close:hover { background: rgba(94, 43, 154, .1); color: var(--primary-dark, #4D237E); }

.gc-thread { flex: 1; overflow-y: auto; padding: 14px 14px 6px; display: flex; flex-direction: column; gap: 8px; background: var(--bg, #F7F6F3); }
.gc-row { display: flex; }
.gc-row.gc-own { justify-content: flex-end; }
.gc-bubble { max-width: 82%; padding: 8px 12px; border-radius: var(--r, 10px); border: 1px solid var(--border, #E4E2DC); background: var(--bg-card, #fff); }
.gc-bubble-own { background: var(--primary-light, #ECE6F3); border-color: transparent; }
.gc-bubble-deleted { opacity: .65; }
.gc-text { font-size: 13.5px; line-height: 1.45; white-space: pre-wrap; word-break: break-word; }
.gc-meta { font-size: 10.5px; color: var(--text-muted, #86868f); margin-top: 4px; }

.gc-form { padding: 10px 14px 14px; border-top: 1px solid var(--border, #E4E2DC); display: flex; flex-direction: column; gap: 8px; background: var(--bg-card, #fff); }
.gc-input {
  width: 100%; box-sizing: border-box;
  padding: 9px 11px; font: inherit; font-size: 13.5px; color: inherit;
  border: 1px solid var(--border-strong, #CFCCC3); border-radius: var(--r-sm, 6px); background: var(--bg-card, #fff);
}
.gc-input:focus { outline: none; border-color: var(--primary, #5E2B9A); box-shadow: 0 0 0 3px rgba(94, 43, 154, .12); }
.gc-textarea { resize: none; }
.gc-consent { display: flex; gap: 8px; align-items: flex-start; font-size: 11.5px; line-height: 1.4; color: var(--text-secondary, #55555c); cursor: pointer; }
.gc-consent input { margin-top: 2px; flex-shrink: 0; accent-color: var(--primary, #5E2B9A); }
.gc-consent a { color: var(--primary, #5E2B9A); }
.gc-submit {
  padding: 10px 14px; border: 0; border-radius: var(--r-sm, 6px); cursor: pointer;
  background: var(--primary, #5E2B9A); color: #fff; font: inherit; font-size: 14px; font-weight: 700;
}
.gc-submit:disabled, .gc-send-btn:disabled { opacity: .55; cursor: default; }
.gc-send-row { display: flex; gap: 8px; align-items: flex-end; }
.gc-send-btn {
  flex-shrink: 0; width: 42px; height: 42px; border: 0; border-radius: var(--r-sm, 6px); cursor: pointer;
  background: var(--primary, #5E2B9A); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
}
.gc-note { font-size: 11.5px; color: var(--text-muted, #86868f); }
.gc-note:empty { display: none; }
.gc-error { font-size: 12px; color: var(--danger, #dc2626); }
.gc-root .hp-field { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* Над нижним таб-баром демо-кабинета (body.has-bottom-nav) - тот же отступ, что у .chat-launcher. */
@media (max-width: 900px) {
  body.has-bottom-nav .gc-launcher { bottom: calc(62px + 14px + env(safe-area-inset-bottom)); right: 14px; }
}
@media (max-width: 480px) {
  .gc-launcher { padding: 12px; right: 14px; bottom: 14px; }
  .gc-launcher-text { display: none; }
  .gc-panel { right: 0; bottom: 0; left: 0; width: 100%; max-width: none; height: 100%; max-height: 100%; border-radius: 0; border: 0; }
}