/* ============================================================================
   Centro Contable — reestructuración de layout (2026-07-28)
   Scopeado 100% a #sec-contabilidad. Usa las variables de tema existentes
   (--sm-bg-*, --sm-text-*) para adaptarse a oscuro/claro sin duplicar reglas.
   Rojo HINO como color de marca. Fuentes ya cargadas: Inter + DM Mono.
   Estructura nueva: header delgado + tira KPI + riel de módulos (flotante
   a la izquierda) + lienzo a la derecha, una sola cosa a la vez.
   Reversible: quitar el <link> de este archivo en index.html revierte todo.
   ============================================================================ */

#sec-contabilidad{
  --hino:#e4162a;
  --hino2:#ff4a58;
  --hino-soft:rgba(228,22,42,.12);
  --c-line:rgba(148,163,184,.15);
  --c-line2:rgba(148,163,184,.24);
  --c-mono:'DM Mono',ui-monospace,Consolas,monospace;
  font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  font-size:15px;
}
#sec-contabilidad::after{content:'';display:block;clear:both;}

/* Quitar la tarjeta "Tarea principal" (ruido) */
#sec-contabilidad .contabilidad-focus-card{display:none!important;}

/* ---- Header delgado ---- */
#sec-contabilidad .dh-hero.gerencia-hero{
  background:var(--sm-bg-surface)!important;border:1px solid var(--c-line)!important;
  border-left:5px solid var(--hino)!important;border-radius:16px!important;
  padding:20px 24px!important;margin-bottom:16px!important;
}
#sec-contabilidad .dh-hero-kicker{
  color:var(--hino2)!important;font-size:11.5px!important;font-weight:800!important;
  letter-spacing:.16em!important;text-transform:uppercase!important;margin:0 0 5px!important;
}
#sec-contabilidad .dh-hero-title{font-size:27px!important;font-weight:800!important;letter-spacing:-.02em!important;margin:0!important;}
#sec-contabilidad .dh-hero-sub{font-size:14.5px!important;color:var(--sm-text-secondary)!important;margin:5px 0 0!important;}
#sec-contabilidad .cont-periodo-chip{
  background:var(--hino-soft)!important;color:var(--hino2)!important;border:1px solid rgba(228,22,42,.3)!important;
  font-weight:700!important;border-radius:999px!important;padding:4px 12px!important;
}
/* Botones del header: solo el primero es primario (rojo), el resto secundarios */
#sec-contabilidad .gerencia-hero-actions .gerencia-search-btn{
  background:var(--sm-bg-raised)!important;border:1px solid var(--c-line2)!important;color:var(--sm-text-primary)!important;
  border-radius:10px!important;font-weight:600!important;font-size:13.5px!important;box-shadow:none!important;
}
#sec-contabilidad .gerencia-hero-actions .gerencia-search-btn:first-child{
  background:var(--hino)!important;border-color:var(--hino)!important;color:#fff!important;
}

/* ---- Tira KPI (horizontal, compacta) ---- */
#sec-contabilidad #contabilidad-kpis{
  display:grid!important;grid-template-columns:repeat(auto-fit,minmax(185px,1fr))!important;gap:12px!important;margin:0 0 18px!important;
}
#sec-contabilidad .gerencia-kpi-card{
  background:var(--sm-bg-surface)!important;border:1px solid var(--c-line)!important;border-radius:12px!important;
  padding:14px 16px!important;position:relative!important;overflow:hidden!important;box-shadow:none!important;
}
#sec-contabilidad .gerencia-kpi-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--hino);opacity:.5;}
#sec-contabilidad .gerencia-kpi-card.cont-kpi-alerta::before{background:#f59e0b;}
#sec-contabilidad .gerencia-kpi-label{font-size:12.5px!important;font-weight:600!important;color:var(--sm-text-secondary)!important;text-transform:none!important;letter-spacing:0!important;}
#sec-contabilidad .gerencia-kpi-value{font-family:var(--c-mono)!important;font-size:18px!important;font-weight:500!important;letter-spacing:-.01em!important;line-height:1.15!important;}
#sec-contabilidad .gerencia-kpi-sub{font-size:11.5px!important;color:var(--sm-text-muted)!important;margin-top:6px!important;}

/* ---- Riel de módulos (izquierda, flotante y adhesivo) ---- */
#sec-contabilidad #contabilidad-modulos-grid{
  float:left!important;width:222px!important;position:sticky!important;top:12px!important;margin:0!important;padding:0!important;
}
#sec-contabilidad .cont-nav-wrap{display:flex!important;flex-direction:column!important;gap:16px!important;}
#sec-contabilidad .cont-nav-group{display:flex!important;flex-direction:column!important;gap:5px!important;margin:0!important;}
#sec-contabilidad .cont-nav-group-label{
  font-size:10px!important;font-weight:800!important;letter-spacing:.14em!important;text-transform:uppercase!important;
  color:var(--sm-text-muted)!important;padding:0 8px 3px!important;
}
#sec-contabilidad .cont-nav-tabs-row{display:flex!important;flex-direction:column!important;gap:4px!important;}
#sec-contabilidad .cont-nav-tab{
  width:100%!important;justify-content:flex-start!important;gap:10px!important;
  background:transparent!important;border:1px solid transparent!important;border-radius:9px!important;
  padding:9px 11px!important;color:var(--sm-text-secondary)!important;font-size:13.5px!important;font-weight:600!important;box-shadow:none!important;
}
#sec-contabilidad .cont-nav-tab:hover{background:var(--sm-bg-hover)!important;color:var(--sm-text-primary)!important;}
#sec-contabilidad .cont-nav-tab.cont-nav-tab--active{
  background:var(--hino-soft)!important;color:var(--sm-text-primary)!important;border-color:transparent!important;
  box-shadow:inset 3px 0 0 var(--hino)!important;border-radius:0 9px 9px 0!important;
}
#sec-contabilidad .cont-nav-tab-icon{font-size:15px!important;}
#sec-contabilidad .cont-nav-tab-label{font-weight:600!important;white-space:normal!important;}

/* ---- Lienzo: el contenido del módulo se corre a la derecha del riel ---- */
#sec-contabilidad > #contabilidad-modulo-activo,
#sec-contabilidad > .dh-panel,
#sec-contabilidad > .gerencia-grid,
#sec-contabilidad > #contabilidad-financiamientos,
#sec-contabilidad > #contabilidad-operativo-grid{margin-left:246px!important;}

/* ---- Paneles del lienzo: tarjeta uniforme ---- */
#sec-contabilidad .dh-panel{background:var(--sm-bg-surface)!important;border:1px solid var(--c-line)!important;border-radius:14px!important;}
#sec-contabilidad .dh-panel-title{font-size:16px!important;font-weight:700!important;}

/* ---- Toolbar / inputs ---- */
#sec-contabilidad .gerencia-flow-input,
#sec-contabilidad .gerencia-flow-select{
  background:var(--sm-bg-sunken)!important;border:1px solid var(--c-line2)!important;border-radius:10px!important;
  color:var(--sm-text-primary)!important;font-size:14px!important;padding:10px 12px!important;font-family:inherit!important;
}

/* ---- Tablas: más aire, jerarquía y números monoespaciados ---- */
#sec-contabilidad .gerencia-flow-table-wrap{border:1px solid var(--c-line)!important;border-radius:14px!important;overflow:hidden!important;}
#sec-contabilidad .gerencia-flow-table thead th{
  background:var(--sm-bg-sunken)!important;color:var(--sm-text-muted)!important;font-size:11px!important;font-weight:800!important;
  letter-spacing:.09em!important;text-transform:uppercase!important;padding:12px 16px!important;border:none!important;
}
#sec-contabilidad .gerencia-flow-table tbody td{padding:14px 16px!important;font-size:14.5px!important;border-top:1px solid rgba(148,163,184,.1)!important;}
#sec-contabilidad .gerencia-flow-table tbody tr:hover{background:var(--hino-soft)!important;}
#sec-contabilidad .cont-cxc-saldo,
#sec-contabilidad .cont-fiscal-kpi-val,
#sec-contabilidad .cont-cxc-kpi-val{font-family:var(--c-mono)!important;}

/* ---- Responsive: el riel colapsa a fila arriba del lienzo ---- */
@media (max-width:900px){
  #sec-contabilidad #contabilidad-modulos-grid{float:none!important;width:auto!important;position:static!important;margin-bottom:14px!important;}
  #sec-contabilidad .cont-nav-tabs-row{flex-direction:row!important;flex-wrap:wrap!important;}
  #sec-contabilidad > #contabilidad-modulo-activo,
  #sec-contabilidad > .dh-panel,
  #sec-contabilidad > .gerencia-grid,
  #sec-contabilidad > #contabilidad-financiamientos,
  #sec-contabilidad > #contabilidad-operativo-grid{margin-left:0!important;}
}
