/* twittsocial.com V4.10.78 — HD Messenger themes/backgrounds */

/* Header three-dot trigger */
.sp-chat-options-trigger{font-family:Arial,sans-serif!important;font-size:16px!important;font-weight:900!important;letter-spacing:1px!important;line-height:1!important;color:var(--sp-chat-theme-accent,#0866ff)!important}
.sp-quick-chat-actions .sp-chat-options-trigger{font-size:15px!important;letter-spacing:.5px!important}

/* Conversation background + guaranteed bubble contrast. */
[data-chat-theme]{
  --sp-chat-theme-image:none;
  --sp-chat-theme-overlay:rgba(255,255,255,0);
  --sp-chat-theme-accent:#0084ff;
  --sp-chat-theme-sent:#0084ff;
  --sp-chat-theme-sent-text:#fff;
  --sp-chat-theme-received:rgba(255,255,255,.96);
  --sp-chat-theme-received-text:#111827;
}
[data-chat-theme] .sp-chat-head-actions button,
[data-chat-theme] .sp-chat-photo,
[data-chat-theme] .sp-chat-attach,
[data-chat-theme] .sp-chat-voice,
[data-chat-theme] .sp-chat-send{color:var(--sp-chat-theme-accent,#0866ff)!important}

[data-chat-theme].has-chat-image-theme .sp-chat-scroll{
  background-color:#eef1f5!important;
  background-image:linear-gradient(var(--sp-chat-theme-overlay),var(--sp-chat-theme-overlay)),var(--sp-chat-theme-image)!important;
  background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
  background-attachment:scroll!important;
}
.sp-quick-chat[data-chat-theme].has-chat-image-theme .sp-chat-scroll{background-color:#eef1f5!important;background-image:linear-gradient(var(--sp-chat-theme-overlay),var(--sp-chat-theme-overlay)),var(--sp-chat-theme-image)!important;background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important}

/* Text bubbles stay readable on every supplied image. */
[data-chat-theme].has-chat-image-theme .sp-chat-message.is-mine .sp-chat-bubble{
  background:var(--sp-chat-theme-sent)!important;
  color:var(--sp-chat-theme-sent-text)!important;
  -webkit-text-fill-color:var(--sp-chat-theme-sent-text)!important;
  border:1px solid color-mix(in srgb,var(--sp-chat-theme-sent) 82%,#000 18%)!important;
  box-shadow:0 1px 3px rgba(0,0,0,.18)!important;
}
[data-chat-theme].has-chat-image-theme .sp-chat-message.is-theirs .sp-chat-bubble{
  background:var(--sp-chat-theme-received)!important;
  color:var(--sp-chat-theme-received-text)!important;
  -webkit-text-fill-color:var(--sp-chat-theme-received-text)!important;
  border:1px solid rgba(17,24,39,.12)!important;
  box-shadow:0 1px 3px rgba(0,0,0,.15)!important;
  backdrop-filter:blur(8px)!important;
  -webkit-backdrop-filter:blur(8px)!important;
}
[data-chat-theme].has-chat-image-theme .sp-chat-bubble a{color:inherit!important;text-decoration-color:currentColor!important}
[data-chat-theme].has-chat-image-theme .sp-chat-unsent{background:rgba(255,255,255,.9)!important;color:#6b7280!important;-webkit-text-fill-color:#6b7280!important}

/* Non-text message cards also get an opaque readable surface. */
[data-chat-theme].has-chat-image-theme :is(.sp-chat-shared-post,.sp-chat-file-card,.sp-chat-voice-message,.sp-chat-call-event){
  background:rgba(255,255,255,.96)!important;
  color:#111827!important;
  border-color:rgba(17,24,39,.12)!important;
  box-shadow:0 1px 3px rgba(0,0,0,.14)!important;
  backdrop-filter:blur(8px)!important;
  -webkit-backdrop-filter:blur(8px)!important;
}
[data-chat-theme].has-chat-image-theme :is(.sp-chat-shared-post,.sp-chat-file-card,.sp-chat-voice-message,.sp-chat-call-event) :is(strong,b,small,span,time){color:inherit}

/* Profile intro, timestamps and typing stay readable against photos. */
[data-chat-theme].has-chat-image-theme .sp-chat-profile-intro-main{
  display:flex!important;flex-direction:column!important;align-items:center!important;
  min-width:min(220px,78%)!important;padding:12px 18px!important;border-radius:20px!important;
  background:rgba(255,255,255,.88)!important;color:#111827!important;text-decoration:none!important;
  border:1px solid rgba(255,255,255,.7)!important;box-shadow:0 4px 18px rgba(0,0,0,.12)!important;
  backdrop-filter:blur(10px)!important;-webkit-backdrop-filter:blur(10px)!important;
}
[data-chat-theme].has-chat-image-theme .sp-chat-profile-intro-main :is(strong,span){color:#111827!important;-webkit-text-fill-color:#111827!important}
[data-chat-theme].has-chat-image-theme .sp-chat-profile-view{padding:5px 10px!important;border-radius:999px!important;background:rgba(255,255,255,.9)!important;color:var(--sp-chat-theme-accent)!important;box-shadow:0 1px 4px rgba(0,0,0,.1)!important}
[data-chat-theme].has-chat-image-theme .sp-chat-message-meta,
[data-chat-theme].has-chat-image-theme .sp-chat-seen-label{
  width:max-content!important;padding:2px 6px!important;border-radius:999px!important;
  background:rgba(17,24,39,.58)!important;color:#fff!important;text-shadow:0 1px 1px rgba(0,0,0,.4)!important;
}
[data-chat-theme].has-chat-image-theme .sp-chat-message-meta button{color:#fff!important}
[data-chat-theme].has-chat-image-theme .sp-chat-typing{width:max-content!important;padding:5px 8px!important;border-radius:999px!important;background:rgba(255,255,255,.92)!important;box-shadow:0 1px 4px rgba(0,0,0,.12)!important}

/* Small options menu opened by the three-dot button. */
.sp-chat-options-menu[hidden],.sp-chat-theme-picker[hidden]{display:none!important}
.sp-chat-options-menu{
  position:fixed;z-index:2147482100;width:176px;padding:6px;border:1px solid rgba(15,23,42,.10);border-radius:12px;
  background:#fff;color:#111827;box-shadow:0 12px 34px rgba(15,23,42,.22);animation:spChatMenuIn .12s ease-out;
}
.sp-chat-options-menu button{width:100%;min-height:42px;padding:8px 10px;display:flex;align-items:center;gap:10px;border:0;border-radius:9px;background:transparent;color:#111827;text-align:left;cursor:pointer;font:inherit}
.sp-chat-options-menu button:hover,.sp-chat-options-menu button:focus-visible{background:#f1f5f9;outline:0}
.sp-chat-options-menu button>span{width:26px;height:26px;display:grid;place-items:center;border-radius:8px;background:#eef2ff;color:#4f46e5;font-size:17px}
.sp-chat-options-menu button strong{font-size:13px;font-weight:750}
@keyframes spChatMenuIn{from{opacity:0;transform:translateY(-3px) scale(.98)}to{opacity:1;transform:none}}

/* Theme picker: compact desktop dialog, mobile bottom sheet. No body scroll lock. */
.sp-chat-theme-picker{position:fixed;z-index:2147482200;inset:0;display:grid;place-items:center;padding:18px;overscroll-behavior:contain}
.sp-chat-theme-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.46);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
.sp-chat-theme-panel{position:relative;z-index:1;width:min(480px,100%);max-height:min(680px,86dvh);overflow:hidden;display:flex;flex-direction:column;border:1px solid rgba(15,23,42,.12);border-radius:20px;background:#fff;color:#111827;box-shadow:0 28px 70px rgba(15,23,42,.3)}
.sp-chat-theme-panel>header{height:56px;flex:0 0 56px;padding:0 14px 0 18px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #edf0f4}
.sp-chat-theme-panel>header strong{font-size:17px;font-weight:800}
.sp-chat-theme-panel>header button{width:36px;height:36px;display:grid;place-items:center;border:0;border-radius:50%;background:#f0f2f5;color:#111827;font-size:22px;line-height:1;cursor:pointer}
.sp-chat-theme-grid{min-height:0;overflow-y:auto;padding:14px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;overscroll-behavior:contain;scrollbar-width:thin}
.sp-chat-theme-choice{position:relative;min-width:0;padding:0 0 8px;overflow:hidden;border:2px solid transparent;border-radius:14px;background:#f5f7fa;color:#111827;cursor:pointer;text-align:center;transition:border-color .12s,transform .12s,box-shadow .12s}
.sp-chat-theme-choice:hover{transform:translateY(-1px);box-shadow:0 5px 15px rgba(15,23,42,.12)}
.sp-chat-theme-choice:focus-visible{outline:3px solid color-mix(in srgb,#0866ff 28%,transparent);outline-offset:2px}
.sp-chat-theme-choice.is-selected{border-color:#0866ff;box-shadow:0 0 0 2px rgba(8,102,255,.13)}
.sp-chat-theme-choice>img,.sp-chat-theme-default-preview{width:100%;height:116px;display:block;object-fit:cover;background:#eef2f7}
.sp-chat-theme-default-preview{background:linear-gradient(145deg,#f6f8fb 0 48%,var(--sp-preview-accent,#0084ff) 49% 100%)}
.sp-chat-theme-choice>span:not(.sp-chat-theme-default-preview){display:block;padding:7px 6px 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:750}
.sp-chat-theme-choice>i{position:absolute;right:7px;top:7px;width:23px;height:23px;display:none;place-items:center;border-radius:50%;background:#0866ff;color:#fff;border:2px solid #fff;font-style:normal;font-size:12px;font-weight:900;box-shadow:0 1px 5px rgba(0,0,0,.2)}
.sp-chat-theme-choice.is-selected>i{display:grid}
.sp-chat-theme-choice:disabled{opacity:.65;cursor:wait}

/* Popup is narrow after adding the three-dot option. */
@media(min-width:800px){
  .sp-quick-chat-actions button{width:28px!important;height:28px!important;flex:0 0 28px!important}
  .sp-quick-chat>header strong,.sp-quick-chat>header small{max-width:128px!important}
}

/* Dark site chrome; theme message surfaces intentionally remain high-contrast. */
body.sp-theme-dark .sp-chat-options-menu{background:#242526;color:#e4e6eb;border-color:#3e4042;box-shadow:0 14px 38px rgba(0,0,0,.5)}
body.sp-theme-dark .sp-chat-options-menu button{color:#e4e6eb}
body.sp-theme-dark .sp-chat-options-menu button:hover,body.sp-theme-dark .sp-chat-options-menu button:focus-visible{background:#3a3b3c}
body.sp-theme-dark .sp-chat-options-menu button>span{background:#3a3b3c;color:#b388ff}
body.sp-theme-dark .sp-chat-theme-panel{background:#242526;color:#e4e6eb;border-color:#3e4042;box-shadow:0 28px 70px rgba(0,0,0,.55)}
body.sp-theme-dark .sp-chat-theme-panel>header{border-color:#3e4042}
body.sp-theme-dark .sp-chat-theme-panel>header button{background:#3a3b3c;color:#e4e6eb}
body.sp-theme-dark .sp-chat-theme-choice{background:#303132;color:#e4e6eb}

@media(max-width:760px){
  .sp-chat-theme-picker{place-items:end center;padding:0}
  .sp-chat-theme-panel{width:100%;max-height:min(76dvh,680px);border-left:0;border-right:0;border-bottom:0;border-radius:22px 22px 0 0;padding-bottom:env(safe-area-inset-bottom,0px)}
  .sp-chat-theme-panel>header{height:52px;flex-basis:52px;padding-left:16px}
  .sp-chat-theme-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:10px 10px 14px}
  .sp-chat-theme-choice>img,.sp-chat-theme-default-preview{height:105px}
  .sp-chat-theme-choice>span:not(.sp-chat-theme-default-preview){font-size:10px;padding-top:6px}
  body.sp-messages-route .sp-chat-options-trigger{display:grid!important}
}

@media(max-width:390px){
  .sp-chat-theme-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:9px 8px 12px}
  .sp-chat-theme-choice>img,.sp-chat-theme-default-preview{height:92px}
}


/* V4.10.78 — HD wallpaper rendering. The catalog now points at ~2160px-high
   WebP derivatives, so the browser no longer has to magnify 197–415px source
   images across a modern phone screen. */
[data-chat-theme].has-chat-image-theme .sp-chat-scroll,
.sp-quick-chat[data-chat-theme].has-chat-image-theme .sp-chat-scroll{
  background-size:cover!important;
  background-position:50% 50%!important;
  background-repeat:no-repeat!important;
  image-rendering:auto!important;
  -webkit-font-smoothing:antialiased;
}