﻿/* FESv diseño v2 — capa negocio (frente B: páginas de negocio). Reglas acotadas a :root.fesv-v2:not(#_).
   Tokens en fesv-v2.css. Con v2 apagado nada de este archivo aplica. */

/* ── Estados semánticos (marcadores fesv-est-* añadidos en marcado; sin efecto en v1) ──
   ACEPTADO=éxito · CONTINGENCIA/PENDIENTE=aviso · RECHAZADO/ANULADO/INVALIDADO=error · borradores neutros */
:root.fesv-v2:not(#_) .badge.badge.fesv-est-aviso { background: var(--v2-warn-soft) !important; color: var(--v2-warn) !important; border-color: var(--v2-warn-bd) !important; }
:root.fesv-v2:not(#_) .badge.badge.fesv-est-error { background: var(--v2-err-soft) !important; color: var(--v2-err) !important; border-color: var(--v2-err-bd) !important; }
:root.fesv-v2:not(#_) .badge.badge.fesv-est-ok { background: var(--v2-ok-soft) !important; color: var(--v2-ok) !important; border-color: var(--v2-ok-bd) !important; }
:root.fesv-v2:not(#_) .card > .card-header.fesv-est-ok .badge.fesv-est-chip { background: var(--v2-ok-soft) !important; color: var(--v2-ok) !important; border-color: var(--v2-ok-bd) !important; }
:root.fesv-v2:not(#_) .card > .card-header.fesv-est-aviso .badge.fesv-est-chip { background: var(--v2-warn-soft) !important; color: var(--v2-warn) !important; border-color: var(--v2-warn-bd) !important; }
:root.fesv-v2:not(#_) .card > .card-header.fesv-est-error .badge.fesv-est-chip { background: var(--v2-err-soft) !important; color: var(--v2-err) !important; border-color: var(--v2-err-bd) !important; }
:root.fesv-v2:not(#_) .card > .card-header.fesv-est-neutro .badge.fesv-est-chip { background: var(--v2-sunk) !important; color: var(--v2-text-2) !important; border-color: var(--v2-border) !important; }
/* Borde lateral del encabezado acorde al estado */
:root.fesv-v2:not(#_) .card > .card-header.fesv-est-aviso { border-left-color: var(--v2-warn-solid) !important; }
:root.fesv-v2:not(#_) .card > .card-header.fesv-est-error { border-left-color: var(--v2-err-solid) !important; }

/* ── Montos tabulares ── */
:root.fesv-v2:not(#_) .app-content .text-end,
:root.fesv-v2:not(#_) .app-content td.text-end,
:root.fesv-v2:not(#_) .tabular { font-variant-numeric: tabular-nums; }

/* ── Clientes: botón Filtros alineado con la fila (no estirado a lo ancho de su columna) ── */
@media (min-width: 768px) {
    :root.fesv-v2:not(#_) .fesv-filtros .fesv-cli-filtros { width: auto !important; min-width: 108px; }
}

/* ── Inicio: actividad reciente sin desborde a 390px ── */
:root.fesv-v2:not(#_) .list-group-item .flex-grow-1 { min-width: 0; }
:root.fesv-v2:not(#_) .list-group-item .d-flex.justify-content-between > strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
:root.fesv-v2:not(#_) .list-group-item .d-flex.justify-content-between > span { flex-shrink: 0; margin-left: 8px; }
:root.fesv-v2:not(#_) .fesv-search-results .list-group-item.active { background-color: var(--v2-accent-soft); border-color: var(--v2-accent-soft-2); }

/* ── Dashboard de ventas (colores fijos del <style> de la página y del SVG generado) ── */
:root.fesv-v2:not(#_) .text-up { color: var(--v2-ok); }
:root.fesv-v2:not(#_) .text-dn { color: var(--v2-err); }
:root.fesv-v2:not(#_) .kpi-card { border-radius: var(--v2-r); }
:root.fesv-v2:not(#_) .bar-wrap { background: var(--v2-sunk); }
:root.fesv-v2:not(#_) .bar { background: var(--v2-accent); }
:root.fesv-v2:not(#_) .skel-card { background: var(--v2-surface-alt); }
:root.fesv-v2:not(#_) .skel { background: linear-gradient(90deg, var(--v2-sunk) 0%, var(--v2-surface-alt) 50%, var(--v2-sunk) 100%); background-size: 200% 100%; }
:root.fesv-v2:not(#_) .touch-data { border-top-color: var(--v2-border-subtle); }
:root.fesv-v2:not(#_) .touch-data-scroll thead th { background: var(--v2-surface); }
:root.fesv-v2:not(#_) svg text.trend-tip { fill: var(--v2-text-3); font-family: var(--v2-font); }
:root.fesv-v2:not(#_) svg polyline[stroke="#0d6efd"] { stroke: var(--v2-accent); }
:root.fesv-v2:not(#_) svg rect[fill="#0d6efd"], :root.fesv-v2:not(#_) svg circle[fill="#0d6efd"] { fill: var(--v2-accent); }
:root.fesv-v2:not(#_) svg rect[fill="#dee2e6"] { fill: var(--v2-sunk); }
:root.fesv-v2:not(#_) svg line[stroke="#eef2f7"], :root.fesv-v2:not(#_) svg line[stroke="#e9ecef"] { stroke: var(--v2-border-subtle); }
:root.fesv-v2:not(#_) svg circle[fill="#e9ecef"] { fill: var(--v2-sunk); }
:root.fesv-v2:not(#_) svg circle[fill="#fff"] { fill: var(--v2-surface); }
:root.fesv-v2:not(#_) svg text[fill="#6c757d"] { fill: var(--v2-text-3); }
:root.fesv-v2:not(#_) svg text[fill="#212529"] { fill: var(--v2-text); }

/* ── Línea de tiempo (DocumentoDetalle, CompraDetalle, ActivoFijoEditor) ── */
:root.fesv-v2:not(#_) .fesv-doc-timeline::before,
:root.fesv-v2:not(#_) .fesv-cmp-timeline::before,
:root.fesv-v2:not(#_) .timeline::before { background: var(--v2-border); }
:root.fesv-v2:not(#_) .fesv-doc-content,
:root.fesv-v2:not(#_) .fesv-cmp-content,
:root.fesv-v2:not(#_) .timeline-content { background: var(--v2-surface); border-color: var(--v2-border); border-radius: var(--v2-r-sm); }
:root.fesv-v2:not(#_) .fesv-doc-icon-info, :root.fesv-v2:not(#_) .fesv-cmp-icon-info,
:root.fesv-v2:not(#_) .timeline-icon.b-MEJORA { background: var(--v2-info-soft); color: var(--v2-info); box-shadow: inset 0 0 0 1px var(--v2-info-bd); }
:root.fesv-v2:not(#_) .fesv-doc-icon-warn, :root.fesv-v2:not(#_) .fesv-cmp-icon-warn,
:root.fesv-v2:not(#_) .timeline-icon.b-BAJA { background: var(--v2-warn-soft); color: var(--v2-warn); box-shadow: inset 0 0 0 1px var(--v2-warn-bd); }
:root.fesv-v2:not(#_) .fesv-doc-icon-error, :root.fesv-v2:not(#_) .fesv-cmp-icon-error { background: var(--v2-err-soft); color: var(--v2-err); box-shadow: inset 0 0 0 1px var(--v2-err-bd); }
:root.fesv-v2:not(#_) .timeline-icon.b-REVALUACION { background: var(--v2-violet-soft); color: var(--v2-violet); box-shadow: inset 0 0 0 1px var(--v2-violet-bd); }
:root.fesv-v2:not(#_) .timeline-icon.b-VENTA,
:root.fesv-v2:not(#_) .timeline-icon.b-OTRO { background: var(--v2-sunk); color: var(--v2-text-2); box-shadow: inset 0 0 0 1px var(--v2-border); }

/* ── Activo fijo: hero, KPIs y pestañas propias ── */
:root.fesv-v2:not(#_) .fesv-af-hero { background: var(--v2-surface) !important; }
:root.fesv-v2:not(#_) .fesv-af-icono { background: var(--v2-accent-soft); color: var(--v2-accent-text); border-radius: var(--v2-r); }
:root.fesv-v2:not(#_) .fesv-af-kpi { background: var(--v2-surface); border-color: var(--v2-border); border-radius: var(--v2-r); }
:root.fesv-v2:not(#_) .fesv-af-kpi small { color: var(--v2-text-3); font-size: var(--v2-fs-micro); font-weight: 600; }
:root.fesv-v2:not(#_) .fesv-af-kpi .num { font-variant-numeric: tabular-nums; color: var(--v2-text); }
:root.fesv-v2:not(#_) .fesv-af-tabs .nav-link.active { border-bottom: 0; color: var(--v2-text); }

/* ── Cotización: fila de total y overlay de guardado ── */
:root.fesv-v2:not(#_) .fesv-cot-total td { background: var(--v2-surface-alt) !important; color: var(--v2-text) !important; }
:root.fesv-v2:not(#_) .fesv-cot-total .text-success { color: var(--v2-ok) !important; }
:root.fesv-v2:not(#_) .fesv-loading-box { background: var(--v2-surface); color: var(--v2-text); border: 1px solid var(--v2-border); box-shadow: var(--v2-shadow-3); }
:root.fesv-v2:not(#_) .fesv-loading-title { color: var(--v2-text); }
:root.fesv-v2:not(#_) .fesv-loading-sub { color: var(--v2-text-2); }

/* ── Compras: tabla con scroll propio ── */
:root.fesv-v2:not(#_) .fesv-compras-scroll { background: var(--v2-surface) !important; }
:root.fesv-v2:not(#_) .fesv-compras-table > thead th { background: var(--v2-surface-alt); }
:root.fesv-v2:not(#_) .fesv-compras-scroll::-webkit-scrollbar-thumb { background: var(--v2-scroll); }
:root.fesv-v2:not(#_) .fesv-compras-scroll::-webkit-scrollbar-thumb:hover { background: var(--v2-scroll-hover); }
:root.fesv-v2:not(#_) .fesv-compras-scroll::-webkit-scrollbar-track { background: var(--v2-surface-alt); }

/* ── Inventario: thead con fondo inline ── */
:root.fesv-v2:not(#_) thead.table-light.sticky-top[style] { background: var(--v2-surface-alt) !important; }

/* ── Filas/pies de totales table-dark (Documentos, CxC, CxP pago) → total neutro ── */
:root.fesv-v2:not(#_) .app-content tfoot.table-dark > tr > *,
:root.fesv-v2:not(#_) .app-content tr.table-dark > * {
    --bs-table-bg: var(--v2-surface-alt); --bs-table-color: var(--v2-text);
    background: var(--v2-surface-alt) !important; color: var(--v2-text) !important;
    border-top: 1px solid var(--v2-border-strong); font-weight: 600; font-variant-numeric: tabular-nums;
}

/* ── Visor JSON del DTE (fondo oscuro inline): tokens en ambos modos ── */
:root.fesv-v2:not(#_) textarea[style*="#1e1e1e"] { background: var(--v2-ink) !important; color: var(--v2-ink-text) !important; border-radius: var(--v2-r-sm); }

/* ── Móvil: barras de acciones al pie del detalle fijas ── */
@media (max-width: 767.98px) {
    :root.fesv-v2:not(#_) .app-content .card > .card-footer.d-flex {
        position: sticky; bottom: 0; z-index: 5;
        background: var(--v2-surface); border-top: 1px solid var(--v2-border);
        flex-wrap: wrap; gap: 6px; box-shadow: 0 -4px 12px rgba(16, 24, 40, .06);
    }
}

/* Clientes: "Solo activos" y "Filtros" ocupan su contenido y quedan pegados a la búsqueda; XLSX al extremo */
@media (min-width: 768px) {
    :root.fesv-v2:not(#_) .fesv-filtros .row > .col-md-2:has(#chkClientesActivos),
    :root.fesv-v2:not(#_) .fesv-filtros .row > .col-md-2:has(> .fesv-cli-filtros) { flex: 0 0 auto; width: auto; }
    :root.fesv-v2:not(#_) .fesv-filtros .row:has(.fesv-cli-filtros) > .col-md-3.text-end { flex: 1 1 0; width: auto; }
}

/* ── El código contable: entero, en una línea, y la columna del ancho justo ──────────────────

   El plan de COMER usa siete niveles y sus códigos miden SIEMPRE 18 caracteres
   («1-1-01-01-01-01-00»). Las columnas llevaban un ancho a mano —130px en el balance general—
   que no daba, así que el código se partía en dos renglones y la tabla quedaba ilegible: un
   código contable partido deja de ser un código, hay que recomponerlo con la vista.

   `width:1%` + `white-space:nowrap` es la respuesta que no hay que volver a ajustar: el navegador
   le da a la columna exactamente el ancho de su contenido y reparte el resto. Sirve igual para
   los 18 caracteres de una cuenta y los 8 de un centro de costo, y para el plan de la próxima
   empresa, que va a tener otra codificación.

   `tabular-nums` alinea los dígitos entre filas, así que las columnas del código se leen
   verticalmente como en Softland. */
:root.fesv-v2:not(#_) .cod-cuenta,
:root.fesv-v2:not(#_) td.col-cod,
:root.fesv-v2:not(#_) th.col-cod {
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

:root.fesv-v2:not(#_) td.col-cod,
:root.fesv-v2:not(#_) th.col-cod {
    /* El 1% es deliberado: le pide al navegador el mínimo, y con nowrap el mínimo es el texto
       completo. Un ancho fijo en px vuelve a partir el código en cuanto cambie la codificación. */
    width: 1%;
}

:root.fesv-v2:not(#_) .cod-cuenta {
    font-family: var(--v2-mono, var(--bs-font-monospace));
    font-size: var(--v2-fs-caption, .75rem);
}

/* La sangría por nivel. Se mide en caracteres del propio código (`ch`) y no en píxeles, para que
   acompañe al tamaño de letra del tema.

   Va en `margin` y no en `padding` por un motivo concreto: el tema ya trae
   `.card .table code { padding: 0 }` y `.app-content .table code { padding: 0 }`, que con el
   selector de elemento al final ganan en especificidad y dejaban la sangría en cero —medido en
   el navegador: `padding-left` computado 0px y los siete niveles arrancando en la misma x—.
   Subir la especificidad para ganar esa pelea es empezar una carrera que el próximo cambio
   vuelve a perder; el margen no es lo que esas reglas controlan. */
:root.fesv-v2:not(#_) .cod-cuenta[data-nivel="2"] { margin-left: 1.25ch; }
:root.fesv-v2:not(#_) .cod-cuenta[data-nivel="3"] { margin-left: 2.5ch; }
:root.fesv-v2:not(#_) .cod-cuenta[data-nivel="4"] { margin-left: 3.75ch; }
:root.fesv-v2:not(#_) .cod-cuenta[data-nivel="5"] { margin-left: 5ch; }
:root.fesv-v2:not(#_) .cod-cuenta[data-nivel="6"] { margin-left: 6.25ch; }
:root.fesv-v2:not(#_) .cod-cuenta[data-nivel="7"] { margin-left: 7.5ch; }

/* ── Las filas de un reporte de cuentas: jerarquía legible con DOS señales ───────────────────

   Un balance con siete niveles no se lee si todas las filas pesan igual. Pero tampoco se lee si
   cada nivel trae color, borde, fondo y tamaño propio: eso es ruido disfrazado de información.

   El criterio es dos señales, cada una diciendo algo distinto:

     · la SANGRÍA del código dice la profundidad (la pone `.cod-cuenta[data-nivel]`);
     · el PESO dice la jerarquía, y es ESCALONADO —nivel 1 más fuerte que nivel 4— para que el
       nivel se lea de un vistazo en vez de contar guiones.

   El fondo tenue queda reservado para las filas que llevan SUBTOTAL, y es deliberado: ese número
   es una suma de las filas de abajo, no el saldo de una cuenta, y leerlo como si fuera un saldo
   más es el error que hace que un balance parezca que no cuadra.

   Las hojas no llevan nada: son la mayoría de las filas y recargarlas apaga las que sí importan. */
:root.fesv-v2:not(#_) tr.fila-grupo > td {
    background: var(--v2-sunk);
    font-weight: 600;
}

/* El escalón. Nivel 1 y 2 son las secciones grandes —ACTIVO, ACTIVO CORRIENTE—, y de ahí baja. */
:root.fesv-v2:not(#_) tr.fila-grupo[data-nivel="1"] > td { font-weight: 700; }
:root.fesv-v2:not(#_) tr.fila-grupo[data-nivel="2"] > td { font-weight: 700; }
:root.fesv-v2:not(#_) tr.fila-grupo[data-nivel="3"] > td { font-weight: 600; }
:root.fesv-v2:not(#_) tr.fila-grupo[data-nivel="4"] > td,
:root.fesv-v2:not(#_) tr.fila-grupo[data-nivel="5"] > td,
:root.fesv-v2:not(#_) tr.fila-grupo[data-nivel="6"] > td,
:root.fesv-v2:not(#_) tr.fila-grupo[data-nivel="7"] > td { font-weight: 500; }

/* Una línea arriba de los dos primeros niveles: separa bloques sin agregar otro color. */
:root.fesv-v2:not(#_) tr.fila-grupo[data-nivel="1"] > td,
:root.fesv-v2:not(#_) tr.fila-grupo[data-nivel="2"] > td {
    border-top: 1px solid var(--v2-border);
}
