:root {
  --cris-blue:    #1f497d;
  --cris-blue-lt: #e8f0fb;
  /* Fondo de la barra lateral. Normalmente es el propio primario; con un color
     de marca claro, core/branding.py lo oscurece hasta que el blanco puro
     contrasta 8:1, que es el presupuesto del que come la escala de abajo. */
  --cris-sidebar: #1f497d;
  --cris-green:   #198754;
  --cris-yellow:  #ffc107;
  --cris-red:     #dc3545;
  --sidebar-w:    230px;
}

/* ── Base ──────────────────────────────────────────────── */
body { background: #f0f2f5; font-family: "Segoe UI", Calibri, sans-serif; }

/* ── Sidebar ───────────────────────────────────────────── */
.sidebar {
  width: var(--sidebar-w); min-height: 100vh;
  background: var(--cris-sidebar); color: #fff;
  position: fixed; top: 0; left: 0; z-index: 100;
  display: flex; flex-direction: column;
}
.sidebar .brand { font-size:1.1rem; font-weight:700; padding:1.1rem 1.2rem .7rem; border-bottom:1px solid rgba(255,255,255,.15); }
.sidebar .brand small { display:block; font-size:.68rem; font-weight:400; opacity:.8; margin-top:.1rem; }
/* Las opacidades de aquí abajo NO son decorativas: son la escala de contraste.
   Medidas sobre un fondo que da 8:1 al blanco — enlace .88 = 6,4:1, epígrafe .72
   = 4,6:1, versión .75 = 4,8:1 — todas por encima del 4,5:1 de WCAG AA. Antes
   eran .78/.38/.30, calibradas a ojo sobre el azul OREX, y sobre el rojo de
   INTEC daban 3,25:1, 1,9:1 y 1,5:1. Si se tocan, rehacer las cuentas. */
.sidebar .nav-link { color:rgba(255,255,255,.88); padding:.4rem 1.2rem; font-size:.88rem; border-radius:0; }
.sidebar .nav-link i { opacity:.9; }
.sidebar .nav-link:hover, .sidebar .nav-link.active { color:#fff; background:rgba(255,255,255,.18); }
.sidebar .nav-section { font-size:.62rem; text-transform:uppercase; letter-spacing:.08em; color:rgba(255,255,255,.75); padding:.9rem 1.2rem .2rem; }
.sidebar .version { font-size:.6rem; opacity:.75; color:#fff; padding:.8rem 1.2rem; }
/* Tres niveles de texto para la barra, y ninguno mas. Existen porque la
   plantilla tenía nueve rgba(255,255,255,…) sueltos en estilos en línea
   —.4, .5, .6, .7— que nadie podía recalcular al cambiar el fondo: sobre el
   rojo de INTEC daban entre 2,1:1 y 4,4:1. Sobre un fondo de 8:1 estos dan
   8,0 / 6,4 / 4,8. txt-3 es el suelo: por debajo se suspende AA. */
.sidebar .txt-1 { color:#fff; }
.sidebar .txt-2 { color:rgba(255,255,255,.88); }
.sidebar .txt-3 { color:rgba(255,255,255,.75); }

/* Buscador de la barra. Dos fallos que solo salen midiendo:
   · el marcador de posición heredaba el gris casi negro de Bootstrap
     (rgba(33,37,41,.75)) sobre un fondo oscuro — 1,98:1, invisible;
   · el borde iba a rgba(255,255,255,.2), 1,37:1 contra la barra, asi que el
     campo no se distinguía del fondo. WCAG 1.4.11 pide 3:1 para el contorno de
     un control, que es lo que dice «aquí se escribe». */
.sidebar .form-control,
.sidebar .input-group .btn { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.65); color:#fff; }
/* El .85 del marcador y el .14 del fondo van juntos: subir el fondo aclara el
   campo y hunde el marcador (con .20 se queda en 4,0:1 sobre el verde). Por eso
   el foco NO aclara el fondo: se señala con el borde y el halo. */
.sidebar .form-control::placeholder { color:rgba(255,255,255,.85); opacity:1; }
.sidebar .form-control:focus { background:rgba(255,255,255,.14); border-color:#fff; box-shadow:0 0 0 .2rem rgba(255,255,255,.35); color:#fff; }

.main-content { margin-left: var(--sidebar-w); padding: 1.4rem 1.8rem; }

/* ── Cards ─────────────────────────────────────────────── */
.card-cris { background:#fff; border-radius:10px; box-shadow:0 1px 6px rgba(0,0,0,.07); border:none; }

/* ── Page header ────────────────────────────────────────── */
.page-header { background:#fff; border-radius:10px; padding:1.2rem 1.5rem; margin-bottom:1.2rem; box-shadow:0 1px 6px rgba(0,0,0,.07); display:flex; align-items:flex-start; gap:1.1rem; }
.researcher-avatar { width:72px; height:72px; border-radius:50%; object-fit:cover; border:3px solid var(--cris-blue-lt); flex-shrink:0; }
.researcher-avatar-placeholder { width:72px; height:72px; border-radius:50%; background:var(--cris-blue-lt); display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:1.8rem; color:var(--cris-blue); font-weight:700; border:3px solid #d0dff5; }
.orcid-badge { font-size:.7rem; background:#a6ce39; color:#fff; padding:.18rem .5rem; border-radius:4px; font-weight:700; font-family:monospace; }
.social-link { display:inline-flex; align-items:center; gap:.3rem; font-size:.78rem; color:#555; text-decoration:none; padding:.2rem .5rem; border-radius:4px; background:#f4f6f9; border:1px solid #e2e6ea; }
.social-link:hover { color:var(--cris-blue); border-color:var(--cris-blue); }

/* ── KPI cards ──────────────────────────────────────────── */
.kpi-card { background:#fff; border-radius:10px; padding:1rem 1.2rem; box-shadow:0 1px 6px rgba(0,0,0,.07); border-left:4px solid var(--cris-blue); }
.kpi-card .kpi-val { font-size:1.9rem; font-weight:700; color:var(--cris-blue); line-height:1; }
.kpi-card .kpi-label { font-size:.75rem; color:#777; margin-top:.25rem; }

/* ── Section title ──────────────────────────────────────── */
.section-title { font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; color:#888; font-weight:600; margin-bottom:.8rem; }

/* ── Fingerprint ────────────────────────────────────────── */
.fingerprint-wrap { display:flex; flex-wrap:wrap; gap:.4rem; }
.fp-tag { display:inline-flex; align-items:center; gap:.35rem; background:var(--cris-blue-lt); color:var(--cris-blue); border-radius:20px; padding:.28rem .7rem; font-size:.8rem; font-weight:500; border:1px solid #c8d9f0; }
.fp-tag .fp-pct { font-size:.68rem; opacity:.6; }
.fp-tag.fp-lg { font-size:.95rem; padding:.35rem .9rem; }
.fp-tag.fp-md { font-size:.82rem; }
.fp-tag.fp-sm { font-size:.73rem; opacity:.8; }
.fp-tag.fp-translated { border-style:solid; border-color:#a8c5e8; }
.fp-tag.fp-translated::after { content:''; }

/* ── Publicaciones acordeón ─────────────────────────────── */
.pub-item { border-bottom:1px solid #eef0f3; }
.pub-item:last-child { border-bottom:none; }
.pub-header { display:flex; align-items:flex-start; gap:.8rem; padding:.85rem 1rem; cursor:pointer; transition:background .12s; }
.pub-header:hover { background:#f8f9fb; }
.pub-year { font-size:.78rem; font-weight:700; color:#999; min-width:36px; padding-top:.15rem; }
.pub-main { flex:1; min-width:0; }
.pub-title-text { font-weight:600; color:#1a1a2e; font-size:.9rem; line-height:1.35; }
.pub-venue { font-size:.78rem; color:#777; margin-top:.15rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pub-badges { display:flex; gap:.3rem; flex-wrap:wrap; margin-top:.35rem; }
.pub-expand { color:#bbb; font-size:.85rem; padding-top:.1rem; flex-shrink:0; transition:transform .2s; }
.pub-expand.open { transform:rotate(180deg); }
.pub-detail { padding:.6rem 1rem 1rem 3.2rem; background:#fafbfc; border-top:1px solid #eef0f3; display:none; }
.pub-detail.show { display:block; }
.pub-detail-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(160px,1fr)); gap:.5rem .8rem; }
.pub-detail-item .label { font-size:.7rem; text-transform:uppercase; letter-spacing:.04em; color:#999; }
.pub-detail-item .val { font-weight:600; color:#222; font-size:.84rem; }

/* ── Badges ─────────────────────────────────────────────── */
.badge-q1     { background:#198754; color:#fff; }
.badge-q2     { background:#0d6efd; color:#fff; }
.badge-q3     { background:#ffc107; color:#000; }
.badge-q4     { background:#6c757d; color:#fff; }
.badge-gold   { background:#f5a623; color:#fff; }
.badge-green  { background:#198754; color:#fff; }
.badge-hybrid { background:#0dcaf0; color:#000; }
.badge-bronze { background:#cd7f32; color:#fff; }
.badge-closed { background:#dee2e6; color:#666; }
.badge-wos    { background:#003087; color:#fff; }
.badge-scopus { background:#e9711c; color:#fff; }
.badge-oa     { background:#a6ce39; color:#fff; }
.badge-excelente  { background:#198754; color:#fff; }
.badge-buena      { background:#0d6efd; color:#fff; }
.badge-acceptable { background:#ffc107; color:#000; }
.badge-debil      { background:#dc3545; color:#fff; }

/* ── Mapa colaboraciones ────────────────────────────────── */
.country-bar-wrap { display:flex; flex-direction:column; gap:.45rem; }
.country-bar-item { display:flex; align-items:center; gap:.6rem; font-size:.82rem; }
.country-name { min-width:130px; color:#444; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.country-bar { flex:1; height:9px; background:#eef0f3; border-radius:5px; overflow:hidden; }
.country-bar .fill { height:100%; background:var(--cris-blue); border-radius:5px; transition:width .5s ease; }
.country-count { min-width:28px; text-align:right; font-weight:600; color:var(--cris-blue); font-size:.78rem; }

/* ── Datasets ───────────────────────────────────────────── */
.dataset-item { display:flex; justify-content:space-between; align-items:flex-start; padding:.6rem 0; border-bottom:1px solid #eef0f3; font-size:.84rem; }
.dataset-item:last-child { border-bottom:none; }

/* ── Score bars (sexenio) ───────────────────────────────── */
.score-bar { height:6px; border-radius:3px; background:#e9ecef; }
.score-bar .fill { height:100%; border-radius:3px; background:var(--cris-blue); }

/* ── Alert aneca ────────────────────────────────────────── */
.alert-aneca { border-left:4px solid var(--cris-yellow); background:#fffbea; padding:.55rem .9rem; border-radius:5px; font-size:.84rem; }
.alert-aneca.danger  { border-color:var(--cris-red); background:#fff5f5; }
.alert-aneca.success { border-color:var(--cris-green); background:#f0fff4; }

/* ── Gauge (sexenio) ────────────────────────────────────── */
.gauge-wrap { position:relative; display:inline-flex; align-items:center; justify-content:center; }
.gauge-wrap svg { transform:rotate(-90deg); }
.gauge-center { position:absolute; text-align:center; }
.gauge-center .val { font-size:1.6rem; font-weight:700; color:var(--cris-blue); line-height:1; }
.gauge-center .max { font-size:.72rem; color:#999; }

/* ── Tabs ───────────────────────────────────────────────── */
.nav-tabs .nav-link { color:#666; font-size:.88rem; }
.nav-tabs .nav-link.active { color:var(--cris-blue); font-weight:600; border-bottom-color:var(--cris-blue); }

/* ── Pub table (sexenio) ────────────────────────────────── */
.pub-table th { font-size:.75rem; text-transform:uppercase; letter-spacing:.04em; color:#666; background:#f8f9fa; }
.pub-table td { font-size:.86rem; vertical-align:middle; }

@media (max-width:768px) {
  .sidebar { width:100%; min-height:auto; position:relative; }
  .main-content { margin-left:0; }
}