/* =====================================================
   Sprint 19 – Profile Messages Responsive
   Nur kleine Displays / Mobile. Desktop bleibt eingefroren.
===================================================== */


/* Kleine Laptops / 15,6 Zoll / schmale Browserfenster */
@media (max-width:1400px){

#mwModal[data-section="requests"] .dialog-box{
  width:min(96vw, 1340px) !important;
  max-width:96vw !important;
  max-height:92vh !important;
}

#mwModal[data-section="requests"] .dialog-body{
  padding:18px 20px 16px !important;
}

#mwModal[data-section="requests"] .mw-msg-layout{
  grid-template-columns:285px minmax(0,1fr) !important;
  gap:16px !important;
}


  #mwModal[data-section="requests"] .mw-msg-left{
    min-width:0 !important;
  }

  #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-row{
    min-height:118px !important;
    padding:18px 18px !important;
  }

  #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-row-title{
    font-size:15px !important;
    max-width:170px !important;
  }

  #mwModal[data-section="requests"] #mwMsgDetail.mw-msg-right{
    min-width:0 !important;
  }

#mwModal[data-section="requests"] .mw-msg-content{
  min-height:370px !important;
}

#mwModal[data-section="requests"] .mw-msg-send{
  padding:12px 14px !important;
}

#mwModal[data-section="requests"] .mw-msg-send textarea{
  min-height:66px !important;
}
}


/* Sehr kleine Laptops / Tablets quer */
@media (max-width:1180px){

  #mwModal[data-section="requests"] .dialog-box{
    width:96vw !important;
    max-width:96vw !important;
  }

  #mwModal[data-section="requests"] .dialog-body{
    padding:18px !important;
  }

  #mwModal[data-section="requests"] #mwModalTabs{
    gap:10px !important;
    overflow-x:auto !important;
    scrollbar-width:none !important;
  }

  #mwModal[data-section="requests"] #mwModalTabs::-webkit-scrollbar{
    display:none !important;
  }

  #mwModal[data-section="requests"] .mw-msg-layout{
    grid-template-columns:260px minmax(0,1fr) !important;
    gap:14px !important;
  }

  #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-row{
    min-height:106px !important;
    padding:15px !important;
  }

  #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-avatar,
  #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-avatar img{
    width:48px !important;
    height:48px !important;
  }

  #mwModal[data-section="requests"] .mw-msg-a2-topline{
    grid-template-columns:105px minmax(240px,1fr) auto !important;
    gap:12px !important;
  }

  #mwModal[data-section="requests"] .mw-msg-a2-topline .mw-msg-flow{
    max-width:340px !important;
    min-width:240px !important;
  }

  #mwModal[data-section="requests"] .mw-msg-a2-topline .mw-msg-accept-head{
    gap:6px !important;
  }

  #mwModal[data-section="requests"] .mw-msg-a2-topline .mw-msg-accept-head .btn,
  #mwModal[data-section="requests"] .mw-msg-a2-topline .mw-msg-accept-head .mw-completion-head-btn,
  #mwModal[data-section="requests"] .mw-msg-a2-topline .mw-msg-accept-head .mw-contact-btn{
    height:26px !important;
    padding:0 9px !important;
    font-size:10px !important;
  }
}


/* Tablet / schmale Fenster: Liste oben, Chat darunter */
@media (max-width:1279px){

  #mwModal[data-section="requests"] .dialog-box{
    width:98vw !important;
    max-width:98vw !important;
    height:96vh !important;
    max-height:96vh !important;
  }

  #mwModal[data-section="requests"] .dialog-body{
    padding:14px !important;
    overflow:hidden !important;
  }

  #mwModal[data-section="requests"] .mw-msg-layout{
    grid-template-columns:1fr !important;
    gap:12px !important;
    height:calc(96vh - 150px) !important;
    min-height:0 !important;
  }

  #mwModal[data-section="requests"] .mw-msg-left{
    max-height:176px !important;
    min-height:0 !important;
  }

  #mwModal[data-section="requests"] .mw-msg-left .mw-list,
  #mwModal[data-section="requests"] #mwMsgThreadList{
    display:flex !important;
    gap:12px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    max-height:none !important;
    padding:10px 12px 14px !important;
  }

  #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-row{
    flex:0 0 230px !important;
    width:230px !important;
    min-height:108px !important;
    padding:14px !important;
  }

  #mwModal[data-section="requests"] #mwMsgDetail.mw-msg-right{
    min-height:0 !important;
    max-height:none !important;
    overflow:hidden !important;
  }

  #mwModal[data-section="requests"] .mw-msg-content{
    min-height:260px !important;
    max-height:32vh !important;
  }

  #mwModal[data-section="requests"] .mw-msg-a2-topline{
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  #mwModal[data-section="requests"] .mw-msg-a2-topline .mw-msg-flow{
    justify-self:stretch !important;
    max-width:none !important;
    min-width:0 !important;
  }

  #mwModal[data-section="requests"] .mw-msg-a2-topline .mw-msg-accept-head{
    justify-content:flex-start !important;
    flex-wrap:wrap !important;
  }

  #mwModal[data-section="requests"] .mw-msg-send{
    padding:12px !important;
  }

  #mwModal[data-section="requests"] .mw-msg-send textarea{
    min-height:62px !important;
  }

  #mwModal[data-section="requests"] #mwMsgThreadList{
    height:118px !important;
    padding:8px !important;
}

#mwModal[data-section="requests"] .mw-msg-content{
    max-height:38vh !important;
}

#mwModal[data-section="requests"] .mw-flow-actions{
    gap:10px;
    flex-wrap:wrap;
}
}




/* =====================================================
   Sprint 19 – Mobile Messages V4 Clean Integration
   Ein einziger Mobile-/Tablet-Block. Keine alten V2/V3 Overrides.
===================================================== */

.mw-chat-head-mobile{
  display:none;
}

@media (max-width:980px){

  html body #mwModal[data-section="requests"] .dialog-box{
    width:min(580px, calc(100vw - 32px)) !important;
    max-width:580px !important;
    height:min(850px, calc(100dvh - 32px)) !important;
    max-height:850px !important;
    border-radius:34px !important;
    overflow:hidden !important;
  }

  html body #mwModal[data-section="requests"] .dialog-body{
    height:calc(100% - 64px) !important;
    padding:0 !important;
    overflow:hidden !important;
  }

  html body #mwModal[data-section="requests"] #mwModalTabs{
    display:flex !important;
    justify-content:center !important;
    gap:8px !important;
    padding:10px 14px 8px !important;
    margin:0 !important;
    overflow-x:auto !important;
    scrollbar-width:none !important;
  }

  html body #mwModal[data-section="requests"] #mwModalTabs::-webkit-scrollbar{
    display:none !important;
  }

  html body #mwModal[data-section="requests"] #mwModalTabs .mw-tab{
    flex:0 0 auto !important;
    width:auto !important;
    height:35px !important;
    padding:0 15px !important;
    border-radius:999px !important;
    font-size:12px !important;
  }

  html body #mwModal[data-section="requests"] .mw-msg-layout{
    display:flex !important;
    flex-direction:column !important;
    height:100% !important;
    min-height:0 !important;
    gap:0 !important;
    overflow:hidden !important;
  }

  html body #mwModal[data-section="requests"] .mw-msg-left{
    flex:0 0 auto !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    height:auto !important;
    max-height:none !important;
    overflow:hidden !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
  }

  html body #mwModal[data-section="requests"] #mwMsgThreadList{
    display:flex !important;
    justify-content:center !important;
    gap:13px !important;
    width:100% !important;
    height:76px !important;
    max-height:76px !important;
    padding:8px 14px 12px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    scrollbar-width:none !important;
    border-bottom:1px solid rgba(148,163,255,.12) !important;
  }

  html body #mwModal[data-section="requests"] #mwMsgThreadList::-webkit-scrollbar{
    display:none !important;
  }

  html body #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-row{
    position:relative !important;
    flex:0 0 54px !important;
    width:54px !important;
    height:58px !important;
    min-height:58px !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html body #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-card-main{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:5px !important;
    width:100% !important;
  }

  html body #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-avatar,
  html body #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-avatar img,
  html body #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-avatar-fallback{
    width:46px !important;
    height:46px !important;
    min-width:46px !important;
    min-height:46px !important;
    border-radius:50% !important;
  }

  html body #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-row-title,
  html body #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-status-line,
  html body #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-row-meta,
  html body #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-preview,
  html body #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-status,
  html body #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-badge,
  html body #mwModal[data-section="requests"] #mwMsgThreadList small{
    display:none !important;
  }

  html body #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-mobile-name{
    display:block !important;
    max-width:54px !important;
    font-size:10.5px !important;
    font-weight:850 !important;
    line-height:1 !important;
    color:rgba(245,247,255,.86) !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }

  html body #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-row.is-active .mw-thread-avatar{
    box-shadow:
      0 0 0 3px #8b5cf6,
      0 0 28px rgba(139,92,246,.58),
      0 0 16px rgba(32,240,194,.18) !important;
  }

  html body #mwModal[data-section="requests"] #mwMsgDetail.mw-msg-right{
    flex:1 1 auto !important;
    min-height:0 !important;
    width:100% !important;
    max-width:100% !important;
    border-radius:24px !important;
    margin:10px !important;
    overflow:hidden !important;
    display:flex !important;
    flex-direction:column !important;
  }

  html body #mwModal[data-section="requests"] .mw-chat-head-desktop,
  html body #mwModal[data-section="requests"] .mw-msg-detail-title,
  html body #mwModal[data-section="requests"] .mw-msg-detail-meta{
    display:none !important;
  }

  html body #mwModal[data-section="requests"] .mw-chat-head-mobile{
    display:block !important;
  }

  html body #mwModal[data-section="requests"] .mw-msg-detail-head{
    flex:0 0 auto !important;
    padding:0 !important;
    max-height:none !important;
    overflow:visible !important;
  }

  html body #mwModal[data-section="requests"] .mw-mobile-v4-head{
    padding:15px 15px 13px !important;
    border-bottom:1px solid rgba(148,163,255,.12) !important;
    background:radial-gradient(circle at 20% 0%,rgba(139,92,246,.18),transparent 50%) !important;
  }

  html body #mwModal[data-section="requests"] .mw-mobile-v4-head .mw-chat-user-row{
    display:flex !important;
    align-items:center !important;
    gap:12px !important;
  }

  html body #mwModal[data-section="requests"] .mw-mobile-v4-head .mw-avatar.large{
    width:58px !important;
    height:58px !important;
    flex:0 0 58px !important;
    border-radius:50% !important;
    overflow:hidden !important;
  }

  html body #mwModal[data-section="requests"] .mw-mobile-v4-head .mw-avatar.large img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
  }

  html body #mwModal[data-section="requests"] .mw-mobile-v4-head .mw-user-name{
    font-size:21px !important;
    font-weight:950 !important;
    letter-spacing:-.035em !important;
    line-height:1.05 !important;
    color:#f5f7ff !important;
  }

  html body #mwModal[data-section="requests"] .mw-mobile-v4-head .mw-status-pill{
    display:inline-flex !important;
    align-items:center !important;
    gap:7px !important;
    margin-top:7px !important;
    padding:7px 11px !important;
    border-radius:999px !important;
    background:rgba(32,240,194,.13) !important;
    border:1px solid rgba(32,240,194,.28) !important;
    color:#dfffee !important;
    font-size:11px !important;
    font-weight:950 !important;
  }

  html body #mwModal[data-section="requests"] .mw-mobile-v4-head .mw-status-pill::before{
    content:"" !important;
    width:7px !important;
    height:7px !important;
    border-radius:50% !important;
    background:#20f0c2 !important;
    box-shadow:0 0 12px rgba(32,240,194,.78) !important;
  }

  html body #mwModal[data-section="requests"] .mw-mobile-v4-head .mw-task-summary{
    display:grid !important;
    gap:7px !important;
    margin-top:14px !important;
    padding:11px 12px !important;
    border-radius:18px !important;
    background:rgba(255,255,255,.04) !important;
    border:1px solid rgba(148,163,255,.12) !important;
  }

  html body #mwModal[data-section="requests"] .mw-mobile-v4-head .mw-task-row{
    display:grid !important;
    grid-template-columns:76px minmax(0,1fr) !important;
    align-items:center !important;
    gap:12px !important;
  }

  html body #mwModal[data-section="requests"] .mw-mobile-v4-head .mw-task-label{
    font-size:10px !important;
    letter-spacing:.1em !important;
    text-transform:uppercase !important;
    color:rgba(226,232,246,.42) !important;
    font-weight:950 !important;
  }

  html body #mwModal[data-section="requests"] .mw-mobile-v4-head .mw-task-summary strong{
    font-size:12px !important;
    color:#fff !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }

  html body #mwModal[data-section="requests"] .mw-mobile-v4-head .mw-flow{
    position:relative !important;
    display:grid !important;
    grid-template-columns:repeat(4,1fr) !important;
    list-style:none !important;
    margin:16px 0 6px !important;
    padding:0 !important;
  }

  html body #mwModal[data-section="requests"] .mw-mobile-v4-head .mw-flow::before{
    content:"" !important;
    position:absolute !important;
    left:12% !important;
    right:12% !important;
    top:8px !important;
    height:2px !important;
    background:linear-gradient(90deg,rgba(32,240,194,.72),rgba(139,92,246,.58)) !important;
  }

  html body #mwModal[data-section="requests"] .mw-mobile-v4-head .mw-flow li{
    position:relative !important;
    z-index:1 !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    gap:6px !important;
    font-size:9.5px !important;
    font-weight:950 !important;
    color:rgba(226,232,246,.48) !important;
  }

  html body #mwModal[data-section="requests"] .mw-mobile-v4-head .mw-flow span{
    width:17px !important;
    height:17px !important;
    border-radius:50% !important;
    background:#07101f !important;
    border:2px solid rgba(110,130,160,.72) !important;
  }

  html body #mwModal[data-section="requests"] .mw-mobile-v4-head .mw-flow .done,
  html body #mwModal[data-section="requests"] .mw-mobile-v4-head .mw-flow .active{
    color:#20f0c2 !important;
  }

  html body #mwModal[data-section="requests"] .mw-mobile-v4-head .mw-flow .done span,
  html body #mwModal[data-section="requests"] .mw-mobile-v4-head .mw-flow .active span{
    border-color:#20f0c2 !important;
    box-shadow:0 0 16px rgba(32,240,194,.45) !important;
  }

  html body #mwModal[data-section="requests"] .mw-mobile-v4-head .mw-flow .active span{
    background:#20f0c2 !important;
  }

  html body #mwModal[data-section="requests"] .mw-msg-content{
    flex:1 1 auto !important;
    min-height:0 !important;
    max-height:none !important;
    overflow-y:auto !important;
    padding:14px 13px !important;
  }

  html body #mwModal[data-section="requests"] .mw-msg-send{
    flex:0 0 auto !important;
    padding:10px !important;
    border-top:1px solid rgba(148,163,255,.12) !important;
  }
}

@media (max-width:430px){

  html body #mwModal[data-section="requests"] .dialog-box{
    width:100vw !important;
    max-width:100vw !important;
    height:100dvh !important;
    max-height:100dvh !important;
    border-radius:0 !important;
  }

  html body #mwModal[data-section="requests"] #mwMsgDetail.mw-msg-right{
    margin:8px !important;
    border-radius:22px !important;
  }

  html body #mwModal[data-section="requests"] #mwModalTabs{
    gap:7px !important;
    padding-left:10px !important;
    padding-right:10px !important;
  }

  html body #mwModal[data-section="requests"] #mwModalTabs .mw-tab{
    padding-left:13px !important;
    padding-right:13px !important;
  }
}
/* =====================================================
   Sprint 19 – Mobile Messages V4 Avatar Strip Lock
   Verhindert Umbruch der Conversation-Liste.
===================================================== */

@media (max-width:980px){

  html body #mwModal[data-section="requests"] #mwMsgThreadList{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:flex-start !important;
    justify-content:center !important;
    gap:13px !important;
    height:76px !important;
    min-height:76px !important;
    max-height:76px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
  }

  html body #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-row{
    flex:0 0 54px !important;
    width:54px !important;
    min-width:54px !important;
    max-width:54px !important;
    height:58px !important;
    min-height:58px !important;
    max-height:58px !important;
    display:flex !important;
    align-items:flex-start !important;
    justify-content:center !important;
    overflow:visible !important;
  }

  html body #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-card-main{
    flex:0 0 54px !important;
    width:54px !important;
    min-width:54px !important;
    max-width:54px !important;
    height:58px !important;
    min-height:58px !important;
    max-height:58px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:5px !important;
    overflow:visible !important;
  }

  html body #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-copy{
    width:54px !important;
    min-width:54px !important;
    max-width:54px !important;
    display:block !important;
    overflow:hidden !important;
  }

  html body #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-headline{
    display:block !important;
    width:54px !important;
    min-width:54px !important;
    max-width:54px !important;
    overflow:hidden !important;
  }
}

@media (max-width:430px){

  html body #mwModal[data-section="requests"] #mwMsgThreadList{
    justify-content:flex-start !important;
    padding-left:14px !important;
    padding-right:14px !important;
  }

  html body #mwModal[data-section="requests"] #mwMsgThreadList:has(.mw-thread-row:nth-child(-n+5):last-child){
    justify-content:center !important;
  }
}

