/* Asesor Dart. Usa los tokens del tema (colores, fuentes y espacios). */
.buscador { flex-wrap: wrap; }
.dart-invita { position: relative; flex: 1 0 100%; align-self: flex-start; display: inline-flex; align-items: center; gap: var(--space-2); width: fit-content; max-width: 100%; min-height: 44px; padding: 0 18px 0 14px; background: var(--chispa); border: 2px solid var(--chispa); border-radius: var(--radius-full); color: var(--tinta); font: 700 15px/20px var(--font-sans); text-align: left; cursor: pointer; box-shadow: var(--shadow-sm); overflow: hidden; transition: transform .15s, box-shadow .15s; }
.dart-invita:hover { transform: translateY(-1px); box-shadow: var(--shadow-lg); }
.dart-invita__icono { flex: none; display: grid; place-items: center; width: 26px; height: 26px; border-radius: var(--radius-full); background: var(--morado); color: var(--sobre-morado); }
.dart-invita__icono svg { width: 16px; height: 16px; }
.dart-invita:focus-visible, .dart__btn:focus-visible, .dart-rapida:focus-visible, .dart-talla:focus-visible, .dart__log:focus-visible { outline: 2px solid transparent; box-shadow: var(--focus-ring); }

.dart { position: fixed; z-index: 95; right: 16px; bottom: 16px; display: flex; flex-direction: column; width: min(400px, calc(100vw - 32px)); height: min(620px, calc(100vh - 32px)); background: var(--fondo); color: var(--tinta); border: 1px solid var(--linea); border-radius: var(--radius-md); box-shadow: var(--shadow-lg); font-family: var(--font-sans); overflow: hidden; }
.dart[hidden] { display: none; }
.dart__cab { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-4); background: var(--morado); color: var(--sobre-morado); }
.dart__titulo { flex: 1; margin: 0; font: 600 22px/28px var(--font-display); letter-spacing: .02em; }
.dart__btn { min-height: 36px; padding: 0 var(--space-2); background: transparent; border: 0; border-radius: var(--radius-sm); color: var(--sobre-morado); font: 600 14px/20px var(--font-sans); text-decoration: underline; cursor: pointer; }
.dart__btn:focus-visible { box-shadow: 0 0 0 2px var(--morado), 0 0 0 4px var(--sobre-morado); }

.dart__log { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-4); background: var(--fondo-suave); }
.dart-msg { max-width: 88%; padding: 10px 14px; border-radius: var(--radius-md); font-size: 16px; line-height: 24px; }
.dart-msg__texto { margin: 0; white-space: pre-wrap; }
.dart-msg--bot { align-self: flex-start; background: var(--fondo); border: 1px solid var(--linea); }
.dart-msg--user { align-self: flex-end; background: var(--morado); color: var(--sobre-morado); }
.dart-pensando { color: var(--tinta-suave); font-style: italic; }

.dart__rapidas { display: flex; flex-wrap: wrap; gap: var(--space-2); padding: 0 var(--space-4); background: var(--fondo-suave); }
.dart__rapidas:not(:empty) { padding-block: var(--space-2); }
.dart-rapida { min-height: 40px; padding: 0 14px; background: var(--fondo); border: 1.5px solid var(--morado); border-radius: var(--radius-full); color: var(--morado); font: 600 15px/20px var(--font-sans); cursor: pointer; }
.dart-rapida:hover { background: var(--lavanda-claro); }

.dart__form { display: flex; gap: var(--space-2); padding: var(--space-2) var(--space-4) var(--space-4); background: var(--fondo-suave); border-top: 1px solid var(--linea); }

.dart-prod { display: flex; gap: var(--space-2); padding: var(--space-2); background: var(--fondo); border: 1px solid var(--linea); border-radius: var(--radius-md); }
.dart-prod__foto { width: 72px; height: 72px; object-fit: cover; border-radius: var(--radius-sm); background: var(--fondo-suave); flex: none; }
.dart-prod__cuerpo { flex: 1; min-width: 0; }
.dart-prod__nombre { margin: 0; font: 600 16px/22px var(--font-sans); }
.dart-prod__precio { margin: 0; font-weight: 700; color: var(--morado); }
.dart-prod__motivo { margin: var(--space-1) 0; font-size: 14px; line-height: 20px; color: var(--tinta-suave); }
.dart-tallas { display: flex; flex-wrap: wrap; gap: var(--space-1); margin: var(--space-1) 0; }
.dart-talla { min-width: 40px; min-height: 36px; padding: 0 10px; background: var(--fondo); border: 1.5px solid var(--borde-control); border-radius: var(--radius-sm); color: var(--tinta); font: 600 14px/20px var(--font-sans); cursor: pointer; }
.dart-talla[aria-pressed="true"] { background: var(--morado); border-color: var(--morado); color: var(--sobre-morado); }
.dart-prod__acciones { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-2); }
.dart-prod__estado { margin: var(--space-1) 0 0; font-size: 14px; line-height: 20px; }
.dart-prod__estado.ok { color: var(--exito); font-weight: 600; }
.dart-prod__estado.err { color: var(--error); font-weight: 600; }
.dart-prod__ir { color: var(--morado); }
.dart-wa { align-self: flex-start; }

/* Celulares y tabletas pequeñas: el chat ocupa toda la pantalla. */
@media (max-width: 782px), (pointer: coarse) and (max-width: 1024px) {
	.dart { top: 0; right: 0; bottom: 0; left: 0; width: 100%; max-width: none; height: 100vh; height: 100dvh; border: 0; border-radius: 0; box-shadow: none; z-index: 1000; }
	.dart__cab { padding: var(--space-2) var(--space-4); padding-top: max(var(--space-2), env(safe-area-inset-top)); }
	.dart__form { padding-bottom: max(var(--space-4), env(safe-area-inset-bottom)); }
	.dart__btn { min-height: 44px; }
	.dart-rapida, .dart-talla { min-height: 44px; }
	.dart-msg { max-width: 92%; }
	/* 16 px evita que iOS haga zoom al escribir. */
	.dart .ds-input { font-size: 16px; }
	html.dart-abierto, html.dart-abierto body { overflow: hidden; }
}
.dart a, .dart button { touch-action: manipulation; }
.dart-ir { align-self: flex-start; min-height: 44px; }
@media (prefers-reduced-motion: no-preference) {
	.dart:not([hidden]) { animation: dart-entra .18s ease-out; }
	@keyframes dart-entra { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
}

/* Llamado de atención: aro que pulsa, destello que cruza el botón y chispa que late. Se pausa al pasar el cursor o enfocar. */
@media (prefers-reduced-motion: no-preference) {
	.dart-invita { animation: dart-pulso 2.4s ease-out infinite; }
	.dart-invita::after { content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; background: linear-gradient(100deg, transparent, #ffffff99, transparent); transform: skewX(-20deg); animation: dart-destello 3.6s ease-in-out infinite; pointer-events: none; }
	.dart-invita__icono svg { animation: dart-late 1.8s ease-in-out infinite; }
	.dart-invita:hover, .dart-invita:focus-visible, .dart-invita[aria-expanded="true"] { animation: none; }
	.dart-invita:hover::after, .dart-invita:focus-visible::after, .dart-invita[aria-expanded="true"]::after { animation: none; opacity: 0; }
	@keyframes dart-pulso { 0% { box-shadow: 0 0 0 0 #ffb627b3; } 70% { box-shadow: 0 0 0 12px #ffb62700; } 100% { box-shadow: 0 0 0 0 #ffb62700; } }
	@keyframes dart-destello { 0%, 55% { left: -60%; } 100% { left: 130%; } }
	@keyframes dart-late { 0%, 100% { transform: scale(1) rotate(0); } 50% { transform: scale(1.25) rotate(12deg); } }
}

/* ── Avatar flotante de Dart (encima del botón de WhatsApp) ── */
.dart-flotantes { position: fixed; z-index: 80; right: 36px; bottom: 24px; display: flex; flex-direction: column; align-items: flex-end; gap: var(--space-4); pointer-events: none; }
.dart-flotantes > * { pointer-events: auto; }
.dart-avatar { position: relative; }
.dart-avatar__boton { position: relative; display: block; width: 76px; height: 76px; padding: 0; border: 0; border-radius: var(--radius-full); background: transparent; cursor: pointer; filter: drop-shadow(0 6px 10px #1e102433); transition: transform .2s; }
.dart-avatar__boton:hover { transform: scale(1.08); }
.dart-avatar__boton:focus-visible { outline: 2px solid transparent; box-shadow: var(--focus-ring); }
.dart-avatar__dibujo, .dart-avatar__dibujo svg { display: block; width: 100%; height: 100%; }
html.dart-abierto .dart-avatar { display: none; }

/* Puntito de «novedad»: invita a abrir hasta que el visitante lo hace una vez. */
.dart-avatar__punto { position: absolute; top: 2px; right: 2px; width: 16px; height: 16px; border-radius: var(--radius-full); background: var(--chispa); border: 2px solid var(--fondo); }
.dart-avatar--visto .dart-avatar__punto { display: none; }

/* Burbuja de saludo, a la izquierda del avatar. */
.dart-avatar__burbuja { position: absolute; right: calc(100% + 10px); top: 50%; width: max-content; max-width: 240px; text-wrap: balance; padding: 10px 14px; background: var(--fondo); color: var(--tinta); border: 1px solid var(--linea); border-radius: var(--radius-md); box-shadow: var(--shadow-lg); font: 600 15px/20px var(--font-sans); text-align: left; opacity: 0; visibility: hidden; transform: translateY(-50%) translateX(8px); transition: opacity .25s, transform .25s, visibility .25s; pointer-events: none; }
.dart-avatar__burbuja::after { content: ""; position: absolute; left: 100%; top: 50%; width: 10px; height: 10px; margin: -5px 0 0 -6px; background: var(--fondo); border-top: 1px solid var(--linea); border-right: 1px solid var(--linea); transform: rotate(45deg); }
.dart-avatar__burbuja.is-visible { opacity: 1; visibility: visible; transform: translateY(-50%); }

@media (max-width: 782px) {
	.dart-flotantes { right: var(--space-4); bottom: var(--space-4); }
	.dart-avatar__boton { width: 64px; height: 64px; }
	.dart-avatar__burbuja { max-width: 170px; font-size: 14px; }
}

/* Animación: flota suave, parpadea, la chispa de la gorra brilla, cabecea para saludar y un aro pulsa hasta que lo abren. */
@media (prefers-reduced-motion: no-preference) {
	.dart-avatar__boton { animation: dart-flota 3s ease-in-out infinite; }
	.dart-avatar__boton:hover, .dart-avatar__boton:focus-visible { animation: none; }
	.dart-avatar__dibujo { position: relative; }
	.dart-avatar:not(.dart-avatar--visto) .dart-avatar__dibujo::before { content: ""; position: absolute; inset: 0; border-radius: var(--radius-full); animation: dart-aro 2.4s ease-out infinite; pointer-events: none; }
	.dart-av-ojo { transform-box: fill-box; transform-origin: center; animation: dart-parpadeo 4.5s infinite; }
	.dart-av-chispa { transform-box: fill-box; transform-origin: center; animation: dart-chispa 1.8s ease-in-out infinite; }
	.dart-av-cabeza { transform-box: view-box; transform-origin: 48px 76px; animation: dart-saludo 6s ease-in-out infinite; }
	.dart-avatar:not(.dart-avatar--visto) .dart-avatar__punto { animation: dart-latido 1.2s ease-in-out infinite; }
	@keyframes dart-flota { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
	@keyframes dart-aro { 0% { box-shadow: 0 0 0 0 #582077a6; } 70%, 100% { box-shadow: 0 0 0 18px #58207700; } }
	@keyframes dart-parpadeo { 0%, 92%, 100% { transform: scaleY(1); } 95% { transform: scaleY(.1); } }
	@keyframes dart-chispa { 0%, 100% { transform: scale(1) rotate(0); opacity: 1; } 50% { transform: scale(1.4) rotate(25deg); opacity: .75; } }
	@keyframes dart-saludo { 0%, 62%, 100% { transform: rotate(0); } 68% { transform: rotate(-7deg); } 76% { transform: rotate(7deg); } 84% { transform: rotate(-4deg); } 91% { transform: rotate(0); } }
	@keyframes dart-latido { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.3); } }
}

/* Aviso de IA y datos sensibles */
.dart__ia { display: inline-block; margin-left: var(--space-1); padding: 0 8px; background: var(--chispa); color: var(--tinta); border-radius: var(--radius-full); font: 700 13px/20px var(--font-sans); letter-spacing: .04em; vertical-align: middle; }
.dart__aviso { margin: 0; padding: var(--space-2) var(--space-4); background: var(--lavanda-claro); color: var(--tinta); border-bottom: 1px solid var(--linea); font-size: 13px; line-height: 18px; }
.dart__aviso a { color: var(--morado); font-weight: 600; }
