/* =====================================================================
 * DALIA — asistente global de Datalyse en el topbar (2026-08-09)
 *
 * Superficies:
 *   1) .dalia-center / .dalia-pill  → pill centrado en el topbar con anillo
 *      de gradiente animado (efecto IA tipo Gemini, paleta IA de la casa:
 *      --dt-blue / --dt-cyan / --dt-coral).
 *   2) #daliaPanel (.dalia-panel)   → panel global position:fixed (vive en
 *      #main-wrapper; ese wrapper no debe ganar transform/filter nunca).
 *      Dos modos via data-mode: "pop" (mini-desplegable bajo el pill) y
 *      "dock" (columna derecha a todo el alto). El cambio de modo es SOLO
 *      CSS: el chat nativo conserva su estado al cambiar de modo.
 *      Tres vistas via data-view: search / chat / voice.
 *
 * Contratos que NO se pueden romper:
 *   - Los ids #homebuscarforminput y #buscadorAkiponresultados los pinta el
 *     motor del buscador de 165_appMARC.js (clases .dt-search-modal__* y
 *     markup legacy a.dropdown-item): aqui solo se re-estilan (seccion 7).
 *   - Mismo fondo del input en rest/hover/focus/active (contrato visual).
 *   - Nada de [role="search"] en el wrapper (lastcssmarc.css le cambiaria
 *     el fondo en hover/focus).
 *   - Ambos temas SOLO con tokens --dt-* (light/dark via [data-bs-theme]).
 *
 * Controlador: cssyapp/165_appDALIA.js (window.DaliaPanel).
 * ===================================================================== */

/* --------------------------------------------------------------------
 * 1 · Rejilla del topbar: 3 zonas flex → centrado real sin solapes.
 * El ul izquierdo va en row-reverse (inline en index.html), por eso su
 * justify-content:flex-end equivale visualmente al borde IZQUIERDO.
 * -------------------------------------------------------------------- */
.topbar .navbar {
  flex-wrap: nowrap;
}

.topbar .navbar > ul.navbar-nav {
  flex: 1 1 0;
  min-width: 0;
  justify-content: flex-end;
}

.topbar .navbar > #navbarNav {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  justify-content: flex-end;
}

.dalia-center {
  position: relative;
  display: flex;
  flex: 0 1 auto;
  min-width: 0;
  height: 100%;
  align-items: center;
  justify-content: center;
  padding: 0 8px;
}

.dalia-proactive-shell {
  position: relative;
  width: clamp(200px, 26vw, 340px);
  max-width: 100%;
  flex: 0 1 auto;
  transition: width .32s cubic-bezier(.2,.8,.2,1), max-width .32s cubic-bezier(.2,.8,.2,1);
}

.dalia-center.is-proactive .dalia-proactive-shell {
  width: min(540px, calc(100vw - 24px));
  max-width: none;
}

/* --------------------------------------------------------------------
 * 2 · Pill Dalia: anillo conic-gradient rotando (doble background
 * padding-box/border-box). @property permite interpolar el angulo; sin
 * soporte, el fallback --dalia-angle:0deg deja el anillo estatico y la
 * vida la ponen el glow de hover y la respiracion del mini orbe.
 * -------------------------------------------------------------------- */
@property --dalia-angle {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}

/* Reposo: discreto (borde neutro, sin
   anillo animado). El efecto Gemini se enciende en hover/abierto. */
.dalia-pill {
  --dalia-angle: 0deg;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  max-width: 100%;
  height: 30px;
  padding: 0 12px 0 9px;
  border: 1px solid var(--dt-border);
  border-radius: 999px;
  background: transparent;
  color: var(--dt-muted);
  font-family: inherit;
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1;
  cursor: pointer;
  transition: color .12s ease, border-color .12s ease, box-shadow .18s ease;
}

.dalia-pill:hover,
.dalia-pill[aria-expanded="true"] {
  color: var(--dt-text);
  border-color: transparent;
  background:
    linear-gradient(var(--dt-hover), var(--dt-hover)) padding-box,
    conic-gradient(from var(--dalia-angle),
      var(--dt-blue), var(--dt-cyan) 32%, var(--dt-coral) 58%,
      var(--dt-blue) 76%, var(--dt-cyan) 88%, var(--dt-blue)) border-box;
  box-shadow:
    0 0 12px color-mix(in srgb, var(--dt-cyan) 22%, transparent),
    0 0 26px color-mix(in srgb, var(--dt-coral) 13%, transparent);
  animation: daliaBorderSpin 5s linear infinite;
}

.dalia-pill:focus-visible {
  outline: 0 !important;
  box-shadow:
    0 0 0 2px var(--dt-focus-ring),
    0 0 14px color-mix(in srgb, var(--dt-cyan) 25%, transparent) !important;
}

@keyframes daliaBorderSpin {
  to { --dalia-angle: 360deg; }
}

/* Mini orbe: nucleo esferico con brillo, misma paleta IA */
.dalia-orb-mini {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 30% 26%, rgba(255, 255, 255, .9), transparent 36%),
    radial-gradient(circle at 70% 74%, color-mix(in srgb, var(--dt-coral) 80%, transparent), transparent 46%),
    conic-gradient(from 210deg, var(--dt-blue), var(--dt-cyan) 42%, var(--dt-coral) 72%, var(--dt-blue));
  box-shadow: 0 0 8px color-mix(in srgb, var(--dt-cyan) 35%, transparent);
  animation: daliaOrbBreathe 3.2s ease-in-out infinite;
}

@keyframes daliaOrbBreathe {
  0%, 100% { transform: scale(1); box-shadow: 0 0 8px color-mix(in srgb, var(--dt-cyan) 35%, transparent); }
  50%      { transform: scale(1.12); box-shadow: 0 0 12px color-mix(in srgb, var(--dt-coral) 40%, transparent); }
}

.dalia-pill__label {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  color: inherit;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* La voz vive en la propia cabecera de Dalia. El visor permanece plegado
   cuando no hay una propuesta y se abre dentro del pill al hablar/escuchar. */
.dalia-pill__waveform {
  position: relative;
  display: block;
  width: 0;
  height: 20px;
  min-width: 0;
  flex: 0 0 0;
  margin-left: auto;
  overflow: hidden;
  border-radius: 999px;
  background:
    radial-gradient(ellipse at center, rgba(255,255,255,.13), transparent 72%),
    linear-gradient(90deg, transparent, rgba(255,255,255,.38) 18%, rgba(255,255,255,.38) 82%, transparent) center / 100% 1px no-repeat;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
  opacity: 0;
  transform: scaleX(.62);
  transform-origin: left center;
  transition:
    width .3s cubic-bezier(.2,.8,.2,1),
    flex-basis .3s cubic-bezier(.2,.8,.2,1),
    opacity .18s ease,
    transform .3s cubic-bezier(.2,.8,.2,1);
  pointer-events: none;
}

.dalia-pill__waveform-canvas {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}

/* Shimmer del label solo en hover (patron .ia-loader-text) */
.dalia-pill:hover .dalia-pill__label {
  background: linear-gradient(105deg, var(--dt-muted) 30%, var(--dt-text) 45%, var(--dt-cyan) 51%, var(--dt-coral) 56%, var(--dt-muted) 70%);
  background-size: 220% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: daliaShimmer 1.7s linear infinite;
}

@keyframes daliaShimmer {
  from { background-position: 180% 0; }
  to   { background-position: -120% 0; }
}

/* Estado has-note: Dalia tiene recomendaciones pendientes */
.dalia-pill.has-note::after {
  content: "";
  position: absolute;
  top: -2px;
  right: 2px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--dt-coral);
  box-shadow: 0 0 0 2px var(--dt-topbar), 0 0 8px color-mix(in srgb, var(--dt-coral) 60%, transparent);
}

.dalia-pill.has-note .dalia-orb-mini {
  box-shadow: 0 0 12px color-mix(in srgb, var(--dt-coral) 55%, transparent);
}

/* Push entrante: MISMO brillo Gemini que hover / panel abierto (no otro color). */
.dalia-pill.has-push {
  color: var(--dt-text);
  border-color: transparent;
  background:
    linear-gradient(var(--dt-hover), var(--dt-hover)) padding-box,
    conic-gradient(from var(--dalia-angle),
      var(--dt-blue), var(--dt-cyan) 32%, var(--dt-coral) 58%,
      var(--dt-blue) 76%, var(--dt-cyan) 88%, var(--dt-blue)) border-box;
  box-shadow:
    0 0 12px color-mix(in srgb, var(--dt-cyan) 22%, transparent),
    0 0 26px color-mix(in srgb, var(--dt-coral) 13%, transparent);
  animation: daliaBorderSpin 5s linear infinite;
}
.dalia-pill.has-push .dalia-orb-mini {
  box-shadow: 0 0 12px color-mix(in srgb, var(--dt-coral) 55%, transparent);
}
.dalia-pill.has-push .dalia-pill__label {
  background: linear-gradient(105deg, var(--dt-muted) 30%, var(--dt-text) 45%, var(--dt-cyan) 51%, var(--dt-coral) 56%, var(--dt-muted) 70%);
  background-size: 220% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: daliaShimmer 1.7s linear infinite;
}

/* Propuesta contextual: Dalia se expande desde el pill, usa el TTS de
   produccion y sincroniza el transcript con el progreso real del audio. */
.dalia-center:has(.dalia-proactive:not([hidden])),
.dalia-center.is-proactive { z-index: 1048; }

.dalia-pill.is-proactive {
  z-index: 3;
  width: 100%;
  color: #fff;
  border-color: transparent;
  border-radius: 18px 18px 6px 6px;
  background:
    linear-gradient(100deg,
      color-mix(in srgb, var(--dt-blue) 90%, #122033) 0%,
      color-mix(in srgb, var(--dt-cyan) 88%, var(--dt-blue)) 45%,
      color-mix(in srgb, var(--dt-coral) 74%, #e4d4cf) 61%,
      color-mix(in srgb, var(--dt-coral) 38%, #c8c8c8) 100%) padding-box,
    conic-gradient(from var(--dalia-angle), var(--dt-blue), var(--dt-cyan) 35%, var(--dt-coral) 62%, var(--dt-blue)) border-box;
  box-shadow:
    0 0 20px color-mix(in srgb, var(--dt-cyan) 36%, transparent),
    0 0 42px color-mix(in srgb, var(--dt-blue) 18%, transparent);
  animation: daliaBorderSpin 3.5s linear infinite, daliaPillTalk 2.4s ease-in-out infinite;
  cursor: default;
  opacity: 1;
  transition: border-radius .24s ease, box-shadow .2s ease;
}

.dalia-pill.is-proactive:disabled { color: #fff; opacity: 1; }
.dalia-pill.is-proactive:hover .dalia-pill__label {
  background: none;
  -webkit-text-fill-color: currentColor;
  animation: none;
}

@keyframes daliaPillTalk { 50% { filter: saturate(1.12) brightness(1.06); } }

.dalia-pill.is-proactive .dalia-pill__label {
  flex: 0 0 auto;
  color: #fff;
  -webkit-text-fill-color: currentColor;
  text-shadow: 0 1px 5px rgba(0,0,0,.22);
}

.dalia-pill.is-proactive .dalia-pill__waveform {
  width: clamp(96px, 17vw, 158px);
  flex-basis: clamp(96px, 17vw, 158px);
  opacity: .96;
  transform: scaleX(1);
}

.dalia-proactive[hidden] { display: none !important; }

.dalia-proactive {
  --dalia-angle: 0deg;
  --dalia-progress: 0;
  position: absolute;
  top: calc(100% - 1px);
  left: 0;
  display: flex;
  width: 100%;
  min-height: 146px;
  max-height: calc(100dvh - 70px);
  padding: 18px 42px 18px 18px;
  transform: none;
  align-items: center;
  gap: 21px;
  border: 1px solid transparent;
  border-radius: 6px 6px 22px 22px;
  background:
    radial-gradient(circle at 88% 50%, color-mix(in srgb, var(--dt-cyan) 14%, transparent), transparent 29%) padding-box,
    linear-gradient(145deg,
      color-mix(in srgb, var(--dt-surface) 97%, #08151c 3%),
      color-mix(in srgb, var(--dt-surface) 94%, #071118 6%)) padding-box,
    conic-gradient(from var(--dalia-angle), var(--dt-blue), var(--dt-cyan) 31%, var(--dt-coral) 58%, var(--dt-blue) 82%, var(--dt-cyan)) border-box;
  box-shadow:
    0 18px 50px rgba(0,0,0,.36),
    0 0 32px color-mix(in srgb, var(--dt-blue) 14%, transparent),
    inset 0 1px 0 rgba(255,255,255,.04);
  -webkit-backdrop-filter: blur(18px) saturate(1.18);
  backdrop-filter: blur(18px) saturate(1.18);
  animation: daliaProactiveIn .3s cubic-bezier(.2,.8,.2,1) both;
}

.dalia-proactive::before {
  content: "";
  position: absolute;
  top: -1px;
  right: 12px;
  left: 12px;
  height: 2px;
  background: linear-gradient(90deg,
    transparent,
    color-mix(in srgb, var(--dt-cyan) 78%, transparent) 24%,
    rgba(255,255,255,.68) 50%,
    color-mix(in srgb, var(--dt-coral) 70%, transparent) 76%,
    transparent);
  filter: blur(.2px);
  pointer-events: none;
}

@keyframes daliaProactiveIn {
  from { opacity: 0; transform: translateY(-8px) scale(.985); clip-path: inset(0 0 94% 0 round 6px); }
  to { opacity: 1; transform: none; clip-path: inset(0 round 6px); }
}

.dalia-proactive[data-orb-side="left"] .dalia-proactive__speaker { order: -1; }
.dalia-proactive[data-orb-side="left"] {
  background:
    radial-gradient(circle at 12% 50%, color-mix(in srgb, var(--dt-cyan) 14%, transparent), transparent 29%) padding-box,
    linear-gradient(145deg,
      color-mix(in srgb, var(--dt-surface) 97%, #08151c 3%),
      color-mix(in srgb, var(--dt-surface) 94%, #071118 6%)) padding-box,
    conic-gradient(from var(--dalia-angle), var(--dt-blue), var(--dt-cyan) 31%, var(--dt-coral) 58%, var(--dt-blue) 82%, var(--dt-cyan)) border-box;
}

.dalia-proactive__content {
  position: relative;
  min-width: 0;
  flex: 1;
  padding: 14px 16px 13px;
  max-height: calc(100dvh - 104px);
  overflow-x: hidden;
  overflow-y: auto;
  border: 1px solid color-mix(in srgb, var(--dt-border) 82%, transparent);
  border-radius: 17px 17px 6px 17px;
  background:
    linear-gradient(145deg,
      color-mix(in srgb, var(--dt-hover) 83%, transparent),
      color-mix(in srgb, var(--dt-surface) 78%, transparent));
  box-shadow:
    0 10px 26px rgba(0,0,0,.16),
    inset 0 1px 0 rgba(255,255,255,.025);
}

.dalia-proactive__content::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 8% 0, rgba(255,255,255,.045), transparent 36%);
  pointer-events: none;
}

.dalia-proactive__item {
  position: relative;
  z-index: 1;
  transform-origin: center;
}

.dalia-proactive__item.is-leaving-next { animation: daliaItemOutLeft .12s ease both; }
.dalia-proactive__item.is-leaving-previous { animation: daliaItemOutRight .12s ease both; }
.dalia-proactive__item.is-entering-next { animation: daliaItemInRight .18s cubic-bezier(.2,.8,.2,1) both; }
.dalia-proactive__item.is-entering-previous { animation: daliaItemInLeft .18s cubic-bezier(.2,.8,.2,1) both; }

@keyframes daliaItemOutLeft { to { opacity: 0; transform: translateX(-12px); } }
@keyframes daliaItemOutRight { to { opacity: 0; transform: translateX(12px); } }
@keyframes daliaItemInRight { from { opacity: 0; transform: translateX(14px); } }
@keyframes daliaItemInLeft { from { opacity: 0; transform: translateX(-14px); } }

.dalia-proactive[data-orb-side="left"] .dalia-proactive__content {
  border-radius: 17px 17px 17px 6px;
}

.dalia-proactive__kicker {
  position: relative;
  z-index: 1;
  display: flex;
  margin-bottom: 7px;
  align-items: center;
  gap: 6px;
  color: var(--dt-faint);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .11em;
  line-height: 1;
  text-transform: uppercase;
}

.dalia-proactive__kicker[hidden] { display: none !important; }

.dalia-proactive__live-dot {
  width: 5px;
  height: 5px;
  flex: 0 0 5px;
  border-radius: 50%;
  background: var(--dt-cyan);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--dt-cyan) 12%, transparent), 0 0 8px var(--dt-cyan);
}

.dalia-proactive__text {
  position: relative;
  z-index: 1;
  margin: 0;
  color: var(--dt-muted);
  font-size: 13.5px;
  font-weight: 480;
  line-height: 1.58;
}

.dalia-proactive__word {
  position: relative;
  display: inline-block;
  overflow: hidden;
  border-radius: 5px;
  color: var(--dt-muted);
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  transition: color .16s ease, background-color .16s ease, box-shadow .16s ease, opacity .16s ease;
}

.dalia-proactive__word[data-state="unspoken"] { opacity: .46; }
.dalia-proactive__word[data-state="spoken"] { color: var(--dt-text); opacity: .9; }
.dalia-proactive__word[data-state="current"] {
  padding: 1px 3px 2px;
  margin: -1px -3px -2px;
  background: color-mix(in srgb, var(--dt-cyan) 16%, var(--dt-hover));
  color: var(--dt-text);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--dt-cyan) 18%, transparent),
    0 0 14px color-mix(in srgb, var(--dt-cyan) 18%, transparent);
  opacity: 1;
}

.dalia-proactive__word[data-state="current"]::after {
  content: "";
  position: absolute;
  inset: -2px -5px;
  background: linear-gradient(105deg, transparent 20%, rgba(255,255,255,.08) 38%, rgba(220,255,255,.76) 50%, rgba(255,255,255,.08) 62%, transparent 80%);
  mix-blend-mode: screen;
  transform: translateX(-145%);
  animation: daliaWordShimmer .76s cubic-bezier(.2,.72,.2,1) 1 both;
  pointer-events: none;
}

@keyframes daliaWordShimmer { to { transform: translateX(145%); } }

.dalia-proactive__transcript {
  position: relative;
  z-index: 1;
  margin: 10px 0 0;
  padding-top: 9px;
  border-top: 1px solid color-mix(in srgb, var(--dt-border) 75%, transparent);
  color: var(--dt-cyan);
  font-size: 12px;
  line-height: 1.45;
}

.dalia-proactive__transcript::before { content: "Tú · "; color: var(--dt-faint); }

.dalia-proactive__actions {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.dalia-proactive__actions:empty { display: none; }

.dalia-proactive__navigation[hidden] { display: none !important; }

.dalia-proactive__navigation {
  position: relative;
  z-index: 2;
  display: flex;
  min-height: 35px;
  margin-top: 13px;
  padding-top: 10px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-top: 1px solid color-mix(in srgb, var(--dt-border) 74%, transparent);
}

.dalia-proactive__counter {
  min-width: 0;
  overflow: hidden;
  color: var(--dt-faint);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: .055em;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.dalia-proactive__counter-prefix { display: inline; }

.dalia-proactive__arrows {
  display: inline-flex;
  flex: 0 0 auto;
  gap: 6px;
}

.dalia-proactive__arrow {
  display: grid;
  width: 28px;
  height: 28px;
  padding: 0;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--dt-border-strong) 86%, transparent);
  border-radius: 50%;
  background: color-mix(in srgb, var(--dt-hover) 88%, transparent);
  color: var(--dt-text);
  font: inherit;
  font-size: 14px;
  cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
  transition: transform .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease, opacity .15s ease;
}

.dalia-proactive__arrow:hover:not(:disabled) {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--dt-cyan) 62%, var(--dt-border));
  color: var(--dt-cyan);
  box-shadow: 0 0 12px color-mix(in srgb, var(--dt-cyan) 16%, transparent);
}

.dalia-proactive__arrow:focus-visible { outline: 0; box-shadow: 0 0 0 2px var(--dt-focus-ring); }
.dalia-proactive__arrow:disabled { opacity: .28; cursor: default; }

.dalia-proactive__action {
  min-height: 35px;
  padding: 0 14px;
  border: 1px solid var(--dt-border-strong);
  border-radius: 999px;
  background: color-mix(in srgb, var(--dt-hover) 86%, transparent);
  color: var(--dt-text);
  font: inherit;
  font-size: 12px;
  font-weight: 550;
  cursor: pointer;
  transition: transform .15s ease, border-color .15s ease, background .15s ease, box-shadow .15s ease;
}

.dalia-proactive__action:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--dt-cyan) 70%, var(--dt-border));
  box-shadow: 0 5px 16px color-mix(in srgb, var(--dt-cyan) 14%, transparent);
}

.dalia-proactive__action:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 2px var(--dt-focus-ring);
}

.dalia-proactive__action--primary {
  border-color: color-mix(in srgb, var(--dt-cyan) 62%, var(--dt-blue));
  background: linear-gradient(135deg,
    color-mix(in srgb, var(--dt-blue) 78%, var(--dt-hover)),
    color-mix(in srgb, var(--dt-cyan) 38%, var(--dt-blue)));
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
}

.dalia-proactive__speaker {
  position: relative;
  display: flex;
  flex: 0 0 96px;
  min-width: 0;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  gap: 9px;
}

.dalia-proactive__visualizer {
  position: relative;
  display: grid;
  width: 88px;
  height: 88px;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--dt-cyan) 15%, var(--dt-border));
  border-radius: 50%;
  background:
    radial-gradient(circle at 46% 44%, color-mix(in srgb, var(--dt-hover) 46%, transparent), transparent 68%),
    color-mix(in srgb, var(--dt-surface) 42%, transparent);
  box-shadow:
    inset 9px 10px 20px rgba(255,255,255,.025),
    inset -10px -12px 22px rgba(0,0,0,.25),
    0 0 24px color-mix(in srgb, var(--dt-cyan) 10%, transparent);
  isolation: isolate;
}

.dalia-proactive__visualizer::before,
.dalia-proactive__visualizer::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}

.dalia-proactive__visualizer::before {
  inset: -12px;
  z-index: -2;
  background: radial-gradient(circle, color-mix(in srgb, var(--dt-cyan) 30%, transparent), transparent 68%);
  opacity: .48;
  animation: daliaAgentHalo 2.8s ease-in-out infinite;
}

.dalia-proactive__visualizer::after {
  inset: 3px;
  z-index: 3;
  border: 1px solid rgba(255,255,255,.13);
  box-shadow: inset 0 0 13px rgba(255,255,255,.07), 0 0 8px color-mix(in srgb, var(--dt-cyan) 10%, transparent);
}

.dalia-proactive__orb-canvas,
.dalia-proactive__orb-fallback,
.dalia-proactive__orb-glass {
  position: absolute;
  inset: 4px;
  width: calc(100% - 8px);
  height: calc(100% - 8px);
  border-radius: 50%;
}

.dalia-proactive__orb-canvas {
  z-index: 1;
  display: block;
  filter: saturate(1.1) contrast(1.025);
}

.dalia-proactive__orb-fallback {
  z-index: 0;
  background:
    radial-gradient(ellipse 28% 40% at 50% 15%, color-mix(in srgb, var(--dt-cyan) 74%, transparent), transparent 82%),
    radial-gradient(ellipse 27% 40% at 75% 27%, color-mix(in srgb, #8cecf4 70%, transparent), transparent 82%),
    radial-gradient(ellipse 28% 40% at 84% 54%, color-mix(in srgb, var(--dt-blue) 72%, transparent), transparent 82%),
    radial-gradient(ellipse 28% 40% at 68% 78%, color-mix(in srgb, var(--dt-coral) 55%, transparent), transparent 82%),
    radial-gradient(ellipse 28% 40% at 41% 84%, color-mix(in srgb, var(--dt-cyan) 62%, transparent), transparent 82%),
    radial-gradient(ellipse 28% 40% at 18% 67%, color-mix(in srgb, var(--dt-blue) 68%, transparent), transparent 82%),
    radial-gradient(ellipse 28% 40% at 17% 38%, color-mix(in srgb, #bdfcff 64%, transparent), transparent 82%),
    radial-gradient(circle at 50% 50%, rgba(226,255,255,.86), rgba(38,181,226,.42) 14%, rgba(5,24,53,.92) 42%, #030b1a 78%);
  box-shadow: inset 0 0 17px rgba(0,0,0,.36), 0 0 20px color-mix(in srgb, var(--dt-cyan) 32%, transparent);
}

.dalia-proactive.has-orb-canvas .dalia-proactive__orb-fallback { opacity: 0; }

.dalia-proactive__orb-glass {
  z-index: 2;
  background:
    radial-gradient(ellipse 44% 24% at 29% 18%, rgba(255,255,255,.58), transparent 58%),
    linear-gradient(145deg, rgba(255,255,255,.055), transparent 36%, rgba(0,0,0,.09));
  box-shadow: inset 0 0 13px rgba(255,255,255,.1), inset -8px -9px 16px rgba(0,0,0,.12);
  pointer-events: none;
}

.dalia-proactive.is-speaking .dalia-proactive__visualizer {
  border-color: color-mix(in srgb, var(--dt-cyan) 42%, transparent);
  box-shadow:
    inset 9px 10px 20px rgba(255,255,255,.035),
    inset -10px -12px 22px rgba(0,0,0,.24),
    0 0 28px color-mix(in srgb, var(--dt-cyan) 25%, transparent);
}

.dalia-proactive.is-speaking .dalia-proactive__visualizer::before {
  opacity: 1;
  animation-duration: .95s;
}

.dalia-proactive.is-listening .dalia-proactive__visualizer {
  border-color: color-mix(in srgb, var(--dt-coral) 42%, transparent);
  box-shadow:
    inset 9px 10px 20px rgba(255,255,255,.035),
    inset -10px -12px 22px rgba(0,0,0,.24),
    0 0 30px color-mix(in srgb, var(--dt-coral) 22%, transparent);
}

.dalia-proactive.is-listening .dalia-proactive__visualizer::before {
  background: radial-gradient(circle, color-mix(in srgb, var(--dt-coral) 28%, transparent), transparent 68%);
  opacity: .92;
  animation-duration: 1.25s;
}

@keyframes daliaAgentHalo { 50% { opacity: .9; transform: scale(1.1); } }

.dalia-proactive__status-shell {
  display: flex;
  max-width: 100%;
  align-items: center;
  gap: 5px;
  overflow: hidden;
  color: var(--dt-faint);
  white-space: nowrap;
}

.dalia-proactive__status {
  max-width: 100%;
  overflow: hidden;
  color: inherit;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .12em;
  line-height: 1;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.dalia-proactive__status-dot {
  width: 5px;
  height: 5px;
  flex: 0 0 5px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 6px currentColor;
}

.dalia-proactive.is-speaking .dalia-proactive__status-shell { color: var(--dt-cyan); }
.dalia-proactive.is-listening .dalia-proactive__status-shell { color: var(--dt-coral); }

.dalia-proactive.is-speaking .dalia-proactive__status,
.dalia-proactive.is-listening .dalia-proactive__status {
  background:
    linear-gradient(105deg, currentColor 24%, #fff 46%, currentColor 58%, color-mix(in srgb, currentColor 72%, var(--dt-muted)) 78%);
  background-size: 240% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: daliaStatusShimmer 2.25s linear infinite;
}

@keyframes daliaStatusShimmer {
  0%, 12% { background-position: 130% 0; }
  62%, 100% { background-position: -125% 0; }
}

.dalia-proactive__mic {
  position: absolute;
  top: 65px;
  right: 1px;
  z-index: 4;
  display: grid;
  width: 27px;
  height: 27px;
  padding: 0;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--dt-cyan) 42%, var(--dt-border));
  border-radius: 50%;
  background: color-mix(in srgb, var(--dt-surface) 94%, transparent);
  color: var(--dt-muted);
  font-size: 13px;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(0,0,0,.22);
  transition: transform .15s ease, color .15s ease, border-color .15s ease, background .15s ease;
}

.dalia-proactive__mic:hover { transform: scale(1.06); color: var(--dt-text); border-color: var(--dt-cyan); }
.dalia-proactive__mic:focus-visible { outline: 0; box-shadow: 0 0 0 2px var(--dt-focus-ring); }
.dalia-proactive .dalia-proactive__mic-off { display: none; }

.dalia-proactive.is-listening .dalia-proactive__mic {
  color: #fff;
  border-color: transparent;
  background: var(--dt-coral);
  box-shadow: 0 0 14px color-mix(in srgb, var(--dt-coral) 50%, transparent);
}

.dalia-proactive.is-listening .dalia-proactive__mic-on { display: none; }
.dalia-proactive.is-listening .dalia-proactive__mic-off { display: inline-block; }

.dalia-proactive__close {
  position: absolute;
  top: 9px;
  right: 9px;
  z-index: 5;
  display: grid;
  width: 28px;
  height: 28px;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--dt-muted);
  cursor: pointer;
}

.dalia-proactive__close:hover { color: var(--dt-text); background: var(--dt-hover); }
.dalia-proactive__close:focus-visible { outline: 0; box-shadow: 0 0 0 2px var(--dt-focus-ring); }

@media (max-width: 760px) {
  .topbar .navbar.dalia-proactive-focus > ul.navbar-nav,
  .topbar .navbar.dalia-proactive-focus > #navbarNav {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
  }
}

@media (max-width: 540px) {
  .dalia-center.is-proactive .dalia-proactive-shell {
    position: fixed;
    top: 8px;
    right: 10px;
    left: 10px;
    z-index: 1050;
    width: auto;
    max-width: none;
  }
  .dalia-proactive {
    position: absolute;
    top: calc(100% - 1px);
    right: 0;
    left: 0;
    width: 100%;
    min-height: 128px;
    max-height: calc(100dvh - 47px);
    padding: 14px 33px 14px 14px;
    transform: none;
    gap: 12px;
  }
  .dalia-proactive__content { padding: 12px 13px; }
  .dalia-proactive__kicker { margin-bottom: 6px; font-size: 8px; }
  .dalia-proactive__text { font-size: 12.5px; line-height: 1.52; }
  .dalia-proactive__navigation { margin-top: 10px; padding-top: 8px; }
  .dalia-proactive__counter { font-size: 9px; letter-spacing: .035em; }
  .dalia-proactive__arrow { width: 27px; height: 27px; }
  .dalia-proactive__speaker { flex-basis: 74px; }
  .dalia-proactive__visualizer { width: 70px; height: 70px; }
  .dalia-proactive__mic { top: 52px; width: 25px; height: 25px; }
  .dalia-proactive__status { font-size: 8px; letter-spacing: .08em; }
  .dalia-proactive[data-orb-side="left"] { padding-right: 38px; gap: 8px; }
  .dalia-pill.is-proactive .dalia-pill__waveform {
    width: clamp(72px, 28vw, 108px);
    height: 18px;
    flex-basis: clamp(72px, 28vw, 108px);
  }
}

@media (max-width: 360px) {
  .dalia-proactive__counter-prefix { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .dalia-proactive,
  .dalia-proactive-shell,
  .dalia-pill.is-proactive,
  .dalia-pill__waveform,
  .dalia-proactive__visualizer::before,
  .dalia-proactive__status,
  .dalia-proactive__word::after,
  .dalia-proactive__item { animation: none !important; transition: none !important; }
}

/* --------------------------------------------------------------------
 * 3 · Panel: base compartida + modos pop/dock + espejos de z-index.
 * position:fixed (fuera del stacking del topbar): sobrevive a sus cambios
 * de z-index.
 * -------------------------------------------------------------------- */
.dalia-panel {
  position: fixed;
  z-index: 3050; /* topbar=3000; sus dropdowns internos quedan en otro stacking */
  display: flex;
  flex-direction: column;
  border: 1px solid var(--dt-border);
  background: color-mix(in srgb, var(--dt-overlay) 88%, transparent);
  -webkit-backdrop-filter: saturate(1.4) blur(18px);
  backdrop-filter: saturate(1.4) blur(18px);
  box-shadow: var(--dt-pop-shadow);
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity .16s ease,
    transform .16s cubic-bezier(.3, .9, .3, 1),
    visibility 0s linear .16s;
}

.dalia-panel.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition:
    opacity .16s ease,
    transform .16s cubic-bezier(.3, .9, .3, 1);
}

[data-bs-theme="dark"] .dalia-panel {
  background: color-mix(in srgb, var(--dt-overlay) 92%, transparent);
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .dalia-panel,
  [data-bs-theme="dark"] .dalia-panel { background: var(--dt-overlay); }
}

/* Filo superior IA sutil (guino Gemini, 1px) */
.dalia-panel::before {
  content: "";
  position: absolute;
  top: 0;
  right: 24px;
  left: 24px;
  height: 1px;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--dt-cyan) 45%, transparent), color-mix(in srgb, var(--dt-coral) 35%, transparent), transparent);
  pointer-events: none;
}

/* Modo POP: mini-desplegable anclado bajo el pill (left lo fija el JS) */
.dalia-panel[data-mode="pop"] {
  top: calc(var(--dt-topbar-h) + 6px);
  width: min(640px, calc(100vw - 24px));
  border-radius: 16px;
  transform: translateY(-4px) scale(.985);
  transform-origin: top center;
}

.dalia-panel[data-mode="pop"].is-open {
  transform: translateY(0) scale(1);
}

/* Modo DOCK: columna derecha DE VERDAD a todo el alto bajo la barra.
   No tapa el contenido: body.dalia-docked empuja .page-wrapper (abajo).
   Anchura en --dalia-dock-w (redimensionable arrastrando .dalia-panel__resizer). */
:root { --dalia-dock-w: 420px; }

.dalia-panel[data-mode="dock"] {
  top: var(--dt-topbar-h);
  right: 0;
  bottom: 0;
  left: auto !important; /* pisa el left inline que fija el JS en modo pop */
  width: min(var(--dalia-dock-w), 100vw);
  border-radius: 0;
  border-top: 0;
  border-right: 0;
  border-bottom: 0;
  transform: translateX(10px);
}

.dalia-panel[data-mode="dock"].is-open {
  transform: translateX(0);
}

/* El contenido se ENCOGE (no queda debajo) mientras el dock esta abierto */
@media (min-width: 641px) {
  body.dalia-docked .page-wrapper {
    margin-right: var(--dalia-dock-w) !important;
  }
}

/* Asa de redimension (solo dock): borde izquierdo arrastrable */
.dalia-panel__resizer {
  display: none;
  position: absolute;
  top: 0;
  bottom: 0;
  left: -3px;
  z-index: 3;
  width: 8px;
  cursor: col-resize;
  touch-action: none;
}

.dalia-panel[data-mode="dock"] .dalia-panel__resizer { display: block; }

.dalia-panel__resizer::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 3px;
  width: 2px;
  background: transparent;
  transition: background-color .12s ease;
}

.dalia-panel__resizer:hover::after,
.dalia-panel__resizer.is-dragging::after {
  background: color-mix(in srgb, var(--dt-cyan) 55%, transparent);
}

/* Espejos de z-index: con modal abierto o record-panel abierto, Dalia debe
   quedar POR DEBAJO igual que el topbar (theme.css baja el topbar a 1000 con
   modal-open; record-panel.css lo baja a 1030 y sus drawers usan 1039-1045) */
body.modal-open .dalia-panel { z-index: 1000; }
body.rp-open .dalia-panel,
body.rpn-open .dalia-panel,
body.rpb-open .dalia-panel { z-index: 1029; }

/* Cabecera unica del panel (estilo voice-chat): orbe + Dalia + estado */
.dalia-panel__head {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 10px;
  padding: 10px 12px 10px 16px;
  border-bottom: 1px solid var(--dt-border);
}

.dalia-panel__head-orb {
  width: 22px;
  height: 22px;
}

.dalia-panel__head-meta {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}

.dalia-panel__head-name {
  color: var(--dt-text);
  font-size: 13px;
  font-weight: 650;
  letter-spacing: -.01em;
  line-height: 1.2;
}

.dalia-panel__head-status {
  color: var(--dt-success, #16835b);
  font-size: 11.5px;
  line-height: 1.2;
}

.dalia-panel[data-voice-state="listening"] .dalia-panel__head-status,
.dalia-panel[data-voice-state="speaking"] .dalia-panel__head-status {
  color: var(--dt-cta);
}

/* Punto de estado a la derecha (como el "Connected" del block voice-chat de
   ui.elevenlabs): verde conectado, ambar conectando, gris offline; en voz
   activa acompaña al estado (cian escucha / coral hablando) */
.dalia-panel__head-dot {
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  margin-right: 2px;
  border-radius: 50%;
  background: var(--dt-success, #16835b);
  box-shadow: 0 0 6px color-mix(in srgb, var(--dt-success, #16835b) 55%, transparent);
}

.dalia-panel[data-conn="connecting"] .dalia-panel__head-dot {
  background: var(--dt-warning, #b86513);
  box-shadow: 0 0 6px color-mix(in srgb, var(--dt-warning, #b86513) 55%, transparent);
}

.dalia-panel[data-conn="offline"] .dalia-panel__head-dot {
  background: var(--dt-faint);
  box-shadow: none;
}

.dalia-panel[data-conn="offline"] .dalia-panel__head-status {
  color: var(--dt-faint);
}

.dalia-panel[data-voice-state="listening"] .dalia-panel__head-dot {
  background: var(--dt-cyan);
  box-shadow: 0 0 6px color-mix(in srgb, var(--dt-cyan) 55%, transparent);
}

.dalia-panel[data-voice-state="speaking"] .dalia-panel__head-dot {
  background: var(--dt-coral);
  box-shadow: 0 0 6px color-mix(in srgb, var(--dt-coral) 55%, transparent);
}

/* Tabs OCULTAS (orden de Marc 2026-08-09: el unico buscador sera Dalia).
   El CSS de .dalia-panel__tabs de abajo se conserva para reactivarlas. */
.dalia-panel__bar { display: none !important; }

/* Vistas: solo la activa se pinta (cambio por data-view, sin reparenting) */
.dalia-panel__pane {
  display: none;
  min-height: 0;
}

/* Search y Voice quedan ocultas: Dalia es la unica superficie (la voz vive
   dentro del chat). El motor del buscador sigue cableado en sus ids. */
.dalia-panel .dalia-panel__pane[data-dalia-pane="search"],
.dalia-panel .dalia-panel__pane[data-dalia-pane="voice"] {
  display: none !important;
}

.dalia-panel[data-view="search"] .dalia-panel__pane[data-dalia-pane="search"],
.dalia-panel[data-view="chat"] .dalia-panel__pane[data-dalia-pane="chat"] {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
}

.dalia-panel[data-view="voice"] .dalia-panel__pane[data-dalia-pane="voice"] {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 30px 20px 24px;
  border-top: 1px solid var(--dt-border);
}

/* Gating: sin permiso de asistente solo queda la vista search */
.dalia-panel[data-chat-allowed="n"] #daliaTabChat,
.dalia-panel[data-chat-allowed="n"] #daliaTabVoice,
.dalia-panel[data-chat-allowed="n"] #daliaMicShortcut,
.dalia-panel[data-chat-allowed="n"] #daliaDockBtn,
.dalia-panel[data-chat-allowed="n"] .dalia-panel__hint--ai {
  display: none !important;
}

/* --------------------------------------------------------------------
 * 4 · Barra superior: segmented control (Apple) + dock + cierre
 * -------------------------------------------------------------------- */
.dalia-panel__bar {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
  padding: 10px 12px 8px;
}

.dalia-panel__tabs {
  display: flex;
  flex: 1 1 auto;
  gap: 2px;
  min-width: 0;
  height: 34px;
  padding: 3px;
  border-radius: 10px;
  background: var(--dt-surface-2);
}

.dalia-panel__tab {
  display: inline-flex;
  flex: 1 1 0;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 0;
  padding: 0 10px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--dt-muted);
  font-family: inherit;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  transition: color .12s ease, background-color .12s ease, box-shadow .12s ease;
}

.dalia-panel__tab .ti { font-size: 14px; }

.dalia-panel__tab:hover { color: var(--dt-text); }

.dalia-panel__tab[aria-selected="true"] {
  color: var(--dt-text);
  background: var(--dt-overlay);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .10), 0 0 0 1px var(--dt-border);
}

/* Acento IA sancionado: solo el sparkles del tab activo */
.dalia-panel__tab[aria-selected="true"] .ti-sparkles { color: var(--dt-coral); }

.dalia-panel__tab:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 2px var(--dt-focus-ring);
}

.dalia-panel__dockbtn,
.dalia-panel__close {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  height: 26px;
  border: 1px solid var(--dt-border-strong);
  border-radius: 7px;
  background: var(--dt-hover);
  color: var(--dt-muted);
  font-size: 11px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition: background-color .12s ease, color .12s ease;
}

.dalia-panel__dockbtn { width: 28px; font-size: 14px; }
.dalia-panel__close { min-width: 34px; padding: 0 8px; }

.dalia-panel__dockbtn:hover,
.dalia-panel__close:hover { color: var(--dt-text); background: var(--dt-active); }

.dalia-panel__dockbtn:focus-visible,
.dalia-panel__close:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 2px var(--dt-focus-ring);
}

.dalia-panel__close-x { display: none; font-size: 15px; }

.dalia-panel__dock-collapse { display: none; }
.dalia-panel[data-mode="dock"] .dalia-panel__dock-expand { display: none; }
.dalia-panel[data-mode="dock"] .dalia-panel__dock-collapse { display: inline-flex; }

/* --------------------------------------------------------------------
 * 5 · Notas proactivas de Dalia (DaliaPanel.notify)
 * -------------------------------------------------------------------- */
.dalia-panel__notes {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 8px;
  padding: 0 12px 8px;
}

.dalia-panel__notes[hidden] { display: none; }

.dalia-note {
  position: relative;
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 10px 30px 10px 12px;
  border: 1px solid var(--dt-border);
  border-radius: 12px;
  background: var(--dt-surface);
}

.dalia-note .dalia-orb-mini { margin-top: 1px; }

.dalia-note__main { flex: 1 1 auto; min-width: 0; }

.dalia-note__type {
  margin: 0 0 3px;
  color: var(--dt-faint);
  font-family: var(--dalia-font-display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.dalia-note__text {
  color: var(--dt-text);
  font-size: 13px;
  line-height: 1.45;
}

/* Tipos de nota push (mismo contrato que .msg.is-push) */
.dalia-note.is-info {
  border-color: color-mix(in srgb, #3b82f6 40%, var(--dt-border));
  background: color-mix(in srgb, #3b82f6 7%, var(--dt-surface));
}
.dalia-note.is-success {
  border-color: color-mix(in srgb, #16a34a 40%, var(--dt-border));
  background: color-mix(in srgb, #16a34a 7%, var(--dt-surface));
}
.dalia-note.is-warning {
  border-color: color-mix(in srgb, #d97706 42%, var(--dt-border));
  background: color-mix(in srgb, #d97706 8%, var(--dt-surface));
}
.dalia-note.is-error,
.dalia-note.is-critical {
  border-color: color-mix(in srgb, #ef4444 45%, var(--dt-border));
  background: color-mix(in srgb, #ef4444 8%, var(--dt-surface));
}
.dalia-note.is-critical {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #ef4444 28%, transparent);
}
.dalia-note.is-info .dalia-note__type { color: #3b82f6; }
.dalia-note.is-success .dalia-note__type { color: #16a34a; }
.dalia-note.is-warning .dalia-note__type { color: #d97706; }
.dalia-note.is-error .dalia-note__type,
.dalia-note.is-critical .dalia-note__type { color: #ef4444; }

.dalia-note__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.dalia-note__btn {
  height: 26px;
  padding: 0 10px;
  border: 1px solid var(--dt-border-strong);
  border-radius: 7px;
  background: var(--dt-surface);
  color: var(--dt-text);
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition: background-color .12s ease;
}

.dalia-note__btn:hover { background: var(--dt-hover); }

.dalia-note__btn--primary {
  border-color: var(--dt-cta);
  background: var(--dt-cta);
  color: var(--dt-cta-fg);
}

.dalia-note__btn--primary:hover { background: var(--dt-cta-hover); }

.dalia-note__dismiss {
  position: absolute;
  top: 6px;
  right: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--dt-faint);
  font-size: 13px;
  cursor: pointer;
}

.dalia-note__dismiss:hover { color: var(--dt-text); background: var(--dt-hover); }

/* --------------------------------------------------------------------
 * 6 · Vista SEARCH: cabecera con input (fondo constante, sin ring azul)
 * -------------------------------------------------------------------- */
.dalia-panel__searchhead {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 12px;
  min-height: 50px;
  padding: 10px 12px 10px 16px;
  border-top: 1px solid var(--dt-border);
  border-bottom: 1px solid var(--dt-border);
}

/* Focus = subrayado interior; el fondo NO cambia (contrato del repo) */
.dalia-panel__searchhead:focus-within {
  box-shadow: inset 0 -2px 0 var(--dt-focus);
}

.dalia-panel__search-icon {
  flex: 0 0 auto;
  color: var(--dt-faint);
  font-size: 19px;
  line-height: 1;
}

.dalia-panel #homebuscarforminput,
.dalia-panel .dalia-panel__input {
  -webkit-appearance: none !important;
  appearance: none !important;
  flex: 1 1 auto;
  min-width: 0;
  width: 100% !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--dt-text) !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  font: inherit !important;
  font-size: 15px !important;
  font-weight: 450 !important;
  line-height: 1.3 !important;
}

.dalia-panel #homebuscarforminput:hover,
.dalia-panel #homebuscarforminput:focus,
.dalia-panel #homebuscarforminput:focus-visible,
.dalia-panel #homebuscarforminput:active {
  color: var(--dt-text) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

.dalia-panel #homebuscarforminput::placeholder {
  color: var(--dt-faint) !important;
  opacity: 1 !important;
}

.dalia-panel #homebuscarforminput::-webkit-search-cancel-button {
  -webkit-appearance: none;
}

.dalia-panel__micshortcut {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--dt-muted);
  font-size: 17px;
  cursor: pointer;
  transition: color .12s ease, background-color .12s ease;
}

.dalia-panel__micshortcut:hover { color: var(--dt-text); background: var(--dt-hover); }

.dalia-panel__micshortcut:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 2px var(--dt-focus-ring);
}

.dalia-panel__body {
  flex: 1 1 auto;
  max-height: min(52vh, 420px);
  padding: 10px 10px 8px;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}

/* En dock el cuerpo crece hasta llenar la columna */
.dalia-panel[data-mode="dock"] .dalia-panel__body {
  max-height: none;
  min-height: 0;
}

.dalia-panel__results,
.dalia-panel #buscadorAkiponresultados {
  list-style: none;
  margin: 0 !important;
  padding: 0 !important;
}

.dalia-panel__foot {
  display: flex;
  flex: 0 0 auto;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  min-height: 40px;
  padding: 8px 16px;
  border-top: 1px solid var(--dt-border);
}

.dalia-panel__hint {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--dt-faint);
  font-size: 12px;
  line-height: 1;
}

.dalia-panel__hint--ai { margin-left: auto; }

.dalia-panel__hint kbd {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  color: var(--dt-muted);
  background: var(--dt-surface);
  border: 1px solid var(--dt-border-strong);
  border-radius: 6px;
  box-shadow: none;
  font-family: inherit;
  font-size: 11px;
  font-weight: 600;
  line-height: 1;
}

/* --------------------------------------------------------------------
 * 7 · Render del buscador (lo emite 165_appMARC.js): mismas clases que
 * en el modal retirado, re-escopadas de #exampleModal a .dalia-panel.
 * -------------------------------------------------------------------- */
.dalia-panel .dt-search-modal__label,
.dalia-panel .dropdown-header {
  display: block !important;
  margin: 4px 0 2px !important;
  padding: 8px 12px 6px !important;
  color: var(--dt-faint) !important;
  background: transparent !important;
  font-size: 12px !important;
  font-weight: 550 !important;
  letter-spacing: .01em !important;
  text-transform: none !important;
}

.dalia-panel .dt-search-modal__item,
.dalia-panel .dropdown-item,
.dalia-panel #buscadorAkiponresultados > a,
.dalia-panel #buscadorAkiponresultados a.dropdown-item {
  position: relative;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 44px;
  margin: 1px 0 !important;
  padding: 10px 12px !important;
  color: var(--dt-text) !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 10px !important;
  text-decoration: none !important;
  transition: background-color .12s ease !important;
  cursor: pointer;
}

.dalia-panel .dt-search-modal__item > .ti:first-child,
.dalia-panel .dropdown-item > .d-flex > .ti,
.dalia-panel #buscadorAkiponresultados a > .d-flex > .ti {
  flex: 0 0 auto;
  width: 20px;
  color: var(--dt-muted);
  font-size: 18px;
  text-align: center;
}

.dalia-panel .dt-search-modal__item-main,
.dalia-panel .dropdown-item .title,
.dalia-panel #buscadorAkiponresultados .title {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 14px !important;
  font-weight: 500;
  line-height: 1.35;
}

.dalia-panel .dt-search-modal__item-prefix { color: var(--dt-text); font-weight: 650; }
.dalia-panel .dt-search-modal__item-desc { color: var(--dt-faint); font-weight: 450; }

.dalia-panel .dt-search-modal__item-arrow,
.dalia-panel .dt-search-modal__item .ti-arrow-right {
  flex: 0 0 auto;
  margin-left: auto;
  color: var(--dt-faint);
  font-size: 16px;
  opacity: 0;
  transform: translateX(-2px);
  transition: opacity .12s ease, transform .12s ease;
}

.dalia-panel .dt-search-modal__item:hover,
.dalia-panel .dt-search-modal__item.is-active,
.dalia-panel .dropdown-item:hover,
.dalia-panel .dropdown-item.is-active,
.dalia-panel #buscadorAkiponresultados a:hover,
.dalia-panel #buscadorAkiponresultados a.is-active {
  color: var(--dt-text) !important;
  background: var(--dt-hover) !important;
}

.dalia-panel .dt-search-modal__item:hover .dt-search-modal__item-arrow,
.dalia-panel .dt-search-modal__item.is-active .dt-search-modal__item-arrow,
.dalia-panel .dropdown-item:hover .dt-search-modal__item-arrow,
.dalia-panel .dropdown-item.is-active .dt-search-modal__item-arrow {
  opacity: 1;
  transform: translateX(0);
}

.dalia-panel .dropdown-item .d-flex { width: 100%; gap: 12px; }

.dalia-panel .dropdown-item .badge {
  font-size: 11px !important;
  font-weight: 500 !important;
  opacity: .75;
}

.dalia-panel hr,
.dalia-panel #buscadorAkiponresultados hr {
  margin: 8px 10px !important;
  border: 0 !important;
  border-top: 1px solid var(--dt-border) !important;
  background: transparent !important;
  opacity: 1 !important;
}

.dalia-panel .dt-search-modal__empty {
  padding: 28px 16px;
  color: var(--dt-faint);
  font-size: 13px;
  text-align: center;
}

.dalia-panel .dt-search-modal__recent-row {
  display: flex;
  align-items: center;
  gap: 2px;
}

.dalia-panel .dt-search-modal__recent-row .dt-search-modal__item {
  flex: 1 1 auto;
  min-width: 0;
}

.dalia-panel .dt-search-modal__recent-del {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--dt-faint);
  cursor: pointer;
}

.dalia-panel .dt-search-modal__recent-del:hover {
  color: var(--dt-danger, #d94949);
  background: color-mix(in srgb, var(--dt-danger, #d94949) 10%, transparent);
}

.dalia-panel #buscadorAkiponresultados a.dropdown-item::after {
  /* texto alternativo vacio: sin el, los lectores de pantalla anuncian la
     flecha en cada resultado (speak:never no existe en ningun motor) */
  content: "→" / "";
  margin-left: auto;
  color: var(--dt-faint);
  font-size: 14px;
  opacity: 0;
  transform: translateX(-2px);
  transition: opacity .12s ease, transform .12s ease;
}

.dalia-panel #buscadorAkiponresultados a.dropdown-item:hover::after,
.dalia-panel #buscadorAkiponresultados a.dropdown-item.is-active::after {
  opacity: 1;
  transform: translateX(0);
}

/* --------------------------------------------------------------------
 * 8 · Vista CHAT
 * 8a · Chat NATIVO de Dalia — port del diseño de openmcp.datalyse.io
 *      (estilo ElevenLabs): asistente en texto plano sobre el lienzo,
 *      burbuja user degradada, thinking shimmer (TextShimmer), linea de
 *      escaneo en streaming, steps con tablas/graficos, composer con
 *      borde degradado, esfuerzo, historial, adjuntos y TTS.
 *      Tokens --dt-* del tema + acentos IA scoped (--dalia-ai-*).
 *      El naranja de openmcp NO se porta (contrato del CRM).
 * -------------------------------------------------------------------- */

/* Space Grotesk autohospedada (ya vivia en /fonts): SOLO dentro del panel */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url('/fonts/SpaceGrotesk.woff2') format('woff2');
}

.dalia-panel {
  --dalia-ai-cyan: #22d3ee;
  --dalia-ai-blue: #6366f1;
  --dalia-ai-violet: #8b5cf6;
  --dalia-ai-grape: #7c3aed;
  --dalia-ai-indigo: #4f46e5;
  --dalia-line: rgba(15, 15, 15, 0.09);
  --dalia-line-strong: rgba(15, 15, 15, 0.16);
  --dalia-font-display: 'Space Grotesk', Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

[data-bs-theme="dark"] .dalia-panel {
  --dalia-line: rgba(255, 255, 255, 0.09);
  --dalia-line-strong: rgba(255, 255, 255, 0.16);
}

.dalia-chat {
  position: relative;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
}

.dalia-chat[hidden] { display: none !important; }

.dalia-chat__unavailable {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  justify-content: center;
  min-height: 180px;
  padding: 28px;
  color: var(--dt-muted);
  font-family: var(--dalia-font-display);
  font-size: 15px;
  font-weight: 600;
  text-align: center;
}

.dalia-chat__unavailable[hidden] { display: none !important; }

.dalia-chat__composer[aria-disabled="true"] { opacity: .58; }

.dalia-chat__msgs {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 140px;
  padding: 14px 16px 6px;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}

/* ---- hero de estado vacio: orbe + saludo + tagline (sin Creator) ---- */
.dalia-chat__hero {
  position: absolute;
  inset: 0 0 110px;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 24px;
  text-align: center;
  pointer-events: none;
}

.dalia-chat__hero[hidden] { display: none !important; }

.dalia-chat__hero-orb.dalia-orb-mini {
  width: 54px;
  height: 54px;
  margin-bottom: 8px;
  box-shadow: 0 0 22px color-mix(in srgb, var(--dt-cyan) 40%, transparent),
              0 0 44px color-mix(in srgb, var(--dalia-ai-violet) 22%, transparent);
}

.dalia-chat__hero-greet {
  margin: 0;
  font-family: var(--dalia-font-display);
  font-size: 21px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.25;
  background: linear-gradient(105deg, var(--dt-text) 35%, var(--dalia-ai-blue) 60%, var(--dalia-ai-violet) 80%, var(--dalia-ai-cyan));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.dalia-chat__hero-tag {
  max-width: 380px;
  margin: 2px 0 0;
  color: var(--dt-muted);
  font-size: 13px;
  line-height: 1.5;
  text-wrap: balance;
}

/* Acciones de bienvenida: sugerencias -> categorias -> lista, sin tabs. */
.dalia-chat__quick-actions {
  width: min(100%, 520px);
  margin-top: 14px;
  pointer-events: auto;
}

.dalia-chat__quick-actions[hidden] { display: none !important; }

.dalia-chat__hero.is-browsing-actions {
  justify-content: flex-start;
  padding-top: 28px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}

.dalia-chat__hero.is-browsing-actions > .dalia-chat__hero-orb,
.dalia-chat__hero.is-browsing-actions > .dalia-chat__hero-greet,
.dalia-chat__hero.is-browsing-actions > .dalia-chat__hero-tag {
  display: none;
}

.dalia-chat__hero.is-browsing-actions .dalia-chat__quick-actions {
  margin-top: 0;
}

.dalia-starter__label {
  margin: 0 0 7px;
  color: var(--dt-muted);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: .02em;
  text-align: left;
  text-transform: uppercase;
}

.dalia-starter__suggestions,
.dalia-starter__categories {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.dalia-starter__action,
.dalia-starter__category,
.dalia-starter__all,
.dalia-starter__back {
  appearance: none;
  border: 1px solid var(--dt-border);
  background: var(--dt-surface);
  color: var(--dt-text);
  font: inherit;
  cursor: pointer;
}

.dalia-starter__action,
.dalia-starter__category {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 9px;
  min-height: 62px;
  padding: 9px 10px;
  border-radius: 11px;
  text-align: left;
  transition: border-color .16s ease, background-color .16s ease, transform .16s ease;
}

.dalia-starter__action:hover,
.dalia-starter__category:hover {
  border-color: var(--dt-border-strong);
  background: var(--dt-hover);
  transform: translateY(-1px);
}

.dalia-starter__icon {
  display: grid;
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  place-items: center;
  border-radius: 9px;
  background: var(--dt-surface-2);
  color: var(--dt-cta);
  font-size: 16px;
}

.dalia-starter__icon.is-compact {
  width: 28px;
  height: 28px;
  flex-basis: 28px;
  border-radius: 8px;
  font-size: 14px;
}

.dalia-starter__copy {
  display: flex;
  min-width: 0;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 2px;
}

.dalia-starter__title,
.dalia-starter__desc,
.dalia-starter__count {
  overflow: hidden;
  text-overflow: ellipsis;
}

.dalia-starter__title {
  color: var(--dt-text);
  font-size: 12.5px;
  font-weight: 650;
  line-height: 1.25;
  white-space: nowrap;
}

.dalia-starter__desc {
  display: -webkit-box;
  color: var(--dt-muted);
  font-size: 10.5px;
  line-height: 1.3;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.dalia-starter__count {
  color: var(--dt-muted);
  font-size: 10.5px;
}

.dalia-starter__arrow {
  flex: 0 0 auto;
  color: var(--dt-muted);
  font-size: 13px;
}

.dalia-starter__all {
  display: flex;
  width: 100%;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin-top: 8px;
  padding: 8px 12px;
  border-color: transparent;
  border-radius: 10px;
  background: transparent;
  color: var(--dt-cta);
  font-size: 12px;
  font-weight: 650;
}

.dalia-starter__all:hover { background: var(--dt-hover); }

.dalia-starter__header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
  text-align: left;
}

.dalia-starter__back {
  display: grid;
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  place-items: center;
  padding: 0;
  border-radius: 10px;
  color: var(--dt-muted);
}

.dalia-starter__back:hover {
  border-color: var(--dt-border-strong);
  background: var(--dt-hover);
  color: var(--dt-text);
}

.dalia-starter__header-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
}

.dalia-starter__header-copy strong {
  color: var(--dt-text);
  font-family: var(--dalia-font-display);
  font-size: 15px;
  font-weight: 650;
  line-height: 1.2;
}

.dalia-starter__header-copy span {
  overflow: hidden;
  color: var(--dt-muted);
  font-size: 11px;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dalia-starter__category {
  min-height: 52px;
  padding: 8px 9px;
}

.dalia-starter__list {
  display: grid;
  gap: 7px;
}

.dalia-starter__action.is-compact {
  min-height: 56px;
}

.dalia-starter__suggestions.is-loading { margin-top: 20px; }

.dalia-starter__skeleton {
  min-height: 62px;
  border: 1px solid var(--dt-border);
  border-radius: 11px;
  background: linear-gradient(90deg, var(--dt-surface-2), var(--dt-hover), var(--dt-surface-2));
  background-size: 220% 100%;
  animation: daliaStarterSkeleton 1.2s ease-in-out infinite;
}

@keyframes daliaStarterSkeleton {
  from { background-position: 100% 0; }
  to { background-position: -100% 0; }
}

@media (max-width: 640px) {
  .dalia-chat__hero {
    padding-right: 16px;
    padding-left: 16px;
  }
  .dalia-chat__quick-actions { margin-top: 12px; }
  .dalia-chat__hero.is-browsing-actions { padding-top: 18px; }
}

@media (max-width: 400px) {
  .dalia-starter__action,
  .dalia-starter__category { gap: 7px; padding: 8px; }
  .dalia-starter__desc { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .dalia-starter__action,
  .dalia-starter__category { transition: none; }
  .dalia-starter__action:hover,
  .dalia-starter__category:hover { transform: none; }
  .dalia-starter__skeleton { animation: none; }
}

.dalia-starter__action:focus-visible,
.dalia-starter__category:focus-visible,
.dalia-starter__all:focus-visible,
.dalia-starter__back:focus-visible {
  outline: 2px solid var(--dt-cta);
  outline-offset: 2px;
}

/* ================= MENSAJES (estilo ElevenLabs Response) ================= */

.dalia-chat__msgs .msg {
  position: relative;
  display: flex;
  gap: 10px;
  padding: 8px 0;
  animation: daliaMsgIn .36s cubic-bezier(.16, 1, .3, 1) both;
}

.dalia-chat__msgs .msg .avatar {
  flex: 0 0 auto;
  width: 24px;
  display: flex;
  justify-content: center;
  padding-top: 1px;
}

.dalia-chat__msgs .msg .avatar .dalia-orb-mini { width: 22px; height: 22px; }

.dalia-chat__msgs .msg.user .avatar { display: none; }

.dalia-chat__msgs .msg .bubble {
  flex: 1 1 auto;
  min-width: 0;
}

.dalia-chat__msgs .msg .role-row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 20px;
  margin: 0 0 3px 1px;
}

.dalia-chat__msgs .msg .role {
  color: var(--dt-faint);
  font-family: var(--dalia-font-display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}

/* acciones del mensaje (copiar / escuchar): aparecen al pasar el raton */
.msg-actions {
  display: inline-flex;
  gap: 2px;
  opacity: 0;
  transition: opacity .12s ease;
}

.dalia-chat__msgs .msg:hover .msg-actions,
.msg-actions:focus-within { opacity: 1; }

.msg-action-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--dt-faint);
  font-size: 13px;
  cursor: pointer;
  transition: color .12s ease, background-color .12s ease;
}

.msg-action-btn:hover { color: var(--dt-text); background: var(--dt-hover); }
.msg-action-btn:focus-visible { outline: 0; box-shadow: 0 0 0 2px var(--dt-focus-ring); }
.msg-listen-btn[data-playing="1"] { color: var(--dt-cta); opacity: 1; }

/* Asistente: texto plano sobre el lienzo — sin tarjeta ni globo */
.dalia-chat__msgs .msg.assistant .body {
  position: relative;
  padding: 2px 0;
  color: var(--dt-text);
  font-size: 13px;
  line-height: 1.55;
  overflow-wrap: break-word;
}

/* User: burbuja degradada violeta→indigo a la derecha (igual en ambos temas) */
.dalia-chat__msgs .msg.user { flex-direction: row-reverse; }

.dalia-chat__msgs .msg.user .bubble { max-width: min(82%, 560px); flex: 0 1 auto; }
.dalia-chat__msgs .msg.user .role-row { display: none; }

.dalia-chat__msgs .msg.user .body {
  padding: 10px 14px;
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 16px 6px 16px 16px;
  background: linear-gradient(135deg, var(--dalia-ai-grape), var(--dalia-ai-indigo));
  box-shadow: 0 10px 26px color-mix(in srgb, var(--dalia-ai-indigo) 20%, transparent);
  color: #fff;
  font-size: 13px;
  line-height: 1.5;
  overflow-wrap: break-word;
  white-space: pre-wrap;
}

.dalia-chat__msgs .msg .body > :first-child { margin-top: 0; }
.dalia-chat__msgs .msg .body > :last-child { margin-bottom: 0; }

/* boton editar ✎ de los mensajes user (hover) */
.msg-edit-btn {
  position: absolute;
  top: 50%;
  left: -26px;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--dt-faint);
  font-size: 12px;
  cursor: pointer;
  opacity: 0;
  transition: opacity .12s ease, color .12s ease, background-color .12s ease;
}

.dalia-chat__msgs .msg.user .bubble { position: relative; }
.dalia-chat__msgs .msg.user:hover .msg-edit-btn,
.msg-edit-btn:focus-visible { opacity: 1; }
.msg-edit-btn:hover { color: var(--dt-text); background: var(--dt-hover); }

/* dictado en vivo: burbuja provisional */
.dalia-chat__msgs .msg .body.is-interim { font-style: italic; opacity: .72; }

/* ================= THINKING — shimmer TextShimmer (ElevenLabs) ============ */

.ai-thinking {
  position: relative;
  display: flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  padding: 3px 0;
  color: var(--dt-muted);
}

.ai-thinking-copy {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: center;
}

/* Texto transparente + banda de brillo estrecha (--spread proporcional al
 * texto, la fija JS) barriendo de derecha a izquierda — tecnica exacta del
 * TextShimmer en que se basa el ShimmeringText de ElevenLabs. */
.ai-thinking-label {
  --dalia-shimmer-base: var(--dt-faint);
  --dalia-shimmer-hl: var(--dt-text);
  --spread: 40px;
  width: fit-content;
  max-width: 100%;
  color: var(--dalia-shimmer-base); /* fallback sin background-clip:text */
  font-family: var(--dalia-font-display);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.35;
  background-image:
    linear-gradient(90deg, transparent calc(50% - var(--spread)), var(--dalia-shimmer-hl), transparent calc(50% + var(--spread))),
    linear-gradient(var(--dalia-shimmer-base), var(--dalia-shimmer-base));
  background-size: 250% 100%, auto;
  background-repeat: no-repeat, padding-box;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: daliaThinkShine 2s linear infinite;
}

.ai-thinking-label.is-changing {
  animation: daliaThinkIn .38s cubic-bezier(.2, .8, .2, 1), daliaThinkShine 2s linear infinite;
}

.ai-thinking-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.dalia-chat__msgs .msg.is-pending .body { padding: 0; }

@keyframes daliaThinkShine {
  from { background-position: 100% center; }
  to { background-position: 0% center; }
}

@keyframes daliaThinkIn {
  from { opacity: 0; transform: translateY(5px); filter: blur(3px); }
  to { opacity: 1; transform: translateY(0); filter: blur(0); }
}

@keyframes daliaMsgIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}

/* ================= STREAMING ================= */

/* linea de escaneo cian→violeta sobre la respuesta en curso */
.dalia-chat__msgs .msg.is-streaming .bubble > .body::before {
  content: "";
  position: absolute;
  top: 0;
  left: 12%;
  width: 36%;
  height: 1px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, var(--dalia-ai-cyan), var(--dalia-ai-violet), transparent);
  filter: drop-shadow(0 0 7px color-mix(in srgb, var(--dalia-ai-cyan) 65%, transparent));
  animation: daliaStreamScan 2.2s ease-in-out infinite;
}

@keyframes daliaStreamScan {
  0%, 100% { transform: translateX(-35%); opacity: .35; }
  50% { transform: translateX(175%); opacity: 1; }
}

/* cursor con glow al final de la ultima linea */
.dalia-chat__msgs .msg.is-streaming .stream-line:last-child::after,
.dalia-chat__msgs .msg.is-streaming .stream-text:empty::after {
  content: "";
  display: inline-block;
  width: 7px;
  height: 1.05em;
  margin-left: 4px;
  vertical-align: -.16em;
  border-radius: 2px;
  background: linear-gradient(180deg, var(--dalia-ai-cyan), var(--dalia-ai-violet));
  box-shadow: 0 0 10px color-mix(in srgb, var(--dalia-ai-violet) 45%, transparent);
  animation: daliaCursorBlink 0.82s steps(1, end) infinite;
}

@keyframes daliaCursorBlink { 50% { opacity: .18; } }

.dalia-chat__msgs .msg.is-streaming .avatar .dalia-orb-mini,
.dalia-chat__msgs .msg.is-pending .avatar .dalia-orb-mini {
  animation: daliaOrbBreathe 1.6s ease-in-out infinite;
}

.stream-line { white-space: pre-wrap; overflow-wrap: break-word; }

/* placeholder "Generando codigo/tabla…" mientras el fence esta a medio llegar */
.stream-loading {
  width: fit-content;
  margin: 8px 0;
  padding: 6px 12px;
  border: 1px dashed var(--dalia-line-strong);
  border-radius: 10px;
  color: var(--dt-muted);
  font-size: 12px;
  background:
    linear-gradient(105deg, transparent 40%, color-mix(in srgb, var(--dalia-ai-violet) 12%, transparent) 50%, transparent 60%)
    0 0 / 220% 100% no-repeat;
  animation: daliaShimmer 1.6s linear infinite;
}

/* error del turno */
.dalia-chat__msgs .msg.is-error .body {
  padding: 9px 12px;
  border: 1px solid color-mix(in srgb, #ef4444 45%, transparent);
  border-radius: 12px;
  background: color-mix(in srgb, #ef4444 7%, transparent);
}

/* Pushes tipados: el cuerpo del mensaje es idéntico al de Dalia;
   solo destaca el icono de tipo (warning/error/…) en la cabecera. */
.dalia-chat__msgs .msg.is-push .msg-type-icon {
  flex: 0 0 auto;
  font-size: 14px;
  line-height: 1;
}
.dalia-chat__msgs .msg.is-push.is-success .msg-type-icon { color: #16a34a; }
.dalia-chat__msgs .msg.is-push.is-warning .msg-type-icon { color: #d97706; }
.dalia-chat__msgs .msg.is-push.is-error .msg-type-icon,
.dalia-chat__msgs .msg.is-push.is-critical .msg-type-icon { color: #ef4444; }
.dalia-chat__msgs .msg.is-push.is-critical .msg-type-icon {
  filter: drop-shadow(0 0 4px color-mix(in srgb, #ef4444 55%, transparent));
}

/* render bufferizado (modelo auto/cloudflare): cascada blur→nitido */
.print-in > * { animation: daliaPrint .36s cubic-bezier(.16, 1, .3, 1) backwards; }
.print-in > *:nth-child(2) { animation-delay: 60ms; }
.print-in > *:nth-child(3) { animation-delay: 120ms; }
.print-in > *:nth-child(4) { animation-delay: 180ms; }
.print-in > *:nth-child(5) { animation-delay: 240ms; }
.print-in > *:nth-child(6) { animation-delay: 300ms; }
.print-in > *:nth-child(7) { animation-delay: 360ms; }
.print-in > *:nth-child(8) { animation-delay: 420ms; }
.print-in > *:nth-child(9) { animation-delay: 480ms; }
.print-in > *:nth-child(10) { animation-delay: 540ms; }

@keyframes daliaPrint {
  from { opacity: 0; transform: translateY(6px); filter: blur(7px); }
  to { opacity: 1; transform: none; filter: blur(0); }
}

@keyframes daliaFadeUp {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: none; }
}

/* ================= MARKDOWN ================= */

.dalia-chat__msgs .md-p { margin: .5em 0; }
.dalia-chat__msgs h3.md-h {
  margin: 14px 0 5px;
  font-family: var(--dalia-font-display);
  font-size: 15px;
  font-weight: 650;
  letter-spacing: -0.01em;
}
.dalia-chat__msgs h4.md-h {
  margin: 11px 0 4px;
  font-family: var(--dalia-font-display);
  font-size: 13.5px;
  font-weight: 650;
  letter-spacing: -0.01em;
}
.dalia-chat__msgs .md-list { margin: 0 0 10px; padding-left: 20px; }
.dalia-chat__msgs ul.md-list { list-style: disc; }
.dalia-chat__msgs ul.md-list ul.md-list { list-style: circle; }
.dalia-chat__msgs ol.md-list { list-style: decimal; }
.dalia-chat__msgs .md-list li { margin: 3px 0; }
.dalia-chat__msgs .md-list .md-list { margin: 3px 0 0; }
.dalia-chat__msgs .md-list li::marker { color: var(--dt-faint); }
.dalia-chat__msgs .md-quote {
  margin: 0 0 10px;
  padding: 2px 0 2px 11px;
  border-left: 2px solid var(--dt-border-strong);
  color: var(--dt-muted);
}
.dalia-chat__msgs hr.md-hr { border: none; border-top: 1px solid var(--dt-border); margin: 12px 0; }
.dalia-chat__msgs .msg.assistant .body a { color: var(--dt-link); text-decoration: none; border-bottom: 1px solid transparent; transition: border-color .12s; }
.dalia-chat__msgs .msg.assistant .body a:hover { border-bottom-color: var(--dt-link); }
.dalia-chat__msgs .msg .body strong { font-weight: 650; }
.dalia-chat__msgs .msg .body code {
  padding: 1px 5px;
  border-radius: 5px;
  background: var(--dt-surface-2);
  font-size: 12px;
}

/* tabla markdown del texto */
.chat-table-wrap { margin: 8px 0; overflow-x: auto; scrollbar-width: thin; }
.chat-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
  line-height: 1.4;
}
.chat-table th {
  padding: 6px 8px;
  border-bottom: 1px solid var(--dt-border-strong);
  color: var(--dt-muted);
  font-size: 10.5px;
  font-weight: 650;
  letter-spacing: .04em;
  text-align: left;
  text-transform: uppercase;
  white-space: nowrap;
}
.chat-table td {
  padding: 6px 8px;
  border-bottom: 1px solid var(--dt-border);
  color: var(--dt-text);
  vertical-align: top;
}
.chat-table tbody tr:last-child td { border-bottom: none; }
.chat-table tbody tr:hover { background: var(--dt-hover); }

/* ---- bloques de codigo / html / graficos ---- */
.code-wrap, .html-block, .echart-wrap {
  margin: 8px 0;
  border: 1px solid var(--dt-border);
  border-radius: 10px;
  background: var(--dt-surface-2);
  overflow: hidden;
}

.block-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 5px 8px 5px 10px;
  border-bottom: 1px solid var(--dt-border);
}

.block-header .lang-label {
  color: var(--dt-muted);
  font-family: var(--dalia-font-display);
  font-size: 10.5px;
  font-weight: 650;
  letter-spacing: .05em;
  text-transform: uppercase;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.copy-btn, .data-btn {
  flex: 0 0 auto;
  padding: 3px 9px;
  border: 1px solid var(--dt-border-strong);
  border-radius: 7px;
  background: var(--dt-surface);
  color: var(--dt-muted);
  font-size: 11px;
  font-weight: 550;
  cursor: pointer;
  transition: color .12s ease, background-color .12s ease, border-color .12s ease;
}
.copy-btn:hover, .data-btn:hover { color: var(--dt-text); background: var(--dt-hover); }
.copy-btn:focus-visible, .data-btn:focus-visible { outline: 0; box-shadow: 0 0 0 2px var(--dt-focus-ring); }
.data-btn:disabled { opacity: .45; cursor: default; }
.data-btn[hidden] { display: none !important; }

pre.code-block, pre.html-code {
  margin: 0;
  padding: 10px 12px;
  overflow: auto;
  font-size: 12px;
  line-height: 1.45;
  scrollbar-width: thin;
}

.tab-group { display: inline-flex; gap: 2px; }
.tab-btn {
  padding: 3px 9px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--dt-muted);
  font-size: 11px;
  font-weight: 550;
  cursor: pointer;
  transition: color .12s ease, background-color .12s ease;
}
.tab-btn:hover { color: var(--dt-text); }
.tab-btn.active { color: var(--dt-text); background: var(--dt-active); }

iframe.html-preview {
  display: block;
  width: 100%;
  height: 220px;
  border: 0;
  background: #fff;
}

.echart-container { min-height: 220px; }
.echart-error { padding: 12px; color: var(--dt-warning, #b86513); font-size: 12px; }

/* ================= STEPS (tarjetas de herramientas) ================= */

.steps, .stream-steps { display: flex; flex-direction: column; gap: 6px; }
.stream-steps:empty { display: none; }

.step {
  border: 1px solid var(--dt-border);
  border-radius: 12px;
  background: color-mix(in srgb, var(--dt-surface-2) 55%, transparent);
  font-size: 12px;
}

.step-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 11px;
}

.step-head .icon { width: 13px; height: 13px; color: var(--dalia-ai-violet); flex-shrink: 0; }
.step-head .name { font-weight: 600; color: var(--dt-text); }

/* chip "pensando/generando": shimmer en el texto + icono girando */
.step.step-pending .step-head .icon { animation: daliaSpin 2.6s linear infinite; }
.step.step-pending .step-head .name {
  background: linear-gradient(105deg, var(--dt-muted) 30%, var(--dt-text) 50%, var(--dt-muted) 70%);
  background-size: 220% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: daliaShimmer 1.7s linear infinite;
}

@keyframes daliaSpin { to { transform: rotate(360deg); } }

.step-body { padding: 4px 11px 10px; }
.step.step-headless .step-body { padding-top: 10px; }
.step-body .label {
  margin: 8px 0 4px;
  color: var(--dt-faint);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.step-body .label:first-child { margin-top: 2px; }

/* ---- tabla de datos con filtro/orden/paginacion/CSV ---- */
.data-table-wrap { display: flex; flex-direction: column; gap: 6px; }

.data-table-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}

.data-table-meta { color: var(--dt-muted); font-size: 11px; }
.data-table-actions { display: flex; gap: 6px; align-items: center; }

.data-filter {
  width: 130px;
  padding: 3px 9px;
  border: 1px solid var(--dt-border-strong);
  border-radius: 7px;
  background: var(--dt-surface);
  color: var(--dt-text);
  font-size: 11px;
  outline: 0;
}
.data-filter:focus { box-shadow: 0 0 0 2px var(--dt-focus-ring); }
.data-filter[hidden] { display: none !important; }
.data-filter::placeholder { color: var(--dt-faint); }

.data-table-host { overflow-x: auto; scrollbar-width: thin; border: 1px solid var(--dt-border); border-radius: 8px; }
.data-table-host table.data-table { margin: 0; }
.data-table-host table.data-table th { position: sticky; top: 0; background: var(--dt-surface-2); z-index: 1; }
.data-table-host table.data-table td {
  max-width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.data-table-host table.data-table td.cell-expanded {
  max-width: none;
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
}
.data-table-host table.data-table th.th-sortable { cursor: pointer; user-select: none; transition: color .12s; }
.data-table-host table.data-table th.th-sortable:hover { color: var(--dt-text); }
.data-table-host table.data-table th[data-sort] { color: var(--dt-text); }
.data-table-host table.data-table th[data-sort]::after { content: "▲"; margin-left: 4px; font-size: 8px; }
.data-table-host table.data-table th[data-sort="desc"]::after { content: "▼"; }
.data-table-host table.data-table tbody tr:nth-child(even) { background: color-mix(in srgb, var(--dt-text) 2%, transparent); }
.data-table-host table.data-table tbody tr:hover { background: var(--dt-hover); }

.data-table .cell-chip {
  display: inline-block;
  margin: 0 3px 2px 0;
  padding: 1px 7px;
  border-radius: 999px;
  background: hsl(var(--chip-h, 210) 60% 50% / 0.14);
  border: 1px solid hsl(var(--chip-h, 210) 60% 50% / 0.28);
  font-size: 11px;
}
.data-table .cell-chip.soft {
  background: var(--dt-hover);
  border-color: var(--dt-border);
}
.data-table .cell-bool.yes { color: var(--dt-success, #16835b); font-weight: 600; }
.data-table .cell-bool.no { color: var(--dt-faint); }
.data-table .cell-phone { white-space: nowrap; font-variant-numeric: tabular-nums; }
.data-table .cell-link { color: var(--dt-link); text-decoration: none; }
.data-table .cell-link:hover { text-decoration: underline; }
.data-table .cell-actions { text-align: right; width: 1%; white-space: nowrap; }

.data-table .row-btn {
  padding: 1px 6px;
  margin-left: 2px;
  border: 1px solid var(--dt-border);
  border-radius: 6px;
  background: transparent;
  color: var(--dt-muted);
  font-size: 11px;
  cursor: pointer;
  opacity: 0;
  transition: opacity .12s, color .12s, border-color .12s;
}
.data-table tbody tr:hover .row-btn { opacity: 1; }
.data-table .row-btn:hover { color: var(--dt-cta); border-color: var(--dt-border-strong); }
@media (hover: none) { .data-table .row-btn { opacity: 1; } }

.data-table-pager { display: flex; gap: 6px; justify-content: flex-end; }

/* filas nuevas entran en cascada corta */
.stagger-in tr { animation: daliaFadeUp .3s cubic-bezier(.16, 1, .3, 1) backwards; }
.stagger-in tr:nth-child(1) { animation-delay: 0ms; }
.stagger-in tr:nth-child(2) { animation-delay: 25ms; }
.stagger-in tr:nth-child(3) { animation-delay: 50ms; }
.stagger-in tr:nth-child(4) { animation-delay: 75ms; }
.stagger-in tr:nth-child(5) { animation-delay: 100ms; }
.stagger-in tr:nth-child(6) { animation-delay: 125ms; }
.stagger-in tr:nth-child(7) { animation-delay: 150ms; }
.stagger-in tr:nth-child(8) { animation-delay: 175ms; }

/* ================= QUICK REPLIES (fence suggest) ================= */

.quick-replies { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.quick-replies[data-used] { opacity: .55; pointer-events: none; }

.qr-ask { color: var(--dt-muted); font-size: 12px; }

.qr-level { display: flex; flex-direction: column; gap: 8px; }
.qr-chips { display: flex; flex-wrap: wrap; gap: 6px; }

.qr-btn {
  padding: 5px 12px;
  border: 1px solid var(--dt-border-strong);
  border-radius: 999px;
  background: var(--dt-surface);
  color: var(--dt-text);
  font-size: 12px;
  cursor: pointer;
  transition: color .12s, background-color .12s, border-color .12s, box-shadow .12s;
}
.qr-btn:hover { border-color: var(--dalia-ai-violet); box-shadow: 0 0 0 1px color-mix(in srgb, var(--dalia-ai-violet) 35%, transparent); }
.qr-btn:focus-visible { outline: 0; box-shadow: 0 0 0 2px var(--dt-focus-ring); }
.qr-btn.active {
  border-color: var(--dalia-ai-indigo);
  background: color-mix(in srgb, var(--dalia-ai-indigo) 12%, var(--dt-surface));
}
.qr-btn.qr-confirm {
  border-color: var(--dt-cta);
  background: var(--dt-cta);
  color: var(--dt-cta-fg);
  font-weight: 600;
}
.qr-btn.qr-confirm:hover { background: var(--dt-cta-hover); }
.qr-btn.qr-more, .qr-btn.qr-all { color: var(--dt-muted); }
.qr-btn.qr-parent::after { content: " ›"; color: var(--dt-faint); }

.qr-sub { padding-left: 10px; border-left: 2px solid var(--dt-border); }
.qr-sub[hidden] { display: none !important; }

.qr-select {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 8px;
  border: 1px solid var(--dt-border);
  border-radius: 10px;
  background: var(--dt-surface);
}
.qr-select[hidden] { display: none !important; }

.qr-search {
  padding: 5px 10px;
  border: 1px solid var(--dt-border-strong);
  border-radius: 8px;
  background: var(--dt-surface);
  color: var(--dt-text);
  font-size: 12px;
  outline: 0;
}
.qr-search:focus { box-shadow: 0 0 0 2px var(--dt-focus-ring); }

.qr-list { display: flex; flex-direction: column; max-height: 180px; overflow: auto; scrollbar-width: thin; }
.qr-item {
  display: flex;
  flex-direction: column;
  gap: 1px;
  padding: 6px 8px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--dt-text);
  font-size: 12px;
  text-align: left;
  cursor: pointer;
}
.qr-item:hover, .qr-item.active { background: var(--dt-hover); }
.qr-item[hidden] { display: none !important; }
.qr-item-desc { color: var(--dt-faint); font-size: 11px; }

/* ================= TTS: barrido de iluminacion ================= */

/* Karaoke PALABRA A PALABRA mientras Dalia habla. Un degradado horizontal con
 * background-clip:text sobre el bloque avanzaba por COLUMNAS y encendia las
 * dos lineas de un parrafo a la vez; con un span por palabra (.tts-w, los pone
 * y los quita el JS) el avance sigue el orden de lectura. Lo aun no dicho se
 * atenua; lo dicho se enciende en violeta. */
.dalia-chat__msgs .msg.assistant .body.is-speaking .tts-w {
  color: var(--dt-muted);
  transition: color .18s ease;
}

.dalia-chat__msgs .msg.assistant .body.is-speaking .tts-w.is-said {
  color: var(--dalia-ai-violet);
}

.voice-transcript {
  margin: 0 0 8px;
  padding: 7px 12px;
  border: 1px solid var(--dt-border);
  border-radius: 12px;
  background: var(--dt-surface);
  box-shadow: var(--dt-pop-shadow);
  font-size: 12px;
  line-height: 1.5;
  animation: daliaFadeUp .22s cubic-bezier(.16, 1, .3, 1);
}

/* resaltado por progreso: --p lo actualiza el timeupdate del audio —
 * un solo gradiente con corte duro, cero reflow */
.voice-transcript-text {
  background: linear-gradient(90deg, var(--dt-text) var(--p, 0%), var(--dt-faint) var(--p, 0%));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

#daliaTtsMute .dalia-tts-off { display: none; }
#daliaTtsMute[data-muted="1"] .dalia-tts-on { display: none; }
#daliaTtsMute[data-muted="1"] .dalia-tts-off { display: inline-block; }
#daliaTtsMute[data-muted="1"] { color: var(--dt-faint); }

/* ================= COLA + BANNER DE EDICION + ADJUNTOS ================= */

.msg-queue {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0 0 8px;
}
.msg-queue-title { color: var(--dt-faint); font-size: 10.5px; font-weight: 650; letter-spacing: .05em; text-transform: uppercase; }
.msg-queue-chip {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 6px 4px 10px;
  border: 1px dashed var(--dt-border-strong);
  border-radius: 9px;
  color: var(--dt-muted);
  font-size: 12px;
}
.msg-queue-chip span { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.msg-queue-x {
  flex: 0 0 auto;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--dt-faint);
  font-size: 11px;
  cursor: pointer;
}
.msg-queue-x:hover { color: var(--dt-text); background: var(--dt-hover); }

.edit-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 0 0 8px;
  padding: 6px 10px;
  border: 1px solid color-mix(in srgb, var(--dt-warning, #b86513) 45%, transparent);
  border-radius: 10px;
  background: color-mix(in srgb, var(--dt-warning, #b86513) 8%, transparent);
  color: var(--dt-text);
  font-size: 12px;
}
.edit-banner-cancel {
  flex: 0 0 auto;
  padding: 2px 9px;
  border: 1px solid var(--dt-border-strong);
  border-radius: 7px;
  background: var(--dt-surface);
  color: var(--dt-muted);
  font-size: 11px;
  cursor: pointer;
}
.edit-banner-cancel:hover { color: var(--dt-text); background: var(--dt-hover); }

/* strip de adjuntos pendientes sobre el composer */
.dalia-chat__attachstrip {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 8px;
}
.dalia-chat__attachstrip[hidden] { display: none !important; }

.attach-chip {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 6px;
  border: 1px solid var(--dt-border);
  border-radius: 10px;
  background: var(--dt-surface);
  max-width: min(220px, 100%); /* con el dock estrecho manda el ancho del panel */
  min-width: 0;
}
/* chip pintado en cuanto eliges el fichero: la subida va por detras */
.attach-chip.is-uploading { opacity: .62; }
.attach-chip.is-uploading .attach-size { animation: daliaAttachPulse 1.2s ease-in-out infinite; }
@keyframes daliaAttachPulse { 0%, 100% { opacity: .55; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .attach-chip.is-uploading .attach-size { animation: none; }
}
.attach-thumb {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 30px;
  height: 30px;
  border-radius: 7px;
  background: var(--dt-surface-2);
  color: var(--dt-faint);
  font-size: 9px;
  font-weight: 700;
  overflow: hidden;
}
.attach-thumb img { width: 100%; height: 100%; object-fit: cover; }
.attach-meta { display: flex; flex-direction: column; min-width: 0; }
.attach-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11.5px; color: var(--dt-text); }
.attach-size { font-size: 10.5px; color: var(--dt-faint); }
.attach-remove {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--dt-faint);
  font-size: 11px;
  cursor: pointer;
}
.attach-remove:hover { color: var(--dt-text); background: var(--dt-hover); }

/* chips de adjuntos dentro de un mensaje user ya enviado */
.msg-attachments { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.msg-attach-chip {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 8px 4px 6px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  text-decoration: none;
  max-width: 220px;
}
.msg-attach-chip .attach-thumb { width: 24px; height: 24px; background: rgba(255, 255, 255, 0.16); color: #fff; }
.msg-attach-chip .attach-name { color: #fff; }
.msg-attach-chip .attach-size { color: rgba(255, 255, 255, 0.7); }

/* el composer acepta drag&drop de ficheros */
.dalia-chat__composer.drag-over .dalia-chat__box {
  outline: 2px dashed var(--dalia-ai-cyan);
  outline-offset: 3px;
}

/* ================= HISTORIAL (overlay sobre el pane) ================= */

.dalia-chat__history {
  position: absolute;
  inset: 0;
  z-index: 6;
  display: flex;
  flex-direction: column;
  background: var(--dt-overlay);
  animation: daliaFadeUp .18s cubic-bezier(.16, 1, .3, 1);
}
.dalia-chat__history[hidden] { display: none !important; }

.dalia-chat__history-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 12px 8px 16px;
  border-bottom: 1px solid var(--dt-border);
}
.dalia-chat__history-title {
  font-family: var(--dalia-font-display);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -0.01em;
}
.dalia-chat__history-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  scrollbar-width: thin;
  padding: 8px;
}
.dalia-hist-row {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 8px 10px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  text-align: left;
  cursor: pointer;
  transition: background-color .12s;
}
.dalia-hist-row:hover { background: var(--dt-hover); }
.dalia-hist-row.is-current { background: var(--dt-active); }
.dalia-hist-meta { display: flex; flex: 1 1 auto; min-width: 0; flex-direction: column; gap: 1px; }
.dalia-hist-title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--dt-text);
  font-size: 12.5px;
  font-weight: 550;
}
.dalia-hist-date { color: var(--dt-faint); font-size: 11px; }
.dalia-hist-del {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  border-radius: 7px;
  color: var(--dt-faint);
  font-size: 13px;
  opacity: 0;
  transition: opacity .12s, color .12s, background-color .12s;
}
.dalia-hist-row:hover .dalia-hist-del { opacity: 1; }
.dalia-hist-del:hover { color: #ef4444; background: var(--dt-hover); }
.dalia-hist-empty { padding: 24px 12px; color: var(--dt-faint); font-size: 12.5px; text-align: center; }

/* ================= COMPOSER (caja flotante con borde degradado) ========== */

.dalia-chat__composer {
  position: relative;
  z-index: 2;
  flex: 0 0 auto;
  padding: 8px 12px 12px;
}

.dalia-chat__box {
  position: relative;
  border: 1px solid var(--dt-border-strong);
  border-radius: 18px;
  background: var(--dt-surface); /* CONSTANTE en rest/hover/focus (contrato) */
  transition: box-shadow .2s ease, transform .2s ease;
}

/* borde degradado animado (mask xor): sutil en reposo, vivo con foco */
.dalia-chat__box::before {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: 19px;
  padding: 1px;
  background: linear-gradient(110deg, var(--dalia-ai-blue), var(--dalia-ai-violet) 50%, var(--dalia-ai-cyan));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
  opacity: .3;
  pointer-events: none;
  transition: opacity .2s ease;
}

.dalia-chat__box:hover::before { opacity: .5; }
.dalia-chat__box:focus-within::before { opacity: .9; }

.dalia-chat__box:focus-within {
  transform: translateY(-1px);
  box-shadow: 0 12px 34px color-mix(in srgb, var(--dalia-ai-indigo) 12%, transparent);
}

.dalia-chat__field {
  display: flex;
  align-items: flex-end;
  padding: 8px 12px 2px 14px;
}

.dalia-chat__input,
.dalia-chat #daliaChatInput {
  flex: 1 1 auto;
  min-width: 0;
  max-height: 120px;
  margin: 0 !important;
  padding: 2px 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
  color: var(--dt-text) !important;
  font: inherit !important;
  font-size: 13.5px !important;
  line-height: 1.4 !important;
  resize: none;
  overflow-y: auto;
  scrollbar-width: thin;
}

.dalia-chat #daliaChatInput:hover,
.dalia-chat #daliaChatInput:focus,
.dalia-chat #daliaChatInput:active {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

.dalia-chat #daliaChatInput::placeholder {
  color: var(--dt-faint) !important;
  opacity: 1 !important;
}

.dalia-chat__toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  padding: 4px 6px 6px;
  min-width: 0; /* sin esto los hijos flex no bajan de su contenido y desbordan */
}

/* Con el dock muy estrecho el chip de esfuerzo se salia del panel: el lado
   izquierdo encoge (y el chip recorta con puntos suspensivos) y el derecho
   —mic, voz y enviar— no se toca nunca. */
.dalia-chat__toolbar-side {
  display: flex;
  align-items: center;
  gap: 2px;
  min-width: 0;
}
.dalia-chat__toolbar-side:first-child { flex: 0 1 auto; overflow: hidden; }
.dalia-chat__toolbar-side + .dalia-chat__toolbar-side { flex: 0 0 auto; }

.dalia-chat__iconbtn {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--dt-muted);
  font-size: 15px;
  cursor: pointer;
  transition: color .12s ease, background-color .12s ease;
}

.dalia-chat__iconbtn:hover { color: var(--dt-text); background: var(--dt-hover); }

/* Mic activo: sesion de voz en curso dentro del chat */
.dalia-chat__iconbtn[aria-pressed="true"] {
  background: var(--dt-cta);
  color: var(--dt-cta-fg);
}

/* chip de esfuerzo */
.dalia-chat__chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 28px;
  padding: 0 10px;
  border: 1px solid var(--dt-border-strong);
  border-radius: 999px;
  background: transparent;
  color: var(--dt-muted);
  font-size: 11.5px;
  font-weight: 550;
  cursor: pointer;
  transition: color .12s, background-color .12s, border-color .12s;
  flex: 0 1 auto;
  min-width: 0;
  max-width: 100%;
  white-space: nowrap;
}
/* el icono manda su tamaño; el texto es lo que se recorta */
.dalia-chat__chip > i { flex: 0 0 auto; }
.dalia-chat__chip > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dalia-chat__chip:hover, .dalia-chat__chip.active { color: var(--dt-text); background: var(--dt-hover); }
.dalia-chat__chip[hidden] { display: none !important; }

.dalia-chat__send {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  margin-left: 4px;
  border: 0;
  border-radius: 10px;
  background: var(--dt-cta);
  color: var(--dt-cta-fg);
  font-size: 15px;
  cursor: pointer;
  transition: background-color .12s ease, box-shadow .2s ease;
}

.dalia-chat__send:hover { background: var(--dt-cta-hover); }

.dalia-chat__iconbtn:focus-visible,
.dalia-chat__chip:focus-visible,
.dalia-chat__send:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 2px var(--dt-focus-ring);
}

/* turno en vuelo: la flecha se convierte en STOP y el boton late */
.dalia-chat__send .dalia-send-stop { display: none; }
.dalia-panel[data-sending="y"] .dalia-chat__send .dalia-send-arrow { display: none; }
.dalia-panel[data-sending="y"] .dalia-chat__send .dalia-send-stop { display: inline-block; }
.dalia-panel[data-sending="y"] .dalia-chat__send {
  animation: daliaSendPulse 1.4s ease-in-out infinite;
}

@keyframes daliaSendPulse {
  0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--dalia-ai-violet) 45%, transparent); }
  50% { box-shadow: 0 0 0 6px transparent; }
}

/* ================= POPOVER SELECTOR DE MODELO (lista) ================= */

.dalia-chat__effort {
  position: absolute;
  left: 8px;
  bottom: calc(100% + 8px);
  z-index: 7;
  border: 1px solid var(--dt-border);
  border-radius: 12px;
  background: var(--dt-overlay);
  box-shadow: var(--dt-pop-shadow);
  animation: daliaFadeUp .16s cubic-bezier(.16, 1, .3, 1);
}
.dalia-chat__effort[hidden] { display: none !important; }

.effort-panel { padding: 10px 8px 8px; min-width: 240px; max-width: 320px; }
.effort-head {
  margin: 0 6px 8px;
  font-family: var(--dalia-font-display);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--dt-text);
}
.effort-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
  max-height: min(320px, 44vh);
  overflow: auto;
  scrollbar-width: thin;
}
.effort-row {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 7px 10px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--dt-text);
  font-size: 12.5px;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
  transition: background-color .12s;
}
.effort-row:hover { background: var(--dt-hover); }
.effort-row.is-current { background: var(--dt-active); }
.effort-row:focus-visible { outline: none; box-shadow: 0 0 0 2px var(--dt-focus-ring); }
.effort-row__name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.effort-row__badge {
  flex: 0 0 auto;
  padding: 1px 6px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--dalia-ai-violet) 14%, transparent);
  color: var(--dalia-ai-violet);
  font-size: 10px;
  font-weight: 600;
}
.effort-row__check { flex: 0 0 auto; font-size: 13px; color: var(--dalia-ai-violet); visibility: hidden; }
.effort-row.is-current .effort-row__check { visibility: visible; }

/* --------------------------------------------------------------------
 * 8b · Altura y expansion del chat nativo
 * -------------------------------------------------------------------- */
.dalia-panel[data-mode="pop"] .dalia-panel__pane[data-dalia-pane="chat"] {
  height: min(72vh, 640px);
  transition: height .22s ease;
}

/* Push: crece con el aviso, tope < altura normal (la flecha Maximizar completa) */
.dalia-panel[data-mode="pop"][data-size="compact"] .dalia-panel__pane[data-dalia-pane="chat"] {
  height: var(--dalia-compact-h, min(28vh, 240px));
  max-height: min(48vh, 420px);
}

.dalia-chat__expandrow {
  display: flex;
  flex: 0 0 auto;
  justify-content: flex-end;
  align-items: center;
  padding: 0 12px 2px;
}

.dalia-chat__expandrow[hidden] { display: none !important; }

.dalia-chat__expandbtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: 1px solid var(--dt-border);
  border-radius: 8px;
  background: var(--dt-surface);
  color: var(--dt-muted);
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  transition: color .12s ease, background-color .12s ease, border-color .12s ease;
}

.dalia-chat__expandbtn:hover {
  color: var(--dt-text);
  border-color: var(--dt-border-strong);
  background: var(--dt-hover);
}

/* --------------------------------------------------------------------
 * 9 · Vista VOICE: orbe (estilo ui.elevenlabs, paleta casa) + transcripcion
 * -------------------------------------------------------------------- */
.dalia-voice-orb {
  position: relative;
  flex: 0 0 auto;
  width: 96px;
  height: 96px;
  border-radius: 50%;
  transition: transform .25s ease;
}

/* Orbe canvas (renderer fluido de 165_appDALIA.js; los gradientes CSS de
   debajo quedan como fallback sin canvas / reduced-motion) */
.dalia-voice-orb__canvas {
  position: absolute;
  inset: 0;
  display: none;
  width: 100%;
  height: 100%;
  border-radius: 50%;
}

.dalia-voice-orb.has-canvas .dalia-voice-orb__canvas { display: block; }
.dalia-voice-orb.has-canvas .dalia-voice-orb__swirl { display: none; }
.dalia-voice-orb.has-canvas::before { background: none; }

/* En dock hay sitio: orbe mas grande */
.dalia-panel[data-mode="dock"] .dalia-voice-orb {
  width: 120px;
  height: 120px;
}

/* Nucleo esfera */
.dalia-voice-orb::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background:
    radial-gradient(circle at 32% 28%, rgba(255, 255, 255, .85), transparent 30%),
    radial-gradient(circle at 68% 74%, color-mix(in srgb, var(--dt-coral) 75%, transparent), transparent 44%),
    conic-gradient(from 25deg, var(--dt-blue), var(--dt-cyan) 38%, var(--dt-coral) 70%, var(--dt-blue));
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, .35),
    0 6px 26px color-mix(in srgb, var(--dt-blue) 22%, transparent);
  transition: box-shadow .25s ease;
}

/* Remolino interior: conic translucido gigante rotando, recortado al circulo */
.dalia-voice-orb__swirl {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  overflow: hidden;
}

.dalia-voice-orb__swirl::before {
  content: "";
  position: absolute;
  inset: -40%;
  background: conic-gradient(from 0deg,
    transparent 0 14%,
    color-mix(in srgb, var(--dt-cyan) 55%, transparent) 26%,
    transparent 40%,
    color-mix(in srgb, var(--dt-coral) 45%, transparent) 58%,
    transparent 72%,
    color-mix(in srgb, var(--dt-blue) 50%, transparent) 86%,
    transparent);
  filter: blur(12px);
  animation: daliaOrbSwirl 9s linear infinite;
}

/* Anillo fino interior */
.dalia-voice-orb::after {
  content: "";
  position: absolute;
  inset: 7px;
  border: 1px solid rgba(255, 255, 255, .5);
  border-radius: 50%;
  filter: blur(.2px);
}

.dalia-voice-orb__ring {
  position: absolute;
  inset: -6px;
  border: 1.5px solid color-mix(in srgb, var(--dt-cyan) 55%, transparent);
  border-radius: 50%;
  opacity: 0;
  transform: scale(.92);
  pointer-events: none;
}

@keyframes daliaOrbSwirl {
  to { transform: rotate(360deg); }
}

/* LISTENING: remolino rapido + ripples + glow cian */
.dalia-panel[data-voice-state="listening"] .dalia-voice-orb__swirl::before {
  animation-duration: 3.4s;
}

.dalia-panel[data-voice-state="listening"] .dalia-voice-orb::before {
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, .4),
    0 8px 34px color-mix(in srgb, var(--dt-cyan) 34%, transparent);
}

.dalia-panel[data-voice-state="listening"] .dalia-voice-orb__ring--a {
  animation: daliaVoiceRipple 1.7s ease-out infinite;
}

.dalia-panel[data-voice-state="listening"] .dalia-voice-orb__ring--b {
  animation: daliaVoiceRipple 1.7s ease-out .85s infinite;
}

@keyframes daliaVoiceRipple {
  0%   { opacity: .55; transform: scale(.92); }
  100% { opacity: 0; transform: scale(1.55); }
}

/* SPEAKING: latido de amplitud + glow coral */
.dalia-panel[data-voice-state="speaking"] .dalia-voice-orb {
  animation: daliaVoiceSpeak .92s ease-in-out infinite;
}

.dalia-panel[data-voice-state="speaking"] .dalia-voice-orb__swirl::before {
  animation-duration: 2.2s;
  filter: blur(10px) saturate(1.3);
}

.dalia-panel[data-voice-state="speaking"] .dalia-voice-orb::before {
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, .4),
    0 10px 38px color-mix(in srgb, var(--dt-coral) 30%, transparent);
}

@keyframes daliaVoiceSpeak {
  0%, 100% { transform: scale(1); }
  30%      { transform: scale(1.06); }
  60%      { transform: scale(.985); }
}

.dalia-voice-status {
  margin: 0;
  color: var(--dt-muted);
  font-size: 13px;
  font-weight: 550;
  text-align: center;
}

.dalia-panel[data-voice-state="listening"] .dalia-voice-status,
.dalia-panel[data-voice-state="speaking"] .dalia-voice-status {
  color: var(--dt-text);
}

/* Estado "pensando": shimmer sobre el texto (patron shimmering-text) */
.dalia-voice-status.is-shimmer {
  background: linear-gradient(105deg, var(--dt-muted) 30%, var(--dt-text) 45%, var(--dt-cyan) 51%, var(--dt-coral) 56%, var(--dt-muted) 70%);
  background-size: 220% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: daliaShimmer 1.7s linear infinite;
}

/* Transcripcion en vivo (DaliaPanel.transcript) */
.dalia-voice-transcript {
  width: 100%;
  max-width: 420px;
  max-height: 120px;
  overflow: auto;
  color: var(--dt-muted);
  font-size: 13px;
  line-height: 1.5;
  text-align: center;
  overscroll-behavior: contain;
}

.dalia-voice-transcript:empty { display: none; }

.dalia-voice-transcript p {
  margin: 0 0 4px;
  color: var(--dt-text);
}

/* Turnos de la transcripcion (patron transcript-viewer): tu voz vs Dalia */
.dalia-voice-transcript p.is-dalia { color: var(--dt-muted); }

.dalia-voice-transcript .is-interim {
  color: var(--dt-muted);
  font-style: italic;
  opacity: .8;
}

.dalia-voice-mic {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border: 1px solid var(--dt-border-strong);
  border-radius: 50%;
  background: var(--dt-surface);
  color: var(--dt-text);
  font-size: 19px;
  cursor: pointer;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease, transform .15s ease;
}

.dalia-voice-mic:hover { background: var(--dt-hover); transform: scale(1.04); }

.dalia-voice-mic:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 2px var(--dt-focus-ring);
}

.dalia-voice-mic[aria-pressed="true"] {
  border-color: var(--dt-cta);
  background: var(--dt-cta);
  color: var(--dt-cta-fg);
}

.dalia-voice-mic .dalia-voice-mic__off { display: none; }
.dalia-voice-mic[aria-pressed="true"] .dalia-voice-mic__on { display: none; }
.dalia-voice-mic[aria-pressed="true"] .dalia-voice-mic__off { display: inline-flex; }

/* --------------------------------------------------------------------
 * 10 · Responsive
 * -------------------------------------------------------------------- */
@media (max-width: 1299.98px) {
  .dalia-pill { width: clamp(200px, 32vw, 320px); height: 32px; }
}

/* Mini-sidebar: que el pop no asome bajo el rail (z 3001) en anchos justos */
body[data-sidebartype="mini-sidebar"] .dalia-panel[data-mode="pop"] {
  max-width: calc(100vw - 76px);
}

@media (max-width: 991.98px) {
  .dalia-pill { width: clamp(150px, 30vw, 240px); }
}

@media (max-width: 767.98px) {
  /* el titulo del topbar ya se oculta en este rango: pill compacto */
  .dalia-pill { width: auto; padding: 0 14px; }
}

@media (max-width: 640px) {
  /* Hoja casi full-width bajo la barra; pisa el left inline del JS */
  .dalia-panel[data-mode="pop"],
  .dalia-panel[data-mode="dock"] {
    top: calc(var(--dt-topbar-h) + 6px);
    right: 8px !important;
    bottom: auto;
    left: 8px !important;
    width: auto;
    max-width: none;
    border: 1px solid var(--dt-border);
    border-radius: 14px;
    transform: translateY(-4px) scale(.985);
  }

  .dalia-panel[data-mode="dock"] { bottom: 8px; }

  .dalia-panel[data-mode="pop"].is-open,
  .dalia-panel[data-mode="dock"].is-open { transform: translateY(0) scale(1); }

  .dalia-panel__body { max-height: min(48dvh, 380px); }
  .dalia-panel[data-mode="pop"] .dalia-panel__pane[data-dalia-pane="chat"] { height: min(62dvh, 520px); }
  .dalia-panel[data-mode="pop"][data-size="compact"] .dalia-panel__pane[data-dalia-pane="chat"] {
    height: var(--dalia-compact-h, min(26dvh, 220px));
    max-height: min(46dvh, 380px);
  }
}

/* Datanav: sidebar fija de 70px con z 3001 (lastcssmarc.css) */
@media (max-width: 400px) {
  html.is-datanav .dalia-panel { left: 78px !important; }
}

@media (pointer: coarse) {
  .dalia-pill { height: 32px; }
  .dalia-panel__foot { display: none; } /* hints de teclado no aplican en tactil */
  .dalia-panel__close { width: 30px; min-width: 30px; height: 30px; padding: 0; border-radius: 8px; }
  .dalia-panel__close-esc { display: none; }
  .dalia-panel__close-x { display: inline-flex; }
  .dalia-panel__micshortcut { width: 36px; height: 36px; }
}

/* --------------------------------------------------------------------
 * 11 · Reduced motion: bloque propio — el guard global de .topbar * no
 * alcanza pseudo-elementos (el remolino del orbe vive en ::before).
 * -------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .dalia-pill,
  .dalia-orb-mini,
  .dalia-pill__label,
  .dalia-panel,
  .dalia-voice-orb,
  .dalia-voice-orb::before,
  .dalia-voice-orb__swirl::before,
  .dalia-voice-orb__ring,
  .dalia-voice-status,
  .dalia-note,
  .dalia-chat__msgs .msg,
  .ai-thinking-label,
  .dalia-chat__msgs .msg.is-streaming .bubble > .body::before,
  .dalia-chat__msgs .msg.is-streaming .stream-line:last-child::after,
  .dalia-chat__msgs .msg.is-streaming .stream-text:empty::after,
  .stream-loading,
  .print-in > *,
  .stagger-in tr,
  .step.step-pending .step-head .icon,
  .step.step-pending .step-head .name,
  .dalia-chat__box,
  .dalia-chat__box::before,
  .dalia-panel[data-sending="y"] .dalia-chat__send,
  .voice-transcript,
  .dalia-chat__effort,
  .dalia-chat__history,
  .msg-action-btn {
    transition: none !important;
    animation: none !important;
  }
}

/* ══════════════════════════════════════════════════════════════════════════
 * 08 · CHAT DE DALIA — capa nueva (2026-09-12)
 *
 * Solo DIFERENCIAS contra lo de arriba. Destinada a mudarse a
 * cssyapp/datalyse-el.css §08 cuando ese fichero exista; mientras tanto vive
 * aqui para no anadir un <link> nuevo al index.
 *
 * Encargo de Marc: "el color azul no me gusta nada, se ve muy IA" + "me gusta
 * el gris" + fuera la bolita verde + los chats arriba.
 * ────────────────────────────────────────────────────────────────────────── */

/* 08.1 · UNA SOLA PALETA. dalia.css:934 declara indigo/violeta de Tailwind
   (#6366f1 / #8b5cf6 / #22d3ee) que no existen en ningun otro sitio del CRM:
   dentro del MISMO panel, el orbe y el borde del composer no eran del mismo
   color. Ahora las cinco variables apuntan a los grises del sistema, asi que
   todo lo que las use queda neutro sin tocar una sola regla mas. El unico
   color de la superficie es el orbe, que es la identidad de Dalia. */
.dalia-panel {
  --dalia-ai-blue:   var(--dt-border-strong);
  --dalia-ai-cyan:   var(--dt-border-strong);
  --dalia-ai-violet: var(--dt-border-strong);
  --dalia-ai-grape:  var(--dt-surface-2);
  --dalia-ai-indigo: var(--dt-surface-2);
  /* 08.2 · Space Grotesk NO se sirve en el CRM: hoy cae a Inter en silencio.
     La unica display cargada de verdad es Plus Jakarta Sans
     (cssyappv3/fonts-local/plus-jakarta-sans.css). */
  --dalia-font-display: 'Plus Jakarta Sans', 'Inter', -apple-system, sans-serif;
}

/* 08.3 · Fuera la bolita verde de la cabecera (Marc: "no hace falta"). */
.dalia-panel .dalia-panel__head-dot { display: none !important; }

/* 08.4 · Cabecera: el titulo es display, y Manrope/Jakarta son variables, asi
   que el 650 de arriba se ve mas fino de verdad. */
.dalia-panel .dalia-panel__head-name {
  font-family: var(--dalia-font-display);
  font-weight: 700;
  letter-spacing: -.015em;
}

/* 08.5 · Boton "Chats" en la cabecera (subido desde el toolbar del composer). */
.dalia-panel__iconbtn {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 26px;
  border: 1px solid var(--dt-border-strong);
  border-radius: 7px;
  background: var(--dt-hover);
  color: var(--dt-muted);
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
  transition: background-color .12s ease, color .12s ease;
}
.dalia-panel__iconbtn:hover { color: var(--dt-text); background: var(--dt-active); }
.dalia-panel__iconbtn:focus-visible { outline: 0; box-shadow: 0 0 0 2px var(--dt-focus-ring); }

/* 08.6 · "New chat" dentro de la vista de Chats. Conserva el id, asi que la
   delegacion del remoto (closest('#daliaChatNew')) lo sigue disparando, y
   startNewChat() ya cierra el historial el solo. */
.dalia-chat__history-head { gap: 8px; }
.dalia-chat__history-title { flex: 1 1 auto; }
.dalia-hist-new {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 26px;
  padding: 0 10px 0 8px;
  border: 1px solid var(--dt-border-strong);
  border-radius: 7px;
  background: var(--dt-surface-2);
  color: var(--dt-text);
  font-family: inherit;
  font-size: 11.5px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition: background-color .12s ease, border-color .12s ease;
}
.dalia-hist-new:hover { background: var(--dt-hover); border-color: var(--dt-border-strong); }
.dalia-hist-new:focus-visible { outline: 0; box-shadow: 0 0 0 2px var(--dt-focus-ring); }
.dalia-hist-new .ti { font-size: 14px; }

/* 08.7 · La burbuja del usuario deja de gritar. Era un degradado violeta→indigo
   con texto blanco y sombra de 26px: el unico bloque saturado de toda la app.
   Pasa a la superficie del sistema, como cualquier otra tarjeta. */
.dalia-panel .dalia-chat__msgs .msg.user .body {
  padding: 9px 13px;
  border: 1px solid var(--dt-border);
  border-radius: 14px 4px 14px 14px;
  background: var(--dt-surface-2);
  box-shadow: none;
  color: var(--dt-text);
}

/* 08.8 · El saludo, legible. El degradado recortado a texto arrancaba en
   --dt-text al 35% y acababa en cian: sobre blanco la ultima mitad no se leia,
   y el texto recortado no se selecciona bien. El color se lo queda el orbe. */
.dalia-panel .dalia-chat__hero-greet {
  background: none;
  -webkit-text-fill-color: currentColor;
  color: var(--dt-text);
  font-family: var(--dalia-font-display);
  font-weight: 700;
  letter-spacing: -.025em;
}
.dalia-panel .dalia-chat__hero-orb.dalia-orb-mini {
  box-shadow: 0 0 22px color-mix(in srgb, var(--dt-cyan) 34%, transparent);
}

/* 08.9 · Dos botones azules identicos y pegados: el mic activo y Enviar eran
   ambos --dt-cta solido y no se sabia cual mandaba el mensaje. El mic activo
   pasa a contorno; el unico boton lleno del panel vuelve a ser Enviar. */
.dalia-panel .dalia-chat__iconbtn[aria-pressed="true"] {
  background: color-mix(in srgb, var(--dt-text) 10%, transparent);
  color: var(--dt-text);
  box-shadow: inset 0 0 0 1px var(--dt-border-strong);
}

/* 08.10 · Composer: borde neutro (el degradado ::before ya es gris por 08.1) y
   radios a la familia del sistema. */
.dalia-panel .dalia-chat__box { border-radius: 16px; }
.dalia-panel .dalia-chat__box::before { border-radius: 17px; opacity: .55; }
.dalia-panel .dalia-chat__box:focus-within::before { opacity: 1; }
.dalia-panel .dalia-chat__box:focus-within {
  box-shadow: 0 12px 34px -18px rgba(0, 0, 0, .45);
}
.dalia-panel .dalia-chat__send { border-radius: var(--dt-radius-lg); }

/* 08.11 · El rotulo "DALIA" sobre cada respuesta se repite en cada turno y el
   orbe ya dice quien habla. Se reserva para los mensajes de sistema. */
.dalia-panel .dalia-chat__msgs .msg.assistant .role { display: none; }

/* 08.12 · Restauracion del ultimo chat: mientras el shim pulsa el historial por
   debajo, la vista no debe parpadear en pantalla. */
.dalia-panel.dalia-restoring .dalia-chat__history { visibility: hidden; }

/* 08.13 · El boton de Enviar era el ultimo azul de la superficie (--dt-cta).
   Marc: "el color azul no me gusta nada, se ve muy IA". Pasa a tinta plena:
   blanco sobre oscuro / negro sobre claro. Sigue siendo el UNICO boton lleno
   del panel, asi que no pierde jerarquia; y el unico color de la superficie
   vuelve a ser el orbe. */
.dalia-panel .dalia-chat__send {
  background: var(--dt-text);
  color: var(--dt-app);
}
.dalia-panel .dalia-chat__send:hover {
  background: color-mix(in srgb, var(--dt-text) 88%, var(--dt-app));
}

/* ══════════════════════════════════════════════════════════════════════════
 * 09 · CHAT DE DALIA — lienzo "papel y tinta" (2026-09-22)
 *
 * Aplica el lienzo aprobado por Marc ("Chat de Dalia rediseñado", artifact
 * 2vgfXq4ecWz1PLCAZVszS6). Solo DIFERENCIAS de aspecto contra §01-08: mismos
 * ids, clases y DOM que construye 165_appDALIA.js; ni una regla de mecánica
 * (position/pointer-events/[hidden]/animaciones de entrada) se toca.
 *
 * Todos los selectores van con #daliaPanel: dalia-extra.css (copia local de
 * openmcp, se carga ANTES) usa ese id y sus reglas ganaban al §08 — por eso el
 * botón Enviar seguía saliendo azul degradado pese a §08.13.
 * ────────────────────────────────────────────────────────────────────────── */

/* 09.0 · Tokens propios de la capa (semánticos + sombra de tarjeta). */
#daliaPanel {
  --d9-ok: #15803d;
  --d9-warn: #b45309;
  --d9-bad: #b91c1c;
  --d9-bad-soft: rgba(185, 28, 28, .06);
  --d9-card-shadow: 0 1px 2px rgba(15, 15, 15, .04);
  font-size: 13.5px;
}
[data-bs-theme="dark"] #daliaPanel {
  --d9-ok: #4ade80;
  --d9-warn: #fbbf24;
  --d9-bad: #f87171;
  --d9-bad-soft: rgba(248, 113, 113, .1);
  --d9-card-shadow: 0 1px 2px rgba(0, 0, 0, .3);
}

/* 09.1 · Cabecera 52px: orbe 18, nombre display, estado tenue, botones fantasma. */
#daliaPanel .dalia-panel__head { min-height: 52px; padding: 0 10px 0 16px; }
#daliaPanel .dalia-panel__head-orb { width: 18px; height: 18px; }
#daliaPanel .dalia-panel__head-meta { display: flex; flex: 1 1 auto; flex-direction: row; min-width: 0; align-items: baseline; gap: 7px; } /* el base los apila en columna */
#daliaPanel .dalia-panel__head-name { font-size: 14px; }
#daliaPanel .dalia-panel__head-status { font-size: 11.5px; color: var(--dt-faint); }
#daliaPanel .dalia-panel__iconbtn,
#daliaPanel .dalia-panel__dockbtn {
  width: 30px; height: 30px;
  border: 0; border-radius: 9px;
  background: transparent; color: var(--dt-muted);
}
#daliaPanel .dalia-panel__close {
  display: inline-flex; align-items: center; gap: 6px;
  height: 30px; padding: 0 6px 0 7px;
  border: 0; border-radius: 9px;
  background: transparent; color: var(--dt-muted);
}
#daliaPanel .dalia-panel__iconbtn:hover,
#daliaPanel .dalia-panel__dockbtn:hover,
#daliaPanel .dalia-panel__close:hover { background: var(--dt-surface-2); color: var(--dt-text); }
#daliaPanel .dalia-panel__close-esc {
  font-size: 10px; font-weight: 600; line-height: 1;
  padding: 3px 5px;
  border: 1px solid var(--dt-border-strong); border-radius: 5px;
  color: var(--dt-faint);
}

/* 09.2 · Avisos bajo la cabecera. */
#daliaPanel .dalia-panel__notes { gap: 8px; padding: 10px 12px 0; }
#daliaPanel .dalia-note { padding: 10px 32px 10px 12px; border-radius: 12px; background: var(--dt-surface-2); }
/* Borde neutro en todos los tipos (el base lo teñía de ámbar/rojo): el color va solo en la etiqueta. */
#daliaPanel .dalia-note.is-info,
#daliaPanel .dalia-note.is-success,
#daliaPanel .dalia-note.is-warning,
#daliaPanel .dalia-note.is-critical { border-color: var(--dt-border); }
#daliaPanel .dalia-note .dalia-orb-mini { width: 14px; height: 14px; margin-top: 2px; }
#daliaPanel .dalia-note__main { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
#daliaPanel .dalia-note__type { font-size: 10px; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; color: var(--dt-faint); }
#daliaPanel .dalia-note.is-success .dalia-note__type { color: var(--d9-ok); }
#daliaPanel .dalia-note.is-warning .dalia-note__type { color: var(--d9-warn); }
#daliaPanel .dalia-note.is-critical .dalia-note__type { color: var(--d9-bad); }
#daliaPanel .dalia-note__text { font-size: 12.5px; line-height: 1.45; }
#daliaPanel .dalia-note__btn {
  height: 26px; padding: 0 10px;
  border: 1px solid var(--dt-border-strong); border-radius: 7px;
  background: var(--dt-surface); color: var(--dt-text);
  font-size: 11.5px; font-weight: 600;
}
#daliaPanel .dalia-note__btn--primary { background: var(--dt-text); color: var(--dt-surface); border-color: transparent; }
#daliaPanel .dalia-note__btn--primary:hover { background: color-mix(in srgb, var(--dt-text) 86%, var(--dt-surface)); }

/* 09.3 · Mensajes: Dalia sin burbuja con orbe 18; el usuario en píldora gris. */
#daliaPanel .dalia-chat__msgs { padding: 14px 16px 8px; }
#daliaPanel .dalia-chat__msgs .msg { padding: 6px 0; }
#daliaPanel .dalia-chat__msgs .msg .avatar { padding-top: 4px; }
#daliaPanel .dalia-chat__msgs .msg .avatar .dalia-orb-mini { width: 18px; height: 18px; }
/* 09.3b · Sin fila reservada en cada respuesta (Marc, 22-09: "¿por qué hay tanto espacio en cada
   mensaje?"). La .role-row del asistente (rótulo oculto por §08.11 + .msg-actions que solo se ven al
   pasar el ratón) ocupaba 20-24px en CADA respuesta: una línea de 26px salía en una caja de 64. Ahora la
   fila flota FUERA del flujo y POR ENCIMA del mensaje: top:-18px cabalga el hueco de 12px con el mensaje
   anterior y no pisa ni un px del propio cuerpo — en su esquina superior derecha viven el "Show table" de
   las tablas plegadas y el "Copy" de los bloques de código, que una barra en top:0 tapaba (revisión
   adversarial del 22-09). Barra compacta de 24px (botones de 20). pointer-events:none en la fila Y en la
   barra mientras están ocultas (con opacity 0 seguían capturando clics); :hover del mensaje o
   :focus-within (teclado) las reactivan. .msg ya es position:relative en el base. */
#daliaPanel .dalia-chat__msgs .msg.assistant:not(.is-push) .role-row {
  position: absolute; top: -18px; right: 0; z-index: 2;
  min-height: 0; margin: 0;
  pointer-events: none;
}
#daliaPanel .dalia-chat__msgs .msg.assistant:not(.is-push) .msg-actions {
  padding: 1px; gap: 0;
  border: 1px solid var(--dt-border); border-radius: 7px;
  background: var(--dt-surface); box-shadow: var(--d9-card-shadow);
  pointer-events: none;
}
#daliaPanel .dalia-chat__msgs .msg.assistant:not(.is-push) .msg-action-btn { width: 20px; height: 20px; border-radius: 5px; font-size: 12px; }
#daliaPanel .dalia-chat__msgs .msg.assistant:not(.is-push):hover .msg-actions,
#daliaPanel .dalia-chat__msgs .msg.assistant:not(.is-push) .msg-actions:focus-within { pointer-events: auto; }
/* Fósil del base (dalia.css ~:2159): `.msg-listen-btn[data-playing="1"] { opacity:1 }` nunca se veía porque
   la opacidad 0 es del PADRE. Mientras la voz suena, la barra se queda visible para poder pararla. Regla
   aparte a propósito: si un navegador no soporta :has(), solo pierde esta. */
#daliaPanel .dalia-chat__msgs .msg.assistant:not(.is-push) .msg-actions:has(.msg-listen-btn[data-playing="1"]) { opacity: 1; pointer-events: auto; }
/* En oscuro --dt-surface (#191919) es MÁS oscuro que el panel (#242424): la barra parecía hundida. */
[data-bs-theme="dark"] #daliaPanel .dalia-chat__msgs .msg.assistant:not(.is-push) .msg-actions { background: var(--dt-surface-2); border-color: var(--dt-border-strong); }
/* Táctil (sin hover): una barra invisible capturaba el primer toque y disparaba Escuchar (ya pasaba en el
   base). Ahí las acciones van en flujo, visibles y BAJO el texto, alineadas a la derecha. */
@media (hover: none) {
  #daliaPanel .dalia-chat__msgs .msg.assistant:not(.is-push) .bubble { display: flex; flex-direction: column; }
  #daliaPanel .dalia-chat__msgs .msg.assistant:not(.is-push) .role-row { position: static; order: 2; justify-content: flex-end; margin: 2px 0 0; pointer-events: auto; }
  #daliaPanel .dalia-chat__msgs .msg.assistant:not(.is-push) .msg-actions { opacity: 1; pointer-events: auto; border: 0; background: transparent; box-shadow: none; }
}
/* Avisos de sistema (.is-push): la fila se queda en flujo pero CON contenido. §08.11 escondía el rótulo
   también aquí, y un push 'info' (el tipo por defecto, el único SIN icono: 165_appDALIA.js ~:4642) dejaba
   23px de fila vacía sobre el texto. El rótulo dice "Dalia" (el tipo solo viaja en el title del icono). */
#daliaPanel .dalia-chat__msgs .msg.is-push .role { display: block; }
#daliaPanel .dalia-chat__msgs .msg.is-push .role-row { min-height: 0; margin: 0 0 3px 1px; }
#daliaPanel .dalia-chat__msgs .msg .role { font-size: 10.5px; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; color: var(--dt-faint); }
#daliaPanel .dalia-chat__msgs .msg.assistant .body { font-size: 13.5px; line-height: 1.6; }
#daliaPanel .dalia-chat__msgs .msg.user .body {
  padding: 9px 13px;
  border-radius: 18px 18px 4px 18px;
  font-size: 13.5px;
}
#daliaPanel .dalia-chat__msgs .msg.is-error .body {
  padding: 9px 12px;
  border: 1px solid var(--d9-bad); border-radius: 12px;
  background: var(--d9-bad-soft);
}
#daliaPanel .dalia-chat__msgs .msg .body code {
  padding: 1px 5px;
  border: 1px solid var(--dt-border); border-radius: 5px;
  background: var(--dt-surface-2);
}
#daliaPanel .msg-action-btn { width: 24px; height: 24px; border-radius: 7px; }
#daliaPanel .msg-action-btn:hover { background: var(--dt-surface-2); color: var(--dt-text); }
#daliaPanel .msg-listen-btn[data-playing="1"] { color: var(--dt-text); } /* base: --dt-cta azul */

/* 09.4 · Traza de pasos: UNA tarjeta con filas divididas (antes tarjetita por paso).
   Solo los .step HIJOS DIRECTOS del contenedor: las tarjetas sueltas de música/vídeo/
   pedido de números (`step open step-headless dalia-music-step`…) conservan su borde. */
#daliaPanel .steps,
#daliaPanel .stream-steps {
  gap: 0; margin: 2px 0 10px;
  border: 1px solid var(--dt-border); border-radius: 14px;
  background: color-mix(in srgb, var(--dt-surface-2) 55%, transparent);
  overflow: hidden;
}
#daliaPanel .steps > .step,
#daliaPanel .stream-steps > .step { border: 0; border-radius: 0; background: transparent; }
#daliaPanel .steps > .step + .step,
#daliaPanel .stream-steps > .step + .step { border-top: 1px solid var(--dt-border); }
/* El JS anida .stream-steps > .steps > .step (renderSteps dentro de turn.stepsWrap, ~:6707): la tarjeta
   es la EXTERIOR; el .steps interior va plano (si no, doble borde arriba y 11px vacíos al pie). */
#daliaPanel .stream-steps > .steps { margin: 0; border: 0; border-radius: 0; background: transparent; }
#daliaPanel .step-head { gap: 9px; min-height: 34px; padding: 0 11px; }
/* .icon es un <svg> de 13px (JS ~:4142): el disco se hace con padding content-box → 20px. */
#daliaPanel .step-head .icon {
  box-sizing: content-box;
  width: 12px; height: 12px; padding: 3px;
  border: 1px solid var(--dt-border-strong); border-radius: 50%;
  background: var(--dt-surface); color: var(--dt-muted);
}
#daliaPanel .step-head .name { font-weight: 600; color: var(--dt-text); }
#daliaPanel .step.step-pending .step-head .icon { border-style: dashed; color: var(--dt-faint); } /* el daliaSpin base gira el disco = spinner */
#daliaPanel .step.step-pending .step-head .name { font-weight: 500; color: var(--dt-faint); }
#daliaPanel .step-body { padding: 0 11px 10px 40px; color: var(--dt-muted); }
#daliaPanel .step.step-headless .step-body { padding-top: 10px; }
#daliaPanel .step-body .label { margin: 2px 0 3px; }

/* 09.5 · Tabla dentro de una respuesta (se conserva overflow-x:auto del base para tablas anchas). */
#daliaPanel .chat-table-wrap { margin: 8px 0 10px; border: 1px solid var(--dt-border); border-radius: 12px; }
#daliaPanel .chat-table { font-size: 12.5px; }
#daliaPanel .chat-table th {
  padding: 7px 10px;
  font-size: 10px; font-weight: 650; letter-spacing: .06em; text-transform: uppercase;
  color: var(--dt-faint); background: var(--dt-surface-2);
  border-bottom: 1px solid var(--dt-border);
}
#daliaPanel .chat-table td { padding: 8px 10px; border-bottom: 1px solid var(--dt-border); }
#daliaPanel .chat-table tbody tr:last-child td { border-bottom: 0; }

/* 09.6 · Respuestas rápidas. */
#daliaPanel .qr-btn { height: 30px; padding: 0 12px; font-size: 12.5px; font-weight: 500; }
#daliaPanel .qr-btn:hover { border-color: var(--dt-text); background: var(--dt-surface-2); }

/* 09.7 · Reproductor de la respuesta hablada (pisa el degradado azul de dalia-extra.css). */
#daliaPanel .tts-player { gap: 8px; height: 34px; padding: 0 12px 0 4px; box-shadow: none; }
#daliaPanel .tts-play { width: 26px; height: 26px; flex-basis: 26px; background: var(--dt-text); color: var(--dt-surface); }
#daliaPanel .tts-play:hover { filter: none; transform: none; box-shadow: none; background: color-mix(in srgb, var(--dt-text) 86%, var(--dt-surface)); }
#daliaPanel .tts-play svg { width: 12px; height: 12px; }
#daliaPanel .tts-track { height: 3px; border-radius: 2px; background: var(--dt-border-strong); }
#daliaPanel .tts-player.is-playing .tts-track { background: var(--dt-border-strong); }
#daliaPanel .tts-progress { background: var(--dt-text); border-radius: 2px; }
#daliaPanel .tts-time { font-size: 11px; color: var(--dt-faint); }

/* 09.8 · Estado vacío: orbe 44, saludo 24, tarjetas de arranque en cuadrícula. */
#daliaPanel .dalia-chat__hero-orb.dalia-orb-mini { width: 44px; height: 44px; margin-bottom: 12px; box-shadow: 0 0 26px color-mix(in srgb, var(--dt-cyan) 34%, transparent); }
#daliaPanel .dalia-chat__hero-greet { font-size: 24px; line-height: 1.2; }
#daliaPanel .dalia-chat__hero-tag { max-width: 300px; font-size: 13px; color: var(--dt-muted); }
#daliaPanel .dalia-starter__label { margin: 0 0 8px 2px; font-size: 10.5px; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; color: var(--dt-faint); }
#daliaPanel .dalia-starter__categories { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
#daliaPanel .dalia-starter__category {
  gap: 10px; min-height: 60px; padding: 10px 11px;
  border: 1px solid var(--dt-border); border-radius: 12px;
  background: var(--dt-surface); box-shadow: var(--d9-card-shadow);
}
#daliaPanel .dalia-starter__category:hover { border-color: var(--dt-border-strong); background: var(--dt-hover); transform: translateY(-1px); }
#daliaPanel .dalia-starter__icon { flex: 0 0 30px; width: 30px; height: 30px; border-radius: 9px; background: var(--dt-surface-2); color: var(--dt-muted); }
#daliaPanel .dalia-starter__title { font-size: 12.5px; font-weight: 600; white-space: normal; line-height: 1.25; } /* a 420px con flecha no cabe "Contactos y ventas" en una línea */
#daliaPanel .dalia-starter__count,
#daliaPanel .dalia-starter__desc { font-size: 11px; color: var(--dt-faint); }
#daliaPanel .dalia-starter__arrow { color: var(--dt-faint); }
/* __icon y __all iban en --dt-cta (azul): los últimos azules del panel. Se conserva el
   min-height 44px de __all (objetivo táctil) y su display del base. */
#daliaPanel .dalia-starter__all { font-weight: 550; color: var(--dt-muted); }
#daliaPanel .dalia-starter__all:hover { color: var(--dt-text); background: var(--dt-hover); }

/* 09.9 · Composer: tarjeta radio 20, hairline, foco por anillo; Enviar círculo de tinta. */
#daliaPanel .dalia-chat__box { border-radius: 20px; box-shadow: var(--d9-card-shadow); }
#daliaPanel .dalia-chat__box::before { display: none; }
#daliaPanel .dalia-chat__box:focus-within { box-shadow: 0 0 0 3px var(--dt-focus-ring), 0 12px 34px -18px rgba(0, 0, 0, .35); }
#daliaPanel .dalia-chat__field { padding: 12px 14px 2px; }
#daliaPanel .dalia-chat__input { font-size: 13.5px; line-height: 1.5; }
#daliaPanel .dalia-chat__input::placeholder { color: var(--dt-faint); }
#daliaPanel .dalia-chat__toolbar { padding: 4px 8px 8px; }
#daliaPanel .dalia-chat__toolbar-side { gap: 2px; }
#daliaPanel .dalia-chat__iconbtn { width: 30px; height: 30px; border-radius: 9px; font-size: 15px; }
#daliaPanel .dalia-chat__iconbtn:hover { background: var(--dt-surface-2); color: var(--dt-text); transform: none; }
#daliaPanel .dalia-chat__iconbtn[aria-pressed="true"] {
  background: color-mix(in srgb, var(--dt-text) 10%, transparent);
  color: var(--dt-text);
  box-shadow: inset 0 0 0 1px var(--dt-border-strong);
}
#daliaPanel .dalia-chat__chip { height: 28px; margin-left: 2px; padding: 0 10px 0 8px; }
#daliaPanel .dalia-chat__chip:hover { color: var(--dt-text); background: var(--dt-surface-2); }
#daliaPanel .dalia-chat__send {
  width: 32px; height: 32px; margin-left: 4px;
  border-radius: 50%;
  background: var(--dt-text); color: var(--dt-surface);
  font-size: 15px; box-shadow: none;
}
#daliaPanel .dalia-chat__send:hover { background: color-mix(in srgb, var(--dt-text) 86%, var(--dt-surface)); filter: none; transform: none; }
#daliaPanel .dalia-chat__send:active { transform: scale(.96); }
#daliaPanel .attach-chip { height: 30px; padding: 0 10px 0 6px; border: 1px solid var(--dt-border); border-radius: 9px; background: var(--dt-surface-2); font-size: 11.5px; }
#daliaPanel .attach-thumb { width: 20px; height: 20px; border: 1px solid var(--dt-border); border-radius: 5px; background: var(--dt-surface); }

/* 09.10 · Historial de chats. */
#daliaPanel .dalia-chat__history-head { min-height: 48px; padding: 0 10px 0 16px; border-bottom: 1px solid var(--dt-border); }
#daliaPanel .dalia-chat__history-title { font-family: var(--dalia-font-display); font-size: 14px; font-weight: 700; letter-spacing: -.015em; }
#daliaPanel .dalia-hist-new { height: 28px; border-radius: 8px; }
#daliaPanel .dalia-chat__history-list { gap: 2px; padding: 8px; }
#daliaPanel .dalia-hist-row { padding: 9px 10px; border-radius: 10px; }
#daliaPanel .dalia-hist-row:hover { background: var(--dt-surface-2); }
#daliaPanel .dalia-hist-title { font-size: 12.5px; font-weight: 550; }
#daliaPanel .dalia-hist-date { font-size: 11px; color: var(--dt-faint); }
#daliaPanel .dalia-hist-del { width: 24px; height: 24px; border-radius: 7px; }
#daliaPanel .dalia-hist-del:hover { background: var(--dt-active); color: var(--d9-bad); }

/* 09.11 · Movimiento reducido: sin lift en tarjetas. */
@media (prefers-reduced-motion: reduce) {
  #daliaPanel .dalia-starter__category:hover { transform: none; }
}