/* ONCHAIN shared support widget + clickable quick questions */
.onchain-support-quick-wrap{display:flex;flex-direction:column;gap:7px;margin:2px 0 4px;max-width:96%}
.onchain-support-quick-title{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#777;margin:2px 2px 0}
.onchain-support-quick-list{display:flex;flex-wrap:wrap;gap:7px}
.onchain-support-quick-btn{appearance:none;border:1px solid #34384b;background:#171923;color:#cfd5ff;border-radius:999px;padding:7px 10px;font-size:11px;line-height:1.2;cursor:pointer;text-align:left;transition:.18s ease;max-width:100%}
.onchain-support-quick-btn:hover{border-color:#8a9dff;background:#20243a;color:#fff;transform:translateY(-1px)}
.onchain-support-quick-btn:disabled{opacity:.55;cursor:default;transform:none}

/* Standalone widget used on Login / Sign Up */
.oc-public-support-btn{position:fixed;right:24px;bottom:24px;width:54px;height:54px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:#d8dbe4;color:#090909;display:flex;align-items:center;justify-content:center;font-size:23px;cursor:pointer;z-index:99990;box-shadow:0 8px 30px rgba(0,0,0,.45);transition:.18s ease}
.oc-public-support-btn:hover{transform:scale(1.07)}
.oc-public-support-panel{position:fixed;right:22px;bottom:90px;width:360px;max-width:calc(100vw - 28px);height:510px;max-height:calc(100vh - 120px);background:#101010;border:1px solid #292929;border-radius:13px;overflow:hidden;z-index:99991;box-shadow:0 20px 70px rgba(0,0,0,.62);display:none;color:#eee;font-family:inherit}
.oc-public-support-panel.show{display:flex;flex-direction:column}
.oc-public-support-head{height:64px;flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:0 13px;border-bottom:1px solid #292929;background:#111}
.oc-public-support-head-left{display:flex;align-items:center;gap:10px;min-width:0}
.oc-public-support-avatar{width:38px;height:38px;border-radius:50%;background:#333;display:flex;align-items:center;justify-content:center;font-size:18px}
.oc-public-support-head h4{font-size:13px;margin:0;color:#fff}.oc-public-support-head p{font-size:10px;color:#777;margin:2px 0 0}
.oc-public-support-close{border:0;background:transparent;color:#888;font-size:21px;cursor:pointer;padding:5px}
.oc-public-support-messages{flex:1;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:10px;background:#121212}
.oc-public-support-message{max-width:86%;padding:10px 12px;border-radius:11px;font-size:12px;line-height:1.5;word-break:break-word}
.oc-public-support-message.bot{align-self:flex-start;background:#1d1d1d;border:1px solid #303030;color:#ddd;border-bottom-left-radius:3px}
.oc-public-support-message.user{align-self:flex-end;background:#8a9dff;color:#090909;border-bottom-right-radius:3px;font-weight:600}
.oc-public-support-message.typing{color:#888;font-style:italic}
.oc-public-support-fallback{display:none;margin:0 12px 10px;padding:10px;border:1px solid #2a2a2a;border-radius:9px;background:#171717;font-size:11px;color:#aaa}.oc-public-support-fallback.show{display:block}
.oc-public-support-fallback a{display:block;margin-top:8px;padding:9px 10px;border-radius:7px;background:#249fdb;color:#fff;text-decoration:none;text-align:center;font-weight:700}
.oc-public-support-input{display:flex;gap:7px;padding:11px;background:#0f0f0f;border-top:1px solid #292929}
.oc-public-support-input input{flex:1;min-width:0;background:#191919;border:1px solid #414141;color:#fff;border-radius:8px;padding:10px 11px;outline:none}.oc-public-support-input input:focus{border-color:#8a9dff}
.oc-public-support-send{width:43px;border:0;border-radius:8px;background:#8a9dff;color:#080808;font-weight:800;cursor:pointer;font-size:17px}
.oc-public-support-note{padding:0 11px 10px;background:#0f0f0f;color:#656565;font-size:9px;line-height:1.4}
@media(max-width:600px){.oc-public-support-btn{right:16px;bottom:18px}.oc-public-support-panel{right:10px;bottom:82px;width:calc(100vw - 20px);height:min(520px,calc(100vh - 100px))}}

/* 2026-08-14 UI consistency fixes */
/* Keep saved profile photos perfectly circular on every authenticated page. */
.user-avatar{overflow:hidden!important;border-radius:50%!important;flex:0 0 auto}
.user-avatar img{width:100%!important;height:100%!important;object-fit:cover!important;border-radius:50%!important;display:block!important}

/* On non-dashboard pages the old Telegram-only widget is replaced by the unified smart support widget. */
body.oc-unified-support-page .chat-btn,
body.oc-unified-support-page .chat-popup{display:none!important}

/* Strong reset so Login / Sign Up page button styles cannot turn the launcher into a plain dot. */
.oc-public-support-btn{
  appearance:none!important;-webkit-appearance:none!important;
  box-sizing:border-box!important;margin:0!important;padding:0!important;
  min-width:54px!important;max-width:54px!important;min-height:54px!important;max-height:54px!important;
  width:54px!important;height:54px!important;border-radius:50%!important;
  border:1px solid rgba(255,255,255,.18)!important;
  background:#d8dbe4!important;color:#090909!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  line-height:1!important;text-indent:0!important;letter-spacing:0!important;
  font-size:0!important;overflow:hidden!important;
}
.oc-public-support-btn svg{width:24px!important;height:24px!important;display:block!important;fill:#090909!important;pointer-events:none!important}
.oc-public-support-avatar svg{width:19px;height:19px;display:block;fill:#d9d9d9}
@media(max-width:600px){.oc-public-support-btn{min-width:54px!important;max-width:54px!important;min-height:54px!important;max-height:54px!important}}

/* OC_GLOBAL_SUPPORT_LAUNCHER_GLOW_START */
/* Keep the support launcher visually identical across customer-facing pages. */
@keyframes ocSupportLauncherGlow {
  0%,100% {
    transform: scale(1);
    box-shadow:
      0 0 0 0 rgba(138,157,255,.22),
      0 0 16px rgba(138,157,255,.42),
      0 8px 30px rgba(0,0,0,.46);
  }
  50% {
    transform: scale(1.045);
    box-shadow:
      0 0 0 9px rgba(138,157,255,0),
      0 0 30px rgba(138,157,255,.78),
      0 10px 34px rgba(0,0,0,.52);
  }
}

/* Standalone smart-support launcher: Login, Sign Up and all inner customer pages. */
.oc-public-support-btn {
  width:56px!important;
  height:56px!important;
  min-width:56px!important;
  max-width:56px!important;
  min-height:56px!important;
  max-height:56px!important;
  border-radius:50%!important;
  background:#d8dbe4!important;
  color:#080808!important;
  border:1px solid rgba(255,255,255,.22)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  animation:ocSupportLauncherGlow 2.15s ease-in-out infinite!important;
  transform-origin:center center!important;
  will-change:transform,box-shadow;
}
.oc-public-support-btn svg {
  width:24px!important;
  height:24px!important;
  fill:#080808!important;
  display:block!important;
}

/* Dashboard already uses its own launcher; give it the same circle + glow without changing its position. */
body:not(.oc-force-smart-support-page) .chat-btn {
  width:56px!important;
  height:56px!important;
  min-width:56px!important;
  min-height:56px!important;
  border-radius:50%!important;
  background:#d8dbe4!important;
  color:#080808!important;
  border:1px solid rgba(255,255,255,.22)!important;
  animation:ocSupportLauncherGlow 2.15s ease-in-out infinite!important;
  transform-origin:center center!important;
  will-change:transform,box-shadow;
}
body:not(.oc-force-smart-support-page) .chat-btn svg,
body:not(.oc-force-smart-support-page) .chat-btn i {
  color:#080808!important;
  fill:#080808!important;
}

.oc-public-support-btn:hover,
body:not(.oc-force-smart-support-page) .chat-btn:hover {
  animation-play-state:paused!important;
  transform:scale(1.09)!important;
  box-shadow:0 0 34px rgba(138,157,255,.9),0 10px 36px rgba(0,0,0,.52)!important;
}
.oc-public-support-btn:active,
body:not(.oc-force-smart-support-page) .chat-btn:active {
  transform:scale(.96)!important;
}

@media (prefers-reduced-motion: reduce) {
  .oc-public-support-btn,
  body:not(.oc-force-smart-support-page) .chat-btn {
    animation:none!important;
  }
}
/* OC_GLOBAL_SUPPORT_LAUNCHER_GLOW_END */

/* OC_CANONICAL_CHAT_ICON_START */
/* Use the SAME filled chat-bubble glyph on every support launcher. */
.oc-public-support-btn,
.chat-btn {
  position: fixed;
  font-size: 0 !important;
  color: transparent !important;
  text-indent: -9999px !important;
  overflow: visible !important;
}

/* Hide any page-specific icon (emoji, SVG, image, FontAwesome, etc.). */
.oc-public-support-btn > *,
.chat-btn > *,
.oc-public-support-btn svg,
.chat-btn svg,
.oc-public-support-btn img,
.chat-btn img,
.oc-public-support-btn i,
.chat-btn i,
.oc-public-support-btn span,
.chat-btn span {
  display: none !important;
  visibility: hidden !important;
}

/* Main black oval bubble. */
.oc-public-support-btn::before,
.chat-btn::before {
  content: '' !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 24px !important;
  height: 17px !important;
  margin-left: -12px !important;
  margin-top: -10px !important;
  background: #050505 !important;
  border: 0 !important;
  border-radius: 50% !important;
  display: block !important;
  opacity: 1 !important;
  transform: none !important;
  box-shadow: none !important;
  pointer-events: none !important;
  z-index: 2 !important;
}

/* Small tail, matching the Dashboard chat icon. */
.oc-public-support-btn::after,
.chat-btn::after {
  content: '' !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 8px !important;
  height: 8px !important;
  margin-left: -9px !important;
  margin-top: 3px !important;
  background: #050505 !important;
  display: block !important;
  clip-path: polygon(0 0, 100% 0, 0 100%) !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

/* Keep the already-approved light circle + glow on every page. */
.oc-public-support-btn,
.chat-btn {
  width: 56px !important;
  height: 56px !important;
  min-width: 56px !important;
  min-height: 56px !important;
  max-width: 56px !important;
  max-height: 56px !important;
  border-radius: 50% !important;
  background: #d8dbe4 !important;
  border: 1px solid rgba(255,255,255,.22) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
/* OC_CANONICAL_CHAT_ICON_END */
