/* MSG1E mobile Messenger redesign: the conversation owns the phone viewport. Desktop layout is preserved. */
.message-mobile-nav-back,.message-mobile-actions-trigger{display:none}
.message-thread-tabs{flex:0 0 auto;min-height:44px;overflow-x:auto;overflow-y:visible;scrollbar-width:none}
.message-thread-tabs::-webkit-scrollbar{display:none}
.message-thread-tabs .ghost-btn{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;white-space:nowrap;position:relative;z-index:1}
.message-thread-tabs .ghost-btn.active{z-index:2}

@media(max-width:760px){
  #messageCenterModal{padding:0!important}
  #messageCenterModal .message-center-modal{display:flex!important;flex-direction:column!important;width:100vw!important;max-width:none!important;height:100dvh!important;min-height:100dvh!important;max-height:100dvh!important;overflow:hidden!important;border-radius:0!important;padding:6px 8px calc(var(--mobile-dock-height,72px) + env(safe-area-inset-bottom) + 6px)!important}
  #messageCenterModal .message-center-modal>.eyebrow,#messageCenterModal .message-center-modal>h2{display:none!important}
  #messageCenterModal .message-center-modal>.modal-close{position:absolute!important;top:6px!important;right:7px!important;width:38px!important;height:38px!important;min-height:38px!important;margin:0!important;z-index:10}
  #messageCenterModal .message-center-modal.message-center-mobile-conversation-open>.modal-close{display:none!important}
  #messageCenterModal #messageCenterContent{display:flex;flex:1 1 auto;min-height:0;overflow:hidden;padding-top:0}
  #messageCenterModal .message-center-shell{display:flex;flex:1 1 auto;flex-direction:column;gap:6px;min-height:0;width:100%}
  #messageCenterModal .message-mobile-filter-trigger{flex:0 0 auto;min-height:42px;margin-right:46px}
  #messageCenterModal .message-center-shell.has-selection>.message-mobile-filter-trigger{display:none!important}
  #messageCenterModal .message-center-layout{display:block!important;flex:1 1 auto;height:auto!important;min-height:0!important;max-height:none!important;overflow:hidden;border-radius:12px}
  #messageCenterModal .message-center-shell.has-selection .message-center-layout{height:100%!important}
  #messageCenterModal .conversation-list{height:100%;max-height:none!important;overflow-y:auto;border-radius:12px}
  #messageCenterModal .conversation-pane{display:flex!important;height:100%!important;min-height:0!important;max-height:none!important;overflow:hidden;border-radius:12px}
  #messageCenterModal .message-center-shell:not(.has-selection) .conversation-pane{display:none!important}
  #messageCenterModal .message-center-shell.has-selection .conversation-list{display:none!important}

  #messageCenterModal .conversation-header{display:grid!important;grid-template-columns:38px minmax(0,1fr) 40px;align-items:center;gap:6px;flex:0 0 auto;padding:6px 7px!important;min-height:52px;position:relative!important;top:auto!important;z-index:4}
  #messageCenterModal .message-mobile-nav-back,#messageCenterModal .message-mobile-actions-trigger{display:inline-grid!important;place-items:center;width:38px;height:38px;min-height:38px;padding:0!important;border-radius:11px;font-size:1rem}
  #messageCenterModal .message-mobile-actions-trigger{width:40px;font-weight:950;letter-spacing:.08em}
  #messageCenterModal .message-desktop-actions{display:none!important}
  #messageCenterModal .conversation-title-block{gap:7px!important;min-width:0}
  #messageCenterModal .conversation-title-block .message-avatar{width:32px!important;height:32px!important;flex:0 0 32px!important}
  #messageCenterModal .conversation-title-block>div{gap:0!important;min-width:0}
  #messageCenterModal .conversation-title-block strong{font-size:.84rem!important;line-height:1.1}
  #messageCenterModal .conversation-title-block span,#messageCenterModal .conversation-title-block small{display:block;max-width:none!important;font-size:.62rem!important;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

  #messageCenterModal .message-thread-tabs{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:5px 7px!important;min-height:40px;overflow:visible!important;background:var(--panel-2)}
  #messageCenterModal .message-thread-tabs .ghost-btn{width:100%;min-width:0;min-height:30px!important;padding:.3rem .35rem!important;font-size:.68rem!important;border-radius:9px}

  #messageCenterModal .message-thread{flex:1 1 auto!important;min-height:0!important;max-height:none!important;overflow-y:auto!important;padding:8px!important;gap:9px!important;overscroll-behavior:contain}
  #messageCenterModal .message-line{max-width:96%!important}
  #messageCenterModal .message-bubble{padding:8px 10px}

  #messageCenterModal .message-reply-form{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;align-items:end;gap:6px;flex:0 0 auto;position:relative!important;bottom:auto!important;padding:7px!important;padding-bottom:calc(7px + env(safe-area-inset-bottom))!important;background:var(--panel);z-index:5}
  #messageCenterModal .message-reply-form textarea{min-height:44px!important;max-height:96px!important;resize:none;padding:.65rem .7rem}
  #messageCenterModal .message-reply-form .primary-btn{min-width:68px;min-height:44px!important;padding:.55rem .7rem;white-space:nowrap}

  #messageCenterModal .offer-record-card{margin:8px;padding:10px;gap:5px;border-radius:12px}
  #messageCenterModal .offer-record-card>strong{font-size:1.25rem}
  #messageCenterModal .offer-response-actions{padding:0 8px 8px;gap:6px}
  #messageCenterModal .offer-response-actions .ghost-btn,#messageCenterModal .offer-response-actions .primary-btn{min-height:36px;padding:.45rem .6rem;font-size:.7rem}
}
