/* ============================================================================
   Estadísticas de robo de vehículos (partials/estadisticas.php) — 2026-10-02.
   Se carga sólo en las páginas que las muestran (rp_est_usa() en index.php).
   Colores de los datos: paleta validada (sb dataviz, validate_palette.js sobre #fff):
   s1 azul = autos y camionetas · s2 naranja = motos · s3 aqua = camionetas (sólo en la mezcla
   por tipo). El mapa usa la rampa secuencial azul de 5 pasos. Los textos van siempre en la tinta
   del sitio, nunca del color de la serie.
   ============================================================================ */
.rp-est, .rp-est-tip, .page-robados, .page-autos, .page-camionetas, .page-motos, .page-estado {
  --s1:#2a78d6; --s2:#eb6834; --s3:#1baf7a; --gris:#c9d2de; --grid:#e3e8ef;
  --bien:#006300; --mal:#c0392b;
}
.wrap.page-robados, .wrap.page-autos, .wrap.page-camionetas { max-width:760px; }
@media (min-width:768px){
  .page-robados .destacada, .page-autos .destacada, .page-camionetas .destacada{ align-items:flex-start; text-align:left; }
  .page-robados .destacada .eyebrow, .page-robados .destacada .btn,
  .page-autos .destacada .eyebrow, .page-autos .destacada .btn,
  .page-camionetas .destacada .eyebrow, .page-camionetas .destacada .btn{ align-self:flex-start; }
  .page-robados .destacada .h1, .page-autos .destacada .h1, .page-camionetas .destacada .h1,
  .page-robados .destacada .sub, .page-autos .destacada .sub, .page-camionetas .destacada .sub{ max-width:none; }
}
.rp-est-actualizado{ display:inline-flex; align-items:center; gap:6px; align-self:flex-start; font-size:12.5px; font-weight:600; color:var(--muted); margin-top:10px; }
.rp-est-actualizado .ic{ color:var(--accent); }

/* ---- navegación entre las páginas de estadísticas (arriba, a la vista) ---- */
.rp-est-tipos{ display:grid; grid-template-columns:1fr 1fr; gap:8px; padding-top:14px; }
.rp-est-tipos a{ display:flex; align-items:center; gap:10px; padding:12px 13px; border-radius:14px; background:#fff; border:1px solid var(--line); box-shadow:var(--shadow); text-decoration:none; color:var(--ink); min-width:0; }
.rp-est-tipos a .ic{ color:var(--accent); flex:0 0 auto; }
.rp-est-tipos a span{ min-width:0; }
.rp-est-tipos a b{ display:block; font-size:15px; line-height:1.2; }
.rp-est-tipos a small{ display:block; font-size:12px; line-height:1.3; color:var(--muted); margin-top:2px; }
.rp-est-tipos a:hover{ border-color:#cfe9dd; background:var(--accent-soft); }
.rp-est-tipos a.on{ background:var(--accent); border-color:var(--accent); color:#fff; }
.rp-est-tipos a.on .ic{ color:#fff; } .rp-est-tipos a.on small{ color:#e6f5ef; }
@media (min-width:768px){ .rp-est-tipos{ grid-template-columns:repeat(4,1fr); padding-top:18px; } }

/* ---- top 5 de marcas y de modelos ---- */
.rp-est-top5{ display:grid; gap:14px; }
.rp-est-top5-c{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); padding:18px; min-width:0; }
.rp-est-top5-c h3{ font-size:17px; font-weight:700; letter-spacing:-.2px; line-height:1.25; margin:0; color:var(--ink); }
.rp-est-top5-s{ font-size:12.5px; color:var(--muted); line-height:1.45; margin:4px 0 14px; }
.rp-est-top5-c ol{ list-style:none; margin:0; padding:0; display:grid; gap:12px; }
.rp-est-top5-c li{ display:grid; grid-template-columns:28px 40px minmax(0,1fr) auto; grid-template-rows:auto 6px; align-items:center; column-gap:10px; row-gap:5px; margin:0; }
.rp-est-top5-c .pos{ grid-row:1 / span 2; width:28px; height:28px; border-radius:50%; background:var(--page); border:1px solid var(--line); display:grid; place-items:center; font-weight:800; font-size:14px; color:var(--ink); }
.rp-est-top5-c li:first-child .pos{ background:var(--ink); border-color:var(--ink); color:#fff; }
.rp-est-top5-c .logo{ grid-row:1 / span 2; width:40px; height:40px; border-radius:10px; background:#fff; border:1px solid var(--line); display:grid; place-items:center; overflow:hidden; }
.rp-est-top5-c .logo img{ width:28px; height:28px; object-fit:contain; display:block; }
.rp-est-top5-c .logo.sin{ font-weight:800; font-size:16px; color:var(--muted); }
.rp-est-top5-c .nom{ font-size:14px; line-height:1.25; color:var(--ink); overflow-wrap:anywhere; }
.rp-est-top5-c .val{ font-weight:800; font-size:14.5px; color:var(--ink); font-variant-numeric:tabular-nums; white-space:nowrap; }
.rp-est-top5-c .bar{ grid-column:3 / span 2; height:6px; background:var(--page); border-radius:99px; overflow:hidden; }
.rp-est-top5-c .bar i{ display:block; height:100%; background:var(--s1); border-radius:99px; }
.rp-est-top5[data-tipo="moto"] .bar i{ background:var(--s2); }
.rp-est-top5-c .rp-est-fuente{ margin-top:12px; }
@media (min-width:768px){ .rp-est-top5{ grid-template-columns:1fr 1fr; } }

/* ---- texto ---- */
.rp-est p a{ color:var(--accent); font-weight:600; }
.rp-est .rp-est-lede{ color:var(--muted); margin:0 0 4px; }
.rp-est-nota{ font-size:12.5px !important; color:var(--muted) !important; line-height:1.5 !important; margin-top:14px !important; }
.rp-est-fuente{ font-size:12px; line-height:1.45; color:var(--muted); margin-top:8px; }
.rp-est-fuente a{ color:var(--muted) !important; text-decoration:underline; font-weight:500 !important; }
.rp-est-fig-t{ font-size:14px; font-weight:700; color:var(--ink); margin:20px 0 8px; line-height:1.3; }
.rp-est-fig{ margin:6px 0 0; }

/* ---- cifras (stat tiles) ---- */
.rp-est-kpis{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:14px 0 4px; }
.rp-est-kpi{ background:var(--page); border:1px solid var(--line); border-radius:12px; padding:12px 13px; min-width:0; }
.rp-est-kpi .k{ font-size:12.5px; color:var(--muted); font-weight:600; line-height:1.3; }
.rp-est-kpi .v{ font-size:23px; font-weight:700; color:var(--ink); letter-spacing:-.4px; line-height:1.15; margin-top:5px; }
.rp-est-kpi .d{ font-size:12px; font-weight:700; margin-top:5px; line-height:1.35; }
.rp-est-kpi .d.bien{ color:var(--bien); } .rp-est-kpi .d.mal{ color:var(--mal); } .rp-est-kpi .d.igual{ color:var(--muted); }
.rp-est-kpi .n{ font-size:12px; color:var(--muted); margin-top:4px; line-height:1.35; }
@media (min-width:768px){ .rp-est-kpis{ grid-template-columns:repeat(4,1fr); } .rp-est-kpi .v{ font-size:26px; } }

/* ---- leyenda y muestras ---- */
.rp-est-leyenda{ display:flex; flex-wrap:wrap; gap:6px 16px; font-size:13px; color:var(--muted); margin:0 0 6px; }
.rp-est-leyenda span{ display:inline-flex; align-items:center; gap:6px; }
.rp-est-leyenda b{ color:var(--ink); }
.rp-est-leyenda .sw{ width:12px; height:12px; border-radius:3px; display:inline-block; }
.rp-est .s1, .rp-est-leyenda .s1{ background:var(--s1); }
.rp-est .s2, .rp-est-leyenda .s2{ background:var(--s2); }
.rp-est .s3, .rp-est-leyenda .s3{ background:var(--s3); }
.rp-est .gris, .rp-est-leyenda .gris{ background:var(--gris); }

/* ---- columnas por año (HTML: el texto queda en px en cualquier pantalla) ---- */
.rp-est-cols{ position:relative; height:220px; margin:8px 0 2px; }
.rp-est-cols-ejes{ position:absolute; left:46px; right:0; top:14px; bottom:22px; }
.rp-est-cols-ejes span{ position:absolute; left:0; right:0; height:0; border-top:1px solid var(--grid); }
.rp-est-cols-ejes span[style^="bottom:0"]{ border-top-color:#c3cbd6; }
.rp-est-cols-ejes span b{ position:absolute; right:calc(100% + 6px); top:-8px; font-size:11px; line-height:16px; font-weight:500; color:var(--muted); white-space:nowrap; font-variant-numeric:tabular-nums; }
.rp-est-cols-plot{ position:absolute; left:46px; right:0; top:14px; bottom:0; display:grid; grid-template-columns:repeat(var(--n),1fr); }
.rp-est-col{ position:relative; height:100%; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; padding-bottom:22px; box-sizing:border-box; outline:none; }
.rp-est-col .pila{ position:relative; width:min(24px,64%); display:flex; flex-direction:column; gap:2px; }
.rp-est-col .pila i{ display:block; min-height:1px; flex-basis:0; }
.rp-est-col .pila i:first-of-type{ border-radius:4px 4px 0 0; }
.rp-est-col .lbl{ position:absolute; bottom:calc(100% + 3px); left:50%; transform:translateX(-50%); font-size:11px; font-weight:700; color:var(--ink); white-space:nowrap; }
.rp-est-col .x{ position:absolute; bottom:2px; font-size:11px; color:var(--muted); font-variant-numeric:tabular-nums; }
.rp-est-col:hover .pila, .rp-est-col:focus-visible .pila{ filter:brightness(1.1); }
.rp-est-col:focus-visible{ box-shadow:inset 0 0 0 2px var(--accent); border-radius:6px; }
@media (min-width:768px){ .rp-est-cols{ height:250px; } .rp-est-col .x, .rp-est-col .lbl{ font-size:12px; } }

/* ---- barras horizontales ---- */
.rp-est-barras{ list-style:none; margin:4px 0 0; padding:0; display:grid; gap:9px; }
.rp-est-barras li{ display:grid; grid-template-columns:minmax(118px,40%) 1fr auto; align-items:center; gap:10px; font-size:13.5px; margin:0 !important; }
.rp-est-barras .lbl{ color:var(--ink); font-weight:600; line-height:1.25; min-width:0; overflow-wrap:anywhere; }
.rp-est-barras .lbl a{ color:var(--ink) !important; font-weight:600 !important; text-decoration:underline; text-decoration-color:var(--grid); text-underline-offset:3px; }
.rp-est-barras .lbl small{ display:block; font-weight:500; color:var(--muted); font-size:11.5px; margin-top:1px; }
.rp-est-barras .bar{ height:14px; min-width:0; }
.rp-est-barras .bar i{ display:block; height:100%; border-radius:0 4px 4px 0; }
.rp-est-barras .val{ font-weight:700; color:var(--ink); font-variant-numeric:tabular-nums; white-space:nowrap; font-size:13px; }

/* ---- parte de un todo ---- */
.rp-est-mezcla{ margin-top:6px; }
.rp-est-mezcla .barra{ display:flex; gap:2px; height:16px; margin:8px 0 10px; }
.rp-est-mezcla .barra i{ display:block; min-width:2px; }
.rp-est-mezcla .barra i:first-child{ border-radius:4px 0 0 4px; }
.rp-est-mezcla .barra i:last-child{ border-radius:0 4px 4px 0; }

/* ---- tablas ---- */
.rp-est-tabla-wrap{ overflow-x:auto; margin:10px 0 0; -webkit-overflow-scrolling:touch; }
.rp-est-tabla{ width:100%; border-collapse:collapse; font-size:13px; }
.rp-est-tabla th, .rp-est-tabla td{ padding:8px 7px; border-bottom:1px solid var(--line); text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; color:var(--ink); }
.rp-est-tabla th[scope="row"], .rp-est-tabla thead th:first-child{ text-align:left; white-space:normal; font-weight:600; }
.rp-est-tabla thead th{ font-size:12px; color:var(--muted); font-weight:700; vertical-align:bottom; }
.rp-est-tabla th[scope="row"] a{ color:var(--ink) !important; }
.rp-est-tabla.compacta td, .rp-est-tabla.compacta th{ padding:7px 6px; }
.rp-est-ordenable thead button{ all:unset; cursor:pointer; display:inline-flex; align-items:center; gap:3px; }
.rp-est-ordenable thead button::after{ content:"↕"; color:#b7c1cf; font-size:11px; }
.rp-est-ordenable thead th[aria-sort="descending"] button::after{ content:"↓"; color:var(--ink); }
.rp-est-ordenable thead th[aria-sort="ascending"] button::after{ content:"↑"; color:var(--ink); }
.rp-est-ordenable thead button:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; border-radius:4px; }
.rp-est-det{ margin-top:6px; }
.rp-est-det summary{ cursor:pointer; color:var(--accent); font-weight:700; font-size:13.5px; padding:4px 0; }

/* ---- mapa ---- */
.rp-est-mapa{ margin:14px 0 6px; }
.rp-est-mapa-ctl{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px; }
.rp-est-mapa-ctl button{ font:inherit; font-size:13px; font-weight:700; padding:8px 12px; border-radius:999px; border:1px solid var(--line); background:#fff; color:var(--ink); cursor:pointer; }
.rp-est-mapa-ctl button[aria-pressed="true"]{ background:var(--ink); color:#fff; border-color:var(--ink); }
.rp-est-mapa-svg{ display:block; width:100%; height:auto; touch-action:manipulation; }
.rp-est-edo{ cursor:pointer; outline:none; }
.rp-est-edo path{ fill:#cde2fb; stroke:#fff; stroke-width:1; vector-effect:non-scaling-stroke; transition:fill .2s; }
.rp-est-edo:hover path, .rp-est-edo:focus path, .rp-est-edo.on path{ stroke:#1f2d3d; stroke-width:2; }
.rp-est-mapa[data-metrica="tasa"] [data-q-tasa="1"] path, .rp-est-mapa[data-metrica="total"] [data-q-total="1"] path, .rp-est-mapa[data-metrica="moto"] [data-q-moto="1"] path{ fill:#86b6ef; }
.rp-est-mapa[data-metrica="tasa"] [data-q-tasa="2"] path, .rp-est-mapa[data-metrica="total"] [data-q-total="2"] path, .rp-est-mapa[data-metrica="moto"] [data-q-moto="2"] path{ fill:#3987e5; }
.rp-est-mapa[data-metrica="tasa"] [data-q-tasa="3"] path, .rp-est-mapa[data-metrica="total"] [data-q-total="3"] path, .rp-est-mapa[data-metrica="moto"] [data-q-moto="3"] path{ fill:#256abf; }
.rp-est-mapa[data-metrica="tasa"] [data-q-tasa="4"] path, .rp-est-mapa[data-metrica="total"] [data-q-total="4"] path, .rp-est-mapa[data-metrica="moto"] [data-q-moto="4"] path{ fill:#104281; }
.rp-est-recuadro .marco{ fill:#f5f7fa; stroke:#c3cbd6; stroke-width:1; vector-effect:non-scaling-stroke; }
.rp-est-recuadro .rotulo{ font-size:22px; font-weight:600; fill:#6b7a90; font-family:var(--font); }
.rp-est-mapa-ley{ display:none; flex-wrap:wrap; gap:4px 12px; font-size:12px; color:var(--muted); margin-top:8px; }
.rp-est-mapa[data-metrica="tasa"] [data-ley="tasa"], .rp-est-mapa[data-metrica="total"] [data-ley="total"], .rp-est-mapa[data-metrica="moto"] [data-ley="moto"]{ display:flex; }
.rp-est-mapa-ley .t{ width:100%; font-weight:700; color:var(--ink); }
.rp-est-mapa-ley i{ width:14px; height:10px; display:inline-block; border-radius:2px; margin-right:5px; vertical-align:-1px; }
.rp-est-mapa-panel{ margin-top:12px; background:var(--page); border:1px solid var(--line); border-radius:12px; padding:12px 14px; min-height:68px; font-size:13.5px; color:var(--ink); }
.rp-est-mapa-panel .vacio{ margin:0; color:var(--muted); font-size:13.5px; }
.rp-est-mapa-panel .nom{ font-size:16px; font-weight:700; }
.rp-est-mapa-panel .rank{ color:var(--muted); font-size:12.5px; font-weight:600; margin-left:6px; }
.rp-est-mapa-panel dl{ display:grid; grid-template-columns:1fr 1fr; gap:6px 14px; margin:8px 0 0; }
.rp-est-mapa-panel dl > div{ min-width:0; }
.rp-est-mapa-panel dt{ font-size:12px; color:var(--muted); font-weight:600; }
.rp-est-mapa-panel dd{ margin:0; font-weight:700; font-variant-numeric:tabular-nums; }
.rp-est-mapa-panel .ir{ display:inline-flex; margin-top:10px; font-weight:700; color:var(--accent); text-decoration:none; }
@media (min-width:768px){ .rp-est-mapa-panel dl{ grid-template-columns:repeat(4,1fr); } }

/* ---- página de estado: texto + mini-mapa ---- */
.rp-est-estado-top{ display:grid; gap:14px; }
@media (min-width:768px){ .rp-est-estado-top{ grid-template-columns:1fr 210px; align-items:start; } }
.rp-est-mini{ display:block; text-decoration:none; color:var(--accent); font-size:13px; font-weight:700; text-align:center; }
.rp-est-mini > svg{ display:block; width:100%; max-width:240px; margin:0 auto 6px; }
.rp-est-mini > svg path{ fill:#e3e8ef; stroke:#fff; stroke-width:1; vector-effect:non-scaling-stroke; }
.rp-est-mini > svg path.sel{ fill:var(--s1); }
.rp-est-mini span{ display:inline-flex; align-items:center; gap:4px; white-space:nowrap; }

/* ---- links a los estados ---- */
.rp-est-estados{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:8px; }
.rp-est-estados a{ display:flex; flex-direction:column; gap:2px; padding:10px 12px; border-radius:10px; background:var(--page); border:1px solid var(--line); text-decoration:none; color:var(--ink); }
.rp-est-estados a:hover{ border-color:#cfe9dd; background:var(--accent-soft); }
.rp-est-estados a b{ font-size:13.5px; line-height:1.25; }
.rp-est-estados a span{ font-size:12px; color:var(--muted); }
@media (min-width:768px){ .rp-est-estados{ grid-template-columns:repeat(3,1fr); } }

/* ---- tooltip (assets/js/estadisticas.js) ---- */
.rp-est-tip{ position:fixed; z-index:90; pointer-events:none; background:#1f2d3d; color:#fff; border-radius:8px; padding:8px 11px; font:12.5px/1.45 var(--font); box-shadow:0 8px 24px rgba(31,45,61,.22); max-width:240px; }
.rp-est-tip[hidden]{ display:none !important; }
.rp-est-tip .t{ font-weight:700; margin-bottom:3px; }
.rp-est-tip .f{ display:flex; justify-content:space-between; gap:14px; }
.rp-est-tip .f span{ color:#c9d2de; }
.rp-est-tip .f b{ font-variant-numeric:tabular-nums; }

@media print{ .rp-est-mapa-ctl, .rp-est-mapa-panel{ display:none; } }
@media (forced-colors:active){ .rp-est-col .pila i, .rp-est-barras .bar i, .rp-est-mezcla .barra i{ forced-color-adjust:none; border:1px solid CanvasText; } }
