/* ============================================================
   Nova — asistente virtual de AppMinistra
   Usa los tokens de styles.css (azul de marca, slate, sombras).
   ============================================================ */

.nova-toggle{
  position:fixed; right:22px; bottom:22px; z-index:1000;
  width:60px; height:60px;
  display:grid; place-items:center;
  border:0; border-radius:50%; cursor:pointer;
  background:var(--grad-hero);
  color:#fff;
  box-shadow:var(--shadow-premium), 0 0 0 4px rgba(255,255,255,.9);
  transition:transform .25s ease, box-shadow .25s ease;
}
.nova-toggle:hover{ transform:translateY(-2px) scale(1.05); box-shadow:0 30px 60px -12px rgba(0,153,255,.45), 0 0 0 4px rgba(255,255,255,.9); }
.nova-toggle:focus-visible{ outline:3px solid var(--primary-bright); outline-offset:4px; }
.nova-toggle svg{ width:26px; height:26px; transition:transform .25s ease, opacity .2s ease; }
.nova-toggle .nova-ico-close{ position:absolute; opacity:0; transform:rotate(-90deg) scale(.6); }
.nova-open .nova-toggle .nova-ico-chat{ opacity:0; transform:rotate(90deg) scale(.6); }
.nova-open .nova-toggle .nova-ico-close{ opacity:1; transform:none; }

/* Aviso de "nuevo" hasta que se abre por primera vez */
.nova-toggle::after{
  content:''; position:absolute; top:3px; right:3px;
  width:12px; height:12px; border-radius:50%;
  background:var(--success); border:2px solid #fff;
}
.nova-seen .nova-toggle::after{ display:none; }

/* ── Ventana ─────────────────────────────────────────────── */
.nova-panel{
  position:fixed; right:22px; bottom:96px; z-index:1000;
  width:380px; height:min(580px, calc(100vh - 130px));
  display:flex; flex-direction:column;
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  box-shadow:var(--shadow-float), var(--shadow-premium);
  overflow:hidden;
  font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  opacity:0; visibility:hidden;
  transform:translateY(16px) scale(.97); transform-origin:bottom right;
  transition:opacity .22s ease, transform .22s ease, visibility 0s linear .22s;
}
.nova-open .nova-panel{
  opacity:1; visibility:visible; transform:none;
  transition:opacity .22s ease, transform .22s ease, visibility 0s;
}

.nova-header{
  position:relative;
  display:flex; align-items:center; gap:.8rem;
  padding:1rem 1.1rem;
  background:var(--grad-hero);
  color:#fff;
}
.nova-avatar{
  flex:none; width:40px; height:40px;
  border:2px solid #fff; border-radius:12px;
  overflow:hidden;
  transform:rotate(3deg);
}
.nova-avatar img{ width:100%; height:100%; object-fit:cover; display:block; }
.nova-title{ flex:1; min-width:0; line-height:1.2; }
.nova-title strong{
  display:block;
  font-family:'Outfit','Inter',system-ui,sans-serif;
  font-weight:900; font-size:1.15rem; letter-spacing:-.02em;
}
.nova-title span{
  display:inline-flex; align-items:center; gap:.4rem;
  font-size:.74rem; font-weight:500; opacity:.92;
}
.nova-title span::before{
  content:''; width:7px; height:7px; border-radius:50%;
  background:#4ade80; box-shadow:0 0 0 3px rgba(74,222,128,.25);
}
.nova-close{
  flex:none; width:34px; height:34px;
  display:grid; place-items:center;
  border:0; border-radius:var(--r-sm); cursor:pointer;
  background:rgba(255,255,255,.14); color:#fff;
  transition:background .2s ease;
}
.nova-close:hover{ background:rgba(255,255,255,.26); }
.nova-close:focus-visible{ outline:2px solid #fff; outline-offset:2px; }
.nova-close svg{ width:18px; height:18px; }

/* ── Conversación ────────────────────────────────────────── */
.nova-box{
  position:relative; /* referencia para offsetTop de los mensajes */
  flex:1; overflow-y:auto; overscroll-behavior:contain;
  display:flex; flex-direction:column; gap:.7rem;
  padding:1.1rem 1rem;
  background:var(--page);
}

.nova-msg{
  max-width:86%;
  padding:.65rem .95rem;
  border-radius:18px;
  font-size:.9rem; line-height:1.55;
  overflow-wrap:anywhere;
  animation:nova-in .2s ease both;
}
.nova-msg strong{ font-weight:700; color:var(--ink); }
.nova-msg a{ color:var(--primary-deep); font-weight:600; text-decoration:underline; text-underline-offset:2px; }

.nova-bot{
  align-self:flex-start;
  background:var(--white); color:var(--body);
  border:1px solid var(--line);
  border-bottom-left-radius:5px;
  box-shadow:var(--shadow-card);
}
.nova-user{
  align-self:flex-end;
  background:var(--primary); color:#fff;
  border-bottom-right-radius:5px;
  box-shadow:0 8px 18px -10px rgba(0,153,255,.6);
}

/* Sugerencias iniciales */
.nova-chips{ display:flex; flex-wrap:wrap; gap:.45rem; }
.nova-chip{
  padding:.4rem .8rem;
  border:1px solid rgba(0,153,255,.35); border-radius:var(--r-pill);
  background:var(--primary-tint); color:var(--primary-deep);
  font-size:.8rem; font-weight:600; cursor:pointer;
  transition:background .2s ease, color .2s ease;
}
.nova-chip:hover{ background:var(--primary); color:#fff; }

/* Escribiendo… */
.nova-typing{ display:inline-flex; gap:4px; padding:.85rem 1rem; }
.nova-typing i{
  width:7px; height:7px; border-radius:50%;
  background:var(--primary); opacity:.35;
  animation:nova-dot 1.1s infinite ease-in-out;
}
.nova-typing i:nth-child(2){ animation-delay:.15s; }
.nova-typing i:nth-child(3){ animation-delay:.3s; }

/* ── Entrada ─────────────────────────────────────────────── */
.nova-form{
  display:flex; align-items:center; gap:.55rem;
  padding:.8rem .9rem;
  background:var(--white);
  border-top:1px solid var(--line);
}
.nova-input{
  flex:1; min-width:0;
  padding:.65rem 1rem;
  border:1px solid var(--line); border-radius:var(--r-pill);
  background:var(--page);
  font-size:.9rem; color:var(--ink);
  outline:none;
  transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.nova-input::placeholder{ color:var(--faint); }
.nova-input:focus{ border-color:var(--primary); background:#fff; box-shadow:0 0 0 4px rgba(0,153,255,.15); }
.nova-input:disabled{ opacity:.7; }
.nova-send{
  flex:none; width:42px; height:42px;
  display:grid; place-items:center;
  border:0; border-radius:50%; cursor:pointer;
  background:var(--primary); color:#fff;
  transition:background .2s ease, transform .2s ease;
}
.nova-send:hover:not(:disabled){ background:var(--primary-deep); transform:scale(1.06); }
.nova-send:focus-visible{ outline:3px solid var(--primary-bright); outline-offset:2px; }
.nova-send:disabled{ background:var(--faint); cursor:not-allowed; }
.nova-send svg{ width:18px; height:18px; }

.nova-foot{
  padding:0 1rem .6rem; background:var(--white);
  font-size:.68rem; color:var(--faint); text-align:center;
}

@keyframes nova-in{ from{ opacity:0; transform:translateY(6px); } }
@keyframes nova-dot{ 0%,80%,100%{ opacity:.35; transform:none; } 40%{ opacity:1; transform:translateY(-4px); } }

/* ── Celular: ventana casi a pantalla completa ───────────── */
@media (max-width:480px){
  .nova-toggle{ right:16px; bottom:16px; width:56px; height:56px; }
  .nova-panel{
    right:10px; left:10px; bottom:84px;
    width:auto; height:calc(100vh - 100px); height:calc(100dvh - 100px);
    border-radius:var(--r-md);
  }
  .nova-input{ font-size:16px; } /* evita el zoom automático de iOS */
}