/* ============================================================
   FLUJO DE CAJA & CONTROL AVANZADO — Viña Las Pitras
   Se carga después de improvements.css
   ============================================================ */

/* ----- Navegación: botón Flujo de caja ----- */
.nav[data-view="cashflow"]::before{content:'💰';margin-right:5px}

/* ----- Sistema de pestañas ----- */
.cf-tabs{display:flex;gap:2px;border-bottom:2px solid var(--line);margin:0 0 20px;overflow-x:auto}
.cf-tab{padding:10px 16px;border:0;background:transparent;color:var(--muted);font:600 11px Manrope;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px;white-space:nowrap;transition:.15s}
.cf-tab:hover{color:var(--ink);background:var(--soft)}
.cf-tab.active{color:var(--forest);border-bottom-color:var(--forest-2)}
.cf-panel{display:none}
.cf-panel.active{display:block}

/* ----- Encabezado de vista ----- */
.cf-header{margin-bottom:22px}
.cf-header .eyebrow{color:var(--muted);font:500 8.5px 'DM Mono',monospace;letter-spacing:.7px;margin-bottom:4px}
.cf-header h2{margin:0 0 4px;font:700 20px 'Playfair Display',serif;color:var(--forest)}
.cf-header p{margin:0;color:var(--muted);font-size:11px;line-height:1.5}

/* ----- KPI cards (reutilizable) ----- */
.cf-kpi-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:22px}
.cf-kpi{padding:14px 16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--card);box-shadow:0 4px 12px #123d220a}
.cf-kpi .kl{color:var(--muted);font:500 8.5px 'DM Mono',monospace;letter-spacing:.6px;margin-bottom:6px}
.cf-kpi .kv{color:var(--ink);font:500 20px 'DM Mono',monospace;letter-spacing:-1px;font-variant-numeric:tabular-nums}
.cf-kpi .kh{color:var(--muted);font-size:9.5px;margin-top:4px}
.cf-kpi.positive .kv{color:var(--forest-2)}
.cf-kpi.negative .kv{color:var(--red)}
.cf-kpi.warning .kv{color:var(--gold)}

/* ----- Tabla genérica cashflow ----- */
.cf-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);margin-bottom:18px}
.cf-table{width:100%;border-collapse:collapse;font-size:11px}
.cf-table th{background:var(--soft);color:var(--muted);font:600 9px 'DM Mono',monospace;letter-spacing:.5px;padding:10px 12px;text-align:left;border-bottom:1px solid var(--line);position:sticky;top:0;white-space:nowrap}
.cf-table td{padding:9px 12px;border-bottom:1px solid #f0f5ef;color:var(--ink);font:400 11px Manrope}
.cf-table tr:hover td{background:#f8fbf7}
.cf-table .num{text-align:right;font-family:'DM Mono',monospace;font-size:10.5px;font-variant-numeric:tabular-nums}
.cf-table tfoot td{font-weight:700;background:var(--soft);border-top:2px solid var(--line)}

/* ----- Aging cards ----- */
.aging-row{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:18px}
.aging-card{padding:12px;border-radius:10px;text-align:center;border:1px solid var(--line)}
.aging-card .ac-label{font:500 8px 'DM Mono',monospace;letter-spacing:.5px;color:var(--muted);margin-bottom:4px}
.aging-card .ac-count{font:700 18px 'DM Mono',monospace;margin-bottom:2px}
.aging-card .ac-amount{font:500 10px 'DM Mono',monospace;color:var(--muted)}
.aging-card.ag-ok{background:#eef6ee}.aging-card.ag-ok .ac-count{color:var(--forest-2)}
.aging-card.ag-30{background:#fef9ee}.aging-card.ag-30 .ac-count{color:#b8860b}
.aging-card.ag-60{background:#fdf3e3}.aging-card.ag-60 .ac-count{color:#d08c3c}
.aging-card.ag-90{background:#fdeae8}.aging-card.ag-90 .ac-count{color:var(--red)}
.aging-card.ag-90p{background:#fde2e4}.aging-card.ag-90p .ac-count{color:#8b1a2b}
@media(max-width:700px){.aging-row{grid-template-columns:repeat(3,1fr)}}

/* ----- Status badges ----- */
.pay-status{display:inline-block;padding:3px 8px;border-radius:10px;font:700 8.5px 'DM Mono',monospace;letter-spacing:.3px}
.pay-status.ps-pendiente{background:#fef9ee;color:#8a6a2f}
.pay-status.ps-pagado{background:#e3f2e8;color:#1b6840}
.pay-status.ps-vencido{background:#fde2e4;color:#a03440}
.pay-status.ps-vigente{background:#e8f0f7;color:var(--blue)}

/* ----- Cash flow chart ----- */
.cf-chart-wrap{position:relative;margin-bottom:22px;border:1px solid var(--line);border-radius:var(--radius);padding:16px;background:var(--card)}
.cf-chart-wrap h4{margin:0 0 12px;font:600 12px Manrope;color:var(--ink)}
.cf-chart svg{width:100%;height:auto}
.cf-chart .grid-line{stroke:var(--line);stroke-width:.5}
.cf-chart .balance-line{fill:none;stroke:var(--forest-2);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.cf-chart .threshold-line{stroke:var(--red);stroke-width:1;stroke-dasharray:6 3}
.cf-chart .area-ok{fill:var(--forest-2);opacity:.06}
.cf-chart .area-danger{fill:var(--red);opacity:.08}
.cf-chart .dot{fill:var(--forest-2);stroke:#fff;stroke-width:2}
.cf-chart .dot.below{fill:var(--red)}
.cf-chart .month-label{fill:var(--muted);font:500 9px 'DM Mono',monospace;text-anchor:middle}
.cf-chart .amount-label{fill:var(--muted);font:500 8px 'DM Mono',monospace;text-anchor:end}

/* ----- Formulario inline ----- */
.cf-form-row{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px;align-items:flex-end}
.cf-field{display:flex;flex-direction:column;gap:3px;flex:1;min-width:140px}
.cf-field label{font:600 9px 'DM Mono',monospace;color:var(--muted);letter-spacing:.4px}
.cf-field input,.cf-field select{padding:8px 10px;border:1px solid var(--line);border-radius:8px;font:400 11px Manrope;color:var(--ink);background:#fff;outline:0;transition:.15s}
.cf-field input:focus,.cf-field select:focus{border-color:var(--forest-2);box-shadow:0 0 0 3px #1b684015}
.cf-btn{padding:9px 16px;border:0;border-radius:8px;font:700 10.5px Manrope;cursor:pointer;transition:.12s;white-space:nowrap}
.cf-btn.primary{background:linear-gradient(135deg,#0e4826,#297144);color:#fff;box-shadow:0 4px 10px #0b442520}
.cf-btn.primary:hover{box-shadow:0 6px 16px #0b442530}
.cf-btn.secondary{background:#fff;color:var(--ink);border:1px solid var(--line)}
.cf-btn.secondary:hover{background:var(--soft)}
.cf-btn.danger{background:var(--red);color:#fff}
.cf-btn.small{padding:6px 10px;font-size:9.5px}

/* ----- Toolbar ----- */
.cf-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;flex-wrap:wrap;gap:8px}
.cf-toolbar-left{display:flex;gap:8px;align-items:center}

/* ----- Conciliación ----- */
.recon-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:18px}
.recon-col h4{margin:0 0 10px;font:600 12px Manrope;color:var(--ink)}
@media(max-width:800px){.recon-row{grid-template-columns:1fr}}
.gap-positive{color:var(--forest-2)!important;font-weight:700}
.gap-negative{color:var(--red)!important;font-weight:700}

/* ----- Escenarios ----- */
.scenario-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-bottom:18px}
.scenario-card{padding:16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--card);cursor:pointer;transition:.15s}
.scenario-card:hover{border-color:var(--forest-2);box-shadow:0 4px 14px #1b684012}
.scenario-card.sc-active{border-color:var(--forest-2);background:#f0f8f2}
.scenario-card .sc-name{font:700 13px Manrope;color:var(--forest);margin-bottom:4px}
.scenario-card .sc-desc{font-size:10px;color:var(--muted);margin-bottom:10px}
.scenario-card .sc-total{font:600 16px 'DM Mono',monospace;color:var(--ink)}
.scenario-compare-table{margin-top:14px}

/* ----- Descomposición de desviaciones ----- */
.dev-decomp{position:absolute;z-index:100;background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 14px;box-shadow:0 10px 30px rgba(10,30,20,.18);font-size:10px;width:220px;pointer-events:none;opacity:0;transition:opacity .15s}
.dev-decomp.visible{opacity:1;pointer-events:auto}
.dev-decomp h5{margin:0 0 8px;font:700 10px Manrope;color:var(--forest)}
.dev-decomp .dd-row{display:flex;justify-content:space-between;padding:3px 0;border-bottom:1px solid #f0f5ef}
.dev-decomp .dd-row:last-child{border:0;font-weight:700}
.dd-bar{height:6px;border-radius:3px;margin-top:6px}
.dd-bar-price{background:var(--blue)}
.dd-bar-vol{background:var(--gold)}

/* ----- Tendencia mensual ----- */
.trend-badge{display:inline-flex;align-items:center;gap:3px;padding:2px 6px;border-radius:8px;font:700 9px 'DM Mono',monospace;margin-left:4px}
.trend-badge.up{background:#fde8ea;color:var(--red)}
.trend-badge.down{background:#e3f2e8;color:var(--forest-2)}
.trend-badge.flat{background:#f2f5f0;color:var(--muted)}

/* ----- Bloqueo de presupuesto ----- */
.budget-locked-banner{display:flex;align-items:center;gap:8px;padding:10px 16px;margin-bottom:14px;border:1px solid #c4d4bf;border-radius:10px;background:#eef6ee;color:var(--forest);font:600 11px Manrope}
.budget-locked-banner::before{content:'🔒';font-size:14px}
.budget-locked td[contenteditable]{pointer-events:none!important;opacity:.7;cursor:not-allowed}

/* ----- Margen dashboard ----- */
.margin-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-bottom:18px}
.margin-card{padding:14px;border:1px solid var(--line);border-radius:var(--radius);background:var(--card)}
.margin-card .mc-species{font:700 12px Manrope;color:var(--ink);margin-bottom:8px}
.margin-card .mc-row{display:flex;justify-content:space-between;font-size:10px;padding:3px 0;color:var(--muted)}
.margin-card .mc-row .mc-val{font-family:'DM Mono',monospace;color:var(--ink)}
.margin-card .mc-margin{margin-top:8px;padding-top:8px;border-top:1px solid var(--line);display:flex;justify-content:space-between;font:700 12px Manrope}
.margin-card .mc-margin.pos{color:var(--forest-2)}
.margin-card .mc-margin.neg{color:var(--red)}
.margin-bar-wrap{height:8px;background:var(--soft);border-radius:4px;overflow:hidden;margin-top:6px}
.margin-bar-fill{height:100%;border-radius:4px;transition:width .3s}
.margin-bar-fill.pos{background:var(--forest-2)}
.margin-bar-fill.neg{background:var(--red)}

/* ----- Reporte flujo de caja (print) ----- */
.cf-report-section{page-break-inside:avoid;margin-top:20px}
.cf-report-section h3{font:700 15px 'Playfair Display',serif;color:var(--forest);margin:0 0 12px;padding-bottom:6px;border-bottom:2px solid var(--line)}

/* ----- Diálogo de formulario ----- */
.cf-dialog-overlay{position:fixed;inset:0;z-index:6500;display:grid;place-items:center;background:rgba(5,28,18,.5);opacity:0;pointer-events:none;transition:opacity .18s}
.cf-dialog-overlay.open{opacity:1;pointer-events:auto}
.cf-dialog-box{width:min(520px,92vw);max-height:85vh;overflow-y:auto;background:#fff;border-radius:18px;padding:24px;box-shadow:0 28px 80px rgba(7,27,18,.35)}
.cf-dialog-box h3{margin:0 0 4px;font:700 16px Manrope;color:var(--forest)}
.cf-dialog-box .subtitle{margin:0 0 16px;font-size:11px;color:var(--muted)}
.cf-dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}

/* ----- Empty state ----- */
.cf-empty{padding:40px 20px;text-align:center;color:var(--muted);font-size:12px;line-height:1.7}
.cf-empty .emoji{font-size:28px;margin-bottom:8px}

/* ----- Responsive ----- */
@media(max-width:1000px){.cf-kpi-row{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.cf-kpi-row{grid-template-columns:1fr}.cf-form-row{flex-direction:column}.cf-field{min-width:100%}}
