/* Chat con Dulce (usa la paleta y la tipografía de styles.css) */
.chat-boton{
  position:fixed;right:20px;bottom:20px;z-index:60;
  right:max(20px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));
  font-family:inherit;box-shadow:0 4px 14px rgba(0,0,0,.18);
}
.chat-boton[aria-expanded="true"]{display:none}

.chat-panel{
  position:fixed;z-index:60;right:20px;bottom:20px;padding:0;
  width:380px;height:min(600px,calc(100vh - 110px));
  display:flex;flex-direction:column;overflow:hidden;
  background:var(--blanco);border:1px solid var(--borde);border-radius:8px;
  box-shadow:0 8px 30px rgba(0,0,0,.18);
}
.chat-encabezado{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 8px 12px 18px;background:var(--azul);color:#fff}
.chat-encabezado h2{font-size:18px;color:#fff}
.chat-encabezado p{font-size:14px;opacity:.85;line-height:1.3}
.chat-cerrar{width:44px;height:44px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:none;border:0;border-radius:8px;color:#fff;font-size:28px;line-height:1;cursor:pointer}
.chat-cerrar:hover{background:rgba(255,255,255,.15)}

.chat-mensajes{flex:1;overflow-y:auto;padding:16px;background:var(--fondo);display:flex;flex-direction:column;gap:8px;overscroll-behavior:contain}
.chat-burbuja{max-width:85%;padding:10px 14px;border-radius:8px;font-size:16px;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere}
.chat-burbuja a{text-decoration:underline;text-underline-offset:2px;font-weight:600}
.chat-dulce{align-self:flex-start;background:var(--blanco);border:1px solid var(--borde);color:var(--texto)}
.chat-dulce a{color:var(--azul)}
.chat-cliente{align-self:flex-end;background:var(--azul);color:#fff}
.chat-escribiendo{align-self:flex-start;font-size:14px;color:#5C6670;padding:2px 4px}

.chat-sugerencias{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin-top:4px}
.chat-sugerencias button{
  font:inherit;font-size:15px;font-weight:600;text-align:left;cursor:pointer;
  min-height:44px;padding:9px 14px;border-radius:8px;border:2px solid var(--azul);
  background:var(--blanco);color:var(--azul);transition:background-color .18s ease,color .18s ease;
}
.chat-sugerencias button:hover{background:var(--azul);color:#fff}

.chat-form{display:flex;gap:8px;padding:12px;border-top:1px solid var(--borde);background:var(--blanco)}
.chat-form input{flex:1;min-width:0;font:inherit;font-size:16px;padding:11px 12px;border:1px solid var(--borde);border-radius:8px;color:var(--texto);background:var(--blanco)}
.chat-form input:focus{outline:2px solid var(--azul);outline-offset:1px;border-color:var(--azul)}
.chat-form .btn{font-family:inherit;padding:11px 18px}
.chat-form .btn:disabled{opacity:.6;cursor:wait}

/* Celular: el chat ocupa toda la pantalla */
@media(max-width:600px){
  .chat-boton{right:16px;bottom:16px;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));padding:12px 20px}
  .chat-panel{inset:0;width:100%;height:100%;height:100dvh;border:0;border-radius:0}
  .chat-encabezado{padding-top:max(12px,env(safe-area-inset-top))}
  .chat-form{padding-bottom:max(12px,env(safe-area-inset-bottom))}
}