

/* ===== Poppins (local, en /public/fonts) ===== */
@font-face { font-family: "Poppins"; src: url("/fonts/Poppins-Thin.ttf") format("truetype"); font-weight: 100; font-style: normal; font-display: swap; }
@font-face { font-family: "Poppins"; src: url("/fonts/Poppins-ExtraLight.ttf") format("truetype"); font-weight: 200; font-style: normal; font-display: swap; }
@font-face { font-family: "Poppins"; src: url("/fonts/Poppins-Light.ttf") format("truetype"); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: "Poppins"; src: url("/fonts/Poppins-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Poppins"; src: url("/fonts/Poppins-Medium.ttf") format("truetype"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Poppins"; src: url("/fonts/Poppins-SemiBold.ttf") format("truetype"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Poppins"; src: url("/fonts/Poppins-Bold.ttf") format("truetype"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Poppins"; src: url("/fonts/Poppins-ExtraBold.ttf") format("truetype"); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Poppins"; src: url("/fonts/Poppins-Black.ttf") format("truetype"); font-weight: 900; font-style: normal; font-display: swap; }







/* ===== CloudView base (forzar tema claro y alto contraste) ===== */
:root { --cv-header-h: 56px; }
html {
  color-scheme: only light;
  font-family: "Poppins", system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
}
body {
  -webkit-tap-highlight-color: transparent; /* elimina flash azul en iOS */
  background-color: #f8fafc;
  overscroll-behavior: none;
  margin: 0; 
  color: #0f172a; 
  background: #f3f4f6;
}
iframe {
  width: 100%;
  min-width: 100%;
}

a, a:hover, a:active, a:clicked { color: inherit }
h1,h2,h3 { font-weight: 600; }
strong,b  { font-weight: 600; }

/* iframe autoheight: sin barras y ocupa todo el ancho */
iframe[data-autoheight]{
  display:block;
  width:100%;
  border:0;
  overflow:hidden !important;
  scrollbar-width:none;       /* Firefox */
}
iframe[data-autoheight]::-webkit-scrollbar{ display:none; } /* WebKit */









/* ===== Header ===== */
.app-header {
  position: sticky; top: 0; z-index: 50;
  height: var(--cv-header-h);
  background: #0b0b0c;  /* negro */
  color: #fff;
  border-bottom: 1px solid rgba(255,255,255,.08);
  display: flex; align-items: center;
}
.app-header__inner {
  width: 100%; max-width: 1024px; margin: 0 auto;
  padding: 0 16px;
  display: flex; align-items: center; gap: 12px;
}
.app-logo {
  display: inline-flex; align-items: center; gap: 8px;
  text-decoration: none; color: #fff;
}
.app-logo img {
  height: 22px; width: auto; display: block;
  object-fit: contain; image-rendering: -webkit-optimize-contrast;
}
.app-logo__title { font-weight: 600; letter-spacing: 0.2px; }
.app-logo__by { opacity: .65; font-size: 12px; }

/* Responsive: en pantallas grandes, permite un logo un poquito mayor */
@media (min-width: 1024px) {
  .app-logo img { height: 24px; }
}

/* Contenedor principal debajo del header */
.app-shell {
  width: 100%; max-width: 1024px; margin: 0 auto;
  padding: 16px;
}





/* Tipos */
h1, h2, h3, h4 {
  color: #0f172a;
}
p, li, small {
  color: #111827;             /* gray-900 */
}

/* Links */
a { color: #2563eb; }         /* blue-600 */

/* Tarjetas/recuadros */
.cv-card,
article.bg-white,
div.bg-white,
.card {
  background: #ffffff !important;
  color: #0f172a !important;
  border-color: rgba(0,0,0,.08) !important;
}

/* Chat panel */
#chatPanel {
  background: rgba(255,255,255,0.95) !important;
  border: 1px solid rgba(15,23,42,0.08);
}

/* Burbujas del chat */
#chatStream .assistant {
  background: #F3F4F6;        /* gray-100 */
  color: #111827;
}
#chatStream .user {
  background: #ffffff;
  border: 1px solid rgba(0,0,0,.08);
  color: #0f172a;
}

/* Iframes/embeds: fondo blanco para que charts no se “ensucien” */
iframe, .embed, .vega-embed {
  background: #ffffff;
}

@media (max-width: 430px) {
  iframe .chart, iframe svg, iframe canvas {
    max-width: 100%;
    height: auto;
  }
}

/* Fix para Safari iOS que aplica dark UI en formularios */
input, textarea, select, button {
  background: #ffffff;
  color: #0f172a;
  border-color: rgba(0,0,0,.15);
}

/* Borde morado del “highlight” accesible */
.cv-highlight {
  outline: 3px solid rgba(125, 90, 254, 0.9);
  outline-offset: 2px;
  border-radius: 6px;
  box-shadow: 0 0 0 4px rgba(125, 90, 254, 0.15);
}

/* Transición de altura del chat */
#chatPanel { transition: height .25s ease; }


/* Evita animación de altura mientras se arrastra */
.dragging #chatPanel { transition: none !important; }

/* Mejora el feedback del tirador */
#chatHandle {
  font-family: 'Poppins', 'Helvetica Neue', Arial, sans-serif;
  font-variant-emoji: text;
}
#chatHandle:active { transform: scale(0.96); }

/* Evita que el navegador active dark-mode por preferencia del sistema */
@media (prefers-color-scheme: dark) {
  :root { color-scheme: only light; }
}