/* Conversation search and the avatar details panel, shared by embedded and standalone chat. */
.voicer-native-chat #toast4 { pointer-events: none; }
.voicer-chat-searchbar[hidden], .voicer-chat-details__panel[hidden] { display: none !important; }
.voicer-chat-searchbar { display: flex; align-items: center; gap: 6px; box-sizing: border-box; height: 54px; padding: 7px 10px; border-bottom: 1px solid #dce7f5; background: #fff; box-shadow: 0 5px 14px rgba(25, 60, 105, .06); }
.voicer-native-chat .voicer-chat-searchbar { position: absolute; z-index: 29; top: 50px; right: 0; left: 0; }
body.voicer-chat-conversation .voicer-chat-searchbar { position: fixed; z-index: 6000; top: 50px; right: 0; left: 0; }
html.voicer-embedded-chat body.voicer-chat-conversation .voicer-chat-searchbar { top: 0; }
.voicer-chat-searchbar input { flex: 1 1 auto; width: 100%; min-width: 0; height: 38px; padding: 8px 10px; border: 1px solid #cbdcf1; border-radius: 10px; background: #f8fbff; color: #193a5e; font-size: 13px; outline: none; }
.voicer-chat-searchbar input:focus { border-color: #77aaf0; box-shadow: 0 0 0 3px rgba(48, 117, 218, .12); }
.voicer-chat-searchbar [data-chat-search-count] { flex: none; min-width: 43px; color: #587391; font-size: 11px; white-space: nowrap; text-align: center; }
.voicer-chat-searchbar button { flex: none; display: grid; place-items: center; width: 30px; height: 34px; padding: 0; border: 0; border-radius: 8px; background: #eef5ff; color: #255d9f; font-size: 17px; cursor: pointer; }
.voicer-chat-searchbar button:disabled { opacity: .4; cursor: default; }
.voicer-chat-searchbar button:hover:not(:disabled), .voicer-chat-searchbar button:focus-visible { background: #dbeaff; outline: none; }
.voicer-chat-searchbar [data-chat-search-close] { font-size: 24px; }
.voicer-native-chat.is-chat-searching .voicer-chat-scroll { top: 112px; }
body.voicer-chat-conversation.is-chat-searching .voicer-chat-scroll { padding-top: 58px !important; }
.voicer-chat-message.is-chat-search-match .voicer-chat-message__bubble { outline: 2px solid #7dadf0; outline-offset: 2px; }
.voicer-chat-message.is-chat-search-current .voicer-chat-message__bubble { outline: 3px solid #1d66d2; outline-offset: 3px; box-shadow: 0 0 0 7px rgba(48, 120, 222, .15) !important; }
.voicer-chat-details { width: min(420px, 100vw) !important; padding: 0 !important; background: #f5f8fd !important; color: #1b3858; }
.voicer-native-chat #menu-user.voicer-chat-details { position: absolute; top: 0 !important; right: 0; bottom: 0; width: 100% !important; height: 100%; z-index: 45; }
.voicer-chat-details__inner { min-height: 100%; }
.voicer-chat-details__header { position: sticky; top: 0; z-index: 3; display: grid; grid-template-columns: 38px 1fr 38px; align-items: center; min-height: 55px; padding: 7px 14px; border-bottom: 1px solid #dfebf8; background: rgba(255, 255, 255, .96); text-align: center; }
.voicer-chat-details__header strong { grid-column: 2; color: #1a375a; font-size: 14px; font-weight: 800; }
.voicer-chat-details__back { grid-row: 1; grid-column: 1; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; color: #315d90; text-decoration: none; }
.voicer-chat-details__back:hover, .voicer-chat-details__back:focus-visible { background: #eaf3ff; color: #1c62bd; outline: none; }
.voicer-chat-details__body { display: grid; gap: 15px; padding: 14px; }
.voicer-chat-details__person, .voicer-chat-details__shared { padding: 18px 15px; border: 1px solid #dce8f6; border-radius: 17px; background: #fff; box-shadow: 0 5px 18px rgba(20, 61, 115, .045); }
.voicer-chat-details__person { text-align: center; }
.voicer-chat-details__portrait { position: relative; display: inline-block; width: 84px; height: 84px; }
.voicer-chat-details__portrait img { width: 84px; height: 84px; border-radius: 50%; object-fit: cover; }
.voicer-chat-details__presence { position: absolute; right: 3px; bottom: 5px; width: 15px; height: 15px; border: 3px solid #fff; border-radius: 50%; background: #98a8bb; }
.voicer-chat-details__presence.is-online { background: #48bd83; }
.voicer-chat-details__person h2 { margin: 9px 0 1px; color: #182f4e; font-size: 22px; font-weight: 800; line-height: 1.2; }
.voicer-chat-details__handle { margin: 0; color: #2869bf; font-size: 12px; }
.voicer-chat-details__bio { margin: 10px 0 0; color: #647b95; font-size: 12px; line-height: 1.4; }
.voicer-chat-details__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; margin: 17px 0 15px; padding: 13px 0; border-top: 1px solid #e7eef8; border-bottom: 1px solid #e7eef8; }
.voicer-chat-details__stats div { display: grid; gap: 2px; }
.voicer-chat-details__stats strong { color: #213e62; font-size: 15px; line-height: 1.2; }
.voicer-chat-details__stats span { color: #71869e; font-size: 10px; }
.voicer-chat-details__actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.voicer-chat-details__actions :is(a, button) { display: flex; align-items: center; justify-content: center; gap: 5px; min-width: 0; min-height: 37px; padding: 6px; border: 1px solid #d6e5f6; border-radius: 9px; background: #f3f8ff; color: #2a5f9b; font-size: 11px; font-weight: 700; text-decoration: none; cursor: pointer; }
.voicer-chat-details__actions :is(a, button):hover, .voicer-chat-details__actions :is(a, button):focus-visible { border-color: #a7c7ee; background: #e5f1ff; outline: none; }
.voicer-chat-details__actions button:last-child { color: #aa4555; }
.voicer-chat-details__section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 12px; }
.voicer-chat-details__section-head h3 { margin: 0; color: #1d3858; font-size: 16px; font-weight: 800; }
.voicer-chat-details__section-head span { color: #8091a6; font-size: 11px; }
.voicer-chat-details__tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 3px; padding: 3px; border: 1px solid #e1eaf5; border-radius: 11px; background: #f1f6fd; }
.voicer-chat-details__tabs button { min-width: 0; min-height: 37px; padding: 5px 2px; border: 0; border-radius: 8px; background: transparent; color: #607996; font-size: 11px; font-weight: 700; cursor: pointer; }
.voicer-chat-details__tabs button span { margin-left: 2px; font-size: 10px; opacity: .75; }
.voicer-chat-details__tabs button[aria-selected="true"] { background: #fff; color: #1d62c0; box-shadow: 0 2px 7px rgba(29, 77, 139, .1); }
.voicer-chat-details__tabs button:focus-visible { outline: 2px solid #75a9ec; outline-offset: -2px; }
.voicer-chat-details__panel { min-height: 100px; padding: 14px 1px 2px; }
.voicer-chat-details__empty { display: grid; place-items: center; min-height: 100px; margin: 0; padding: 15px; border: 1px dashed #d4e2f3; border-radius: 12px; background: #f9fbff; color: #69819d; font-size: 12px; text-align: center; }
.voicer-chat-details__media-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.voicer-chat-details__media-grid button { position: relative; display: block; aspect-ratio: 1; min-width: 0; padding: 0; overflow: hidden; border: 0; border-radius: 9px; background: #e8eff8; cursor: pointer; }
.voicer-chat-details__media-grid :is(img, video) { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.voicer-chat-details__media-grid img[data-media-fallback="true"] { object-fit: contain; background: #edf4ff; }
.voicer-chat-details__media-grid button:focus-visible { outline: 3px solid #438eea; outline-offset: 2px; }
.voicer-chat-details__play { position: absolute; top: 50%; left: 50%; display: grid; place-items: center; width: 30px; height: 30px; padding-left: 2px; transform: translate(-50%, -50%); border-radius: 50%; background: rgba(10, 26, 48, .75); color: #fff; font-size: 12px; }
.voicer-chat-details__list { display: grid; gap: 7px; }
.voicer-chat-details__list a { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 9px; border: 1px solid #e0eaf5; border-radius: 10px; color: #255b98; text-decoration: none; }
.voicer-chat-details__list a:hover { background: #f1f7ff; }
.voicer-chat-details__list a > i:first-child { flex: none; font-size: 15px; }
.voicer-chat-details__list a > i:last-child { flex: none; margin-left: auto; font-size: 11px; }
.voicer-chat-details__list a span { display: grid; min-width: 0; }
.voicer-chat-details__list a strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.voicer-chat-details__list a small { color: #788fa7; font-size: 10px; }
body.theme-dark .voicer-chat-searchbar { border-color: #354a65; background: #1d2b40; }
body.theme-dark .voicer-chat-searchbar input { border-color: #49617f; background: #23344b; color: #edf5ff; }
body.theme-dark .voicer-chat-searchbar input::placeholder { color: #afc3df; }
body.theme-dark .voicer-chat-searchbar [data-chat-search-count] { color: #bfd1e8; }
body.theme-dark .voicer-chat-searchbar button { background: #2c4666; color: #d5e8ff; }
body.theme-dark .voicer-chat-details { background: #152236 !important; color: #edf5ff; }
body.theme-dark .voicer-chat-details__header { border-color: #354a65; background: #1d2b40; }
body.theme-dark .voicer-chat-details__header strong, body.theme-dark .voicer-chat-details__person h2, body.theme-dark .voicer-chat-details__stats strong, body.theme-dark .voicer-chat-details__section-head h3 { color: #f0f6ff; }
body.theme-dark .voicer-chat-details__back { color: #c5dcf6; }
body.theme-dark .voicer-chat-details__person, body.theme-dark .voicer-chat-details__shared { border-color: #3b526e; background: #1e2f45; }
body.theme-dark .voicer-chat-details__presence { border-color: #1e2f45; }
body.theme-dark .voicer-chat-details__handle { color: #a9d2ff !important; }
body.theme-dark .voicer-chat-details__bio, body.theme-dark .voicer-chat-details__stats span, body.theme-dark .voicer-chat-details__section-head span { color: #b2c5dc !important; }
body.theme-dark .voicer-chat-details__stats { border-color: #3b526e; }
body.theme-dark .voicer-chat-details__actions :is(a, button) { border-color: #46617f; background: #2a4260; color: #d0e5ff; }
body.theme-dark .voicer-chat-details__actions button:last-child { color: #ffb7c0; }
body.theme-dark .voicer-chat-details__tabs { border-color: #3b526e; background: #17283d; }
body.theme-dark .voicer-chat-details__tabs button { color: #b5c9e1; }
body.theme-dark .voicer-chat-details__tabs button[aria-selected="true"] { background: #31577e; color: #fff; }
body.theme-dark .voicer-chat-details__empty { border-color: #45617f; background: #21364f; color: #bed0e5; }
body.theme-dark .voicer-chat-details__list a { border-color: #415a78; color: #cae3ff; }
body.theme-dark .voicer-chat-details__list a:hover { background: #2c4766; }
body.theme-dark .voicer-chat-details__list a small { color: #aec4df; }
@media (max-width: 400px) {
    .voicer-chat-searchbar { gap: 4px; padding-inline: 6px; }
    .voicer-chat-searchbar [data-chat-search-count] { min-width: 35px; font-size: 10px; }
    .voicer-chat-searchbar button { width: 27px; }
    .voicer-native-chat .voicer-chat-call-actions button { width: 27px; min-width: 27px; padding: 0; }
    .voicer-native-chat .voicer-chat-header-profile { flex: 1 1 auto; min-width: 0; }
    .voicer-native-chat .voicer-chat-header-profile a { display: block; min-width: 0; }
    .voicer-native-chat .voicer-chat-header-profile [data-voicer-chat-name] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
