/*
 * TD AI Customer Service v2.6.0
 * Final mobile reference direction: compact WhatsApp-inspired white/green UI.
 * IMPORTANT: this file is the only mobile override loaded by the hotfix.
 */

:root {
  --td-wa-green: #008069;
  --td-wa-green-2: #00a884;
  --td-wa-green-soft: #e7f8ee;
  --td-wa-outgoing: #d9fdd3;
  --td-wa-chat-bg: #efeae2;
  --td-wa-app-bg: #f0f2f5;
  --td-wa-surface: #ffffff;
  --td-wa-surface-soft: #f7f8fa;
  --td-wa-border: #e4e8eb;
  --td-wa-text: #111b21;
  --td-wa-muted: #667781;
  --td-wa-danger: #e5484d;
}

/* Desktop behavior requested earlier: quick reaction + forward only on hover/focus. */
@media (min-width: 721px) and (hover: hover) and (pointer: fine) {
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .message-row .message-quick-actions {
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateY(-50%) scale(.96) !important;
    transition: opacity .14s ease, transform .14s ease !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .message-row:hover .message-quick-actions,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .message-row:focus-within .message-quick-actions,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .message-quick-actions:focus-within {
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: translateY(-50%) scale(1) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .bubble,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .bubble.has-compact-image,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .bubble.has-document-media,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .bubble.has-contact-card,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .bubble:has(video),
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .bubble:has(audio) {
    overflow: visible !important;
  }
}

@media (max-width: 720px) {
  html,
  body {
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
    background: var(--td-wa-app-bg) !important;
  }

  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] {
    color: var(--td-wa-text) !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
    font-size: 15px !important;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
  }

  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #mobile-status-tap-zone,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .app-sidebar-resizer,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .conversation-panel-resizer,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .customer-panel-resizer,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .sidebar-brand,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .connection-pill,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .nav-section-title,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .sidebar-footer {
    display: none !important;
  }

  /* ===== APP SHELL / BOTTOM NAV ===== */
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #app-view.app {
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    display: block !important;
    padding: 0 0 calc(68px + env(safe-area-inset-bottom)) !important;
    overflow: hidden !important;
    background: var(--td-wa-app-bg) !important;
  }

  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .sidebar {
    position: fixed !important;
    z-index: 100 !important;
    left: 0 !important;
    right: 0 !important;
    top: auto !important;
    bottom: 0 !important;
    width: 100% !important;
    height: calc(68px + env(safe-area-inset-bottom)) !important;
    min-height: calc(68px + env(safe-area-inset-bottom)) !important;
    max-height: calc(68px + env(safe-area-inset-bottom)) !important;
    display: block !important;
    padding: 6px 8px env(safe-area-inset-bottom) !important;
    border: 0 !important;
    border-top: 1px solid var(--td-wa-border) !important;
    background: rgba(255,255,255,.98) !important;
    box-shadow: 0 -4px 18px rgba(17,27,33,.05) !important;
    overflow: hidden !important;
  }

  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .sidebar::before,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .sidebar::after {
    content: none !important;
    display: none !important;
  }

  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #main-nav.nav {
    width: 100% !important;
    height: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0,1fr)) !important;
    align-items: center !important;
    gap: 4px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
  }

  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #main-nav.nav button {
    position: relative !important;
    min-width: 0 !important;
    width: 100% !important;
    height: 48px !important;
    min-height: 48px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 15px !important;
    background: transparent !important;
    color: #667781 !important;
    font-size: 0 !important; /* hides raw text nodes while retaining SVG */
    line-height: 0 !important;
    box-shadow: none !important;
    overflow: hidden !important;
  }

  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #main-nav.nav button .nav-icon {
    width: 24px !important;
    height: 24px !important;
    display: grid !important;
    place-items: center !important;
    font-size: 0 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #main-nav.nav button .nav-icon svg {
    width: 23px !important;
    height: 23px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.8 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #main-nav.nav button.active,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #main-nav.nav button[aria-current="page"] {
    background: var(--td-wa-green-soft) !important;
    color: var(--td-wa-green) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"].mobile-chat-active .sidebar {
    display: none !important;
  }

  /* ===== VIEW CONTAINERS ===== */
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .view,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view {
    box-sizing: border-box !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #app-view > .view:not(.hidden) {
    position: absolute !important;
    inset: 0 0 calc(68px + env(safe-area-inset-bottom)) 0 !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
  }

  /* ===== CHAT LIST ===== */
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-inbox.inbox-view {
    display: grid !important;
    grid-template-columns: 1fr !important;
    overflow: hidden !important;
    background: var(--td-wa-surface) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .conversation-panel.ai-inbox-panel {
    position: absolute !important;
    inset: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    border: 0 !important;
    background: var(--td-wa-surface) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .panel-header.ai-panel-header {
    position: relative !important;
    z-index: 30 !important;
    flex: 0 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    min-height: 0 !important;
    padding: calc(9px + env(safe-area-inset-top)) 12px 10px !important;
    border: 0 !important;
    background: linear-gradient(180deg, #008a70 0%, #008069 100%) !important;
    color: #fff !important;
    box-shadow: 0 1px 0 rgba(0,0,0,.05) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .inbox-heading-row {
    width: 100% !important;
    height: 42px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    min-width: 0 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .inbox-heading-row::before {
    content: "TD" !important;
    width: 34px !important;
    height: 34px !important;
    flex: 0 0 34px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 8px !important;
    background: #fff !important;
    color: var(--td-wa-green) !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    letter-spacing: -.04em !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .panel-header.ai-panel-header h1 {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    color: #fff !important;
    font-size: 17px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .wa-inbox-heading-actions {
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
    gap: 3px !important;
    margin-left: auto !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .panel-header.ai-panel-header .ai-icon-button,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .mobile-inbox-search-button {
    width: 36px !important;
    height: 36px !important;
    display: grid !important;
    place-items: center !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: #fff !important;
    box-shadow: none !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .panel-header.ai-panel-header .ai-icon-button svg,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .mobile-inbox-search-button svg {
    width: 21px !important;
    height: 21px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.8 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .mobile-inbox-search-button {
    appearance: none !important;
    cursor: pointer !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #inbox-search-row {
    display: none !important;
    width: 100% !important;
    min-height: 40px !important;
    margin: 7px 0 0 !important;
    padding: 0 10px !important;
    align-items: center !important;
    grid-template-columns: 19px minmax(0,1fr) auto !important;
    gap: 8px !important;
    border: 0 !important;
    border-radius: 11px !important;
    background: rgba(255,255,255,.16) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .conversation-panel.mobile-search-open #inbox-search-row {
    display: grid !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #inbox-search-row .wa-search-icon {
    width: 18px !important;
    height: 18px !important;
    color: rgba(255,255,255,.86) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #inbox-search-row input {
    width: 100% !important;
    height: 40px !important;
    padding: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    color: #fff !important;
    caret-color: #fff !important;
    font-size: 15px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #inbox-search-row input::placeholder {
    color: rgba(255,255,255,.82) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #inbox-search-close {
    width: 28px !important;
    height: 28px !important;
    color: #fff !important;
    background: transparent !important;
    border: 0 !important;
  }

  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #inbox-tabs.inbox-tabs {
    flex: 0 0 auto !important;
    position: relative !important;
    top: auto !important;
    z-index: 15 !important;
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 10px 12px !important;
    overflow-x: auto !important;
    border: 0 !important;
    border-bottom: 1px solid var(--td-wa-border) !important;
    background: #fff !important;
    scrollbar-width: none !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #inbox-tabs::-webkit-scrollbar { display: none !important; }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #inbox-tabs button {
    min-height: 32px !important;
    height: 32px !important;
    padding: 0 12px !important;
    border: 1px solid #dce3e6 !important;
    border-radius: 999px !important;
    background: #fff !important;
    color: #54656f !important;
    font-size: 13px !important;
    line-height: 30px !important;
    font-weight: 600 !important;
    box-shadow: none !important;
    white-space: nowrap !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #inbox-tabs button.active {
    border-color: #d3efd9 !important;
    background: var(--td-wa-green-soft) !important;
    color: #0c5c4a !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #inbox-tabs button span {
    min-width: 0 !important;
    height: auto !important;
    margin-left: 4px !important;
    padding: 0 !important;
    background: transparent !important;
    color: inherit !important;
    font-size: 11px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #wa-notification-banner,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #wa-archived-row,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #inbox-pull-indicator {
    display: none !important;
  }

  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #conversation-list.conversation-list {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    padding: 0 0 10px !important;
    background: #fff !important;
    -webkit-overflow-scrolling: touch !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .conversation-item {
    min-height: 72px !important;
    display: grid !important;
    grid-template-columns: 48px minmax(0,1fr) auto !important;
    gap: 10px !important;
    align-items: center !important;
    padding: 10px 12px !important;
    border: 0 !important;
    border-bottom: 1px solid #edf0f2 !important;
    background: #fff !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .conversation-item.active,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .conversation-item:active {
    background: #f3f7f5 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .conversation-avatar-wrap,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .conversation-avatar-wrap > .avatar {
    width: 48px !important;
    height: 48px !important;
    flex-basis: 48px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .conversation-platform-badge {
    right: -2px !important;
    bottom: -2px !important;
    min-width: 18px !important;
    height: 18px !important;
    border-width: 2px !important;
    font-size: 6px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .conversation-item h4 {
    margin: 0 0 3px !important;
    color: var(--td-wa-text) !important;
    font-size: 15.5px !important;
    line-height: 1.2 !important;
    font-weight: 600 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .conversation-preview-text,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .conversation-item p {
    margin: 0 !important;
    color: var(--td-wa-muted) !important;
    font-size: 13px !important;
    line-height: 1.25 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .conversation-platform-source,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .conversation-favourite-toggle,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .conversation-pin-toggle {
    display: none !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .conversation-meta {
    display: grid !important;
    justify-items: end !important;
    align-content: center !important;
    gap: 6px !important;
    min-width: 54px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .conversation-meta time {
    color: var(--td-wa-muted) !important;
    font-size: 11.5px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .unread {
    min-width: 20px !important;
    height: 20px !important;
    display: inline-grid !important;
    place-items: center !important;
    padding: 0 6px !important;
    border-radius: 999px !important;
    background: #25d366 !important;
    color: #fff !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
  }

  /* ===== CHAT DETAIL ===== */
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .chat-panel {
    position: fixed !important;
    z-index: 90 !important;
    inset: 0 !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
    background: var(--td-wa-chat-bg) !important;
    transform: translate3d(100%,0,0) !important;
    transition: transform .2s ease !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .chat-panel.mobile-open {
    transform: translate3d(0,0,0) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .chat-active {
    position: absolute !important;
    inset: 0 !important;
    display: grid !important;
    grid-template-rows: auto auto auto minmax(0,1fr) auto !important;
    min-height: 0 !important;
    background: var(--td-wa-chat-bg) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .center-empty,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .customer-details {
    display: none !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .chat-header.ai-chat-header {
    position: relative !important;
    z-index: 40 !important;
    min-height: 56px !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: calc(8px + env(safe-area-inset-top)) 7px 8px 5px !important;
    border: 0 !important;
    background: linear-gradient(180deg, #008a70 0%, #008069 100%) !important;
    color: #fff !important;
    box-shadow: 0 1px 0 rgba(0,0,0,.06) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .mobile-chat-back {
    width: 36px !important;
    height: 36px !important;
    flex: 0 0 36px !important;
    display: grid !important;
    place-items: center !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: #fff !important;
    box-shadow: none !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .mobile-chat-back.is-back-button::before {
    content: "‹" !important;
    color: #fff !important;
    font-size: 31px !important;
    line-height: 1 !important;
    font-weight: 300 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .contact-summary {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #contact-avatar {
    width: 36px !important;
    height: 36px !important;
    flex: 0 0 36px !important;
    border: 2px solid rgba(255,255,255,.82) !important;
    box-shadow: none !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #contact-name {
    margin: 0 !important;
    overflow: hidden !important;
    color: #fff !important;
    font-size: 15.5px !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #contact-phone {
    margin: 1px 0 0 !important;
    color: rgba(255,255,255,.82) !important;
    font-size: 11px !important;
    line-height: 1.15 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #contact-platform,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #contact-name-edit,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #customer-details-toggle,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #invoice-assistant-button,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #conversation-translate,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #conversation-ai {
    display: none !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .chat-actions {
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .chat-actions .ai-icon-button {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    display: grid !important;
    place-items: center !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: #fff !important;
    box-shadow: none !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .chat-actions .ai-icon-button svg {
    width: 20px !important;
    height: 20px !important;
  }

  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .message-list {
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    padding: 10px 10px 12px !important;
    background-color: var(--td-wa-chat-bg) !important;
    -webkit-overflow-scrolling: touch !important;
    scroll-padding-bottom: 68px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .message-row {
    margin: 5px 0 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .bubble {
    max-width: min(82%, 330px) !important;
    padding: 7px 9px 5px !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: #fff !important;
    color: var(--td-wa-text) !important;
    font-size: 14.5px !important;
    line-height: 1.42 !important;
    box-shadow: 0 1px 1px rgba(0,0,0,.07) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .message-row.outbound .bubble,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .outbound .bubble {
    background: var(--td-wa-outgoing) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .bubble small,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .message-meta {
    color: #667781 !important;
    font-size: 10.5px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .message-quick-actions {
    display: none !important; /* mobile uses long-press / existing action menu, no persistent clutter */
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .td-quick-reaction-bar {
    z-index: 250 !important;
    display: flex !important;
    align-items: center !important;
    gap: 2px !important;
    padding: 5px 7px !important;
    border: 1px solid #dde3e6 !important;
    border-radius: 22px !important;
    background: #fff !important;
    box-shadow: 0 8px 24px rgba(0,0,0,.13) !important;
  }

  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .composer {
    position: relative !important;
    z-index: 45 !important;
    display: block !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 6px 7px calc(7px + env(safe-area-inset-bottom)) !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .composer-toolbar,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .composer-hint {
    display: none !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .composer-input-shell {
    width: 100% !important;
    min-height: 50px !important;
    display: flex !important;
    align-items: flex-end !important;
    gap: 5px !important;
    margin: 0 !important;
    padding: 5px 5px 5px 7px !important;
    border: 1px solid #e0e5e8 !important;
    border-radius: 25px !important;
    background: #fff !important;
    box-shadow: 0 1px 1px rgba(0,0,0,.04) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .composer-bottom-bar {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    gap: 4px !important;
    min-height: 0 !important;
    padding: 0 !important;
    background: transparent !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .composer-tools,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .composer-actions {
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
    overflow: visible !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .tool-button,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .camera-gesture-button {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    display: grid !important;
    place-items: center !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: #54656f !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .tool-button svg,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .camera-gesture-button svg {
    width: 21px !important;
    height: 21px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #message-input {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    min-height: 24px !important;
    max-height: 112px !important;
    padding: 7px 5px !important;
    border: 0 !important;
    background: transparent !important;
    color: var(--td-wa-text) !important;
    font-size: 15px !important;
    line-height: 1.35 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .voice-message-button,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .send-icon-button {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    display: grid !important;
    place-items: center !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: var(--td-wa-green-2) !important;
    color: #fff !important;
    box-shadow: none !important;
  }

  /* Emoji picker: always anchored above composer on mobile. */
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #emoji-panel.emoji-panel:not(.hidden) {
    position: fixed !important;
    z-index: 240 !important;
    left: 8px !important;
    right: 8px !important;
    top: auto !important;
    bottom: calc(64px + env(safe-area-inset-bottom)) !important;
    width: auto !important;
    height: min(360px, 46dvh) !important;
    max-width: none !important;
    max-height: none !important;
    transform: none !important;
    overflow: hidden !important;
    border: 1px solid #dde3e6 !important;
    border-radius: 16px !important;
    background: #fff !important;
    box-shadow: 0 12px 34px rgba(0,0,0,.14) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #emoji-panel.hidden {
    display: none !important;
  }

  /* ===== GENERIC MOBILE ADMIN PAGES ===== */
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view {
    position: absolute !important;
    inset: 0 0 calc(68px + env(safe-area-inset-bottom)) 0 !important;
    height: auto !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    padding: 0 10px 18px !important;
    background: var(--td-wa-app-bg) !important;
    -webkit-overflow-scrolling: touch !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view .content-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 25 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    margin: 0 -10px 12px !important;
    padding: calc(10px + env(safe-area-inset-top)) 12px 10px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, #008a70 0%, #008069 100%) !important;
    color: #fff !important;
    box-shadow: 0 1px 0 rgba(0,0,0,.05) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view .content-header > div:first-child {
    min-width: 0 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view .content-header .eyebrow {
    display: none !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view .content-header h2 {
    margin: 0 !important;
    color: #fff !important;
    font-size: 18px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view .content-header p {
    margin: 2px 0 0 !important;
    overflow: hidden !important;
    color: rgba(255,255,255,.8) !important;
    font-size: 11px !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view .content-header .row {
    flex: 0 0 auto !important;
    display: flex !important;
    gap: 6px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view .content-header .button,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view .content-header button {
    min-height: 34px !important;
    padding: 0 10px !important;
    border: 1px solid rgba(255,255,255,.35) !important;
    border-radius: 10px !important;
    background: rgba(255,255,255,.12) !important;
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    box-shadow: none !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view .card,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view section.card,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view article.card {
    border: 1px solid var(--td-wa-border) !important;
    border-radius: 16px !important;
    background: #fff !important;
    color: var(--td-wa-text) !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.03) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view h3,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view h4,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view strong,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view label,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view summary {
    color: var(--td-wa-text) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view p,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view small,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view .muted {
    color: var(--td-wa-muted) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view input,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view textarea,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view select {
    width: 100% !important;
    max-width: 100% !important;
    border: 1px solid #d8e0e4 !important;
    border-radius: 11px !important;
    background: #fff !important;
    color: var(--td-wa-text) !important;
    font-size: 14px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view .button.primary,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .content-view button.primary {
    border-color: var(--td-wa-green) !important;
    background: var(--td-wa-green) !important;
    color: #fff !important;
  }

  /* ===== KNOWLEDGE BASE (reference screen 3) ===== */
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-knowledge .knowledge-dashboard {
    display: grid !important;
    gap: 12px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-knowledge .knowledge-stats {
    display: grid !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 8px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-knowledge .knowledge-stats article {
    min-width: 0 !important;
    padding: 10px !important;
    border: 1px solid var(--td-wa-border) !important;
    border-radius: 13px !important;
    background: #fff !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-knowledge .knowledge-stats span {
    display: block !important;
    margin-bottom: 3px !important;
    color: var(--td-wa-muted) !important;
    font-size: 10px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-knowledge .knowledge-stats strong {
    color: var(--td-wa-text) !important;
    font-size: 16px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-knowledge .knowledge-toolbar {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-knowledge .knowledge-search {
    position: relative !important;
    min-height: 42px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 0 11px !important;
    border: 1px solid var(--td-wa-border) !important;
    border-radius: 12px !important;
    background: #fff !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-knowledge .knowledge-search svg {
    width: 19px !important;
    height: 19px !important;
    min-width: 19px !important;
    max-width: 19px !important;
    min-height: 19px !important;
    max-height: 19px !important;
    overflow: visible !important;
    fill: none !important;
    stroke: var(--td-wa-muted) !important;
    stroke-width: 1.8 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-knowledge .knowledge-search svg circle,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-knowledge .knowledge-search svg path {
    fill: none !important;
    stroke: currentColor !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-knowledge .knowledge-search input {
    min-height: 38px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-knowledge .knowledge-filter {
    display: grid !important;
    grid-template-columns: auto 1fr !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 8px 10px !important;
    border: 1px solid var(--td-wa-border) !important;
    border-radius: 12px !important;
    background: #fff !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-knowledge .knowledge-filter span {
    color: var(--td-wa-muted) !important;
    font-size: 12px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-knowledge .knowledge-layout {
    display: block !important;
    margin-top: 12px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-knowledge #article-list.card-list {
    display: grid !important;
    gap: 8px !important;
    padding: 0 !important;
    min-height: 0 !important;
    background: transparent !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-knowledge .knowledge-card {
    padding: 12px !important;
    border-radius: 14px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-knowledge .knowledge-card h3 {
    margin: 0 0 5px !important;
    font-size: 14px !important;
    line-height: 1.25 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-knowledge .knowledge-card-preview {
    max-height: 38px !important;
    overflow: hidden !important;
    margin: 0 0 8px !important;
    color: var(--td-wa-muted) !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-knowledge .editor-card.hidden,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-knowledge .knowledge-empty-icon {
    display: none !important;
  }

  /* ===== CONNECTIONS (reference screen 4) ===== */
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .channel-summary-grid {
    display: grid !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 8px !important;
    margin-bottom: 10px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .channel-summary-card {
    min-width: 0 !important;
    padding: 10px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .channel-summary-card > span,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .channel-summary-card small {
    color: var(--td-wa-muted) !important;
    font-size: 9.5px !important;
    line-height: 1.2 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .channel-summary-card strong {
    display: block !important;
    margin: 3px 0 !important;
    color: var(--td-wa-text) !important;
    font-size: 18px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .channel-catalog-card,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .channel-connections-card,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .wa-account-sidebar,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .connection-card,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .qr-card {
    margin-bottom: 10px !important;
    padding: 12px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .section-heading-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .section-heading-row h3 {
    margin: 0 !important;
    font-size: 15px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .channel-platform-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    margin-top: 10px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .channel-platform-card {
    min-height: 0 !important;
    padding: 11px !important;
    border: 1px solid var(--td-wa-border) !important;
    border-radius: 13px !important;
    background: #fff !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .channel-platform-copy strong,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .channel-platform-copy b {
    color: var(--td-wa-text) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .channel-connections-list,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .wa-account-list {
    display: grid !important;
    gap: 8px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .wa-account-item {
    display: grid !important;
    grid-template-columns: auto minmax(0,1fr) auto !important;
    gap: 10px !important;
    align-items: center !important;
    padding: 11px !important;
    border: 1px solid var(--td-wa-border) !important;
    border-radius: 13px !important;
    background: #fff !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .wa-account-item.active {
    border-color: #b9dfc4 !important;
    background: #effaf3 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .multi-account-layout,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .connection-grid.multi-account-detail {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .whatsapp-subheader {
    margin-top: 12px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection #wa-large-dot.status-dot.large {
    width: 12px !important;
    height: 12px !important;
    margin: 4px auto 8px !important;
    border-radius: 50% !important;
    background: #b7c2c8 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection #wa-large-dot.connected {
    background: #25d366 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-connection .qr-placeholder {
    width: min(210px, 62vw) !important;
    height: min(210px, 62vw) !important;
    display: grid !important;
    place-items: center !important;
    margin: 8px auto !important;
    border: 1px dashed #9fb1bb !important;
    border-radius: 12px !important;
    color: var(--td-wa-muted) !important;
    background: #fafbfb !important;
  }

  /* ===== AI STUDIO / WORKFLOWS / SETTINGS ===== */
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-ai-studio .ai-profile-manager,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-ai-studio .ai-usage-dashboard,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-ai-studio .ai-studio-config,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-ai-studio .ai-playground,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-workflows .payment-trigger-card,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-settings .settings-card {
    margin-bottom: 10px !important;
    padding: 12px !important;
    border: 1px solid var(--td-wa-border) !important;
    border-radius: 15px !important;
    background: #fff !important;
    color: var(--td-wa-text) !important;
    box-shadow: none !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-ai-studio .ai-usage-periods,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-ai-studio .ai-studio-layout,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-settings .settings-layout {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-ai-studio .ai-token-breakdown {
    display: grid !important;
    grid-template-columns: repeat(5,minmax(0,1fr)) !important;
    overflow: hidden !important;
    border-radius: 13px !important;
    background: #111b21 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-ai-studio .ai-token-breakdown div {
    min-width: 0 !important;
    padding: 8px 5px !important;
    border-right: 1px solid rgba(255,255,255,.1) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-ai-studio .ai-token-breakdown span {
    color: #aebac1 !important;
    font-size: 8.5px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #view-ai-studio .ai-token-breakdown strong {
    display: block !important;
    margin-top: 2px !important;
    color: #fff !important;
    font-size: 11px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #settings-anchor-nav {
    display: flex !important;
    gap: 6px !important;
    overflow-x: auto !important;
    margin: 0 0 10px !important;
    padding: 4px 0 6px !important;
    scrollbar-width: none !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #settings-anchor-nav::-webkit-scrollbar { display:none !important; }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #settings-anchor-nav button {
    flex: 0 0 auto !important;
    min-height: 32px !important;
    padding: 0 11px !important;
    border: 1px solid var(--td-wa-border) !important;
    border-radius: 999px !important;
    background: #fff !important;
    color: var(--td-wa-muted) !important;
    font-size: 12px !important;
  }
}


/* v2.6.1 — iPhone/PWA interaction hardfix.
   The legacy app shell also positions .sidebar/.nav on mobile.  Keep the old
   sidebar completely non-interactive and mount #main-nav directly under body
   (mobile helper) so no transparent fixed layer can swallow taps. */
@media (max-width: 720px) {
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #page-progress,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #mobile-status-tap-zone {
    pointer-events: none !important;
  }

  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .sidebar {
    display: none !important;
    pointer-events: none !important;
    visibility: hidden !important;
  }

  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] > #main-nav.nav.td-mobile-bottom-nav {
    position: fixed !important;
    z-index: 1000 !important;
    top: auto !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: calc(68px + env(safe-area-inset-bottom)) !important;
    min-height: calc(68px + env(safe-area-inset-bottom)) !important;
    max-height: calc(68px + env(safe-area-inset-bottom)) !important;
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0,1fr)) !important;
    align-items: center !important;
    gap: 4px !important;
    margin: 0 !important;
    padding: 6px 8px env(safe-area-inset-bottom) !important;
    box-sizing: border-box !important;
    border: 0 !important;
    border-top: 1px solid var(--td-wa-border) !important;
    border-radius: 0 !important;
    background: rgba(255,255,255,.99) !important;
    box-shadow: 0 -4px 18px rgba(17,27,33,.05) !important;
    overflow: hidden !important;
    transform: none !important;
    filter: none !important;
    backdrop-filter: none !important;
    pointer-events: auto !important;
    visibility: visible !important;
    touch-action: manipulation !important;
  }

  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] > #main-nav.nav.td-mobile-bottom-nav button {
    position: relative !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 48px !important;
    min-height: 48px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 15px !important;
    background: transparent !important;
    color: #667781 !important;
    font-size: 0 !important;
    line-height: 0 !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
  }

  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] > #main-nav.nav.td-mobile-bottom-nav button.active,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] > #main-nav.nav.td-mobile-bottom-nav button[aria-current="page"] {
    background: var(--td-wa-green-soft) !important;
    color: var(--td-wa-green) !important;
  }

  /* A closed fixed chat panel must not exist in the hit-test tree on iOS. */
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .chat-panel:not(.mobile-open) {
    transform: translate3d(100%,0,0) !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .chat-panel.mobile-open {
    transform: translate3d(0,0,0) !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .conversation-panel,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .conversation-list,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .conversation-item,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .panel-header button,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .inbox-tabs button {
    pointer-events: auto !important;
    touch-action: manipulation !important;
  }

  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] dialog:not([open]),
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #image-lightbox[aria-hidden="true"],
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .media-overlay[aria-hidden="true"],
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #emoji-panel.hidden,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .hidden {
    pointer-events: none !important;
  }
}

/* v2.6.2 — annotated mobile chat layout hardfix.
   Fixes: duplicate inbox header above an open chat, removes video/voice icons,
   restores three-dot hit target/profile dialog, and moves the detached bottom
   nav lower while reserving real space for the composer. */
@media (max-width: 720px) {
  /* Use one compact chat header only. The legacy base stylesheet tries to push
     an open chat below the inbox header; this rule intentionally has higher
     specificity and comes last. */
  html[data-theme="whatsapp"] body[data-build="0.8.11"][data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"].mobile-chat-active .chat-panel.mobile-open {
    top: 0 !important;
    right: 0 !important;
    bottom: calc(56px + env(safe-area-inset-bottom)) !important;
    left: 0 !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translate3d(0,0,0) !important;
  }
  html[data-theme="whatsapp"] body[data-build="0.8.11"][data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"].mobile-chat-active .conversation-panel {
    visibility: hidden !important;
    pointer-events: none !important;
  }
  html[data-theme="whatsapp"] body[data-build="0.8.11"][data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"].mobile-chat-active .chat-active {
    position: absolute !important;
    inset: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    grid-template-rows: auto auto auto minmax(0,1fr) auto !important;
  }

  /* Annotated request: remove video and phone/call shortcuts on mobile. */
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #conversation-video-call,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #conversation-voice-call {
    display: none !important;
  }

  /* Keep Search + More aligned, large enough to tap, and never covered. */
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #chat-search-toggle,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #conversation-menu {
    position: relative !important;
    z-index: 60 !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    display: grid !important;
    place-items: center !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] .chat-actions {
    gap: 2px !important;
  }

  /* The menu opens the existing contact/profile drawer. Ensure it is visually
     on top and not styled off-screen by earlier mobile rules. */
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #contact-profile-dialog[open] {
    position: fixed !important;
    inset: 0 !important;
    z-index: 3000 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #fff !important;
    color: var(--td-wa-text) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #contact-profile-dialog[open]::backdrop {
    background: rgba(17,27,33,.28) !important;
  }

  /* Annotated request: bottom module bar sits lower and takes less vertical
     space. Reserve exactly the same height in list/admin views. */
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #app-view.app {
    padding-bottom: calc(56px + env(safe-area-inset-bottom)) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] #app-view > .view:not(.hidden) {
    inset: 0 0 calc(56px + env(safe-area-inset-bottom)) 0 !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] > #main-nav.nav.td-mobile-bottom-nav {
    bottom: 0 !important;
    height: calc(56px + env(safe-area-inset-bottom)) !important;
    min-height: calc(56px + env(safe-area-inset-bottom)) !important;
    max-height: calc(56px + env(safe-area-inset-bottom)) !important;
    align-items: end !important;
    padding: 3px 8px max(2px, env(safe-area-inset-bottom)) !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] > #main-nav.nav.td-mobile-bottom-nav button {
    height: 42px !important;
    min-height: 42px !important;
    border-radius: 13px !important;
  }
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] > #main-nav.nav.td-mobile-bottom-nav button .nav-icon,
  html[data-theme="whatsapp"] body[data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"] > #main-nav.nav.td-mobile-bottom-nav button .nav-icon svg {
    width: 22px !important;
    height: 22px !important;
  }

  /* In an open chat keep the composer above the bottom nav, instead of letting
     the nav cover it. */
  html[data-theme="whatsapp"] body[data-build="0.8.11"][data-mobile-theme-release="2.6.2-mobile-chat-layout-hardfix"].mobile-chat-active .composer {
    position: relative !important;
    z-index: 50 !important;
    padding: 5px 7px max(5px, env(safe-area-inset-bottom)) !important;
  }
}