/* Shared Android and browser finish, sampled from secure-messaging-hero-v2.webp.
   Keep this after index.css so legacy layouts cannot restore neon phone styles. */
body.messenger-view #contact-discovery-results-dialog { background: #151727; color: #f5f3ff; width: min(680px, calc(100% - 24px)); }
.contact-import-toolbar { display: grid; gap: 10px; }
body.messenger-view .flow-dialog .contact-import-select-all,
body.messenger-view .flow-dialog .contact-import-choice { display: flex; align-items: center; gap: 14px; cursor: pointer; color: #f5f3ff; font-weight: 500; }
body.messenger-view .contact-import-toolbar input[type="search"] { background: #222438; color: #fff; border: 1px solid #55536c; border-radius: 8px; min-height: 44px; width: 100%; padding: 10px 12px; font: inherit; }
body.messenger-view .contact-import-toolbar input[type="search"]::placeholder { color: #c2bfd2; }
.contact-import-select-all input, .contact-import-choice input { flex: 0 0 24px; width: 24px; height: 24px; accent-color: #9a80ff; }
.contact-import-list { display: grid; gap: 8px; margin-block: 12px; }
.contact-import-row { padding: 14px; border: 1px solid #3c3e57; border-radius: 10px; background: #222438; min-width: 0; }
body.messenger-view .contact-import-choice span { color: #d0ccdf; font-weight: 400; min-width: 0; overflow-wrap: anywhere; }
body.messenger-view .contact-import-choice strong { display: block; font-size: 17px; font-weight: 650; color: #ffffff; line-height: 1.5; }
.contact-import-choice span span { display: block; font-size: 13px; }
body.messenger-view .contact-import-result, body.messenger-view .contact-import-note { color: #d0ccdf; font-size: 13px; line-height: 1.5; }
.contact-import-result { margin: 8px 0 0 38px; }
.contact-import-actions { position: sticky; bottom: -1px; background: #151727; padding: 12px 0; display: flex; flex-wrap: wrap; gap: 8px; }
.contact-import-actions button { flex: 1 1 180px; min-height: 44px; }
.contact-import-row select { width: 100%; margin-top: 8px; }
body.messenger-view,
html[data-effective-theme="dark"] body.messenger-view {
    --hero-page: #0d0f1d;
    --hero-rail: #111322;
    --hero-directory: #121423;
    --hero-main: #111322;
    --hero-surface: #242538;
    --hero-surface-active: #25243b;
    --hero-border: #252637;
    --hero-accent: #7b61eb;
    --hero-accent-strong: #6b50d8;
    --hero-text: #f2f1f8;
    --hero-muted: #a2a0b5;
    --hero-action-text: #b4a3ff;
    background: var(--hero-page);
    font-weight: 400;
}

body.messenger-view .app-panel { border-radius: 16px; box-shadow: none; }
body.messenger-view .conversation-pane,
body.messenger-view .compact-conversation-list { align-content: start; }
body.messenger-view #end-call-button { background: #e74d57; color: #fff; }
body.messenger-view .pane-heading h2,
body.messenger-view .conversation-heading-copy h2 { font-weight: 600; }
body.messenger-view .conversation-heading-copy p { color: var(--hero-muted); }
body.messenger-view .conversation-heading .icon-button,
body.messenger-view .header-action-button { background: transparent; border-color: transparent; color: var(--hero-text); }
body.messenger-view .conversation-directory-controls { gap: 8px; margin-top: 12px; }
body.messenger-view #conversation-search { border-radius: 8px; min-height: 40px; background: var(--hero-main); }
body.messenger-view .conversation-quick-filters {
    background: var(--hero-main);
    border: 1px solid var(--hero-border);
    border-radius: 8px;
    display: grid;
    gap: 0;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: 2px;
}
body.messenger-view .conversation-quick-filter { border: 0; border-radius: 6px; font-weight: 400; min-height: 36px; padding: 6px 8px; }
body.messenger-view .conversation-quick-filter.active { background: linear-gradient(120deg, var(--hero-accent), var(--hero-accent-strong)); box-shadow: none; color: #fff; }
body.messenger-view #conversation-filter { border-radius: 8px; background: var(--hero-main); }
body.messenger-view .recent-chats > .recent-chats-heading {
    /* The section retains its accessible heading without repeating Chats. */
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    display: block;
}
body.messenger-view .compact-conversation-list .item-card { border-bottom: 1px solid #1d1f30; border-radius: 8px; min-height: 72px; }
body.messenger-view .conversation-row-avatar { background: #302c49; border: 0; box-shadow: none; color: #dcd3ff; font-weight: 500; }
body.messenger-view .conversation-row > h3 { font-size: 14px; font-weight: 500; }
body.messenger-view .conversation-row > p { font-size: 12px; color: var(--hero-muted); }
body.messenger-view .conversation-row-summary { font-size: 11px; }
body.messenger-view .unread-badge { background: var(--hero-accent-strong); color: #fff; box-shadow: none; font-size: 11px; font-weight: 500; }
body.messenger-view #messages-list { background: var(--hero-main); gap: 12px; padding: 18px 12px; }
body.messenger-view #messages-list .message-bubble { border: 0; box-shadow: none; border-radius: 13px 13px 13px 4px; margin: 0; padding: 10px 40px 8px 12px; }
body.messenger-view #messages-list .message-outgoing { border-radius: 13px 13px 4px 13px; background: linear-gradient(120deg, var(--hero-accent), var(--hero-accent-strong)); }
body.messenger-view #messages-list .message-bubble > p { margin: 0; line-height: 1.5; }
body.messenger-view #messages-list .message-sender { display: block; color: #beb5d7; font-weight: 500; margin-bottom: 4px; }
body.messenger-view #messages-list .message-status { display: block; margin-top: 4px; color: #c1bdd2; font-size: 10px; }
body.messenger-view #messages-list .message-outgoing .message-status { color: #eee8ff; }
body.messenger-view #messages-list .message-failed .message-status { color: #ffaaa4; }
body.messenger-view .consumer-composer { border-radius: 14px; background: var(--hero-main); padding: 5px 6px; }
body.messenger-view .consumer-composer #send-message-button { background: var(--hero-accent-strong); border-radius: 10px; font-weight: 500; }
body.messenger-view .app-tab.active { color: #b5a1ff; text-shadow: none; }
body.messenger-view .app-tab:focus-visible,
body.messenger-view .conversation-quick-filter:focus-visible { outline: 2px solid #c4b6ff; outline-offset: 2px; }

@media screen and (min-width: 901px) {
    body.messenger-view .app-panel { grid-template-columns: 64px minmax(280px, 320px) minmax(0, 1fr); }
    body.messenger-view .app-header { padding: 16px 8px; }
    body.messenger-view .messenger-brand-mark { height: 34px; width: 34px; border-radius: 9px; }
    body.messenger-view .app-tabs { width: 48px; margin-inline: 8px; }
    body.messenger-view .app-tab { min-height: 48px; }
    body.messenger-view .conversation-pane { padding: 24px 12px 16px; }
    body.messenger-view .conversation-pane > .pane-heading h2 { font-size: 22px; }
    body.messenger-view .message-pane { padding: 18px 16px; }
}

@media screen and (min-width: 1280px) {
    body.messenger-view .message-pane:has(> #call-panel:not([hidden])) { grid-template-columns: minmax(320px, 1fr) minmax(210px, 260px); }
    body.messenger-view .message-pane > #call-panel:not([hidden]) { border: 0; border-left: 1px solid var(--hero-border); border-radius: 0; padding: 16px 10px; background: var(--hero-rail); }
    body.messenger-view #call-status { text-align: center; font-size: 13px; font-weight: 500; }
    body.messenger-view .call-videos video { border-radius: 8px; object-fit: cover; }
}

@media screen and (max-width: 900px) {
    body.messenger-view .app-panel { background: var(--hero-main); border-radius: 0; grid-template-rows: calc(68px + env(safe-area-inset-top, 0px)) minmax(0, 1fr) calc(68px + env(safe-area-inset-bottom, 0px)); }
    body.messenger-view .app-header { min-height: calc(68px + env(safe-area-inset-top, 0px)); background: var(--hero-main); border-bottom: 0; }
    body.messenger-view .mobile-chat-title .messenger-brand-mark { display: none; }
    body.messenger-view .mobile-chat-title strong { font-size: 22px; font-weight: 600; letter-spacing: -.025em; }
    body.messenger-view .app-header:not(:has(.mobile-chat-title))::before { content: "Chats"; }
    body.messenger-view .conversation-pane { background: var(--hero-main); padding-top: 0; }
    body.messenger-view .conversation-directory-controls { gap: 8px; margin: 0 14px 10px; }
    body.messenger-view #conversation-search { min-height: 40px; padding-left: 40px; }
    body.messenger-view .compact-conversation-list .item-card { min-height: 72px; padding: 10px 14px !important; }
    body.messenger-view #conversations-list .conversation-row.selected { background: var(--hero-surface-active); }
    body.messenger-view .conversation-row-avatar,
    body.messenger-view .conversation-avatar-image { height: 44px; width: 44px; }
    body.messenger-view .app-tabs { background: var(--hero-main); grid-template-columns: repeat(4, minmax(0, 1fr)); }
    body.messenger-view .bottom-new-chat-button { display: none; }
    body.messenger-view .app-tab { font-weight: 400; }
    body.messenger-view .app-tab.active { background: transparent; text-shadow: none; }
    body.messenger-view .app-tab.active::after { display: none; }
    body.messenger-view .conversation-heading { border-bottom: 1px solid var(--hero-border); }
}

.contact-import-sentinel { height: 1px; }
