/* Base de Datos Global / CRM -- estilo Excel/Google Sheets (Entrega 3,
   2026-09-22), mismo lenguaje visual que Seguimiento (seguimiento.css):
   cabecera compacta, cuadrícula blanca, encabezados fijos, columnas
   redimensionables. La hoja ocupa casi todo el alto disponible. */
.crm-view-wrapper {
    --crm-navy: #002D62;
    --crm-navy-mid: #003b82;
    --crm-gold: #FFC300;
    --crm-line: #cbd5e1;
    width: calc(100% + 20px);
    margin: 0 -10px -10px -10px;
    height: calc(100vh - 58px);
    background: #eef2f7;
    color: #1e293b;
    padding: 8px 14px 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.crm-view-wrapper.hidden { display: none; }
.crm-shell {
    max-width: var(--content-max-width-table, 2000px);
    width: 100%;
    margin: 0 auto;
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--crm-line);
}

/* ===== cabecera compacta ===== */
.crm-topbar {
    flex: 0 0 auto;
    display: flex; align-items: center; gap: 10px;
    background: var(--crm-navy); color: #fff; padding: 7px 14px;
    border-bottom: 3px solid var(--crm-gold);
}
.crm-topbar h2 { font-size: 0.92rem; font-weight: 800; letter-spacing: 0.02em; margin: 0; }
.crm-topbar-sub { font-size: 0.76rem; color: #cbd8ee; margin-left: auto; }
.crm-icon-btn { background: transparent; border: none; color: #fff; cursor: pointer; display: inline-flex; padding: 4px; border-radius: 4px; }
.crm-icon-btn:hover { background: rgba(255, 255, 255, 0.12); }

/* ===== pestañas ===== */
.crm-tabs { flex: 0 0 auto; display: flex; gap: 2px; background: #f1f5f9; border-bottom: 1px solid var(--crm-line); padding: 0 10px; }
.crm-tab { border: none; background: transparent; padding: 8px 14px; font: inherit; font-size: 0.82rem; font-weight: 700; color: #64748b; cursor: pointer; border-bottom: 2px solid transparent; }
.crm-tab.active { color: var(--crm-navy); border-bottom-color: var(--crm-gold); }
.crm-panel { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.crm-panel.hidden { display: none; }
.crm-page { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.crm-page.hidden { display: none; }

/* ===== barra de herramientas (búsqueda + filtros) ===== */
.crm-toolbar { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-bottom: 1px solid var(--crm-line); flex-wrap: wrap; background: #fafbfc; }
.crm-search-wrap { display: flex; align-items: center; gap: 6px; border: 1px solid var(--crm-line); border-radius: 4px; padding: 4px 8px; background: #fff; min-width: 220px; flex: 1 1 220px; }
.crm-search-wrap input { border: none; outline: none; font: inherit; font-size: 0.82rem; width: 100%; }
.crm-toolbar select, .crm-toolbar input[type="text"]:not(#crm-search) { border: 1px solid var(--crm-line); border-radius: 4px; padding: 5px 8px; font: inherit; font-size: 0.8rem; background: #fff; }
.crm-check-inline { display: inline-flex; align-items: center; gap: 5px; font-size: 0.8rem; color: #475569; white-space: nowrap; }
.crm-btn-ghost { border: 1px solid var(--crm-line); background: #fff; border-radius: 4px; padding: 5px 8px; cursor: pointer; display: inline-flex; align-items: center; gap: 4px; font-size: 0.8rem; color: #334155; }
.crm-btn-ghost:hover { background: #f1f5f9; }
.crm-btn-ghost:disabled { opacity: 0.45; cursor: default; }
.crm-count { margin-left: auto; font-size: 0.78rem; color: #64748b; white-space: nowrap; }

/* ===== cuadrícula ===== */
.crm-grid-wrap { flex: 1; min-height: 0; overflow: auto; position: relative; }
table.crm-grid { border-collapse: collapse; width: 100%; table-layout: fixed; font-size: 0.82rem; }
.crm-grid thead { position: sticky; top: 0; z-index: 3; }
.crm-grid th { background: var(--crm-navy); color: #fff; font-weight: 700; text-align: left; padding: 6px 8px; border-right: 1px solid rgba(255,255,255,0.15); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-grid td { padding: 5px 8px; border-bottom: 1px solid #eef1f4; border-right: 1px solid #f1f5f9; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-grid tbody tr:hover { background: #f5f9ff; cursor: pointer; }
.crm-grid td.crm-num { text-align: right; font-variant-numeric: tabular-nums; }
.crm-grid td.crm-deuda { color: #b91c1c; font-weight: 700; }
.crm-grid td.crm-sin-doc { color: #94a3b8; font-style: italic; }
.crm-ver-link { color: #1a73e8; font-weight: 700; text-decoration: none; }
.crm-badge-fuente { font-size: 0.68rem; padding: 1px 6px; border-radius: 999px; background: #e2e8f0; color: #475569; margin-left: 4px; }
.crm-empty { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; color: #94a3b8; padding: 40px; }
.crm-empty.hidden { display: none; }

.crm-paginacion { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; gap: 12px; padding: 6px; border-top: 1px solid var(--crm-line); font-size: 0.8rem; color: #475569; }

/* ===== columnas redimensionables (mismo patrón de Seguimiento) ===== */
.crm-col-resizer { position: absolute; right: -3px; top: 0; width: 6px; height: 100%; cursor: col-resize; z-index: 5; }

/* ===== aviso de version nueva mientras hay un borrador sin guardar ===== */
.crm-banner-alerta { display: flex; align-items: center; gap: 8px; margin: 10px 14px 0; padding: 8px 12px; background: #fffbeb; border: 1px solid #fbbf24; border-radius: 6px; font-size: 0.8rem; color: #92400e; }
.crm-banner-alerta.hidden { display: none; }
.crm-banner-alerta span { flex: 1; }

/* ===== ficha de una persona ===== */
.crm-ficha-head { flex: 0 0 auto; display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-bottom: 1px solid var(--crm-line); }
.crm-ficha-head h3 { margin: 0; font-size: 1rem; color: var(--crm-navy); }
.crm-badge { font-size: 0.72rem; padding: 2px 8px; border-radius: 999px; background: #e0e7ff; color: #3730a3; }
.crm-ficha-grid { display: flex; gap: 20px; padding: 14px; flex-wrap: wrap; overflow-y: auto; }
.crm-ficha-datos { flex: 1 1 320px; display: flex; flex-direction: column; gap: 10px; max-width: 380px; }
.crm-ficha-campo label { display: block; font-size: 0.72rem; font-weight: 700; color: #64748b; margin-bottom: 3px; text-transform: uppercase; letter-spacing: 0.03em; }
.crm-ficha-valor { font-size: 0.9rem; color: #1e293b; padding: 6px 0; }
.crm-input { width: 100%; box-sizing: border-box; border: 1px solid var(--crm-line); border-radius: 4px; padding: 6px 8px; font: inherit; font-size: 0.85rem; }
.crm-input:focus { outline: none; border-color: #1a73e8; box-shadow: 0 0 0 1px #1a73e8; }
.crm-btn-primario { align-self: flex-start; background: var(--crm-navy); color: #fff; border: none; border-radius: 5px; padding: 8px 16px; font: inherit; font-size: 0.85rem; font-weight: 700; cursor: pointer; }
.crm-btn-primario:hover { background: var(--crm-navy-mid); }
.crm-aviso { font-size: 0.8rem; color: #15803d; }
.crm-aviso.error { color: #dc2626; }
.crm-aviso.hidden { display: none; }
.crm-ficha-resumen { flex: 1 1 260px; display: flex; flex-direction: column; gap: 10px; }
.crm-kpi { background: #f8fafc; border: 1px solid var(--crm-line); border-radius: 6px; padding: 10px 12px; display: flex; flex-direction: column; }
.crm-kpi b { font-size: 1.3rem; color: var(--crm-navy); }
.crm-kpi span { font-size: 0.74rem; color: #64748b; }
#crm-ficha-kpi-deuda-wrap.alerta b, #crm-res-deuda-wrap.alerta b { color: #b91c1c; }

.crm-ficha-sub { margin: 0; padding: 10px 14px 4px; font-size: 0.82rem; color: #334155; flex: 0 0 auto; }
.crm-historial-wrap { flex: 1; min-height: 120px; overflow: auto; padding: 0 14px 14px; }
table.crm-historial-tabla { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.crm-historial-tabla th { text-align: left; background: #f1f5f9; padding: 6px 8px; position: sticky; top: 0; }
.crm-historial-tabla td { padding: 6px 8px; border-bottom: 1px solid #eef1f4; }
.crm-historial-tabla td.crm-incompleto { color: #b45309; }
.crm-hist-link { color: #1a73e8; cursor: pointer; font-size: 0.78rem; }

/* ===== resumen / indicadores (Entrega 4) ===== */
.crm-ind-scroll { flex: 1; min-height: 0; overflow-y: auto; }
.crm-resumen-kpis { display: flex; gap: 14px; flex-wrap: wrap; padding: 16px; }
.crm-resumen-kpis .crm-kpi { min-width: 170px; }
.crm-kpi-potencial { border-color: #fbbf24; background: #fffbeb; }
.crm-kpi-potencial b { color: #b45309; }
.crm-nota { padding: 0 16px; font-size: 0.78rem; color: #64748b; display: flex; align-items: center; gap: 6px; }

.crm-ind-charts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; padding: 0 16px 16px; }
.crm-ind-card { background: #f8fafc; border: 1px solid var(--crm-line); border-radius: 6px; padding: 12px; min-width: 0; }
.crm-ind-card h4 { margin: 0 0 8px; font-size: 0.82rem; color: #334155; }
.crm-ind-card-ancha { grid-column: 1 / -1; }
.crm-pot-wrap { padding: 0 16px 16px; min-height: 160px; max-height: 320px; }
.crm-pot-wrap .crm-historial-tabla { }

.crm-ajuste-box { margin: 0 16px 18px; padding: 12px; background: #f8fafc; border: 1px solid var(--crm-line); border-radius: 6px; }
.crm-ajuste-row { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
#crm-cuota-kpis { padding-top: 16px; }

@media (max-width: 900px) {
    .crm-ind-charts { grid-template-columns: 1fr; }
}

/* ===== móvil ===== */
@media (max-width: 900px) {
    .crm-topbar-sub { display: none; }
    .crm-ficha-grid { flex-direction: column; }
    .crm-ficha-datos, .crm-ficha-resumen { max-width: none; }
}