/* Visual-only inbox refinement. Existing layout and behaviour stay unchanged. */
body.is-inbox {
  --ix-green: #10b85a;
  --ix-green-deep: #087f43;
  --ix-green-soft: #eaf8f0;
  --ix-text: #17251e;
  --ix-muted: #748078;
  --ix-border: #e3e9e5;
  --ix-subtle: #f7f9f8;
  --ix-chat: #f6f3ed;
  --ix-outgoing: #dcf8e4;
  color: var(--ix-text) !important;
}

body.is-inbox .cookies-card { display: none !important; }

body.is-inbox .chatbox-area,
body.is-inbox .chatbox-area__left,
body.is-inbox .chatbox-wrapper,
body.is-inbox .chatbox-area__body,
body.is-inbox .chat-box { background: #fff !important; }

body.is-inbox .empty-conversation {
  background: #f7f5ef !important;
}
body.is-inbox .empty-conversation__backdrop { opacity: .18 !important; }
body.is-inbox .empty-conversation__glow--one { background: rgba(16,184,90,.045) !important; }
body.is-inbox .empty-conversation__glow--two { background: rgba(16,184,90,.06) !important; }

body.is-inbox .dashboard .sidebar-menu {
  background: #fff !important;
  border-right-color: var(--ix-border) !important;
  box-shadow: none !important;
}

body.is-inbox .dashboard .sidebar-menu-list__link {
  border-radius: 12px !important;
  color: #52645a !important;
  transition: background-color .16s ease, color .16s ease !important;
}

body.is-inbox .dashboard .sidebar-menu-list__link:hover { background: #f4f8f5 !important; color: var(--ix-text) !important; }
body.is-inbox .dashboard .sidebar-menu-list__item.active > a,
body.is-inbox .dashboard .sidebar-menu-list__link.active {
  background: var(--ix-green-soft) !important;
  color: var(--ix-green-deep) !important;
  box-shadow: inset 0 0 0 1px rgba(16,184,90,.08) !important;
}
body.is-inbox .dashboard .sidebar-menu-list__link.active::before { display: none !important; }
body.is-inbox .dashboard .sidebar-menu-list__link.active .icon,
body.is-inbox .dashboard .sidebar-menu-list__link.active .icon i,
body.is-inbox .dashboard .sidebar-menu-list__link.active .text { color: var(--ix-green-deep) !important; }

body.is-inbox .chatbox-wrapper__header {
  background: rgba(255,255,255,.97) !important;
  border-bottom-color: var(--ix-border) !important;
}

body.is-inbox .conversation-search {
  background: var(--ix-subtle) !important;
  border-color: var(--ix-border) !important;
  color: var(--ix-text) !important;
  border-radius: 13px !important;
  box-shadow: none !important;
}
body.is-inbox .conversation-search::placeholder { color: #9aa39d !important; }
body.is-inbox .conversation-search:focus {
  background: #fff !important;
  border-color: #85d5a8 !important;
  box-shadow: 0 0 0 3px rgba(16,184,90,.09) !important;
}

body.is-inbox .new-chat-button {
  border-color: var(--ix-border) !important;
  border-radius: 12px !important;
  background: #fff !important;
  color: var(--ix-green-deep) !important;
  box-shadow: 0 2px 8px rgba(25,58,40,.05) !important;
}
body.is-inbox .new-chat-button:hover { background: var(--ix-green-soft) !important; border-color: #9bdcb6 !important; }

html body.is-inbox .dashboard .chatbox-wrapper__tab #chat-filters .nav-link {
  border-color: var(--ix-border) !important;
  background: #fff !important;
  color: #617068 !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}
html body.is-inbox .dashboard .chatbox-wrapper__tab #chat-filters .nav-link:hover { background: #f5f9f6 !important; border-color: #cbded2 !important; }
html body.is-inbox .dashboard .chatbox-wrapper__tab #chat-filters .nav-link.active {
  background: var(--ix-green-soft) !important;
  border-color: var(--ix-green) !important;
  color: var(--ix-green-deep) !important;
}
body.is-inbox .inbox-tab-unread-count,
body.is-inbox .nav-link.active .inbox-tab-unread-count,
body.is-inbox .unseen-message .badge { background: var(--ix-green) !important; color: #fff !important; }

html body.is-inbox .dashboard .chat-list__item {
  border-bottom-color: #edf1ee !important;
  background: #fff !important;
  transition: background-color .15s ease !important;
}
body.is-inbox .chatbody { background: #fafbfa !important; }
html body.is-inbox .dashboard .chat-list__item:hover { background: #f7faf8 !important; }
html body.is-inbox .dashboard .chat-list__item.active {
  background: var(--ix-green-soft) !important;
  box-shadow: inset 3px 0 0 var(--ix-green) !important;
}
body.is-inbox .chat-list__content p.text { color: var(--ix-text) !important; }
body.is-inbox .chat-list__content .last-message-row p.text { color: #7b8780 !important; }
body.is-inbox .chat-list__item.is-unread .last-message-row p.text { color: #405047 !important; }
body.is-inbox .chat-list__item .time { color: #8b9690 !important; }
body.is-inbox .chat-list__action-btn { border-radius: 9px !important; color: #6d7c74 !important; }
body.is-inbox .chat-list__action-btn:hover { background: #fff !important; color: var(--ix-green-deep) !important; }

body.is-inbox .chat-box__header {
  background: rgba(255,255,255,.97) !important;
  border-bottom-color: var(--ix-border) !important;
  box-shadow: none !important;
}
body.is-inbox .chat-box__content .name { color: var(--ix-text) !important; }
body.is-inbox .chat-box__content .text { color: var(--ix-muted) !important; }
body.is-inbox .header-action-btn,
body.is-inbox .message-inbox-btn {
  border-color: transparent !important;
  border-radius: 11px !important;
  background: transparent !important;
  color: #586b61 !important;
  box-shadow: none !important;
}
body.is-inbox .header-action-btn:hover,
body.is-inbox .message-inbox-btn:hover { background: #f1f6f3 !important; color: var(--ix-green-deep) !important; }
body.is-inbox .header-action-btn--danger { color: #d65b5b !important; }
body.is-inbox .header-action-btn--danger:hover { background: #fff0f0 !important; color: #c53e3e !important; }

body.is-inbox .msg-body,
body.is-inbox .chat-box-area,
html body.is-inbox .chatbox-area__body .body-middle {
  background-color: var(--ix-chat) !important;
  background-image: radial-gradient(rgba(53,83,66,.045) .75px, transparent .75px) !important;
  background-size: 18px 18px !important;
}
body.is-inbox .chat-box__shape { opacity: .11 !important; filter: grayscale(1); }
body.is-inbox .chat-date-separator span {
  background: rgba(255,255,255,.92) !important;
  color: #64736b !important;
  border: 1px solid rgba(40,68,52,.06) !important;
  border-radius: 999px !important;
  box-shadow: 0 4px 12px rgba(25,58,40,.07) !important;
}

html body.is-inbox .single-message .message-content {
  border: 1px solid rgba(35,65,48,.055) !important;
  border-radius: 13px !important;
  box-shadow: 0 3px 11px rgba(25,58,40,.055) !important;
}
html body.is-inbox .single-message.message--left .message-content { background: #fff !important; border-bottom-left-radius: 4px !important; }
html body.is-inbox .single-message.message--right .message-content { background: var(--ix-outgoing) !important; border-bottom-right-radius: 4px !important; }
html body.is-inbox .single-message .message-content .message-text { color: var(--ix-text) !important; }
html body.is-inbox .single-message .message-time { color: #87938c !important; }

body.is-inbox .chat-box__footer {
  background: rgba(255,255,255,.94) !important;
  border-top-color: var(--ix-border) !important;
  backdrop-filter: blur(16px);
}
html body.is-inbox .chatbox-area__body .chat-box__footer .chat-send-area:not(#_never_) {
  border: 1px solid var(--ix-border) !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 6px 22px rgba(25,58,40,.07) !important;
}
body.is-inbox .chat-send-area textarea.message-input {
  background: var(--ix-subtle) !important;
  border-color: transparent !important;
  border-radius: 11px !important;
  color: var(--ix-text) !important;
}
body.is-inbox .chat-send-area textarea.message-input:focus { background: #fff !important; }
body.is-inbox .chat-send-area .chat-media__btn,
body.is-inbox .chat-send-area .btn-item,
body.is-inbox .chat-send-area .emoji-icon { border-radius: 10px !important; color: #607269 !important; }
body.is-inbox #wa-window-timer span {
  background: #fff !important;
  color: #607168 !important;
  border: 1px solid var(--ix-border) !important;
  box-shadow: 0 4px 14px rgba(25,58,40,.07) !important;
}

body.is-inbox .dropdown-menu,
body.is-inbox .modal-content {
  border: 1px solid var(--ix-border) !important;
  border-radius: 14px !important;
  box-shadow: 0 18px 42px rgba(25,58,40,.12) !important;
}

@media (max-width: 767px) {
  body.is-inbox .chatbox-wrapper__header { padding-inline: 14px !important; }
  body.is-inbox .chat-box__header { padding-inline: 12px !important; }
  body.is-inbox .msg-body { padding-inline: 11px !important; }
  body.is-inbox .chat-box__footer { padding: 9px !important; }
}

/* Mobile composer: reserve a fixed action slot so typing cannot push the send
   control beyond the right edge of a narrow chat pane. */
@media (max-width: 991px) {
  html body.is-inbox .chatbox-area__body #message-form.chat-send-area,
  html body.is-inbox .chatbox-area__body #message-form .input-area {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  html body.is-inbox .chatbox-area__body #message-form .input-area {
    position: relative !important;
    padding-right: 44px !important;
    overflow: visible !important;
  }
  html body.is-inbox .chatbox-area__body #message-form .input-group {
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  html body.is-inbox .chatbox-area__body #message-form .send-text-btn,
  html body.is-inbox .chatbox-area__body #message-form .start-recording-btn {
    position: absolute !important;
    right: 2px !important;
    top: 50% !important;
    z-index: 5 !important;
    flex: 0 0 38px !important;
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    transform: translateY(-50%) !important;
  }
  html body.is-inbox .chatbox-area__body #message-form .send-text-btn:not(.d-none) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #00a884 !important;
    color: #fff !important;
    border-radius: 50% !important;
  }
  html body.is-inbox .chatbox-area__body #message-form .send-text-btn svg,
  html body.is-inbox .chatbox-area__body #message-form .send-text-btn svg path {
    display: block !important;
    stroke: #fff !important;
  }
}

/* Canonical send action on every viewport. Keep this after generic composer
   icon rules so the primary action never becomes a pale/transparent button. */
html body.is-inbox .chatbox-area__body #message-form .send-text-btn:not(.d-none):not(:disabled) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #00a884 !important;
  border: 1px solid #00a884 !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}
html body.is-inbox .chatbox-area__body #message-form .send-text-btn:not(.d-none):not(:disabled):hover,
html body.is-inbox .chatbox-area__body #message-form .send-text-btn:not(.d-none):not(:disabled):focus-visible {
  background: #008069 !important;
  border-color: #008069 !important;
  color: #fff !important;
  box-shadow: 0 0 0 3px rgba(0,168,132,.14) !important;
}
html body.is-inbox .chatbox-area__body #message-form .send-text-btn:not(.d-none) svg,
html body.is-inbox .chatbox-area__body #message-form .send-text-btn:not(.d-none) svg path {
  display: block !important;
  opacity: 1 !important;
  stroke: #fff !important;
}

/* Final mobile composer lock: input may shrink, action may not. */
@media (max-width: 991px) {
  html body.is-inbox .chatbox-area__body #message-form.chat-send-area,
  html body.is-inbox .chatbox-area__body #message-form .input-area {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  html body.is-inbox .chatbox-area__body #message-form .input-area {
    position: relative !important;
    padding-right: 44px !important;
    overflow: visible !important;
  }
  html body.is-inbox .chatbox-area__body #message-form .input-group {
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  html body.is-inbox .chatbox-area__body #message-form .send-text-btn,
  html body.is-inbox .chatbox-area__body #message-form .start-recording-btn {
    position: absolute !important;
    right: 2px !important;
    top: 50% !important;
    z-index: 5 !important;
    flex: 0 0 38px !important;
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    transform: translateY(-50%) !important;
  }
  html body.is-inbox .chatbox-area__body #message-form .send-text-btn:not(.d-none) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #00a884 !important;
    color: #fff !important;
    border-radius: 50% !important;
  }
  html body.is-inbox .chatbox-area__body #message-form .send-text-btn svg,
  html body.is-inbox .chatbox-area__body #message-form .send-text-btn svg path {
    display: block !important;
    stroke: #fff !important;
  }
}

/* WhatsApp-inspired palette and interaction states */
body.is-inbox {
  --wa-green: #00a884;
  --wa-green-dark: #008069;
  --wa-green-soft: #d9fdd3;
  --wa-header: #f0f2f5;
  --wa-search: #f0f2f5;
  --wa-hover: #f5f6f6;
  --wa-selected: #f0f2f5;
  --wa-chat: #efeae2;
  --wa-border: #e9edef;
  --wa-text: #111b21;
  --wa-muted: #667781;
  background: #fff !important;
  color: var(--wa-text) !important;
}

body.is-inbox .dashboard-header {
  background: #fff !important;
  border-bottom-color: var(--wa-border) !important;
}
body.is-inbox .dashboard-header h1,
body.is-inbox .dashboard-header h2,
body.is-inbox .dashboard-header h3,
body.is-inbox .dashboard-header .title { color: var(--wa-text) !important; }

body.is-inbox .dashboard .sidebar-menu {
  background: #fff !important;
  border-right-color: var(--wa-border) !important;
}
body.is-inbox .dashboard .sidebar-menu-list__link { color: #54656f !important; }
body.is-inbox .dashboard .sidebar-menu-list__link:hover { background: var(--wa-hover) !important; color: var(--wa-text) !important; }
body.is-inbox .dashboard .sidebar-menu-list__item.active > a,
body.is-inbox .dashboard .sidebar-menu-list__link.active {
  background: var(--wa-selected) !important;
  color: var(--wa-text) !important;
  box-shadow: none !important;
}
body.is-inbox .dashboard .sidebar-menu-list__item.active > a::before,
body.is-inbox .dashboard .sidebar-menu-list__link.active::before { display: none !important; }
body.is-inbox .dashboard .sidebar-menu-list__link.active .icon,
body.is-inbox .dashboard .sidebar-menu-list__link.active .icon i,
body.is-inbox .dashboard .sidebar-menu-list__link.active .text {
  color: var(--wa-green-dark) !important;
  -webkit-text-fill-color: var(--wa-green-dark) !important;
}

body.is-inbox .chatbox-wrapper__header {
  background: #fff !important;
  border-bottom-color: var(--wa-border) !important;
}
body.is-inbox .conversation-search {
  background: var(--wa-search) !important;
  border-color: transparent !important;
  color: var(--wa-text) !important;
  border-radius: 12px !important;
}
body.is-inbox .conversation-search::placeholder { color: var(--wa-muted) !important; }
body.is-inbox .conversation-search:focus {
  background: var(--wa-search) !important;
  border-color: transparent !important;
  box-shadow: none !important;
}
body.is-inbox .new-chat-button {
  background: #fff !important;
  border-color: var(--wa-border) !important;
  color: var(--wa-green-dark) !important;
}
body.is-inbox .new-chat-button:hover { background: var(--wa-hover) !important; border-color: #d4dadc !important; }

html body.is-inbox .dashboard .chatbox-wrapper__tab #chat-filters .nav-link {
  background: #fff !important;
  border-color: #d4d8da !important;
  color: #54656f !important;
}
html body.is-inbox .dashboard .chatbox-wrapper__tab #chat-filters .nav-link:hover { background: var(--wa-hover) !important; }
html body.is-inbox .dashboard .chatbox-wrapper__tab #chat-filters .nav-link.active {
  background: #fff !important;
  border-color: var(--wa-green) !important;
  color: var(--wa-green-dark) !important;
}
body.is-inbox .inbox-tab-unread-count,
body.is-inbox .nav-link.active .inbox-tab-unread-count,
body.is-inbox .unseen-message .badge {
  background: var(--wa-green) !important;
  color: #fff !important;
}

body.is-inbox .chatbody { background: #fff !important; }
html body.is-inbox .dashboard .chat-list__item {
  background: #fff !important;
  border-bottom-color: var(--wa-border) !important;
}
html body.is-inbox .dashboard .chat-list__item:hover { background: var(--wa-hover) !important; }
html body.is-inbox .dashboard .chat-list__item.active {
  background: var(--wa-selected) !important;
  box-shadow: none !important;
}
html body.is-inbox .dashboard .chat-list__item.active::before { display: none !important; }
body.is-inbox .chat-list__content p.text { color: var(--wa-text) !important; }
body.is-inbox .chat-list__content .last-message-row p.text { color: var(--wa-muted) !important; }
body.is-inbox .chat-list__item .time { color: var(--wa-muted) !important; }

body.is-inbox .chat-box__header {
  background: #fff !important;
  border-bottom-color: var(--wa-border) !important;
}
body.is-inbox .chat-box__content .name { color: var(--wa-text) !important; }
body.is-inbox .chat-box__content .text { color: var(--wa-muted) !important; }
body.is-inbox .header-action-btn,
body.is-inbox .message-inbox-btn { color: #54656f !important; }
body.is-inbox .header-action-btn:hover,
body.is-inbox .message-inbox-btn:hover { background: var(--wa-hover) !important; color: var(--wa-green-dark) !important; }

body.is-inbox .chatbox-area__body,
body.is-inbox .msg-body,
body.is-inbox .chat-box-area,
html body.is-inbox .chatbox-area__body .body-middle,
body.is-inbox .empty-conversation {
  background-color: var(--wa-chat) !important;
}
body.is-inbox .msg-body,
body.is-inbox .chat-box-area,
html body.is-inbox .chatbox-area__body .body-middle {
  background-image:
    linear-gradient(rgba(239,234,226,.88), rgba(239,234,226,.88)),
    radial-gradient(rgba(84,101,111,.11) .8px, transparent .8px) !important;
  background-size: auto, 20px 20px !important;
}
body.is-inbox .chat-date-separator span {
  background: #fff !important;
  color: #54656f !important;
  border-color: rgba(11,20,26,.05) !important;
  box-shadow: 0 1px .5px rgba(11,20,26,.13) !important;
}

html body.is-inbox .single-message .message-content {
  border-color: transparent !important;
  border-radius: 8px !important;
  box-shadow: 0 1px .5px rgba(11,20,26,.13) !important;
}
html body.is-inbox .single-message.message--left .message-content {
  background: #fff !important;
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 8px !important;
}
html body.is-inbox .single-message.message--right .message-content {
  background: var(--wa-green-soft) !important;
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 8px !important;
}
html body.is-inbox .single-message .message-content .message-text { color: var(--wa-text) !important; }
html body.is-inbox .single-message .message-time { color: var(--wa-muted) !important; }

body.is-inbox .chat-box__footer {
  background: var(--wa-header) !important;
  border-top-color: var(--wa-border) !important;
}
html body.is-inbox .chatbox-area__body .chat-box__footer .chat-send-area:not(#_never_) {
  background: #fff !important;
  border-color: transparent !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
body.is-inbox .chat-send-area textarea.message-input {
  background: #fff !important;
  color: var(--wa-text) !important;
}
body.is-inbox .chat-send-area .chat-media__btn,
body.is-inbox .chat-send-area .btn-item,
body.is-inbox .chat-send-area .emoji-icon { color: #54656f !important; }
body.is-inbox #wa-window-timer span {
  background: #fff !important;
  color: #54656f !important;
  border-color: transparent !important;
  box-shadow: 0 1px .5px rgba(11,20,26,.13) !important;
}

body.is-inbox .empty-conversation__backdrop { opacity: .12 !important; }
body.is-inbox .empty-conversation__glow { opacity: .12 !important; }
body.is-inbox .empty-conversation__eyebrow { color: var(--wa-green-dark) !important; }
body.is-inbox .empty-conversation__text h3 { color: var(--wa-text) !important; }
body.is-inbox .empty-conversation__desc { color: var(--wa-muted) !important; }

/* Preserve the original selected-item language. */
body.is-inbox .dashboard .sidebar-menu-list__item.active > a,
body.is-inbox .dashboard .sidebar-menu-list__link.active {
  position: relative !important;
  background: rgba(0, 0, 0, .055) !important;
  color: #1d1d1f !important;
  box-shadow: none !important;
}

body.is-inbox .dashboard .sidebar-menu-list__item.active > a::before,
body.is-inbox .dashboard .sidebar-menu-list__link.active::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 0 !important;
  top: 50% !important;
  width: 4px !important;
  height: 24px !important;
  transform: translateY(-50%) !important;
  border-radius: 0 4px 4px 0 !important;
  background: var(--ix-green-deep) !important;
}

body.is-inbox .dashboard .sidebar-menu-list__link.active .icon,
body.is-inbox .dashboard .sidebar-menu-list__link.active .icon i,
body.is-inbox .dashboard .sidebar-menu-list__link.active .text {
  color: #1d1d1f !important;
  -webkit-text-fill-color: #1d1d1f !important;
}

html body.is-inbox .dashboard .chat-list__item.active {
  background: #fff !important;
  box-shadow: 0 4px 14px rgba(25, 58, 40, .08) !important;
}

html body.is-inbox .dashboard .chat-list__item.active::before { display: none !important; }
html body.is-inbox .dashboard .chat-list__item.active p.text:first-child { color: var(--ix-green-deep) !important; }

/* Quiet Studio — content-preserving visual direction */
body.is-inbox {
  --studio-ink: #18231e;
  --studio-muted: #78847d;
  --studio-line: #e7ebe8;
  --studio-sage: #178552;
  --studio-sage-soft: #edf7f1;
  --studio-ivory: #f6f3ec;
  --studio-white: #ffffff;
  background: #f2f4f2 !important;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "SF Pro Text", sans-serif !important;
}

body.is-inbox .dashboard-header {
  height: 72px !important;
  min-height: 72px !important;
  padding: 0 28px !important;
  background: rgba(255,255,255,.94) !important;
  border-bottom: 1px solid var(--studio-line) !important;
  box-shadow: none !important;
  backdrop-filter: blur(18px);
}

body.is-inbox .dashboard-header h1,
body.is-inbox .dashboard-header h2,
body.is-inbox .dashboard-header h3,
body.is-inbox .dashboard-header .title {
  color: var(--studio-ink) !important;
  font-size: 20px !important;
  font-weight: 650 !important;
  letter-spacing: -.025em !important;
}

body.is-inbox .chatbox-area { border: 0 !important; box-shadow: none !important; }
body.is-inbox .chatbox-area__left {
  background: var(--studio-white) !important;
  border-right: 1px solid var(--studio-line) !important;
}

body.is-inbox .chatbox-wrapper__header {
  padding: 22px 20px 18px !important;
  background: var(--studio-white) !important;
  border-bottom: 1px solid var(--studio-line) !important;
}

body.is-inbox .search-row { gap: 9px !important; margin-bottom: 16px !important; }
body.is-inbox .conversation-search {
  height: 44px !important;
  padding: 0 42px !important;
  background: #f7f9f7 !important;
  border: 1px solid #e1e7e3 !important;
  border-radius: 12px !important;
  font-size: 13px !important;
}
body.is-inbox .search-form__icon { left: 15px !important; color: #89958e !important; }
body.is-inbox .new-chat-button {
  width: 44px !important;
  height: 44px !important;
  border-radius: 12px !important;
  border: 1px solid #dfe6e1 !important;
  color: var(--studio-sage) !important;
}

html body.is-inbox .dashboard .chatbox-wrapper__tab .nav-pills {
  padding: 0 !important;
  gap: 7px !important;
}
html body.is-inbox .dashboard .chatbox-wrapper__tab #chat-filters .nav-link {
  min-height: 32px !important;
  padding: 7px 13px !important;
  border: 1px solid #e2e8e4 !important;
  background: #fff !important;
  color: #66736c !important;
  font-size: 12px !important;
  font-weight: 550 !important;
}
html body.is-inbox .dashboard .chatbox-wrapper__tab #chat-filters .nav-link.active {
  background: #183f2c !important;
  border-color: #183f2c !important;
  color: #fff !important;
}
body.is-inbox .nav-link.active .inbox-tab-unread-count {
  background: rgba(255,255,255,.2) !important;
  color: #fff !important;
}

body.is-inbox .chatbody { background: #fff !important; }
html body.is-inbox .dashboard .chat-list { padding: 0 !important; }
html body.is-inbox .dashboard .chat-list__item {
  position: relative !important;
  min-height: 76px !important;
  margin: 0 !important;
  padding: 11px 20px !important;
  border: 0 !important;
  border-bottom: 1px solid #eef1ef !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
}
html body.is-inbox .dashboard .chat-list__item:hover { background: #f8faf8 !important; }
html body.is-inbox .dashboard .chat-list__item.active {
  background: var(--studio-sage-soft) !important;
  box-shadow: none !important;
}
html body.is-inbox .dashboard .chat-list__item.active::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 auto 0 0 !important;
  width: 3px !important;
  background: var(--studio-sage) !important;
}
body.is-inbox .chat-list__item .thumb,
body.is-inbox .chat-list__item .contact-thumb {
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  box-shadow: inset 0 0 0 1px rgba(30,55,42,.04) !important;
}
body.is-inbox .chat-list__content p.text {
  color: var(--studio-ink) !important;
  font-size: 13.5px !important;
  font-weight: 650 !important;
  letter-spacing: -.012em !important;
}
body.is-inbox .chat-list__content .last-message-row p.text {
  color: #7b8780 !important;
  font-size: 12px !important;
  font-weight: 430 !important;
}
body.is-inbox .chat-list__item .time { color: #929c96 !important; font-size: 10px !important; }

body.is-inbox .chatbox-area__body { background: var(--studio-ivory) !important; }
body.is-inbox .chat-box__header {
  min-height: 74px !important;
  padding: 0 22px !important;
  background: rgba(255,255,255,.96) !important;
  border-bottom: 1px solid var(--studio-line) !important;
}
body.is-inbox .chat-box__thumb { width: 43px !important; height: 43px !important; }
body.is-inbox .chat-box__content .name { font-size: 15px !important; font-weight: 680 !important; color: var(--studio-ink) !important; }
body.is-inbox .chat-box__content .text { font-size: 11.5px !important; color: #7c8881 !important; }
body.is-inbox .header-action-btn,
body.is-inbox .message-inbox-btn {
  width: 38px !important;
  height: 38px !important;
  border-radius: 10px !important;
  color: #607168 !important;
}
body.is-inbox .header-action-btn:hover,
body.is-inbox .message-inbox-btn:hover { background: #f1f5f2 !important; color: var(--studio-sage) !important; }

body.is-inbox .msg-body,
body.is-inbox .chat-box-area,
html body.is-inbox .chatbox-area__body .body-middle {
  padding: 24px !important;
  background-color: var(--studio-ivory) !important;
  background-image: radial-gradient(rgba(60,76,67,.04) .7px, transparent .7px) !important;
  background-size: 19px 19px !important;
}
body.is-inbox .chat-box__shape { display: none !important; }
body.is-inbox .chat-date-separator { margin: 4px 0 20px !important; }
body.is-inbox .chat-date-separator span {
  padding: 6px 12px !important;
  background: rgba(255,255,255,.88) !important;
  color: #6f7c74 !important;
  border: 1px solid rgba(42,65,52,.06) !important;
  font-size: 10px !important;
  font-weight: 650 !important;
  letter-spacing: .05em !important;
}

html body.is-inbox .single-message .message-content {
  padding: 9px 11px 8px !important;
  border: 1px solid rgba(35,56,44,.055) !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 8px rgba(28,48,37,.055) !important;
}
html body.is-inbox .single-message.message--left .message-content { background: #fff !important; border-bottom-left-radius: 3px !important; }
html body.is-inbox .single-message.message--right .message-content { background: #dff5e6 !important; border-bottom-right-radius: 3px !important; }
html body.is-inbox .single-message .message-content .message-text {
  color: var(--studio-ink) !important;
  font-size: 13.5px !important;
  line-height: 1.5 !important;
}

body.is-inbox .chat-box__footer {
  padding: 12px 18px 16px !important;
  background: rgba(255,255,255,.92) !important;
  border-top: 1px solid var(--studio-line) !important;
}
html body.is-inbox .chatbox-area__body .chat-box__footer .chat-send-area:not(#_never_) {
  min-height: 56px !important;
  padding: 7px 9px !important;
  border: 1px solid #e0e6e2 !important;
  border-radius: 15px !important;
  box-shadow: 0 7px 24px rgba(29,50,39,.07) !important;
}
body.is-inbox .chat-send-area textarea.message-input {
  min-height: 40px !important;
  background: #f7f9f7 !important;
  border-radius: 10px !important;
  font-size: 13px !important;
}
body.is-inbox #wa-window-timer span {
  padding: 5px 11px !important;
  background: rgba(255,255,255,.92) !important;
  border-radius: 999px !important;
  font-size: 10.5px !important;
}

body.is-inbox .empty-conversation {
  background: var(--studio-ivory) !important;
}
body.is-inbox .empty-conversation__backdrop { opacity: .08 !important; }
body.is-inbox .empty-conversation__glow { opacity: .25 !important; }
body.is-inbox .empty-conversation__content { max-width: 820px !important; gap: 30px !important; }
body.is-inbox .empty-conversation__visual { transform: scale(.82); }
body.is-inbox .empty-conversation__eyebrow { color: var(--studio-sage) !important; }
body.is-inbox .empty-conversation__text h3 { color: var(--studio-ink) !important; font-size: 28px !important; }
body.is-inbox .empty-conversation__desc { color: #758179 !important; max-width: 440px; line-height: 1.65 !important; }

@media (max-width: 767px) {
  body.is-inbox .dashboard-header { height: 66px !important; min-height: 66px !important; padding: 0 16px !important; }
  body.is-inbox .chatbox-wrapper__header { padding: 18px 14px 14px !important; }
  html body.is-inbox .dashboard .chat-list__item { padding-inline: 14px !important; }
  body.is-inbox .msg-body { padding: 16px 11px 24px !important; }
  body.is-inbox .chat-box__footer { padding: 9px !important; }
}

/* Final WhatsApp Web theme layer */
body.is-inbox { background: #fff !important; color: #111b21 !important; }
body.is-inbox .dashboard-header,
body.is-inbox .chatbox-wrapper__header,
body.is-inbox .chat-box__header { background: #fff !important; border-color: #e9edef !important; }
body.is-inbox .dashboard .sidebar-menu { background: #fff !important; border-right-color: #e9edef !important; }
body.is-inbox .dashboard .sidebar-menu-list__link:hover { background: #f5f6f6 !important; }
body.is-inbox .dashboard .sidebar-menu-list__item.active > a,
body.is-inbox .dashboard .sidebar-menu-list__link.active { background: #f0f2f5 !important; box-shadow: none !important; }
body.is-inbox .dashboard .sidebar-menu-list__item.active > a::before,
body.is-inbox .dashboard .sidebar-menu-list__link.active::before { display: none !important; }
body.is-inbox .dashboard .sidebar-menu-list__link.active .icon,
body.is-inbox .dashboard .sidebar-menu-list__link.active .icon i,
body.is-inbox .dashboard .sidebar-menu-list__link.active .text { color: #008069 !important; -webkit-text-fill-color: #008069 !important; }

body.is-inbox .conversation-search {
  background: #f0f2f5 !important;
  border-color: transparent !important;
  color: #111b21 !important;
  box-shadow: none !important;
}
body.is-inbox .conversation-search:focus { background: #f0f2f5 !important; border-color: transparent !important; box-shadow: none !important; }
body.is-inbox .new-chat-button { background: #fff !important; border-color: #e9edef !important; color: #008069 !important; }

html body.is-inbox .dashboard .chatbox-wrapper__tab #chat-filters .nav-link {
  background: #fff !important;
  border-color: #d4d8da !important;
  color: #54656f !important;
}
html body.is-inbox .dashboard .chatbox-wrapper__tab #chat-filters .nav-link.active {
  background: #fff !important;
  border-color: #00a884 !important;
  color: #008069 !important;
}
body.is-inbox .inbox-tab-unread-count,
body.is-inbox .nav-link.active .inbox-tab-unread-count,
body.is-inbox .unseen-message .badge { background: #00a884 !important; color: #fff !important; }

html body.is-inbox .dashboard .chat-list__item { background: #fff !important; border-bottom-color: #e9edef !important; }
html body.is-inbox .dashboard .chat-list__item:hover { background: #f5f6f6 !important; }
html body.is-inbox .dashboard .chat-list__item.active { background: #f0f2f5 !important; box-shadow: none !important; }
html body.is-inbox .dashboard .chat-list__item.active::before { display: none !important; }
body.is-inbox .chat-list__content p.text { color: #111b21 !important; }
body.is-inbox .chat-list__content .last-message-row p.text,
body.is-inbox .chat-list__item .time { color: #667781 !important; }

body.is-inbox .chat-box__content .name { color: #111b21 !important; }
body.is-inbox .chat-box__content .text { color: #667781 !important; }
body.is-inbox .header-action-btn,
body.is-inbox .message-inbox-btn { color: #54656f !important; }
body.is-inbox .header-action-btn:hover,
body.is-inbox .message-inbox-btn:hover { background: #f5f6f6 !important; color: #008069 !important; }

body.is-inbox .chatbox-area__body,
body.is-inbox .msg-body,
body.is-inbox .chat-box-area,
html body.is-inbox .chatbox-area__body .body-middle,
body.is-inbox .empty-conversation { background-color: #efeae2 !important; }
body.is-inbox .msg-body,
body.is-inbox .chat-box-area,
html body.is-inbox .chatbox-area__body .body-middle {
  background-image: radial-gradient(rgba(84,101,111,.09) .75px, transparent .75px) !important;
  background-size: 19px 19px !important;
}
body.is-inbox .chat-date-separator span { background: #fff !important; color: #54656f !important; box-shadow: 0 1px .5px rgba(11,20,26,.13) !important; }

html body.is-inbox .single-message .message-content {
  border-color: transparent !important;
  border-radius: 8px !important;
  box-shadow: 0 1px .5px rgba(11,20,26,.13) !important;
}
html body.is-inbox .single-message.message--left .message-content { background: #fff !important; border-radius: 0 8px 8px 8px !important; }
html body.is-inbox .single-message.message--right .message-content { background: #d9fdd3 !important; border-radius: 8px 0 8px 8px !important; }
html body.is-inbox .single-message .message-content .message-text { color: #111b21 !important; }
html body.is-inbox .single-message .message-time { color: #667781 !important; }

body.is-inbox .chat-box__footer { background: #f0f2f5 !important; border-top-color: #e9edef !important; }
html body.is-inbox .chatbox-area__body .chat-box__footer .chat-send-area:not(#_never_) {
  background: #fff !important;
  border-color: transparent !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
body.is-inbox .chat-send-area textarea.message-input { background: #fff !important; color: #111b21 !important; }
body.is-inbox #wa-window-timer span { background: #fff !important; color: #54656f !important; box-shadow: 0 1px .5px rgba(11,20,26,.13) !important; }
body.is-inbox .empty-conversation__glow { opacity: .08 !important; }
body.is-inbox .empty-conversation__eyebrow { color: #008069 !important; }
body.is-inbox .empty-conversation__text h3 { color: #111b21 !important; }
body.is-inbox .empty-conversation__desc { color: #667781 !important; }

/* iOS 26 liquid-glass finish over the WhatsApp palette */
body.is-inbox {
  --ios-glass: rgba(255,255,255,.72);
  --ios-glass-strong: rgba(255,255,255,.88);
  --ios-stroke: rgba(255,255,255,.82);
  --ios-hairline: rgba(17,27,33,.08);
  --ios-shadow: 0 16px 42px rgba(28,45,36,.10), 0 2px 8px rgba(28,45,36,.045);
  --ios-shadow-soft: 0 8px 24px rgba(28,45,36,.075);
  background:
    radial-gradient(circle at 88% 8%, rgba(0,168,132,.10), transparent 26%),
    linear-gradient(145deg, #f6f8f7 0%, #edf2ef 100%) !important;
  -webkit-font-smoothing: antialiased;
}

body.is-inbox .dashboard-header {
  background: rgba(255,255,255,.78) !important;
  border-bottom: 1px solid rgba(255,255,255,.86) !important;
  box-shadow: 0 1px 0 rgba(17,27,33,.06), 0 8px 28px rgba(17,27,33,.045) !important;
  backdrop-filter: blur(30px) saturate(170%);
  -webkit-backdrop-filter: blur(30px) saturate(170%);
}

body.is-inbox .dashboard-header .user-thumb,
body.is-inbox .dashboard-header .user-image,
body.is-inbox .dashboard-header img {
  border: 1px solid rgba(255,255,255,.92) !important;
  box-shadow: 0 8px 22px rgba(17,27,33,.10) !important;
}

body.is-inbox .chatbox-area {
  background: rgba(255,255,255,.22) !important;
}

body.is-inbox .chatbox-area__left {
  background: rgba(255,255,255,.76) !important;
  border-right: 1px solid rgba(255,255,255,.84) !important;
  box-shadow: 10px 0 34px rgba(17,27,33,.045) !important;
  backdrop-filter: blur(30px) saturate(150%);
  -webkit-backdrop-filter: blur(30px) saturate(150%);
}

body.is-inbox .chatbox-wrapper__header {
  background: rgba(255,255,255,.68) !important;
  border-bottom: 1px solid rgba(17,27,33,.065) !important;
  backdrop-filter: blur(24px) saturate(160%);
  -webkit-backdrop-filter: blur(24px) saturate(160%);
}

body.is-inbox .conversation-search {
  background:
    linear-gradient(180deg, rgba(255,255,255,.78), rgba(245,247,246,.68)) !important;
  border: 1px solid rgba(255,255,255,.92) !important;
  border-bottom-color: rgba(17,27,33,.10) !important;
  border-radius: 15px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 5px 16px rgba(17,27,33,.055) !important;
  backdrop-filter: blur(16px);
}
body.is-inbox .conversation-search:focus {
  background: rgba(255,255,255,.92) !important;
  border-color: rgba(0,168,132,.38) !important;
  box-shadow: 0 0 0 4px rgba(0,168,132,.10), inset 0 1px 0 #fff !important;
}

body.is-inbox .new-chat-button {
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(244,247,245,.82)) !important;
  border: 1px solid rgba(255,255,255,.94) !important;
  border-bottom-color: rgba(17,27,33,.10) !important;
  border-radius: 14px !important;
  box-shadow: inset 0 1px 0 #fff, 0 7px 18px rgba(17,27,33,.08) !important;
}
body.is-inbox .new-chat-button:hover { transform: translateY(-1px); box-shadow: inset 0 1px 0 #fff, 0 10px 24px rgba(0,128,105,.14) !important; }

html body.is-inbox .dashboard .chatbox-wrapper__tab #chat-filters .nav-link {
  background: rgba(255,255,255,.64) !important;
  border: 1px solid rgba(255,255,255,.92) !important;
  border-bottom-color: rgba(17,27,33,.10) !important;
  border-radius: 999px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.92), 0 4px 12px rgba(17,27,33,.045) !important;
  backdrop-filter: blur(12px);
}
html body.is-inbox .dashboard .chatbox-wrapper__tab #chat-filters .nav-link.active {
  background: linear-gradient(180deg, #11b895, #009b7d) !important;
  border-color: rgba(0,128,105,.18) !important;
  color: #fff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 7px 18px rgba(0,128,105,.22) !important;
}
body.is-inbox .nav-link.active .inbox-tab-unread-count {
  background: rgba(255,255,255,.22) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.18) !important;
}

body.is-inbox .chatbody { background: rgba(255,255,255,.52) !important; }
html body.is-inbox .dashboard .chat-list__item {
  margin: 4px 10px !important;
  width: calc(100% - 20px) !important;
  border: 1px solid transparent !important;
  border-radius: 16px !important;
  background: transparent !important;
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease !important;
}
html body.is-inbox .dashboard .chat-list__item:hover {
  background: rgba(255,255,255,.64) !important;
  border-color: rgba(255,255,255,.72) !important;
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(17,27,33,.055) !important;
}
html body.is-inbox .dashboard .chat-list__item.active {
  background:
    linear-gradient(135deg, rgba(225,249,235,.94), rgba(239,248,243,.78)) !important;
  border-color: rgba(255,255,255,.96) !important;
  box-shadow: inset 0 1px 0 #fff, 0 10px 26px rgba(0,128,105,.11) !important;
}
html body.is-inbox .dashboard .chat-list__item.active::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 0 !important;
  top: 17px !important;
  bottom: 17px !important;
  width: 3px !important;
  border-radius: 0 3px 3px 0 !important;
  background: linear-gradient(#15c79e, #008069) !important;
  box-shadow: 0 0 12px rgba(0,168,132,.30) !important;
}

body.is-inbox .chat-list__item .thumb,
body.is-inbox .chat-list__item .contact-thumb {
  border: 2px solid rgba(255,255,255,.9) !important;
  box-shadow: 0 6px 16px rgba(17,27,33,.09) !important;
}

body.is-inbox .chat-box__header {
  background: rgba(255,255,255,.78) !important;
  border-bottom: 1px solid rgba(255,255,255,.82) !important;
  box-shadow: 0 8px 28px rgba(17,27,33,.045) !important;
  backdrop-filter: blur(28px) saturate(170%);
  -webkit-backdrop-filter: blur(28px) saturate(170%);
  z-index: 4;
}

body.is-inbox .header-action-btn,
body.is-inbox .message-inbox-btn {
  background: rgba(255,255,255,.58) !important;
  border: 1px solid rgba(255,255,255,.86) !important;
  border-bottom-color: rgba(17,27,33,.09) !important;
  border-radius: 13px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 5px 14px rgba(17,27,33,.055) !important;
}
body.is-inbox .header-action-btn:hover,
body.is-inbox .message-inbox-btn:hover {
  background: rgba(255,255,255,.88) !important;
  transform: translateY(-1px);
  box-shadow: inset 0 1px 0 #fff, 0 8px 20px rgba(0,128,105,.12) !important;
}

body.is-inbox .chatbox-area__body,
body.is-inbox .msg-body,
body.is-inbox .chat-box-area,
html body.is-inbox .chatbox-area__body .body-middle,
body.is-inbox .empty-conversation {
  background-color: #efeae2 !important;
}
body.is-inbox .msg-body,
body.is-inbox .chat-box-area,
html body.is-inbox .chatbox-area__body .body-middle {
  background-image:
    linear-gradient(rgba(239,234,226,.72), rgba(239,234,226,.72)),
    radial-gradient(rgba(84,101,111,.12) .75px, transparent .75px) !important;
  background-size: auto, 19px 19px !important;
}

body.is-inbox .chat-date-separator span,
body.is-inbox #wa-window-timer span {
  background: rgba(255,255,255,.72) !important;
  border: 1px solid rgba(255,255,255,.88) !important;
  border-bottom-color: rgba(17,27,33,.08) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 7px 20px rgba(17,27,33,.08) !important;
  backdrop-filter: blur(18px) saturate(150%);
  -webkit-backdrop-filter: blur(18px) saturate(150%);
}

html body.is-inbox .single-message .message-content {
  border: 1px solid rgba(255,255,255,.62) !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 22px rgba(17,27,33,.075), inset 0 1px 0 rgba(255,255,255,.54) !important;
}
html body.is-inbox .single-message.message--left .message-content {
  background: rgba(255,255,255,.92) !important;
  border-radius: 4px 14px 14px 14px !important;
}
html body.is-inbox .single-message.message--right .message-content {
  background: linear-gradient(145deg, rgba(217,253,211,.96), rgba(207,246,212,.92)) !important;
  border-radius: 14px 4px 14px 14px !important;
  border-color: rgba(255,255,255,.64) !important;
}

body.is-inbox .chat-box__footer {
  background: rgba(240,242,245,.72) !important;
  border-top: 1px solid rgba(255,255,255,.84) !important;
  box-shadow: 0 -10px 30px rgba(17,27,33,.055) !important;
  backdrop-filter: blur(30px) saturate(160%);
  -webkit-backdrop-filter: blur(30px) saturate(160%);
}
html body.is-inbox .chatbox-area__body .chat-box__footer .chat-send-area:not(#_never_) {
  background: rgba(255,255,255,.80) !important;
  border: 1px solid rgba(255,255,255,.94) !important;
  border-bottom-color: rgba(17,27,33,.09) !important;
  border-radius: 18px !important;
  box-shadow: inset 0 1px 0 #fff, 0 12px 34px rgba(17,27,33,.09) !important;
  backdrop-filter: blur(22px) saturate(170%);
  -webkit-backdrop-filter: blur(22px) saturate(170%);
}
body.is-inbox .chat-send-area textarea.message-input {
  background: rgba(255,255,255,.46) !important;
  border: 1px solid rgba(255,255,255,.72) !important;
  border-radius: 12px !important;
}

body.is-inbox .empty-conversation__phone,
body.is-inbox .empty-conversation__card {
  background: rgba(255,255,255,.62) !important;
  border-color: rgba(255,255,255,.84) !important;
  box-shadow: var(--ios-shadow) !important;
  backdrop-filter: blur(22px) saturate(150%);
}

@media (prefers-reduced-motion: no-preference) {
  body.is-inbox .new-chat-button,
  body.is-inbox .header-action-btn,
  body.is-inbox .message-inbox-btn { transition: transform .2s ease, box-shadow .2s ease, background .2s ease !important; }
}

/* Flat controls + precise workspace separators */
body.is-inbox {
  --flat-control-bg: rgba(255,255,255,.74);
  --flat-control-hover: rgba(245,248,246,.94);
  --flat-control-border: #dce4df;
  --flat-separator: rgba(62,82,70,.14);
}

/* One-pixel structural separators, intentionally free of shadow. */
body.is-inbox .dashboard .sidebar-menu {
  border-right: 1px solid var(--flat-separator) !important;
  box-shadow: none !important;
}
body.is-inbox .chatbox-area__left {
  border-right: 1px solid var(--flat-separator) !important;
  box-shadow: none !important;
}
body.is-inbox .chatbox-wrapper__header,
body.is-inbox .chat-box__header {
  border-bottom: 1px solid rgba(62,82,70,.11) !important;
}

/* Search is an input surface, not a floating card. */
body.is-inbox .conversation-search {
  background: rgba(255,255,255,.72) !important;
  border: 1px solid var(--flat-control-border) !important;
  box-shadow: none !important;
}
body.is-inbox .conversation-search:focus {
  background: #fff !important;
  border-color: rgba(0,128,105,.46) !important;
  box-shadow: 0 0 0 3px rgba(0,168,132,.08) !important;
}

/* Primary 2D button language. */
body.is-inbox .new-chat-button,
body.is-inbox .header-action-btn,
body.is-inbox .message-inbox-btn,
body.is-inbox .chat-list__action-btn,
body.is-inbox .chat-send-area .chat-media__btn,
body.is-inbox .chat-send-area .btn-item,
body.is-inbox .chat-send-area .emoji-icon,
body.is-inbox .sinhala-toggle-btn,
body.is-inbox .btn-apple-simple {
  background: var(--flat-control-bg) !important;
  border: 1px solid var(--flat-control-border) !important;
  box-shadow: none !important;
  transform: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
body.is-inbox .new-chat-button:hover,
body.is-inbox .header-action-btn:hover,
body.is-inbox .message-inbox-btn:hover,
body.is-inbox .chat-list__action-btn:hover,
body.is-inbox .chat-send-area .chat-media__btn:hover,
body.is-inbox .chat-send-area .btn-item:hover,
body.is-inbox .chat-send-area .emoji-icon:hover,
body.is-inbox .sinhala-toggle-btn:hover,
body.is-inbox .btn-apple-simple:hover {
  background: var(--flat-control-hover) !important;
  border-color: #cbd8d0 !important;
  box-shadow: none !important;
  transform: none !important;
}
body.is-inbox .header-action-btn--danger {
  color: #d94b4b !important;
  border-color: #f0caca !important;
}
body.is-inbox .header-action-btn--danger:hover { background: #fff6f6 !important; border-color: #e9b0b0 !important; }

/* Filter chips: flat white pills; selected uses flat WhatsApp green. */
html body.is-inbox .dashboard .chatbox-wrapper__tab #chat-filters .nav-link {
  background: rgba(255,255,255,.76) !important;
  border: 1px solid var(--flat-control-border) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transform: none !important;
}
html body.is-inbox .dashboard .chatbox-wrapper__tab #chat-filters .nav-link:hover {
  background: var(--flat-control-hover) !important;
  border-color: #cbd8d0 !important;
  box-shadow: none !important;
}
html body.is-inbox .dashboard .chatbox-wrapper__tab #chat-filters .nav-link.active {
  background: #00a884 !important;
  border-color: #009879 !important;
  color: #fff !important;
  box-shadow: none !important;
}

/* Composer remains a premium glass panel; its buttons are flat outlined. */
body.is-inbox .chat-send-area .chat-media__btn,
body.is-inbox .chat-send-area .btn-item,
body.is-inbox .chat-send-area .emoji-icon,
body.is-inbox .sinhala-toggle-btn {
  border-radius: 10px !important;
}

/* Prevent leftover elevation from dropdown triggers and menu items. */
body.is-inbox button:active,
body.is-inbox .nav-link:active,
body.is-inbox .header-action-btn:active,
body.is-inbox .new-chat-button:active {
  transform: none !important;
  box-shadow: none !important;
}

/* Native WhatsApp Web zone: the single-conversation pane never inherits glass styling. */
body.is-inbox .chatbox-area__body,
body.is-inbox .chatbox-area__body .chat-box {
  --native-wa-green: #00a884;
  --native-wa-green-dark: #008069;
  --native-wa-outgoing: #d9fdd3;
  --native-wa-canvas: #efeae2;
  --native-wa-header: #f0f2f5;
  --native-wa-white: #ffffff;
  --native-wa-text: #111b21;
  --native-wa-muted: #667781;
  --native-wa-line: #e9edef;
  background: var(--native-wa-canvas) !important;
}

body.is-inbox .chatbox-area__body .chat-box__header {
  background: var(--native-wa-header) !important;
  border: 0 !important;
  border-bottom: 1px solid #d8dcdf !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
body.is-inbox .chatbox-area__body .chat-box__thumb {
  border: 0 !important;
  box-shadow: none !important;
}
body.is-inbox .chatbox-area__body .chat-box__content .name { color: var(--native-wa-text) !important; }
body.is-inbox .chatbox-area__body .chat-box__content .text { color: var(--native-wa-muted) !important; }

body.is-inbox .chatbox-area__body .header-action-btn,
body.is-inbox .chatbox-area__body .message-inbox-btn {
  background: transparent !important;
  border: 0 !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  color: #54656f !important;
  transform: none !important;
}
body.is-inbox .chatbox-area__body .header-action-btn:hover,
body.is-inbox .chatbox-area__body .message-inbox-btn:hover { background: rgba(11,20,26,.06) !important; color: #54656f !important; }
body.is-inbox .chatbox-area__body .header-action-btn--danger { color: #e35b64 !important; }

body.is-inbox .chatbox-area__body .msg-body,
body.is-inbox .chatbox-area__body .chat-box-area,
html body.is-inbox .chatbox-area__body .body-middle {
  background-color: rgba(239,234,226,.88) !important;
  background-image: none !important;
}
body.is-inbox .chatbox-area__body .chat-box__shape {
  display: block !important;
  z-index: 0 !important;
  opacity: .42 !important;
  filter: sepia(.12) saturate(.72) brightness(1.05) !important;
  pointer-events: none !important;
}
body.is-inbox .chatbox-area__body .chat-box__shape img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
body.is-inbox .chatbox-area__body .msg-body > *:not(.chat-box__shape) {
  position: relative;
  z-index: 1;
}

/* Native WhatsApp Web contact bar and message composer. */
body.is-inbox .chatbox-area__body .chat-box__header {
  min-height: 64px !important;
  height: 64px !important;
  padding: 0 16px !important;
  background: #fff !important;
  border-bottom: 1px solid #e9edef !important;
  box-shadow: none !important;
}
body.is-inbox .chatbox-area__body .chat-box__header > .d-flex:first-child {
  gap: 11px !important;
  min-width: 0;
}
body.is-inbox .chatbox-area__body .chat-box__thumb,
body.is-inbox .chatbox-area__body .chat-box__thumb img {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  border-radius: 50% !important;
  box-shadow: none !important;
}
body.is-inbox .chatbox-area__body .chat-box__content .contact__name,
body.is-inbox .chatbox-area__body .chat-box__content .name {
  color: #111b21 !important;
  font-size: 16px !important;
  line-height: 20px !important;
  font-weight: 500 !important;
}
body.is-inbox .chatbox-area__body .chat-box__content .contact__mobile,
body.is-inbox .chatbox-area__body .chat-box__content .text {
  color: #667781 !important;
  font-size: 12px !important;
  line-height: 16px !important;
}
body.is-inbox .chatbox-area__body .chat-box__header > .d-flex:last-child {
  gap: 8px !important;
}
body.is-inbox .chatbox-area__body .chat-box__header .header-action-btn,
body.is-inbox .chatbox-area__body .chat-box__header .message-inbox-btn {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: #54656f !important;
  box-shadow: none !important;
}
body.is-inbox .chatbox-area__body .chat-box__header .header-action-btn:hover,
body.is-inbox .chatbox-area__body .chat-box__header .message-inbox-btn:hover {
  background: #f0f2f5 !important;
}

body.is-inbox .chatbox-area__body .chat-box__footer {
  padding: 9px 16px 12px !important;
  background: rgba(239,234,226,.94) !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
html body.is-inbox .chatbox-area__body .chat-box__footer .chat-send-area:not(#_never_) {
  min-height: 54px !important;
  padding: 5px 10px !important;
  border: 1px solid rgba(11,20,26,.04) !important;
  border-radius: 28px !important;
  background: #fff !important;
  box-shadow: 0 1px 3px rgba(11,20,26,.14) !important;
}
body.is-inbox .chatbox-area__body .chat-send-area .input-area {
  min-height: 42px !important;
  gap: 4px !important;
  align-items: center !important;
}
body.is-inbox .chatbox-area__body .chat-send-area .input-group,
body.is-inbox .chatbox-area__body .chat-send-area textarea.message-input {
  min-height: 40px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.is-inbox .chatbox-area__body .chat-send-area textarea.message-input {
  padding: 9px 8px !important;
  color: #111b21 !important;
  font-size: 15px !important;
  line-height: 22px !important;
}
body.is-inbox .chatbox-area__body .chat-send-area textarea.message-input::placeholder {
  color: #667781 !important;
  opacity: 1 !important;
}
body.is-inbox .chatbox-area__body .chat-send-area .chat-media__btn,
body.is-inbox .chatbox-area__body .chat-send-area .btn-item,
body.is-inbox .chatbox-area__body .chat-send-area .emoji-icon,
body.is-inbox .chatbox-area__body .chat-send-area .sinhala-toggle-btn,
body.is-inbox .chatbox-area__body .chat-send-area .chating-btn {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: #54656f !important;
  box-shadow: none !important;
}
body.is-inbox .chatbox-area__body .chat-send-area .chat-media__btn:hover,
body.is-inbox .chatbox-area__body .chat-send-area .btn-item:hover,
body.is-inbox .chatbox-area__body .chat-send-area .emoji-icon:hover,
body.is-inbox .chatbox-area__body .chat-send-area .sinhala-toggle-btn:hover,
body.is-inbox .chatbox-area__body .chat-send-area .chating-btn:hover {
  background: #f0f2f5 !important;
}

@media (max-width: 991px) {
  body.is-inbox .chatbox-area__body .chat-box__header {
    min-height: 60px !important;
    height: 60px !important;
    padding-inline: 8px !important;
  }
  body.is-inbox .chatbox-area__body .chat-box__header .header-action-btn,
  body.is-inbox .chatbox-area__body .chat-box__header .message-inbox-btn {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
  }
  body.is-inbox .chatbox-area__body .chat-box__footer { padding: 7px 8px 9px !important; }
}

/* Specificity lock: prevent legacy inbox rules from re-boxing the WhatsApp composer. */
html body.is-inbox .chatbox-area__body .chat-box__footer {
  background: rgba(239,234,226,.94) !important;
  border: 0 !important;
}
html body.is-inbox .chatbox-area__body .chat-box__footer #message-form.chat-send-area:not(#_never_) {
  padding: 5px 10px !important;
  border: 1px solid rgba(11,20,26,.04) !important;
  border-radius: 28px !important;
  background: #fff !important;
  box-shadow: 0 1px 3px rgba(11,20,26,.14) !important;
}
html body.is-inbox .chatbox-area__body #message-form textarea.message-input,
html body.is-inbox .chatbox-area__body #message-form .input-group {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body.is-inbox .chatbox-area__body .chat-box__header .header-action-btn i,
html body.is-inbox .chatbox-area__body .chat-box__header .message-inbox-btn i {
  font-size: 19px !important;
}

/* Restore the compact Sinhala control and its clearly legible active state. */
html body.is-inbox .chatbox-area__body #message-form .sinhala-toggle-btn:not(#_never_) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 30px !important;
  height: 26px !important;
  margin: 0 6px 0 2px !important;
  padding: 0 6px !important;
  border: 1px solid #d1d7db !important;
  border-radius: 7px !important;
  background: #fff !important;
  color: #667781 !important;
  -webkit-text-fill-color: #667781 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 24px !important;
  box-shadow: none !important;
}
html body.is-inbox .chatbox-area__body #message-form .sinhala-toggle-btn:not(#_never_):hover {
  border-color: #aebac1 !important;
  background: #f0f2f5 !important;
  color: #3b4a54 !important;
  -webkit-text-fill-color: #3b4a54 !important;
}
html body.is-inbox .chatbox-area__body #message-form .sinhala-toggle-btn.is-active:not(#_never_) {
  border-color: #008069 !important;
  background: #008069 !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

/* Reply-window timer: target only the outer pill, not its nested text span. */
html body.is-inbox .chatbox-area__body #wa-window-timer {
  bottom: calc(100% + 10px) !important;
  padding: 0 !important;
  pointer-events: none;
}
html body.is-inbox .chatbox-area__body #wa-window-timer > span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  min-height: 30px !important;
  padding: 5px 12px !important;
  border: 1px solid #e9edef !important;
  border-radius: 15px !important;
  background: #fff !important;
  color: #54656f !important;
  box-shadow: 0 1px 2px rgba(11,20,26,.12) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
}
html body.is-inbox .chatbox-area__body #wa-window-timer > span > .timer-text {
  display: inline !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: inherit !important;
  box-shadow: none !important;
  font: inherit !important;
}

/* The filter below conversation search uses the earlier green treatment. */
html body.is-inbox .dashboard .chatbox-wrapper__tab #chat-filters .nav-link:not(#_never_) {
  background: #fff !important;
  border: 1px solid #d4d8da !important;
  color: #54656f !important;
  -webkit-text-fill-color: #54656f !important;
  box-shadow: none !important;
}
html body.is-inbox .dashboard .chatbox-wrapper__tab #chat-filters .nav-link:not(#_never_):hover {
  background: #f0f2f5 !important;
  border-color: #aebac1 !important;
}
html body.is-inbox .dashboard .chatbox-wrapper__tab #chat-filters .nav-link.active:not(#_never_),
html body.is-inbox .dashboard .chatbox-wrapper__tab #chat-filters .nav-item.dropdown.show #label-filter-pill:not(#_never_) {
  background: #c8f7c2 !important;
  border: 1px solid #00a884 !important;
  color: #008069 !important;
  -webkit-text-fill-color: #008069 !important;
  box-shadow: none !important;
}

/* Assigned labels retain the colour configured for each individual label. */
html body.is-inbox .contact__labels .label-badge-v2,
html body.is-inbox .conversation-labels .badge {
  box-shadow: none !important;
}

/* Keep the original audio player and add WhatsApp-style speed cycling. */
html body.is-inbox .wa-audio-player {
  width: min(320px, 100%) !important;
  min-width: min(260px, 100%) !important;
  box-sizing: border-box !important;
}
html body.is-inbox .wa-audio-player .audio-progress-container {
  min-width: 0 !important;
}
html body.is-inbox .wa-audio-player .audio-speed-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 34px !important;
  min-width: 34px !important;
  height: 28px !important;
  padding: 0 5px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: rgba(84,101,111,.12) !important;
  color: #3b4a54 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  box-shadow: none !important;
  visibility: visible !important;
  opacity: 1 !important;
  cursor: pointer !important;
}
html body.is-inbox .message--right .wa-audio-player .audio-speed-btn {
  background: rgba(0,128,105,.13) !important;
  color: #008069 !important;
}
html body.is-inbox .wa-audio-player .audio-speed-btn:hover {
  background: rgba(84,101,111,.2) !important;
}

body.is-inbox .chatbox-area__body .chat-date-separator span {
  padding: 5px 12px !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 7.5px !important;
  box-shadow: 0 1px .5px rgba(11,20,26,.13) !important;
  color: #54656f !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  backdrop-filter: none !important;
}

html body.is-inbox .chatbox-area__body .single-message .message-content {
  padding: 6px 7px 8px 9px !important;
  border: 0 !important;
  border-radius: 7.5px !important;
  box-shadow: 0 1px .5px rgba(11,20,26,.13) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html body.is-inbox .chatbox-area__body .single-message.message--left .message-content {
  background: var(--native-wa-white) !important;
  border-radius: 0 7.5px 7.5px 7.5px !important;
}
html body.is-inbox .chatbox-area__body .single-message.message--right .message-content {
  background: var(--native-wa-outgoing) !important;
  background-image: none !important;
  border-radius: 7.5px 0 7.5px 7.5px !important;
}
html body.is-inbox .chatbox-area__body .single-message .message-content .message-text {
  color: var(--native-wa-text) !important;
  font-size: 14.2px !important;
  line-height: 19px !important;
}
html body.is-inbox .chatbox-area__body .single-message .message-time {
  color: rgba(17,27,33,.55) !important;
  font-size: 11px !important;
}
body.is-inbox .chatbox-area__body .single-message.message--right .conv-list-status,
body.is-inbox .chatbox-area__body .single-message.message--right .message-status,
body.is-inbox .chatbox-area__body .single-message.message--right .la-check-double { color: #53bdeb !important; }

body.is-inbox .chatbox-area__body .message-actions .message-action-btn {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #667781 !important;
}
body.is-inbox .chatbox-area__body .message-reply-preview {
  width: 100% !important;
  margin: 0 0 5px !important;
  padding: 7px 8px 7px 10px !important;
  background: rgba(11,20,26,.055) !important;
  border: 0 !important;
  border-left: 4px solid #53bdeb !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  text-align: left !important;
}
body.is-inbox .chatbox-area__body .message--right .message-reply-preview {
  background: rgba(0,128,105,.08) !important;
  border-left-color: var(--native-wa-green-dark) !important;
}
body.is-inbox .chatbox-area__body .reply-sender { color: #0086b3 !important; font-weight: 600 !important; }
body.is-inbox .chatbox-area__body .message--right .reply-sender { color: var(--native-wa-green-dark) !important; }
body.is-inbox .chatbox-area__body .reply-text,
body.is-inbox .chatbox-area__body .reply-media-label { color: #667781 !important; }

body.is-inbox .chatbox-area__body .message-reactions-badge {
  background: #fff !important;
  border: 1px solid #e9edef !important;
  box-shadow: 0 1px 2px rgba(11,20,26,.14) !important;
}

body.is-inbox .chatbox-area__body .chat-box__footer {
  background: var(--native-wa-header) !important;
  border: 0 !important;
  border-top: 1px solid #d8dcdf !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html body.is-inbox .chatbox-area__body .chat-box__footer .chat-send-area:not(#_never_) {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
body.is-inbox .chatbox-area__body .chat-send-area textarea.message-input {
  background: #fff !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--native-wa-text) !important;
}
body.is-inbox .chatbox-area__body .chat-send-area .chat-media__btn,
body.is-inbox .chatbox-area__body .chat-send-area .btn-item,
body.is-inbox .chatbox-area__body .chat-send-area .emoji-icon,
body.is-inbox .chatbox-area__body .sinhala-toggle-btn {
  background: transparent !important;
  border: 0 !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  color: #54656f !important;
}
body.is-inbox .chatbox-area__body .chat-send-area .chat-media__btn:hover,
body.is-inbox .chatbox-area__body .chat-send-area .btn-item:hover,
body.is-inbox .chatbox-area__body .chat-send-area .emoji-icon:hover,
body.is-inbox .chatbox-area__body .sinhala-toggle-btn:hover { background: rgba(11,20,26,.06) !important; }
body.is-inbox .chatbox-area__body #wa-window-timer span {
  background: #fff !important;
  border: 0 !important;
  border-radius: 7.5px !important;
  box-shadow: 0 1px .5px rgba(11,20,26,.13) !important;
  color: #54656f !important;
  backdrop-filter: none !important;
}

body.is-inbox .chatbox-area__body .dropdown-menu {
  background: #fff !important;
  border: 1px solid #e9edef !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 5px rgba(11,20,26,.16), 0 6px 18px rgba(11,20,26,.12) !important;
}

/* Final selected-conversation state: quiet, flat WhatsApp Web treatment. */
html body.is-inbox .dashboard .chat-list .chat-list__item:hover:not(.active) {
  background: #fafbfb !important;
  border-color: #f0f2f1 !important;
  box-shadow: none !important;
  transform: none !important;
}
html body.is-inbox .dashboard .chat-list .chat-list__item.active:not(#_never_) {
  background: #f3f7f5 !important;
  background-image: none !important;
  border: 1px solid #e1ebe6 !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  transform: none !important;
}
html body.is-inbox .dashboard .chat-list .chat-list__item.active:not(#_never_)::before {
  content: none !important;
  display: none !important;
}
html body.is-inbox .dashboard .chat-list .chat-list__item.active:not(#_never_) .chat-list__content .name,
html body.is-inbox .dashboard .chat-list .chat-list__item.active:not(#_never_) .chat-list__content p.text:first-child {
  color: #111b21 !important;
  -webkit-text-fill-color: #111b21 !important;
}
html body.is-inbox .dashboard .chat-list .chat-list__item.active:not(#_never_):hover {
  background: #f1f6f3 !important;
  border-color: #dde8e2 !important;
  box-shadow: none !important;
  transform: none !important;
}

/* WhatsApp row actions: badge first, chevron at the far right. */
html body.is-inbox .dashboard .chat-list .chat-list__item .chat-list__actions {
  right: 10px !important;
  bottom: 14px !important;
}
html body.is-inbox .dashboard .chat-list .chat-list__item .unseen-message {
  margin-right: 0 !important;
  margin-left: 8px !important;
  transition: margin-right .16s ease !important;
}
html body.is-inbox .dashboard .chat-list .chat-list__item:hover .unseen-message,
html body.is-inbox .dashboard .chat-list .chat-list__item:focus-within .unseen-message,
html body.is-inbox .dashboard .chat-list .chat-list__item:has(.chat-list__action-btn.show) .unseen-message {
  margin-right: 28px !important;
}
html body.is-inbox .dashboard .chat-list .chat-list__item:not(.is-unread) .last-message-row {
  padding-right: 28px !important;
}
html body.is-inbox .dashboard .chat-list .chat-list__action-btn {
  width: 22px !important;
  height: 22px !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: #54656f !important;
  box-shadow: none !important;
}
html body.is-inbox .dashboard .chat-list .chat-list__action-btn:hover,
html body.is-inbox .dashboard .chat-list .chat-list__action-btn:focus,
html body.is-inbox .dashboard .chat-list .chat-list__action-btn.show {
  background: rgba(11,20,26,.06) !important;
  color: #008069 !important;
}

/* Canonical WhatsApp Web greens within the inbox UI. */
body.is-inbox {
  --ix-green: #00a884;
  --ix-green-deep: #008069;
  --wa-green: #00a884;
  --wa-green-dark: #008069;
  --studio-sage: #008069;
  --native-wa-green-dark: #008069;
}
html body.is-inbox .inbox-tab-unread-count,
html body.is-inbox .unseen-message .badge,
html body.is-inbox .bg-success {
  background-color: #00a884 !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

/* Open conversation menus must stack above every sibling row on all viewports. */
html body.is-inbox .dashboard .chat-list {
  isolation: isolate !important;
}
html body.is-inbox .dashboard .chat-list .chat-list__item {
  z-index: 0 !important;
}
html body.is-inbox .dashboard .chat-list .chat-list__item:has(.conversation-dropdown-menu.show),
html body.is-inbox .dashboard .chat-list .chat-list__item:has(.chat-list__action-btn.show) {
  z-index: 100 !important;
  overflow: visible !important;
}
html body.is-inbox .dashboard .chat-list .chat-list__item:has(.conversation-dropdown-menu.show) .chat-list__actions,
html body.is-inbox .dashboard .chat-list .chat-list__item:has(.chat-list__action-btn.show) .chat-list__actions {
  z-index: 101 !important;
}
html body.is-inbox .dashboard .chat-list .conversation-dropdown-menu.show:not(#_never_) {
  z-index: 102 !important;
  isolation: isolate !important;
  background: #fff !important;
  opacity: 1 !important;
}
/* Conversation actions stay content-sized and visible even when the inbox is
   shown in a narrow app pane whose overall browser viewport is still wide. */
html body.is-inbox .dashboard .chat-list .conversation-dropdown-menu:not(#_never_) {
  width: 210px !important;
  min-width: 210px !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 6px !important;
  overflow: visible !important;
}
html body.is-inbox .dashboard .chat-list .conversation-dropdown-menu > li {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
html body.is-inbox .dashboard .chat-list .conversation-dropdown-menu .conversation-row-action,
html body.is-inbox .dashboard .chat-list .conversation-dropdown-menu .conversation-row-read-action,
html body.is-inbox .dashboard .chat-list .conversation-dropdown-menu .conversation-row-clear-action {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 100% !important;
  min-height: 38px !important;
  height: auto !important;
  align-items: center !important;
  padding: 9px 10px !important;
  color: #202329 !important;
  -webkit-text-fill-color: currentColor !important;
}
html body.is-inbox .dashboard .chat-list .conversation-dropdown-menu .conversation-row-clear-action {
  color: #ea3943 !important;
}

/* Empty inbox uses a clean neutral canvas; active conversations retain the
   native WhatsApp chat background. */
html body.is-inbox .chatbox-area .empty-conversation:not(#_never_) {
  background-color: #fbfcfb !important;
  background-image: linear-gradient(145deg, #ffffff 0%, #fafcfb 55%, #f5f8f6 100%) !important;
  border-left: 1px solid #eef1ef !important;
}
html body.is-inbox .empty-conversation__backdrop {
  opacity: .045 !important;
}
html body.is-inbox .empty-conversation__glow {
  opacity: .10 !important;
}

/* Closed reply window: compact WhatsApp-style status with an unmistakable action. */
html body.is-inbox .chatbox-area__body .chat-box__footer {
  isolation: isolate !important;
  overflow: visible !important;
  z-index: 200 !important;
}
html body.is-inbox .chatbox-area__body .chat-box__footer .chat-send-area {
  position: relative !important;
  z-index: 1 !important;
}
html body.is-inbox .chatbox-area__body .chat-box__footer .chat-send-area:has(.saved-reply-popover:not(.d-none)) {
  z-index: 300 !important;
}
html body.is-inbox .chatbox-area__body .chat-box__footer .saved-reply-popover:not(#_never_) {
  z-index: 301 !important;
  isolation: isolate !important;
  background: #fff !important;
  opacity: 1 !important;
  box-shadow: 0 16px 40px rgba(11,20,26,.18) !important;
}
html body.is-inbox .chatbox-area__body .chat-box__footer .saved-reply-popover__header,
html body.is-inbox .chatbox-area__body .chat-box__footer .saved-reply-popover__list {
  background: #fff !important;
}
html body.is-inbox .chat-box__footer .wa-window-wrapper:not(.d-none) {
  display: flex !important;
  justify-content: center !important;
  position: relative !important;
  inset: auto !important;
  bottom: auto !important;
  left: auto !important;
  width: 100% !important;
  margin: 0 0 8px !important;
  padding: 0 16px !important;
  z-index: 2 !important;
  isolation: isolate !important;
  pointer-events: auto !important;
}
html body.is-inbox .chat-box__footer .apple-notify-box-simple {
  width: auto !important;
  max-width: min(560px, calc(100% - 24px)) !important;
  min-height: 48px !important;
  margin: 0 auto !important;
  padding: 8px 10px 8px 14px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  border: 1px solid #f2c7c4 !important;
  border-radius: 14px !important;
  background: #fffafa !important;
  color: #3b4a45 !important;
  box-shadow: 0 4px 14px rgba(11,20,26,.08) !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  text-align: left !important;
  pointer-events: auto !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  cursor: pointer !important;
}
html body.is-inbox .chat-box__footer .apple-notify-box-simple .notify-info-left {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  width: auto !important;
  margin: 0 !important;
}
html body.is-inbox .chat-box__footer .apple-notify-box-simple .notify-info-left i {
  margin: 0 !important;
  color: #ea3d45 !important;
  font-size: 18px !important;
}
html body.is-inbox .chat-box__footer .btn-apple-simple:not(#_never_) {
  position: relative !important;
  z-index: 1001 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  min-width: 112px !important;
  min-height: 34px !important;
  padding: 7px 13px !important;
  border: 1px solid #008069 !important;
  border-radius: 9px !important;
  background: #008069 !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: none !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  opacity: 1 !important;
  cursor: inherit !important;
  pointer-events: none !important;
  touch-action: manipulation !important;
}
html body.is-inbox .chat-box__footer .apple-notify-box-simple .notify-info-left,
html body.is-inbox .chat-box__footer .apple-notify-box-simple .notify-info-left * {
  pointer-events: none !important;
}
html body.is-inbox .chat-box__footer .btn-apple-simple:hover {
  background: #006c59 !important;
  border-color: #006c59 !important;
}

/* Keep the transient conversation skeleton and status fully inside the chat canvas. */
html body.is-inbox .chatbox-area__body .msg-body.is-loading-conversation {
  position: relative !important;
  overflow-x: hidden !important;
}
html body.is-inbox .chatbox-area__body .msg-body .msg-skel {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  padding: 12px 0 24px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}
html body.is-inbox .chatbox-area__body .msg-body .msg-skel-row,
html body.is-inbox .chatbox-area__body .msg-body .msg-skel-bubble {
  min-width: 0 !important;
  box-sizing: border-box !important;
}
html body.is-inbox .chatbox-area__body .msg-body .message-loader--overlay {
  position: sticky !important;
  top: 8px !important;
  left: auto !important;
  width: max-content !important;
  max-width: calc(100% - 24px) !important;
  margin: 0 auto !important;
  transform: none !important;
}

/* Mobile conversation menu: compact, content-sized, and anchored to its chevron. */
@media (max-width: 767px) {
  html body.is-inbox .chat-box__footer .apple-notify-box-simple {
    max-width: calc(100% - 8px) !important;
    flex-direction: column !important;
    gap: 8px !important;
    padding: 10px 12px !important;
  }
  html body.is-inbox .dashboard .chat-list {
    isolation: isolate !important;
  }
  html body.is-inbox .dashboard .chat-list .chat-list__item {
    z-index: 0 !important;
  }
  html body.is-inbox .dashboard .chat-list .chat-list__item:has(.conversation-dropdown-menu.show),
  html body.is-inbox .dashboard .chat-list .chat-list__item:has(.chat-list__action-btn.show) {
    z-index: 100 !important;
    overflow: visible !important;
  }
  html body.is-inbox .dashboard .chat-list .chat-list__item:has(.conversation-dropdown-menu.show) .chat-list__actions,
  html body.is-inbox .dashboard .chat-list .chat-list__item:has(.chat-list__action-btn.show) .chat-list__actions {
    z-index: 101 !important;
  }
  html body.is-inbox .dashboard .chat-list .conversation-dropdown-menu:not(#_never_) {
    width: 190px !important;
    min-width: 190px !important;
    max-width: calc(100vw - 24px) !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: min(320px, calc(100dvh - 24px)) !important;
    margin: 0 !important;
    padding: 6px !important;
    border: 1px solid #e9edef !important;
    border-radius: 12px !important;
    background: #fff !important;
    box-shadow: 0 8px 24px rgba(11,20,26,.16) !important;
    z-index: 102 !important;
    isolation: isolate !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }
  html body.is-inbox .dashboard .chat-list .conversation-dropdown-menu > li {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  html body.is-inbox .dashboard .chat-list .conversation-dropdown-menu > li:has(> .dropdown-item[style*="display: none"]),
  html body.is-inbox .dashboard .chat-list .conversation-dropdown-menu > li:has(> .dropdown-item.d-none) {
    display: none !important;
  }
  html body.is-inbox .dashboard .chat-list .conversation-dropdown-menu .dropdown-item {
    width: 100% !important;
    min-height: 38px !important;
    height: auto !important;
    margin: 0 !important;
    padding: 9px 10px !important;
    border-radius: 7px !important;
    font-size: 13px !important;
    line-height: 20px !important;
  }
  html body.is-inbox .dashboard .chat-list .conversation-dropdown-menu .dropdown-divider {
    height: 1px !important;
    min-height: 1px !important;
    margin: 4px 2px !important;
  }
}

/* Final mobile composer lock: keep the send/microphone slot inside the pane. */
@media (max-width: 991px) {
  html body.is-inbox .chatbox-area__body #message-form .input-area {
    position: relative !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding-right: 44px !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }
  html body.is-inbox .chatbox-area__body #message-form .input-group {
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  html body.is-inbox .chatbox-area__body #message-form .send-text-btn,
  html body.is-inbox .chatbox-area__body #message-form .start-recording-btn {
    position: absolute !important;
    right: 2px !important;
    top: 50% !important;
    z-index: 5 !important;
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    transform: translateY(-50%) !important;
  }
  html body.is-inbox .chatbox-area__body #message-form .send-text-btn:not(.d-none) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #00a884 !important;
    color: #fff !important;
    border-radius: 50% !important;
  }
  html body.is-inbox .chatbox-area__body #message-form .send-text-btn svg path {
    stroke: #fff !important;
  }
}

/* Final cross-viewport send-button colour lock. */
html body.is-inbox .chatbox-area__body #message-form .send-text-btn:not(.d-none):not(:disabled) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #00a884 !important;
  border: 1px solid #00a884 !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}
html body.is-inbox .chatbox-area__body #message-form .send-text-btn:not(.d-none):not(:disabled):hover,
html body.is-inbox .chatbox-area__body #message-form .send-text-btn:not(.d-none):not(:disabled):focus-visible {
  background: #008069 !important;
  border-color: #008069 !important;
  color: #fff !important;
  box-shadow: 0 0 0 3px rgba(0,168,132,.14) !important;
}
html body.is-inbox .chatbox-area__body #message-form .send-text-btn:not(.d-none) svg,
html body.is-inbox .chatbox-area__body #message-form .send-text-btn:not(.d-none) svg path {
  display: block !important;
  opacity: 1 !important;
  stroke: #fff !important;
}

/* WhatsApp Web-style thin media framing + image/caption width match.
   Higher specificity than the generic .message-content padding rule above
   (which otherwise wins over the apple-style.css media rules) so it applies
   reliably to media messages specifically. */
/* Both image-only and image+caption bubbles share the exact same fixed width
   now (previously image-only used fit-content sizing, which varied per photo
   and no longer matched the caption case). A shared fixed width on both,
   combined with object-fit:cover below, is what guarantees the caption text
   can never be wider than the image, regardless of the photo's own aspect
   ratio — fit-content can't give that guarantee when text is present. */
html body.is-inbox .chatbox-area__body .single-message .message-content.is-image-only,
html body.is-inbox .chatbox-area__body .single-message .message-content.has-media:not(.is-image-only) {
  width: 260px !important;
  max-width: 260px !important;
  min-width: 260px !important;
  padding: 0 !important; /* Image sits flush at the top/sides, like WhatsApp Web. */
  margin: 0 !important;
  gap: 0 !important;
}

html body.is-inbox .chatbox-area__body .single-message .message-content.has-media:not(.is-image-only) .message-text {
  padding: 6px 8px 8px !important;
  margin: 0 !important;
}

/* Zero every possible spacing source on the elements between the bubble edge
   and the actual <img> — margin, padding, and inline-block/max-content sizing
   in the template markup can each independently leave a visible gap. */
html body.is-inbox .chatbox-area__body .single-message .message-content.is-image-only .media-container,
html body.is-inbox .chatbox-area__body .single-message .message-content.has-media .media-container,
html body.is-inbox .chatbox-area__body .single-message .message-content.is-image-only .view-media-image,
html body.is-inbox .chatbox-area__body .single-message .message-content.has-media .view-media-image {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
  font-size: 0 !important;
}

html body.is-inbox .chatbox-area__body .single-message .message-content.is-image-only .message-image,
html body.is-inbox .chatbox-area__body .single-message .message-content.has-media .message-image {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important; /* Preserve the photo's original aspect ratio at the fixed 260px width, no cropping */
  max-height: none !important;
  margin: 0 !important;
}

/* Media messages (with or without a caption) should have uniformly rounded
   corners like a real photo thumbnail, not the "tail" cutout used for text
   bubbles above. */
html body.is-inbox .chatbox-area__body .single-message .message-content.is-image-only,
html body.is-inbox .chatbox-area__body .single-message .message-content.has-media {
  border-radius: 8px !important;
}

/* The corner-clip used to live on .message-content itself (overflow:hidden),
   but .message-actions (the Reply/React dropdown trigger) is also a child
   of .message-content — so opening that menu on a photo or video message
   got hard-clipped to the bubble's own box, regardless of z-index (overflow
   clipping isn't a stacking-order thing, it applies no matter how high a
   descendant's z-index is). The image/video itself is already flush with
   the bubble's edges (0 margin/padding, 100% width, set below), so clipping
   at this inner wrapper instead produces the identical rounded-thumbnail
   look without trapping the dropdown. */
html body.is-inbox .chatbox-area__body .single-message .message-content.is-image-only .media-container,
html body.is-inbox .chatbox-area__body .single-message .message-content.is-image-only .view-media-image {
  overflow: hidden !important;
  border-radius: 8px !important;
}

html body.is-inbox .chatbox-area__body .single-message .message-content.has-media:not(.is-image-only) .media-container,
html body.is-inbox .chatbox-area__body .single-message .message-content.has-media:not(.is-image-only) .view-media-image {
  overflow: hidden !important;
  border-radius: 8px 8px 0 0 !important;
}

/* Reset the media action button (reply/emoji dropdown trigger) to match the
   plain text-message style: transparent/white background, dark icon —
   instead of the translucent dark circular overlay used elsewhere for photos. */
html body.is-inbox .chatbox-area__body .single-message .message-content.is-image-only .message-action-btn,
html body.is-inbox .chatbox-area__body .single-message .message-content.has-media .message-action-btn {
  background: #ffffff !important; /* Solid white — this button floats over photo content, so transparent (fine for text bubbles) would blend into the image */
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25) !important;
  border: 0 !important;
  border-radius: 50% !important;
  width: 26px !important;
  height: 26px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #111b21 !important;
}

html body.is-inbox .chatbox-area__body .single-message .message-content.is-image-only .message-action-btn svg,
html body.is-inbox .chatbox-area__body .single-message .message-content.has-media .message-action-btn svg {
  color: #111b21 !important;
}
