/* ═══════════════════════ RESET & BASE ═══════════════════════ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --navy: #0d1b2a;
  --navy-mid: #1a2d42;
  --navy-light: #243d57;
  --blue: #1e5799;
  --blue-light: #2d7dd2;
  --gold: #c8a84b;
  --gold-light: #e0c068;
  --text: #e8edf2;
  --text-muted: #8ca0b5;
  --bg: #0a1520;
  --bg-card: #14243a;
  --bg-card2: #1a2d42;
  --border: #2a4060;
  --border-light: #3a5070;
  --danger: #c0392b;
  --danger-light: #e74c3c;
  --warning: #d4870a;
  --warning-light: #f39c12;
  --success: #1a7a45;
  --success-light: #27ae60;
  --radius: 6px;
  --shadow: 0 2px 12px rgba(0,0,0,.4);
}

body { font-family: 'Segoe UI', system-ui, sans-serif; background: var(--bg); color: var(--text); font-size: 14px; line-height: 1.5; }

.hidden { display: none !important; }
.text-muted { color: var(--text-muted); }
.small { font-size: 12px; }

/* ═══════════════════════ LOGIN ═══════════════════════ */
#login-screen {
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
  background: radial-gradient(ellipse at center, #0d2040 0%, #05080f 100%);
}

.login-box {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 12px; padding: 48px 40px; width: 380px;
  box-shadow: 0 8px 40px rgba(0,0,0,.7); text-align: center;
}

.login-logo { margin-bottom: 20px; }
.login-box h1 { font-size: 24px; font-weight: 700; color: var(--gold); letter-spacing: 2px; margin-bottom: 6px; }
.login-subtitle { font-size: 13px; color: var(--text-muted); margin-bottom: 28px; line-height: 1.6; }
.login-subtitle span { color: var(--text-muted); font-size: 11px; }

.form-group { text-align: left; margin-bottom: 16px; }
.form-group label { display: block; font-size: 12px; color: var(--text-muted); margin-bottom: 6px; text-transform: uppercase; letter-spacing: .5px; }
.form-group input, .form-group select, .form-group textarea {
  width: 100%; padding: 10px 14px; background: var(--navy-mid);
  border: 1px solid var(--border); border-radius: var(--radius);
  color: var(--text); font-size: 14px; transition: border-color .2s;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus {
  outline: none; border-color: var(--blue-light);
}

.login-error { color: var(--danger-light); font-size: 13px; min-height: 20px; margin-bottom: 12px; }
.btn-login { width: 100%; padding: 12px; font-size: 15px; font-weight: 600; letter-spacing: .5px; }
.login-warning { margin-top: 20px; font-size: 11px; color: #5a7090; line-height: 1.6; }
.password-modal-body { padding: 20px 24px 4px; }
.sidebar-footer { display: grid; gap: 8px; }

/* ═══════════════════════ BUTTONS ═══════════════════════ */
.btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 16px; border: none; border-radius: var(--radius);
  font-size: 13px; font-weight: 500; cursor: pointer; transition: all .15s;
  background: var(--navy-light); color: var(--text);
}
.btn:hover { filter: brightness(1.15); }
.btn:active { filter: brightness(.9); }
.btn-primary { background: var(--blue); color: #fff; }
.btn-danger { background: var(--danger); color: #fff; }
.btn-warning { background: var(--warning); color: #fff; }
.btn-success { background: var(--success); color: #fff; }
.btn-sm { padding: 5px 12px; font-size: 12px; }
.btn-logout { background: transparent; border: 1px solid var(--border); color: var(--text-muted); width: 100%; padding: 8px; border-radius: var(--radius); cursor: pointer; font-size: 12px; }
.btn-logout:hover { background: var(--danger); color: #fff; border-color: var(--danger); }

/* ═══════════════════════ LAYOUT ═══════════════════════ */
#app { display: flex; min-height: 100vh; }

/* SIDEBAR */
#sidebar {
  width: 220px; min-height: 100vh; background: var(--navy);
  border-right: 1px solid var(--border); display: flex; flex-direction: column;
  flex-shrink: 0; position: sticky; top: 0; height: 100vh; overflow-y: auto;
}

.sidebar-header { padding: 20px 16px 16px; border-bottom: 1px solid var(--border); }
.sidebar-logo { font-size: 16px; font-weight: 700; color: var(--gold); letter-spacing: 1px; margin-bottom: 8px; }
.sidebar-user { display: flex; flex-direction: column; gap: 4px; }
#nav-user-name { font-size: 13px; color: var(--text); font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.nav-list { list-style: none; padding: 10px 0; flex: 1; }
.nav-list li { margin: 2px 8px; }
.nav-link {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 12px; border-radius: var(--radius);
  color: var(--text-muted); text-decoration: none; font-size: 13px;
  transition: all .15s;
}
.nav-link:hover { background: var(--navy-mid); color: var(--text); }
.nav-link.active { background: var(--blue); color: #fff; }
.nav-icon { font-size: 15px; width: 18px; text-align: center; }

.sidebar-footer { padding: 16px; border-top: 1px solid var(--border); }

/* MAIN */
#main-content { flex: 1; min-width: 0; overflow-x: auto; }

/* PAGE */
.page { padding: 24px 28px; }
.page.hidden { display: none; }
.page.active { display: block; }

.page-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 24px; padding-bottom: 16px; border-bottom: 1px solid var(--border);
}
.page-header h2 { font-size: 20px; font-weight: 600; color: var(--text); }
.page-header-actions { display: flex; align-items: center; gap: 10px; }
.year-strip-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.year-strip-title {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .7px;
  text-transform: uppercase;
  color: var(--gold-light);
}
.year-strip-hint {
  display: block;
  margin-top: 2px;
  color: var(--text-muted);
  font-size: 12px;
}
.year-strip {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 2px 2px 12px;
  margin-bottom: 14px;
  scrollbar-width: thin;
  scroll-snap-type: x proximity;
}
.year-strip-inline { margin-bottom: 0; padding-bottom: 0; min-width: 180px; flex: 1 1 100%; }
.year-chip {
  border: 1px solid var(--border); background: var(--bg-card); color: var(--text-muted);
  border-radius: 999px; padding: 6px 12px; font-size: 12px; cursor: pointer;
  white-space: nowrap; transition: all .15s; scroll-snap-align: start;
}
.year-chip:hover { border-color: var(--blue-light); color: var(--text); }
.year-chip.active { background: var(--blue); color: #fff; border-color: var(--blue); }
.year-strip::-webkit-scrollbar { height: 10px; }
.year-strip::-webkit-scrollbar-track { background: var(--navy-mid); border-radius: 999px; }
.year-strip::-webkit-scrollbar-thumb { background: var(--border-light); border-radius: 999px; }
.year-strip::-webkit-scrollbar-thumb:hover { background: var(--blue-light); }

/* ═══════════════════════ ALERT BANNER ═══════════════════════ */
.alert-banner {
  padding: 12px 28px; background: var(--danger); color: #fff;
  font-weight: 500; font-size: 13px; border-bottom: 2px solid var(--danger-light);
}

/* ═══════════════════════ STATS GRID ═══════════════════════ */
.stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px,1fr)); gap: 14px; margin-bottom: 20px; }

.stat-card {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 18px 20px;
  transition: border-color .2s;
}
.stat-card:hover { border-color: var(--blue-light); }
.stat-card .stat-label { font-size: 11px; color: var(--text-muted); text-transform: uppercase; letter-spacing: .5px; margin-bottom: 6px; }
.stat-card .stat-value { font-size: 28px; font-weight: 700; color: var(--text); line-height: 1; }
.stat-card .stat-sub { font-size: 11px; color: var(--text-muted); margin-top: 4px; }
.stat-card.danger { border-left: 3px solid var(--danger); }
.stat-card.warning { border-left: 3px solid var(--warning); }
.stat-card.success { border-left: 3px solid var(--success); }
.stat-card.blue { border-left: 3px solid var(--blue-light); }

/* ═══════════════════════ TRATA BANNER ═══════════════════════ */
.trata-banner {
  background: linear-gradient(135deg, #1a0a00, #2d1500);
  border: 1px solid #8b4500; border-left: 4px solid var(--warning);
  border-radius: var(--radius); padding: 14px 20px; margin-bottom: 20px;
  display: flex; gap: 24px; flex-wrap: wrap; align-items: center;
}
.trata-banner-title { font-size: 11px; color: #a06020; text-transform: uppercase; letter-spacing: 1px; margin-right: 8px; font-weight: 600; }
.trata-item { display: flex; flex-direction: column; }
.trata-item-label { font-size: 10px; color: #a06020; text-transform: uppercase; letter-spacing: .5px; }
.trata-item-value { font-size: 22px; font-weight: 700; color: var(--warning-light); }

/* ═══════════════════════ CHARTS ═══════════════════════ */
.charts-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px,1fr)); gap: 16px; margin-bottom: 20px; }
.dashboard-analysis-charts { grid-template-columns: 1.4fr 1fr 1fr; }
.stats-analysis-charts { grid-template-columns: 1.4fr 1fr 1fr; }
.chart-card-wide { min-width: 0; }
.dashboard-analysis-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 16px; margin-bottom: 20px; }
.analysis-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.analysis-metric { background: var(--bg-card2); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px; }
.analysis-metric span { display: block; color: var(--text-muted); font-size: 11px; margin-bottom: 5px; }
.analysis-metric strong { font-size: 20px; }
.metric-up { color: var(--danger-light); }
.metric-down { color: var(--success-light); }
.quality-row { margin-bottom: 11px; }
.quality-row > div:first-child { display: flex; justify-content: space-between; color: var(--text-muted); font-size: 12px; margin-bottom: 5px; }
.quality-row strong { color: var(--text); }
.quality-track { height: 7px; border-radius: 99px; background: var(--navy); overflow: hidden; }
.quality-track span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#1e5799,#00c2d8); }
.insight-item { position: relative; padding: 8px 8px 8px 18px; border-bottom: 1px solid var(--border); color: var(--text-muted); font-size: 12px; line-height: 1.45; }
.insight-item::before { content: ''; position: absolute; left: 2px; top: 14px; width: 7px; height: 7px; border-radius: 50%; background: var(--gold); }
.insight-item:last-child { border-bottom: 0; }
.chart-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px 20px; }
.chart-card h3 { font-size: 13px; color: var(--text-muted); margin-bottom: 12px; text-transform: uppercase; letter-spacing: .5px; }

.dashboard-bottom { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px,1fr)); gap: 16px; }
.dash-panel { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px 20px; }
.dash-panel h3 { font-size: 13px; color: var(--text-muted); text-transform: uppercase; letter-spacing: .5px; margin-bottom: 12px; }

.dash-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 4px; border-bottom: 1px solid var(--border); font-size: 13px;
  cursor: pointer; transition: background .1s; border-radius: var(--radius);
}
.dash-row:hover { background: var(--navy-mid); padding-left: 8px; }
.dash-row:last-child { border-bottom: none; }

/* ═══════════════════════ FILTERS BAR ═══════════════════════ */
.filters-bar {
  display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px;
  padding: 12px 16px; background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius);
}
.search-input { flex: 1; min-width: 220px; padding: 7px 12px; background: var(--navy-mid); border: 1px solid var(--border); border-radius: var(--radius); color: var(--text); font-size: 13px; }
.search-input:focus { outline: none; border-color: var(--blue-light); }
.search-input-sm { width: 140px; padding: 7px 12px; background: var(--navy-mid); border: 1px solid var(--border); border-radius: var(--radius); color: var(--text); font-size: 13px; }
.filters-bar select { padding: 7px 10px; background: var(--navy-mid); border: 1px solid var(--border); border-radius: var(--radius); color: var(--text); font-size: 13px; cursor: pointer; }
.filters-bar input[type="date"], .filters-bar input[type="number"] {
  padding: 7px 10px; background: var(--navy-mid); border: 1px solid var(--border);
  border-radius: var(--radius); color: var(--text); font-size: 13px;
}
/* Barra de filtros: flex-wrap para que los ~18 controles entren y se ajusten
   solos sin desbordar. La búsqueda crece; los selects rellenan parejo; los
   campos cortos (edad, fechas, causa) tienen ancho fijo y compacto. */
.personas-filters { align-items: center; row-gap: 8px; }
.personas-filters .search-input { flex: 1 1 240px; min-width: 200px; max-width: 340px; }
.personas-filters select { flex: 0 1 134px; min-width: 116px; width: 134px; }
.personas-filters input[type="date"] { flex: 0 0 auto; width: 142px; }
.personas-filters input[type="number"].search-input-sm { flex: 0 0 auto; width: 94px; }
.personas-filters input[type="text"].search-input-sm { flex: 0 0 auto; width: 132px; }
.personas-filters .chk-label { flex: 0 0 auto; }
.personas-filters .btn { flex: 0 0 auto; }
/* Altura uniforme para que todos los controles (incluidos los date, que de por
   sí miden distinto) queden perfectamente alineados en cada fila. */
.filters-bar .search-input,
.filters-bar .search-input-sm,
.filters-bar select,
.filters-bar input[type="date"],
.filters-bar input[type="number"],
.filters-bar input[type="text"] { height: 34px; box-sizing: border-box; }
.stats-filters { display: grid; grid-template-columns: minmax(260px, 2fr) repeat(4, minmax(130px, 1fr)); align-items: center; }
.stats-filters .search-input { width: 100%; min-width: 0; }
.stats-filters select, .stats-filters input[type="date"], .stats-filters input[type="number"] { width: 100%; min-width: 0; }
.stats-filters .year-strip-inline { grid-column: 1 / -1; }
.chart-card canvas { max-width: 100%; }
.chk-label { display: flex; align-items: center; gap: 5px; font-size: 13px; cursor: pointer; white-space: nowrap; color: var(--text-muted); }
.chk-label input[type=checkbox] { cursor: pointer; accent-color: var(--blue-light); }

/* ═══════════════════════ TABLE ═══════════════════════ */
.table-wrapper { overflow-x: auto; border-radius: var(--radius); border: 1px solid var(--border); margin-bottom: 12px; }

.data-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.data-table thead { background: var(--navy-mid); }
.data-table th { padding: 11px 14px; text-align: left; font-size: 11px; font-weight: 600; color: var(--text-muted); text-transform: uppercase; letter-spacing: .5px; white-space: nowrap; }
.data-table td { padding: 10px 14px; border-top: 1px solid var(--border); }
.data-table tbody tr { cursor: pointer; transition: background .1s; }
.data-table tbody tr:hover { background: var(--navy-mid); }
.data-table tbody tr.sensible { background: rgba(150, 50, 0, 0.10); }
.data-table tbody tr.sensible:hover { background: rgba(150, 50, 0, 0.20); }

/* ═══════════════════════ PAGINATION ═══════════════════════ */
.pagination { display: flex; align-items: center; gap: 6px; padding: 10px 0; flex-wrap: wrap; }
.page-btn {
  padding: 5px 10px; background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius); color: var(--text); cursor: pointer; font-size: 13px;
  transition: all .15s;
}
.page-btn:hover { background: var(--navy-mid); }
.page-btn.active { background: var(--blue); border-color: var(--blue); color: #fff; }
.page-info { color: var(--text-muted); font-size: 12px; margin: 0 8px; }

/* ═══════════════════════ BADGES ═══════════════════════ */
.role-badge {
  display: inline-block; padding: 2px 8px; border-radius: 10px;
  font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px;
}
.badge { display: inline-block; padding: 3px 10px; border-radius: 12px; font-size: 11px; font-weight: 600; white-space: nowrap; }

/* Risk levels */
.risk-CRITICO, .badge-CRITICO, .risk-CRÍTICO, .badge-CRÍTICO { background: rgba(192,57,43,.25); color: #e74c3c; border: 1px solid rgba(192,57,43,.4); }
.risk-ALTO, .badge-ALTO { background: rgba(212,135,10,.2); color: #f39c12; border: 1px solid rgba(212,135,10,.4); }
.risk-MEDIO, .badge-MEDIO { background: rgba(26,122,69,.2); color: #27ae60; border: 1px solid rgba(26,122,69,.4); }
.risk-BAJO, .badge-BAJO { background: rgba(45,125,210,.15); color: #3498db; border: 1px solid rgba(45,125,210,.3); }
.risk-SIN_DATOS, .badge-SIN_DATOS { background: #1b2430; color: #8ca0b5; border: 1px solid #31465c; }

/* States */
.badge-NUEVO { background: #1a2d42; color: #8ca0b5; border: 1px solid #2a4060; }
.badge-EN_ANALISIS { background: rgba(45,125,210,.15); color: #5dade2; border: 1px solid rgba(45,125,210,.3); }
.badge-PRIORIZADO { background: rgba(212,135,10,.2); color: #f0b429; border: 1px solid rgba(212,135,10,.4); }
.badge-ALERTA_ACTIVA { background: rgba(192,57,43,.3); color: #e74c3c; border: 1px solid rgba(192,57,43,.5); animation: pulse 1.5s infinite; }
.badge-POSIBLE_VICTIMA_TRATA { background: rgba(139,0,0,.3); color: #ff6b6b; border: 1px solid rgba(139,0,0,.5); }
.badge-CERRADO { background: #1a2d1a; color: #5d8a5d; border: 1px solid #2a402a; }
.badge-LOCALIZADO_SIN_RIESGO { background: rgba(26,122,69,.2); color: #27ae60; border: 1px solid rgba(26,122,69,.4); }
.badge-LOCALIZADO_CON_RIESGO { background: rgba(212,135,10,.2); color: #e67e22; border: 1px solid rgba(212,135,10,.4); }
.badge-DERIVADO_FISCALIA { background: rgba(100,0,200,.2); color: #9b59b6; border: 1px solid rgba(100,0,200,.3); }
.badge-DERIVADO_PROTECCION { background: rgba(45,125,210,.15); color: #3498db; border: 1px solid rgba(45,125,210,.3); }
.badge-COOP_INTERNACIONAL, .badge-COOP_NACIONAL { background: rgba(26,87,153,.2); color: #5dade2; border: 1px solid rgba(26,87,153,.4); }
.badge-MONITOREO, .badge-ARCHIVO_PREVENTIVO { background: #222; color: #777; border: 1px solid #333; }

/* Urgency */
.urg-INMEDIATA { color: #e74c3c; font-weight: 700; }
.urg-URGENTE { color: #f39c12; font-weight: 600; }
.urg-NORMAL { color: var(--text-muted); }

/* Role colors */
.role-super_admin { background: rgba(192,57,43,.2); color: #e74c3c; }
.role-jefatura { background: rgba(139,0,0,.2); color: #c0392b; }
.role-analista { background: rgba(26,87,153,.2); color: #5dade2; }
.role-investigador { background: rgba(45,125,210,.15); color: #3498db; }
.role-enlace { background: rgba(200,168,75,.2); color: var(--gold-light); }
.role-trata { background: rgba(212,135,10,.2); color: #f39c12; }
.role-frontera { background: rgba(26,122,69,.2); color: #27ae60; }
.role-consulta, .role-auditor, .role-consular { background: #1a2d42; color: #8ca0b5; }

/* Tags */
.sensible-tag { background: rgba(139,0,0,.2); color: #ff6b6b; border: 1px solid rgba(139,0,0,.4); font-size: 10px; padding: 2px 6px; border-radius: 10px; }
.menor-tag { background: rgba(212,135,10,.2); color: #f0b429; border: 1px solid rgba(212,135,10,.4); font-size: 10px; padding: 2px 6px; border-radius: 10px; }

@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .6; } }

/* ═══════════════════════ ALERTAS OPERATIVAS ═══════════════════════ */
.alertas-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px,1fr)); gap: 14px; }

.alerta-card {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 16px;
}
.alerta-card.INMEDIATA { border-left: 3px solid var(--danger); background: rgba(192,57,43,.07); }
.alerta-card.URGENTE { border-left: 3px solid var(--warning); }
.alerta-card.NORMAL { border-left: 3px solid var(--border); }
.alerta-card-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 8px; }
.alerta-card-tipo { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: var(--text-muted); }
.alerta-card-persona { font-weight: 600; margin-bottom: 4px; }
.alerta-card-inst { font-size: 12px; color: var(--text-muted); margin-bottom: 6px; }
.alerta-card-desc { font-size: 13px; color: var(--text); margin-bottom: 10px; }
.alerta-card-actions { display: flex; gap: 6px; }
.alerta-meta { font-size: 11px; color: var(--text-muted); margin-top: 6px; }

/* ═══════════════════════ TAREAS ═══════════════════════ */
.tareas-list { display: flex; flex-direction: column; gap: 10px; }

.tarea-item {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 14px 18px;
  display: flex; align-items: flex-start; gap: 14px;
}
.tarea-item.URGENTE { border-left: 3px solid var(--danger); }
.tarea-item.ALTA { border-left: 3px solid var(--warning); }
.tarea-item.COMPLETADA { opacity: .5; }
.tarea-check { margin-top: 2px; cursor: pointer; width: 16px; height: 16px; accent-color: var(--success-light); }
.tarea-body { flex: 1; }
.tarea-titulo { font-weight: 600; margin-bottom: 4px; }
.tarea-desc { font-size: 12px; color: var(--text-muted); margin-bottom: 6px; }
.tarea-meta { font-size: 11px; color: var(--text-muted); display: flex; gap: 12px; }
.tarea-vencida { color: var(--danger-light) !important; }

/* ═══════════════════════ MAPA ═══════════════════════ */
#mapa-container { display: grid; gap: 12px; }
.page-subtitle { margin-top: 5px; color: var(--text-muted); font-size: 12px; }
.mapa-hero {
  display: flex; justify-content: space-between; gap: 16px; align-items: center;
  padding: 16px 18px; border: 1px solid rgba(45,125,210,.25); border-radius: 12px;
  background: linear-gradient(135deg, rgba(17,31,54,.96), rgba(13,27,42,.96));
  box-shadow: var(--shadow);
}
.mapa-hero-copy { max-width: 760px; }
.mapa-hero-kicker {
  display: inline-block; margin-bottom: 8px; color: var(--gold-light);
  text-transform: uppercase; letter-spacing: .8px; font-size: 11px; font-weight: 700;
}
.mapa-hero h3 { font-size: 20px; margin-bottom: 6px; color: var(--text); }
.mapa-hero p { color: var(--text-muted); font-size: 13px; line-height: 1.55; }
.mapa-hero-actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.mapa-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.mapa-summary-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 14px 16px;
}
.mapa-summary-label {
  font-size: 11px; text-transform: uppercase; letter-spacing: .5px; color: var(--text-muted); margin-bottom: 6px;
}
.mapa-summary-value { font-size: 24px; font-weight: 700; color: var(--text); line-height: 1; }
.mapa-summary-sub { margin-top: 4px; color: var(--text-muted); font-size: 12px; }
.mapa-toolbar {
  display: flex; align-items: end; gap: 10px; flex-wrap: wrap;
  padding: 14px 16px; background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius);
}
.mapa-filter { display: grid; gap: 5px; min-width: 135px; }
.mapa-filter-wide { min-width: 210px; flex: 1; }
.mapa-filter label { color: var(--text-muted); font-size: 10px; text-transform: uppercase; letter-spacing: .5px; }
.mapa-filter select {
  width: 100%; padding: 8px 10px; background: var(--navy-mid); color: var(--text);
  border: 1px solid var(--border); border-radius: var(--radius);
}
.mapa-check { display: flex; align-items: center; gap: 6px; min-height: 34px; color: var(--text-muted); font-size: 12px; white-space: nowrap; }
.mapa-check input { accent-color: var(--blue-light); }
.mapa-layout { display: grid; grid-template-columns: minmax(0, 1.9fr) minmax(280px, .9fr); gap: 12px; align-items: start; }
.mapa-side { min-width: 0; }
.mapa-canvas { height: min(70vh, 720px); min-height: 500px; border-radius: 12px; border: 1px solid var(--border); box-shadow: var(--shadow); }
.mapa-legend {
  padding: 16px; background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 12px; display: grid; gap: 14px;
  position: sticky; top: 16px;
}
.mapa-legend-item { display: flex; align-items: center; gap: 6px; font-size: 12px; }
.mapa-dot { width: 12px; height: 12px; border-radius: 50%; }
.mapa-zone-list { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.mapa-zone-link {
  border: 1px solid var(--border); background: var(--navy-mid); color: var(--text);
  border-radius: 999px; padding: 6px 10px; font-size: 11px; cursor: pointer;
  transition: all .15s; text-align: left;
}
.mapa-zone-link:hover { border-color: var(--blue-light); color: var(--blue-light); }
.mapa-zone-link.active { background: rgba(45,125,210,.16); border-color: var(--blue-light); color: var(--blue-light); }
.mapa-zone-card {
  border: 1px solid var(--border); border-radius: 10px; background: var(--bg-card2);
  padding: 10px 12px; display: grid; gap: 6px;
}
.mapa-zone-card-top { display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.mapa-zone-card-title { font-size: 13px; font-weight: 700; color: var(--text); }
.mapa-zone-card-meta { font-size: 11px; color: var(--text-muted); display: flex; flex-wrap: wrap; gap: 8px; }
.mapa-zone-card-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.mapa-helper {
  padding: 12px 14px; border-radius: 10px; background: rgba(45,125,210,.08);
  border: 1px solid rgba(45,125,210,.2); color: var(--text-muted); font-size: 12px; line-height: 1.5;
}
.map-popup-action {
  display: block; width: 100%; margin-top: 8px; padding: 6px 8px; cursor: pointer;
  border: 0; border-radius: 4px; background: #1e5799; color: #fff; font-weight: 600;
}

/* ═══════════════════════ ADMIN ═══════════════════════ */
/* ─── ADMIN TABS ───────────────────────────────────────── */
.admin-tabs {
  display: flex; gap: 4px; margin-bottom: 20px;
  border-bottom: 2px solid var(--border); padding-bottom: 0;
}
.admin-tab-btn {
  padding: 9px 18px; background: transparent; border: none;
  color: var(--text-muted); font-size: 13px; font-weight: 500;
  cursor: pointer; border-bottom: 2px solid transparent;
  margin-bottom: -2px; transition: all .15s; border-radius: var(--radius) var(--radius) 0 0;
}
.admin-tab-btn:hover { color: var(--text); background: var(--navy-mid); }
.admin-tab-btn.active { color: var(--gold); border-bottom-color: var(--gold); background: transparent; }
.admin-tab-content { display: none; }
.admin-tab-content.active { display: block; }

/* ─── ADMIN LAYOUT ─────────────────────────────────────── */
.admin-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.admin-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); padding: 20px; }
.admin-card h3 { margin-bottom: 16px; font-size: 14px; color: var(--text-muted); text-transform: uppercase; letter-spacing: .5px; }
.admin-overview { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; margin-bottom: 20px; }
.admin-summary { margin-bottom: 20px; }
.admin-system, .admin-roles { display: grid; gap: 10px; }
.admin-system-item {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px 12px; border-radius: var(--radius); background: var(--bg-card2); border: 1px solid var(--border);
}
.admin-system-item span { color: var(--text-muted); font-size: 12px; }
.admin-system-item strong { text-align: right; font-size: 13px; }
.admin-role-row { display: grid; gap: 6px; padding: 8px 0; border-bottom: 1px solid var(--border); }
.admin-role-row:last-child { border-bottom: none; }
.admin-role-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 12px; }
.admin-role-top strong { color: var(--text); }
.admin-chip {
  display: inline-flex; align-items: center; padding: 3px 8px; border-radius: 999px;
  background: rgba(45,125,210,.15); color: var(--blue-light); font-size: 11px; border: 1px solid rgba(45,125,210,.35);
}
.admin-chip.warning { background: rgba(212,135,10,.14); color: var(--warning-light); border-color: rgba(212,135,10,.35); }
.admin-chip.danger  { background: rgba(192,57,43,.14);  color: var(--danger-light);  border-color: rgba(192,57,43,.35); }
.admin-chip.success { background: rgba(26,122,69,.14);  color: var(--success-light); border-color: rgba(26,122,69,.35); }

/* ─── ADMIN USERS ──────────────────────────────────────── */
.admin-users-toolbar {
  display: flex; gap: 10px; align-items: center; flex-wrap: wrap;
  margin-bottom: 16px; padding: 12px 16px;
  background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius);
}
.admin-user-main { min-width: 0; display: grid; gap: 4px; }
.admin-user-meta { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; font-size: 12px; }
.admin-user-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.admin-user-extra { margin-top: 6px; font-size: 11px; color: var(--text-muted); display: flex; gap: 14px; flex-wrap: wrap; }
.admin-state { font-size: 12px; font-weight: 600; }
.admin-state.active  { color: var(--success-light); }
.admin-state.inactive { color: var(--danger-light); }
.admin-state.locked  { color: #f39c12; }
.role-track { height: 7px; border-radius: 99px; background: var(--navy); overflow: hidden; }
.role-track span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #1e5799, #00c2d8); }

/* ─── ADMIN AUDIT ──────────────────────────────────────── */
.admin-audit-toolbar {
  display: flex; gap: 10px; align-items: center; flex-wrap: wrap;
  margin-bottom: 16px; padding: 12px 16px;
  background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius);
}
.audit-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.audit-table th { text-align: left; padding: 8px 12px; border-bottom: 2px solid var(--border); color: var(--text-muted); font-weight: 600; text-transform: uppercase; letter-spacing: .4px; font-size: 11px; }
.audit-table td { padding: 8px 12px; border-bottom: 1px solid var(--border); vertical-align: middle; }
.audit-table tr:last-child td { border-bottom: none; }
.audit-table tr:hover td { background: var(--navy-mid); }
.audit-action-badge {
  display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 11px; font-weight: 600;
  background: rgba(45,125,210,.15); color: var(--blue-light); border: 1px solid rgba(45,125,210,.3);
}
.audit-action-badge.login    { background: rgba(26,122,69,.15);  color: var(--success-light); border-color: rgba(26,122,69,.3); }
.audit-action-badge.error    { background: rgba(192,57,43,.15);  color: var(--danger-light);  border-color: rgba(192,57,43,.3); }
.audit-action-badge.security { background: rgba(212,135,10,.15); color: var(--warning-light); border-color: rgba(212,135,10,.3); }

/* ─── SECURITY PANEL ───────────────────────────────────── */
.security-score-banner {
  display: flex; align-items: center; gap: 24px;
  padding: 20px 24px; border-radius: var(--radius);
  margin-bottom: 20px; border: 1px solid;
}
.security-score-banner.BUENO   { background: rgba(26,122,69,.12);   border-color: rgba(26,122,69,.4);   color: var(--success-light); }
.security-score-banner.MEDIO   { background: rgba(212,135,10,.12);  border-color: rgba(212,135,10,.4);  color: var(--warning-light); }
.security-score-banner.ALTO    { background: rgba(192,57,43,.10);   border-color: rgba(192,57,43,.4);   color: var(--danger-light); }
.security-score-banner.CRITICO { background: rgba(192,57,43,.18);   border-color: #e74c3c;              color: #e74c3c; }
.security-score-num { font-size: 52px; font-weight: 800; line-height: 1; }
.security-score-label { font-size: 22px; font-weight: 700; }
.security-score-sub   { font-size: 13px; opacity: .8; margin-top: 4px; }
.admin-security-grid  { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 14px; margin-bottom: 20px; }
.security-alert-card {
  padding: 16px 18px; border-radius: var(--radius); border: 1px solid var(--border);
  background: var(--bg-card); display: flex; flex-direction: column; gap: 6px;
}
.security-alert-card.danger  { border-color: rgba(192,57,43,.5); background: rgba(192,57,43,.07); }
.security-alert-card.warning { border-color: rgba(212,135,10,.5); background: rgba(212,135,10,.07); }
.security-alert-card.ok      { border-color: rgba(26,122,69,.4);  background: rgba(26,122,69,.07); }
.security-alert-num   { font-size: 32px; font-weight: 800; line-height: 1; }
.security-alert-label { font-size: 12px; color: var(--text-muted); }
.admin-security-lower { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.security-policy-item {
  display: flex; justify-content: space-between; align-items: center;
  padding: 9px 12px; border-radius: var(--radius); background: var(--bg-card2);
  border: 1px solid var(--border); font-size: 12px; margin-bottom: 6px;
}
.security-policy-item span { color: var(--text-muted); }
.security-policy-item strong { color: var(--gold); }
.security-failure-row {
  padding: 8px 0; border-bottom: 1px solid var(--border); font-size: 12px;
  display: flex; gap: 10px; align-items: flex-start;
}
.security-failure-row:last-child { border-bottom: none; }
.security-risky-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 12px; border-bottom: 1px solid var(--border); font-size: 12px;
}
.security-risky-row:last-child { border-bottom: none; }
.security-risky-section { margin-bottom: 16px; }
.security-risky-section h4 { font-size: 11px; color: var(--text-muted); text-transform: uppercase; letter-spacing: .5px; margin-bottom: 8px; }

/* ─── INTEGRITY PANEL ──────────────────────────────────── */
.integrity-summary-bar {
  display: flex; align-items: center; gap: 20px;
  padding: 16px 20px; border-radius: var(--radius);
  background: var(--bg-card); border: 1px solid var(--border);
  margin-bottom: 20px;
}
.integrity-score-num { font-size: 44px; font-weight: 800; color: var(--blue-light); line-height: 1; }
.integrity-score-label { font-size: 14px; color: var(--text-muted); }
.admin-integrity-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; }
.integrity-field-row { display: grid; gap: 6px; padding: 10px 0; border-bottom: 1px solid var(--border); }
.integrity-field-row:last-child { border-bottom: none; }
.integrity-field-top { display: flex; justify-content: space-between; font-size: 12px; }
.integrity-bar { height: 6px; border-radius: 99px; background: var(--navy); overflow: hidden; margin-top: 2px; }
.integrity-bar span { display: block; height: 100%; border-radius: inherit; transition: width .4s; }
.integrity-bar span.good    { background: var(--success-light); }
.integrity-bar span.medium  { background: var(--warning-light); }
.integrity-bar span.low     { background: var(--danger-light); }
.integrity-activity-item {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 12px; border-radius: var(--radius); background: var(--bg-card2);
  border: 1px solid var(--border); font-size: 13px; margin-bottom: 8px;
}
.integrity-coverage-row { padding: 12px 0; border-bottom: 1px solid var(--border); }
.integrity-coverage-row:last-child { border-bottom: none; }
.integrity-coverage-top { display: flex; justify-content: space-between; font-size: 13px; margin-bottom: 6px; }

/* ─── SHARED USER ROW ──────────────────────────────────── */
.photo-chip {
  display: inline-flex; align-items: center; margin-left: 8px; padding: 2px 8px;
  border-radius: 999px; background: rgba(45,125,210,.15); color: var(--blue-light);
  font-size: 10px; font-weight: 700; letter-spacing: .4px; text-transform: uppercase;
}
.user-row { display: flex; align-items: center; justify-content: space-between; padding: 12px 0; border-bottom: 1px solid var(--border); font-size: 13px; gap: 12px; }
.user-row:last-child { border-bottom: none; }
.audit-row { padding: 8px 0; border-bottom: 1px solid var(--border); font-size: 12px; color: var(--text-muted); }
.audit-row:last-child { border-bottom: none; }

/* ═══════════════════════ MODAL SYSTEM ═══════════════════════ */
.modal-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.75);
  display: flex; align-items: flex-start; justify-content: center;
  z-index: 1000; padding: 20px; overflow-y: auto;
}

.modal-container {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 10px; width: 100%; max-height: calc(100vh - 40px);
  display: flex; flex-direction: column; box-shadow: var(--shadow);
  overflow: hidden; margin: auto;
}
.modal-xl { max-width: 1180px; }
.modal-sm { max-width: 520px; }

.modal-header {
  display: flex; align-items: flex-start; justify-content: space-between;
  padding: 20px 24px 16px; border-bottom: 1px solid var(--border);
  background: var(--navy-mid); flex-shrink: 0;
}
.modal-title-block { flex: 1; }
.modal-title-block h2 { font-size: 18px; font-weight: 600; margin-bottom: 6px; }
#caso-badges { display: flex; gap: 6px; flex-wrap: wrap; }
.modal-close { background: transparent; border: none; color: var(--text-muted); font-size: 20px; cursor: pointer; padding: 0 4px; margin-left: 12px; }
.modal-close:hover { color: var(--text); }

.modal-body { padding: 0; overflow-y: auto; flex: 1; }
.modal-footer {
  display: flex; justify-content: space-between; align-items: center;
  padding: 14px 24px; border-top: 1px solid var(--border); background: var(--navy);
  flex-shrink: 0;
}
.modal-footer-left, .modal-footer-right { display: flex; gap: 8px; }

/* ═══════════════════════ TABS ═══════════════════════ */
.modal-tabs {
  display: flex; flex-wrap: wrap; overflow: visible; background: var(--navy);
  border-bottom: 1px solid var(--border); flex-shrink: 0;
}

.tab-btn {
  flex: 1 1 auto; padding: 11px 13px; background: transparent; border: none;
  color: var(--text-muted); font-size: 12px; cursor: pointer;
  white-space: nowrap; border-bottom: 2px solid transparent;
  transition: all .15s;
}
.tab-btn:hover { color: var(--text); }
.tab-btn.active { color: var(--blue-light); border-bottom-color: var(--blue-light); background: rgba(45,125,210,.07); }

.tab-content { padding: 20px 24px; }
.tab-content.hidden { display: none; }
.tab-content.active { display: block; }

.tab-actions { display: flex; gap: 8px; margin-bottom: 16px; align-items: center; }
.edit-caso-form { display: grid; gap: 14px; padding: 18px 24px 22px; }
.edit-note { color: var(--text-muted); font-size: 12px; line-height: 1.5; }
.edit-section {
  background: var(--navy);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 16px;
}
.edit-section h4 {
  font-size: 13px;
  font-weight: 700;
  color: var(--gold-light);
  text-transform: uppercase;
  letter-spacing: .6px;
  margin-bottom: 12px;
}
.edit-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.edit-grid .form-group { margin-bottom: 0; }
.edit-grid .full { grid-column: 1 / -1; }
.edit-grid textarea { min-height: 90px; }
.edit-check label { display: flex; align-items: center; gap: 10px; text-transform: none; letter-spacing: 0; font-size: 14px; color: var(--text); margin-bottom: 0; }
.edit-check input[type="checkbox"] { accent-color: var(--blue-light); }
.persona-create-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 20px 24px; }
.persona-create-grid .form-group { margin-bottom: 0; }
.persona-create-grid .form-group textarea { min-height: 110px; }
.persona-create-grid .form-group:last-child { grid-column: 1 / -1; }

@media (max-width: 1280px) {
  .personas-filters { grid-template-columns: minmax(260px, 2fr) repeat(3, minmax(140px, 1fr)); }
  .dashboard-analysis-charts, .dashboard-analysis-grid { grid-template-columns: 1fr 1fr; }
  .stats-filters { grid-template-columns: minmax(260px, 2fr) repeat(2, minmax(140px, 1fr)); }
  .stats-analysis-charts { grid-template-columns: 1fr 1fr; }
  .mapa-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mapa-layout { grid-template-columns: 1fr; }
  .mapa-legend { position: static; }
}

@media (max-width: 860px) {
  .year-strip-header { flex-direction: column; align-items: flex-start; gap: 4px; }
  .mapa-hero { flex-direction: column; align-items: flex-start; }
  .mapa-hero-actions { justify-content: flex-start; }
  .mapa-summary { grid-template-columns: 1fr; }
}

@media (max-width: 780px) {
  .personas-filters { grid-template-columns: 1fr 1fr; }
  .personas-filters .search-input { grid-column: 1 / -1; }
  .stats-filters { grid-template-columns: 1fr 1fr; }
  .stats-filters .search-input { grid-column: 1 / -1; }
  .mapa-toolbar { align-items: stretch; }
  .mapa-filter, .mapa-filter-wide { flex: 1 1 45%; min-width: 140px; }
  .mapa-canvas { height: 56vh; min-height: 390px; }
  .modal-overlay { padding: 8px; }
  .modal-container { max-height: calc(100vh - 16px); }
  .tab-btn { flex: 1 1 30%; }
  .dashboard-analysis-charts, .dashboard-analysis-grid { grid-template-columns: 1fr; }
  .stats-analysis-charts { grid-template-columns: 1fr; }
  .edit-grid { grid-template-columns: 1fr; }
  .edit-grid .full { grid-column: auto; }
  .persona-create-grid { grid-template-columns: 1fr; padding: 16px; }
  .admin-overview, .admin-grid, .persona-hero { grid-template-columns: 1fr; }
}

/* ═══════════════════════ IDENTIFICACIÓN ═══════════════════════ */
.ident-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px,1fr)); gap: 10px; margin-bottom: 18px; }
.ident-field { background: var(--bg-card2); border: 1px solid var(--border); border-radius: var(--radius); padding: 10px 14px; }
.ident-label { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: .5px; margin-bottom: 4px; }
.ident-value { font-size: 14px; color: var(--text); font-weight: 500; word-break: break-word; }

.sinarec-block { background: rgba(26,87,153,.07); border: 1px solid rgba(26,87,153,.3); border-radius: var(--radius); padding: 14px 18px; }
.sinarec-block h4 { font-size: 12px; color: #5dade2; text-transform: uppercase; letter-spacing: .5px; margin-bottom: 10px; }
.sinarec-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px,1fr)); gap: 8px; }
.sinarec-field { font-size: 12px; }
.sinarec-field .sf-label { color: var(--text-muted); }
.persona-hero {
  display: grid; grid-template-columns: 220px 1fr; gap: 18px; align-items: stretch;
  margin-bottom: 18px; padding: 16px; border-radius: 10px; border: 1px solid rgba(45,125,210,.28);
  background: linear-gradient(135deg, rgba(20,36,58,.95), rgba(13,27,42,.95));
}
.persona-photo-card {
  background: #0e1826; border: 1px solid rgba(45,125,210,.28); border-radius: 10px;
  min-height: 240px; overflow: hidden; display: flex; align-items: center; justify-content: center;
}
.persona-photo-img {
  width: 100%; height: 100%; max-height: 260px; object-fit: cover; display: block;
}
.persona-photo-empty {
  min-height: 240px; width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 10px; text-align: center; color: var(--text-muted); padding: 16px;
}
.persona-photo-icon { font-size: 40px; line-height: 1; color: var(--blue-light); }
.persona-hero-copy { display: grid; align-content: start; gap: 8px; padding: 4px 4px 4px 0; }
.persona-hero-title { font-size: 16px; font-weight: 700; color: var(--text); }
.persona-hero-sub { font-size: 12px; color: var(--text-muted); line-height: 1.5; }
.persona-photo-meta { font-size: 12px; color: var(--gold-light); }
.persona-photo-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }

/* ═══════════════════════ RIESGO ═══════════════════════ */
.riesgo-score-block {
  display: flex; align-items: center; gap: 24px; margin-bottom: 20px;
  padding: 20px; background: var(--bg-card2); border-radius: var(--radius);
}
.riesgo-score-num { font-size: 56px; font-weight: 800; line-height: 1; }
.riesgo-level-label { font-size: 20px; font-weight: 700; margin-bottom: 4px; }
.riesgo-factors h4 { font-size: 12px; color: var(--text-muted); text-transform: uppercase; margin-bottom: 10px; }
.riesgo-factors { background: var(--bg-card2); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px 18px; }

/* ═══════════════════════ HIPOTESIS ═══════════════════════ */
.hipotesis-item {
  background: var(--bg-card2); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 12px 16px; margin-bottom: 8px;
  display: flex; align-items: flex-start; gap: 12px;
}
.hip-type-badge { padding: 3px 10px; border-radius: 10px; font-size: 11px; font-weight: 600; white-space: nowrap; flex-shrink: 0; }
.hip-POSIBLE { background: rgba(45,125,210,.15); color: #5dade2; }
.hip-PROBABLE { background: rgba(212,135,10,.2); color: #f39c12; }
.hip-CONFIRMADA { background: rgba(26,122,69,.2); color: #27ae60; }
.hip-DESCARTADA { background: #1a2d42; color: #5a7090; text-decoration: line-through; }
.hip-ia-badge { font-size: 10px; color: var(--gold); margin-left: 4px; }

/* ═══════════════════════ TIMELINE ═══════════════════════ */
.timeline-list { position: relative; padding-left: 24px; }
.timeline-list::before { content: ''; position: absolute; left: 8px; top: 8px; bottom: 8px; width: 2px; background: var(--border); }
.timeline-item { position: relative; margin-bottom: 14px; }
.timeline-dot { position: absolute; left: -20px; top: 6px; width: 10px; height: 10px; border-radius: 50%; background: var(--blue-light); border: 2px solid var(--bg-card); }
.timeline-dot.auto { background: var(--border-light); }
.timeline-content { background: var(--bg-card2); border: 1px solid var(--border); border-radius: var(--radius); padding: 10px 14px; }
.timeline-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 4px; }
.timeline-tipo { font-size: 11px; font-weight: 600; color: var(--blue-light); text-transform: uppercase; }
.timeline-fecha { font-size: 11px; color: var(--text-muted); }
.timeline-desc { font-size: 13px; }
.timeline-inst { font-size: 11px; color: var(--text-muted); margin-top: 4px; }

/* ═══════════════════════ TERCEROS ═══════════════════════ */
.tercero-item { background: var(--bg-card2); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px 16px; margin-bottom: 8px; display: flex; align-items: flex-start; gap: 12px; }
.tercero-sospechoso { border-color: rgba(192,57,43,.5); background: rgba(192,57,43,.07); }
.terc-rol-badge { padding: 3px 10px; border-radius: 10px; font-size: 11px; font-weight: 600; background: var(--navy-mid); color: var(--text); white-space: nowrap; flex-shrink: 0; }
.terc-sospechoso-tag { font-size: 10px; color: var(--danger-light); background: rgba(192,57,43,.2); border-radius: 8px; padding: 2px 6px; }

/* ═══════════════════════ EVIDENCIAS ═══════════════════════ */
.evidencia-item { background: var(--bg-card2); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px 16px; margin-bottom: 8px; display: flex; align-items: flex-start; gap: 12px; }
.evid-tipo-badge { padding: 3px 10px; border-radius: 10px; font-size: 11px; font-weight: 600; background: rgba(26,87,153,.2); color: #5dade2; white-space: nowrap; flex-shrink: 0; }
.evid-hash { font-family: monospace; font-size: 10px; color: var(--text-muted); margin-top: 4px; word-break: break-all; }
.evid-clasif-RESERVADO { color: var(--danger-light); font-size: 11px; }
.evid-clasif-CONFIDENCIAL { color: var(--warning-light); font-size: 11px; }
.evid-clasif-PARA_FISCALIA { color: #9b59b6; font-size: 11px; }
.evid-clasif-USO_INTERNO { color: var(--text-muted); font-size: 11px; }

/* ═══════════════════════ PROTECCION ═══════════════════════ */
.proteccion-item { background: rgba(26,87,153,.07); border: 1px solid rgba(26,87,153,.3); border-radius: var(--radius); padding: 12px 16px; margin-bottom: 8px; }
.prot-tipo-badge { padding: 3px 10px; border-radius: 10px; font-size: 11px; font-weight: 600; background: rgba(45,125,210,.2); color: #5dade2; display: inline-block; margin-bottom: 6px; }

/* ═══════════════════════ IA PANEL ═══════════════════════ */
.ia-panel { }
.ia-header { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.ia-header h3 { font-size: 16px; font-weight: 600; }
.ia-badge { padding: 3px 10px; border-radius: 10px; font-size: 11px; font-weight: 600; }
.ia-badge.disponible { background: rgba(26,122,69,.2); color: #27ae60; border: 1px solid rgba(26,122,69,.4); }
.ia-badge.no-disponible { background: #1a2d42; color: var(--text-muted); border: 1px solid var(--border); }
.ia-desc { font-size: 12px; color: var(--text-muted); margin-bottom: 16px; padding: 10px; background: var(--bg-card2); border-radius: var(--radius); border-left: 3px solid var(--warning); }
.ia-actions { display: flex; gap: 8px; margin-bottom: 16px; }
.ia-loading { text-align: center; padding: 20px; color: var(--gold); font-size: 14px; }
.ia-result { background: var(--bg-card2); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px; }
.ia-section { margin-bottom: 14px; }
.ia-section h4 { font-size: 11px; color: var(--text-muted); text-transform: uppercase; letter-spacing: .5px; margin-bottom: 6px; }
.ia-section p { font-size: 13px; }
.ia-tag { display: inline-block; padding: 2px 8px; background: var(--navy-mid); border-radius: 10px; font-size: 11px; margin: 2px; }
.ia-nivel-ALTA { color: var(--danger-light); font-weight: 700; font-size: 18px; }
.ia-nivel-MEDIA { color: var(--warning-light); font-weight: 700; font-size: 18px; }
.ia-nivel-BAJA { color: var(--success-light); font-weight: 700; font-size: 18px; }
.ia-sol-text { background: var(--navy); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px; font-size: 13px; line-height: 1.7; margin-top: 10px; white-space: pre-wrap; }

/* ═══════════════════════ INLINE FORMS ═══════════════════════ */
.inline-form {
  background: var(--bg-card2); border: 1px solid var(--blue-light);
  border-radius: var(--radius); padding: 16px; margin-top: 12px;
  display: flex; flex-direction: column; gap: 10px;
}
.inline-form h4 { font-size: 14px; font-weight: 600; }
.inline-form input, .inline-form select, .inline-form textarea {
  width: 100%; padding: 8px 12px; background: var(--navy-mid);
  border: 1px solid var(--border); border-radius: var(--radius);
  color: var(--text); font-size: 13px;
}
.inline-form input:focus, .inline-form select:focus, .inline-form textarea:focus { outline: none; border-color: var(--blue-light); }
.form-actions { display: flex; gap: 8px; }

/* ═══════════════════════ NOTAS ═══════════════════════ */
.nota-item { background: var(--bg-card2); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px 16px; margin-bottom: 8px; }
.nota-header { display: flex; justify-content: space-between; font-size: 11px; color: var(--text-muted); margin-bottom: 6px; }
.nota-body { font-size: 13px; white-space: pre-wrap; }

/* ═══════════════════════ AUTOCOMPLETE ═══════════════════════ */
.autocomplete-results {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius); max-height: 200px; overflow-y: auto;
  width: 100%; margin-top: 2px;
}
.autocomplete-item { padding: 8px 12px; cursor: pointer; font-size: 13px; border-bottom: 1px solid var(--border); }
.autocomplete-item:last-child { border-bottom: none; }
.autocomplete-item:hover { background: var(--navy-mid); }
.autocomplete-item strong { color: var(--blue-light); }

/* ═══════════════════════ COOP DETAIL ═══════════════════════ */
.coop-detail { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.coop-field-label { font-size: 10px; color: var(--text-muted); text-transform: uppercase; margin-bottom: 3px; }
.coop-field-value { font-size: 13px; }
.coop-respuesta { grid-column: 1/-1; background: var(--bg-card2); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px; margin-top: 8px; }
#coop-detail-body { padding: 20px; }

/* ═══════════════════════ EMPTY STATES ═══════════════════════ */
.empty-state { text-align: center; padding: 40px; color: var(--text-muted); }
.empty-state p { font-size: 14px; }

/* ═══════════════════════ MISC ═══════════════════════ */
.separator { height: 1px; background: var(--border); margin: 12px 0; }

/* Leaflet dark override */
.leaflet-container { background: #0a1520 !important; }
.leaflet-popup-content-wrapper { background: var(--bg-card); border: 1px solid var(--border); color: var(--text); }
.leaflet-popup-tip { background: var(--bg-card); }
