/* Виджет ассистента Dredd Guard (спека 2026-08-23).
   Цвета лендинга: тёмный фон, красный акцент. Зелёный запрещён (правило
   владельца по креативам). Внешних шрифтов и картинок не тянем. */

#dg-chat-btn {
  position: fixed; right: 20px; bottom: 20px; z-index: 9998;
  display: flex; align-items: center; gap: 8px;
  padding: 13px 18px; border: 0; border-radius: 999px; cursor: pointer;
  background: #d92b2b; color: #fff;
  font: 600 15px/1 Inter, system-ui, sans-serif;
  box-shadow: 0 8px 28px rgba(0, 0, 0, .45);
}
#dg-chat-btn:hover { background: #ef3535; }
#dg-chat-btn[hidden] { display: none; }

#dg-chat {
  position: fixed; right: 20px; bottom: 20px; z-index: 9999;
  width: 370px; max-width: calc(100vw - 24px); height: 540px; max-height: calc(100vh - 40px);
  max-height: calc(100dvh - 40px);
  display: none; flex-direction: column; overflow: hidden;
  background: #131820; color: #e9eef5; border: 1px solid #253044; border-radius: 16px;
  font: 15px/1.5 Inter, system-ui, sans-serif;
  box-shadow: 0 18px 50px rgba(0, 0, 0, .55);
}
#dg-chat.dg-open { display: flex; }

.dg-head { display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px; background: #0f141b; border-bottom: 1px solid #253044; }
.dg-head b { font-size: 15px; }
.dg-head small { display: block; color: #93a2b7; font-weight: 400; font-size: 12px; }
.dg-close { background: 0; border: 0; color: #93a2b7; font-size: 22px; cursor: pointer; line-height: 1;
  flex: none; width: 44px; height: 44px; margin: -10px -12px -10px 0; }

.dg-body { flex: 1; overflow-y: auto; padding: 14px 16px; display: flex; flex-direction: column; gap: 10px; }
.dg-msg { max-width: 86%; padding: 10px 13px; border-radius: 12px; white-space: pre-wrap; word-wrap: break-word; }
.dg-bot { align-self: flex-start; background: #1c2431; border: 1px solid #253044; }
.dg-guest { align-self: flex-end; background: #d92b2b; color: #fff; }
.dg-owner { align-self: flex-start; background: #1c2431; border: 1px solid #d92b2b; }
.dg-owner::before { content: "Специалист поддержки"; display: block; margin-bottom: 4px;
  color: #ff8a8a; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; }
.dg-typing { align-self: flex-start; color: #93a2b7; font-size: 13px; }

.dg-cta { margin-top: 4px; padding: 12px; border: 1px dashed #3a4a5f; border-radius: 12px; }
.dg-wait { margin-top: 4px; padding: 12px; background: #1a2130; border: 1px solid #253044; border-radius: 12px; }
.dg-wait p { margin: 0 0 8px; font-size: 13px; color: #c6d2e2; }
.dg-wait a, .dg-wait button { display: inline-block; margin-top: 6px; padding: 10px 14px;
  border: 0; border-radius: 10px; background: #d92b2b; color: #fff; cursor: pointer;
  font: 600 14px Inter, system-ui, sans-serif; text-decoration: none; }
.dg-contact { display: flex; gap: 6px; margin-top: 6px; }
.dg-contact input { flex: 1; min-width: 0; padding: 9px 11px; border-radius: 9px;
  border: 1px solid #2e3a4d; background: #0f141b; color: #e9eef5; font-size: 14px; }

.dg-foot { display: flex; gap: 8px; padding: 12px; border-top: 1px solid #253044; background: #0f141b; }
.dg-foot input { flex: 1; min-width: 0; padding: 11px 13px; border-radius: 10px;
  border: 1px solid #2e3a4d; background: #131820; color: #e9eef5; font-size: 15px; }
.dg-foot button { padding: 11px 16px; border: 0; border-radius: 10px; background: #d92b2b;
  color: #fff; font-weight: 600; cursor: pointer; }
.dg-foot button:disabled { opacity: .5; cursor: default; }

/* Телефон. Окно прижато и сверху, и снизу — тогда оно ровно по ВИДИМОЙ
   области, а не по «экрану без панелей браузера». `100vh` на iOS Safari равен
   высоте с убранными панелями (на 14 Pro Max это ~190 px лишку): окно
   выдавливало шапку с крестиком за верхний край, и закрыть его было нечем. */
@media (max-width: 480px) {
  #dg-chat {
    right: 8px; left: 8px; width: auto;
    top: 8px; bottom: calc(8px + env(safe-area-inset-bottom, 0px));
    height: auto; max-height: none;
  }
  #dg-chat-btn { bottom: calc(20px + env(safe-area-inset-bottom, 0px)); }
}

/* Панель под ответом бота: оценка ответа + вызов живого специалиста. */
.dg-tools { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: -4px 0 2px; }
.dg-vote { width: 32px; height: 32px; padding: 0; border: 1px solid #253044; border-radius: 9px;
  background: #1c2431; color: #e9eef5; font-size: 15px; cursor: pointer; line-height: 1; }
.dg-vote:hover:not(:disabled) { border-color: #d92b2b; }
.dg-vote:disabled { opacity: .45; cursor: default; }
.dg-voted { border-color: #d92b2b; background: #2a1a1f; opacity: 1; }
.dg-human { margin-left: auto; padding: 7px 11px; border: 1px solid #d92b2b; border-radius: 9px;
  background: transparent; color: #ff8a8a; font-size: 12.5px; cursor: pointer; }
.dg-human:hover:not(:disabled) { background: #d92b2b; color: #fff; }
.dg-human:disabled { opacity: .5; cursor: default; }
