/* 0.52.8-alpha — Inbox mobile responsive repair. Desktop permanece intacto. */
@media (max-width: 860px){
  html,body{overflow-x:hidden!important;}
  .vchat-frontend-app,
  .vchat-frontend-app *{box-sizing:border-box!important;}
  .vchat-frontend-app{width:100%!important;max-width:100vw!important;overflow-x:hidden!important;}
  .vchat-frontend-app .vchat-app-main,
  .vchat-frontend-app .vchat-app-section.vchat-inbox-section,
  .vchat-frontend-app .vchat-inbox-shell,
  .vchat-frontend-app .vchat-chat-panel{width:100%!important;max-width:100vw!important;min-width:0!important;overflow-x:hidden!important;}
  .vchat-frontend-app .vchat-chat-panel{
    grid-template-rows:auto auto auto minmax(0,1fr) auto!important;
    background:#fbfaff!important;
  }

  /* Header conversación: evita que avatar, nombre y acciones se empujen/encimen */
  .vchat-frontend-app .vchat-chat-head{
    display:grid!important;
    grid-template-columns:52px minmax(0,1fr)!important;
    grid-template-areas:"back person" "actions actions"!important;
    gap:12px 12px!important;
    align-items:center!important;
    min-height:auto!important;
    height:auto!important;
    padding:16px 16px 14px!important;
    border-bottom:1px solid rgba(95,76,180,.13)!important;
    background:#fff!important;
    overflow:visible!important;
  }
  .vchat-frontend-app .vchat-open-conversations{
    grid-area:back!important;
    width:46px!important;
    min-width:46px!important;
    height:46px!important;
    padding:0!important;
    border-radius:16px!important;
    display:grid!important;
    place-items:center!important;
    border:1px solid rgba(103,82,199,.18)!important;
    background:#fff!important;
    box-shadow:0 7px 20px rgba(39,30,84,.04)!important;
  }
  .vchat-frontend-app .vchat-open-conversations span{font-size:24px!important;line-height:1!important;}
  .vchat-frontend-app .vchat-open-conversations b{display:none!important;}
  .vchat-frontend-app .vchat-chat-person{
    grid-area:person!important;
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    min-width:0!important;
    overflow:hidden!important;
  }
  .vchat-frontend-app .vchat-chat-person .vchat-avatar{
    display:grid!important;
    width:44px!important;
    height:44px!important;
    flex:0 0 44px!important;
    border-radius:15px!important;
    font-size:13px!important;
  }
  .vchat-frontend-app .vchat-chat-person strong{
    font-size:20px!important;
    line-height:1.05!important;
    letter-spacing:-.03em!important;
    max-width:100%!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .vchat-frontend-app .vchat-chat-person-meta{
    display:flex!important;
    align-items:center!important;
    gap:6px!important;
    margin-top:6px!important;
    max-width:100%!important;
    overflow:hidden!important;
  }
  .vchat-frontend-app .vchat-channel-pill{height:26px!important;padding:3px 8px 3px 3px!important;}
  .vchat-frontend-app .vchat-channel-pill i{min-width:24px!important;height:20px!important;font-size:8px!important;}
  .vchat-frontend-app .vchat-channel-pill b{font-size:10px!important;display:inline!important;}
  .vchat-frontend-app #vchat-active-presence{font-size:12px!important;max-width:98px!important;}
  .vchat-frontend-app .vchat-live-indicator{display:none!important;}

  .vchat-frontend-app .vchat-chat-actions-0518{
    grid-area:actions!important;
    width:100%!important;
    max-width:100%!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:8px!important;
    padding:2px 0 4px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .vchat-frontend-app .vchat-chat-actions-0518::-webkit-scrollbar{display:none!important;}
  .vchat-frontend-app .vchat-chat-actions-0518 button{
    flex:0 0 auto!important;
    height:42px!important;
    min-height:42px!important;
    width:auto!important;
    min-width:auto!important;
    max-width:none!important;
    padding:0 14px!important;
    border-radius:16px!important;
    font-size:13px!important;
    font-weight:820!important;
    line-height:1!important;
    white-space:nowrap!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
  }
  .vchat-frontend-app #vchat-open-contact{
    width:42px!important;
    min-width:42px!important;
    padding:0!important;
    font-size:0!important;
    color:#6552c7!important;
  }
  .vchat-frontend-app #vchat-open-contact span{font-size:0!important;display:grid!important;place-items:center!important;}
  .vchat-frontend-app #vchat-open-contact span::before{
    content:'i'!important;
    display:grid!important;
    place-items:center!important;
    width:22px!important;
    height:22px!important;
    border:2px solid currentColor!important;
    border-radius:50%!important;
    font-size:16px!important;
    font-weight:900!important;
    line-height:1!important;
    font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  }
  .vchat-frontend-app #vchat-claim{
    flex:1 0 auto!important;
    min-width:176px!important;
    max-width:220px!important;
    background:#6552c7!important;
    color:#fff!important;
    border-color:#6552c7!important;
  }
  .vchat-frontend-app #vchat-resolve{min-width:78px!important;}
  .vchat-frontend-app #vchat-more{min-width:58px!important;}

  /* Barra responder / nota + acciones: dos niveles claros y scrolleables */
  .vchat-frontend-app .vchat-chat-toolbar-0518{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    align-items:stretch!important;
    padding:10px 16px!important;
    min-height:auto!important;
    height:auto!important;
    overflow:hidden!important;
    border-bottom:1px solid rgba(95,76,180,.12)!important;
    background:#fff!important;
  }
  .vchat-frontend-app .vchat-reply-mode{
    width:100%!important;
    max-width:100%!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:0!important;
    padding:4px!important;
    border-radius:22px!important;
    background:#eeeaf7!important;
    min-width:0!important;
  }
  .vchat-frontend-app .vchat-reply-mode button{
    height:44px!important;
    min-height:44px!important;
    font-size:14px!important;
    font-weight:850!important;
    border-radius:18px!important;
    padding:0 10px!important;
    white-space:nowrap!important;
  }
  .vchat-frontend-app .vchat-chat-quick-actions-0518{
    width:100%!important;
    max-width:100%!important;
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    padding:0 0 4px!important;
    scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .vchat-frontend-app .vchat-chat-quick-actions-0518::-webkit-scrollbar{display:none!important;}
  .vchat-frontend-app .vchat-chat-quick-actions-0518 button{
    flex:0 0 auto!important;
    width:auto!important;
    min-width:auto!important;
    max-width:none!important;
    height:38px!important;
    min-height:38px!important;
    padding:0 12px!important;
    border-radius:15px!important;
    font-size:12px!important;
    line-height:1!important;
    white-space:nowrap!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
  }
  .vchat-frontend-app #vchat-pipeline-from-chat{
    min-width:168px!important;
    max-width:220px!important;
    justify-content:flex-start!important;
  }
  .vchat-frontend-app #vchat-pipeline-from-chat span{
    display:inline!important;
    font-size:9px!important;
    letter-spacing:.22em!important;
    text-transform:uppercase!important;
    color:#8a7ca6!important;
  }
  .vchat-frontend-app #vchat-pipeline-from-chat b{
    display:inline-block!important;
    max-width:104px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:12px!important;
  }
  .vchat-frontend-app #vchat-task-from-chat span,
  .vchat-frontend-app #vchat-booking-from-chat span,
  .vchat-frontend-app #vchat-summary span{display:inline!important;font-size:12px!important;}

  /* SLA: chips horizontales, compactos, sin romper la pantalla */
  .vchat-frontend-app .vchat-sla-bar{
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    width:100%!important;
    max-width:100vw!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    padding:8px 16px!important;
    scrollbar-width:none!important;
    white-space:nowrap!important;
    background:#fff!important;
    border-bottom:1px solid rgba(95,76,180,.12)!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .vchat-frontend-app .vchat-sla-bar::-webkit-scrollbar{display:none!important;}
  .vchat-frontend-app .vchat-sla-item{
    flex:0 0 auto!important;
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    width:auto!important;
    min-width:auto!important;
    max-width:none!important;
    min-height:36px!important;
    height:36px!important;
    padding:6px 10px!important;
    border-radius:999px!important;
    grid-template-columns:none!important;
  }
  .vchat-frontend-app .vchat-sla-item>span{
    display:grid!important;
    place-items:center!important;
    width:24px!important;
    min-width:24px!important;
    height:24px!important;
    flex:0 0 24px!important;
    font-size:13px!important;
  }
  .vchat-frontend-app .vchat-sla-item div{display:flex!important;align-items:baseline!important;gap:5px!important;min-width:0!important;}
  .vchat-frontend-app .vchat-sla-item small{font-size:10px!important;line-height:1!important;white-space:nowrap!important;}
  .vchat-frontend-app .vchat-sla-item strong{font-size:12px!important;line-height:1!important;white-space:nowrap!important;}

  /* Timeline y burbujas: lectura móvil sin overflow ni tipografía gigante */
  .vchat-frontend-app .vchat-chat-timeline{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:18px 14px 20px!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    background-size:36px 36px!important;
  }
  .vchat-frontend-app .vchat-message{
    max-width:88%!important;
    min-width:0!important;
    margin:10px 0!important;
  }
  .vchat-frontend-app .vchat-message.outgoing{margin-left:auto!important;}
  .vchat-frontend-app .vchat-message>div:first-child,
  .vchat-frontend-app .vchat-message>div{
    max-width:100%!important;
    padding:12px 14px!important;
    border-radius:18px!important;
    font-size:14px!important;
    line-height:1.43!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }
  .vchat-frontend-app .vchat-message-meta,
  .vchat-frontend-app .vchat-message time{font-size:10px!important;}

  /* Composer: conserva Adjuntar visible, acciones con scroll, input sin cortarse */
  .vchat-frontend-app .vchat-composer-wrap{
    width:100%!important;
    max-width:100%!important;
    padding:9px 12px calc(12px + env(safe-area-inset-bottom))!important;
    background:#fff!important;
    border-top:1px solid rgba(95,76,180,.13)!important;
    overflow:visible!important;
  }
  .vchat-frontend-app .vchat-composer-tools{
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    padding:0 4px 8px!important;
    margin:0!important;
    scrollbar-width:none!important;
    white-space:nowrap!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .vchat-frontend-app .vchat-composer-tools::-webkit-scrollbar{display:none!important;}
  .vchat-frontend-app .vchat-composer-tools button{
    flex:0 0 auto!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
    height:34px!important;
    min-height:34px!important;
    width:auto!important;
    min-width:auto!important;
    padding:0 8px!important;
    border-radius:14px!important;
    font-size:13px!important;
    font-weight:760!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  .vchat-frontend-app .vchat-composer-tools>span:empty{display:none!important;}
  .vchat-frontend-app #vchat-attach{
    font-size:13px!important;
    width:auto!important;
    min-width:88px!important;
    padding:0 8px!important;
  }
  .vchat-frontend-app #vchat-attach::before{content:'+'!important;font-size:18px!important;margin-right:3px!important;}
  .vchat-frontend-app #vchat-attach::after{display:none!important;content:''!important;}
  .vchat-frontend-app #vchat-emoji{
    width:42px!important;
    min-width:42px!important;
    height:42px!important;
    padding:0!important;
    border-radius:50%!important;
    font-size:0!important;
    background:#f3effb!important;
  }
  .vchat-frontend-app #vchat-emoji::before{content:'☺'!important;font-size:19px!important;line-height:1!important;}
  .vchat-frontend-app #vchat-schedule-message{
    width:auto!important;
    min-width:118px!important;
    height:34px!important;
    padding:0 8px!important;
    font-size:13px!important;
    background:transparent!important;
  }
  .vchat-frontend-app #vchat-schedule-message::before{content:'◷'!important;font-size:14px!important;width:auto!important;height:auto!important;background:transparent!important;margin-right:5px!important;}
  .vchat-frontend-app #vchat-schedule-message::after{display:none!important;content:''!important;}
  .vchat-frontend-app #vchat-saved-reply{font-size:12px!important;max-width:146px!important;overflow:hidden!important;text-overflow:ellipsis!important;}
  .vchat-frontend-app .vchat-composer{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 58px!important;
    gap:10px!important;
    min-height:72px!important;
    padding:9px!important;
    border-radius:22px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  .vchat-frontend-app .vchat-composer textarea{
    min-width:0!important;
    width:100%!important;
    min-height:52px!important;
    padding:13px 12px!important;
    font-size:16px!important;
    line-height:1.35!important;
  }
  .vchat-frontend-app #vchat-send-message{
    width:58px!important;
    min-width:58px!important;
    height:58px!important;
    padding:0!important;
    border-radius:18px!important;
  }
  .vchat-frontend-app .vchat-send-label{display:none!important;}
  .vchat-frontend-app .vchat-send-icon{display:inline!important;font-size:20px!important;}
  .vchat-frontend-app #vchat-composer-hint{display:none!important;}

  .vchat-frontend-app .vchat-emoji-picker{
    position:fixed!important;
    z-index:1000005!important;
    left:10px!important;
    right:10px!important;
    bottom:calc(102px + env(safe-area-inset-bottom))!important;
    width:auto!important;
    max-width:none!important;
    max-height:min(54dvh,390px)!important;
    border-radius:22px!important;
    overflow:hidden!important;
    box-shadow:0 22px 80px rgba(35,27,78,.28)!important;
  }
}

@media (max-width: 460px){
  .vchat-frontend-app .vchat-chat-head{padding:14px 14px 12px!important;gap:10px!important;grid-template-columns:48px minmax(0,1fr)!important;}
  .vchat-frontend-app .vchat-open-conversations{width:44px!important;min-width:44px!important;height:44px!important;}
  .vchat-frontend-app .vchat-chat-person strong{font-size:19px!important;}
  .vchat-frontend-app .vchat-chat-actions-0518 button{height:40px!important;padding:0 12px!important;font-size:12px!important;}
  .vchat-frontend-app #vchat-open-contact{width:40px!important;min-width:40px!important;}
  .vchat-frontend-app #vchat-claim{min-width:166px!important;}
  .vchat-frontend-app .vchat-chat-toolbar-0518{padding:10px 14px!important;}
  .vchat-frontend-app .vchat-reply-mode button{height:42px!important;font-size:14px!important;}
  .vchat-frontend-app .vchat-chat-quick-actions-0518 button{height:36px!important;font-size:11px!important;}
  .vchat-frontend-app #vchat-pipeline-from-chat{min-width:156px!important;}
  .vchat-frontend-app .vchat-sla-bar{padding:8px 14px!important;}
  .vchat-frontend-app .vchat-sla-item{height:34px!important;padding:5px 9px!important;}
  .vchat-frontend-app .vchat-sla-item small{font-size:9px!important;}
  .vchat-frontend-app .vchat-sla-item strong{font-size:11px!important;}
  .vchat-frontend-app .vchat-chat-timeline{padding:16px 12px 18px!important;}
  .vchat-frontend-app .vchat-message{max-width:89%!important;}
  .vchat-frontend-app .vchat-message>div:first-child,
  .vchat-frontend-app .vchat-message>div{font-size:13px!important;padding:11px 13px!important;}
  .vchat-frontend-app .vchat-composer-wrap{padding:8px 10px calc(10px + env(safe-area-inset-bottom))!important;}
  .vchat-frontend-app .vchat-composer-tools{gap:8px!important;padding-left:2px!important;}
  .vchat-frontend-app #vchat-attach{min-width:86px!important;font-size:13px!important;}
  .vchat-frontend-app #vchat-schedule-message{min-width:112px!important;font-size:13px!important;}
  .vchat-frontend-app .vchat-composer{grid-template-columns:minmax(0,1fr) 54px!important;border-radius:21px!important;}
  .vchat-frontend-app #vchat-send-message{width:54px!important;min-width:54px!important;height:54px!important;}
}