/* ── ATHE Dashboard — Finanzas — Estilos ──────────────────────────────────
   Servido por Flask en /static/finanzas.css
   Paleta: azul corporativo + cyan + verde/ámbar semáforo
   ─────────────────────────────────────────────────────────────────────── */
:root{
  --bd:#1a237e;--bm:#1565c0;--bl:#1976d2;--cy:#00bcd4;--cl:#4dd0e1;
  --gn:#43a047;--am:#f9a825;--rd:#e53935;
  --sw:248px;--th:56px;
  --bg:#f4f6f9;--ca:#fff;--tx:#212121;--mu:#8e9aab;--bo:#e4e8ef;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;overflow:hidden}
body{font-family:"Roboto",sans-serif;background:var(--bg);color:var(--tx);display:flex;flex-direction:column}

/* LOGIN */
#ls{position:fixed;inset:0;z-index:9999;background:linear-gradient(135deg,#f4f6f9,#e8f0fe);display:flex;align-items:center;justify-content:center}
.lc{background:#fff;border-radius:16px;box-shadow:0 8px 40px rgba(21,101,192,.15);padding:48px 44px;text-align:center;width:100%;max-width:400px;border:1px solid var(--bo)}
.ll{height:48px;margin-bottom:28px;object-fit:contain}
.lt{font-size:1.15rem;font-weight:700;color:var(--bd);margin-bottom:6px}
.ls2{font-size:.84rem;color:var(--mu);margin-bottom:32px;line-height:1.5}
.bms{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;padding:12px 20px;border-radius:8px;background:var(--bm);color:#fff;border:none;font-size:.92rem;font-weight:600;cursor:pointer;font-family:"Roboto",sans-serif;transition:background .2s}
.bms:hover{background:var(--bd)}
.ln{font-size:.72rem;color:var(--mu);margin-top:18px;line-height:1.5}
#le{background:#ffebee;color:#c62828;border-radius:6px;padding:10px 14px;font-size:.8rem;margin-top:16px;display:none}

/* TOPBAR */
.tb{height:var(--th);background:#fff;display:flex;align-items:stretch;z-index:400;box-shadow:0 1px 0 var(--bo);flex-shrink:0;overflow:visible}
.tbl{display:flex;align-items:center;gap:10px;padding:0 16px 0 12px;border-right:1px solid var(--bo);flex-shrink:0}
.hbtn{width:32px;height:32px;border:none;background:none;cursor:pointer;border-radius:6px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:6px}
.hbtn:hover{background:var(--bg)}
.hbtn span{display:block;width:16px;height:2px;background:var(--mu);border-radius:2px}
.li{height:30px;object-fit:contain;flex-shrink:0}
.tabs{display:flex;align-items:flex-end;flex:1;overflow:hidden;padding:0 4px;gap:2px}
.tab{display:flex;align-items:center;gap:5px;padding:0 14px;height:46px;font-size:.8rem;font-weight:500;color:var(--mu);cursor:pointer;border-bottom:3px solid transparent;transition:all .18s;white-space:nowrap;user-select:none;border-radius:6px 6px 0 0;flex-shrink:0;margin-top:10px}
.tab:hover{color:var(--bm);background:#f0f7ff}
.tab.active{color:var(--bm);border-bottom-color:var(--cy);background:#fff;font-weight:600}
.tbr{display:flex;align-items:center;padding:0 14px;gap:8px;flex-shrink:0;border-left:1px solid var(--bo)}
.bhm{background:none;border:1px solid var(--bo);border-radius:5px;color:var(--mu);font-size:.72rem;padding:4px 9px;cursor:pointer;font-family:"Roboto",sans-serif;transition:all .2s;text-decoration:none;display:flex;align-items:center;gap:4px}
.bhm:hover{border-color:var(--bm);color:var(--bm)}
.ua{width:30px;height:30px;border-radius:50%;background:var(--bm);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;flex-shrink:0}
.un{font-size:.75rem;color:var(--tx);font-weight:500;max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.blg{background:none;border:1px solid var(--bo);border-radius:5px;color:var(--mu);font-size:.72rem;padding:4px 9px;cursor:pointer;font-family:"Roboto",sans-serif;transition:all .2s}
.blg:hover{border-color:#f44336;color:#f44336}

/* LAYOUT */
.lay{display:flex;flex:1;overflow:hidden;position:relative}

/* SIDEBAR */
.sb{width:var(--sw);background:#fff;border-right:1px solid var(--bo);flex-shrink:0;display:flex;flex-direction:column;transition:width .28s,opacity .25s;overflow:hidden}
.sb.hidden{width:0;opacity:0;pointer-events:none}
.sbi{width:var(--sw);padding-top:8px;display:flex;flex-direction:column;flex:1;overflow-y:auto;overflow-x:hidden}
.ss{padding:6px 18px 4px;font-size:.63rem;text-transform:uppercase;letter-spacing:.1em;color:var(--mu);font-weight:600;margin-top:6px}
.sg{padding:4px 18px 12px;border-bottom:1px solid var(--bo)}
.sg label{font-size:.75rem;color:var(--tx);display:block;margin-bottom:3px;font-weight:500}
.sg input,.sg select{width:100%;background:var(--bg);border:1px solid var(--bo);border-radius:5px;color:var(--tx);padding:4px 7px;font-size:.75rem;font-family:"Roboto",sans-serif;margin-bottom:5px;transition:border-color .2s}
.sg input:focus,.sg select:focus{outline:none;border-color:var(--cy);background:#fff}
.sact{padding:8px 18px 10px;border-bottom:1px solid var(--bo);display:flex;flex-direction:column;gap:4px}
.sact-row{display:flex;gap:4px}
.ba{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;border:none;border-radius:5px;padding:5px 3px;font-size:.63rem;font-weight:500;cursor:pointer;font-family:"Roboto",sans-serif;transition:all .2s}
.ba.apl{background:#e8f0fe;color:var(--bm);border:1px solid #c5d8f8}
.ba.apl:hover{background:var(--bm);color:#fff}
.ba.apl.pending{background:#fff3cd;color:#856404;border:1px solid #ffc107;animation:pulse-pending 1.5s ease-in-out infinite}
@keyframes pulse-pending{0%,100%{box-shadow:0 0 0 0 rgba(255,193,7,.4)}50%{box-shadow:0 0 0 4px rgba(255,193,7,0)}}
.ba.rst{background:#fff3e0;color:#e65100;border:1px solid #ffcc80}
.ba.rst:hover{background:#e65100;color:#fff}
.ba.xls{background:#e8f5e9;color:#2e7d32;border:1px solid #a5d6a7}
.ba.xls:hover{background:#2e7d32;color:#fff}
.ba-icon{font-size:.85rem;line-height:1}

/* FUENTE toggle */
.fuente-toggle{display:flex;gap:4px;margin-bottom:8px}
.ft-btn{flex:1;padding:5px 4px;border-radius:5px;border:1px solid var(--bo);background:var(--bg);font-size:.7rem;font-weight:500;cursor:pointer;font-family:"Roboto",sans-serif;transition:all .18s;text-align:center;color:var(--mu)}
.ft-btn.active{background:var(--bm);color:#fff;border-color:var(--bm)}
.ft-btn.fl.active{background:#7b1fa2;border-color:#7b1fa2}

/* OVERLAY CARGA */
#loading-overlay{position:absolute;top:0;bottom:0;left:var(--sw);right:0;z-index:8000;background:rgba(30,40,60,.38);display:flex;align-items:center;justify-content:center;transition:left .28s}
.lo-box{background:#fff;border-radius:12px;padding:28px 36px;display:flex;flex-direction:column;align-items:center;gap:14px;box-shadow:0 8px 32px rgba(0,0,0,.18)}
.lo-spinner{width:36px;height:36px;border:4px solid #e4e8ef;border-top-color:var(--bm);border-radius:50%;animation:spin .7s linear infinite}
.lo-txt{font-size:.88rem;font-weight:500;color:var(--tx)}
@keyframes spin{to{transform:rotate(360deg)}}

/* ESTADO SIDEBAR */
.sn{padding:6px 18px 10px;font-size:.62rem;color:var(--mu);line-height:1.7;margin-top:auto;border-top:1px solid var(--bo)}
.sn strong{font-weight:500}
.sn-ok{color:var(--gn)!important}
.sn-err{color:var(--rd)!important}
.sn-loading{color:#f57c00!important}

/* MAIN */
.mn{flex:1;overflow-y:auto;overflow-x:hidden;padding:12px 18px;min-width:0}
.pn{display:none}
.pn.active{display:block}
.eb{background:#ffebee;border-left:4px solid var(--rd);color:#b71c1c;border-radius:6px;padding:9px 13px;font-size:.82rem;margin-bottom:10px;display:none}

/* SECCIÓN FUENTE */
.src-head{display:flex;align-items:center;gap:8px;margin-bottom:10px;padding-bottom:8px;border-bottom:2px solid var(--bo)}
.src-badge{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:12px;font-size:.72rem;font-weight:600}
.src-badge.ag{background:#e8f0fe;color:var(--bm)}
.src-badge.fl{background:#f3e5f5;color:#7b1fa2}
.src-sep{height:1px;background:var(--bo);margin:18px 0 14px}

/* KPI GRID */
.kg{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:10px}
.kg.kg3{grid-template-columns:repeat(3,1fr)}
.kc{background:var(--ca);border-radius:6px;padding:8px 12px;border:none;border-left:4px solid var(--bm);box-shadow:0 1px 3px rgba(0,0,0,.05)}
.kc.cy{border-left-color:var(--cy)}
.kc.gn{border-left-color:var(--gn)}
.kc.fl{border-left-color:#9c27b0}
.kl{font-size:.6rem;text-transform:uppercase;letter-spacing:.07em;color:var(--mu);font-weight:600}
.kv{font-size:1.1rem;font-weight:700;color:var(--bd);line-height:1.15;margin:3px 0 2px}
.ks{font-size:.62rem;color:var(--mu)}

/* CHARTS */
.cr2{display:grid;grid-template-columns:3fr 2fr;gap:10px;margin-bottom:10px}
.cr1{display:grid;grid-template-columns:1fr;gap:10px;margin-bottom:10px}
.cc{background:var(--ca);border-radius:8px;padding:12px 14px;box-shadow:0 1px 3px rgba(0,0,0,.05);border:1px solid var(--bo)}
.cc.full{grid-column:1/-1}
.ch{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;flex-wrap:wrap;gap:5px}
.ch h5{font-size:.84rem;font-weight:600}
.ch span{font-size:.7rem;color:var(--mu)}
.cw{position:relative;height:200px}
.cw.tall{height:260px}
.bxls{background:#fff;border:1px solid #a5d6a7;color:#2e7d32;padding:3px 8px;border-radius:4px;font-size:.68rem;font-weight:500;cursor:pointer;white-space:nowrap;font-family:"Roboto",sans-serif;transition:all .2s}
.bxls:hover{background:#2e7d32;color:#fff}

/* TABLES */
.tc{background:var(--ca);border-radius:8px;padding:12px 14px;margin-bottom:10px;box-shadow:0 1px 3px rgba(0,0,0,.05);border:1px solid var(--bo)}
.tc .th{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px;gap:6px}
.tc .th h5{font-size:.84rem;font-weight:600}
.tw2{overflow-x:auto;max-height:380px;overflow-y:auto;border-radius:5px;border:1px solid var(--bo)}
table{width:100%;border-collapse:collapse;font-size:.79rem}
thead th{position:sticky;top:0;background:#f4f6f9;color:var(--mu);padding:7px 9px;text-align:left;font-size:.65rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;white-space:nowrap;border-bottom:2px solid var(--bo)}
tbody tr:hover{background:#f0f7ff}
tbody td{padding:7px 9px;border-bottom:1px solid var(--bo);white-space:nowrap}
tbody tr:last-child td{border-bottom:none}
.num{text-align:right;font-variant-numeric:tabular-nums;font-size:.77rem}
.rk{color:var(--mu);font-size:.7rem;font-weight:600;width:22px;text-align:center}
.chip{display:inline-block;padding:2px 8px;border-radius:4px;background:#e8f0fe;color:var(--bm);font-size:.73rem;font-weight:500}
.chip.fl{background:#f3e5f5;color:#7b1fa2}
.bar-wrap{display:flex;align-items:center;gap:6px;min-width:140px}
.mini-bar{height:5px;border-radius:3px;min-width:2px;background:linear-gradient(90deg,var(--bm),var(--cy));flex-shrink:0}
.mini-bar.fl{background:linear-gradient(90deg,#9c27b0,#e040fb)}

/* EMPTY / WIP */
.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:200px;gap:10px;color:var(--mu);text-align:center;font-size:.83rem}

@media(max-width:1400px){.kg{grid-template-columns:repeat(3,1fr)}}
@media(max-width:1100px){.kg{grid-template-columns:1fr 1fr}.cr2{grid-template-columns:1fr}}
@media(max-width:800px){.kg{grid-template-columns:1fr 1fr}}
