/* ==========================================================
   Matawow
   Profile Messages – Tablet Overrides
   Sprint 19

   Zweck:
   - iPad Pro
   - Nest Hub
   - zukünftige Tablet-Sonderfälle

   Die bestehenden Dateien bleiben unverändert.
========================================================== */


/* ==========================================================
   iPad Pro (Portrait)
   Wird im nächsten Patch mit derselben Layoutlogik
   wie iPad Air ausgestattet – nur größer.
========================================================== */

@media (min-width:981px)
       and (max-width:1100px)
       and (min-height:1000px)
       and (orientation:portrait){

}


/* ==========================================================
   Nest Hub
   Kompakte Desktopdarstellung
========================================================== */

/* ==========================================================
   Nest Hub 1024 × 600
   Kompakte zweispaltige Desktopansicht wie Nest Hub Max
========================================================== */

@media (min-width:981px)
       and (max-width:1100px)
       and (max-height:700px)
       and (orientation:landscape){

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

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

  html body #mwModal[data-section="requests"] .mw-msg-layout{
    display:grid !important;
    grid-template-columns:245px minmax(0,1fr) !important;
    gap:12px !important;
    height:calc(92vh - 126px) !important;
    min-height:0 !important;
    overflow:hidden !important;
  }

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

  html body #mwModal[data-section="requests"] .mw-msg-left .mw-list,
  html body #mwModal[data-section="requests"] #mwMsgThreadList{
    display:block !important;
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    max-height:100% !important;
    padding:8px !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
  }

  html body #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-row{
    display:block !important;
    flex:none !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    min-height:92px !important;
    height:auto !important;
    padding:11px 12px !important;
  }

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

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

  html body #mwModal[data-section="requests"] .mw-msg-a2-topline{
    grid-template-columns:92px minmax(180px,1fr) auto !important;
    gap:8px !important;
    align-items:center !important;
  }

  html body #mwModal[data-section="requests"] .mw-msg-a2-topline .mw-msg-flow{
    width:100% !important;
    min-width:180px !important;
    max-width:290px !important;
    justify-self:start !important;
  }

  html body #mwModal[data-section="requests"] .mw-msg-a2-topline .mw-msg-accept-head{
    justify-content:flex-end !important;
    flex-wrap:nowrap !important;
    gap:5px !important;
  }

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

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

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

  html body #mwModal[data-section="requests"] .mw-flow-actions{
    flex-wrap:nowrap !important;
    gap:6px !important;
  }
}

/* ==========================================================
   Kleine Laptops / schmale Desktopfenster
   1101–1279 px

   Ziel:
   - kompakte zweispaltige Desktopansicht
   - vertikale Threadliste links
   - vollständiger Chat rechts
   - kein Tablet-Hybridlayout
========================================================== */

@media (min-width:1101px) and (max-width:1279px){

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

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

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

    width:100% !important;
    height:calc(92vh - 136px) !important;
    min-height:0 !important;

    overflow:hidden !important;
  }

  /* Linke Conversation-Spalte wieder als echte Desktopliste */
  html body #mwModal[data-section="requests"] .mw-msg-left{
    width:260px !important;
    min-width:260px !important;
    max-width:260px !important;

    height:100% !important;
    min-height:0 !important;
    max-height:none !important;

    overflow:hidden !important;
  }

  html body #mwModal[data-section="requests"] .mw-msg-left .mw-list,
  html body #mwModal[data-section="requests"] #mwMsgThreadList{
    display:block !important;

    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    max-height:100% !important;

    padding:8px !important;

    overflow-x:hidden !important;
    overflow-y:auto !important;
  }

  html body #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-row{
    display:block !important;
    flex:none !important;

    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;

    min-height:92px !important;
    height:auto !important;

    padding:11px 12px !important;
    box-sizing:border-box !important;
  }

  html body #mwModal[data-section="requests"] #mwMsgThreadList .mw-thread-row-title{
    max-width:100% !important;
    font-size:13px !important;

    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }

  /* Rechter Chatbereich */
  html body #mwModal[data-section="requests"] #mwMsgDetail.mw-msg-right{
    width:auto !important;
    min-width:0 !important;

    height:100% !important;
    min-height:0 !important;
    max-height:none !important;

    margin:0 !important;
    overflow:hidden !important;
  }

  /* Kopfbereich wieder kompakt nebeneinander */
  html body #mwModal[data-section="requests"] .mw-msg-a2-topline{
    display:grid !important;
   grid-template-columns:minmax(165px, auto) minmax(180px, 1fr) auto !important;
    gap:8px !important;
    align-items:center !important;
  }

  html body #mwModal[data-section="requests"] .mw-msg-a2-topline .mw-header-status{
  width:max-content !important;
  max-width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
  justify-self:start !important;
}

  html body #mwModal[data-section="requests"] .mw-msg-a2-topline .mw-msg-flow{
    width:100% !important;
    min-width:0 !important;
    max-width:320px !important;

    justify-self:start !important;
  }

  html body #mwModal[data-section="requests"] .mw-msg-a2-topline .mw-msg-accept-head{
    justify-content:flex-end !important;
    flex-wrap:nowrap !important;
    gap:6px !important;
  }

  /* Chat darf den verfügbaren Raum wieder verwenden */
  html body #mwModal[data-section="requests"] .mw-msg-content{
    min-height:0 !important;
    height:auto !important;
    max-height:none !important;

    overflow-x:hidden !important;
    overflow-y:auto !important;
  }

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

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

  html body #mwModal[data-section="requests"] .mw-flow-actions{
    gap:6px !important;
    flex-wrap:nowrap !important;
  }
}
