/* Digitiendita v1.0.26.4 — Chat Adaptativo */
:root{
  --dt-chat-gap:14px;
  --dt-chat-head:64px;
  --dt-chat-compose:76px;
}

/* Conversación: más espacio útil y scroll solamente dentro del hilo */
.pro-chat-main,
.messenger-chat{
  position:relative;
  min-width:0;
  overflow:hidden;
}

.pro-chat-main{
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
}

.pro-chat-messages,
.messenger-messages{
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior-y:contain;
  scroll-behavior:smooth;
  scrollbar-width:thin;
  scrollbar-color:#343b48 transparent;
}

.pro-chat-messages::-webkit-scrollbar,
.messenger-messages::-webkit-scrollbar{width:6px}
.pro-chat-messages::-webkit-scrollbar-thumb,
.messenger-messages::-webkit-scrollbar-thumb{
  background:#343b48;
  border-radius:999px;
}

.pro-chat-compose,
.messenger-compose-wrap{
  z-index:5;
  background:rgba(7,10,17,.96)!important;
  backdrop-filter:blur(14px);
  border-top:1px solid rgba(114,130,160,.20)!important;
}

.pro-chat-compose{
  position:sticky!important;
  bottom:0!important;
  padding-bottom:max(12px,env(safe-area-inset-bottom))!important;
}

.messenger-compose-wrap{
  position:sticky!important;
  bottom:0!important;
  padding-bottom:max(10px,env(safe-area-inset-bottom))!important;
}

/* Encabezado más compacto */
.pro-chat-head,
.messenger-chat-head{
  position:sticky!important;
  top:0!important;
  z-index:6;
  min-height:58px!important;
  padding:10px 14px!important;
  backdrop-filter:blur(14px);
}

.dt-chat-live-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  flex:0 0 auto;
  padding:6px 9px;
  border:1px solid rgba(42,215,151,.22);
  border-radius:999px;
  background:rgba(6,41,31,.68);
  color:#83e9c0;
  font-size:11px;
  font-weight:850;
  white-space:nowrap;
}
.dt-chat-live-badge::before{
  content:"";
  width:7px;height:7px;border-radius:50%;
  background:#2ad797;
  box-shadow:0 0 0 4px rgba(42,215,151,.10);
}
.dt-chat-live-badge.is-offline{
  color:#ffb4bf;
  border-color:rgba(255,76,102,.28);
  background:rgba(64,13,24,.68);
}
.dt-chat-live-badge.is-offline::before{
  background:#ff4b68;
  box-shadow:0 0 0 4px rgba(255,75,104,.10);
}
.dt-chat-live-badge.is-paused{
  color:#f2cb7b;
  border-color:rgba(218,172,69,.25);
  background:rgba(55,39,8,.68);
}
.dt-chat-live-badge.is-paused::before{
  background:#d8a83e;
  box-shadow:none;
}

/* Mensajes */
.pro-chat-messages,
.messenger-messages{
  padding:18px!important;
}

.chat-bubble-row,
.messenger-message-row{
  scroll-margin-block:18px;
}

.chat-bubble,
.messenger-bubble{
  max-width:min(78%,760px)!important;
  border-radius:18px!important;
  line-height:1.5!important;
}

/* Botón de mensajes nuevos: no arrastra al usuario si está leyendo arriba */
.dt-new-message-jump,
.chat-new-pill{
  position:absolute!important;
  right:18px!important;
  bottom:calc(var(--dt-chat-compose) + 12px)!important;
  z-index:12!important;
  min-height:36px!important;
  width:auto!important;
  padding:0 13px!important;
  border:1px solid rgba(255,66,99,.42)!important;
  border-radius:999px!important;
  background:#e11d48!important;
  color:#fff!important;
  font:800 12px/1 Inter,system-ui,sans-serif!important;
  box-shadow:0 12px 30px rgba(0,0,0,.36)!important;
  cursor:pointer!important;
}

/* Desktop / laptop */
@media (min-width: 1181px){
  body.dt-customer-chat-active .support-hero{
    margin-bottom:12px!important;
  }
  body.dt-customer-chat-active .pro-chat-layout{
    grid-template-columns:minmax(245px,285px) minmax(0,1fr)!important;
    gap:14px!important;
  }
  body.dt-customer-chat-active .pro-chat-sidebar{
    max-height:calc(100dvh - 190px)!important;
    overflow:auto!important;
  }
  body.dt-customer-chat-active .pro-chat-main{
    height:calc(100dvh - 190px)!important;
    min-height:590px!important;
  }
  body.dt-admin-chat-active .messenger-shell{
    min-height:0!important;
  }
  body.dt-admin-chat-active .messenger-chat{
    height:calc(100dvh - 210px)!important;
    min-height:570px!important;
  }
}

/* Laptop angosta */
@media (max-width:1180px) and (min-width:821px){
  body.dt-customer-chat-active .pro-chat-layout{
    grid-template-columns:230px minmax(0,1fr)!important;
    gap:12px!important;
  }
  body.dt-customer-chat-active .pro-chat-main{
    height:calc(100dvh - 160px)!important;
    min-height:560px!important;
  }
  body.dt-customer-chat-active .support-hero{
    padding-block:13px!important;
    margin-bottom:10px!important;
  }
  body.dt-customer-chat-active .support-hero .support-hero-copy p{
    display:none!important;
  }
  body.dt-admin-chat-active .messenger-chat{
    min-height:560px!important;
  }
}

/* Tablet y celular: conversación como app */
@media (max-width:820px){
  html:has(body.dt-customer-chat-active),
  body.dt-customer-chat-active{
    overscroll-behavior-y:none;
  }

  body.dt-customer-chat-active .store-content{
    padding-bottom:0!important;
  }

  body.dt-customer-chat-active .support-hero{
    display:none!important;
  }

  body.dt-customer-chat-active .pro-chat-layout{
    display:block!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
  }

  body.dt-customer-chat-active .pro-chat-sidebar{
    display:none!important;
  }

  body.dt-customer-chat-active .pro-chat-main{
    height:calc(100dvh - var(--dt-mobile-site-head, 118px))!important;
    min-height:0!important;
    border-radius:16px!important;
    display:grid!important;
    grid-template-rows:auto minmax(0,1fr) auto!important;
    overflow:hidden!important;
  }

  body.dt-customer-chat-active .pro-chat-head{
    position:relative!important;
    min-height:58px!important;
    padding:9px 10px!important;
  }

  body.dt-customer-chat-active .pro-chat-messages{
    min-height:0!important;
    max-height:none!important;
    padding:12px 10px 18px!important;
  }

  body.dt-customer-chat-active .pro-chat-compose{
    position:relative!important;
    bottom:auto!important;
    grid-template-columns:42px minmax(0,1fr) 44px!important;
    padding:9px 9px max(9px,env(safe-area-inset-bottom))!important;
  }

  body.dt-customer-chat-active .compose-field textarea{
    font-size:16px!important; /* evita zoom automático de iOS */
    min-height:44px!important;
    max-height:118px!important;
  }

  body.dt-customer-chat-active .chat-bubble{
    max-width:90%!important;
  }

  body.dt-customer-chat-active .bubble-avatar{
    width:29px!important;
    height:29px!important;
    flex-basis:29px!important;
  }

  body.dt-customer-chat-active .dt-chat-live-badge{
    padding:5px 7px!important;
    font-size:10px!important;
  }

  body.dt-customer-chat-active .dt-new-message-jump,
  body.dt-customer-chat-active .chat-new-pill{
    right:12px!important;
    bottom:88px!important;
  }

  /* Admin móvil: la conversación también usa todo el ancho */
  body.dt-admin-chat-active .messenger-shell.has-conversation .messenger-inbox{
    display:none!important;
  }
  body.dt-admin-chat-active .messenger-shell.has-conversation{
    display:block!important;
  }
  body.dt-admin-chat-active .messenger-chat{
    height:calc(100dvh - 126px)!important;
    min-height:520px!important;
  }
  body.dt-admin-chat-active .messenger-messages{
    max-height:none!important;
    padding:12px 10px!important;
  }
}

/* Teléfonos pequeños */
@media (max-width:520px){
  body.dt-customer-chat-active .store-content-inner{
    padding-inline:6px!important;
  }
  body.dt-customer-chat-active .pro-chat-main{
    border-radius:12px!important;
  }
  body.dt-customer-chat-active .pro-chat-head{
    gap:7px!important;
  }
  body.dt-customer-chat-active .pro-chat-head strong,
  body.dt-customer-chat-active .pro-chat-head b{
    max-width:155px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  body.dt-customer-chat-active .chat-bubble{
    max-width:94%!important;
  }
}