/* ── KPIs ── */
.kpi-grid {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 16px;
}

.kpi-card {
    background: var(--blanco);
    border-radius: var(--r-xl);
    border: 1px solid var(--gris-100);
    padding: 22px 22px 18px;
    box-shadow: var(--shadow-xs);
    transition: var(--ease);
    cursor: default;
}
.kpi-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }

.kpi-top {
    display: flex; justify-content: space-between; align-items: flex-start;
    margin-bottom: 14px;
}

.kpi-icono {
    width: 44px; height: 44px;
    border-radius: var(--r);
    display: flex; align-items: center; justify-content: center;
    font-size: 22px;
}
.kpi-icono.coral    { background: var(--coral-light); color: var(--coral); }
.kpi-icono.verde    { background: var(--verde-light); color: var(--verde); }
.kpi-icono.azul     { background: var(--azul-light); color: var(--azul); }
.kpi-icono.amarillo { background: var(--amarillo-light); color: var(--amarillo); }

.kpi-var {
    display: inline-flex; align-items: center; gap: 3px;
    font-size: 11.5px; font-weight: 700;
    padding: 4px 9px; border-radius: var(--r-pill);
}
.kpi-var.sube   { background: #E6FAF5; color: #007A6E; }
.kpi-var.baja   { background: var(--coral-light); color: var(--coral-dark); }
.kpi-var.neutro { background: var(--gris-100); color: var(--gris-400); }

.kpi-valor {
    font-size: 30px; font-weight: 800;
    color: var(--negro); display: block; line-height: 1;
    margin-bottom: 4px;
}
.kpi-valor span { font-size: 17px; color: var(--gris-300); font-weight: 500; }

.kpi-etiqueta { font-size: 12.5px; color: var(--gris-400); font-weight: 600; }

.kpi-vs {
    font-size: 11.5px; color: var(--gris-300);
    margin-top: 4px; display: block;
}

.kpi-barra {
    margin-top: 14px; height: 3px;
    background: var(--gris-100); border-radius: 10px; overflow: hidden;
}
.kpi-barra-fill {
    height: 100%; border-radius: 10px; transition: width .8s ease;
}
.kpi-barra-fill.coral   { background: var(--coral); }
.kpi-barra-fill.verde   { background: var(--verde); }
.kpi-barra-fill.azul    { background: var(--azul); }
.kpi-barra-fill.amarillo{ background: var(--amarillo); }

/* ── Gráfico ingresos ── */
.chart-wrap { position: relative; height: 250px; }

.tabs-bar {
    display: flex; gap: 2px;
    background: var(--gris-50);
    border: 1px solid var(--gris-100);
    border-radius: var(--r-pill);
    padding: 3px;
}
.tab-btn {
    flex: 1; padding: 7px 16px;
    border: none; background: none;
    font-size: 12.5px; font-weight: 600;
    color: var(--gris-400);
    border-radius: var(--r-pill);
    cursor: pointer; transition: var(--ease);
    font-family: var(--fuente); white-space: nowrap;
}
.tab-btn.activo {
    background: var(--blanco);
    color: var(--negro);
    box-shadow: var(--shadow-xs);
}
.tab-btn:hover:not(.activo) { color: var(--negro); }

/* ── Stat mini ── */
.chart-stats {
    display: flex; gap: 24px; margin-bottom: 16px;
    flex-wrap: wrap;
}
.chart-stat-item { }
.chart-stat-val {
    font-size: 22px; font-weight: 800; color: var(--negro); display: block; line-height: 1;
}
.chart-stat-lbl { font-size: 12px; color: var(--gris-400); font-weight: 600; }
.chart-stat-var { font-size: 12px; font-weight: 700; color: var(--verde); }

/* ── Plazas disponibles ── */
.plazas-resumen {
    display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; margin-bottom: 14px;
}
.plaza-stat {
    border-radius: var(--r-lg); padding: 12px 14px;
    display: flex; align-items: center; gap: 10px;
}
.plaza-stat.libre        { background: var(--verde-light); }
.plaza-stat.ocupada      { background: var(--coral-light); }
.plaza-stat.reservada    { background: var(--amarillo-light); }
.plaza-stat.mantenimiento{ background: var(--gris-50); border: 1px solid var(--gris-100); }

.plaza-stat-num {
    font-size: 24px; font-weight: 800;
}
.plaza-stat.libre .plaza-stat-num     { color: var(--verde); }
.plaza-stat.ocupada .plaza-stat-num   { color: var(--coral); }
.plaza-stat.reservada .plaza-stat-num { color: var(--amarillo); }
.plaza-stat.mantenimiento .plaza-stat-num { color: var(--gris-400); }

.plaza-stat-lbl {
    font-size: 11.5px; font-weight: 700;
}
.plaza-stat.libre .plaza-stat-lbl     { color: #007A6E; }
.plaza-stat.ocupada .plaza-stat-lbl   { color: var(--coral-dark); }
.plaza-stat.reservada .plaza-stat-lbl { color: #8A5E00; }
.plaza-stat.mantenimiento .plaza-stat-lbl { color: var(--gris-400); }

/* Grid visual parcelas */
.plazas-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(42px, 1fr));
    gap: 5px; margin-top: 4px;
    max-height: 220px; overflow-y: auto;
}
.plaza {
    aspect-ratio: 1;
    border-radius: var(--r-sm);
    display: flex; align-items: center; justify-content: center;
    font-size: 10.5px; font-weight: 700;
    cursor: pointer; transition: var(--ease);
    border: 1.5px solid transparent;
}
.plaza:hover { transform: scale(1.1); box-shadow: var(--shadow-sm); }
.plaza.libre       { background: var(--verde-light); color: #007A6E; border-color: #B0E4DF; }
.plaza.ocupada     { background: var(--coral-light); color: var(--coral-dark); border-color: var(--coral-mid); }
.plaza.reservada   { background: var(--amarillo-light); color: #8A5E00; border-color: #FFD88A; }
.plaza.mantenimiento { background: var(--gris-50); color: var(--gris-300); border-color: var(--gris-100); }

.plazas-leyenda {
    display: flex; flex-wrap: wrap; gap: 10px;
    margin-top: 12px; padding-top: 12px;
    border-top: 1px solid var(--gris-100);
}
.leyenda-item {
    display: flex; align-items: center; gap: 5px;
    font-size: 11.5px; color: var(--gris-400); font-weight: 600;
}
.leyenda-dot {
    width: 10px; height: 10px; border-radius: 3px;
}
.leyenda-dot.libre       { background: var(--verde); }
.leyenda-dot.ocupada     { background: var(--coral); }
.leyenda-dot.reservada   { background: var(--amarillo); }
.leyenda-dot.mantenimiento { background: var(--gris-300); }

/* ── Movimientos ── */
.mov-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }

.mov-seccion-titulo {
    font-size: 11px; font-weight: 800;
    text-transform: uppercase; letter-spacing: .7px;
    margin-bottom: 12px;
    display: flex; align-items: center; gap: 6px;
}
.mov-seccion-titulo.llegadas { color: var(--azul); }
.mov-seccion-titulo.salidas  { color: var(--coral); }

.mov-item {
    display: flex; align-items: center; gap: 10px;
    padding: 9px 0; border-bottom: 1px solid var(--gris-100);
}
.mov-item:last-child { border-bottom: none; padding-bottom: 0; }

.mov-avatar {
    width: 32px; height: 32px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 11px; font-weight: 800; color: #fff; flex-shrink: 0;
}
.mov-info { flex: 1; min-width: 0; }
.mov-nombre {
    font-size: 13px; font-weight: 600; color: var(--negro);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block;
}
.mov-sub { font-size: 11.5px; color: var(--gris-400); }
.mov-hora { font-size: 12px; font-weight: 700; color: var(--gris-600); white-space: nowrap; }

/* ── Facturación tipo ── */
.factu-fila {
    display: flex; justify-content: space-between; align-items: center;
    padding: 12px 0; border-bottom: 1px solid var(--gris-100);
}
.factu-fila:last-child { border-bottom: none; padding-bottom: 0; }

.factu-izq { display: flex; align-items: center; gap: 12px; }

.factu-icono-wrap {
    width: 38px; height: 38px; border-radius: var(--r);
    display: flex; align-items: center; justify-content: center;
    font-size: 18px;
}
.factu-icono-wrap.verde   { background: var(--verde-light); color: var(--verde); }
.factu-icono-wrap.naranja { background: #FFF4E6; color: #E67E22; }
.factu-icono-wrap.azul    { background: var(--azul-light); color: var(--azul); }

.factu-nombre {
    font-size: 13.5px; font-weight: 700; color: var(--negro); display: block;
}
.factu-reservas { font-size: 11.5px; color: var(--gris-400); }

.factu-der { text-align: right; }
.factu-total {
    font-size: 15px; font-weight: 800; color: var(--negro); display: block;
}
.factu-pct {
    font-size: 11.5px; font-weight: 600; color: var(--gris-400);
}

.factu-barra-wrap {
    height: 3px; background: var(--gris-100);
    border-radius: 10px; overflow: hidden; margin-top: 4px;
}
.factu-barra-fill { height: 100%; border-radius: 10px; }
.factu-barra-fill.verde  { background: var(--verde); }
.factu-barra-fill.naranja{ background: #E67E22; }
.factu-barra-fill.azul   { background: var(--azul); }

/* ── Actividad reciente ── */
.actividad-item {
    display: flex; align-items: flex-start; gap: 12px;
    padding: 11px 0; border-bottom: 1px solid var(--gris-100);
}
.actividad-item:last-child { border-bottom: none; padding-bottom: 0; }

.act-icono {
    width: 34px; height: 34px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 15px; flex-shrink: 0; margin-top: 1px;
}
.act-icono.nueva    { background: var(--azul-light); color: var(--azul); }
.act-icono.pago     { background: var(--verde-light); color: var(--verde); }
.act-icono.cancelada{ background: var(--coral-light); color: var(--coral); }
.act-icono.mensaje  { background: var(--amarillo-light); color: var(--amarillo); }
.act-icono.mant     { background: var(--gris-100); color: var(--gris-400); }

.act-texto { font-size: 13px; color: var(--gris-600); line-height: 1.5; }
.act-texto strong { font-weight: 700; color: var(--negro); }
.act-cuando { font-size: 11px; color: var(--gris-300); margin-top: 2px; display: block; font-weight: 600; }

/* ── Calendario mini ── */
.cal-mini-grid {
    display: grid; grid-template-columns: repeat(7,1fr); gap: 3px;
    margin-top: 6px;
}
.cal-mini-lbl-dia {
    text-align: center; font-size: 10px; font-weight: 800;
    color: var(--gris-300); padding: 2px 0 5px;
    text-transform: uppercase;
}
.cal-dia {
    aspect-ratio: 1;
    border-radius: var(--r-sm);
    display: flex; align-items: center; justify-content: center;
    font-size: 11px; font-weight: 600;
    cursor: pointer; transition: var(--ease);
}
.cal-dia:hover { transform: scale(1.12); }
.cal-dia.vacio  { cursor: default; }
.cal-dia.completo { background: #FFE8E8; color: var(--coral-dark); font-weight: 800; border: 1px solid var(--coral-mid); }
.cal-dia.alto     { background: #FFF4D6; color: #8A5E00; font-weight: 700; border: 1px solid #FFE0A0; }
.cal-dia.medio    { background: var(--verde-light); color: #007A6E; border: 1px solid #B0E4DF; }
.cal-dia.bajo     { background: var(--gris-50); color: var(--gris-300); border: 1px solid var(--gris-100); }
.cal-dia.hoy      { outline: 2px solid var(--coral); outline-offset: 1px; font-weight: 800; }

.cal-resumen {
    margin-top: 14px; display: flex; flex-direction: column; gap: 6px;
}
.cal-res-fila {
    display: flex; justify-content: space-between;
    font-size: 12.5px; padding: 7px 10px;
    background: var(--gris-50); border-radius: var(--r);
}
.cal-res-fila span:first-child { color: var(--gris-400); font-weight: 600; }
.cal-res-fila strong { color: var(--negro); font-weight: 700; }

/* ── Sección título ── */
.seccion-titulo {
    font-size: 11px; font-weight: 800;
    color: var(--gris-300);
    text-transform: uppercase; letter-spacing: .8px;
    margin-bottom: 14px;
    display: flex; align-items: center; gap: 8px;
}
.seccion-titulo::after {
    content: '';
    flex: 1; height: 1px; background: var(--gris-100);
}

/* ── Responsive ── */
@media (max-width:1280px) { .kpi-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width:900px) { .mov-grid { grid-template-columns: 1fr; } }
@media (max-width:640px) { .kpi-grid { grid-template-columns: 1fr 1fr; } }