/* Console team chat — sidebar + message pane, handheld-first.
   Uses the shared --o-* tokens from odoo.css. */
.o_chat_layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 12px;
  align-items: start;
}
.o_chat_sidebar {
  background: var(--o-sheet);
  border: 1px solid var(--o-border-light);
  border-radius: 6px;
  padding: 6px;
  max-height: calc(100vh - 210px);
  overflow-y: auto;
}
.o_chat_channel {
  display: block;
  width: 100%;
  text-align: left;
  background: transparent;
  border: 0;
  border-radius: 5px;
  padding: 8px 10px;
  cursor: pointer;
  font: inherit;
  color: var(--o-text);
}
.o_chat_channel:hover { background: var(--o-brand-soft); }
.o_chat_channel.active { background: var(--o-brand-soft); box-shadow: inset 3px 0 0 var(--o-brand); }
.o_chat_channel_head { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
.o_chat_channel_preview {
  font-size: 12px;
  margin-top: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.o_chat_presence_dot {
  display: inline-block; flex: none; width: 8px; height: 8px;
  border-radius: 50%; background: #aeb7ae;
}
.o_chat_presence_dot.online { background: #55ad5f; box-shadow: 0 0 0 3px rgba(85,173,95,.12); }
.o_chat_presence_dot.offline { background: #aeb7ae; }
.o_chat_presence_line {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 10px; font-weight: 600; line-height: 1.2;
}
.o_chat_pane {
  background: var(--o-sheet);
  border: 1px solid var(--o-border-light);
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  min-height: 420px;
  max-height: calc(100vh - 210px);
}
.o_chat_pane_head {
  padding: 10px 14px;
  border-bottom: 1px solid var(--o-border-light);
}
.o_chat_list_wrap {
  position: relative; flex: 1 1 auto; min-height: 0;
  display: flex; flex-direction: column;
}
/* The list is the one scroll container in a conversation. It owns all the
   empty space (flex:1), never chains a scroll to the page behind it, and the
   composer sits outside it at the bottom of the pane. */
.o_chat_messages {
  position: relative; flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 12px 14px;
  overscroll-behavior: contain; -webkit-overflow-scrolling: touch; touch-action: pan-y;
}
.o_chat_pane > .o_chat_composer_row, .o_chat_pane > .o_chat_typing,
.o_chat_pane > .o_chat_join_requests { flex: none; }
.o_chat_thread_empty { padding: 18px 4px; text-align: center; font-size: 12px; }
/* Unread divider: one thin line, drawn once per open. */
.o_chat_unread_divider {
  display: flex; align-items: center; gap: 8px; margin: 4px 0 12px;
  color: var(--o-danger); font-size: 10px; font-weight: 750; letter-spacing: .04em;
}
.o_chat_unread_divider::before, .o_chat_unread_divider::after {
  content: ''; flex: 1; height: 1px; background: currentColor; opacity: .45;
}
/* Jump to latest: a small round arrow over the bottom-right of the list. */
.o_chat_jump_btn {
  position: absolute; right: 12px; bottom: 10px; z-index: 3;
  width: 36px; height: 36px; padding: 0; display: grid; place-items: center;
  border: 1px solid var(--o-border-light); border-radius: 50%;
  background: var(--o-sheet); color: var(--o-brand-dark); cursor: pointer;
  box-shadow: 0 2px 8px rgba(25,57,25,.14);
}
.o_chat_jump_btn[hidden] { display: none; }
.o_chat_jump_btn svg { display: block; transform: rotate(90deg); }
.o_chat_jump_btn:hover { background: var(--o-brand-soft); }
.o_chat_jump_btn:focus-visible { outline: 2px solid rgba(128, 190, 126, .75); outline-offset: 2px; }
.o_chat_jump_badge {
  position: absolute; top: -5px; right: -5px; min-width: 17px; height: 17px; padding: 0 4px;
  border: 2px solid var(--o-sheet); border-radius: 9px; background: var(--o-brand); color: #fff;
  font-size: 9px; font-weight: 800; line-height: 13px; text-align: center;
}
.o_chat_jump_badge[hidden] { display: none; }
/* Screen readers hear new incoming messages here, and nothing else. */
.o_chat_live {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.o_chat_load_older {
  display: block; margin: 0 auto 12px; padding: 5px 10px;
  border: 1px solid var(--o-border); border-radius: 999px;
  background: var(--o-sheet); color: var(--o-brand-dark); font: inherit;
  font-size: 11px; font-weight: 700; cursor: pointer;
}
.o_chat_msg { position: relative; width: fit-content; margin-bottom: 10px; max-width: 78%; }
/* Follow-on messages in one author's run sit tight under the first. */
.o_chat_msg.continued { margin-top: -6px; }
.o_chat_msg.pending .o_chat_msg_body, .o_chat_msg.pending .o_chat_attachments { opacity: .62; }
.o_chat_msg.failed .o_chat_msg_body { border-color: var(--o-danger); }
.o_chat_send_state {
  display: flex; justify-content: flex-end; align-items: center; gap: 2px;
  margin-top: 2px; color: var(--o-muted); font-size: 10px;
}
.o_chat_send_state svg { display: block; opacity: .7; }
.o_chat_send_state.failed { color: var(--o-danger); font-weight: 650; }
.o_chat_retry {
  padding: 0; border: 0; background: transparent; color: inherit;
  font: inherit; text-decoration: underline; cursor: pointer;
}
/* A deep-linked message glows once, then settles. */
@keyframes o-chat-anchor {
  0%, 35% { box-shadow: 0 0 0 4px rgba(214, 170, 52, .45); }
  100% { box-shadow: 0 0 0 4px rgba(214, 170, 52, 0); }
}
.o_chat_msg.is-anchor .o_chat_msg_body,
.o_chat_msg.is-anchor .o_chat_attachments { animation: o-chat-anchor 2s ease-out 1; border-radius: 10px; }
.o_chat_msg.mine { margin-left: auto; }
.o_chat_msg_meta { display: flex; align-items: center; gap: 6px; font-size: 12px; margin-bottom: 4px; min-width: 0; white-space: nowrap; }
.o_chat_msg_meta > .text-strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.o_chat_msg_meta > .text-muted { flex: none; font-size: 10px; }
.o_chat_msg_meta.mine { justify-content: flex-end; }
.o_chat_message_avatar { display: inline-grid; place-items: center; flex: none; width: 24px; height: 24px; overflow: hidden; border-radius: 50%; object-fit: cover; background: var(--o-brand-soft); color: var(--o-text); border: 1px solid var(--o-border); font-size: 10px; font-weight: 800; line-height: 1; box-sizing: border-box; }
.o_chat_avatar_fallback { display: grid; place-items: center; width: 100%; height: 100%; }
.o_chat_message_tools { display: flex; align-items: center; gap: 2px; position: absolute; z-index: 2; right: 7px; top: -30px; width: fit-content; padding: 3px; border: 1px solid var(--o-border-light); border-radius: 999px; background: var(--o-sheet); box-shadow: 0 4px 12px rgba(25,57,25,.12); opacity: 0; transform: translateY(-3px); transition: opacity .14s ease, transform .14s ease; }
.o_chat_msg.mine .o_chat_message_tools { right: 7px; }
.o_chat_msg:hover .o_chat_message_tools, .o_chat_msg:focus-within .o_chat_message_tools { opacity: 1; transform: translateY(0); }
.o_chat_message_tool, .o_chat_inline_btn { width: 28px; height: 28px; display: inline-grid; place-items: center; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--o-muted); cursor: pointer; }
.o_chat_message_tool:hover, .o_chat_inline_btn:hover { background: var(--o-brand-soft); color: var(--o-brand-dark); }
.o_chat_edited { display: block; margin-top: 2px; color: var(--o-muted); font-size: 10px; }
.o_chat_msg_body {
  background: var(--o-ground);
  border: 1px solid var(--o-border-light);
  border-radius: 10px;
  padding: 7px 11px;
  word-break: break-word;
}
.o_chat_msg.mine .o_chat_msg_body {
  background: var(--o-brand-soft);
  border-color: var(--o-brand-light);
}
.o_chat_deleted_body { color: var(--o-muted); font-style: italic; background: transparent !important; border-style: dashed; }
.o_chat_delete_confirm {
  position: absolute; z-index: 9; right: 6px; top: calc(100% + 4px);
  display: flex; align-items: center; gap: 7px; padding: 5px 7px 5px 10px;
  border: 1px solid var(--o-border-light); border-radius: 10px;
  background: var(--o-sheet); color: var(--o-text); box-shadow: 0 8px 20px rgba(25,57,25,.2);
  font-size: 11px; white-space: nowrap;
}
.o_chat_delete_confirm button { padding: 4px 7px; border: 0; border-radius: 6px; cursor: pointer; font: inherit; }
.o_chat_delete_cancel { background: transparent; color: var(--o-muted); }
.o_chat_delete_accept { background: var(--o-danger); color: #fff; }
.o_chat_reactions { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.o_chat_reaction, .o_chat_react_add, .o_chat_reaction_choice {
  border: 1px solid var(--o-border-light); border-radius: 999px;
  background: var(--o-sheet); color: var(--o-text); cursor: pointer;
}
.o_chat_reaction { padding: 2px 7px; font-size: 13px; }
.o_chat_reaction.mine { border-color: var(--o-brand); background: var(--o-brand-soft); }
.o_chat_reaction small { margin-left: 4px; font-size: 10px; }
.o_chat_react_add {
  width: 24px; height: 24px; padding: 0; color: var(--o-muted);
  opacity: 0; pointer-events: none; transition: opacity .14s ease;
}
.o_chat_msg:hover .o_chat_react_add,
.o_chat_msg:focus-within .o_chat_react_add { opacity: 1; pointer-events: auto; }
.o_chat_reaction_picker { display: flex; justify-content: center; gap: 8px; }
.o_chat_reaction_choice { width: 42px; height: 42px; font-size: 21px; }
.o_chat_reaction_popover {
  position: absolute; z-index: 8; right: 0; top: 18px;
  max-width: calc(100vw - 32px); overflow-x: auto;
  display: flex; align-items: center; gap: 2px; padding: 4px 6px;
  border: 1px solid var(--o-border-light); border-radius: 999px;
  background: var(--o-sheet); box-shadow: 0 8px 20px rgba(25,57,25,.2);
}
.o_chat_msg.mine .o_chat_reaction_popover { right: 0; left: auto; }
.o_chat_msg:has(.o_chat_reaction_popover) .o_chat_message_tools { opacity: 1; transform: translateY(0); }
.o_chat_reaction_popover .o_chat_reaction_choice {
  width: 30px; height: 30px; padding: 0; border: 0; border-radius: 50%;
  background: transparent; font-size: 17px; cursor: pointer;
}
.o_chat_reaction_popover .o_chat_reaction_choice:hover { background: var(--o-brand-soft); }
.o_chat_composer_row {
  display: flex;
  gap: 8px;
  padding: 10px;
  border-top: 1px solid var(--o-border-light);
  align-items: flex-end;
}
.o_chat_composer {
  flex: 1 1 auto; width: auto; min-width: 0; min-height: 36px; resize: none;
  /* Grow with the text instead of scrolling a one-line slot (Martha, 2026-09-15:
     "we can only type 1 line then have to scroll down"). field-sizing is native
     auto-grow; where it is unsupported the rows/min-height floor above still
     gives a usable box, so this degrades to a taller textarea, never a worse one. */
  field-sizing: content;
  max-height: 168px; padding: 7px 72px 7px 12px; border: 0; background: transparent;
}
.o_chat_input_shell { position: relative; display: flex; align-items: flex-end; flex: 1 1 auto; min-width: 0; min-height: 42px; border: 1px solid var(--o-border-light); border-radius: 22px; background: var(--o-ground); }
.o_chat_input_shell:focus-within { border-color: var(--o-brand-light); box-shadow: 0 0 0 2px rgba(69,153,69,.12); }
.o_chat_input_shell .o_chat_inline_btn { position: absolute; bottom: 6px; }
.o_chat_input_shell .o_chat_inline_btn:nth-last-child(2) { right: 36px; }
.o_chat_input_shell .o_chat_inline_btn:last-child { right: 6px; }
.o_chat_add_btn, .o_chat_send_btn,
.o_chat_icon_btn.o_chat_add_btn, .o_chat_icon_btn.o_chat_send_btn {
  width: 38px; height: 38px; min-width: 38px; padding: 0; border-radius: 50%;
}
.o_chat_add_btn { color: var(--o-brand-dark); background: var(--o-brand-soft); }
.o_chat_send_btn { color: #fff; background: var(--o-brand); }
.o_chat_send_btn:hover { background: var(--o-brand-dark); }
.o_chat_attachment_menu, .o_chat_emoji_menu { position: absolute; z-index: 50; bottom: calc(100% - 2px); display: flex; gap: 4px; max-width: calc(100% - 20px); padding: 5px; border: 1px solid var(--o-border-light); border-radius: 12px; background: var(--o-sheet); box-shadow: 0 10px 24px rgba(25,57,25,.16); box-sizing: border-box; }
.o_chat_attachment_menu { left: 10px; flex-direction: column; }
.o_chat_attachment_menu.from-more { left: auto; right: 44px; }
.o_chat_emoji_menu { left: 10px; right: 10px; justify-content: center; flex-wrap: wrap; }
.o_chat_attachment_menu[hidden], .o_chat_emoji_menu[hidden] { display: none; }
.o_chat_menu_item { display: inline-flex; align-items: center; gap: 7px; min-width: 86px; padding: 7px 9px; border: 0; border-radius: 8px; background: transparent; color: var(--o-text); font: inherit; font-size: 11px; text-align: left; cursor: pointer; }
.o_chat_menu_item:hover { background: var(--o-brand-soft); }
.o_chat_emoji_choice { width: 32px; height: 32px; padding: 0; border: 0; border-radius: 8px; background: transparent; font-size: 19px; cursor: pointer; }
.o_chat_emoji_choice:hover { background: var(--o-brand-soft); }
.o_chat_edit_form { display: grid; gap: 6px; }
.o_chat_edit_input { width: 100%; min-height: 56px; resize: vertical; }
.o_chat_edit_actions { display: flex; align-items: center; gap: 6px; }
.o_chat_edit_actions .btn { min-height: 28px; padding: 4px 9px; font-size: 11px; }
.o_chat_edit_status { color: var(--o-muted); font-size: 10px; }
.o_chat_composer_row.is-drop-target {
  background: var(--o-brand-soft);
  outline: 2px dashed var(--o-brand);
  outline-offset: -4px;
}
.o_chat_composer_row > .o_chat_icon_btn { flex: 0 0 auto; }
.o_chat_typing {
  flex: none; min-height: 24px; padding: 5px 12px 4px;
  display: flex; align-items: center; gap: 7px;
  color: #6d756d; font-size: 11px; font-weight: 600;
}
.o_chat_typing[hidden] { display: none; }
.o_chat_join_requests {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  flex: none; width: auto; margin: 0 9px 5px; padding: 7px 9px;
  border: 1px solid #dfca84; border-radius: 7px; background: #fbf6e8; color: #66531f;
  font: 650 10px/1.2 var(--o-font); text-align: left; cursor: pointer;
}
.o_chat_join_requests[hidden] { display: none; }
.o_chat_join_requests b { color: #4c702f; font-size: 10px; }
.o_chat_join_review { display: grid; gap: 7px; }
.o_chat_join_review_row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--o-border-light); }
.o_chat_join_review_row > div:first-child { display: flex; flex-direction: column; min-width: 0; }
.o_chat_join_review_row > div:first-child span { color: var(--o-muted); font-size: 10px; }
.o_chat_join_review_row > div:last-child { display: flex; gap: 6px; }
.o_chat_join_review_row .btn { min-height: 30px; padding: 5px 9px; font-size: 10px; }
.o_chat_typing_dots { display: inline-flex; align-items: center; gap: 2px; }
.o_chat_typing_dots i {
  width: 4px; height: 4px; border-radius: 50%; background: #a78435;
  animation: o-chat-typing 1.15s ease-in-out infinite;
}
.o_chat_typing_dots i:nth-child(2) { animation-delay: .14s; }
.o_chat_typing_dots i:nth-child(3) { animation-delay: .28s; }
@keyframes o-chat-typing {
  0%, 60%, 100% { opacity: .35; transform: translateY(0); }
  30% { opacity: 1; transform: translateY(-2px); }
}

/* Handhelds and phones: one column, sidebar above the conversation. */
@media (max-width: 820px) {
  .o_chat_layout { grid-template-columns: 1fr; }
  .o_chat_sidebar { max-height: 190px; }
  .o_chat_pane { max-height: none; min-height: 320px; }
  .o_chat_msg { max-width: 92%; }
}

/* ---------------------------------------------------------------- mentions */
.o_chat_mention {
  padding: 0 3px;
  border-radius: 3px;
  background: rgba(69, 153, 69, .16);
  color: var(--o-brand-dark);
  font-weight: 700;
}
.o_chat_msg.mentions-me { box-shadow: inset 3px 0 0 var(--o-danger); }
.o_chat_msg.mentions-me .o_chat_mention { background: rgba(180, 67, 61, .16); color: var(--o-danger); }

/* Autocomplete sits above the composer, anchored to the row. */
.o_chat_composer_row { position: relative; }
.o_chat_suggest {
  position: absolute; z-index: 40; left: 10px; bottom: calc(100% + 4px);
  width: min(280px, calc(100% - 20px));
  background: #fff; border: 1px solid #cfd8cd; border-radius: 8px;
  box-shadow: 0 12px 28px rgba(25, 57, 25, .18); overflow: hidden;
}
.o_chat_suggest_row {
  display: flex; align-items: center; gap: 7px;
  width: 100%; padding: 8px 10px; text-align: left;
  background: transparent; border: 0; border-bottom: 1px solid var(--o-border-light);
  font: inherit; cursor: pointer;
}
.o_chat_suggest_presence { margin-left: auto; font-size: 10px; }
.o_chat_suggest_row:last-child { border-bottom: 0; }
.o_chat_suggest_row.active, .o_chat_suggest_row:hover { background: var(--o-brand-soft); }

/* ------------------------------------------------------------ attachments */
/* Big touch targets: gloved hands on a handheld, not a mouse. */
.o_chat_icon_btn { min-width: 42px; padding: 8px 10px; font-size: 16px; line-height: 1; }
.o_chat_composer_row .o_chat_icon_btn.o_chat_add_btn,
.o_chat_composer_row .o_chat_icon_btn.o_chat_send_btn {
  min-width: 38px; padding: 0;
}

/* Final composer contract: the message field is the visual anchor.  The
   dark-theme sheet rules are intentionally overridden here because they would
   turn the transparent textarea back into a second boxed control. */
.o_chat_composer_row .o_chat_input_shell {
  min-height: 42px;
  border: 0;
  border-radius: 22px;
  background: var(--o-brand-soft);
  box-shadow: none;
}
.o_chat_composer_row .o_chat_input_shell:focus-within {
  border: 0;
  box-shadow: 0 0 0 2px rgba(128, 190, 126, .32);
}
.o_chat_composer_row .o_chat_input_shell .o_chat_composer,
.o_chat_composer_row .o_chat_input_shell .o_chat_composer:focus {
  min-height: 42px;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  color: var(--o-text) !important;
}
.o_chat_composer_row .o_chat_add_btn,
.o_chat_composer_row .o_chat_send_btn {
  display: inline-grid;
  place-items: center;
  align-content: center;
  flex: 0 0 38px;
  border: 0;
  box-shadow: none;
}
.o_chat_composer_row .o_chat_add_btn svg,
.o_chat_composer_row .o_chat_send_btn svg {
  display: block;
  width: 18px;
  height: 18px;
  margin: 0;
}
.o_chat_composer_row .o_chat_add_btn:focus,
.o_chat_composer_row .o_chat_send_btn:focus { outline: 0; }
.o_chat_composer_row .o_chat_add_btn:focus-visible,
.o_chat_composer_row .o_chat_send_btn:focus-visible {
  outline: 2px solid rgba(128, 190, 126, .75);
  outline-offset: 2px;
}
.o_chat_attachments { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.o_chat_photo_wrap { padding: 0; border: 0; background: transparent; cursor: zoom-in; }
.o_chat_photo {
  display: block; max-width: 240px; max-height: 240px;
  border: 1px solid var(--o-border-light); border-radius: 8px; object-fit: cover;
}
.o_chat_photo_full { display: block; width: 100%; height: auto; border-radius: 6px; }
.o_chat_file {
  display: inline-flex; align-items: center; gap: 8px; max-width: 100%;
  padding: 7px 10px; border: 1px solid var(--o-border-light);
  border-radius: 8px; background: var(--o-sheet); color: var(--o-text);
  font: inherit; font-size: 12px; text-align: left;
}
button.o_chat_file { cursor: pointer; }
button.o_chat_file:hover { border-color: var(--o-brand-light); background: var(--o-brand-soft); }
button.o_chat_file.is-loading { cursor: progress; opacity: .7; }
.o_chat_file_name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.o_chat_existing_note { color: var(--o-text); font-weight: 650; }
.o_chat_uploading { padding: 8px 4px; font-size: 12px; font-style: italic; }

/* -------------------------------------------------- navbar chat indicator */
.o_chat_notice { position: relative; display: inline-flex; }
.o_chat_trigger {
  position: relative; display: inline-grid; place-items: center;
  width: 32px; height: 32px; padding: 0;
  border: 1px solid #d7e0d5; border-radius: 50%;
  background: rgba(255, 255, 255, .72); color: #536055; cursor: pointer;
}
.o_chat_trigger:hover,
.o_chat_trigger[aria-expanded="true"] { background: #fff; border-color: #b9cab6; }
.o_chat_trigger:focus-visible { outline: 3px solid rgba(69, 153, 69, .32); outline-offset: 2px; }
.o_chat_trigger_icon { font-size: 14px; line-height: 1; }
.o_chat_badge {
  position: absolute; top: -6px; right: -6px; min-width: 17px; height: 17px; padding: 0 4px;
  border: 2px solid #f8faf7; border-radius: 9px;
  background: #6b7a6c; color: #fff;
  font-size: 9px; font-weight: 800; line-height: 13px; text-align: center;
}
/* Being named is louder than being in the room. */
.o_chat_badge.mention { background: #b4433d; }
.o_chat_badge.inline { position: static; border: 0; background: #6b7a6c; }
.o_chat_notice_panel {
  position: fixed; z-index: 550; top: 62px; right: 12px;
  width: min(380px, calc(100vw - 24px)); max-height: calc(100vh - 74px); overflow: hidden;
  color: var(--o-text); background: #fff; border: 1px solid #cfd8cd;
  border-radius: 9px; box-shadow: 0 16px 36px rgba(25, 57, 25, .2);
}
.o_chat_notice_header {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  padding: 12px 14px 10px; border-bottom: 1px solid var(--o-border-light);
}
.o_chat_notice_header strong { color: var(--o-text-strong); font-size: 13px; }
.o_chat_notice_body { max-height: calc(100vh - 118px); overflow-y: auto; }
.o_chat_notice_empty { padding: 22px 16px; color: var(--o-muted); font-size: 11px; text-align: center; }
.o_chat_notice_row {
  display: block; width: 100%; padding: 10px 14px; text-align: left;
  background: transparent; border: 0; border-bottom: 1px solid var(--o-border-light);
  font: inherit; cursor: pointer;
}
.o_chat_notice_row:hover { background: var(--o-brand-soft); }
.o_chat_notice_row.mention { box-shadow: inset 3px 0 0 var(--o-danger); }
.o_chat_notice_row_head { display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.o_chat_notice_row_preview {
  margin-top: 3px; font-size: 11px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* =====================================================================
   Console chat: a bubble that opens into a panel down the left side.

   The header spans the full window and the panel starts BELOW it — chat is a
   companion to the console, not a column the console has to make room for.
   Only the content area is offset, never the navbar.
   ===================================================================== */
:root {
  --o-chat-strip-w: 56px; --o-chat-panel-w: 356px;
  --o-chat-top: calc(56px + var(--o-safe-top, 0px));
}

/* ---- expanded: icon strip + conversation -------------------------------- */
/* Three widths, not two: bubble -> just the bubbles -> bubbles + conversation.
   Closing a conversation should give the width back, not leave an empty
   column sitting next to the icons. */
.o_chat_panel {
  position: fixed; left: 0; top: var(--o-chat-top); bottom: 0; z-index: 205;
  width: var(--o-chat-strip-w);
  display: flex; flex-direction: row; overflow: hidden;
  background: var(--o-sheet); border-right: 1px solid #dbe4d9;
  box-shadow: 4px 0 18px rgba(25, 57, 25, .07);
}
.o_chat_panel[hidden] { display: none; }
body.o_chat_expanded .o_chat_panel { width: var(--o-chat-panel-w); }


/* The strip: one square per conversation, so every chat and channel is one
   click away without spending the width a list of names would cost. */
.o_chat_strip {
  flex: 0 0 var(--o-chat-strip-w); width: var(--o-chat-strip-w);
  min-height: 0; display: flex; flex-direction: column; align-items: center; gap: 8px;
  padding: 8px 0; border-right: 1px solid var(--o-border-light);
  background: linear-gradient(180deg, rgba(69,153,69,.08), rgba(251,252,250,.98) 26%);
}
.o_chat_strip_list {
  flex: 1; width: 100%; min-height: 0; overflow-y: auto; overflow-x: hidden;
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  /* Keep the first unread badge and last presence dot inside the scrollport. */
  padding: 6px 0;
  overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
  /* No scrollbar furniture in a 56px column — it would eat a third of it. */
  scrollbar-width: none;
}
.o_chat_strip_list::-webkit-scrollbar { width: 0; }
.o_chat_strip_btn {
  width: 34px; height: 34px; flex: none; display: grid; place-items: center;
  border: 1px solid #d7e0d5; border-radius: 50%;
  background: rgba(255,255,255,.8); color: #536055;
  font-size: 15px; line-height: 1; cursor: pointer;
}
.o_chat_strip_btn:hover { background: #fff; border-color: #b9cab6; }
.o_chat_strip_btn.active {
  border-color: var(--o-brand); background: var(--o-brand-soft); color: var(--o-brand-dark);
  box-shadow: 0 0 0 2px rgba(69,153,69,.16);
}
.o_chat_strip_btn:focus-visible { outline: 3px solid rgba(69,153,69,.32); outline-offset: 2px; }
.o_companion_phone_btn { position: relative; }
.o_companion_voicemail_badge {
  position: absolute; top: -7px; right: -9px; min-width: 19px; height: 19px;
  padding: 0 4px; border-radius: 10px; background: #b3261e; color: #fff;
  font-size: 10px; font-weight: 750; line-height: 19px; text-align: center;
}

.o_chat_chip {
  position: relative; width: 38px; height: 38px; flex: none;
  display: grid; place-items: center;
  border: 1px solid #d7e0d5; border-radius: 12px;
  background: #fff; color: #445147; cursor: pointer;
  font: 600 12px/1 var(--o-font);
}
.o_chat_chip:hover { border-color: #b9cab6; }
.o_chat_chip:focus-visible { outline: 3px solid rgba(69,153,69,.32); outline-offset: 2px; }
.o_chat_chip.active { border-color: var(--o-brand); box-shadow: 0 0 0 2px rgba(69,153,69,.22); }
/* Unread is a FILL, not an outline: at 38px a border colour is far too quiet
   to notice from across a room, and being noticed is the chip's whole job. */
.o_chat_chip.unread { border-color: #9fb39f; background: #eaf3ea; color: var(--o-brand-dark); }
.o_chat_chip.mention { border-color: #b4433d; background: #fbe9e8; color: #8d332e; }
.o_chat_chip_glyph { pointer-events: none; }
.o_chat_chip.shared {
  border-color: #d6bf7b; background: #f4e7bb; color: #66501f;
}
.o_chat_chip.shared:hover { border-color: #b99a42; background: #f0dfa5; }
.o_chat_chip.shared.active {
  border-color: #9f8234; box-shadow: 0 0 0 2px rgba(183, 145, 42, .22);
}
.o_chat_shared_initials {
  flex: none; min-width: 25px; height: 25px; padding: 0 4px;
  display: inline-grid; place-items: center;
  border: 1px solid #d6bf7b; border-radius: 7px;
  background: #f4e7bb; color: #66501f;
  font-size: 9px; font-weight: 800; line-height: 1;
}
.o_chat_chip_presence {
  position: absolute; right: -2px; bottom: -2px; width: 10px; height: 10px;
  border: 2px solid #f8faf7; border-radius: 50%; background: #aeb7ae;
}
.o_chat_chip_presence.online { background: #55ad5f; }
.o_chat_chip_presence.offline { background: #aeb7ae; }
.o_chat_chip_count {
  position: absolute; top: -5px; right: -5px;
  min-width: 17px; height: 17px; padding: 0 4px;
  border: 2px solid #f8faf7; border-radius: 9px;
  background: #6b7a6c; color: #fff;
  font-size: 9px; font-weight: 800; line-height: 13px; text-align: center;
}
.o_chat_chip.mention .o_chat_chip_count { background: #b4433d; }

.o_chat_panel_convo {
  flex: 1; min-width: 0; min-height: 0; overflow: hidden;
  display: flex; flex-direction: column;
}
.o_companion_phone {
  flex: 1; min-width: 0; min-height: 0; overflow: hidden; background: #f7f9f6;
}
.o_companion_phone_frame { display: block; width: 100%; height: 100%; border: 0; }
.o_chat_convo_head {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 7px 6px 7px 12px; flex: none; min-height: 46px;
  border-bottom: 1px solid var(--o-border-light);
  background: var(--o-brand-soft);
}
.o_chat_convo_name {
  min-width: 0; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap;
}
.o_chat_convo_identity {
  flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column;
  justify-content: center; gap: 1px;
}
.o_chat_panel_btn {
  width: 28px; height: 28px; flex: none; display: grid; place-items: center;
  border: 1px solid transparent; border-radius: 6px;
  background: transparent; color: var(--o-muted); cursor: pointer;
  font-size: 14px; line-height: 1;
}
.o_chat_panel_btn:hover { background: #fff; color: var(--o-text-strong); }
.o_chat_panel_btn:focus-visible { outline: 3px solid rgba(69,153,69,.32); outline-offset: 1px; }
.o_chat_head_actions { display: flex; align-items: center; gap: 2px; }
.o_chat_mobile_close, .o_chat_mobile_new, .o_chat_mobile_launcher { display: none; }

/* ---- "something just arrived" -------------------------------------------
   A standing unread count says there IS a message; this says one just LANDED.
   It stops on its own so nothing blinks forever. */
@keyframes o-chat-flash {
  0%, 100% { box-shadow: 0 0 0 0 rgba(69, 153, 69, 0); }
  35%      { box-shadow: 0 0 0 5px rgba(69, 153, 69, .30); }
}
@keyframes o-chat-flash-mention {
  0%, 100% { box-shadow: 0 0 0 0 rgba(180, 67, 61, 0); }
  35%      { box-shadow: 0 0 0 6px rgba(180, 67, 61, .34); }
}
.o_chat_chip.flash { animation: o-chat-flash 1.1s ease-in-out 4; }
.o_chat_chip.flash.mention { animation-name: o-chat-flash-mention; }
/* Motion is an accessibility choice: keep the colour, which carries the
   meaning, and drop the pulsing. */
@media (prefers-reduced-motion: reduce) {
  .o_chat_chip.flash { animation: none; }
  .o_chat_chip.flash { outline: 2px solid var(--o-brand); outline-offset: 1px; }
  .o_chat_chip.flash.mention { outline-color: #b4433d; }
  .o_chat_typing_dots i { animation: none; opacity: .72; }
  .o_chat_msg.is-anchor .o_chat_msg_body,
  .o_chat_msg.is-anchor .o_chat_attachments { animation: none; outline: 2px solid rgba(214, 170, 52, .7); }
}

.o_chat_pane.compact {
  flex: 1; min-height: 0; max-height: none;
  border: 0; border-radius: 0; background: transparent;
}
.o_chat_pane.compact .o_chat_messages { padding: 10px; }
.o_chat_pane.compact .o_chat_msg { max-width: 94%; }
.o_chat_pane.compact .o_chat_composer_row { padding: 8px; gap: 6px; }
.o_chat_pane.compact .o_chat_composer { min-height: 36px; max-height: 30vh; }
.o_chat_empty { padding: 22px 14px; text-align: center; font-size: 12px; }
.o_chat_pick_summary { margin: 8px 0 2px; font-size: 12px; }

/* Big touch targets: gloved hands on a handheld, not a mouse. */
.o_chat_icon_btn { min-width: 42px; padding: 8px 10px; font-size: 16px; line-height: 1; }

@media (min-width: 992px) {
  /* Offset ONLY the content area. The navbar keeps the full window width, so
     the header runs across the top and the panel sits under it. */
  body.o_has_chat_rail .o_action_manager {
    padding-left: var(--o-chat-strip-w);
  }
  body.o_has_chat_rail.o_chat_expanded .o_action_manager {
    padding-left: var(--o-chat-panel-w);
  }
  /* The panel already lists conversations; the navbar badge would be the
     same information twice. */
  body.o_has_chat_rail .o_chat_notice { display: none; }
  /* On the Chat page the panel stands down: the page IS the conversation. */
}

/* Handhelds: the panel takes the screen while it is open (there is no room to
   sit beside anything), and the bubble is how you get back out. */
@media (max-width: 991px) {
  .o_chat_notice { flex: none; }
  .o_chat_trigger { width: 40px; height: 40px; }
  .o_chat_notice_panel { top: calc(var(--o-safe-top, 0px) + 62px); }
  .o_chat_panel {
    display: none;
    inset: var(--o-chat-panel-top, 0px) 0 auto;
    width: 100vw;
    height: 100vh;
    height: var(--o-chat-panel-height, 100dvh);
    overscroll-behavior: contain;
    padding: var(--o-safe-top) var(--o-safe-right) var(--o-safe-bottom) var(--o-safe-left);
    border: 0;
    background: var(--o-sheet);
    box-shadow: none;
  }
  /* The embedded native phone owns the whole handset. Its parent safe-area
     padding must continue the phone surface instead of showing Console green. */
  html[data-theme="dark"] body.o_companion_has_phone .o_chat_panel { background: #000; }
  html[data-theme="light"] body.o_companion_has_phone .o_chat_panel { background: #fff; }
  body.o_chat_expanded .o_chat_panel {
    display: flex;
    width: 100vw;
    box-shadow: none;
  }
  .o_chat_strip { display: none; }
  .o_chat_panel_list, .o_chat_panel_convo, .o_companion_phone { width: 100%; }
  .o_chat_list_head, .o_chat_convo_head {
    min-height: 52px;
    height: auto;
    padding: 8px 10px 8px 16px;
  }
  .o_chat_convo_head { justify-content: flex-start; gap: 2px; padding-left: 8px; }
  .o_chat_convo_name { padding-left: 2px; font-size: 15px; font-weight: 750; }
  .o_chat_panel_btn { width: 42px; height: 42px; }
  .o_chat_mobile_close, .o_chat_mobile_new { display: grid; }
  /* The header Messages button opens chat without covering work controls. */
  .o_chat_mobile_launcher { display: none; }
  body.o_chat_expanded .o_chat_mobile_launcher { display: none; }
  .o_chat_mobile_badge {
    position: absolute;
    top: -5px;
    right: -4px;
    min-width: 21px;
    height: 21px;
    padding: 0 5px;
    border: 2px solid #f8faf7;
    border-radius: 11px;
    background: #5f6f61;
    color: #fff;
    font-size: 10px;
    font-weight: 850;
    line-height: 17px;
    text-align: center;
  }
  .o_chat_mobile_badge[hidden] { display: none; }
  .o_chat_mobile_badge.mention { background: #b4433d; }
}

/* ---- icons ---------------------------------------------------------------
   Solid silhouettes rather than emoji or hairline outlines: emoji render
   differently (and in colour) on every device, and a 1px stroke greys out on
   a handheld screen in daylight. They inherit currentColor so they pick up
   each button's own state. */
.o_chat_icon_btn, .o_chat_strip_btn, .o_chat_panel_btn { line-height: 0; }
.o_chat_icon_btn svg, .o_chat_strip_btn svg, .o_chat_panel_btn svg,
.o_chat_file svg { display: block; }
.o_chat_file { align-items: center; }
.o_chat_file svg { flex: none; opacity: .75; }

/* =====================================================================
   Starting a conversation. The shape follows from who you pick, so the
   picker leads with people and tells you plainly what it is about to make.
   ===================================================================== */
.o_dialog:has(.o_chat_new) { height: min(720px, 86vh); }
.o_dialog:has(.o_chat_new) .o_dialog_body { display: flex; min-height: 0; overflow: hidden; }
.o_chat_new { display: flex; flex: 1 1 auto; min-height: 0; flex-direction: column; gap: 10px; }
.o_chat_new_intro {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 2px 0 4px;
}
.o_chat_new_intro > div { display: flex; flex-direction: column; min-width: 0; }
.o_chat_new_intro strong { font-size: 13px; }
.o_chat_new_intro span { margin-top: 2px; color: var(--o-muted); font-size: 11px; }
.o_chat_new_intro .btn { flex: none; }

.o_chat_tabs {
  display: inline-flex; gap: 2px; padding: 3px; align-self: flex-start;
  background: var(--o-ground); border: 1px solid var(--o-border-light);
  border-radius: 8px;
}
.o_chat_tab {
  padding: 5px 16px; border: 0; border-radius: 6px;
  background: transparent; color: var(--o-muted);
  font: 600 12px/1.4 var(--o-font); cursor: pointer;
}
.o_chat_tab:hover { color: var(--o-text-strong); }
.o_chat_tab.active { background: #fff; color: var(--o-brand-dark); box-shadow: 0 1px 2px rgba(25,57,25,.12); }

.o_chat_name_row:empty { display: none; }
.o_chat_field_label { display: block; font-size: 11px; font-weight: 700; margin-bottom: 4px; }
.o_chat_field_hint { margin-top: 4px; font-size: 11px; }

/* Who is picked, as removable chips — visible without scrolling back up. */
.o_chat_chosen {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
  min-height: 30px;
}
.o_chat_chosen_hint { font-size: 12px; }
.o_chat_chosen_chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 3px 8px 3px 3px;
  border: 1px solid var(--o-border-light); border-radius: 999px;
  background: #fff; color: var(--o-text); font: 500 12px/1 var(--o-font);
  cursor: pointer;
}
.o_chat_chosen_chip:hover { border-color: #b4433d; color: #8d332e; }
.o_chat_chosen_x { font-size: 14px; line-height: 1; opacity: .6; }

.o_chat_avatar {
  display: inline-grid; place-items: center; flex: none;
  border-radius: 50%; font-weight: 700; letter-spacing: .02em;
}
.o_chat_avatar_wrap { position: relative; display: inline-flex; flex: none; }
.o_chat_avatar_wrap > .o_chat_presence_dot {
  position: absolute; right: -1px; bottom: -1px;
  width: 9px; height: 9px; border: 2px solid #fff; box-sizing: content-box;
}

.o_chat_people, .o_chat_directory_results {
  flex: 1 1 auto; min-height: 90px; overflow-y: auto;
  border: 1px solid var(--o-border-light); border-radius: 8px;
}
.o_chat_directory_section {
  position: sticky; top: 0; z-index: 1; padding: 6px 10px;
  border-bottom: 1px solid var(--o-border-light); background: #f7f9f6;
  color: var(--o-muted); font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
}
.o_chat_directory_section.groups { background: #fbf6e8; color: #77612c; }
.o_chat_person_row {
  display: flex; align-items: center; gap: 10px; width: 100%;
  padding: 8px 10px; text-align: left;
  background: transparent; border: 0;
  border-bottom: 1px solid var(--o-border-light);
  font: inherit; color: var(--o-text); cursor: pointer;
}
.o_chat_person_row:last-child { border-bottom: 0; }
.o_chat_person_row:hover { background: var(--o-brand-soft); }
.o_chat_person_row.picked { background: #eaf3ea; }
.o_chat_person_row.direct:active { background: #e2efe2; }
.o_chat_person_row:disabled { cursor: wait; opacity: .65; }
.o_chat_person_text { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.o_chat_person_name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.o_chat_person_role { font-size: 11px; }
/* An empty box, not a blank space: the row has to read as tickable before
   anything is ticked. */
.o_chat_check {
  flex: none; width: 20px; height: 20px; display: grid; place-items: center;
  border: 1px solid #c6d2c4; border-radius: 6px; background: #fff; color: #fff;
}
.o_chat_check.on { background: var(--o-brand); border-color: var(--o-brand); }
.o_chat_person_open { flex: none; color: #88918a; font-size: 23px; font-weight: 300; }
.o_chat_group_join_row {
  display: flex; align-items: center; gap: 10px; min-height: 51px; padding: 8px 10px;
  border-bottom: 1px solid var(--o-border-light); background: #fff;
}
.o_chat_group_avatar {
  display: inline-grid; place-items: center; flex: none; width: 30px; height: 30px;
  border: 1px solid #dec982; border-radius: 8px; background: #f4e7bb; color: #735c21;
  font-size: 11px; font-weight: 800; letter-spacing: .03em;
}
.o_chat_join_btn { flex: none; min-height: 30px; padding: 5px 9px; font-size: 10px; }

.o_chat_new_foot {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding-top: 4px;
}
.o_chat_new_foot[hidden] { display: none; }
.o_chat_summary { font-size: 12px; color: var(--o-muted); }
.o_chat_new_foot .btn[disabled] { opacity: .5; cursor: not-allowed; }

/* The directory is a phone workspace, not a desktop modal squeezed narrower.
   Keep the controls still, give the people list the remaining height, and
   follow visualViewport while the software keyboard is open. */
@media (max-width: 640px) {
  .o_dialog_backdrop:has(.o_chat_new) {
    inset: var(--o-chat-new-top, 0) 0 auto;
    align-items: stretch; overflow: hidden; width: 100vw;
    height: var(--o-chat-new-height, 100dvh); padding: 0;
  }
  .o_dialog:has(.o_chat_new) {
    width: 100vw; max-width: none;
    height: 100%; max-height: 100%;
    border-radius: 0; box-shadow: none;
  }
  .o_dialog:has(.o_chat_new) .o_dialog_header {
    flex: 0 0 auto; min-height: calc(54px + var(--o-safe-top));
    padding: calc(8px + var(--o-safe-top)) max(12px, var(--o-safe-right)) 8px max(16px, var(--o-safe-left));
    background: #fff; border-color: #e1e7df;
  }
  .o_dialog:has(.o_chat_new) .o_dialog_header h4 {
    font-size: 20px; font-weight: 750; letter-spacing: -.02em;
  }
  .o_dialog:has(.o_chat_new) .o_close {
    display: grid; place-items: center; width: 42px; height: 42px; padding: 0;
    border-radius: 50%; font-size: 25px;
  }
  .o_dialog:has(.o_chat_new) .o_dialog_body {
    display: flex; flex: 1 1 auto; min-height: 0; overflow: hidden;
    padding: 12px max(12px, var(--o-safe-right)) 0 max(12px, var(--o-safe-left));
  }
  .o_dialog:has(.o_chat_new) .o_dialog_footer { display: none; }
  .o_chat_new { flex: 1 1 auto; min-width: 0; min-height: 0; gap: 9px; }
  .o_chat_new_intro { gap: 8px; }
  .o_chat_new_intro span { font-size: 12px; line-height: 1.25; }
  .o_chat_new_intro .btn { min-height: 40px; padding: 7px 10px; }
  .o_chat_name_row, .o_chat_chosen, .o_chat_new > .o_input { flex: 0 0 auto; }
  .o_chat_chosen { min-height: 26px; max-height: 64px; overflow-y: auto; }
  .o_chat_chosen_hint { font-size: 13px; line-height: 1.3; }
  .o_chat_new > .o_input { width: 100%; min-height: 46px; font-size: 16px; }
  .o_chat_people, .o_chat_directory_results {
    flex: 1 1 auto; min-height: 92px; max-height: none; overflow-y: auto;
    border-color: #d8e1d6; border-radius: 13px;
    overscroll-behavior-y: contain; -webkit-overflow-scrolling: touch;
  }
  .o_chat_person_row { min-height: 58px; gap: 11px; padding: 9px 11px; }
  .o_chat_person_name { font-size: 15px; font-weight: 700; }
  .o_chat_person_role { font-size: 12px; }
  .o_chat_check { width: 24px; height: 24px; border-radius: 7px; }
  .o_chat_group_join_row { min-height: 58px; gap: 11px; padding: 9px 11px; }
  .o_chat_group_avatar { width: 36px; height: 36px; font-size: 13px; }
  .o_chat_new_foot {
    flex: 0 0 auto; min-width: 0; padding: 2px 0 max(10px, var(--o-safe-bottom));
    background: #fff;
  }
  .o_chat_summary {
    min-width: 0; overflow: hidden; display: -webkit-box;
    -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    font-size: 11px; line-height: 1.3;
  }
  .o_chat_new_foot .btn { flex: 0 0 auto; min-height: 44px; padding-inline: 16px; }
  .o_chat_new:focus-within .o_chat_chosen_hint { display: none; }
  .o_chat_new:focus-within .o_chat_chosen:has(.o_chat_chosen_hint) { min-height: 0; }
  .o_chat_name_row .o_input { min-height: 44px; font-size: 16px; }
  .o_chat_name_row .o_chat_field_hint { line-height: 1.3; }
}

/* The full Chat page IS chat, so neither the panel nor the bubble belongs
   there — a bubble that expands a hidden panel looks broken. Leaving is the
   "Collapse to panel" button in the control panel instead. */
.o_chat_backto_panel { display: inline-flex; align-items: center; gap: 6px; }

/* ---- the list view -------------------------------------------------------
   Between the icons and a conversation: who is talking and the start of what
   they said, so you can triage without opening anything. */
.o_chat_panel_list { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.o_chat_panel_list[hidden], .o_chat_panel_convo[hidden] { display: none; }
.o_chat_list_head {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 8px 6px 8px 12px; flex: none; height: 40px;
  border-bottom: 1px solid var(--o-border-light);
  background: var(--o-brand-soft);
}
.o_chat_list_body {
  flex: 1; min-height: 0; overflow-y: auto; padding: 4px;
  overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
}
.o_chat_group_label {
  padding: 10px 8px 4px; font-size: 10px; font-weight: 800;
  letter-spacing: .06em; text-transform: uppercase; color: var(--o-muted);
}
.o_chat_row {
  display: block; width: 100%; text-align: left;
  background: transparent; border: 0; border-radius: 6px;
  padding: 7px 9px; cursor: pointer; font: inherit; color: var(--o-text);
}
.o_chat_row:hover { background: var(--o-brand-soft); }
.o_chat_row.active { background: var(--o-brand-soft); box-shadow: inset 3px 0 0 var(--o-brand); }
.o_chat_row.unread { background: #eaf3ea; }
.o_chat_row.mention { background: #fbe9e8; box-shadow: inset 3px 0 0 #b4433d; }
.o_chat_row_head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.o_chat_row_identity {
  min-width: 0; display: inline-flex; align-items: center; gap: 7px;
}
.o_chat_row_name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.o_chat_row_preview {
  margin-top: 2px; font-size: 11px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.o_chat_row_presence { font-weight: 650; }
.o_chat_row_count {
  flex: none; min-width: 18px; height: 18px; padding: 0 5px;
  border-radius: 9px; background: #6b7a6c; color: #fff;
  font-size: 10px; font-weight: 800; line-height: 18px; text-align: center;
}
.o_chat_row_count.mention { background: #b4433d; }

/* The bar itself is clickable, so say so. */
.o_chat_strip { cursor: pointer; }
.o_chat_strip_list, .o_chat_strip_btn, .o_chat_chip { cursor: pointer; }
.o_chat_twirl { margin-bottom: 2px; }

/* Full-screen panel open on a phone/tablet: pin the page behind it so iOS
   cannot scroll the Console underneath (chat_rail.js sets body.top to keep
   the reading position and restores it on close). */
html.o_chat_scroll_locked, body.o_chat_scroll_locked { overflow: hidden; overscroll-behavior: none; }
body.o_chat_scroll_locked { position: fixed; left: 0; right: 0; width: 100%; }
.o_chat_panel_convo, .o_chat_panel_list { overscroll-behavior: contain; }
.o_chat_panel_convo > .o_chat_pane { flex: 1 1 auto; min-height: 0; }

/* =====================================================================
   Release 2: share any record into chat. One icon, one picker, one card.
   No shadows; 1px border, 8px radius; the kind pill uses the badge tokens.
   ===================================================================== */
.o_share_btn {
  display: inline-grid; place-items: center; flex: none;
  width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%;
  background: transparent; color: var(--o-muted); cursor: pointer;
}
.o_share_btn:hover { background: var(--o-brand-soft); color: var(--o-brand-dark); }
.o_share_btn:focus-visible { outline: 2px solid rgba(128, 190, 126, .75); outline-offset: 1px; }
.o_share_btn svg { display: block; }
.o_cp_share_slot { display: flex; align-items: center; flex: none; }
.o_dialog_header .o_dialog_share { margin-left: auto; margin-right: -8px; }
.wh-po-detail-tools { display: flex; align-items: center; gap: 4px; flex: none; }

/* Search results: a trailing share icon, hover-revealed on a desktop. */
.cs-search-result-wrap { position: relative; }
.cs-search-result-wrap > .cs-search-result { padding-right: 38px; }
.cs-search-share {
  position: absolute; top: 50%; right: 4px; width: 30px; height: 30px;
  transform: translateY(-50%); opacity: 0; transition: opacity .12s;
}
.cs-search-result-wrap:hover .cs-search-share,
.cs-search-result-wrap:focus-within .cs-search-share { opacity: 1; }

/* The card under a message (and at the top of the share picker). */
.o_chat_card {
  display: flex; align-items: stretch; margin-top: 4px;
  width: min(340px, 100%); min-width: 0; box-sizing: border-box;
  border: 1px solid var(--o-border-light); border-radius: 8px;
  background: var(--o-sheet); color: var(--o-text); overflow: hidden;
}
.o_chat_msg.mine .o_chat_card { margin-left: auto; }
.o_chat_msg:has(.o_chat_card) { min-width: min(260px, 78%); }
.o_chat_card_main {
  flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px;
  padding: 8px 10px; border: 0; background: transparent; color: inherit;
  font: inherit; text-align: left;
}
button.o_chat_card_main { cursor: pointer; }
button.o_chat_card_main:hover { background: var(--o-brand-soft); }
button.o_chat_card_main:focus-visible { outline: 2px solid rgba(128, 190, 126, .75); outline-offset: -2px; }
.o_chat_card_head { display: flex; align-items: center; gap: 6px; min-width: 0; }
.o_chat_card_kind {
  flex: none; padding: 1px 6px; border-radius: 8px;
  background: #e7f1e6; color: var(--o-brand-deep);
  font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
}
.o_chat_card_status {
  margin-left: auto; max-width: 55%; padding: 0 7px;
  border: 1px solid var(--o-border-light); border-radius: 999px;
  color: var(--o-muted); font-size: 10px; font-weight: 650; line-height: 16px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.o_chat_card_label, .o_chat_card_sub { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.o_chat_card_label { color: var(--o-text-strong); font-size: 13px; font-weight: 700; }
.o_chat_card_sub { color: var(--o-muted); font-size: 11px; }
.o_chat_card.is-hidden { background: transparent; border-style: dashed; }
.o_chat_card.is-hidden .o_chat_card_label { color: var(--o-muted); }
.o_chat_card_actions {
  display: flex; flex-direction: column; justify-content: center; gap: 2px;
  padding: 3px; border-left: 1px solid var(--o-border-light);
}
.o_chat_card_action {
  display: grid; place-items: center; width: 28px; height: 28px; padding: 0;
  border: 0; border-radius: 50%; background: transparent; color: var(--o-muted); cursor: pointer;
}
.o_chat_card_action:hover { background: var(--o-brand-soft); color: var(--o-brand-dark); }
.o_chat_card_action svg { display: block; }
/* The rail is narrow: the card takes the bubble's width and tightens up. */
.o_chat_panel_convo .o_chat_card { width: 100%; }
.o_chat_panel_convo .o_chat_card_main { padding: 6px 8px; }
.o_chat_panel_convo .o_chat_card_label { font-size: 12.5px; }

/* A typed reference ("S2644861") reads as a link inside the text. */
.o_chat_ref {
  color: var(--o-brand-dark); font-weight: 650; cursor: pointer;
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px;
}
.o_chat_ref:hover { text-decoration-thickness: 2px; }
.o_chat_ref:focus-visible { outline: 2px solid rgba(128, 190, 126, .75); outline-offset: 1px; border-radius: 3px; }
.o_chat_ref.is-hidden { color: inherit; font-weight: inherit; text-decoration: none; cursor: default; }

/* The share picker: card, search, list, message. */
.o_dialog:has(.o_chat_share) { max-width: 520px; height: min(640px, 86vh); }
.o_dialog:has(.o_chat_share) .o_dialog_body { display: flex; flex: 1 1 auto; min-height: 0; overflow: hidden; }
.o_chat_share { display: flex; flex: 1 1 auto; flex-direction: column; gap: 10px; min-width: 0; min-height: 0; }
.o_chat_share_card .o_chat_card { width: 100%; margin: 0; }
.o_chat_share_note { font-size: 12px; }
.o_chat_share_note[hidden] { display: none; }
.o_chat_share_search, .o_chat_share_message { width: 100%; box-sizing: border-box; }
.o_chat_share_message { min-height: 58px; resize: vertical; font: inherit; }
.o_chat_share_results {
  flex: 1 1 auto; min-height: 120px; overflow-y: auto; overscroll-behavior-y: contain;
  border: 1px solid var(--o-border-light); border-radius: 8px;
}
.o_chat_share_section {
  padding: 9px 12px 3px; color: var(--o-muted);
  font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
}
.o_chat_share_row {
  display: flex; align-items: center; gap: 10px; width: 100%; padding: 7px 12px;
  border: 0; background: transparent; color: var(--o-text); font: inherit; text-align: left; cursor: pointer;
}
.o_chat_share_row:hover, .o_chat_share_row.picked { background: var(--o-brand-soft); }
.o_chat_share_row:focus-visible { outline: 2px solid rgba(128, 190, 126, .75); outline-offset: -2px; }
.o_chat_share_avatar {
  display: grid; place-items: center; flex: none; width: 30px; height: 30px;
  border-radius: 50%; background: var(--o-brand-soft); color: var(--o-brand-dark);
  font-size: 11px; font-weight: 800;
}
.o_chat_share_avatar.shared { border-radius: 8px; }
.o_chat_share_row.picked .o_chat_share_avatar { background: var(--o-brand); color: #fff; }
.o_chat_share_text { display: flex; flex: 1 1 auto; flex-direction: column; min-width: 0; }
.o_chat_share_name, .o_chat_share_sub { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.o_chat_share_name { color: var(--o-text-strong); font-size: 13px; font-weight: 650; }
.o_chat_share_sub { color: var(--o-muted); font-size: 11px; }
.o_chat_share_check { display: grid; place-items: center; flex: none; width: 18px; color: var(--o-brand-dark); }
.o_chat_share_empty { padding: 16px; font-size: 12px; text-align: center; }
.o_chat_share_send { max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

html[data-theme="dark"] .o_chat_card_kind { background: var(--o-brand-soft); color: var(--o-brand-deep); }
html[data-theme="dark"] .o_chat_card { background: var(--o-sheet); border-color: var(--o-border); }
html[data-theme="dark"] .o_chat_card_actions,
html[data-theme="dark"] .o_chat_card_status { border-color: var(--o-border); }
html[data-theme="dark"] .o_chat_share_row.picked .o_chat_share_avatar { background: var(--o-brand-light); color: #10180f; }

@media (max-width: 720px) {
  /* Control panel: the icon joins the title row, never a row of its own. */
  .o_control_panel > .o_cp_share_slot { grid-area: title; justify-self: end; z-index: 1; }
  .o_control_panel:has(> .o_cp_share_slot) .o_breadcrumb { padding-right: 44px; box-sizing: border-box; }
  .o_cp_share_slot .o_share_btn { width: 44px; height: 44px; color: var(--o-brand-dark); }
  .cs-search-share { opacity: 1; width: 40px; height: 40px; right: 0; }
  .cs-search-result-wrap > .cs-search-result { padding-right: 44px; }

  /* The picker is a full-height sheet on phones. */
  .o_dialog_backdrop:has(.o_chat_share) {
    inset: var(--o-chat-share-top, 0) 0 auto;
    align-items: stretch; padding: 0; overflow: hidden; width: 100vw;
    height: var(--o-chat-share-height, 100dvh);
  }
  .o_dialog:has(.o_chat_share) {
    width: 100vw; max-width: none; height: 100%; max-height: 100%;
    border: 0; border-radius: 0; box-shadow: none;
  }
  .o_dialog:has(.o_chat_share) .o_dialog_header {
    padding: calc(10px + var(--o-safe-top, 0px)) max(12px, var(--o-safe-right, 0px)) 6px max(16px, var(--o-safe-left, 0px));
  }
  .o_dialog:has(.o_chat_share) .o_dialog_body { padding: 8px max(12px, var(--o-safe-right, 0px)) 6px max(12px, var(--o-safe-left, 0px)); }
  .o_dialog:has(.o_chat_share) .o_dialog_footer { padding-bottom: max(12px, var(--o-safe-bottom, 0px)); }
  .o_chat_share_row { min-height: 54px; }
  .o_chat_share_name { font-size: 15px; }
  .o_chat_share_search, .o_chat_share_message { font-size: 16px; }
  .o_chat_share_message { resize: none; }
  .o_chat_share_send { flex: 1 1 auto; max-width: none; }
}
@media (hover: none) { .cs-search-share { opacity: 1; } }

/* ---------------------------------------------------------------- R3: live
   Queued (offline) bubbles, the muted glyph, the conversation "⋯" menu and the
   chat rows in My settings. Tokens only, so light and dark both follow. */
.o_chat_msg.queued .o_chat_msg_body { opacity: .7; border-style: dashed; }
.o_chat_send_state.queued { gap: 4px; color: var(--o-warning-text, #856404); font-weight: 600; }
.o_chat_send_state.queued svg { opacity: .9; }
html[data-theme="dark"] .o_chat_send_state.queued { color: #e7c66b; }

.o_chat_muted_glyph {
  display: inline-grid; place-items: center; flex: none;
  margin-left: 4px; color: var(--o-muted); vertical-align: middle; line-height: 0;
}
.o_chat_chip .o_chat_muted_glyph {
  position: absolute; left: -5px; bottom: -5px; margin: 0;
  width: 17px; height: 17px; border-radius: 50%;
  background: var(--o-sheet, #fff); border: 1px solid var(--o-border-light);
}
.o_chat_chip.muted:not(.mention) { opacity: .78; }
.o_chat_channel_head .o_chat_muted_glyph,
.o_chat_row_identity .o_chat_muted_glyph { margin-left: 2px; }

.o_chat_menu_wrap { position: relative; display: inline-flex; flex: none; }
.o_chat_menu_btn[aria-expanded="true"] { background: var(--o-sheet, #fff); color: var(--o-text-strong); }
.o_chat_menu_popover {
  position: absolute; z-index: 40; top: calc(100% + 6px); right: 0;
  width: 220px; max-width: calc(100vw - 32px); padding: 6px;
  border: 1px solid var(--o-border-light); border-radius: 12px;
  background: var(--o-sheet, #fff); color: var(--o-text);
  box-shadow: 0 10px 24px rgba(25,57,25,.2);
  text-align: left;
}
.o_chat_menu_section + .o_chat_menu_section {
  margin-top: 4px; padding-top: 4px; border-top: 1px solid var(--o-border-light);
}
.o_chat_menu_title {
  display: flex; align-items: baseline; justify-content: space-between; gap: 8px;
  padding: 4px 8px 2px; color: var(--o-muted);
  font-size: 10.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
}
.o_chat_menu_title small {
  color: var(--o-brand-dark); font-size: 10.5px; font-weight: 600;
  letter-spacing: 0; text-transform: none;
}
.o_chat_menu_item {
  display: flex; align-items: center; gap: 6px; width: 100%;
  min-height: 32px; padding: 4px 8px; border: 0; border-radius: 8px;
  background: transparent; color: var(--o-text-strong); font: inherit; font-size: 13px;
  text-align: left; cursor: pointer;
}
.o_chat_menu_item:hover, .o_chat_menu_item:focus-visible { background: var(--o-brand-soft); outline: none; }
.o_chat_menu_check { display: inline-grid; place-items: center; width: 16px; flex: none; color: var(--o-brand-dark); }
.o_chat_menu_item.checked { font-weight: 650; }
html[data-theme="dark"] .o_chat_menu_popover { box-shadow: 0 10px 24px rgba(0,0,0,.5); }
html[data-theme="dark"] .o_chat_menu_title small,
html[data-theme="dark"] .o_chat_menu_check { color: var(--o-brand-deep, #9fd49f); }
@media (max-width: 991px) {
  .o_chat_menu_item { min-height: 42px; font-size: 14px; }
}

/* My settings: Chat notifications */
.o_chat_settings .o_chat_settings_row { grid-template-columns: minmax(0, 1fr) auto; }
.o_chat_settings_state { font-weight: 650; }
.o_chat_settings_state[data-permission="granted"] { color: var(--o-success, #2f7d32) !important; }
.o_chat_settings_state[data-permission="denied"] { color: var(--o-danger) !important; }
.o_chat_quiet_times {
  display: flex; flex-wrap: wrap; align-items: end; gap: 10px; padding: 10px 0 4px;
}
.o_chat_quiet_times label { display: flex; flex-direction: column; gap: 3px; font-size: 11px; color: var(--o-muted); }
.o_chat_quiet_times input[type="time"] { min-width: 120px; }
.o_chat_quiet_times input:disabled { opacity: .55; }

/* ===================================================== Release 4 ==========
   Search, reply quotes, group management, @all, system lines. */

/* Search: one field above the list (rail and page sidebar). */
.o_chat_search {
  position: relative; display: flex; align-items: center; flex: none;
  margin: 6px 6px 2px; height: 34px; padding: 0 6px 0 10px; gap: 6px;
  border: 1px solid var(--o-border-light); border-radius: 999px;
  background: var(--o-ground); color: var(--o-muted);
}
.o_chat_search:focus-within { border-color: var(--o-brand); background: var(--o-sheet); }
.o_chat_search_icon { display: inline-grid; place-items: center; flex: none; line-height: 0; }
.o_chat_search .o_chat_search_input {
  flex: 1 1 auto; min-width: 0; height: 100%; padding: 0; border: 0 !important;
  background: transparent !important; box-shadow: none !important; color: var(--o-text);
  font-size: 12.5px; outline: none;
}
.o_chat_search_input::-webkit-search-cancel-button { display: none; }
.o_chat_search_input::placeholder { color: var(--o-muted); opacity: .85; }
.o_chat_search_clear {
  display: inline-grid; place-items: center; flex: none; width: 24px; height: 24px; padding: 0;
  border: 0; border-radius: 50%; background: transparent; color: var(--o-muted); cursor: pointer;
}
.o_chat_search_clear:hover { background: var(--o-brand-soft); color: var(--o-text-strong); }
.o_chat_search_clear[hidden], .o_chat_search_results[hidden], .o_chat_sidebar_list[hidden] { display: none; }
.o_chat_sidebar .o_chat_search { margin: 0 0 6px; }
.o_chat_search_results {
  flex: 1; min-height: 0; overflow-y: auto; padding: 2px 4px 6px;
  overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
}
.o_chat_search_row {
  display: flex; flex-direction: column; gap: 2px; width: 100%; padding: 8px 10px;
  border: 0; border-radius: 8px; background: transparent; color: var(--o-text);
  font: inherit; text-align: left; cursor: pointer;
}
.o_chat_search_row + .o_chat_search_row { border-top: 1px solid var(--o-border-light); border-radius: 0; }
.o_chat_search_row:hover, .o_chat_search_row:focus-visible { background: var(--o-brand-soft); border-radius: 8px; outline: none; }
.o_chat_search_row_head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; min-width: 0; }
.o_chat_search_channel { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12.5px; }
.o_chat_search_time { flex: none; font-size: 11px; }
.o_chat_search_snippet {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  font-size: 12px; line-height: 1.35; color: var(--o-text);
}
.o_chat_search_author { color: var(--o-muted); font-weight: 600; }
.o_chat_search_snippet mark {
  padding: 0 1px; border-radius: 3px; background: rgba(240, 196, 64, .38); color: inherit;
}
.o_chat_search_status { padding: 14px 10px; font-size: 12px; text-align: center; }
.o_chat_search_status.is-error { color: var(--o-danger); }
.o_chat_search_more {
  display: block; width: 100%; margin-top: 4px; padding: 8px; border: 0; border-radius: 8px;
  background: transparent; color: var(--o-brand-dark); font: inherit; font-size: 12px; font-weight: 650; cursor: pointer;
}
.o_chat_search_more:hover { background: var(--o-brand-soft); }

/* Reply: quote strip in a bubble, quote bar above the composer. */
.o_chat_quote {
  display: flex; flex-direction: column; align-items: flex-start; gap: 1px;
  max-width: 100%; margin: 0 0 3px; padding: 4px 10px 5px 9px; box-sizing: border-box;
  border: 0; border-left: 3px solid var(--o-brand); border-radius: 6px;
  background: var(--o-ground); color: var(--o-text); font: inherit; text-align: left; cursor: pointer;
}
.o_chat_msg.mine .o_chat_quote { margin-left: auto; }
.o_chat_quote:hover:not(:disabled) { background: var(--o-brand-soft); }
.o_chat_quote:disabled { cursor: default; }
.o_chat_quote_author { font-size: 11px; font-weight: 750; color: var(--o-brand-dark); }
.o_chat_quote_text {
  max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: 12px; color: var(--o-muted);
}
.o_chat_quote.is-deleted .o_chat_quote_text { font-style: italic; }
.o_chat_reply_bar {
  display: flex; align-items: center; gap: 8px; flex: none;
  margin: 0; padding: 6px 10px 4px; border-top: 1px solid var(--o-border-light);
  background: var(--o-sheet);
}
.o_chat_reply_bar[hidden] { display: none; }
.o_chat_reply_bar + .o_chat_composer_row { border-top: 0; padding-top: 4px; }
.o_chat_reply_bar_icon { display: inline-grid; place-items: center; flex: none; color: var(--o-brand-dark); }
.o_chat_reply_bar_text {
  display: flex; flex-direction: column; flex: 1 1 auto; min-width: 0;
  padding-left: 8px; border-left: 3px solid var(--o-brand);
}
.o_chat_reply_bar_close {
  display: inline-grid; place-items: center; flex: none; width: 26px; height: 26px; padding: 0;
  border: 0; border-radius: 50%; background: transparent; color: var(--o-muted); cursor: pointer;
}
.o_chat_reply_bar_close:hover { background: var(--o-brand-soft); color: var(--o-text-strong); }
.o_chat_outside_note {
  flex: none; padding: 0 12px 6px; font-size: 11.5px; transition: opacity .4s ease;
}
.o_chat_outside_note[hidden] { display: none; }
.o_chat_outside_note.fading { opacity: 0; }

/* System line: "Maria joined" — centred, muted, no bubble. */
.o_chat_system_line {
  align-self: stretch; display: flex; justify-content: center; margin: 6px 0;
  color: var(--o-muted); font-size: 11.5px; line-height: 1.3; text-align: center;
}
.o_chat_system_line span {
  max-width: 90%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* @all / @here and outside people in the mention picker. */
.o_chat_suggest_special {
  display: inline-grid; place-items: center; flex: none; width: 16px; height: 16px; border-radius: 50%;
  background: var(--o-brand-soft); color: var(--o-brand-dark); font-size: 10px; font-weight: 800;
}
.o_chat_suggest_row.special { border-bottom-color: var(--o-border-light); }
.o_chat_suggest_row.outside .o_chat_suggest_presence { font-style: italic; }

/* Header subline (presence · description) stays one line. */
.o_chat_convo_presence { max-width: 100%; min-width: 0; }
.o_chat_convo_presence .o_chat_presence_text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* "⋯" menu: Conversation section and inline confirm. */
.o_chat_menu_item.danger { color: var(--o-danger); }
.o_chat_menu_item .o_chat_menu_check svg { color: var(--o-muted); }
.o_chat_menu_confirm { padding: 6px 8px; }
.o_chat_menu_confirm_text { font-size: 12.5px; color: var(--o-text-strong); line-height: 1.35; }
.o_chat_menu_confirm_actions { display: flex; justify-content: flex-end; gap: 6px; margin-top: 8px; }
.o_chat_menu_confirm_btn {
  padding: 5px 10px; border: 1px solid var(--o-border-light); border-radius: 8px;
  background: var(--o-sheet); color: var(--o-text-strong); font: inherit; font-size: 12px; font-weight: 650; cursor: pointer;
}
.o_chat_menu_confirm_btn.danger { border-color: var(--o-danger); background: var(--o-danger); color: #fff; }
.o_chat_menu_confirm_btn:disabled { opacity: .6; }

/* Members sheet. */
.o_dialog:has(.o_chat_members) { max-width: 460px; }
.o_chat_members { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.o_chat_members_head { display: flex; flex-direction: column; gap: 6px; }
.o_chat_members_field {
  display: grid; grid-template-columns: max-content minmax(0, 1fr) auto; align-items: center; gap: 8px;
  min-height: 32px; font-size: 13px;
}
.o_chat_members_field.editing { grid-template-columns: max-content minmax(0, 1fr); }
.o_chat_members_field.editing .o_chat_members_edit_actions { grid-column: 2; display: flex; justify-content: flex-end; gap: 6px; }
.o_chat_members_label { color: var(--o-muted); font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.o_chat_members_value { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--o-text-strong); }
.o_chat_members_value.empty { color: var(--o-muted); font-style: italic; }
.o_chat_members_edit { width: 100%; box-sizing: border-box; font: inherit; resize: vertical; }
.o_chat_members_link {
  padding: 3px 6px; border: 0; border-radius: 6px; background: transparent;
  color: var(--o-brand-dark); font: inherit; font-size: 12px; font-weight: 650; cursor: pointer; white-space: nowrap;
}
.o_chat_members_link:hover { background: var(--o-brand-soft); }
.o_chat_members_link.danger { color: var(--o-danger); }
.o_chat_members_toggle {
  position: relative; display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 6px 0; cursor: pointer; font-size: 13px; color: var(--o-text-strong);
}
.o_chat_members_toggle_text { display: flex; flex-direction: column; gap: 1px; }
.o_chat_members_toggle_text small { font-size: 11px; }
.o_chat_switch_input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.o_chat_switch {
  position: relative; flex: none; width: 34px; height: 20px; border-radius: 999px;
  background: var(--o-border); transition: background .15s ease;
}
.o_chat_switch::after {
  content: ''; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%;
  background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.25); transition: transform .15s ease;
}
.o_chat_switch_input:checked + .o_chat_switch { background: var(--o-brand); }
.o_chat_switch_input:checked + .o_chat_switch::after { transform: translateX(14px); }
.o_chat_switch_input:focus-visible + .o_chat_switch { outline: 3px solid rgba(69,153,69,.32); outline-offset: 1px; }
.o_chat_members_note { font-size: 12px; }
.o_chat_members_bar {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding-top: 8px; border-top: 1px solid var(--o-border-light);
}
.o_chat_members_count { color: var(--o-muted); font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.o_chat_members_add { display: inline-flex; align-items: center; gap: 5px; }
.o_chat_members_list { max-height: min(46vh, 380px); overflow-y: auto; overscroll-behavior: contain; margin: 0 -4px; }
.o_chat_members_row { display: flex; align-items: center; gap: 10px; padding: 6px 4px; border-radius: 8px; }
.o_chat_members_row:hover { background: var(--o-ground); }
.o_chat_members_avatar {
  position: relative; display: grid; place-items: center; flex: none; width: 32px; height: 32px;
  border-radius: 50%; background: var(--o-brand-soft); color: var(--o-brand-dark); font-size: 11px; font-weight: 800;
}
.o_chat_members_avatar .o_chat_presence_dot {
  position: absolute; right: -1px; bottom: -1px; border: 2px solid var(--o-sheet); width: 9px; height: 9px; box-shadow: none;
}
.o_chat_members_text { display: flex; flex-direction: column; flex: 1 1 auto; min-width: 0; }
.o_chat_members_name { color: var(--o-text-strong); font-size: 13px; font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.o_chat_members_sub { color: var(--o-muted); font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.o_chat_members_actions { display: flex; flex: none; gap: 2px; }
.o_chat_members_confirm {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px;
  margin: 0 4px 6px 46px; padding: 6px 8px; border-radius: 8px; background: var(--o-ground); font-size: 12px;
}
.o_chat_members_confirm span { flex: 1 1 140px; color: var(--o-text-strong); }

html[data-theme="dark"] .o_chat_search { background: rgba(255,255,255,.04); }
html[data-theme="dark"] .o_chat_search:focus-within { background: var(--o-sheet); }
html[data-theme="dark"] .o_chat_search_snippet mark { background: rgba(231, 198, 107, .32); color: #fff3cf; }
html[data-theme="dark"] .o_chat_quote { background: rgba(255,255,255,.05); }
html[data-theme="dark"] .o_chat_quote_author,
html[data-theme="dark"] .o_chat_members_link:not(.danger),
html[data-theme="dark"] .o_chat_search_more { color: var(--o-brand-deep, #9fd49f); }
html[data-theme="dark"] .o_chat_members_avatar { color: var(--o-brand-deep, #9fd49f); }
html[data-theme="dark"] .o_chat_switch::after { background: #e9eee9; }

@media (max-width: 991px) {
  .o_chat_search { height: 40px; }
  .o_chat_search .o_chat_search_input { font-size: 16px; } /* no iOS zoom */
  .o_chat_search_row { padding: 10px 12px; }
  .o_chat_search_snippet { font-size: 13.5px; }
  .o_chat_members_link { min-height: 36px; }
}

/* ===================================================== Release 5: polish
   Formatting-lite, emoji picker, pins/stars, day separators, receipts,
   forward, files, and the full Chat page. Tokens only; no new shadows. */

/* Formatting-lite inside a bubble. */
.o_chat_msg_body strong { font-weight: 700; }
.o_chat_msg_body s { opacity: .75; }
.o_chat_code {
  padding: 0 4px; border-radius: 4px; background: var(--o-ground);
  border: 1px solid var(--o-border-light);
  font: 12px/1.45 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.o_chat_msg.mine .o_chat_code { background: var(--o-sheet); }
.o_chat_list { margin: 2px 0; padding-left: 18px; white-space: normal; }
.o_chat_list li { margin: 1px 0; white-space: pre-wrap; }
.o_chat_link { color: var(--o-brand-dark); text-decoration: underline; text-underline-offset: 2px; word-break: break-word; }
.o_chat_link:hover { color: var(--o-text-strong); }

/* Day separator: centred muted label between days. */
.o_chat_day_separator {
  display: flex; align-items: center; gap: 10px; margin: 10px 0 8px;
  color: var(--o-muted); font-size: 10.5px; font-weight: 700; letter-spacing: .03em;
}
.o_chat_day_separator::before, .o_chat_day_separator::after {
  content: ''; flex: 1; border-top: 1px solid var(--o-border-light);
}

/* Read receipt under my last message. */
.o_chat_receipt {
  display: flex; justify-content: flex-end; align-items: center; gap: 2px;
  margin: -6px 2px 8px; color: var(--o-muted); font-size: 10px;
}
.o_chat_receipt_dot {
  display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 50%;
  background: var(--o-brand-soft); color: var(--o-brand-dark); box-sizing: border-box;
  border: 2px solid var(--o-sheet); font-size: 7px; font-weight: 800; line-height: 1; letter-spacing: -.02em;
}
.o_chat_receipt.group .o_chat_receipt_dot + .o_chat_receipt_dot { margin-left: -4px; }
.o_chat_receipt_more { margin-left: 3px; font-weight: 700; }

/* Forwarded line, pin/star flags, upload progress. */
.o_chat_forwarded {
  display: flex; align-items: center; gap: 4px; margin: 0 2px 3px;
  color: var(--o-muted); font-size: 10.5px; font-style: italic;
  overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
}
.o_chat_msg.mine .o_chat_forwarded { justify-content: flex-end; }
.o_chat_forwarded svg { flex: none; }
.o_chat_msg_flags { display: inline-flex; align-items: center; gap: 3px; flex: none; }
.o_chat_flag { display: inline-grid; place-items: center; color: var(--o-muted); }
.o_chat_flag.star { color: #c99a1e; }
.o_chat_flag.pin { color: var(--o-brand-dark); }
.o_chat_upload_progress { margin-top: 3px; font-size: 10.5px; text-align: right; }
.o_chat_photo_wrap.is-loading { cursor: progress; opacity: .7; }

/* The message "⋯" menu: Pin / Star / Forward / Copy link. */
.o_chat_msg_menu {
  position: absolute; z-index: 8; right: 0; top: 18px;
  min-width: 160px; padding: 4px;
  border: 1px solid var(--o-border-light); border-radius: 10px;
  background: var(--o-sheet); box-shadow: 0 8px 20px rgba(25,57,25,.2);
}
.o_chat_msg.mine .o_chat_msg_menu { right: 0; left: auto; }
.o_chat_msg_menu.up { top: auto; bottom: calc(100% + 4px); }
.o_chat_load_older[hidden] { display: none; }
.o_chat_msg:has(.o_chat_msg_menu) .o_chat_message_tools { opacity: 1; transform: translateY(0); }
.o_chat_msg_menu .o_chat_menu_item { min-height: 30px; font-size: 12.5px; }
.o_chat_msg_menu .o_chat_menu_item svg { color: var(--o-muted); flex: none; }

/* Emoji picker (composer and reactions). */
.o_chat_emoji_picker { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.o_chat_emoji_picker.expanded { width: min(320px, calc(100vw - 48px)); }
.o_chat_emoji_menu .o_chat_emoji_picker.expanded { width: 100%; }
.o_chat_emoji_quick { display: flex; align-items: center; gap: 2px; }
.o_chat_emoji_picker.expanded .o_chat_emoji_quick { padding-bottom: 4px; border-bottom: 1px solid var(--o-border-light); }
.o_chat_emoji_more { color: var(--o-muted); display: inline-grid; place-items: center; }
.o_chat_emoji_search { height: 30px; min-height: 30px; padding: 4px 10px; border-radius: 999px; font-size: 12px; }
.o_chat_emoji_body { max-height: 220px; overflow-y: auto; overscroll-behavior: contain; }
.o_chat_emoji_section {
  position: sticky; top: 0; z-index: 1; padding: 4px 2px 2px; background: var(--o-sheet);
  color: var(--o-muted); font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
}
.o_chat_emoji_grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(32px, 1fr)); gap: 1px; }
.o_chat_emoji_picker .o_chat_emoji_choice { width: 32px; height: 32px; font-size: 20px; line-height: 1; }
.o_chat_emoji_picker.compact .o_chat_emoji_choice { width: 30px; height: 30px; font-size: 18px; }
.o_chat_emoji_empty { padding: 14px 4px; font-size: 12px; text-align: center; }
.o_chat_emoji_menu:has(.o_chat_emoji_picker) { padding: 6px; }

/* Pinned strip under the header. */
.o_chat_pins { flex: none; border-bottom: 1px solid var(--o-border-light); background: var(--o-sheet); }
.o_chat_pins[hidden] { display: none; }
.o_chat_pins_toggle {
  display: flex; align-items: center; gap: 6px; width: 100%; min-height: 28px; padding: 4px 12px;
  border: 0; background: transparent; color: var(--o-brand-dark);
  font: inherit; font-size: 11.5px; font-weight: 650; text-align: left; cursor: pointer;
}
.o_chat_pins_toggle:hover { background: var(--o-brand-soft); }
.o_chat_pins_caret { margin-left: auto; display: inline-grid; color: var(--o-muted); }
.o_chat_pins_list { max-height: 220px; overflow-y: auto; overscroll-behavior: contain; padding: 0 6px 6px; }
.o_chat_pins_list[hidden] { display: none; }
.o_chat_pins_row { display: flex; align-items: center; gap: 4px; border-radius: 8px; }
.o_chat_pins_row:hover { background: var(--o-ground); }
.o_chat_pins_jump {
  display: grid; grid-template-columns: auto 1fr; column-gap: 8px; align-items: baseline;
  flex: 1 1 auto; min-width: 0; padding: 6px; border: 0; background: transparent;
  color: var(--o-text); font: inherit; text-align: left; cursor: pointer;
}
.o_chat_pins_author { color: var(--o-text-strong); font-size: 12px; font-weight: 700; white-space: nowrap; }
.o_chat_pins_text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.o_chat_pins_date { grid-column: 1 / -1; font-size: 10px; }
.o_chat_pins_unpin {
  flex: none; width: 26px; height: 26px; display: grid; place-items: center; padding: 0;
  border: 0; border-radius: 50%; background: transparent; color: var(--o-muted); cursor: pointer;
}
.o_chat_pins_unpin:hover { background: var(--o-brand-soft); color: var(--o-text-strong); }

/* Starred: the entry at the bottom of the list and its sheet. */
.o_chat_starred_entry {
  display: flex !important; align-items: center; justify-content: space-between; gap: 8px;
  margin-top: 6px; border-top: 1px solid var(--o-border-light) !important;
}
.o_chat_starred_entry[hidden] { display: none !important; }
.o_chat_starred_icon { display: inline-grid; place-items: center; color: #c99a1e; }
.o_chat_starred_count { color: var(--o-muted); font-size: 11px; font-weight: 700; }
.o_chat_starred_list { display: flex; flex-direction: column; gap: 2px; max-height: min(56vh, 460px); overflow-y: auto; margin: 0 -4px; }
.o_chat_starred_where { grid-column: 1 / -1; font-size: 10.5px; }
.o_chat_starred_row .o_chat_pins_text { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

/* Forward preview in the share picker. */
.o_chat_forward_preview {
  display: flex; flex-direction: column; gap: 3px; padding: 8px 10px;
  border-left: 3px solid var(--o-brand-light); border-radius: 6px; background: var(--o-ground);
}
.o_chat_forward_text { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; font-size: 13px; }
.o_chat_forward_files { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; }

/* Files sheet. */
.o_dialog:has(.o_chat_files) { max-width: 520px; }
.o_chat_files { display: flex; flex-direction: column; gap: 10px; max-height: min(64vh, 560px); overflow-y: auto; }
.o_chat_files_grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 6px; }
.o_chat_files_grid[hidden], .o_chat_files_rows[hidden] { display: none; }
.o_chat_files_tile { position: relative; aspect-ratio: 1; border-radius: 8px; overflow: hidden; background: var(--o-ground); border: 1px solid var(--o-border-light); }
.o_chat_files_tile_btn { display: block; width: 100%; height: 100%; padding: 0; border: 0; background: transparent; cursor: zoom-in; }
.o_chat_files_thumb { display: block; width: 100%; height: 100%; object-fit: cover; }
.o_chat_files_thumb:not([src]) { visibility: hidden; }
.o_chat_files_jump {
  position: absolute; right: 4px; bottom: 4px; width: 24px; height: 24px; display: grid; place-items: center;
  padding: 0; border: 1px solid var(--o-border-light); border-radius: 50%;
  background: var(--o-sheet); color: var(--o-brand-dark); cursor: pointer;
}
.o_chat_files_rows { display: flex; flex-direction: column; gap: 2px; }
.o_chat_files_row { display: flex; align-items: center; gap: 6px; border-radius: 8px; padding-right: 4px; }
.o_chat_files_row:hover { background: var(--o-ground); }
.o_chat_files_open {
  display: flex; align-items: center; gap: 10px; flex: 1 1 auto; min-width: 0; padding: 7px 6px;
  border: 0; background: transparent; color: var(--o-text); font: inherit; text-align: left; cursor: pointer;
}
.o_chat_files_open.is-loading { cursor: progress; opacity: .7; }
.o_chat_files_icon { display: grid; place-items: center; flex: none; width: 32px; height: 32px; border-radius: 8px; background: var(--o-brand-soft); color: var(--o-brand-dark); }
.o_chat_files_text { display: flex; flex-direction: column; min-width: 0; }
.o_chat_files_name { color: var(--o-text-strong); font-size: 13px; font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.o_chat_files_meta { font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ----------------------------------------------- the full Chat page */
.o_chat_layout.o_chat_page { grid-template-columns: 280px minmax(0, 1fr) 260px; }
.o_chat_page_main {
  display: flex; flex-direction: column; min-width: 0; max-height: calc(100vh - 210px);
  border: 1px solid var(--o-border-light); border-radius: 6px; overflow: hidden; background: var(--o-sheet);
}
.o_chat_page_main > .o_chat_pane { flex: 1 1 auto; min-height: 0; max-height: none; border: 0; border-radius: 0; }
.o_chat_page_head[hidden] { display: none; }
.o_chat_page .o_chat_convo_head { padding-left: 14px; }
.o_chat_section + .o_chat_section, .o_chat_sidebar_list > .o_chat_starred_entry { margin-top: 4px; }
.o_chat_section_head {
  display: flex; align-items: center; gap: 4px; width: 100%; padding: 6px 6px 4px; border: 0; border-radius: 5px;
  background: transparent; color: var(--o-muted); font: inherit; cursor: pointer; text-align: left;
}
.o_chat_section_head:hover { background: var(--o-ground); }
.o_chat_section_head .o_chat_group_label { padding: 0; margin: 0; flex: 1 1 auto; }
.o_chat_section_caret { display: inline-grid; place-items: center; width: 16px; }
.o_chat_section_body[hidden] { display: none; }
.o_chat_sidebar .o_chat_channel_name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.o_chat_sidebar .o_chat_row_identity { min-width: 0; }
.o_chat_sidebar_empty { padding: 8px 10px; }
.o_chat_members_pane {
  display: flex; flex-direction: column; gap: 10px; min-width: 0; padding: 12px;
  max-height: calc(100vh - 210px); overflow-y: auto; box-sizing: border-box;
  border: 1px solid var(--o-border-light); border-radius: 6px; background: var(--o-sheet);
}
.o_chat_members_pane:empty { display: none; }
.o_chat_pane_title { display: flex; flex-direction: column; gap: 1px; }
.o_chat_pane_title .text-strong { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.o_chat_pane_kind { font-size: 11px; }
.o_chat_pane_description { margin: 0; color: var(--o-text); font-size: 12px; line-height: 1.4; }
.o_chat_pane_stats { display: flex; align-items: center; gap: 5px; font-size: 11.5px; }
.o_chat_pane_section {
  display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-top: 8px;
  border-top: 1px solid var(--o-border-light);
  color: var(--o-muted); font-size: 10.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
}
.o_chat_pane_section .o_chat_members_link { text-transform: none; letter-spacing: 0; }
.o_chat_pane_members { display: flex; flex-direction: column; gap: 2px; }
.o_chat_pane_member { display: flex; align-items: center; gap: 8px; padding: 4px 2px; }
.o_chat_pane_member .o_chat_members_avatar { width: 28px; height: 28px; font-size: 10px; }
.o_chat_pane_member .o_chat_members_name { font-size: 12.5px; }
@media (max-width: 1099px) {
  .o_chat_layout.o_chat_page { grid-template-columns: 280px minmax(0, 1fr); }
  .o_chat_members_pane { display: none; }
}
@media (max-width: 820px) {
  .o_chat_layout.o_chat_page { grid-template-columns: 1fr; }
  .o_chat_page_main { max-height: none; min-height: 420px; }
}

/* Compact (rail): everything a notch smaller. */
.o_chat_pane.compact .o_chat_pins_toggle { padding: 3px 10px; min-height: 26px; }
.o_chat_pane.compact .o_chat_day_separator { margin: 8px 0 6px; }

/* Dark theme. */
html[data-theme="dark"] .o_chat_link { color: var(--o-brand-deep, #9fd49f); }
html[data-theme="dark"] .o_chat_code { background: rgba(255,255,255,.06); }
html[data-theme="dark"] .o_chat_pins_toggle,
html[data-theme="dark"] .o_chat_flag.pin,
html[data-theme="dark"] .o_chat_receipt_dot,
html[data-theme="dark"] .o_chat_files_icon,
html[data-theme="dark"] .o_chat_files_jump { color: var(--o-brand-deep, #9fd49f); }
html[data-theme="dark"] .o_chat_flag.star,
html[data-theme="dark"] .o_chat_starred_icon { color: #e5c15a; }
html[data-theme="dark"] .o_chat_msg_menu { box-shadow: 0 8px 20px rgba(0,0,0,.5); }
html[data-theme="dark"] .o_chat_forward_preview { background: rgba(255,255,255,.04); }

@media (max-width: 991px) {
  .o_chat_emoji_search { font-size: 16px; height: 36px; } /* no iOS zoom */
  .o_chat_msg_menu .o_chat_menu_item { min-height: 40px; font-size: 14px; }
  .o_chat_pins_toggle { min-height: 34px; }
}

/* ===================================================================
   Release 6 (docs/console_chat_r6_contract.md): bot cards, tasks, quick
   replies, polls, voice notes, translation, status, broadcast rooms,
   scheduled send, reminders/mentions, annotate, admin. Tokens only, so
   the dark theme follows; a few explicit dark overrides at the end.
   =================================================================== */
:root { --o-chat-nw-red: #d92d20; }

/* ---- bot card */
.o_chat_bot_chip {
  display: inline-grid; place-items: center; flex: none; width: 24px; height: 24px;
  border-radius: 7px; background: var(--o-brand-dark); color: #fff;
  font-size: 12px; font-weight: 800; line-height: 1;
}
.o_chat_msg.bot { min-width: min(260px, 78%); }
.o_chat_msg.bot .o_chat_msg_body {
  background: var(--o-sheet); border-color: var(--o-border);
  border-left: 3px solid var(--o-brand); border-radius: 8px;
}
.o_chat_bot_actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.o_chat_bot_action {
  min-height: 28px; padding: 3px 11px; border: 1px solid var(--o-brand-light); border-radius: 999px;
  background: transparent; color: var(--o-brand-dark); font: inherit; font-size: 12px; font-weight: 650; cursor: pointer;
}
.o_chat_bot_action:hover { background: var(--o-brand-soft); }
.o_chat_bot_action:disabled { opacity: .55; cursor: default; }
.o_chat_msg.mine .o_chat_bot_actions { justify-content: flex-end; }

/* ---- task chip */
.o_chat_task_chip {
  display: inline-flex; align-items: center; gap: 5px; max-width: 100%; margin-top: 5px;
  padding: 2px 9px; min-height: 24px; border: 1px solid var(--o-border); border-radius: 999px;
  background: var(--o-sheet); color: var(--o-text); font: inherit; font-size: 11px; font-weight: 650; cursor: pointer;
}
.o_chat_task_chip span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.o_chat_task_chip:hover:not(:disabled) { border-color: var(--o-brand-light); background: var(--o-brand-soft); }
.o_chat_task_chip:disabled { cursor: default; }
.o_chat_task_chip.done { border-color: var(--o-success-border); background: var(--o-success-bg); color: var(--o-success-text); }
.o_chat_msg.mine .o_chat_task_chip { margin-left: auto; display: flex; width: fit-content; }

/* ---- quick replies (handhelds only) */
.o_chat_quick_replies { display: flex; gap: 6px; padding: 6px 10px 0; overflow-x: auto; }
.o_chat_quick_replies[hidden] { display: none; }
.o_chat_quick_reply {
  flex: none; min-height: 34px; padding: 5px 14px; border: 1px solid var(--o-brand-light); border-radius: 999px;
  background: var(--o-sheet); color: var(--o-brand-dark); font: inherit; font-size: 13px; font-weight: 650; cursor: pointer;
}
.o_chat_quick_reply:active { background: var(--o-brand-soft); }
@media (min-width: 721px) { .o_chat_quick_replies { display: none !important; } }

/* ---- broadcast: the line in place of the composer */
.o_chat_readonly_note {
  margin: 8px 10px 10px; padding: 9px 12px; border: 1px dashed var(--o-border); border-radius: 10px;
  font-size: 12px; text-align: center;
}
.o_chat_readonly_note[hidden], .o_chat_composer_row[hidden] { display: none !important; }
.o_chat_menu_hint { margin-left: auto; color: var(--o-muted); font-size: 10px; }

/* ---- record a conversation is about, pinned on top */
.o_chat_record_strip { padding: 6px 10px; border-bottom: 1px solid var(--o-border-light); background: var(--o-ground); }
.o_chat_record_strip[hidden] { display: none; }
.o_chat_record_strip .o_chat_card { width: 100%; margin-top: 0; }
.o_chat_record_strip .o_chat_card_main { padding: 5px 9px; flex-direction: row; align-items: center; gap: 8px; }
.o_chat_record_strip .o_chat_card_sub { display: none; }

/* ---- polls */
.o_chat_msg.has-poll { min-width: min(280px, 82%); }
.o_chat_poll {
  display: grid; gap: 6px; padding: 9px 11px; border: 1px solid var(--o-border-light); border-radius: 10px;
  background: var(--o-ground);
}
.o_chat_msg.mine .o_chat_poll { background: var(--o-brand-soft); border-color: var(--o-brand-light); }
.o_chat_poll_q { display: flex; align-items: flex-start; gap: 6px; color: var(--o-text-strong); font-size: 13px; }
.o_chat_poll_q svg { flex: none; margin-top: 2px; color: var(--o-brand-dark); }
.o_chat_poll_options { display: grid; gap: 5px; }
.o_chat_poll_option {
  position: relative; display: flex; align-items: center; gap: 7px; min-height: 34px; padding: 5px 9px;
  border: 1px solid var(--o-border); border-radius: 8px; background: var(--o-sheet); color: var(--o-text);
  font: inherit; font-size: 13px; text-align: left; cursor: pointer; overflow: hidden;
}
.o_chat_poll_option:hover:not(:disabled) { border-color: var(--o-brand-light); }
.o_chat_poll_option:disabled { cursor: default; }
.o_chat_poll_option > :not(.o_chat_poll_bar) { position: relative; }
.o_chat_poll_bar { position: absolute; inset: 0 auto 0 0; background: var(--o-brand-soft); transition: width .25s ease; }
.o_chat_poll_option.mine { border-color: var(--o-brand); }
.o_chat_poll_option.mine .o_chat_poll_bar, .o_chat_poll_option.winner .o_chat_poll_bar { background: rgba(69, 153, 69, .22); }
.o_chat_poll_option.winner { font-weight: 700; }
.o_chat_poll_mark {
  display: inline-grid; place-items: center; flex: none; width: 16px; height: 16px;
  border: 1.5px solid var(--o-border); border-radius: 50%; color: var(--o-brand-dark);
}
.o_chat_poll_option[role="checkbox"] .o_chat_poll_mark { border-radius: 4px; }
.o_chat_poll_option.mine .o_chat_poll_mark { border-color: var(--o-brand); background: var(--o-sheet); }
.o_chat_poll_text { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.o_chat_poll_pct { flex: none; color: var(--o-muted); font-size: 11px; font-variant-numeric: tabular-nums; }
.o_chat_poll_voters { display: inline-flex; gap: 2px; flex: none; }
.o_chat_poll_voters .o_chat_receipt_dot { width: 18px; height: 18px; font-size: 8px; }
.o_chat_poll_foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 11px; }
.o_chat_poll_close {
  padding: 2px 8px; border: 1px solid var(--o-border); border-radius: 999px; background: transparent;
  color: var(--o-text); font: inherit; font-size: 11px; cursor: pointer;
}

/* ---- voice notes */
.o_chat_msg.has-voice { min-width: min(240px, 78%); }
.o_chat_voice {
  display: grid; gap: 4px; padding: 7px 10px; border: 1px solid var(--o-border-light); border-radius: 10px;
  background: var(--o-ground);
}
.o_chat_msg.mine .o_chat_voice { background: var(--o-brand-soft); border-color: var(--o-brand-light); }
.o_chat_voice_row { display: flex; align-items: center; gap: 9px; }
.o_chat_voice_btn {
  display: inline-grid; place-items: center; flex: none; width: 32px; height: 32px; padding: 0;
  border: 0; border-radius: 50%; background: var(--o-brand); color: #fff; cursor: pointer;
}
.o_chat_voice.expired .o_chat_voice_btn { background: var(--o-border); color: var(--o-muted); }
.o_chat_voice_btn.is-loading { opacity: .6; }
.o_chat_voice_bar { position: relative; flex: 1 1 auto; height: 4px; border-radius: 2px; background: var(--o-border); overflow: hidden; min-width: 60px; }
.o_chat_voice_fill { position: absolute; inset: 0 auto 0 0; width: 0; background: var(--o-brand); }
.o_chat_voice_time { flex: none; color: var(--o-muted); font-size: 11px; font-variant-numeric: tabular-nums; }
.o_chat_voice_transcript { font-size: 12px; line-height: 1.35; white-space: pre-wrap; }
.o_chat_voice_transcript.pending { font-style: italic; }
.o_chat_voice_expired { flex: 1 1 auto; font-size: 12px; }
.o_chat_voice_sheet { display: grid; justify-items: center; gap: 10px; padding: 8px 0; }
.o_chat_voice_record {
  display: grid; place-items: center; width: 76px; height: 76px; border: 0; border-radius: 50%;
  background: var(--o-brand); color: #fff; cursor: pointer; box-shadow: 0 6px 18px rgba(25, 57, 25, .25);
}
.o_chat_voice_record.is-recording { background: var(--o-chat-nw-red); animation: o-chat-rec 1.2s ease-in-out infinite; }
.o_chat_voice_record[hidden] { display: none; }
@keyframes o-chat-rec { 50% { box-shadow: 0 0 0 10px rgba(217, 45, 32, .18); } }
.o_chat_voice_timer { font-size: 20px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--o-text-strong); }
.o_chat_voice_status { font-size: 12px; text-align: center; }
.o_chat_voice_preview { width: 100%; }

/* ---- translation */
.o_chat_translation {
  margin-top: 3px; padding: 7px 11px; border: 1px solid var(--o-border-light); border-radius: 10px;
  background: var(--o-ground); white-space: pre-wrap; word-break: break-word;
}
.o_chat_msg.mine .o_chat_translation { background: var(--o-brand-soft); border-color: var(--o-brand-light); }
.o_chat_msg_body:not([hidden]) + .o_chat_translation { border-style: dashed; }
.o_chat_translation_foot { display: flex; align-items: center; gap: 4px; margin-top: 3px; font-size: 10px; white-space: normal; }
.o_chat_translation_toggle { padding: 0; border: 0; background: transparent; color: var(--o-brand-dark); font: inherit; font-weight: 650; cursor: pointer; }
.o_chat_msg_body[hidden] { display: none; }

/* ---- scheduled (only the author sees these) */
.o_chat_scheduled { opacity: .72; }
.o_chat_scheduled .o_chat_msg_body { border-style: dashed; background: transparent; }
.o_chat_scheduled .o_chat_msg_meta { display: flex; align-items: center; gap: 4px; color: var(--o-muted); font-size: 11px; }
.o_chat_scheduled_actions { display: flex; justify-content: flex-end; margin-top: 3px; }
.o_chat_scheduled_cancel { padding: 1px 9px; border: 1px solid var(--o-border); border-radius: 999px; background: var(--o-sheet); color: var(--o-text); font: inherit; font-size: 11px; cursor: pointer; }

/* ---- "when" picker inside menus (Remind me, Send later) */
.o_chat_msg_menu.is-when { min-width: 210px; }
.o_chat_when { display: grid; gap: 2px; }
.o_chat_when .o_chat_menu_title { padding: 4px 8px; color: var(--o-muted); font-size: 11px; font-weight: 700; }
.o_chat_when_input { margin: 4px 6px; min-width: 0; }
.o_chat_when_actions { display: flex; justify-content: flex-end; gap: 6px; padding: 4px 6px; }
.o_chat_attachment_menu .o_chat_when { min-width: 200px; }

/* ---- status (directory, members, DM header, user menu, settings) */
.o_chat_status { display: inline-flex; align-items: center; gap: 3px; min-width: 0; color: var(--o-muted); font-size: 11px; }
.o_chat_status_text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.o_chat_status_moon { display: inline-grid; place-items: center; color: #6d5bd0; }
.o_chat_head_status::before { content: '·'; margin: 0 4px 0 2px; }
.o_chat_members_status, .o_chat_person_status { display: flex; margin-top: 1px; }
.o_chat_status_editor { display: grid; gap: 8px; padding: 8px 0; }
.o_chat_status_editor.compact { padding: 4px 0 6px; }
/* The user menu styles every identity <span> as a tiny muted label. */
.o_user_menu_identity .o_chat_status_editor span { flex: initial; color: inherit; font-size: inherit; }
.o_user_menu_identity .o_chat_status_editor .o_chat_status_row > label > span { color: var(--o-muted); font-size: 12px; }
.o_chat_status_presets { display: flex; flex-wrap: wrap; gap: 5px; }
.o_chat_status_chip {
  display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; min-height: 28px;
  border: 1px solid var(--o-border); border-radius: 999px; background: var(--o-sheet); color: var(--o-text);
  font: inherit; font-size: 12px; cursor: pointer;
}
.o_chat_status_chip.active { border-color: var(--o-brand); background: var(--o-brand-soft); color: var(--o-brand-dark); font-weight: 650; }
.o_chat_status_row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 12px; }
.o_chat_status_row > span, .o_chat_status_row label > span { color: var(--o-muted); white-space: nowrap; }
.o_chat_status_row label { display: inline-flex; align-items: center; gap: 6px; }
.o_chat_status_row select, .o_chat_status_pick { width: auto; min-width: 0; }
.o_chat_status_pick[hidden] { display: none; }
.o_chat_status_actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.o_chat_status_msg { color: var(--o-muted); font-size: 11px; }
.o_user_menu_status {
  display: flex; align-items: center; gap: 6px; width: 100%; margin-top: 2px; padding: 4px 0;
  border: 0; background: transparent; color: var(--o-text); font: inherit; font-size: 12px; text-align: left; cursor: pointer;
}
.o_user_menu_identity .o_user_menu_status span { font-size: 12px; }
.o_user_menu_status:hover .o_user_menu_status_text { color: var(--o-brand-dark); }
.o_user_menu_status_dot {
  display: inline-grid; place-items: center; width: 14px; height: 14px; border: 1.5px dashed var(--o-border); border-radius: 50%;
}
.o_user_menu_status_dot.set { border: 0; background: var(--o-brand-soft); }
.o_user_menu_status_dot.dnd { background: transparent; color: #6d5bd0; }
.o_user_menu_status_text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--o-text) !important; }
.o_user_menu_status_editor[hidden] { display: none; }
.o_chat_settings_status { border-bottom: 0; }

/* ---- rail bottom entries + fired reminders on top */
.o_chat_reminders_top[hidden] { display: none; }
.o_chat_reminder_row { border-left: 3px solid var(--o-warning-border, #ffeeba); background: var(--o-warning-bg); }
.o_chat_reminder_row .o_chat_row_preview { display: block; margin-top: 2px; font-size: 11px; }
.o_chat_reminder_bell { display: inline-grid; place-items: center; color: var(--o-warning-text); }
.o_chat_reminder_count { min-width: 18px; padding: 0 5px; border-radius: 9px; background: var(--o-danger); color: #fff !important; font-size: 10px; font-weight: 800; line-height: 18px; text-align: center; }
.o_chat_reminder_count[hidden] { display: none; }
.o_chat_starred_row.fired { background: var(--o-warning-bg); }
.o_chat_sheet_hint { margin: 0 0 6px; font-size: 12px; }

/* ---- sheets: task, poll */
.o_chat_task_sheet, .o_chat_poll_sheet { display: grid; gap: 12px; }
.o_chat_field { display: grid; gap: 5px; }
.o_chat_field_label { color: var(--o-muted); font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.o_chat_field_hint { margin: 0; font-size: 12px; }
.o_chat_task_owner { display: flex; align-items: center; gap: 10px; }
.o_chat_task_people { display: grid; gap: 2px; max-height: 200px; overflow: auto; }
.o_chat_task_people[hidden], .o_chat_task_sheet input[hidden] { display: none; }
.o_chat_seg { display: flex; flex-wrap: wrap; gap: 5px; }
.o_chat_seg_btn {
  min-height: 32px; padding: 4px 12px; border: 1px solid var(--o-border); border-radius: 999px;
  background: var(--o-sheet); color: var(--o-text); font: inherit; font-size: 12px; cursor: pointer;
}
.o_chat_seg_btn.active { border-color: var(--o-brand); background: var(--o-brand-soft); color: var(--o-brand-dark); font-weight: 650; }
.o_chat_poll_inputs { display: grid; gap: 6px; }
.o_chat_poll_input_row { display: flex; align-items: center; gap: 6px; }
.o_chat_poll_input_row input { flex: 1 1 auto; min-width: 0; }
.o_chat_poll_sheet .btn[hidden] { display: none; }
.o_chat_checkrow { display: flex; align-items: center; gap: 8px; font-size: 13px; }

/* ---- Discuss beside Share */
.o_discuss_btn { color: var(--o-brand-dark); }

/* ---- photo annotate: full screen, dark stage */
.o_chat_annotate {
  position: fixed; inset: 0; z-index: 2000; display: flex; flex-direction: column;
  background: #111; color: #fff;
  padding: var(--o-safe-top, env(safe-area-inset-top, 0px)) 0 env(safe-area-inset-bottom, 0px);
}
.o_chat_annotate_bar { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 10px; }
.o_chat_annotate_tools { display: flex; gap: 4px; }
.o_chat_annotate_tool {
  display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%;
  background: rgba(255, 255, 255, .1); color: #fff; cursor: pointer;
}
.o_chat_annotate_tool.active { background: var(--o-chat-nw-red); }
.o_chat_annotate_tool:disabled { opacity: .35; cursor: default; }
.o_chat_annotate_stage {
  flex: 1 1 auto; min-height: 0; display: grid; place-items: center; padding: 6px;
  grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr);
}
.o_chat_annotate_canvas { max-width: 100%; max-height: 100%; touch-action: none; border-radius: 4px; background: #222; }
.o_chat_annotate_textbar { display: flex; gap: 8px; padding: 8px 10px 12px; background: #1c1c1c; }
.o_chat_annotate_textbar[hidden] { display: none; }
.o_chat_annotate_textbar input { flex: 1 1 auto; min-width: 0; }

/* ---- Settings → Chat */
.o_chat_admin_table td, .o_chat_admin_table th { white-space: nowrap; }
.o_chat_admin_table tr.is-archived td { color: var(--o-muted); }
.o_chat_admin_actions { display: flex; gap: 2px; justify-content: flex-end; }
.o_chat_admin_block { display: grid; gap: 8px; }
.o_chat_admin_row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.o_chat_admin_row .o_input[type="search"] { flex: 1 1 220px; min-width: 0; }
.o_chat_admin_retention { width: 110px; }
.o_chat_admin_results { overflow-x: auto; }
.o_chat_admin_snippet { white-space: normal !important; min-width: 220px; }

/* ---- full page: the rail stands down while the page is open */
body.o_chat_full_page .o_chat_panel,
body.o_chat_full_page .o_chat_mobile_launcher { display: none !important; }
@media (min-width: 992px) {
  body.o_chat_full_page.o_has_chat_rail .o_action_manager,
  body.o_chat_full_page.o_has_chat_rail.o_chat_expanded .o_action_manager { padding-left: 0; }
}
.o_chat_fullpage_btn { color: var(--o-muted); }

/* ---- compact rail + phones */
.o_chat_pane.compact .o_chat_poll_option { min-height: 32px; font-size: 12px; }
.o_chat_pane.compact .o_chat_msg.has-poll,
.o_chat_pane.compact .o_chat_msg.has-voice,
.o_chat_pane.compact .o_chat_msg.bot { min-width: min(240px, 94%); }
@media (max-width: 720px) {
  .o_chat_msg.has-poll, .o_chat_msg.has-voice, .o_chat_msg.bot { min-width: min(260px, 92%); }
  .o_chat_admin_table td[data-label]::before,
  .o_chat_admin_search td[data-label]::before { content: attr(data-label) ' · '; color: var(--o-muted); }
  .o_chat_admin_table td, .o_chat_admin_table th { white-space: normal; }
  .o_chat_admin_actions { justify-content: flex-start; }
  .o_chat_status_row select, .o_chat_status_pick { flex: 1 1 140px; }
}

/* ---- dark */
html[data-theme="dark"] .o_chat_bot_chip { background: var(--o-brand); color: #0b130b; }
html[data-theme="dark"] .o_chat_msg.bot .o_chat_msg_body,
html[data-theme="dark"] .o_chat_poll_option,
html[data-theme="dark"] .o_chat_task_chip,
html[data-theme="dark"] .o_chat_quick_reply,
html[data-theme="dark"] .o_chat_status_chip,
html[data-theme="dark"] .o_chat_seg_btn { background: var(--o-sheet); border-color: var(--o-border); }
html[data-theme="dark"] .o_chat_poll_option.mine .o_chat_poll_bar,
html[data-theme="dark"] .o_chat_poll_option.winner .o_chat_poll_bar { background: rgba(108, 173, 103, .28); }
html[data-theme="dark"] .o_chat_status_moon,
html[data-theme="dark"] .o_user_menu_status_dot.dnd { color: #a99bf5; }
html[data-theme="dark"] .o_chat_reminder_row,
html[data-theme="dark"] .o_chat_starred_row.fired { background: rgba(255, 193, 7, .12); }
html[data-theme="dark"] .o_chat_reminder_bell { color: #f5c451; }

/* Keep message history and reactions usable on phones and touch tablets. */
@media (max-width: 991px), (pointer: coarse) {
  .o_chat_load_older,
  .o_chat_reaction,
  .o_chat_react_add,
  .o_chat_message_tool,
  .o_chat_reaction_popover .o_chat_reaction_choice {
    min-width: 44px;
    min-height: 44px;
  }
}
