:root {
    --rp-azul-oscuro: #0d1b4c;
    --rp-azul: #1e6fe0;
    --rp-celeste: #29a6f5;
    --rp-verde: #1fbf85;
    --rp-fondo: #f4f6fb;
    --rp-borde: #e3e7f0;
}

body { background: var(--rp-fondo); font-family: 'Segoe UI', system-ui, sans-serif; }

/* ---------- LOGIN ---------- */
.login-body { display: flex; align-items: center; justify-content: center; min-height: 100vh; background: linear-gradient(135deg, var(--rp-azul-oscuro), var(--rp-azul)); }
.login-wrapper { width: 100%; max-width: 420px; padding: 1rem; }
.login-card { background: #fff; border-radius: 16px; padding: 2.5rem; box-shadow: 0 20px 60px rgba(0,0,0,.25); }
.login-logo h1 { color: var(--rp-azul-oscuro); font-weight: 800; text-align: center; }
.login-logo p { text-align: center; }

/* ---------- SHELL ---------- */
.app-shell { display: flex; min-height: 100vh; }
.app-sidebar { width: 250px; background: var(--rp-azul-oscuro); color: #fff; flex-shrink: 0; position: sticky; top: 0; height: 100vh; overflow-y: auto; }
.sidebar-brand { padding: 1.5rem 1.25rem; font-size: 1.4rem; font-weight: 800; }
.brand-r { color: #fff; }
.brand-pro { color: var(--rp-celeste); }
.sidebar-nav { display: flex; flex-direction: column; padding: .5rem 0; }
.sidebar-nav a { color: rgba(255,255,255,.75); padding: .7rem 1.25rem; text-decoration: none; display: flex; gap: .6rem; align-items: center; font-size: .92rem; }
.sidebar-nav a:hover, .sidebar-nav a.active { background: rgba(255,255,255,.08); color: #fff; border-right: 3px solid var(--rp-verde); }

.app-content { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.app-topbar { display: flex; align-items: center; justify-content: space-between; background: #fff; padding: .9rem 1.5rem; border-bottom: 1px solid var(--rp-borde); position: sticky; top: 0; z-index: 10; }
.app-titulo { font-size: 1.15rem; font-weight: 700; color: var(--rp-azul-oscuro); margin: 0; }
.app-main { padding: 1.5rem; flex: 1; }
.app-footer { padding: 1rem 1.5rem; }

/* ---------- CARDS / KPIs ---------- */
.kpi-card { background: #fff; border-radius: 14px; padding: 1.25rem; border: 1px solid var(--rp-borde); }
.kpi-valor { font-size: 1.8rem; font-weight: 800; color: var(--rp-azul-oscuro); }
.kpi-label { color: #6b7280; font-size: .85rem; }

.badge-success { background: #e6f8f1; color: #0f9d64; }
.badge-warning { background: #fff6e0; color: #b8860b; }
.badge-danger  { background: #fde8e8; color: #c0392b; }
.badge-secondary { background: #eef0f4; color: #6b7280; }
.badge-info { background: #e6f3fd; color: #1e6fe0; }
.badge { padding: .35rem .6rem; border-radius: 8px; font-weight: 600; font-size: .75rem; }

.table-card { background: #fff; border-radius: 14px; border: 1px solid var(--rp-borde); overflow: hidden; }

/* ---------- RESPONSIVE ---------- */
@media (max-width: 991.98px) {
    .app-sidebar { position: fixed; left: -260px; top: 0; z-index: 1050; transition: left .25s ease; }
    .app-sidebar.abierto { left: 0; }
}