/* ── PULIDO TRANSVERSAL — Precision Analytical ───────────────────── */
/* Tarjetas/contenedores más redondeados (rounded-xl del mockup) */
.kpi, .chart-card, .config-section, .table-wrap, .login-box, .modal, .comp-modal-box { border-radius: var(--radius-lg); }
.kpi { padding: 18px; }
.kpi .value { font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
/* Inputs "inset": fondo más oscuro que la tarjeta + glow de foco azul */
.form-group input, .table-toolbar input, .table-toolbar select,
.chat-footer textarea { background: var(--inset); }
input:not([type=range]):focus, select:focus, textarea:focus {
  box-shadow: 0 0 0 3px var(--tint-blue); border-color: var(--accent) !important;
}
/* Cabeceras de tabla fijas (label-caps) */
thead th { position: sticky; top: 0; z-index: 5; }
/* Filas de datos algo más altas (ritmo vertical del sistema) */
tbody td { padding: 11px 8px; }
/* ISIN / datos monoespaciados */
td.num, .mono, .isin { font-family: var(--mono); }
/* ISIN copiable: doble clic al portapapeles */
.isin-copy { cursor: copy; border-bottom: 1px dashed transparent; }
.isin-copy:hover { color: var(--accent); border-bottom-color: var(--accent); }
.isin-copy.copiado { color: var(--green); border-bottom-color: transparent; }
/* Botón primario con radio del sistema */
.btn-primary { border-radius: 10px; }
/* ── FLUIDEZ DE ANIMACIONES ──────────────────────────────────────
   Solo se animan 'opacity' y 'transform' (las compone la GPU, no provocan
   reflujo), con curvas de salida suave. */
@keyframes pageIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.page.active { animation: pageIn .24s cubic-bezier(.22,.61,.36,1) both; }
@keyframes modalIn { from { opacity: 0; transform: translateY(10px) scale(.985); } to { opacity: 1; transform: none; } }
#modal-overlay.open .modal, #picker-overlay.open .modal, #comp-modal.open .comp-modal-box {
  animation: modalIn .2s cubic-bezier(.22,.61,.36,1) both;
}
@keyframes fadeIn { from { opacity: 0 } to { opacity: 1 } }
#modal-overlay.open, #picker-overlay.open, #comp-modal.open { animation: fadeIn .16s ease both; }
/* Interacciones: respuesta inmediata pero suave */
.btn-primary, .btn-sm, .btn-cfg, .chip, .tag, .kpi, .chart-card {
  transition: background-color .14s ease, border-color .14s ease, color .14s ease,
              transform .14s cubic-bezier(.22,.61,.36,1), box-shadow .14s ease;
}
.btn-primary:active, .btn-sm:active, .btn-cfg:active, .chip:active { transform: scale(.97); }
tbody tr { transition: background-color .12s ease; }
/* Accesibilidad: si el sistema pide menos movimiento, se desactiva todo */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important;
    transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
/* Barra de paginación (diseño Stitch: filas por página · rango · navegación) */
.pagbar { display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  padding: 10px 14px; border-top: 1px solid var(--border); background: var(--bg2); }
.pagbar .pb-tam { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--text2); }
.pagbar select { background: var(--inset); border: 1px solid var(--border); border-radius: 6px;
  color: var(--text); padding: 5px 8px; font-size: 12px; outline: none; }
.pagbar .pb-rango { margin: 0 auto; font-size: 12px; color: var(--text2); font-variant-numeric: tabular-nums; }
.pagbar .pb-nav { display: flex; align-items: center; gap: 4px; }
.pagbar .pb-nav button {
  min-width: 30px; height: 30px; padding: 0 8px; background: none; border: 1px solid transparent;
  border-radius: 6px; color: var(--text2); cursor: pointer; font-size: 12px; font-variant-numeric: tabular-nums;
  transition: background-color .12s ease, color .12s ease, border-color .12s ease;
}
.pagbar .pb-nav button:hover:not(:disabled) { background: var(--bg3); color: var(--text); }
.pagbar .pb-nav button.on { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 600; }
.pagbar .pb-nav button:disabled { opacity: .35; cursor: default; }
.pagbar .pb-nav .pb-dots { color: var(--text2); padding: 0 2px; font-size: 12px; }
@media (max-width: 820px) { .pagbar .pb-rango { margin: 0; width: 100%; order: 3; text-align: center; } }
/* Tablas densas (10+ columnas): menos padding y tipo algo menor para que quepa
   todo en pantalla sin cortar el texto */
/* Cabeceras: sin mayusculas ni espaciado extra (una palabra como "Patrimonio"
   no se puede partir; en mayusculas y con letter-spacing no cabia y se cortaba) */
table.dense thead th { padding: 9px 5px; font-size: 11px; text-transform: none;
  letter-spacing: 0; white-space: normal; line-height: 1.15; vertical-align: bottom; }
table.dense tbody td { padding-left: 5px; padding-right: 5px; font-size: 12.2px; }
table.dense tbody td.num { font-size: 11.6px; }   /* cifras: algo mas compactas */
table.dense .score-bar { width: 38px; }
table.dense tbody td .tag { font-size: 10px; padding: 2px 6px; }
/* Columnas de texto largo: se leen enteras en 2 lineas en vez de cortarse */
table td.wrap-cell {
  white-space: normal !important; overflow: visible; text-overflow: clip;
  line-height: 1.3; word-break: break-word;
}
table td.wrap-cell > span.tag { white-space: normal; display: inline-block; }
/* Botones de acción: nunca se encogen (si no, en las celdas flex se comprimian
   y la medición del ancho de la columna se iba haciendo cada vez menor) */
table tbody td > button, table tbody td > a { flex-shrink: 0; }
/* Cabecera de página reutilizable (título + subtítulo + acciones) */
.page-head { display: flex; align-items: flex-start; gap: 16px; margin-bottom: 18px; flex-wrap: wrap; }
.page-head .ph-title { font-size: 22px; font-weight: 700; letter-spacing: -.02em; }
.page-head .ph-sub { font-size: 13px; color: var(--text2); margin-top: 3px; }
.page-head .head-actions { margin-left: auto; display: flex; gap: 8px; align-items: center; }
/* Hueco a la derecha para que las acciones de la cabecera no queden bajo el botón de tema. */
.page-head { padding-right: 52px; }
.btn-cfg { display: inline-flex; align-items: center; gap: 7px; background: var(--bg2); border: 1px solid var(--border); border-radius: 10px; color: var(--text); padding: 9px 15px; font-size: 13px; font-weight: 600; cursor: pointer; }
.btn-cfg svg { width: 16px; height: 16px; }
.btn-cfg:hover { border-color: var(--accent); }
.btn-cfg.on { background: var(--accent); border-color: var(--accent); color: #fff; }
/* Panel Recomendaciones IA */
.reco-card { background: var(--bg2); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 16px; margin-bottom: 16px; }
.reco-card .reco-head { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.reco-card .reco-head b { font-size: 14px; }
.reco-item.up { border-left-color: var(--green); }
/* Generador de informes a dos paneles (config / vista previa) */
.informe-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; }
@media (max-width: 1100px) { .informe-cols { grid-template-columns: 1fr; } }
.informe-preview { background: var(--inset); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 14px; min-height: 220px; }
/* Vista previa como "hoja": sin barra ni miniaturas del visor nativo */
.pdf-sheet {
  display: block; width: 100%; aspect-ratio: 1 / 1.414;  /* A4 */
  max-height: 76vh; border: 1px solid var(--border); border-radius: 6px; background: #fff;
  box-shadow: 0 6px 24px var(--shadow-soft);
  transition: opacity .18s ease;
}
.informe-preview.updating .pdf-sheet { opacity: .55; }
/* Cargas masivas (GAMA, importacion de clientes): solo admin */
.solo-admin { display: none; }
body.es-admin .solo-admin { display: revert; }   /* devuelve el display propio del elemento */

/* ── Ficha de cliente (rediseño): 4 bloques + plegado, pestañas, tabla única ── */
.kpi-grid.kpi4 { grid-template-columns: repeat(4, minmax(160px, 1fr)); margin-bottom: 10px; }
@media (max-width: 1100px) { .kpi-grid.kpi4 { grid-template-columns: repeat(2, 1fr); } }
.mas-metricas { margin-bottom: 16px; }
.mas-metricas summary { cursor: pointer; font-size: 12.5px; color: var(--accent-soft); font-weight: 500; padding: 4px 2px; list-style: none; }
.mas-metricas summary::before { content: '▸ '; }
.mas-metricas[open] summary::before { content: '▾ '; }
.dl-metricas { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px 18px; margin: 10px 0 0; padding: 14px 16px; background: var(--bg2); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.dl-metricas div { min-width: 0; }
.dl-metricas dt { font-size: 11px; color: var(--text2); text-transform: uppercase; letter-spacing: .05em; }
.dl-metricas dd { margin: 3px 0 0; font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; }
.dl-metricas dd small { display: block; font-size: 11px; font-weight: 400; color: var(--text2); margin-top: 2px; }
.dl-metricas dd.pos { color: var(--green); } .dl-metricas dd.neg { color: var(--red); }
.liquidez-strip { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 10px 14px; margin-top: 10px; background: var(--bg2); border: 1px solid var(--border); border-radius: var(--radius-lg); font-size: 13px; }
.liquidez-strip .ls-acciones { margin-left: auto; display: flex; gap: 6px; }
.cliente-bajo { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 16px; margin-top: 16px; align-items: start; }
@media (max-width: 1100px) { .cliente-bajo { grid-template-columns: 1fr; } }
.evo-panel { background: var(--bg2); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 14px 16px; }
.evo-panel summary { cursor: pointer; font-size: 13px; list-style: none; }
.evo-panel summary::before { content: '▸ '; color: var(--text2); }
.evo-panel[open] summary::before { content: '▾ '; }
.lbl-inline { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text2); white-space: nowrap; }
.table-toolbar .lbl-inline input[type=date] { width: auto; }
.tabla-mov td.col-lados { max-width: 320px; white-space: normal; }
.tabla-mov tr.op-anulada td { opacity: .55; }
.tabla-mov tr.op-anulada td.col-lados, .tabla-mov tr.op-anulada td:nth-child(2) { text-decoration: line-through; }
.tabla-clientes tr.fila-clic { cursor: pointer; }
.tabla-clientes td.col-acciones-cli, .tabla-clientes th.col-acciones-cli { width: 110px; white-space: nowrap; }
.tabla-clientes td.empty { text-align: center; color: var(--text2); padding: 24px; white-space: normal; }

/* ── Fondos (rediseño): una tabla, ámbito, vistas ── */
.fondos-barra { gap: 10px; }
.fondos-barra .chips { display: flex; gap: 6px; flex-wrap: wrap; }
button.chip { font: inherit; font-size: 12px; }
.chip.add { border-style: dashed; background: transparent; }
.fondos-barra input[type=search] { width: 300px; }
#fondos-tabla[aria-busy] { opacity: .6; transition: opacity .15s; }
.tabla-fondos td.col-check { text-align: center; }

/* ── Alertas (rediseño): una fila por regla ── */
.alerta-grupo { background: var(--bg2); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 12px 16px; margin-bottom: 10px; }
.alerta-grupo.vacia { opacity: .75; }
.alerta-grupo.callada { border-style: dashed; }
.alerta-grupo .ag-head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.alerta-grupo .ag-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--text2); flex-shrink: 0; }
.alerta-grupo .ag-dot.alta { background: var(--red); } .alerta-grupo .ag-dot.media { background: var(--yellow); } .alerta-grupo .ag-dot.baja { background: var(--accent); }
.alerta-grupo .ag-tit { flex: 1; min-width: 200px; }
.alerta-grupo .ag-tit b { font-size: 14px; }
.alerta-grupo .ag-cond { font-size: 12px; color: var(--text2); margin-top: 2px; }
.alerta-grupo .ag-cifras { display: flex; gap: 14px; align-items: center; font-size: 13px; flex-wrap: wrap; }
.alerta-grupo .ag-stat { font-size: 12px; color: var(--text2); margin-top: 8px; padding-left: 22px; line-height: 1.5; }
.alerta-grupo .ag-lista { margin-top: 8px; padding-left: 22px; }
.alerta-grupo .ag-lista summary { cursor: pointer; font-size: 12.5px; color: var(--accent-soft); list-style: none; }
.alerta-grupo .ag-lista summary::before { content: '▸ '; }
.alerta-grupo .ag-lista[open] summary::before { content: '▾ '; }
.alerta-grupo .ag-lista table { margin-top: 8px; }

/* ── Hoy (rediseño) ── */
.hoy-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 22px; }
@media (max-width: 1000px) { .hoy-grid { grid-template-columns: 1fr; } }
.hoy-card { background: var(--bg2); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 14px 16px; min-width: 0; }
.hoy-card.hoy-ancha { grid-column: 1 / -1; }
.hoy-card h3 { font-size: 13px; font-weight: 700; margin-bottom: 8px; display: flex; align-items: baseline; gap: 10px; }
.hoy-card h3 small { font-weight: 500; color: var(--text2); font-size: 12px; }
.hoy-row { display: flex; align-items: center; gap: 12px; padding: 8px 0; border-top: 1px solid var(--border); font-size: 13px; flex-wrap: wrap; }
.hoy-row:first-of-type { border-top: 0; }
.hoy-row > span:first-child { flex: 1; min-width: 200px; }
.hoy-row .txt2 { color: var(--text2); font-size: 12px; }
.hoy-row.hoy-mov { cursor: pointer; }
.hoy-row.hoy-mov:hover { background: var(--bg3); margin: 0 -8px; padding-left: 8px; padding-right: 8px; border-radius: 6px; }
.hoy-row .num.pos { color: var(--green); } .hoy-row .num.neg { color: var(--red); }
.hoy-cifras { display: flex; gap: 14px; align-items: center; margin-left: auto; font-size: 12.5px; }
.hoy-ok { color: var(--green); font-size: 13px; font-weight: 600; padding: 6px 0; }
.hoy-more { padding-top: 8px; font-size: 12.5px; }
.hoy-estado { font-size: 12.5px; color: var(--text2); }
.hoy-nada { background: var(--bg2); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 16px 18px; margin-bottom: 14px; font-size: 14px; }
.hoy-dash-head { display: flex; align-items: center; gap: 12px; margin: 6px 0 12px; }
.hoy-dash-head h3 { font-size: 14px; font-weight: 700; }
.hoy-dash-head .head-actions { margin-left: auto; }

/* ── Asistente IA como panel lateral ── */
.asistente-panel { position: fixed; top: 0; right: 0; bottom: 0; width: 460px; max-width: 100vw; background: var(--bg2); border-left: 1px solid var(--border); box-shadow: -12px 0 32px var(--shadow); z-index: 480; display: flex; flex-direction: column; transform: translateX(102%); transition: transform .24s cubic-bezier(.32,.72,0,1); }
.asistente-panel.open { transform: none; }
.asistente-panel .chat-container { height: 100%; flex: 1; min-height: 0; }
.asistente-panel .chat-header { border-radius: 0; border-left: 0; border-right: 0; border-top: 0; }
.asistente-panel .chat-messages { flex: 1; min-height: 0; }
.asistente-contexto { font-size: 11.5px; color: var(--text2); padding: 6px 16px; border-top: 1px solid var(--border); }
#chat-api-notice { margin: 10px 16px; }
@media (prefers-reduced-motion: reduce) { .asistente-panel { transition: none; } }

/* ── Ficha del fondo como panel lateral ── */
#modal-overlay.lateral { justify-content: flex-end; padding: 0; }
#modal-overlay.lateral .modal { width: 780px; max-width: 100%; height: 100vh; max-height: 100vh; border-radius: 0; border-top: 0; border-bottom: 0; border-right: 0; }
.ff-cab { font-size: 12.5px; color: var(--text2); margin-bottom: 12px; }
.ff-metricas { grid-template-columns: repeat(3, minmax(150px, 1fr)); margin: 14px 0 10px; }
.ff-mas summary { font-size: 12.5px; }
.modal-field.sin-dato .f-val { color: var(--text2); font-weight: 400; }

/* ── Informe (rediseño): bloques arrastrables ── */
.inf-bloques .inf-bloque { display: flex; align-items: center; gap: 8px; padding: 5px 0; border-bottom: 1px solid var(--border); background: var(--bg2); }
.inf-bloques .inf-bloque.sortable-ghost { opacity: .4; }
.inf-bloques .grip { cursor: grab; color: var(--text2); font-size: 14px; padding: 0 2px; user-select: none; }
#grupo-inf-modal .modal { max-width: 100%; }

/* ── La puntuación, explicada ────────────────────────────────────── */
.score-btn { background: none; border: 0; padding: 0; cursor: pointer; font: inherit;
  color: inherit; width: 100%; border-radius: 6px; }
.score-btn:hover { background: var(--tint-blue-soft); }
.score-desglose .desg { display: flex; height: 10px; border-radius: 5px; overflow: hidden;
  margin: 8px 0 6px; background: var(--bg3); }
.score-desglose .desg i { display: block; }
.score-desglose .leg { display: flex; gap: 10px; flex-wrap: wrap; font-size: 11px; color: var(--text2); }
.score-desglose .leg i { display: inline-block; width: 9px; height: 9px; border-radius: 2px;
  margin-right: 4px; vertical-align: -1px; }
.score-desglose .nota { margin: 8px 0 0; font-size: 11px; color: var(--text2); }
.score-pop { position: fixed; z-index: 950; width: 340px; max-width: calc(100vw - 16px);
  background: var(--bg2); border: 1px solid var(--border); border-radius: var(--radius-lg);
  box-shadow: 0 12px 32px var(--shadow); padding: 12px 14px; font-size: 12px; }
.ff-score { margin: 12px 0 4px; padding: 12px 14px; background: var(--bg2);
  border: 1px solid var(--border); border-radius: var(--radius-lg); }
.ff-score .t { font-size: 12px; font-weight: 600; }