/* ============================================================
   TERMINAL — hoja de estilos compartida
   Paleta "petróleo": cabecera oscura, lateral claro, acentos verde-azulado y ámbar
   ============================================================ */
/* Tipografía única en toda la web: Inter, alojada en la web (public/fonts, licencia SIL OFL), sin peticiones
   a Google Fonts. Las cifras usan dígitos de ancho fijo (tabular-nums) para que columnas y rangos queden alineados. */
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/inter-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/inter-latin-500-normal.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/inter-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/inter-latin-700-normal.woff2') format('woff2')}
:root{
  /* ---- Tema por defecto: Dorado (los demás temas redefinen estas variables más abajo) ---- */
  --top-bg:#17181c;         /* barra superior */
  --top-bg2:#0f1013;        /* fondos muy oscuros (selector de vista, buscador) */
  --top-border:#34363d;     /* bordes en zonas oscuras */
  --top-border2:#3f424a;
  --top-txt:#e6edf3;
  --tape-bg:#222329;        /* cinta de índices y hover en zonas oscuras */
  --logo:#f0c040;           /* nombre en el logo */
  --sb-bg:#f3f5f8;          /* lateral claro */
  --sb-bg2:#e4e9ef;
  --sb-txt:#2b3642;
  --sb-head:#6a7684;
  --sb-active:#c9961a;
  --accent:#c9961a;         /* acento principal */
  --accent2:#8f6a0f;        /* acento oscuro (texto activo) */
  --accent-soft:#fbf3dc;    /* acento muy suave (fondos) */
  --tab-line:#d99a06;       /* subrayado de pestaña activa */
  --amber:#d99a06;
  --panel-head:#c9961a;
  --panel-head2:#8f6a0f;
  --border:#d5dbe2;
  --border2:#e5e9ee;
  --card-page:#f2f4f7;      /* fondo detrás de las tarjetas */
  --txt:#1d242b;
  --txt2:#5d6975;
  --link:#8a6400;
  --pos:#148a4a;
  --neg:#c73b3b;
  --row-alt:#f7f9fa;
  --row-hover:#faf5e6;
  --sel:#fdf3d6;
  --tab-bg:#f6f8fa;
  --score-g:#3fa66b;
  --score-y:#e2b93b;
  --score-r:#d45353;
  --bar-blue:#e6cf86;
  --bar-bg:#e4e9ee;
}
/* ---- Temas (se activan con <html data-theme="..."> ; se guardan en las preferencias del usuario) ---- */
:root[data-theme="petroleo"]{ --top-bg:#14202c; --top-bg2:#0e1822; --top-border:#2b3c4d; --top-border2:#3a4c5e; --tape-bg:#1c2b3a; --logo:#7fd0dd; --sb-active:#1f7a8c; --accent:#1f7a8c; --accent2:#155e6c; --accent-soft:#e3f1f4; --tab-line:#d99a06; --panel-head:#1f7a8c; --panel-head2:#155e6c; --link:#166d7d; --row-hover:#eaf4f6; --sel:#fdf3d6; --bar-blue:#9fcfd8 }
:root[data-theme="azul"]{ --top-bg:#0d1117; --top-bg2:#0b0f14; --top-border:#2a3340; --top-border2:#3b4656; --tape-bg:#161d27; --logo:#8ab4ff; --sb-active:#3b82f6; --accent:#3b82f6; --accent2:#1d4ed8; --accent-soft:#e8f0fe; --tab-line:#3b82f6; --panel-head:#3b82f6; --panel-head2:#1d4ed8; --link:#1d4ed8; --row-hover:#eef3fc; --sel:#fff3cd; --bar-blue:#a9c6f5 }
:root[data-theme="verde"]{ --top-bg:#101814; --top-bg2:#0b100d; --top-border:#2b3a30; --top-border2:#3a4b40; --tape-bg:#182219; --logo:#6fd39a; --sb-active:#1fa463; --accent:#1fa463; --accent2:#15804b; --accent-soft:#e4f5ec; --tab-line:#1fa463; --panel-head:#1fa463; --panel-head2:#15804b; --link:#137a47; --row-hover:#edf7f1; --sel:#fff3cd; --bar-blue:#a3dcbd }
:root[data-theme="grafito"]{ --top-bg:#1e1f22; --top-bg2:#141518; --top-border:#3a3b40; --top-border2:#4a4b52; --tape-bg:#27282c; --logo:#e6e6e6; --sb-active:#4b5563; --accent:#4b5563; --accent2:#374151; --accent-soft:#eef0f3; --tab-line:#6b7280; --panel-head:#4b5563; --panel-head2:#374151; --link:#374151; --row-hover:#f1f3f5; --sel:#fdf3d6; --bar-blue:#c3c8cf }
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;font-family:Inter,"Segoe UI",Tahoma,Arial,sans-serif;font-size:12px;font-variant-numeric:tabular-nums;color:var(--txt);
  background:#e9ecef;overflow:hidden;
}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
button,input,select{font-family:inherit;font-size:12px}
.hidden{display:none!important}
.muted{color:var(--txt2)}
.pos{color:var(--pos)}
.neg{color:var(--neg)}
.b{font-weight:bold}
.r{text-align:right}
.c{text-align:center}
.nowrap{white-space:nowrap}
.sm{font-size:11px}
.xs{font-size:10px}

/* ---------- Barra superior (oscura) ---------- */
#topbar{
  height:46px;background:var(--top-bg);color:var(--top-txt);display:flex;align-items:center;
  padding:0 12px;gap:14px;position:fixed;top:0;left:0;right:0;z-index:50;border-bottom:2px solid var(--accent);
}
#topbar .logo{font-size:19px;font-weight:bold;color:#fff;letter-spacing:.3px;display:flex;align-items:center;gap:8px;min-width:190px}
#topbar .logo span{color:var(--logo)}
#topbar .logo .avatar{width:32px;height:32px;border-radius:50%;object-fit:cover;background:#fff;border:2px solid var(--accent);flex:none}
#topbar .logo small{font-size:9px;color:#8fa0b0;font-weight:normal;letter-spacing:2px;margin-left:2px}
#tickerbox{position:relative;margin-left:auto}
#tickerbox input{width:220px;height:28px;border:1px solid var(--top-border2);background:var(--top-bg2);color:#fff;border-radius:14px;padding:0 12px;text-transform:uppercase}
#tickerbox input::placeholder{color:#7b8b9a;text-transform:none}
#tickerbox .sug{position:absolute;top:31px;right:0;width:380px;background:#fff;border:1px solid #b9c0c8;box-shadow:0 6px 16px rgba(0,0,0,.25);z-index:60;max-height:320px;overflow:auto;color:var(--txt)}
#tickerbox .sug div{padding:5px 8px;cursor:pointer;display:flex;gap:8px;border-bottom:1px solid var(--border2)}
#tickerbox .sug div:hover{background:var(--row-hover)}
#tickerbox .sug b{min-width:64px}
#tickerbox .sug small{margin-left:auto;color:var(--txt2)}
#topbar .plan{font-size:10px;color:#8fa0b0;letter-spacing:1px;text-transform:uppercase}
#topbar .cfg{border:1px solid var(--top-border2);background:var(--tape-bg);color:#e6edf3;border-radius:3px;padding:3px 8px;cursor:pointer;text-decoration:none}
#topbar .cfg:hover{background:var(--top-border)}
/* cinta de índices */
#tape{position:fixed;top:46px;left:0;right:0;height:24px;background:var(--tape-bg);color:#dfe7ee;z-index:49;display:flex;align-items:center;padding:0 12px;gap:22px;font-size:11.5px;overflow:hidden;white-space:nowrap}
#tape .idx{flex:1;min-width:0;overflow:hidden;position:relative}
#tape .track{display:inline-flex;white-space:nowrap;will-change:transform;animation:tape var(--tape-dur,60s) linear infinite}
#tape .run{display:inline-flex;gap:22px;padding-right:22px}
#tape:hover .track{animation-play-state:paused}
@keyframes tape{from{transform:translateX(0)}to{transform:translateX(-50%)}}
#tape b{color:#fff;margin-right:5px;font-weight:600}
#tape .pos{color:#5fd38d}#tape .neg{color:#ff8a80}
#tape .clock{margin-left:auto;color:#8fa0b0}

/* ---------- Barra lateral (clara) ---------- */
#sidebar{
  position:fixed;top:70px;left:0;bottom:0;width:190px;background:var(--sb-bg);color:var(--sb-txt);
  overflow-y:auto;overflow-x:hidden;z-index:40;border-right:1px solid var(--border);
}
#sidebar::-webkit-scrollbar{width:6px}
#sidebar::-webkit-scrollbar-thumb{background:#c3cbd4;border-radius:3px}
#sidebar .start{display:none}
#sidebar h4{margin:12px 0 3px;padding:0 12px;color:var(--sb-head);font-size:10px;letter-spacing:1.2px;text-transform:uppercase;font-weight:600}
#sidebar a.item{
  display:flex;align-items:center;gap:8px;padding:5px 10px 5px 12px;color:var(--sb-txt);text-decoration:none;font-size:12.5px;border-left:3px solid transparent;
}
#sidebar a.item i{width:16px;display:inline-flex;justify-content:center;font-style:normal;opacity:.85}
#sidebar a.item.on i{opacity:1;color:var(--accent)}
#sidebar a.item:hover{background:var(--sb-bg2);text-decoration:none}
#sidebar a.item.on{background:#fff;color:var(--accent2);border-left-color:var(--accent);font-weight:600}
#sidebar .foot{padding:14px 12px;font-size:10px;color:#8a95a1;border-top:1px solid var(--border);margin-top:14px}

/* ---------- Contenido ---------- */
#main{position:fixed;top:70px;left:190px;right:0;bottom:0;overflow:auto;background:#fff}
.crumbs{background:#fafbfc;border-bottom:1px solid var(--border);padding:4px 10px;font-size:11px;color:var(--txt2)}
.crumbs a{color:var(--txt2)}
.crumbs span.sep{margin:0 6px}
.ptitle{
  background:#fff;color:var(--txt);font-weight:bold;font-size:13.5px;padding:7px 10px 7px 12px;display:flex;align-items:center;gap:10px;
  border-left:5px solid var(--accent);border-bottom:1px solid var(--border);border-top:1px solid var(--border);
}
.ptitle .tools{margin-left:auto;display:flex;gap:8px;font-weight:normal;font-size:11px;align-items:center}
.ptitle .tools a{color:var(--link)}
.ptitle .tools button{background:#fff;border:1px solid #c6ced6;border-radius:3px;padding:3px 9px;cursor:pointer;color:#222}
.ptitle .tools button:hover{background:var(--accent-soft);border-color:var(--accent)}

/* pestañas (subrayado) */
.tabs{display:flex;background:var(--tab-bg);border-bottom:2px solid var(--border);padding:0 8px;gap:4px;overflow-x:auto}
.tabs a{
  padding:7px 10px 5px;color:#3a4652;border-bottom:3px solid transparent;margin-bottom:-2px;font-size:12px;white-space:nowrap;cursor:pointer;text-decoration:none
}
.tabs a:hover{color:var(--accent2);background:#eef2f5;text-decoration:none}
.tabs a.on{color:var(--accent2);font-weight:bold;border-bottom-color:var(--tab-line)}
/* Pestañas agrupadas en menús (ficha del valor) */
.tabs.tabsg{overflow:visible;flex-wrap:wrap}
.tabsg .tg{position:relative;display:flex}
.tabsg .tgb{padding:7px 10px 5px;color:#3a4652;border-bottom:3px solid transparent;margin-bottom:-2px;font-size:12px;white-space:nowrap;cursor:pointer;user-select:none}
.tabsg .tgb:hover{color:var(--accent2);background:#eef2f5}
.tabsg .tg.on>.tgb{color:var(--accent2);font-weight:bold;border-bottom-color:var(--tab-line)}
.tabsg .tgm{display:none;position:absolute;top:100%;left:0;margin-top:2px;min-width:200px;background:#fff;border:1px solid var(--border);border-radius:6px;box-shadow:0 8px 22px rgba(0,0,0,.14);z-index:60;padding:4px 0}
.tabsg .tg.open>.tgm{display:block}
.tabsg .tgm.der{left:auto;right:0}
.tabsg .tgm a{display:block;margin:0;padding:6px 14px;border-bottom:0}
.tabsg .tgm a.on{background:var(--accent-soft);border-bottom:0}

/* rejilla de bloques */
.grid{display:grid;gap:10px;padding:10px;background:var(--card-page)}
.grid+.grid{padding-top:0}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
/* Bloques como tarjetas: esquinas redondeadas y separación entre ellas */
.blk{padding:10px 12px;background:#fff;border:1px solid var(--border2);border-radius:10px;box-shadow:0 1px 2px rgba(16,24,40,.05);min-width:0;overflow:auto}
:not(.grid)>.blk{margin:10px}
.blk table.data td:first-child,.blk table.kv td:first-child{white-space:normal}
/* Título de bloque: minúscula normal con icono propio (T.iconosBloques); la ayuda sale al pasar el ratón */
.blk h3{margin:0 0 8px;font-size:13.5px;font-weight:600;display:flex;align-items:center;gap:7px;color:var(--txt)}
/* Iconos de línea (T.ico): mismo trazo en toda la web, toman el color del texto */
svg.ico{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vertical-align:-3px;flex:none}
i.ico{display:inline-flex;font-style:normal}
button svg.ico,.btn svg.ico{margin-right:3px}
#topbar .bell svg.ico,#topbar .cfg svg.ico{width:16px;height:16px;vertical-align:-3px}
.blk h3 svg.hic{width:17px;height:17px;flex:none;fill:none;stroke:var(--accent);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.blk h3[title]{cursor:help}
/* si no cabe, los botones de periodo bajan a otra línea enteros en vez de apilarse uno a uno */
.blk h3{flex-wrap:wrap;row-gap:6px}
.blk h3 .ranges{flex-wrap:nowrap;margin-left:auto}
.blk h3 .info{display:none}
.blk h3 .right{margin-left:auto;font-weight:normal;font-size:11px}
.blk h3 .warn{margin-left:auto;font-weight:normal;font-size:11px;color:#c99700}

/* tablas de pares clave/valor */
table.kv{width:100%;border-collapse:collapse}
table.kv td{padding:2px 4px;vertical-align:middle;line-height:1.35}
table.kv td:first-child{color:#333;white-space:nowrap}
table.kv td.v{text-align:right;white-space:nowrap}
table.kv td.l{text-align:left}
table.kv th{font-weight:bold;text-align:right;padding:2px 4px;font-size:11.5px}
table.kv th:first-child{text-align:left}
table.kv tr.sub td{padding-left:14px}
table.kv tr.head td{font-weight:bold;padding-top:6px;color:var(--accent2)}

/* tablas de datos (grid) */
table.data{width:100%;border-collapse:collapse;font-size:12px}
table.data th{
  background:#eef2f5;border-bottom:1px solid var(--border);border-right:1px solid var(--border2);padding:5px 6px;text-align:right;
  font-weight:bold;white-space:nowrap;position:sticky;top:0;z-index:2;cursor:pointer;user-select:none
}
table.data th:first-child,table.data th.l{text-align:left}
table.data th.sorted::after{content:" ▲";font-size:9px}
table.data th.sorted.desc::after{content:" ▼"}
table.data td{padding:4px 6px;border-bottom:1px solid var(--border2);border-right:1px solid var(--border2);text-align:right;white-space:nowrap}
table.data td:first-child,table.data td.l{text-align:left}
table.data.fija tr>*:nth-child(-n+2){position:sticky;left:0;z-index:1;background:var(--panel,#fff)}
table.data.fija tr>*:nth-child(2){left:var(--fc1,70px);box-shadow:inset -1px 0 0 var(--border)}
table.data.fija th:nth-child(-n+2){z-index:3;background:#eef2f5}
table.data tr:hover td{background:var(--row-hover)}
/* Fila seleccionada: gris suave y franja del color de acento a la izquierda (igual en todos los temas) */
table.data tr.sel td{background:#eef1f5}
table.data tr.sel td:first-child{box-shadow:inset 3px 0 0 var(--accent)}
table.data td a.tk{font-weight:bold}
table.data.compact td{padding:2px 5px}
table.data.compact th{padding:3px 5px}
.tscroll{overflow:auto;min-height:0}

/* puntuaciones redondas */
/* Notas 0-100 en anillo de progreso (T.score / T.anillo) */
.anillo{position:relative;display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;vertical-align:middle}
.anillo svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.anillo circle{fill:none;stroke-width:3.6}
.anillo .f{stroke:var(--border2)}
.anillo .a{stroke-linecap:round}
.anillo.g .a{stroke:var(--score-g)}.anillo.y .a{stroke:var(--score-y)}.anillo.r .a{stroke:var(--score-r)}
.anillo b{position:relative;font-size:10px;font-weight:600;color:var(--txt)}
.anillo.n{color:var(--txt2)}
.score{display:inline-block;min-width:24px;padding:2px 5px;border-radius:12px;color:#fff;font-weight:bold;text-align:center;font-size:11px}
.score.g{background:var(--score-g)}
.score.y{background:var(--score-y);color:#222}
.score.r{background:var(--score-r)}
.score.n{background:#aab2bc}

/* barras de rango */
.rng{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.rng>span:first-child{display:inline-block;text-align:right}
.rng>span:last-child{display:inline-block;text-align:left}
.rng .bar{width:70px;height:9px;background:var(--bar-bg);border:1px solid #c6cdd6;position:relative;display:inline-block}
.rng .bar i{position:absolute;top:0;bottom:0;background:var(--bar-blue)}
.rng .bar b{position:absolute;top:-2px;width:2px;height:11px;background:#1f3f6b}
.minibar{display:inline-block;height:9px;background:var(--pos);vertical-align:middle}
.b0{position:relative;display:inline-block;width:84px;height:9px;vertical-align:middle}
.b0::before{content:"";position:absolute;left:50%;top:-3px;bottom:-3px;width:1px;background:#b8c0ca}
.b0 i{position:absolute;top:0;bottom:0;border-radius:1px}
.b0 i.p{left:50%;background:var(--pos)}.b0 i.n{right:50%;background:var(--neg)}
tr.sec td{background:var(--tab-bg);font-weight:600}
.minibar.neg{background:var(--neg)}

/* gráfico precio con rangos */
.chartwrap{position:relative;height:180px}
/* Botones de periodo / selección: un único control en píldoras en toda la web (1D · 5D · 1M · 3M · 6M · YTD · 1A · 5A · Máx) */
.ranges{display:inline-flex;flex-wrap:wrap;gap:2px;margin:6px 0;padding:2px;background:var(--tab-bg);border:1px solid var(--border2);border-radius:999px}
.ranges a{border:0;background:transparent;padding:3px 10px;font-size:11.5px;cursor:pointer;color:var(--txt2);text-decoration:none;border-radius:999px;line-height:1.4}
.ranges a:hover{color:var(--txt);background:#fff;text-decoration:none}
.ranges a.on{background:#fff;color:var(--accent2);font-weight:600;box-shadow:0 1px 2px rgba(16,24,40,.12)}
.price-big{font-size:20px;font-weight:bold}
.price-chg{font-size:16px;font-weight:bold;margin-left:6px}
.asof{color:var(--txt2);font-size:11px;margin-left:6px}

/* segmentos de puntuación (cuadritos) */
.seg{display:inline-flex;gap:2px;vertical-align:middle;margin-left:6px}
.seg i{width:12px;height:12px;display:inline-block;border-radius:2px}

/* layout "Todo" con paneles */
.split{display:grid;grid-template-columns:1fr 440px;height:100%}
.split .left{display:flex;flex-direction:column;min-width:0;border-right:1px solid var(--border)}
.split .left .top{flex:1 1 50%;overflow:auto;min-height:0}
.split .left .bottom{flex:1 1 50%;overflow:auto;border-top:1px solid var(--border);min-height:0}
.split .right{overflow:auto;min-width:0}
/* Barra de selección: sustituye al árbol de carpetas (fichas de acceso rápido + desplegables) */
.conbarra{display:flex;flex-direction:column;height:100%}
.conbarra>.split{flex:1;min-height:0;height:auto}
.conbarra>.fill{flex:1;min-height:0;overflow:auto}
.selbar{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:6px 10px;border-bottom:1px solid var(--border);background:#fafbfc}
.selbar .sbl{font-size:11px;font-weight:600;color:var(--txt2);text-transform:uppercase;letter-spacing:.05em;margin-right:4px}
.selbar .chip,.selbar .ddb{display:inline-block;padding:3px 11px;border:1px solid var(--border);border-radius:999px;background:#fff;cursor:pointer;white-space:nowrap;color:var(--txt);font-size:12px;line-height:1.5;text-decoration:none;user-select:none}
.selbar .ddb{border-radius:5px;padding:3px 9px}
.selbar .chip:hover,.selbar .ddb:hover{border-color:var(--accent);text-decoration:none}
.selbar .chip.on,.selbar .ddb.on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent2);font-weight:600}
.selbar .chip .n{color:var(--txt2);font-weight:normal;font-size:11px;margin-left:2px}
.selbar .chip.new{border-style:dashed;color:var(--txt2);background:transparent}
.selbar .sep{width:1px;height:18px;background:var(--border);margin:0 4px}
.selbar .dd{position:relative}
.selbar .ddm{display:none;position:absolute;top:calc(100% + 4px);left:0;min-width:200px;max-height:360px;overflow:auto;background:#fff;border:1px solid var(--border);border-radius:6px;box-shadow:0 8px 22px rgba(0,0,0,.14);z-index:60;padding:4px 0}
.selbar .dd.open .ddm{display:block}
.selbar .ddm [data-k]{padding:5px 14px;cursor:pointer;white-space:nowrap}
.selbar .ddm [data-k]:hover{background:var(--row-hover)}
.selbar .ddm [data-k].on{color:var(--accent2);font-weight:600;background:var(--accent-soft)}
.selbar .ddm .vac{padding:5px 14px;color:var(--txt2)}
.navtree{width:230px;border-right:1px solid var(--border);background:#fafbfc;overflow:auto}
.navtree .nt{padding:3px 8px;cursor:pointer;white-space:nowrap}
.navtree .nt:hover{background:var(--row-hover)}
.navtree .nt.on{background:var(--accent-soft);color:var(--accent2);font-weight:600}
.navtree .lvl1{padding-left:22px}
.navtree .lvl2{padding-left:40px}
.withtree{display:grid;grid-template-columns:230px 1fr;height:100%}
.withtree>.content{overflow:auto;min-width:0}
.ticklist{width:92px;border-right:1px solid var(--border);overflow:auto;background:#fafbfc}
.ticklist div{padding:3px 8px;border-bottom:1px solid var(--border2);cursor:pointer;font-weight:bold}
.ticklist div.on{background:var(--accent-soft);color:var(--accent2)}
.ticklist div:hover{background:var(--row-hover)}

/* noticias */
.news{padding:8px 10px}
.news .n{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid var(--border2)}
.news .n img{width:72px;height:54px;object-fit:cover;background:#eee;flex:none}
.news .n .t{font-weight:bold;font-size:13px}
.news .n .s{color:var(--txt2);font-size:11px;margin:2px 0}
.news .n .x{font-size:11.5px;color:#333}

/* botones y formularios */
.btn{border:1px solid #b9c0c8;background:#f6f7f9;border-radius:3px;padding:4px 10px;cursor:pointer;color:#222}
.btn:hover{background:#e9ecef}
.btn.pri{background:var(--accent);border-color:var(--accent2);color:#fff}
.btn.sm{padding:2px 6px;font-size:11px}
.toolbar{display:flex;gap:8px;align-items:center;padding:6px 10px;border-bottom:1px solid var(--border);background:#fafbfc;flex-wrap:wrap}
.toolbar input,.toolbar select{height:24px;border:1px solid #b9c0c8;border-radius:3px;padding:0 6px}
.box{border:1px solid var(--border);margin:8px 10px}
.box h3{margin:0;background:#eef2f5;padding:5px 8px;font-size:12.5px;border-bottom:1px solid var(--border)}
.pad{padding:8px 10px}

/* estados */
.loading{color:var(--txt2);padding:10px;font-style:italic}
.err{color:var(--neg);padding:10px}
.spinner{display:inline-block;width:10px;height:10px;border:2px solid #cfd6de;border-top-color:var(--panel-head);border-radius:50%;animation:spin .8s linear infinite;vertical-align:middle;margin-right:5px}
@keyframes spin{to{transform:rotate(360deg)}}

/* mapa de calor (correlación) */
table.heat td{text-align:center;min-width:40px;font-size:11px}
table.heat td.k{font-weight:bold;text-align:left;background:#f3f5f7}

/* aviso */
.notice{background:#fff8d6;border:1px solid #e6d58a;padding:8px 12px;margin:10px;border-radius:3px}
.notice a{font-weight:bold}

/* donut leyenda */
.legend{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:11px;margin-top:6px}
.legend i{display:inline-block;width:10px;height:10px;margin-right:4px;vertical-align:middle}

@media (max-width:900px){
  #sidebar{width:150px}#main{left:150px}#tape{display:none}#main,#sidebar{top:46px}
  .g3,.g4{grid-template-columns:1fr 1fr}
  .split{grid-template-columns:1fr}
}

/* Botón «¿Tienes alguna sugerencia?» de la barra superior y su ventana */
#topbar .sugbtn{display:inline-flex;align-items:center;gap:6px;margin-right:12px;padding:5px 11px;border-radius:999px;border:1px solid var(--accent);
  background:transparent;color:#fff;font:inherit;font-size:12px;cursor:pointer;white-space:nowrap;flex:none}
#topbar .sugbtn svg{width:15px;height:15px;fill:none;stroke:var(--logo);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#topbar .sugbtn:hover{background:var(--accent)}
#topbar .sugbtn:hover svg{stroke:#fff}
#topbar a.novbtn{text-decoration:none}
#topbar .novbtn .nvpunto{font-style:normal;font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;background:#1a9a3c;color:#fff;border-radius:5px;padding:1px 5px;margin-left:2px}
@media (max-width:1100px){ #topbar .sugbtn span{display:none} #topbar .sugbtn{padding:5px 8px} }
#sugVentana{position:fixed;inset:0;z-index:95;background:rgba(10,12,16,.55);display:flex;align-items:center;justify-content:center;padding:20px}
#sugVentana .sug-card{background:var(--panel,#fff);color:var(--txt);width:min(520px,100%);border-radius:12px;box-shadow:0 24px 60px rgba(0,0,0,.35);border-top:4px solid var(--accent);padding:16px 18px;display:flex;flex-direction:column;gap:8px}
#sugVentana .sug-cab{display:flex;gap:10px;align-items:flex-start;margin-bottom:4px}
#sugVentana .sug-ico svg{width:24px;height:24px;fill:none;stroke:var(--accent);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#sugVentana .sug-tit{font-size:16px;font-weight:600}
#sugVentana .sug-sub{font-size:12.5px;color:var(--txt2);line-height:1.5;margin-top:2px}
#sugVentana .sug-x{margin-left:auto;border:0;background:transparent;font-size:16px;cursor:pointer;color:var(--txt2)}
#sugVentana .sug-et{font-size:12px;font-weight:600;color:var(--txt2)}
#sugVentana select{max-width:260px}
#sugVentana textarea{width:100%;min-height:140px;box-sizing:border-box;font:inherit;font-size:13px;line-height:1.5;padding:8px;border:1px solid var(--border);border-radius:6px;resize:vertical;background:transparent;color:inherit}
#sugVentana textarea:focus{outline:2px solid var(--accent);outline-offset:-1px}
#sugVentana .sug-trampa{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
#sugVentana .sug-pie{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:4px}
#sugVentana .sug-nota{font-size:11.5px;color:var(--txt2);margin-right:auto;flex:1 1 220px}
#sugVentana .sug-gracias{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;padding:14px 6px}
#sugVentana .sug-gracias p{margin:0;color:var(--txt2);font-size:13px}
:root:not([data-modo="oscuro"]) #sugVentana .sug-card{--panel:#fff}

/* Tablero de cuadros movibles (T.tablero): rejilla de 12 columnas; cada cuadro ocupa data-w columnas */
.panelgrid{grid-template-columns:repeat(12,minmax(0,1fr))}
.grid+.panelgrid,.tablero-ayuda+.panelgrid{padding-top:0}
.panelgrid>.blk{grid-column:span var(--w,6);position:relative}
.panelgrid>.blk>h3{cursor:grab;padding-right:26px}
.panelgrid>.blk>h3 .asa{color:var(--txt2);font-size:13px;letter-spacing:-2px;cursor:grab;user-select:none;margin-right:-2px}
.panelgrid>.blk>.ancho{position:absolute;top:8px;right:8px;border:1px solid var(--border2);background:transparent;color:var(--txt2);border-radius:5px;font-size:11px;line-height:1;padding:3px 5px;cursor:pointer}
.panelgrid>.blk>.ancho:hover{color:var(--accent);border-color:var(--accent)}
.panelgrid>.blk.arrastrando{opacity:.45}
.panelgrid>.blk.destino-antes{box-shadow:inset 4px 0 0 var(--accent)}
.panelgrid>.blk.destino-despues{box-shadow:inset -4px 0 0 var(--accent)}
.tablero-ayuda{font-size:11.5px;color:var(--txt2);padding:8px 12px 0;background:var(--card-page);text-align:right}
@media (max-width:900px){ .panelgrid>.blk{grid-column:1/-1} .panelgrid>.blk>.ancho{display:none} }

/* Pestaña para ocultar o mostrar la ficha de la derecha */
.conficha{position:relative}
.fichaoculta>.panelficha{display:none}
.fichaoculta{padding-right:30px}
.fichatog{position:absolute;right:0;top:0;bottom:0;width:30px;z-index:6;border:0;border-left:1px solid var(--border);
  background:var(--accent-soft,#f1f4f7);color:var(--accent);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;writing-mode:vertical-rl;padding:14px 0;text-align:start}
.fichatog:hover{background:var(--accent);color:#fff}
:root[data-modo="oscuro"] .fichatog{background:var(--panel2)}
@media (max-width:900px){ .fichatog{display:none} }

/* ---------- Sesión, campana de avisos y estado de sincronización (barra superior) ---------- */
#topbar .bell{position:relative;color:#e6edf3;text-decoration:none;font-size:15px;padding:2px 6px;border-radius:3px}
#topbar .bell:hover{background:var(--tape-bg)}
#topbar .bell span{position:absolute;top:-4px;right:-2px;background:#d12a2a;color:#fff;font-size:9px;font-weight:bold;min-width:15px;height:15px;line-height:15px;text-align:center;border-radius:8px;padding:0 3px}
#topbar .bell.ring{animation:ring 1.6s ease-in-out 2}
@keyframes ring{0%,100%{transform:rotate(0)}15%{transform:rotate(14deg)}30%{transform:rotate(-12deg)}45%{transform:rotate(8deg)}60%{transform:rotate(-6deg)}75%{transform:rotate(3deg)}}
#topbar .user{display:flex;align-items:center;gap:6px;font-size:11px;color:#c7d2dc;max-width:200px}
#topbar .user .mail{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#topbar .sync{display:inline-block;width:8px;height:8px;border-radius:50%;background:#5d6975;flex:none}
#topbar .sync.ok{background:#5fd38d}
#topbar .sync.pendiente{background:#f0ad4e;animation:pulse 1s ease-in-out infinite}
#topbar .sync.error{background:#ff8a80}
@keyframes pulse{50%{opacity:.35}}
@media (max-width:1100px){#topbar .user .mail{display:none}}

/* ---------- Avisos flotantes (toast) ---------- */
#toasts{position:fixed;right:14px;bottom:14px;z-index:200;display:flex;flex-direction:column;gap:8px;max-width:360px}
.toast{background:var(--top-bg);color:#e6edf3;border-left:4px solid var(--amber);padding:10px 12px;border-radius:4px;box-shadow:0 8px 24px rgba(0,0,0,.35);font-size:12.5px;line-height:1.4;animation:toastin .25s ease-out}
.toast a{color:var(--logo);font-weight:bold;margin-left:6px}
.toast.out{opacity:0;transform:translateX(20px);transition:all .4s}
@keyframes toastin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ---------- Planes: candados (DEMO) y distintivo VIP/DEMO ---------- */
#sidebar a.item.locked{color:#9aa4ae}
#sidebar a.item.locked i{opacity:.45}
#sidebar a.item .lk{margin-left:auto;opacity:.6;display:inline-flex}
#topbar .planTag{font-size:10px;font-weight:700;letter-spacing:1px;padding:2px 8px;border-radius:10px}
#topbar .planTag.vip{background:var(--accent);color:#fff}
#topbar .planTag.demo{background:#3f424a;color:#f0c040;border:1px solid #f0c040}
#main.bloqueado{filter:blur(4px) grayscale(.4);pointer-events:none;user-select:none}
#candado{position:fixed;top:70px;left:190px;right:0;bottom:0;z-index:45;display:flex;align-items:center;justify-content:center;background:rgba(15,16,19,.25);padding:20px}
#candado .card{background:#fff;border:1px solid var(--border);border-top:4px solid var(--accent);border-radius:8px;box-shadow:0 18px 50px rgba(0,0,0,.3);padding:26px 30px;max-width:560px;text-align:center}
#candado .ico{font-size:38px;line-height:1}
#candado h2{margin:8px 0 6px;font-size:18px}
#candado p{color:var(--txt2);line-height:1.5;margin:8px 0}
#candado .dow{display:flex;flex-wrap:wrap;gap:5px;justify-content:center;margin:12px 0}
#candado .dow a{border:1px solid var(--border);border-radius:12px;padding:2px 9px;font-weight:600;font-size:12px}
#candado .dow a:hover{background:var(--accent-soft);text-decoration:none}
#candado .tag{display:inline-block;margin-top:6px;font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--txt2)}
@media (max-width:900px){#candado{left:150px;top:46px}}

/* =====================================================================
   MODO OSCURO (data-modo="oscuro" en <html>). Se combina con cualquier tema de color:
   el tema pone el color de acento y el modo pone los fondos y textos.
   ===================================================================== */
:root[data-modo="oscuro"]{ --d-bg:#0f1216; --panel:#171b21; --panel2:#1d222a;
  --border:#2c333d; --border2:#232a33; --txt:#e3e8ee; --txt2:#9aa5b1; --row-alt:#1a1f26; --row-hover:#222934; --tab-bg:#151a20; --card-page:#0f1216;
  --sb-bg:#13171c; --sb-bg2:#1d232b; --sb-txt:#c9d1d9; --sb-head:#7d8896; --bar-bg:#262c35; --pos:#3fbf73; --neg:#ff6b6b;
  --accent-soft:color-mix(in srgb, var(--accent) 22%, transparent); --accent2:color-mix(in srgb, var(--accent) 70%, #fff); --link:color-mix(in srgb, var(--accent) 65%, #fff); color-scheme:dark }
:root[data-modo="oscuro"] body{background:var(--d-bg);color:var(--txt)}
:root[data-modo="oscuro"] #main{background:var(--d-bg)}
:root[data-modo="oscuro"] .crumbs,:root[data-modo="oscuro"] .toolbar,:root[data-modo="oscuro"] .selbar,:root[data-modo="oscuro"] .navtree,:root[data-modo="oscuro"] .ticklist,:root[data-modo="oscuro"] .box h3,:root[data-modo="oscuro"] table.data th,:root[data-modo="oscuro"] .tabs{background:var(--panel2);color:var(--txt2)}
:root[data-modo="oscuro"] .ptitle,:root[data-modo="oscuro"] .blk,:root[data-modo="oscuro"] .box,:root[data-modo="oscuro"] #candado .card,:root[data-modo="oscuro"] .tabsg .tgm,:root[data-modo="oscuro"] .selbar .ddm,:root[data-modo="oscuro"] #tickerbox .sug{background:var(--panel);color:var(--txt)}
:root[data-modo="oscuro"] .ptitle .tools button,:root[data-modo="oscuro"] .btn,:root[data-modo="oscuro"] .selbar .chip,:root[data-modo="oscuro"] .selbar .ddb,:root[data-modo="oscuro"] input,:root[data-modo="oscuro"] select,:root[data-modo="oscuro"] textarea{background:var(--panel2);color:var(--txt);border-color:var(--border)}
:root[data-modo="oscuro"] .btn:hover,:root[data-modo="oscuro"] .ptitle .tools button:hover{background:var(--row-hover)}
:root[data-modo="oscuro"] .btn.pri{background:var(--accent);color:#fff;border-color:var(--accent)}
:root[data-modo="oscuro"] .tabs a,:root[data-modo="oscuro"] .tabsg .tgb{color:var(--txt2)} :root[data-modo="oscuro"] .tabs a:hover,:root[data-modo="oscuro"] .tabsg .tgb:hover{background:var(--row-hover);color:var(--txt)}
:root[data-modo="oscuro"] #sidebar a.item.on{background:var(--panel)}
:root[data-modo="oscuro"] table.kv td:first-child,:root[data-modo="oscuro"] .news .n .x{color:var(--txt)}
:root[data-modo="oscuro"] table.data td{border-color:var(--border2)}
:root[data-modo="oscuro"] table.data.fija th:nth-child(-n+2){background:var(--panel2)}
:root[data-modo="oscuro"] table.data tr.sel td{background:var(--row-hover)}
:root[data-modo="oscuro"] .ranges a:hover,:root[data-modo="oscuro"] .ranges a.on{background:var(--panel)}
:root[data-modo="oscuro"] .rng .bar{border-color:var(--border)} :root[data-modo="oscuro"] .rng .bar b{background:var(--txt)}
:root[data-modo="oscuro"] .b0::before{background:var(--border)}
:root[data-modo="oscuro"] .notice{background:rgba(240,192,64,.12);border-color:var(--border)}
:root[data-modo="oscuro"] .spinner{border-color:var(--border);border-top-color:var(--accent)}
:root[data-modo="oscuro"] #sidebar::-webkit-scrollbar-thumb,:root[data-modo="oscuro"] ::-webkit-scrollbar-thumb{background:#38404b}
:root[data-modo="oscuro"] .muted{color:var(--txt2)}
:root[data-modo="oscuro"] .anillo b{color:var(--txt)}
:root[data-modo="oscuro"] .desc,:root[data-modo="oscuro"] .blk p{color:var(--txt)}
/* estilos escritos dentro de las páginas */
:root[data-modo="oscuro"] [style*="background:#fff;"],:root[data-modo="oscuro"] [style$="background:#fff"],:root[data-modo="oscuro"] [style*="background:#fff\""]{background:var(--panel)!important}
:root[data-modo="oscuro"] [style*="background:#fafbfc"],:root[data-modo="oscuro"] [style*="background:#f3f5f7"],:root[data-modo="oscuro"] [style*="background:#eef3fa"],:root[data-modo="oscuro"] [style*="background:#eef2f5"],:root[data-modo="oscuro"] [style*="background:#eef1f5"]{background:var(--panel2)!important}
:root[data-modo="oscuro"] [style*="background:#fff3cd"],:root[data-modo="oscuro"] [style*="background:#fff6cc"],:root[data-modo="oscuro"] [style*="background:#fdf3d6"],:root[data-modo="oscuro"] [style*="background:#fff3a3"]{background:rgba(240,192,64,.16)!important}
:root[data-modo="oscuro"] [style*="background:#fde3e3"]{background:rgba(255,107,107,.16)!important}
:root[data-modo="oscuro"] [style*="background:#e3f4e8"]{background:rgba(63,191,115,.16)!important}
:root[data-modo="oscuro"] [style*="color:#222"],:root[data-modo="oscuro"] [style*="color:#333"]{color:var(--txt)!important}

/* «Las 3 noticias del día» */
#notiDia{position:fixed;inset:0;z-index:90;background:rgba(10,12,16,.55);display:flex;align-items:center;justify-content:center;padding:20px}
#notiDia .nd-card{background:var(--panel,#fff);color:var(--txt);width:min(720px,100%);max-height:calc(100vh - 40px);overflow:auto;border-radius:14px;box-shadow:0 24px 60px rgba(0,0,0,.35);border-top:4px solid var(--accent)}
#notiDia .nd-cab{display:flex;align-items:center;gap:12px;padding:16px 18px 10px}
#notiDia .nd-ico{color:var(--accent)} #notiDia .nd-ico svg.ico{width:26px;height:26px}
#notiDia .nd-tit{font-size:18px;font-weight:700} #notiDia .nd-fecha{font-size:12px;color:var(--txt2)}
#notiDia .nd-x{margin-left:auto;border:0;background:transparent;font-size:16px;cursor:pointer;color:var(--txt2)}
#notiDia .nd-lista{margin:0;padding:0 18px 0 40px}
#notiDia .nd-lista li{padding:9px 0;border-bottom:1px solid var(--border2)}
#notiDia .nd-lista li::marker{color:var(--accent);font-weight:700}
#notiDia .nd-h{font-size:14.5px;font-weight:600;margin-bottom:4px}
#notiDia p{margin:4px 0;font-size:13px;line-height:1.55}
#notiDia .nd-imp{color:var(--accent2);font-weight:500}
#notiDia .nd-carga{padding:26px 20px;color:var(--txt2);text-align:center}
#notiDia .nd-pie{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:6px}
#notiDia .nd-tk{font-size:11px;font-weight:600;padding:1px 8px;border-radius:999px;background:var(--accent-soft);color:var(--accent2);text-decoration:none}
#notiDia .nd-src{font-size:11.5px;margin-left:auto;color:var(--txt2)}
#notiDia .nd-fin{display:flex;align-items:center;gap:10px;padding:12px 18px 16px;flex-wrap:wrap}
#notiDia .nd-aviso{flex:1;min-width:200px;font-size:11px;color:var(--txt2)}
:root:not([data-modo="oscuro"]) #notiDia .nd-card{--panel:#fff}

/* ---------- Móvil (menos de 760 px de ancho) ----------
   Menú lateral plegable con ☰, barra superior compacta (la lupa despliega el buscador), cinta de índices en una línea,
   todo en una columna, tablas que se desplazan de lado y ventanas a pantalla completa. En el ordenador no cambia nada. */
.menubtn,.lupabtn,#menuVelo,#sidebar .solo-movil{display:none}
@media (max-width:760px){
  #topbar{height:50px;padding:0 6px;gap:4px}
  #topbar .menubtn,#topbar .lupabtn{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border:0;background:transparent;color:#fff;cursor:pointer;flex:none;border-radius:8px}
  #topbar .menubtn svg,#topbar .lupabtn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
  #topbar .lupabtn{margin-left:auto}
  #topbar .logo{min-width:0;font-size:16px;gap:6px}
  #topbar .logo small,#topbar .user,#topbar .planTag,#topbar .sugbtn,#topbar #modoBtn,#topbar #logoutBtn{display:none}
  #topbar .bell,#topbar .cfg{width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent}
  #topbar .bell svg.ico,#topbar .cfg svg.ico{width:20px;height:20px}
  #tickerbox{display:none;position:absolute;top:50px;left:0;right:0;margin:0;padding:8px;background:var(--top-bg);border-bottom:2px solid var(--accent);z-index:61}
  #topbar.buscando #tickerbox{display:block}
  #tickerbox input{width:100%;height:40px;font-size:16px;border-radius:20px;box-sizing:border-box}
  #tickerbox .sug{position:static;width:auto;max-height:60vh;margin-top:6px}
  #tickerbox .sug div{padding:10px 8px}
  #tape{display:flex;top:50px;height:26px;padding:0 8px}
  #tape .clock{display:none}
  #sidebar{top:0;width:min(280px,84vw);z-index:80;transform:translateX(-102%);transition:transform .2s ease;box-shadow:4px 0 24px rgba(0,0,0,.25);padding-bottom:env(safe-area-inset-bottom,0px)}
  body.menu-abierto #sidebar{transform:none}
  body.menu-abierto #menuVelo{display:block;position:fixed;inset:0;background:rgba(10,12,16,.45);z-index:79}
  #sidebar a.item{padding:10px 14px;font-size:14px}
  #sidebar h4{font-size:11px;margin-top:16px}
  #sidebar .solo-movil{display:block;border-top:1px solid var(--border);margin-top:10px}
  #main{left:0;top:76px}
  #candado{left:0;top:76px}
  /* todo en una columna */
  .g2,.g3,.g4,.split,.panelgrid,.grid{grid-template-columns:minmax(0,1fr)!important}
  .panelgrid>.blk>h3 .asa,.tablero-ayuda,.ayuda-arrastre{display:none}
  .panelgrid>.blk>h3{cursor:default}
  .lay{grid-template-columns:1fr!important;height:auto!important}
  .lay>div{overflow:visible}
  .grid{padding:8px;gap:8px}
  .blk{padding:10px}
  .ptitle{flex-wrap:wrap;row-gap:6px}
  .ptitle .tools{flex-wrap:wrap}
  .toolbar{gap:6px;padding:8px}
  .toolbar input,.toolbar select{height:34px;max-width:100%;font-size:16px}
  .btn{padding:7px 12px}
  .tabs a{padding-top:9px;padding-bottom:7px}
  /* tablas: se desplazan de lado dentro de su caja, nunca la página */
  .tscroll,.blk{overflow-x:auto;-webkit-overflow-scrolling:touch}
  table.data{font-size:12.5px}
  /* ventanas a pantalla completa */
  #notiDia,#sugVentana,#impVentana{padding:0;align-items:stretch}
  #notiDia .nd-card,#sugVentana .sug-card,#impVentana .imp-card{width:100%;max-height:none;height:100%;border-radius:0;box-sizing:border-box;padding-bottom:calc(16px + env(safe-area-inset-bottom,0px))}
  #sugVentana textarea,#impVentana textarea,#impVentana input,#impVentana select,#sugVentana select{font-size:16px}
}

/* Móvil, fase 2: en Universos, Listas, Cotizaciones, Ideas y Screener la ficha se abre a pantalla completa al tocar un valor */
.fichabar{display:none}
@media (max-width:760px){
  .panelficha{display:none!important}
  .panelficha.abierta{display:flex!important;flex-direction:column;position:fixed;inset:0;z-index:85;background:var(--panel,#fff);overflow:hidden}
  .panelficha.abierta .fichabar{display:flex;align-items:center;gap:8px;min-height:48px;padding:env(safe-area-inset-top,0px) 6px 0;background:var(--top-bg);color:#fff;flex:none;border-bottom:2px solid var(--accent)}
  .fichavolver{border:0;background:transparent;color:#fff;font:inherit;font-size:15px;font-weight:600;padding:10px 12px;cursor:pointer}
  .fichatit{font-weight:600;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .panelficha.abierta iframe{flex:1;width:100%;height:auto!important;min-height:0;border:0}
  body.ficha-abierta{overflow:hidden}
  body.ficha-abierta #main{z-index:86}   /* #main es fijo y tiene su propia capa: hay que subirla por encima de la barra superior */
}

/* Móvil, fase 3: bloques plegables (opciones del gráfico, formularios de Carteras, filtros del Screener…) */
.plegable-btn{display:none}
@media (max-width:760px){
  .plegable-btn{display:flex;justify-content:space-between;align-items:center;width:calc(100% - 16px);margin:8px;font-weight:600;padding:10px 12px;box-sizing:border-box;text-align:left}
  .plegable.plegado{display:none!important}
}

/* Móvil: en las tablas solo queda fija la primera columna (el ticker), para no ocupar media pantalla */
@media (max-width:760px){
  table.data.fija tr>*:nth-child(2){position:static;box-shadow:none}
  table.data.fija tr>*:nth-child(1){box-shadow:inset -1px 0 0 var(--border)}
}

/* Móvil: tablas de etiqueta/valor que parten el texto y desplegables largos que no se salen */
@media (max-width:760px){
  table.kv{width:100%;table-layout:fixed}
  table.kv td{white-space:normal!important;overflow-wrap:anywhere}
  table.kv td.v{text-align:right}
  /* filas con botones, casillas o campos: el valor va debajo de la etiqueta, a todo el ancho */
  table.kv tr:has(button,input,select){display:flex;flex-wrap:wrap;gap:4px 8px;padding:4px 0}
  table.kv tr:has(button,input,select)>td{display:block;width:100%;text-align:left}
  .toolbar>span,.toolbar>label{max-width:100%}
  .toolbar select,#main select{max-width:calc(100vw - 40px)}
}

/* Desplegable de búsqueda de los campos de ticker (T.autocompletar) */
.acsug{position:fixed;z-index:120;background:var(--panel,#fff);color:var(--txt);border:1px solid var(--border);border-radius:8px;box-shadow:0 10px 26px rgba(0,0,0,.22);max-height:320px;overflow:auto}
.acsug div{display:flex;gap:8px;align-items:baseline;padding:7px 10px;cursor:pointer;border-bottom:1px solid var(--border2);font-size:12.5px}
.acsug div:last-child{border-bottom:0}
.acsug div:hover,.acsug div.on{background:var(--row-hover)}
.acsug b{min-width:72px;color:var(--accent2)}
.acsug span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acsug small{color:var(--txt2);white-space:nowrap}
:root:not([data-modo="oscuro"]) .acsug{--panel:#fff}
@media (max-width:760px){ .acsug div{padding:11px 10px;font-size:14px} }

/* Glosario: indicadores con explicación (subrayado de puntos) y globo al pasar el ratón */
.glos{text-decoration:underline dotted color-mix(in srgb, currentColor 45%, transparent);text-underline-offset:3px;cursor:help}
.glosa{position:fixed;z-index:130;background:#1f2328;color:#eef1f4;border-radius:8px;padding:10px 12px;box-shadow:0 10px 28px rgba(0,0,0,.3);font-size:12.5px;line-height:1.45;pointer-events:none;box-sizing:border-box}
.glosa b{display:block;color:#f3d27a;margin-bottom:3px;font-size:13px}
.glosa p{margin:0}
.glosa .f{margin-top:7px;padding-top:6px;border-top:1px solid rgba(255,255,255,.14);font-variant-numeric:tabular-nums}
.glosa .f span{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:#9aa5b1;margin-bottom:1px}
.glosa.hidden{display:none}

/* Filas desplegables en tablas (Carteras: compras agrupadas por valor) */
tr.hijo.oculto{display:none}
tr.hijo td{background:var(--row-alt,#f7f9fb);font-size:.95em}
tr.hijo td:first-child{padding-left:22px}
.btn.despl{padding:0 6px;min-width:22px;line-height:18px}

tr.clic{cursor:pointer}
tr.clic:hover td{background:var(--row-hover,#eef3f8)}

/* Menú: marca «nuevo» en Novedades mientras haya novedades sin ver */
#sidebar .nvmarca{margin-left:auto;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;background:#1a9a3c;color:#fff;border-radius:5px;padding:1px 6px}

/* Ficha › Evolución: columnas de media de 5 y 10 años */
table.data th.media,table.data td.media{background:var(--accent-soft)}
