/* TD AI WhatsApp 01127463877 · WhatsApp parity refine v1.1.2 */
html[data-theme="whatsapp"] body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  color: #111b21;
}

/* Hide banners that block the view */
html[data-theme="whatsapp"] body .monitor-banner,
html[data-theme="whatsapp"] body .chat-panel > .monitor-banner,
html[data-theme="whatsapp"] body [data-monitor-banner],
html[data-theme="whatsapp"] body .secondary-instance-banner,
html[data-theme="whatsapp"] body .secondary-instance-badge {
  display: none !important;
}

/* Softer WhatsApp-like base surfaces */
html[data-theme="whatsapp"] body .conversation-panel.ai-inbox-panel,
html[data-theme="whatsapp"] body .customer-details {
  background: #f7f5f1 !important;
}
html[data-theme="whatsapp"] body .panel-header,
html[data-theme="whatsapp"] body .details-header,
html[data-theme="whatsapp"] body .chat-header,
html[data-theme="whatsapp"] body .composer,
html[data-theme="whatsapp"] body .composer-input-shell,
html[data-theme="whatsapp"] body .chat-panel,
html[data-theme="whatsapp"] body .chat-search-panel {
  background: #f0f2f5 !important;
}
html[data-theme="whatsapp"] body .conversation-panel,
html[data-theme="whatsapp"] body .chat-panel,
html[data-theme="whatsapp"] body .customer-details,
html[data-theme="whatsapp"] body .panel-header,
html[data-theme="whatsapp"] body .details-header,
html[data-theme="whatsapp"] body .chat-header,
html[data-theme="whatsapp"] body .composer {
  border-color: #d9e0e3 !important;
}

/* WhatsApp wallpaper */
html[data-theme="whatsapp"] body .message-list {
  background-color: #efeae2 !important;
  background-image: url('/wa-bg-clear-v116.png') !important;
  background-repeat: repeat !important;
  background-size: 340px auto !important;
  padding: 18px 24px 20px !important;
}

/* Header / search / tabs */
html[data-theme="whatsapp"] body .panel-header h1 {
  font-size: 22px !important;
  line-height: 1.2 !important;
  font-weight: 760 !important;
  letter-spacing: -.01em !important;
  color: #111b21 !important;
}
html[data-theme="whatsapp"] body #contact-name,
html[data-theme="whatsapp"] body .chat-header h3 {
  font-size: 18px !important;
  line-height: 1.25 !important;
  font-weight: 730 !important;
  color: #111b21 !important;
}
html[data-theme="whatsapp"] body .inbox-search-row,
html[data-theme="whatsapp"] body .chat-search-input-shell,
html[data-theme="whatsapp"] body .message-editor,
html[data-theme="whatsapp"] body #translation-preview-text {
  background: #ffffff !important;
  border-color: #d5dde0 !important;
  box-shadow: 0 1px 2px rgba(17,27,33,.05) !important;
}
html[data-theme="whatsapp"] body #conversation-search,
html[data-theme="whatsapp"] body #chat-search-input,
html[data-theme="whatsapp"] body #forward-conversation-search,
html[data-theme="whatsapp"] body .message-editor {
  font-size: 15px !important;
  line-height: 1.45 !important;
  color: #17232a !important;
}
html[data-theme="whatsapp"] body #conversation-search::placeholder,
html[data-theme="whatsapp"] body #chat-search-input::placeholder,
html[data-theme="whatsapp"] body #forward-conversation-search::placeholder,
html[data-theme="whatsapp"] body .message-editor[data-placeholder]:empty::before {
  color: #6d7f87 !important;
  opacity: 1 !important;
}
html[data-theme="whatsapp"] body .inbox-tabs button,
html[data-theme="whatsapp"] body .wa-archived-row { font-size: 14px !important; }

/* Left conversation list */
html[data-theme="whatsapp"] body .conversation-item {
  padding: 13px 14px !important;
  border-bottom: 1px solid #ece7e0 !important;
}
html[data-theme="whatsapp"] body .conversation-item h4,
html[data-theme="whatsapp"] body .conversation-name-text {
  font-size: 16px !important;
  line-height: 1.25 !important;
  font-weight: 700 !important;
  color: #111b21 !important;
}
html[data-theme="whatsapp"] body .conversation-item p,
html[data-theme="whatsapp"] body .conversation-preview-text {
  font-size: 14px !important;
  line-height: 1.38 !important;
  color: #5d717b !important;
}
html[data-theme="whatsapp"] body .conversation-item time,
html[data-theme="whatsapp"] body .conversation-platform-source,
html[data-theme="whatsapp"] body .conversation-platform-pill {
  font-size: 12px !important;
}
html[data-theme="whatsapp"] body .conversation-item:hover {
  background: #f1f3f4 !important;
}
html[data-theme="whatsapp"] body .conversation-item.active {
  background: #eaf3ef !important;
}

/* Date chip */
html[data-theme="whatsapp"] body .message-divider,
html[data-theme="whatsapp"] body .day-separator,
html[data-theme="whatsapp"] body .date-chip {
  background: #ffffffd9 !important;
  color: #667781 !important;
  border: 1px solid #dde4e7 !important;
  box-shadow: 0 1px 1px rgba(17,27,33,.05) !important;
}

/* Message rows */
html[data-theme="whatsapp"] body .message-row {
  margin: 4px 0 !important;
  position: relative !important;
  contain: layout paint style !important;
}
html[data-theme="whatsapp"] body .message-row.outbound { justify-content: flex-end !important; }

/* Bubble sizing */
html[data-theme="whatsapp"] body .bubble,
html[data-theme="whatsapp"] body .message-row .bubble {
  position: relative !important;
  overflow: visible !important;
  width: auto !important;
  max-width: min(64%, 760px) !important;
  padding: 8px 10px 6px !important;
  border: 1px solid rgba(17,27,33,.06) !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #111b21 !important;
  box-shadow: 0 1px 0 rgba(17,27,33,.06), 0 1px 2px rgba(17,27,33,.08) !important;
}
html[data-theme="whatsapp"] body .message-row.outbound .bubble {
  background: #d9fdd3 !important;
}
/* smaller width for media / file style cards */
html[data-theme="whatsapp"] body .bubble.has-compact-image,
html[data-theme="whatsapp"] body .bubble.has-document-media,
html[data-theme="whatsapp"] body .bubble.has-contact-card,
html[data-theme="whatsapp"] body .bubble.has-template-message,
html[data-theme="whatsapp"] body .bubble:has(> video),
html[data-theme="whatsapp"] body .bubble:has(> audio),
html[data-theme="whatsapp"] body .bubble:has(.special-card),
html[data-theme="whatsapp"] body .bubble:has(.chat-media-image) {
  max-width: min(395px, 42vw) !important;
}

/* WhatsApp-like tails */
html[data-theme="whatsapp"] body .message-row.inbound .bubble::before {
  content: '';
  position: absolute;
  left: -7px;
  top: 0;
  width: 10px;
  height: 12px;
  background: linear-gradient(135deg, #ffffff 0 54%, transparent 55% 100%);
}
html[data-theme="whatsapp"] body .message-row.outbound .bubble::after {
  content: '';
  position: absolute;
  right: -7px;
  top: 0;
  width: 10px;
  height: 12px;
  background: linear-gradient(225deg, #d9fdd3 0 54%, transparent 55% 100%);
}

/* Bubble content typography */
html[data-theme="whatsapp"] body .message-body-text,
html[data-theme="whatsapp"] body .bubble,
html[data-theme="whatsapp"] body .bubble p,
html[data-theme="whatsapp"] body .bubble li {
  font-size: 15.6px !important;
  line-height: 1.44 !important;
  color: #111b21 !important;
}
html[data-theme="whatsapp"] body .bubble small {
  display: block !important;
  margin-top: 4px !important;
  font-size: 11.2px !important;
  line-height: 1.2 !important;
  color: #667781 !important;
  text-align: right !important;
}
html[data-theme="whatsapp"] body .bubble .ai-badge { color: #155c49 !important; }
html[data-theme="whatsapp"] body .bubble a { color: #0a7c66 !important; }
html[data-theme="whatsapp"] body .bubble img,
html[data-theme="whatsapp"] body .bubble video { border-radius: 7px !important; }
html[data-theme="whatsapp"] body .bubble audio { width: min(320px, 100%) !important; }

/* Translation / analysis hierarchy */
html[data-theme="whatsapp"] body .translation,
html[data-theme="whatsapp"] body .source-text,
html[data-theme="whatsapp"] body .transcription,
html[data-theme="whatsapp"] body .image-analysis,
html[data-theme="whatsapp"] body .video-analysis,
html[data-theme="whatsapp"] body .document-analysis {
  margin-top: 8px !important;
  padding: 8px 10px !important;
  border: 1px solid rgba(17,27,33,.08) !important;
  border-left: 3px solid #8fd3a0 !important;
  border-radius: 7px !important;
  background: rgba(255,255,255,.58) !important;
  color: #21363f !important;
  font-size: 14.8px !important;
  line-height: 1.54 !important;
}
html[data-theme="whatsapp"] body .message-row.inbound .translation,
html[data-theme="whatsapp"] body .message-row.inbound .source-text,
html[data-theme="whatsapp"] body .message-row.inbound .transcription,
html[data-theme="whatsapp"] body .message-row.inbound .image-analysis,
html[data-theme="whatsapp"] body .message-row.inbound .video-analysis,
html[data-theme="whatsapp"] body .message-row.inbound .document-analysis {
  background: #f7f9fa !important;
}
html[data-theme="whatsapp"] body .translation::before,
html[data-theme="whatsapp"] body .transcription::before,
html[data-theme="whatsapp"] body .image-analysis::before,
html[data-theme="whatsapp"] body .video-analysis::before,
html[data-theme="whatsapp"] body .document-analysis::before {
  font-size: 11.4px !important;
  font-weight: 850 !important;
  color: #008069 !important;
  letter-spacing: .02em !important;
}
html[data-theme="whatsapp"] body #translation-preview-text,
html[data-theme="whatsapp"] body .translation-original-text,
html[data-theme="whatsapp"] body .translation-result-field,
html[data-theme="whatsapp"] body .translation-preview-status {
  font-size: 14.8px !important;
  line-height: 1.5 !important;
}

/* Message action trigger hidden until hover */
html[data-theme="whatsapp"] body .message-actions-shell {
  position: absolute !important;
  top: 6px !important;
  right: 6px !important;
  z-index: 18 !important;
}
html[data-theme="whatsapp"] body .message-actions-trigger {
  width: 22px !important;
  height: 22px !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(241,246,245,.92)) !important;
  color: #54656f !important;
  box-shadow: 0 1px 2px rgba(17,27,33,.12) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translateY(-2px) !important;
  transition: opacity .14s ease, transform .14s ease, background .14s ease !important;
}
html[data-theme="whatsapp"] body .message-row.outbound .message-actions-trigger {
  background: linear-gradient(180deg, rgba(245,250,243,.97), rgba(228,243,222,.95)) !important;
}
html[data-theme="whatsapp"] body .message-row:hover .message-actions-trigger,
html[data-theme="whatsapp"] body .message-row:focus-within .message-actions-trigger,
html[data-theme="whatsapp"] body .message-actions-shell.open .message-actions-trigger,
html[data-theme="whatsapp"] body .message-actions-trigger:focus-visible {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: none !important;
}
html[data-theme="whatsapp"] body .message-actions-trigger:hover,
html[data-theme="whatsapp"] body .message-actions-trigger:focus-visible {
  background: #ffffff !important;
  color: #111b21 !important;
}
html[data-theme="whatsapp"] body .message-action-menu {
  border: 1px solid #d7dee2 !important;
  border-radius: 11px !important;
  background: #ffffff !important;
  box-shadow: 0 12px 32px rgba(17,27,33,.18) !important;
}
html[data-theme="whatsapp"] body .message-action-menu .message-tool {
  color: #111b21 !important;
}
html[data-theme="whatsapp"] body .message-action-menu .message-tool:hover {
  background: #f3f6f7 !important;
}

/* Quick action buttons only on hover */
html[data-theme="whatsapp"] body .message-row .message-quick-actions {
  position: absolute !important;
  top: 50% !important;
  right: -50px !important;
  left: auto !important;
  display: inline-flex !important;
  gap: 8px !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translateY(-50%) translateX(6px) !important;
  transition: opacity .14s ease, transform .14s ease !important;
}
html[data-theme="whatsapp"] body .message-row.outbound .message-quick-actions {
  left: -50px !important;
  right: auto !important;
  transform: translateY(-50%) translateX(-6px) !important;
}
html[data-theme="whatsapp"] body .message-row:hover .message-quick-actions,
html[data-theme="whatsapp"] body .message-row:focus-within .message-quick-actions,
html[data-theme="whatsapp"] body .message-quick-actions:focus-within {
  opacity: 1 !important;
  pointer-events: auto !important;
}
html[data-theme="whatsapp"] body .message-row:hover .message-quick-actions { transform: translateY(-50%) !important; }
html[data-theme="whatsapp"] body .message-row.outbound:hover .message-quick-actions { transform: translateY(-50%) !important; }
html[data-theme="whatsapp"] body .message-quick-actions .message-quick-forward,
html[data-theme="whatsapp"] body .message-quick-actions .message-quick-reaction {
  width: 36px !important;
  height: 36px !important;
  border: 1px solid rgba(17,27,33,.10) !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  color: #667781 !important;
  box-shadow: 0 2px 4px rgba(17,27,33,.10) !important;
}

/* Customer details hierarchy */
html[data-theme="whatsapp"] body .details-header h3,
html[data-theme="whatsapp"] body #details-name {
  font-size: 17px !important;
  line-height: 1.28 !important;
  font-weight: 740 !important;
  color: #111b21 !important;
}
html[data-theme="whatsapp"] body .details-profile,
html[data-theme="whatsapp"] body .details-list {
  border-color: #e2e7e9 !important;
  background: #ffffff !important;
  box-shadow: 0 1px 1px rgba(17,27,33,.04) !important;
}
html[data-theme="whatsapp"] body .details-list dt,
html[data-theme="whatsapp"] body #details-phone,
html[data-theme="whatsapp"] body .details-tip {
  font-size: 13px !important;
  line-height: 1.42 !important;
  color: #667781 !important;
}
html[data-theme="whatsapp"] body .details-list dd {
  font-size: 13.5px !important;
  color: #111b21 !important;
}
html[data-theme="whatsapp"] body .details-tip {
  border-left-color: #00a884 !important;
  background: #f1fbf7 !important;
}

/* Keyword highlighting */
html[data-theme="whatsapp"] body mark.td-keyword-hit {
  display: inline;
  padding: .01em .18em;
  border-radius: .32em;
  background: linear-gradient(180deg,#fff7a8 0%,#ffdf61 100%) !important;
  color: #5a4100 !important;
  font-weight: 850 !important;
  box-shadow: 0 0 0 1px rgba(224,166,0,.24);
}
html[data-theme="whatsapp"] body .message-row.td-search-match .bubble,
html[data-theme="whatsapp"] body .message-row.search-highlight .bubble {
  box-shadow: 0 0 0 3px rgba(255,207,43,.42), 0 5px 18px rgba(17,27,33,.10) !important;
}
html[data-theme="whatsapp"] body .conversation-item.td-search-match,
html[data-theme="whatsapp"] body .message-search-result.td-search-match { background: #fffceb !important; }
html[data-theme="whatsapp"] body .message-search-result strong { font-size: 15px !important; }
html[data-theme="whatsapp"] body .message-search-result small { font-size: 13px !important; line-height: 1.4 !important; }

@media (min-width: 1500px) {
  html[data-theme="whatsapp"] body .bubble,
  html[data-theme="whatsapp"] body .message-row .bubble { max-width: min(61%, 760px) !important; }
}
@media (max-width: 720px) {
  html[data-theme="whatsapp"] body .message-list { padding: 12px 12px 16px !important; background-size: 280px auto !important; }
  html[data-theme="whatsapp"] body .panel-header h1 { font-size: 20px !important; }
  html[data-theme="whatsapp"] body #contact-name,
  html[data-theme="whatsapp"] body .chat-header h3 { font-size: 17px !important; }
  html[data-theme="whatsapp"] body .conversation-item h4,
  html[data-theme="whatsapp"] body .conversation-name-text { font-size: 15px !important; }
  html[data-theme="whatsapp"] body .conversation-item p,
  html[data-theme="whatsapp"] body .conversation-preview-text { font-size: 13.5px !important; }
  html[data-theme="whatsapp"] body .bubble,
  html[data-theme="whatsapp"] body .message-body-text,
  html[data-theme="whatsapp"] body .translation,
  html[data-theme="whatsapp"] body .source-text,
  html[data-theme="whatsapp"] body .transcription,
  html[data-theme="whatsapp"] body .image-analysis,
  html[data-theme="whatsapp"] body .video-analysis,
  html[data-theme="whatsapp"] body .document-analysis,
  html[data-theme="whatsapp"] body .message-editor,
  html[data-theme="whatsapp"] body #translation-preview-text { font-size: 15px !important; }
  html[data-theme="whatsapp"] body .bubble,
  html[data-theme="whatsapp"] body .message-row .bubble { max-width: 84% !important; }
  html[data-theme="whatsapp"] body .bubble.has-compact-image,
  html[data-theme="whatsapp"] body .bubble.has-document-media,
  html[data-theme="whatsapp"] body .bubble.has-contact-card,
  html[data-theme="whatsapp"] body .bubble.has-template-message,
  html[data-theme="whatsapp"] body .bubble:has(> video),
  html[data-theme="whatsapp"] body .bubble:has(> audio),
  html[data-theme="whatsapp"] body .bubble:has(.special-card),
  html[data-theme="whatsapp"] body .bubble:has(.chat-media-image) { max-width: min(320px, 82vw) !important; }
  html[data-theme="whatsapp"] body .message-row .message-quick-actions,
  html[data-theme="whatsapp"] body .message-row.outbound .message-quick-actions {
    right: 8px !important; left: auto !important; top: auto !important; bottom: -42px !important; transform: none !important;
  }
}


/* v1.1.3 refinements: make media/file width match WhatsApp more closely */
html[data-theme="whatsapp"] body .bubble.has-document-media,
html[data-theme="whatsapp"] body .bubble.has-compact-image,
html[data-theme="whatsapp"] body .bubble:has(.chat-media-image),
html[data-theme="whatsapp"] body .bubble:has(img),
html[data-theme="whatsapp"] body .bubble:has(video),
html[data-theme="whatsapp"] body .bubble:has(audio),
html[data-theme="whatsapp"] body .bubble:has(.special-card) {
  width: min(390px, calc(100vw - 132px)) !important;
  max-width: min(390px, calc(100vw - 132px)) !important;
}
html[data-theme="whatsapp"] body .bubble.has-document-media,
html[data-theme="whatsapp"] body .bubble:has(audio),
html[data-theme="whatsapp"] body .bubble:has(video),
html[data-theme="whatsapp"] body .bubble:has(.chat-media-image),
html[data-theme="whatsapp"] body .bubble:has(.special-card) {
  padding: 0 !important;
  overflow: hidden !important;
}
html[data-theme="whatsapp"] body .bubble .chat-media-image,
html[data-theme="whatsapp"] body .bubble img,
html[data-theme="whatsapp"] body .bubble video,
html[data-theme="whatsapp"] body .bubble .special-card,
html[data-theme="whatsapp"] body .bubble .document-card,
html[data-theme="whatsapp"] body .bubble .document-preview,
html[data-theme="whatsapp"] body .bubble .document-media-card,
html[data-theme="whatsapp"] body .bubble .file-card {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}
html[data-theme="whatsapp"] body .bubble img,
html[data-theme="whatsapp"] body .bubble video {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
}
html[data-theme="whatsapp"] body .bubble audio {
  display: block !important;
  width: min(330px, 100%) !important;
  max-width: 100% !important;
  margin: 10px !important;
}
html[data-theme="whatsapp"] body .bubble.has-document-media .document-card,
html[data-theme="whatsapp"] body .bubble .document-card,
html[data-theme="whatsapp"] body .bubble .document-preview,
html[data-theme="whatsapp"] body .bubble .document-media-card,
html[data-theme="whatsapp"] body .bubble .file-card {
  padding: 12px 14px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
}
html[data-theme="whatsapp"] body .bubble .document-card img:first-child,
html[data-theme="whatsapp"] body .bubble .document-preview img:first-child,
html[data-theme="whatsapp"] body .bubble .document-media-card img:first-child,
html[data-theme="whatsapp"] body .bubble .file-card img:first-child {
  border-radius: 6px !important;
  margin-bottom: 10px !important;
}
html[data-theme="whatsapp"] body .bubble .document-card .title,
html[data-theme="whatsapp"] body .bubble .document-preview .title,
html[data-theme="whatsapp"] body .bubble .document-media-card .title,
html[data-theme="whatsapp"] body .bubble .file-card .title {
  font-size: 15px !important;
  line-height: 1.3 !important;
  font-weight: 500 !important;
  color: #111b21 !important;
}
html[data-theme="whatsapp"] body .bubble .document-card .meta,
html[data-theme="whatsapp"] body .bubble .document-preview .meta,
html[data-theme="whatsapp"] body .bubble .document-media-card .meta,
html[data-theme="whatsapp"] body .bubble .file-card .meta {
  font-size: 12px !important;
  color: #667781 !important;
}
/* hide per-bubble dropdown / chevron controls until hover */
html[data-theme="whatsapp"] body .bubble [class*="dropdown"],
html[data-theme="whatsapp"] body .bubble [class*="chevron"],
html[data-theme="whatsapp"] body .bubble [class*="expand-toggle"],
html[data-theme="whatsapp"] body .bubble [class*="menu-toggle"],
html[data-theme="whatsapp"] body .bubble [class*="message-menu"],
html[data-theme="whatsapp"] body .bubble [class*="bubble-menu"],
html[data-theme="whatsapp"] body .bubble button[aria-haspopup="menu"],
html[data-theme="whatsapp"] body .bubble button[aria-label*="menu" i],
html[data-theme="whatsapp"] body .bubble button[title*="menu" i] {
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity .14s ease !important;
}
html[data-theme="whatsapp"] body .message-row:hover .bubble [class*="dropdown"],
html[data-theme="whatsapp"] body .message-row:hover .bubble [class*="chevron"],
html[data-theme="whatsapp"] body .message-row:hover .bubble [class*="expand-toggle"],
html[data-theme="whatsapp"] body .message-row:hover .bubble [class*="menu-toggle"],
html[data-theme="whatsapp"] body .message-row:hover .bubble [class*="message-menu"],
html[data-theme="whatsapp"] body .message-row:hover .bubble [class*="bubble-menu"],
html[data-theme="whatsapp"] body .message-row:hover .bubble button[aria-haspopup="menu"],
html[data-theme="whatsapp"] body .message-row:hover .bubble button[aria-label*="menu" i],
html[data-theme="whatsapp"] body .message-row:hover .bubble button[title*="menu" i],
html[data-theme="whatsapp"] body .message-row:focus-within .bubble [class*="dropdown"],
html[data-theme="whatsapp"] body .message-row:focus-within .bubble [class*="chevron"],
html[data-theme="whatsapp"] body .message-row:focus-within .bubble [class*="expand-toggle"],
html[data-theme="whatsapp"] body .message-row:focus-within .bubble [class*="menu-toggle"],
html[data-theme="whatsapp"] body .message-row:focus-within .bubble [class*="message-menu"],
html[data-theme="whatsapp"] body .message-row:focus-within .bubble [class*="bubble-menu"],
html[data-theme="whatsapp"] body .message-row:focus-within .bubble button[aria-haspopup="menu"],
html[data-theme="whatsapp"] body .message-row:focus-within .bubble button[aria-label*="menu" i],
html[data-theme="whatsapp"] body .message-row:focus-within .bubble button[title*="menu" i] {
  opacity: 1 !important;
  pointer-events: auto !important;
}
@media (max-width: 920px) {
  html[data-theme="whatsapp"] body .bubble.has-document-media,
  html[data-theme="whatsapp"] body .bubble.has-compact-image,
  html[data-theme="whatsapp"] body .bubble:has(.chat-media-image),
  html[data-theme="whatsapp"] body .bubble:has(img),
  html[data-theme="whatsapp"] body .bubble:has(video),
  html[data-theme="whatsapp"] body .bubble:has(audio),
  html[data-theme="whatsapp"] body .bubble:has(.special-card) {
    width: min(360px, calc(100vw - 88px)) !important;
    max-width: min(360px, calc(100vw - 88px)) !important;
  }
}


/* =========================================================
   v1.1.4 — exact media width + caption fill + bubble-only hover
   ========================================================= */
:root { --td-wa-unified-media-width: 360px; }

/* JS adds td-media-unified only to real media/file/audio bubbles. */
html[data-theme="whatsapp"] body .message-row .bubble.td-media-unified {
  box-sizing: border-box !important;
  width: min(var(--td-wa-unified-media-width), calc(100vw - 120px)) !important;
  min-width: min(var(--td-wa-unified-media-width), calc(100vw - 120px)) !important;
  max-width: min(var(--td-wa-unified-media-width), calc(100vw - 120px)) !important;
  padding: 4px !important;
  overflow: visible !important;
  white-space: normal !important;
}

/* Override every historic per-type width so image/video/GIF/file/audio share one edge. */
html[data-theme="whatsapp"] body .message-row .bubble.td-media-unified.has-compact-image,
html[data-theme="whatsapp"] body .message-row .bubble.td-media-unified.has-sticker-media,
html[data-theme="whatsapp"] body .message-row .bubble.td-media-unified.has-gif-media,
html[data-theme="whatsapp"] body .message-row .bubble.td-media-unified.has-document-media {
  width: min(var(--td-wa-unified-media-width), calc(100vw - 120px)) !important;
  min-width: min(var(--td-wa-unified-media-width), calc(100vw - 120px)) !important;
  max-width: min(var(--td-wa-unified-media-width), calc(100vw - 120px)) !important;
}

html[data-theme="whatsapp"] body .bubble.td-media-unified > .chat-media-image,
html[data-theme="whatsapp"] body .bubble.td-media-unified > video.chat-history-video,
html[data-theme="whatsapp"] body .bubble.td-media-unified > video.chat-gif-video,
html[data-theme="whatsapp"] body .bubble.td-media-unified > video,
html[data-theme="whatsapp"] body .bubble.td-media-unified > .media-document {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

html[data-theme="whatsapp"] body .bubble.td-media-unified > .chat-media-image,
html[data-theme="whatsapp"] body .bubble.td-media-unified > video.chat-history-video,
html[data-theme="whatsapp"] body .bubble.td-media-unified > video.chat-gif-video,
html[data-theme="whatsapp"] body .bubble.td-media-unified > video {
  height: auto !important;
  max-height: 520px !important;
  object-fit: contain !important;
  object-position: center !important;
  border-radius: 7px !important;
  background: #111 !important;
}

/* Real stickers are allowed to keep transparency, but occupy the same card width. */
html[data-theme="whatsapp"] body .bubble.td-media-unified.has-sticker-media > .chat-media-image {
  width: 100% !important;
  max-width: 100% !important;
  max-height: 360px !important;
  object-fit: contain !important;
  background: transparent !important;
}

html[data-theme="whatsapp"] body .bubble.td-media-unified > audio {
  display: block !important;
  box-sizing: border-box !important;
  width: calc(100% - 12px) !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 8px 6px !important;
}

/* PDF / document preview card: exact same media width. */
html[data-theme="whatsapp"] body .bubble.td-media-unified .media-document {
  display: grid !important;
  grid-template-columns: 1fr !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  border-radius: 7px !important;
}
html[data-theme="whatsapp"] body .bubble.td-media-unified .media-document-preview-shell {
  width: 100% !important;
  height: 112px !important;
  min-height: 112px !important;
  max-height: 112px !important;
}
html[data-theme="whatsapp"] body .bubble.td-media-unified .media-document-preview {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  height: 112px !important;
  min-height: 112px !important;
  object-fit: cover !important;
  object-position: center top !important;
}
html[data-theme="whatsapp"] body .bubble.td-media-unified .media-document-info {
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 10px 12px !important;
}

/* Fix the red-box problem: caption/text under media must use all available width. */
html[data-theme="whatsapp"] body .bubble.td-media-unified > .message-caption,
html[data-theme="whatsapp"] body .bubble.td-media-unified > .message-body-text,
html[data-theme="whatsapp"] body .bubble.td-media-unified > span.message-body-text,
html[data-theme="whatsapp"] body .bubble.td-media-unified > span:not(.ai-badge):not(.reaction-list) {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 8px 8px 4px !important;
  white-space: pre-wrap !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
  line-height: 1.46 !important;
}
html[data-theme="whatsapp"] body .bubble.td-media-unified > .source-text,
html[data-theme="whatsapp"] body .bubble.td-media-unified > .translation,
html[data-theme="whatsapp"] body .bubble.td-media-unified > .transcription,
html[data-theme="whatsapp"] body .bubble.td-media-unified > .image-analysis,
html[data-theme="whatsapp"] body .bubble.td-media-unified > .video-analysis,
html[data-theme="whatsapp"] body .bubble.td-media-unified > .document-analysis {
  box-sizing: border-box !important;
  width: calc(100% - 12px) !important;
  max-width: none !important;
  margin: 7px 6px 4px !important;
}

/* The old CSS used .message-row:hover, which is too broad. Kill it completely. */
html[data-theme="whatsapp"] body .message-row .message-actions-trigger,
html[data-theme="whatsapp"] body .message-row:hover .message-actions-trigger,
html[data-theme="whatsapp"] body .message-row:focus-within .message-actions-trigger,
html[data-theme="whatsapp"] body .message-row .message-quick-actions,
html[data-theme="whatsapp"] body .message-row:hover .message-quick-actions,
html[data-theme="whatsapp"] body .message-row:focus-within .message-quick-actions {
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Only the bubble that JS says is actually hovered may reveal actions. */
html[data-theme="whatsapp"] body .bubble.td-bubble-hover > .message-actions-shell .message-actions-trigger,
html[data-theme="whatsapp"] body .bubble.td-bubble-hover > .message-quick-actions,
html[data-theme="whatsapp"] body .bubble.td-bubble-menu-open > .message-actions-shell .message-actions-trigger,
html[data-theme="whatsapp"] body .bubble.td-bubble-menu-open > .message-quick-actions {
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* Keep WhatsApp placement: small arrow inside top-right, reaction/forward beside bubble. */
html[data-theme="whatsapp"] body .bubble > .message-actions-shell {
  top: 0 !important;
  right: 0 !important;
}
html[data-theme="whatsapp"] body .bubble > .message-actions-shell .message-actions-trigger {
  width: 30px !important;
  height: 28px !important;
  border-radius: 0 7px 0 8px !important;
  box-shadow: none !important;
  transition: opacity .12s ease !important;
}
html[data-theme="whatsapp"] body .message-row .bubble > .message-quick-actions {
  top: 50% !important;
  right: -84px !important;
  left: auto !important;
  transform: translateY(-50%) !important;
}
html[data-theme="whatsapp"] body .message-row.outbound .bubble > .message-quick-actions {
  right: auto !important;
  left: -84px !important;
}

@media (max-width: 720px) {
  :root { --td-wa-unified-media-width: min(76vw, 330px); }
  html[data-theme="whatsapp"] body .message-row .bubble.td-media-unified,
  html[data-theme="whatsapp"] body .message-row .bubble.td-media-unified.has-compact-image,
  html[data-theme="whatsapp"] body .message-row .bubble.td-media-unified.has-sticker-media,
  html[data-theme="whatsapp"] body .message-row .bubble.td-media-unified.has-gif-media,
  html[data-theme="whatsapp"] body .message-row .bubble.td-media-unified.has-document-media {
    width: var(--td-wa-unified-media-width) !important;
    min-width: var(--td-wa-unified-media-width) !important;
    max-width: var(--td-wa-unified-media-width) !important;
  }
}


/* v1.1.5 — mobile WhatsApp long-press context + precise forward shortcut */
@media (max-width: 720px), (pointer: coarse) {
  html[data-theme="whatsapp"] body #message-list .bubble {
    -webkit-touch-callout: none !important;
  }

  /* Mobile has no desktop chevron. Long-press is the menu entry point. */
  html[data-theme="whatsapp"] body #message-list .message-actions-trigger {
    display: none !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  /* Like WhatsApp mobile: one permanent round forward shortcut beside each message. */
  html[data-theme="whatsapp"] body #message-list .message-row .message-quick-actions {
    position: absolute !important;
    z-index: 34 !important;
    top: 50% !important;
    right: -38px !important;
    left: auto !important;
    bottom: auto !important;
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(-50%) !important;
  }
  html[data-theme="whatsapp"] body #message-list .message-row.outbound .message-quick-actions {
    right: auto !important;
    left: -38px !important;
    transform: translateY(-50%) !important;
  }
  html[data-theme="whatsapp"] body #message-list .message-quick-actions .message-quick-reaction {
    display: none !important;
  }
  html[data-theme="whatsapp"] body #message-list .message-quick-actions .message-quick-forward {
    position: static !important;
    inset: auto !important;
    display: grid !important;
    place-items: center !important;
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid rgba(17,27,33,.12) !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,.94) !important;
    color: #596970 !important;
    box-shadow: 0 1px 4px rgba(11,20,26,.18) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
    touch-action: manipulation !important;
  }
  html[data-theme="whatsapp"] body #message-list .message-quick-actions .message-quick-forward svg {
    width: 17px !important;
    height: 17px !important;
    stroke-width: 1.8 !important;
  }

  /* Long-press context: selected bubble remains clear above the dimmed background. */
  html[data-theme="whatsapp"] body #message-list .message-row:has(.td-mobile-context-anchor) {
    position: relative !important;
    z-index: 10055 !important;
  }
  html[data-theme="whatsapp"] body #message-list .bubble.td-mobile-context-anchor {
    position: relative !important;
    z-index: 10056 !important;
    filter: none !important;
  }

  html[data-theme="whatsapp"] body > .message-action-backdrop:not(.hidden) {
    z-index: 10040 !important;
    display: block !important;
    background: rgba(0,0,0,.50) !important;
    -webkit-backdrop-filter: blur(7px) !important;
    backdrop-filter: blur(7px) !important;
  }

  /* WhatsApp-like context action sheet underneath the chosen message. */
  html[data-theme="whatsapp"] body > .message-action-menu.portal-open[data-open="1"] {
    z-index: 10065 !important;
    display: flex !important;
    flex-direction: column !important;
    width: min(286px, calc(100vw - 24px)) !important;
    min-width: min(236px, calc(100vw - 24px)) !important;
    max-width: calc(100vw - 24px) !important;
    max-height: min(58dvh, 410px) !important;
    padding: 6px 0 !important;
    overflow-y: auto !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 12px !important;
    background: rgba(31,31,31,.97) !important;
    color: #f5f5f5 !important;
    box-shadow: 0 16px 42px rgba(0,0,0,.42) !important;
    -webkit-backdrop-filter: blur(18px) !important;
    backdrop-filter: blur(18px) !important;
  }
  html[data-theme="whatsapp"] body > .message-action-menu.portal-open[data-open="1"] .message-tool {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 43px !important;
    margin: 0 !important;
    padding: 9px 16px !important;
    gap: 12px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #f2f2f2 !important;
    font-size: 14.5px !important;
    font-weight: 400 !important;
    line-height: 20px !important;
    text-align: left !important;
  }
  html[data-theme="whatsapp"] body > .message-action-menu.portal-open[data-open="1"] .message-tool span {
    order: 1 !important;
    flex: 1 1 auto !important;
    color: inherit !important;
    font: inherit !important;
  }
  html[data-theme="whatsapp"] body > .message-action-menu.portal-open[data-open="1"] .message-tool svg {
    order: 2 !important;
    display: block !important;
    flex: 0 0 18px !important;
    width: 18px !important;
    height: 18px !important;
    margin-left: auto !important;
    stroke: currentColor !important;
    fill: none !important;
    opacity: .92 !important;
  }
  html[data-theme="whatsapp"] body > .message-action-menu.portal-open[data-open="1"] .message-tool:active,
  html[data-theme="whatsapp"] body > .message-action-menu.portal-open[data-open="1"] .message-tool:focus-visible {
    background: rgba(255,255,255,.09) !important;
  }
  html[data-theme="whatsapp"] body > .message-action-menu.portal-open[data-open="1"] .message-tool.danger-link {
    color: #ff5b7d !important;
  }

  /* Reaction strip above the selected message, matching WhatsApp mobile. */
  html[data-theme="whatsapp"] body > .td-quick-reaction-bar {
    z-index: 10075 !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    padding: 5px 7px !important;
    gap: 2px !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 24px !important;
    background: rgba(37,37,37,.98) !important;
    box-shadow: 0 12px 32px rgba(0,0,0,.40) !important;
    -webkit-backdrop-filter: blur(18px) !important;
    backdrop-filter: blur(18px) !important;
  }
  html[data-theme="whatsapp"] body > .td-quick-reaction-bar > button {
    flex: 0 0 36px !important;
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    border-radius: 18px !important;
    font-size: 21px !important;
  }
}


/* v1.1.6 — user-adjustable text scale (Setting > 外观) */
html[data-theme="whatsapp"] {
  --td-font-chat: 15.6px;
  --td-font-translation: 14.8px;
  --td-font-list-name: 16px;
  --td-font-list-preview: 14px;
  --td-font-control: 15px;
  --td-font-chat-title: 18px;
  --td-font-details-title: 17px;
  --td-font-details: 13px;
  --td-font-meta: 11.2px;
}
html[data-theme="whatsapp"] body .message-body-text,
html[data-theme="whatsapp"] body .bubble,
html[data-theme="whatsapp"] body .bubble p,
html[data-theme="whatsapp"] body .bubble li {
  font-size: var(--td-font-chat) !important;
}
html[data-theme="whatsapp"] body .translation,
html[data-theme="whatsapp"] body .source-text,
html[data-theme="whatsapp"] body .transcription,
html[data-theme="whatsapp"] body .image-analysis,
html[data-theme="whatsapp"] body .video-analysis,
html[data-theme="whatsapp"] body .document-analysis,
html[data-theme="whatsapp"] body #translation-preview-text,
html[data-theme="whatsapp"] body .translation-original-text,
html[data-theme="whatsapp"] body .translation-result-field,
html[data-theme="whatsapp"] body .translation-preview-status {
  font-size: var(--td-font-translation) !important;
}
html[data-theme="whatsapp"] body .conversation-item h4,
html[data-theme="whatsapp"] body .conversation-name-text,
html[data-theme="whatsapp"] body .message-search-result strong,
html[data-theme="whatsapp"] body .chat-search-result-direction {
  font-size: var(--td-font-list-name) !important;
}
html[data-theme="whatsapp"] body .conversation-item p,
html[data-theme="whatsapp"] body .conversation-preview-text,
html[data-theme="whatsapp"] body .message-search-result small,
html[data-theme="whatsapp"] body .chat-search-result-snippet {
  font-size: var(--td-font-list-preview) !important;
}
html[data-theme="whatsapp"] body #conversation-search,
html[data-theme="whatsapp"] body #chat-search-input,
html[data-theme="whatsapp"] body #forward-conversation-search,
html[data-theme="whatsapp"] body .message-editor {
  font-size: var(--td-font-control) !important;
}
html[data-theme="whatsapp"] body #contact-name,
html[data-theme="whatsapp"] body .chat-header h3 {
  font-size: var(--td-font-chat-title) !important;
}
html[data-theme="whatsapp"] body .details-header h3,
html[data-theme="whatsapp"] body #details-name {
  font-size: var(--td-font-details-title) !important;
}
html[data-theme="whatsapp"] body .details-list dt,
html[data-theme="whatsapp"] body .details-list dd,
html[data-theme="whatsapp"] body #details-phone,
html[data-theme="whatsapp"] body .details-tip {
  font-size: var(--td-font-details) !important;
}
html[data-theme="whatsapp"] body .bubble small,
html[data-theme="whatsapp"] body .conversation-item time,
html[data-theme="whatsapp"] body .chat-search-result-time {
  font-size: var(--td-font-meta) !important;
}

/* Font-size setting card embedded inside Appearance. */
html[data-theme="whatsapp"] body .td-font-size-settings {
  margin-top: 18px;
  padding: 16px 17px;
  border: 1px solid #dfe5e8;
  border-radius: 14px;
  background: #fbfcfc;
  box-shadow: 0 1px 2px rgba(17,27,33,.04);
}
html[data-theme="whatsapp"] body .td-font-size-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}
html[data-theme="whatsapp"] body .td-font-size-head h4 {
  margin: 0 0 4px;
  color: #111b21;
  font-size: 16px;
  line-height: 1.3;
}
html[data-theme="whatsapp"] body .td-font-size-head p {
  margin: 0;
  color: #667781;
  font-size: 13px;
  line-height: 1.45;
}
html[data-theme="whatsapp"] body .td-font-size-value {
  min-width: 58px;
  padding: 6px 9px;
  border: 1px solid #cfe1d8;
  border-radius: 999px;
  background: #e7f8ee;
  color: #00735f;
  font-size: 13px;
  font-weight: 800;
  text-align: center;
}
html[data-theme="whatsapp"] body .td-font-size-slider-row {
  display: grid;
  grid-template-columns: auto minmax(120px,1fr) auto;
  align-items: center;
  gap: 12px;
}
html[data-theme="whatsapp"] body .td-font-size-slider-row > span {
  color: #667781;
  font-size: 12px;
  font-weight: 700;
}
html[data-theme="whatsapp"] body #td-font-size-range {
  width: 100%;
  accent-color: #00a884;
  cursor: pointer;
}
html[data-theme="whatsapp"] body .td-font-size-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-top: 12px;
}
html[data-theme="whatsapp"] body .td-font-size-preview {
  color: #3b4a54;
  font-size: 14px;
  line-height: 1.45;
}
html[data-theme="whatsapp"] body #td-font-size-reset {
  border: 1px solid #d6dee1;
  border-radius: 9px;
  background: #fff;
  color: #3b4a54;
  padding: 7px 11px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}
html[data-theme="whatsapp"] body #td-font-size-reset:hover { background: #f3f6f7; }

/* Search keyword highlight: stronger and consistent in result list + actual chat bubble. */
html[data-theme="whatsapp"] body .chat-search-keyword,
html[data-theme="whatsapp"] body mark.td-keyword-hit {
  padding: .02em .18em !important;
  border-radius: .28em !important;
  background: #ffe168 !important;
  color: #4f3a00 !important;
  font: inherit !important;
  font-weight: 850 !important;
  box-shadow: inset 0 0 0 1px rgba(218,164,0,.22) !important;
}
html[data-theme="whatsapp"] body .message-row.search-match .bubble,
html[data-theme="whatsapp"] body .message-row.td-search-match .bubble {
  box-shadow: 0 0 0 2px rgba(255,193,7,.32), 0 1px 2px rgba(17,27,33,.08) !important;
}

@media (max-width: 720px) {
  html[data-theme="whatsapp"] body .td-font-size-settings { padding: 14px; }
  html[data-theme="whatsapp"] body .td-font-size-slider-row { gap: 9px; }
  html[data-theme="whatsapp"] body .td-font-size-actions { align-items: flex-start; flex-direction: column; }
}