/* =========================================================
   ZEUS V212 · HANDELSCHAT MOBILE PRO
   ========================================================= */

@media (max-width:760px){

  /* Seite hinter geöffnetem Chat nicht scrollen */
  body:has(#v67-chat-drawer.open){
    overflow:hidden!important;
    overscroll-behavior:none;
  }

  /* Chat auf dem Handy als Vollbild */
  #v67-chat-drawer.open{
    position:fixed!important;
    inset:0!important;
    top:0!important;
    right:0!important;
    bottom:0!important;
    left:0!important;

    width:100vw!important;
    max-width:none!important;

    height:100vh!important;
    height:100dvh!important;
    max-height:none!important;

    margin:0!important;
    border-radius:0!important;

    z-index:99999!important;

    display:flex!important;
    flex-direction:column!important;

    overflow:hidden!important;

    padding-top:env(safe-area-inset-top);
    padding-bottom:env(safe-area-inset-bottom);
  }


  /* Grundbereiche dürfen auf Mobile korrekt schrumpfen */
  #v67-chat-drawer .v67-chat-body,
  #v67-chat-drawer #v682-public-chat{
    min-width:0!important;
    min-height:0!important;
    width:100%!important;
    flex:1 1 auto!important;
  }


  /* =====================================================
     GESPRÄCHSLISTE
     ===================================================== */

  #v67-chat-list{
    width:100%!important;
    min-height:0!important;

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

    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;

    padding:8px 10px 18px!important;
  }

  #v67-chat-list .v67-chat-thread{
    width:100%!important;

    display:grid!important;
    grid-template-columns:46px minmax(0,1fr) auto!important;
    align-items:center!important;

    gap:10px!important;

    min-height:68px!important;
    margin:0 0 7px!important;
    padding:10px!important;

    border-radius:12px!important;

    touch-action:manipulation;
  }

  #v67-chat-list .v67-chat-avatar{
    width:44px!important;
    height:44px!important;
    min-width:44px!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    border-radius:50%!important;

    font-size:15px!important;
  }

  #v67-chat-list .v67-chat-thread-copy{
    display:block!important;
    min-width:0!important;
    text-align:left!important;
  }

  #v67-chat-list .v67-chat-thread-copy strong{
    display:block!important;

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

    font-size:14px!important;
    line-height:1.25!important;
  }

  #v67-chat-list .v67-chat-thread-copy > span{
    display:block!important;

    margin-top:4px!important;

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

    font-size:12px!important;
    opacity:.68;
  }

  #v67-chat-list .v67-chat-thread-meta{
    min-width:42px!important;

    display:flex!important;
    flex-direction:column!important;
    align-items:flex-end!important;

    gap:5px!important;
  }

  #v67-chat-list .v67-chat-thread-meta small{
    white-space:nowrap!important;
    font-size:10px!important;
  }

  #v67-chat-list .v67-chat-unread{
    min-width:21px!important;
    height:21px!important;

    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;

    padding:0 6px!important;

    border-radius:999px!important;
    font-size:10px!important;
  }


  /* =====================================================
     NACHRICHTEN
     ===================================================== */

  #v67-chat-messages,
  #v682-public-messages{
    flex:1 1 auto!important;

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

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

    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;

    padding:12px 10px 20px!important;

    scroll-behavior:smooth;
  }

  #v67-chat-messages .v67-message{
    width:max-content!important;
    max-width:86%!important;

    margin:5px auto 5px 0!important;
    padding:9px 11px!important;

    border-radius:13px!important;
  }

  #v67-chat-messages .v67-message.mine{
    margin-left:auto!important;
    margin-right:0!important;

    border-bottom-right-radius:4px!important;
  }

  #v67-chat-messages .v67-message:not(.mine){
    border-bottom-left-radius:4px!important;
  }

  #v67-chat-messages .v67-message-head{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;

    gap:12px!important;

    margin-bottom:4px!important;
  }

  #v67-chat-messages .v67-message-head strong{
    font-size:11px!important;
  }

  #v67-chat-messages .v67-message-head time{
    font-size:9px!important;
    white-space:nowrap!important;
    opacity:.55;
  }

  #v67-chat-messages .v67-message p{
    margin:0!important;

    font-size:14px!important;
    line-height:1.42!important;

    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }


  /* =====================================================
     EINGABE UNTEN
     ===================================================== */

  #v67-chat-drawer form{
    position:relative!important;
    bottom:auto!important;

    width:100%!important;
    flex:0 0 auto!important;

    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;

    gap:7px!important;

    margin:0!important;

    padding:
      8px
      max(9px,env(safe-area-inset-right))
      max(9px,env(safe-area-inset-bottom))
      max(9px,env(safe-area-inset-left))!important;

    border-radius:0!important;
  }

  /* 16px verhindert automatisches iPhone-Zoomen */
  #v67-chat-drawer form input,
  #v67-chat-drawer form textarea{
    width:100%!important;

    min-width:0!important;
    min-height:46px!important;

    margin:0!important;
    padding:10px 12px!important;

    border-radius:12px!important;

    font-size:16px!important;
    line-height:1.3!important;
  }

  #v67-chat-drawer form textarea{
    max-height:120px!important;
    resize:none!important;
  }

  #v67-chat-drawer form button{
    min-width:48px!important;
    min-height:46px!important;

    padding:8px 12px!important;

    border-radius:12px!important;

    touch-action:manipulation;
  }


  /* =====================================================
     ALLE CHAT-BUTTONS HANDYTAUGLICH
     ===================================================== */

  #v67-chat-drawer button{
    min-height:42px;
    touch-action:manipulation;
  }

  #v67-chat-drawer button:active{
    transform:scale(.97);
  }


  /* Leerer Zustand */
  #v67-chat-drawer .v67-chat-empty{
    margin:15px 10px!important;
    padding:18px 14px!important;

    text-align:center!important;
    border-radius:12px!important;

    font-size:13px!important;
    line-height:1.5!important;
  }

  #v67-chat-drawer .v67-chat-empty strong{
    display:block!important;
    margin-bottom:6px!important;

    font-size:14px!important;
  }


  /* =====================================================
     CHAT-LAUNCHER AUF HANDY
     ===================================================== */

  body:has(#v67-chat-drawer.open)
  [class*="v67"][class*="launcher"]{
    display:none!important;
  }

}


/* Sehr kleine Geräte */
@media (max-width:390px){

  #v67-chat-list{
    padding-left:7px!important;
    padding-right:7px!important;
  }

  #v67-chat-list .v67-chat-thread{
    grid-template-columns:40px minmax(0,1fr) auto!important;
    padding:8px!important;
  }

  #v67-chat-list .v67-chat-avatar{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
  }

  #v67-chat-messages .v67-message{
    max-width:90%!important;
  }

}
