/* ANALÍTICA (Alquileres) — page-specific styles */
:root{--c-blue:#1464a5;--c-blue-light:#e8f2fb;--c-green:#16a34a;--c-green-light:#dcfce7;--c-orange:#d97706;--c-orange-light:#fef3c7;--c-red:#dc2626;--c-red-light:#fee2e2;--c-purple:#7c3aed;--c-purple-light:#ede9fe}

/* ── Big KPI banner ── */
.kpi-banner{display:grid;grid-template-columns:repeat(4,1fr);gap:0;background:linear-gradient(135deg,#0d3b6e 0%,#1464a5 60%,#1a7fd4 100%);border-radius:16px;overflow:hidden;margin-bottom:24px;box-shadow:0 8px 32px rgba(20,100,165,.25)}
.kpi-banner-item{padding:24px 28px;border-right:1px solid rgba(255,255,255,.12);position:relative}
.kpi-banner-item:last-child{border-right:none}
.kpi-banner-label{font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-bottom:6px}
.kpi-banner-value{font-size:1.6rem;font-weight:700;color:#fff;line-height:1.1}
.kpi-banner-sub{font-size:.75rem;color:rgba(255,255,255,.55);margin-top:4px}
.kpi-banner-badge{display:inline-flex;align-items:center;gap:4px;background:rgba(255,255,255,.15);color:#fff;font-size:.72rem;font-weight:700;padding:2px 9px;border-radius:20px;margin-top:6px}
.kpi-banner-badge.green{background:rgba(22,163,74,.35);color:#86efac}
.kpi-banner-badge.orange{background:rgba(217,119,6,.35);color:#fcd34d}
.kpi-banner-badge.red{background:rgba(220,38,38,.35);color:#fca5a5}

/* ── Charts grid ── */
.charts-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:20px;margin-bottom:20px}
.charts-grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;margin-bottom:20px}
.chart-card{background:#fff;border-radius:14px;padding:22px 24px;box-shadow:0 2px 12px rgba(0,0,0,.06);border:1px solid var(--border)}
.chart-card-title{font-size:.82rem;font-weight:700;color:var(--text-dark);margin-bottom:4px}
.chart-card-sub{font-size:.73rem;color:var(--text-light);margin-bottom:18px}
.chart-wrap{position:relative}

/* ── Amortization table ── */
.amort-table{width:100%;border-collapse:collapse;font-size:.82rem}
.amort-table th{padding:9px 12px;text-align:left;font-size:.67rem;font-weight:700;letter-spacing:.07em;color:var(--text-light);text-transform:uppercase;background:var(--bg);border-bottom:2px solid var(--border);white-space:nowrap}
.amort-table td{padding:11px 12px;border-bottom:1px solid var(--border);vertical-align:middle}
.amort-table tr:last-child td{border-bottom:none}
.amort-table tr:hover td{background:#f7f9fc}

/* Progress bar */
.prog-wrap{display:flex;align-items:center;gap:10px}
.prog-bar{flex:1;height:8px;background:#e2e8f0;border-radius:4px;overflow:hidden;min-width:80px}
.prog-fill{height:100%;border-radius:4px;transition:width .6s ease}
.prog-fill.low{background:linear-gradient(90deg,#ef4444,#f87171)}
.prog-fill.mid{background:linear-gradient(90deg,#f59e0b,#fbbf24)}
.prog-fill.high{background:linear-gradient(90deg,#16a34a,#22c55e)}
.prog-fill.full{background:linear-gradient(90deg,#7c3aed,#a78bfa)}
.prog-pct{font-size:.78rem;font-weight:700;min-width:36px;text-align:right}

/* ROI badge */
.roi-badge{display:inline-flex;align-items:center;padding:2px 9px;border-radius:10px;font-size:.72rem;font-weight:700}
.roi-pos{background:#dcfce7;color:#16a34a}
.roi-neg{background:#fee2e2;color:#dc2626}
.roi-neutral{background:#f1f5f9;color:#64748b}

/* Timeline projection */
.timeline-item{display:flex;align-items:flex-start;gap:14px;padding:12px 0;border-bottom:1px solid var(--border)}
.timeline-item:last-child{border-bottom:none}
.timeline-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;margin-top:4px}
.timeline-mat{font-weight:700;font-size:.85rem}
.timeline-info{font-size:.77rem;color:var(--text-light);margin-top:2px}
.timeline-date{font-size:.77rem;font-weight:700;margin-left:auto;white-space:nowrap}

/* Section title */
.section-title{font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-light);margin:24px 0 12px;display:flex;align-items:center;gap:8px}
.section-title::after{content:'';flex:1;height:1px;background:var(--border)}

/* Sort buttons */
.sort-btns{display:flex;gap:6px}
.sort-btn{padding:4px 10px;border-radius:6px;border:1px solid var(--border);background:var(--bg);font-family:'Montserrat',sans-serif;font-size:.73rem;font-weight:700;cursor:pointer;color:var(--text-mid);transition:all .2s}
.sort-btn.active{background:var(--volvo-blue);color:#fff;border-color:var(--volvo-blue)}

/* Spinner */
.loading-overlay{display:flex;align-items:center;justify-content:center;padding:40px;color:var(--volvo-accent);font-weight:700;gap:10px}

@media(max-width:1100px){.charts-grid{grid-template-columns:1fr}.charts-grid-3{grid-template-columns:1fr 1fr}.kpi-banner{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.kpi-banner{grid-template-columns:1fr}.charts-grid-3{grid-template-columns:1fr}}

/* ══════════════════════════════════════════════════════════════
   RESPONSIVE ADDITIONS — alq-analitica.css
   ══════════════════════════════════════════════════════════════ */
@media (max-width: 900px) {
  .charts-grid, .charts-grid-3 { grid-template-columns: 1fr; }
  .kpi-banner { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .kpi-banner { grid-template-columns: 1fr 1fr; border-radius: 12px; }
  .kpi-banner-item { padding: 14px 16px; }
  .kpi-banner-value { font-size: 1.25rem; }
  .chart-card { padding: 14px 16px; }
  .amort-table th, .amort-table td { padding: 7px 9px; font-size: .76rem; }
  .timeline-item { gap: 10px; padding: 10px 0; }
  .sort-btns { flex-wrap: wrap; gap: 4px; }
  .sort-btn { padding: 3px 8px; font-size: .68rem; }
  .prog-bar { min-width: 50px; }
}
@media (max-width: 480px) {
  .kpi-banner { grid-template-columns: 1fr; }
  .kpi-banner-item { border-right: none; border-bottom: 1px solid rgba(255,255,255,.12); }
  .kpi-banner-item:last-child { border-bottom: none; }
  .chart-card { padding: 12px 12px; }
  .amort-table th:nth-child(3), .amort-table td:nth-child(3),
  .amort-table th:nth-child(4), .amort-table td:nth-child(4) { display: none; }
  .prog-wrap { flex-direction: column; align-items: flex-start; }
  .prog-bar { width: 100%; min-width: unset; }
}