/* WhiteTrap nube: login y barra de cuenta (se suma al CSS del tablero) */
body.nube-espera #upload-screen, body.nube-espera #app { display:none !important; }
#nube-login { position:fixed; inset:0; z-index:9999; display:none; background:#000; color:#fff;
  grid-template-columns:1fr minmax(340px, 420px); }
#nube-login.ver { display:grid; }
.nube-marca { display:flex; flex-direction:column; align-items:center; justify-content:center; padding:40px; }
.nube-marca img { width:min(560px, 80%); height:auto; user-select:none; -webkit-user-drag:none; }
.nube-lema { margin-top:22px; font-size:11px; letter-spacing:.32em; text-transform:uppercase; color:#6f6f6f; }
.nube-caja { display:flex; flex-direction:column; justify-content:center; padding:48px 44px; border-left:1px solid #1c1c1c; background:#050505; }
.nube-titulo { font-size:13px; letter-spacing:.2em; text-transform:uppercase; color:#bdbdbd; margin-bottom:26px; }
.nube-caja label { font-size:11px; color:#7a7a7a; margin:18px 0 6px; }
.nube-caja input { width:100%; box-sizing:border-box; background:transparent; border:0; border-bottom:1px solid #333; border-radius:0;
  padding:9px 2px; color:#fff; font:inherit; font-size:15px; }
.nube-caja input:focus { outline:none; border-bottom-color:#fff; }
.nube-caja input:-webkit-autofill { -webkit-text-fill-color:#fff; -webkit-box-shadow:0 0 0 40px #050505 inset; caret-color:#fff; }
.nube-caja button { margin-top:34px; padding:12px; border:1px solid #fff; border-radius:3px; background:#fff; color:#000;
  font:inherit; font-weight:600; font-size:13px; letter-spacing:.12em; text-transform:uppercase; cursor:pointer; transition:background .15s, color .15s; }
.nube-caja button:hover { background:#000; color:#fff; }
.nube-caja button:disabled { opacity:.5; cursor:default; }
.nube-error { color:#ff8a8a; font-size:12px; min-height:16px; margin-top:14px; }
@media (max-width: 800px) {
  #nube-login { grid-template-columns:1fr; grid-template-rows:auto 1fr; overflow:auto; }
  .nube-marca { padding:56px 16px 24px; }
  .nube-marca img { width:min(320px, 78%); }
  .nube-caja { border-left:0; border-top:1px solid #1c1c1c; padding:32px 16px 40px; justify-content:flex-start; }
}
.nube-cuenta { margin-top:8px; font-size:10.5px; color:var(--muted); display:flex; flex-wrap:wrap; gap:4px 10px; align-items:center; }
.nube-cuenta b { color:var(--text); font-weight:600; }
.nube-cuenta a { color:var(--muted); text-decoration:underline; cursor:pointer; }
.nube-cuenta a:hover { color:var(--text); }
#nube-estado { font-size:10px; color:var(--muted); margin-top:4px; line-height:1.4; }
#nube-estado.mal { color:#f58282; }
#nube-cargando { position:fixed; inset:0; z-index:9998; display:none; align-items:center; justify-content:center; background:#000; }
#nube-cargando img { width:min(320px, 60%); animation:nubeLatido 1.6s ease-in-out infinite; }
@keyframes nubeLatido { 50% { opacity:.35; } }
#nube-cargando.ver { display:flex; }
/* precios.js no existe en la nube: los precios los trae el servidor */
#sb-status { display:none; }

/* ══ Estética WhiteTrap: negro y blanco como el logo ══
   Se mantienen los colores que dan información: verde ganancia, rojo
   pérdida, amarillo de aviso y los colores de cada plataforma en los gráficos. */
:root {
  --bg:#000000; --s1:#060606; --s2:#0c0c0c; --s3:#161616;
  --border:#1a1a1a; --border2:#262626;
  --text:#f2f2f2; --muted:#8c8c8c; --muted2:#5c5c5c;
  --accent:#ffffff;
}
/* Logo en la barra lateral y en la pantalla de carga de Excel */
.sb-logo-title { color:transparent; background:url(logo.png) left center / contain no-repeat; height:30px; width:132px; overflow:hidden; }
.sb-logo-sub { letter-spacing:.24em; }
.upload-icon { display:none; }
.upload-title { color:transparent; background:url(logo.png) center / contain no-repeat; height:64px; margin-bottom:18px; }
/* Botones: blanco con letra negra */
.upload-btn, .copy-btn { background:#fff; color:#000; border-radius:3px; text-transform:uppercase; letter-spacing:.1em; font-size:12px; }
.copy-btn.ok { background:var(--green); color:#fff; }
.sb-btn-ai { border-color:#3a3a3a; }
.sb-btn-ai:hover { background:#111; border-color:#fff; }
.nav-item.active { background:#111; }
.nav-item.active .nav-dot { background:#fff; }
.card, .ox-card, .metric, .ox-metric-card { border-radius:6px; }
/* Íconos de activos en gris (sin el color por categoría) */
.ico-crypto, .ico-etf, .ico-stock { background:#111; color:#d9d9d9; border-color:#2a2a2a; }
/* Barras de color de cada plataforma: se quedan con su color */
.pb-qf { background:#3d72e8; }
.ox-note { background:#0b0b0b; border-color:#222; }
.price-readiness[data-state="loading"] { color:#bdbdbd; }
.spinner { border-top-color:#fff; }
.toast-info { border-color:#444; }

/* ══ Barra lateral: punto de estado + menú (en vez de cajas fijas) ══ */
.sb-logo { position:relative; }
.nube-acciones { position:absolute; right:12px; top:50%; transform:translateY(-50%); display:flex; align-items:center; gap:8px; }
.nube-punto { width:11px; height:11px; border-radius:50%; border:0; padding:0; cursor:pointer; background:#5c5c5c; }
.nube-punto.ok { background:var(--green); box-shadow:0 0 0 3px rgba(29,186,110,.15); }
.nube-punto.revisar { background:var(--gold); box-shadow:0 0 0 3px rgba(212,164,71,.15); }
.nube-punto.mal { background:var(--red); box-shadow:0 0 0 3px rgba(224,60,60,.18); }
.nube-punto.cargando { background:#bdbdbd; animation:nubeLatido 1.2s ease-in-out infinite; }
.nube-menu-btn { background:transparent; border:1px solid #2a2a2a; color:#d0d0d0; width:28px; height:28px; border-radius:4px; cursor:pointer; font-size:14px; line-height:1; }
.nube-menu-btn:hover { border-color:#fff; color:#fff; }
.nube-pop { position:fixed; z-index:400; width:280px; max-height:calc(100vh - 90px); overflow:auto; background:#080808; border:1px solid #262626; border-radius:6px; padding:12px; box-shadow:0 12px 40px rgba(0,0,0,.6); }
.nube-pop[hidden] { display:none; }
.nube-pop .sb-bottom { padding:0; border-top:0; }
.nube-pop-titulo { font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:#8c8c8c; margin-bottom:10px; }
#nube-detalle { width:360px; }
#nube-detalle .price-readiness { margin:0 0 10px; }
#nube-detalle .import-audit { margin:0; }