/* ============================================================
   ERP — estilos compartidos por todas las páginas del módulo.
   Usa SIEMPRE var(--jd-*); compatible Dark + Light vía theme-bridge.
   ============================================================ */

/* acentos del ERP, todo sale de JD Crimson pa no meter azules ni morados sueltos.
   los numeros solo van en blanco o en el rojo claro; el color fuerte queda pa las etiquetas */
:root {
    --erp-accent:        var(--jd-crimson);
    --erp-accent-strong: var(--jd-crimson-dark);
    --erp-num-neg:       #EF5350;
}

/* ------- Grid de submódulos (CFG-00 / home.php) -------------- */
.erp-mod-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 1rem;
}

.erp-mod-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: .65rem;
    padding: 1.25rem 1.1rem 1.15rem;
    border-radius: var(--jd-radius-lg);
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    color: var(--jd-text-primary);
    text-decoration: none;
    transition: var(--jd-transition);
    min-height: 130px;
    position: relative;
    overflow: hidden;
}
.erp-mod-card:hover {
    background: var(--jd-bg-card-hover);
    border-color: var(--jd-crimson);
    transform: translateY(-2px);
    box-shadow: var(--jd-shadow-md);
    color: var(--jd-text-primary);
    text-decoration: none;
}
.erp-mod-card .erp-mod-icon {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--jd-radius-md);
    background: rgba(255, 77, 109, 0.12);
    color: var(--jd-crimson);
    font-size: 1.25rem;
    transition: var(--jd-transition);
}
.erp-mod-card:hover .erp-mod-icon {
    background: var(--jd-crimson);
    color: #fff;
}
.erp-mod-card .erp-mod-title {
    font-size: .98rem;
    font-weight: 700;
    line-height: 1.2;
    margin: 0;
    color: var(--jd-text-primary);
}
.erp-mod-card .erp-mod-sub {
    font-size: .73rem;
    color: var(--jd-text-muted);
    line-height: 1.35;
    margin: 0;
}
.erp-mod-card .erp-mod-code {
    position: absolute;
    top: 10px;
    right: 12px;
    font-size: .65rem;
    font-family: monospace;
    color: var(--jd-text-muted);
    opacity: .65;
}
/* Badge de alerta de stock mínimo sobre una card del Home de Inventario */
.erp-mod-alert-badge {
    position: absolute;
    bottom: 10px;
    right: 10px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--bs-danger);
    color: #fff;
    font-size: .68rem;
    font-weight: 700;
    padding: 3px 8px;
    border-radius: var(--jd-radius-pill);
    box-shadow: 0 2px 8px rgba(220, 53, 69, .35);
    animation: jd-pulse 2.5s ease-in-out infinite;
}
.erp-mod-alert-badge i { font-size: .8rem; }

/* ------- Hero superior común --------------------------------- */
.erp-page-back {
    color: var(--jd-text-secondary);
    text-decoration: none;
    font-size: .85rem;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-bottom: .35rem;
    transition: color .2s ease;
}
.erp-page-back:hover { color: var(--jd-crimson); text-decoration: none; }

/* ------- Indicadores de estado (dots) sin border-left -------- */
.erp-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 4px;
    vertical-align: middle;
}
.erp-dot-success { background: #28a745; }
.erp-dot-warning { background: #f59e0b; }
.erp-dot-danger  { background: #dc3545; }
.erp-dot-info    { background: var(--erp-accent); }
.erp-dot-muted   { background: var(--jd-text-muted); }

/* ------- Filas inactivas (uniforme en dark y light) ---------- */
tr.erp-row-inactive { opacity: .55; }

/* ------- Acciones de fila (botones icon-only) ---------------- */
.erp-row-actions { display: inline-flex; gap: 4px; }
.erp-row-actions button {
    background: none;
    border: none;
    color: var(--jd-text-secondary);
    padding: .3rem .45rem;
    cursor: pointer;
    border-radius: var(--jd-radius-sm);
    transition: var(--jd-transition);
}
.erp-row-actions button:hover {
    background: var(--jd-bg-card-hover);
    color: var(--jd-text-primary);
}
.erp-row-actions .btn-danger-soft:hover {
    background: rgba(220,53,69,.15);
    color: #f06672;
}

/* ------- Empty state ----------------------------------------- */
.erp-empty {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--jd-text-muted);
}
.erp-empty i {
    font-size: 2.5rem;
    color: var(--jd-text-disabled);
    margin-bottom: .5rem;
    display: block;
}

/* ------- Badges de tipo (Condiciones de Pago, TMV) ----------- */
.erp-badge-contado { background: rgba(40,167,69,.18); color: #5eead4; border: 1px solid rgba(40,167,69,.4); }
.erp-badge-credito { background: rgba(255,193,7,.18); color: #ffd368; border: 1px solid rgba(255,193,7,.4); }
.erp-badge-ing     { background: rgba(40,167,69,.18); color: #5eead4; border: 1px solid rgba(40,167,69,.4); }
.erp-badge-sal     { background: rgba(220,53,69,.18); color: #fca5a5; border: 1px solid rgba(220,53,69,.4); }
body.jd-light-theme .erp-badge-contado { color: #198754; }
body.jd-light-theme .erp-badge-credito { color: #b45309; }
body.jd-light-theme .erp-badge-ing     { color: #198754; }
body.jd-light-theme .erp-badge-sal     { color: #b91c1c; }

.erp-badge {
    display: inline-block;
    padding: .15rem .55rem;
    border-radius: var(--jd-radius-pill);
    font-size: .7rem;
    font-weight: 700;
    line-height: 1.4;
}

/* ------- Toast simple para feedback (clonado de admin_bancos) -- */
.erp-toast {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 1080;
    padding: 10px 16px;
    border-radius: var(--jd-radius-md);
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    color: var(--jd-text-primary);
    font-size: .85rem;
    box-shadow: var(--jd-shadow-lg);
    display: flex;
    align-items: center;
    gap: 8px;
    animation: erp-toast-in .18s ease-out;
}
.erp-toast.ok    { border-color: #198754; color: #5eead4; }
.erp-toast.error { border-color: #dc3545; color: #fca5a5; }
body.jd-light-theme .erp-toast.ok    { color: #198754; }
body.jd-light-theme .erp-toast.error { color: #b91c1c; }
@keyframes erp-toast-in { from{opacity:0;transform:translateY(6px)} to{opacity:1;transform:translateY(0)} }

/* ------- Help text bajo campos del modal --------------------- */
.erp-help {
    font-size: .72rem;
    color: var(--jd-text-muted);
    margin-top: .25rem;
}

/* ------- Sección "info-box" / "warn-box" suave en modales ---- */
.erp-info-box {
    background: rgba(255, 77, 109,.1);
    border: 1px solid rgba(255, 77, 109,.35);
    color: var(--erp-accent);
    border-radius: var(--jd-radius-sm);
    padding: .55rem .75rem;
    font-size: .8rem;
}
body.jd-light-theme .erp-info-box { color: var(--erp-accent); }

.erp-warn-box {
    background: rgba(245,158,11,.1);
    border: 1px solid rgba(245,158,11,.35);
    color: #ffd368;
    border-radius: var(--jd-radius-sm);
    padding: .55rem .75rem;
    font-size: .8rem;
}
body.jd-light-theme .erp-warn-box { color: #b45309; }

/* ============================================================
   Patrón Maestro (master-detail / split panel) — CFG-01..08
   Lista a la izquierda + formulario de detalle a la derecha.
   ============================================================ */

.erp-master {
    display: grid;
    grid-template-columns: 320px minmax(0, 1fr);
    min-height: 540px;
    border-radius: var(--jd-radius-lg);
    overflow: hidden;
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
}

.erp-master-list {
    border-right: 1px solid var(--jd-border-color);
    display: flex;
    flex-direction: column;
    min-height: 0;
    background: var(--jd-bg-body);
}

.erp-master-toolbar {
    padding: .75rem;
    display: flex;
    flex-direction: column;
    gap: .5rem;
    border-bottom: 1px solid var(--jd-border-color);
    background: var(--jd-bg-card);
}
.erp-master-toolbar .input-group { width: 100%; }
.erp-master-toolbar .btn { width: 100%; }

.erp-master-items {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
    max-height: 70vh;
}
.erp-master-items::-webkit-scrollbar { width: 6px; }
.erp-master-items::-webkit-scrollbar-track { background: transparent; }
.erp-master-items::-webkit-scrollbar-thumb { background: var(--jd-border-color); border-radius: 3px; }

.erp-master-item {
    padding: .65rem .9rem;
    cursor: pointer;
    border-bottom: 1px solid var(--jd-border-color);
    transition: var(--jd-transition);
    display: flex;
    align-items: center;
    gap: .55rem;
    color: var(--jd-text-primary);
}
.erp-master-item:hover {
    background: var(--jd-bg-card-hover);
}
.erp-master-item.active {
    background: var(--jd-bg-card-hover);
}
.erp-master-item.inactive {
    opacity: .55;
}
.erp-master-item-info { flex: 1; min-width: 0; }
.erp-master-item-title {
    font-weight: 600;
    font-size: .88rem;
    color: var(--jd-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.erp-master-item-sub {
    font-size: .72rem;
    color: var(--jd-text-muted);
    font-family: monospace;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.erp-master-item-tag {
    font-size: .65rem;
    padding: .1rem .4rem;
    border-radius: var(--jd-radius-pill);
    background: var(--jd-bg-card);
    color: var(--jd-text-muted);
    border: 1px solid var(--jd-border-color);
    flex-shrink: 0;
}
.btn-edit-tabla {
    background: transparent;
    border: 1px solid transparent;
    color: var(--jd-text-muted);
    border-radius: var(--jd-radius-sm);
    padding: .15rem .35rem;
    font-size: .85rem;
    cursor: pointer;
    transition: var(--jd-transition);
    flex-shrink: 0;
    line-height: 1;
}
.btn-edit-tabla:hover {
    color: var(--jd-crimson);
    background: var(--jd-bg-card-hover);
    border-color: var(--jd-border-color);
}

/* Toggle mini (usado dentro de items de lista master para activar/desactivar) */
.erp-toggle-mini {
    position: relative;
    display: inline-block;
    width: 28px;
    height: 16px;
    cursor: pointer;
    flex-shrink: 0;
    margin: 0;
}
.erp-toggle-mini input { opacity: 0; width: 0; height: 0; }
.erp-toggle-mini span {
    position: absolute; inset: 0;
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    border-radius: 12px;
    transition: var(--jd-transition);
}
.erp-toggle-mini span::before {
    content: '';
    position: absolute;
    width: 10px; height: 10px;
    top: 2px; left: 2px;
    background: var(--jd-text-muted);
    border-radius: 50%;
    transition: var(--jd-transition);
}
.erp-toggle-mini input:checked + span {
    background: rgba(40,167,69,.25);
    border-color: rgba(40,167,69,.5);
}
.erp-toggle-mini input:checked + span::before {
    transform: translateX(12px);
    background: #5eead4;
}

/* Catálogos especiales en CFG-13: cards de acceso rápido a maestros con estructura propia */
.erp-special-catalogs {
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-lg);
    padding: 1rem 1.25rem;
}
.erp-special-title {
    font-size: .8rem;
    font-weight: 600;
    color: var(--jd-text-secondary);
    text-transform: uppercase;
    letter-spacing: .04em;
    margin-bottom: .75rem;
}
.erp-special-title i { color: var(--jd-crimson); margin-right: .35rem; }
.erp-special-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: .75rem;
}
.erp-special-card {
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .7rem .85rem;
    background: var(--jd-bg-card-hover);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    color: var(--jd-text-primary);
    text-decoration: none;
    transition: var(--jd-transition);
    position: relative;
}
.erp-special-card:hover {
    border-color: var(--jd-crimson);
    box-shadow: var(--jd-shadow-sm);
    color: var(--jd-text-primary);
    transform: translateY(-1px);
}
.erp-special-code {
    position: absolute;
    top: -6px; left: 8px;
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    border-radius: 6px;
    font-size: .55rem;
    font-weight: 700;
    color: var(--jd-text-muted);
    padding: 1px 5px;
    font-family: monospace;
    letter-spacing: .03em;
}
.erp-special-icon {
    font-size: 1.4rem;
    color: var(--jd-crimson);
    flex-shrink: 0;
}
.erp-special-name {
    font-weight: 600;
    font-size: .9rem;
}
.erp-special-card small {
    font-size: .7rem;
    color: var(--jd-text-muted);
}

/* Tabs JD Crimson (usadas en modal CFG-13c y otras pantallas con tabs) */
.erp-tabs {
    border-bottom: 1px solid var(--jd-border-color);
    flex-wrap: wrap;
    gap: .15rem;
}
.erp-tabs .nav-link {
    color: var(--jd-text-muted);
    background: transparent;
    border: 1px solid transparent;
    border-bottom: none;
    border-radius: var(--jd-radius-sm) var(--jd-radius-sm) 0 0;
    padding: .45rem .9rem;
    font-size: .82rem;
    font-weight: 500;
    transition: var(--jd-transition);
}
.erp-tabs .nav-link:hover {
    color: var(--jd-text-primary);
    background: var(--jd-bg-card-hover);
}
.erp-tabs .nav-link.active {
    color: var(--jd-crimson);
    background: var(--jd-bg-card);
    border-color: var(--jd-border-color);
    border-bottom: 1px solid var(--jd-bg-card);
    margin-bottom: -1px;
}
.erp-tabs .nav-link:disabled,
.erp-tabs .nav-link[disabled] {
    opacity: .35;
    cursor: not-allowed;
    pointer-events: none;
}
.erp-master-empty {
    padding: 2rem 1rem;
    text-align: center;
    color: var(--jd-text-muted);
    font-size: .8rem;
}

/* avisa cuando la lista no trae el catalogo entero. el recorte en silencio es lo q hacia desaparecer productos del maestro */
.erp-master-aviso {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    padding: .55rem .7rem;
    margin: 0 .5rem .5rem;
    border-radius: var(--jd-radius-md);
    background: rgba(255, 167, 38, .12);
    border: 1px solid rgba(255, 167, 38, .35);
    font-size: .76rem;
    line-height: 1.35;
    color: var(--jd-text-secondary);
}
.erp-master-aviso i { color: #FFA726; flex: 0 0 auto; margin-top: .1rem; }
body.jd-light-theme .erp-master-aviso i { color: color-mix(in srgb, #FFA726 52%, #000); }

.erp-master-detail {
    padding: 1.5rem;
    overflow-y: auto;
    background: var(--jd-bg-card);
    min-height: 0;
}
.erp-master-detail-empty {
    text-align: center;
    padding: 4rem 2rem;
    color: var(--jd-text-muted);
}
.erp-master-detail-empty i {
    font-size: 3rem;
    color: var(--jd-text-disabled);
    margin-bottom: 1rem;
    display: block;
}
.erp-master-detail-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--jd-border-color);
}
.erp-master-detail-title {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--jd-text-primary);
    margin: 0;
    display: flex;
    align-items: center;
    gap: .5rem;
}
.erp-master-actions {
    display: flex;
    gap: .5rem;
    justify-content: flex-end;
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 1px solid var(--jd-border-color);
}

/* Responsive: en pantallas chicas el split se apila */
@media (max-width: 900px) {
    .erp-master {
        grid-template-columns: 1fr;
    }
    .erp-master-list {
        border-right: none;
        border-bottom: 1px solid var(--jd-border-color);
    }
    .erp-master-items {
        max-height: 35vh;
    }
}

/* ------- Inputs readonly se ven distintos del editable ------- */
.erp-input-readonly {
    background: var(--jd-bg-body) !important;
    color: var(--jd-text-muted) !important;
    cursor: not-allowed;
}

/* ------- Campos condicionales ocultos (CFG-05b) -------------- */
.erp-campo-hidden {
    display: none !important;
}

/* ==================================================================
   INV-01g — Alerta visual de stock bajo el mínimo (Maestro de Productos)
   ================================================================== */

/* Badge global "N productos con stock bajo" arriba del listado */
.erp-stock-alert-banner {
    background: color-mix(in srgb, var(--bs-danger) 12%, var(--jd-bg-card));
    border: 1px solid color-mix(in srgb, var(--bs-danger) 35%, transparent);
    color: var(--jd-text-primary);
    border-radius: var(--jd-radius-md);
    padding: .55rem .85rem;
    font-size: .78rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: .5rem;
    margin: .5rem .75rem;
}
.erp-stock-alert-banner i { color: var(--bs-danger); }

/* Item de la lista con alerta */
.erp-master-item.item-alert {
    background: color-mix(in srgb, var(--bs-danger) 8%, var(--jd-bg-card));
}
.erp-master-item.item-alert:hover {
    background: color-mix(in srgb, var(--bs-danger) 14%, var(--jd-bg-card));
}
.erp-master-item.item-alert.active {
    background: color-mix(in srgb, var(--bs-danger) 18%, var(--jd-bg-card-hover));
}
.erp-master-item .item-alert-text {
    font-size: .68rem;
    font-weight: 700;
    color: var(--bs-danger);
    margin-top: 2px;
    letter-spacing: .02em;
}

/* Banner detallado en el panel derecho cuando hay alerta */
.erp-alert-banner-detail {
    background: color-mix(in srgb, var(--bs-danger) 14%, var(--jd-bg-card));
    border: 1px solid color-mix(in srgb, var(--bs-danger) 40%, transparent);
    border-radius: var(--jd-radius-md);
    padding: .85rem 1rem;
    color: var(--jd-text-primary);
    display: flex;
    flex-direction: column;
    gap: .35rem;
    margin-bottom: 1rem;
}
.erp-alert-banner-detail .titulo {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-weight: 700;
    color: var(--bs-danger);
    font-size: .92rem;
}
.erp-alert-banner-detail .titulo i { font-size: 1.1rem; }
.erp-alert-banner-detail .stats {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    font-size: .8rem;
    color: var(--jd-text-secondary);
}
.erp-alert-banner-detail .stats strong { color: var(--jd-text-primary); margin-left: .25rem; }
.erp-alert-banner-detail .sugerencia {
    font-size: .78rem;
    color: var(--jd-text-muted);
    display: flex;
    align-items: flex-start;
    gap: .35rem;
}
.erp-alert-banner-detail .sugerencia i { color: var(--bs-warning); margin-top: 1px; }

/* ==================================================================
   INV-01i/01j — Modal-lupa para seleccionar Línea/SubLínea/Unidad
   ================================================================== */
.erp-modal-list {
    max-height: 50vh;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-right: 4px;
}
.erp-modal-list::-webkit-scrollbar { width: 6px; }
.erp-modal-list::-webkit-scrollbar-track { background: transparent; }
.erp-modal-list::-webkit-scrollbar-thumb { background: var(--jd-border-color); border-radius: 3px; }

.erp-modal-item {
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .55rem .75rem;
    background: var(--jd-bg-card-hover);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-sm);
    color: var(--jd-text-primary);
    text-align: left;
    cursor: pointer;
    transition: var(--jd-transition);
    width: 100%;
}
.erp-modal-item:hover {
    border-color: var(--jd-crimson);
    background: var(--jd-bg-card);
    color: var(--jd-text-primary);
}
.erp-modal-item-code {
    font-family: monospace;
    font-weight: 700;
    background: var(--jd-bg-card);
    color: var(--jd-crimson);
    padding: 3px 9px;
    border-radius: 4px;
    font-size: .78rem;
    min-width: 56px;
    text-align: center;
    flex-shrink: 0;
}
.erp-modal-item-name {
    flex: 1;
    font-size: .88rem;
}
.erp-modal-item-sub {
    font-size: .72rem;
    color: var(--jd-text-muted);
    font-family: monospace;
}
.erp-modal-empty {
    text-align: center;
    padding: 2rem 1rem;
    color: var(--jd-text-muted);
    font-size: .85rem;
}

/* ==================================================================
   INV-01f-igv — Indicador IGV en vivo sobre el campo Valor S/.
   ================================================================== */
.input-group-igv .form-control {
    border-color: var(--bs-success);
    box-shadow: 0 0 0 .12rem rgba(25, 135, 84, .12);
}
.input-group-igv .badge-igv {
    background: var(--bs-success);
    color: #fff;
    font-weight: 700;
    font-size: .7rem;
}
.erp-igv-calc-text {
    color: var(--bs-success);
    font-size: .72rem;
    margin-top: 2px;
    font-weight: 600;
}

/* ==================================================================
   INV-01k — Cards de pack (componentes del combo)
   ================================================================== */
.erp-pack-card {
    background: var(--jd-bg-card-hover);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    padding: .65rem .85rem;
    display: flex;
    align-items: center;
    gap: .75rem;
    transition: var(--jd-transition);
}
.erp-pack-card:hover { border-color: var(--jd-crimson); }
.erp-pack-card-info { flex: 1; min-width: 0; }
.erp-pack-card-title {
    font-weight: 600;
    color: var(--jd-text-primary);
    font-size: .9rem;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.erp-pack-card-code {
    font-family: monospace;
    font-size: .7rem;
    color: var(--jd-text-muted);
    background: var(--jd-bg-card);
    padding: 2px 6px;
    border-radius: 4px;
    margin-right: .5rem;
}
.erp-pack-card-qty {
    font-weight: 700;
    color: var(--jd-crimson);
    background: color-mix(in srgb, var(--jd-crimson) 12%, var(--jd-bg-card));
    padding: .25rem .65rem;
    border-radius: var(--jd-radius-pill);
    font-size: .8rem;
    white-space: nowrap;
}

/* ==================================================================
   INV-01 — Tab Imágenes / Fichas con S3
   ================================================================== */
.erp-img-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: .75rem;
}
.erp-img-thumb {
    position: relative;
    aspect-ratio: 1;
    border-radius: var(--jd-radius-md);
    overflow: hidden;
    background: var(--jd-bg-card-hover);
    border: 1px solid var(--jd-border-color);
    transition: var(--jd-transition);
}
.erp-img-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.erp-img-thumb:hover { border-color: var(--jd-crimson); }
.erp-img-thumb .btn-del-thumb {
    position: absolute;
    top: 6px;
    right: 6px;
    background: rgba(0, 0, 0, .65);
    color: #fff;
    border: 0;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: var(--jd-transition);
}
.erp-img-thumb:hover .btn-del-thumb { opacity: 1; }
.erp-img-thumb .btn-del-thumb:hover { background: var(--bs-danger); }

.erp-ficha-row {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .65rem .85rem;
    background: var(--jd-bg-card-hover);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    color: var(--jd-text-primary);
    text-decoration: none;
    transition: var(--jd-transition);
}
.erp-ficha-row:hover { border-color: var(--jd-crimson); color: var(--jd-text-primary); }
.erp-ficha-row .icon { color: var(--bs-danger); font-size: 1.4rem; flex-shrink: 0; }
.erp-ficha-row .name { flex: 1; font-size: .88rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.erp-uploader {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
    padding: .65rem .85rem;
    background: color-mix(in srgb, var(--jd-crimson) 6%, var(--jd-bg-card));
    border: 1px dashed color-mix(in srgb, var(--jd-crimson) 35%, transparent);
    border-radius: var(--jd-radius-md);
    margin-bottom: 1rem;
}
.erp-uploader-progress {
    flex: 1;
    height: 4px;
    background: var(--jd-bg-card);
    border-radius: 2px;
    overflow: hidden;
    display: none;
}
.erp-uploader-progress .bar {
    height: 100%;
    background: var(--jd-crimson);
    width: 0%;
    transition: width .2s ease;
}

/* ==================================================================
   INV-01c — Drop-zone + imagen principal (Tab Imágenes)
   ================================================================== */
.erp-dropzone {
    border: 2px dashed var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    padding: 2rem 1rem;
    text-align: center;
    color: var(--jd-text-muted);
    background: color-mix(in srgb, var(--jd-crimson) 4%, var(--jd-bg-card));
    cursor: pointer;
    transition: var(--jd-transition);
    margin-bottom: 1rem;
}
.erp-dropzone:hover { border-color: var(--jd-crimson); }
.erp-dropzone.dragover {
    border-color: var(--jd-crimson);
    background: color-mix(in srgb, var(--jd-crimson) 12%, var(--jd-bg-card));
    color: var(--jd-text-primary);
}
.erp-dropzone i.dz-icon {
    font-size: 2.4rem;
    color: var(--jd-crimson);
    display: block;
    margin-bottom: .35rem;
}
.erp-dropzone .dz-title { font-weight: 600; color: var(--jd-text-primary); font-size: .92rem; }
.erp-dropzone .dz-sub   { font-size: .72rem; margin-top: .2rem; }

/* Card "Agregar +" como última celda del grid de imágenes */
.erp-img-thumb.add-more {
    border: 2px dashed var(--jd-border-color);
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    color: var(--jd-text-muted);
    cursor: pointer;
    transition: var(--jd-transition);
}
.erp-img-thumb.add-more:hover {
    border-color: var(--jd-crimson);
    color: var(--jd-crimson);
}
.erp-img-thumb.add-more i { font-size: 1.6rem; }
.erp-img-thumb.add-more span { font-size: .72rem; margin-top: .25rem; }

/* Imagen principal */
.erp-img-thumb.es-principal {
    border: 2px solid var(--jd-crimson);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--jd-crimson) 25%, transparent);
}
.erp-img-badge-principal {
    position: absolute;
    bottom: 6px;
    left: 6px;
    background: var(--jd-crimson);
    color: #fff;
    font-size: .58rem;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: var(--jd-radius-pill);
    text-transform: uppercase;
    letter-spacing: .04em;
}

/* Botón estrella (marcar como principal) */
.btn-star-thumb {
    position: absolute;
    top: 6px;
    left: 6px;
    background: rgba(0, 0, 0, .65);
    color: #fff;
    border: 0;
    width: 26px; height: 26px;
    border-radius: 50%;
    cursor: pointer;
    opacity: 0;
    transition: var(--jd-transition);
    display: flex;
    align-items: center;
    justify-content: center;
}
.erp-img-thumb:hover .btn-star-thumb { opacity: 1; }
.btn-star-thumb:hover { background: var(--bs-warning); color: #000; }
.erp-img-thumb.es-principal .btn-star-thumb { opacity: 1; background: var(--bs-warning); color: #000; }

/* ==================================================================
   INV-01d — Fila de ficha con metadatos
   ================================================================== */
.erp-ficha-row .body { flex: 1; min-width: 0; }
.erp-ficha-row .body .name {
    font-weight: 600;
    font-size: .9rem;
    color: var(--jd-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.erp-ficha-row .meta {
    font-size: .68rem;
    color: var(--jd-text-muted);
    margin-top: 1px;
}
.erp-ficha-row .meta .sep { margin: 0 .35rem; opacity: .5; }
.erp-ficha-row.tipo-pdf  .icon { color: var(--bs-danger); }
.erp-ficha-row.tipo-xls  .icon { color: var(--bs-success); }
.erp-ficha-row.tipo-doc  .icon { color: var(--bs-primary); }

/* ==================================================================
   INV-01e — Tabla inline editable de características
   ================================================================== */
.erp-carac-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 4px;
}
.erp-carac-table thead th {
    background: var(--jd-crimson);
    color: #fff;
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-weight: 700;
    padding: .5rem .75rem;
    text-align: left;
}
.erp-carac-table thead th:first-child { border-radius: var(--jd-radius-sm) 0 0 var(--jd-radius-sm); }
.erp-carac-table thead th:last-child  { border-radius: 0 var(--jd-radius-sm) var(--jd-radius-sm) 0; width: 50px; }

.erp-carac-table tbody td {
    background: var(--jd-bg-card-hover);
    padding: 4px 8px;
    border-top: 1px solid var(--jd-border-color);
    border-bottom: 1px solid var(--jd-border-color);
}
.erp-carac-table tbody td:first-child {
    border-left: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-sm) 0 0 var(--jd-radius-sm);
}
.erp-carac-table tbody td:last-child {
    border-right: 1px solid var(--jd-border-color);
    border-radius: 0 var(--jd-radius-sm) var(--jd-radius-sm) 0;
    text-align: right;
    width: 50px;
}
.erp-carac-table tbody tr.row-placeholder td { background: transparent; border-style: dashed; }
.erp-carac-table input.form-control {
    border: 0;
    background: transparent;
    color: var(--jd-text-primary);
    padding: .25rem .35rem;
    box-shadow: none;
    font-size: .85rem;
}
.erp-carac-table input.form-control:focus {
    background: var(--jd-bg-card);
    box-shadow: inset 0 0 0 2px var(--jd-crimson);
    outline: none;
}
.erp-carac-table .btn-del-carac {
    background: transparent;
    border: 0;
    color: var(--jd-text-muted);
    width: 28px; height: 28px;
    border-radius: 6px;
    cursor: pointer;
    transition: var(--jd-transition);
}
.erp-carac-table .btn-del-carac:hover {
    background: color-mix(in srgb, var(--bs-danger) 18%, transparent);
    color: var(--bs-danger);
}

/* ============================================================
   MÓDULO COMPRAS (COM-00, COM-01a, COM-02, COM-04, COM-08)
   ============================================================ */

/* COM-01a — Alerta de Punto de Venta no asignado (estilo "app.scuf.pe dice") */
.com-guard-main {
    position: relative;
    min-height: 70vh;
}
.com-guard-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.55);
    z-index: 1040;
}
body.jd-light-theme .com-guard-backdrop { background: rgba(33,38,49,.35); }

.com-guard-modal {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1050;
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    box-shadow: 0 12px 50px rgba(0,0,0,.45);
    width: min(440px, 92vw);
    overflow: hidden;
    animation: jd-fade-in .25s ease-out;
}
.com-guard-modal-header {
    background: var(--jd-bg-card-hover);
    padding: .85rem 1.2rem;
    font-weight: 600;
    color: var(--jd-text-primary);
    display: flex;
    align-items: center;
    gap: .55rem;
    border-bottom: 1px solid var(--jd-border-color);
}
.com-guard-modal-header i { color: var(--bs-warning); font-size: 1.1rem; }
.com-guard-modal-body {
    padding: 1.4rem 1.4rem 1.2rem;
    color: var(--jd-text-primary);
    font-size: .9rem;
}
.com-guard-modal-body .com-guard-redirect {
    margin-bottom: 0;
    color: var(--jd-text-muted);
    font-size: .8rem;
}
.com-guard-modal-footer {
    display: flex;
    justify-content: flex-end;
    padding: .8rem 1.2rem 1.1rem;
    background: var(--jd-bg-card);
    border-top: 1px solid var(--jd-border-color);
}
.com-guard-btn {
    background: #b8932f;
    color: #fff;
    border: 0;
    font-weight: 600;
    padding: .45rem 1.4rem;
    border-radius: var(--jd-radius-md);
    text-decoration: none;
}
.com-guard-btn:hover { background: #a07e22; color: #fff; }

/* ----- Top-bar de cada submódulo COM (breadcrumb + acciones) ----- */
.com-toolbar {
    background: var(--jd-crimson);
    color: #fff;
    border-radius: var(--jd-radius-md) var(--jd-radius-md) 0 0;
    padding: .55rem 1.05rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    font-size: .92rem;
    font-weight: 600;
}
.com-toolbar a, .com-toolbar a:hover { color: #fff; text-decoration: none; }
.com-toolbar-actions { display: flex; gap: .5rem; }
.com-toolbar-actions .btn {
    font-size: .8rem;
    font-weight: 600;
    color: #fff;
    background: rgba(0,0,0,.18);
    border: 1px solid rgba(255,255,255,.22);
    padding: .35rem .85rem;
}
.com-toolbar-actions .btn:hover { background: rgba(0,0,0,.32); color: #fff; }
.com-toolbar-actions .btn i { margin-right: .3rem; }

/* ----- Layout de formulario tipo SCUF (3 columnas: header / detalle) ----- */
.com-doc {
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    border-top: 0;
    border-radius: 0 0 var(--jd-radius-md) var(--jd-radius-md);
    padding: 1rem;
}
.com-doc-grid {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 1rem;
}
@media (max-width: 900px) {
    .com-doc-grid { grid-template-columns: 1fr; }
}

/* Cabecera y detalle como cards con título coloreado */
.com-section {
    background: var(--jd-bg-card-hover);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    overflow: hidden;
}
.com-section-header {
    padding: .55rem .9rem;
    font-weight: 700;
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #fff;
    background: var(--jd-crimson);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
}
.com-section-header.green { background: #198754; }
.com-section-header.blue  { background: var(--erp-accent); }
.com-section-header .com-section-actions { display: flex; gap: .35rem; }
.com-section-header .com-section-actions .btn {
    font-size: .72rem;
    padding: .25rem .65rem;
    background: rgba(255,255,255,.18);
    color: #fff;
    border: 0;
    font-weight: 600;
}
.com-section-header .com-section-actions .btn:hover { background: rgba(255,255,255,.32); color: #fff; }
.com-section-body {
    padding: .85rem;
}

/* Form fields del módulo */
.com-doc .form-label {
    color: var(--jd-text-label);
    font-weight: 600;
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .03em;
    margin-bottom: .25rem;
}
.com-doc .form-label .ref { color: var(--bs-warning); font-weight: 600; }
.com-doc .form-control,
.com-doc .form-select {
    font-size: .87rem;
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    color: var(--jd-text-primary);
}
.com-doc .form-control:disabled,
.com-doc .form-control[readonly] {
    background: color-mix(in srgb, var(--jd-bg-card-hover) 70%, transparent);
    color: var(--jd-text-secondary);
}
.com-doc .input-group .btn-search {
    background: var(--jd-crimson);
    color: #fff;
    border: 0;
}
.com-doc .input-group .btn-search:hover { background: var(--jd-crimson-dark); color: #fff; }

/* Tabla del detalle */
.com-detalle-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}
.com-detalle-table thead th {
    background: var(--jd-bg-card);
    color: var(--jd-text-label);
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    padding: .45rem .55rem;
    border-bottom: 1px solid var(--jd-border-color);
    text-align: left;
}
.com-detalle-table tbody td {
    padding: .55rem;
    border-bottom: 1px solid var(--jd-border-color);
    font-size: .85rem;
    color: var(--jd-text-primary);
    vertical-align: middle;
}
.com-detalle-table tbody tr:hover td { background: var(--jd-bg-card-hover); cursor: pointer; }
.com-detalle-table tbody tr.det-detraccion td { background: color-mix(in srgb, var(--bs-warning) 12%, var(--jd-bg-card)); }
.com-detalle-table tbody tr.det-retencion td  { background: color-mix(in srgb, var(--bs-danger) 12%, var(--jd-bg-card)); }
.com-detalle-table tbody tr.read-only td { cursor: default; }
.com-detalle-table .col-num { width: 36px; color: var(--jd-text-muted); }
.com-detalle-table .col-cant,
.com-detalle-table .col-pu,
.com-detalle-table .col-sub { text-align: right; font-variant-numeric: tabular-nums; }
.com-detalle-table .col-acciones { width: 50px; text-align: center; }
.com-detalle-table .btn-eliminar {
    background: transparent;
    color: var(--bs-danger);
    border: 0;
    padding: .25rem .45rem;
    border-radius: var(--jd-radius-sm);
    cursor: pointer;
}
.com-detalle-table .btn-eliminar:hover { background: color-mix(in srgb, var(--bs-danger) 18%, transparent); }

/* Empty state dentro del detalle */
.com-detalle-empty {
    text-align: center;
    color: var(--jd-text-muted);
    padding: 2.4rem 1rem;
}
.com-detalle-empty i { font-size: 2.2rem; opacity: .55; display: block; margin-bottom: .4rem; color: var(--jd-text-disabled); }

/* Totales (lado derecho del detalle) */
.com-totales {
    background: var(--jd-bg-card);
    border-top: 1px solid var(--jd-border-color);
    padding: .8rem 1.1rem;
    font-size: .9rem;
}
.com-totales .row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .15rem 0;
    color: var(--jd-text-primary);
}
.com-totales .row .lbl { color: var(--jd-text-muted); }
.com-totales .row.total {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--jd-crimson);
    border-top: 1px dashed var(--jd-border-color);
    margin-top: .35rem;
    padding-top: .45rem;
}

/* Switches Detrac/Retenc (chip box amarillo) */
.com-chips-box {
    background: color-mix(in srgb, var(--bs-warning) 16%, var(--jd-bg-card));
    border: 1px solid color-mix(in srgb, var(--bs-warning) 32%, var(--jd-border-color));
    border-radius: var(--jd-radius-md);
    padding: .6rem .8rem;
    display: flex;
    align-items: center;
    gap: .9rem;
    flex-wrap: wrap;
    font-size: .82rem;
}
.com-chips-box .form-switch { margin: 0; }
.com-chips-box .form-switch .form-check-input {
    width: 2.5em;
    background-color: var(--jd-bg-card-hover);
    border-color: var(--jd-border-color);
}
.com-chips-box .form-switch .form-check-input:checked {
    background-color: var(--jd-crimson);
    border-color: var(--jd-crimson);
}
.com-chips-box .form-switch .form-check-label {
    color: var(--jd-text-primary);
    font-weight: 600;
    margin-left: .35rem;
}
.com-chips-box .com-chip-input {
    display: flex;
    align-items: center;
    gap: .4rem;
}
.com-chips-box .com-chip-input label {
    font-size: .68rem;
    color: var(--jd-text-label);
    text-transform: uppercase;
    letter-spacing: .04em;
    margin: 0;
    font-weight: 700;
}
.com-chips-box .com-chip-input .form-select,
.com-chips-box .com-chip-input .form-control {
    width: 90px;
    height: 32px;
    font-size: .82rem;
    padding: .15rem .4rem;
}
.com-chips-box .com-chip-input .form-control:disabled {
    opacity: .45;
}

/* Botón de acción inferior */
.com-doc-actions {
    display: flex;
    justify-content: flex-end;
    gap: .55rem;
    margin-top: .9rem;
}
.com-doc-actions .btn-primary-blue {
    background: var(--erp-accent);
    color: #fff;
    border: 0;
    font-weight: 700;
    padding: .55rem 1.6rem;
    font-size: .9rem;
}
.com-doc-actions .btn-primary-blue:hover { background: var(--erp-accent-strong); color: #fff; }
.com-doc-actions .btn-primary-green {
    background: #198754;
    color: #fff;
    border: 0;
    font-weight: 700;
    padding: .55rem 1.6rem;
    font-size: .9rem;
}
.com-doc-actions .btn-primary-green:hover { background: #146c43; color: #fff; }
.com-doc-actions .btn-anular {
    background: #ef4444;
    color: #fff;
    border: 0;
    font-weight: 600;
}
.com-doc-actions .btn-anular:hover { background: #b91c1c; color: #fff; }

/* Modales anidados: cuando se abre un segundo modal encima de otro,
   Bootstrap no le sube el z-index automaticamente. La clase .modal-stack-top
   (aplicada por JS al abrir) fuerza el nuevo modal y su backdrop por encima
   del modal padre. */
.modal.modal-stack-top { z-index: 1080 !important; }
.modal-backdrop.modal-backdrop-stack-top { z-index: 1075 !important; }

/* ----- Modales de búsqueda (lupa) — header azul, lista compacta -----
   usamos !important para ganarle a los defaults de bootstrap (fondo blanco
   forzado, borde gris) y asegurar que el modal respete el tema JD Crimson
   en dark y light por igual. */
.com-search-modal .modal-content {
    background: var(--jd-bg-card) !important;
    color: var(--jd-text-primary) !important;
    border: 1px solid var(--jd-border-color) !important;
    border-radius: var(--jd-radius-md);
    overflow: hidden;
}
.com-search-modal .modal-header {
    background: var(--erp-accent) !important;
    color: #fff !important;
    border: 0 !important;
    padding: .65rem 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.com-search-modal .modal-title {
    font-size: 1rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: .5rem;
    color: #fff !important;
}
.com-search-modal .btn-close { filter: invert(1) brightness(2); opacity: .9; }
.com-search-modal .modal-body {
    padding: 1rem;
    background: var(--jd-bg-card) !important;
    color: var(--jd-text-primary) !important;
}
.com-search-modal .modal-footer {
    background: var(--jd-bg-card) !important;
    border-top: 1px solid var(--jd-border-color) !important;
}

.com-search-bar {
    display: flex;
    align-items: center;
    gap: .35rem;
    margin-bottom: .85rem;
}
.com-search-bar .form-control {
    background: var(--jd-bg-card-hover) !important;
    border: 1px solid var(--jd-border-color) !important;
    color: var(--jd-text-primary) !important;
}
.com-search-bar .form-control::placeholder { color: var(--jd-text-muted); }
.com-search-bar .btn-search {
    background: var(--erp-accent);
    color: #fff;
    border: 0;
    width: 38px;
    height: 38px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--jd-radius-sm);
}
.com-search-bar .btn-clear {
    background: transparent;
    border: 1px solid var(--jd-border-color);
    color: var(--jd-text-muted);
    width: 38px;
    height: 38px;
    padding: 0;
}

.com-search-count {
    font-size: .78rem;
    color: var(--jd-text-muted);
    margin-bottom: .35rem;
}

.com-search-list {
    max-height: 50vh;
    overflow-y: auto;
    border-top: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-sm);
    background: var(--jd-bg-card);
}
.com-search-list table { width: 100%; margin: 0; background: transparent; }
.com-search-list thead th {
    position: sticky;
    top: 0;
    background: var(--jd-bg-card-hover) !important;
    z-index: 2;
    font-size: .68rem;
    text-transform: uppercase;
    color: var(--jd-text-label) !important;
    padding: .45rem .55rem;
    border-bottom: 1px solid var(--jd-border-color) !important;
    letter-spacing: .04em;
}
.com-search-list tbody td {
    padding: .45rem .55rem;
    font-size: .85rem;
    color: var(--jd-text-primary) !important;
    background: var(--jd-bg-card);
    border-bottom: 1px solid var(--jd-border-color) !important;
    cursor: pointer;
}
.com-search-list tbody tr:hover td { background: color-mix(in srgb, var(--erp-accent) 12%, var(--jd-bg-card)) !important; }
.com-search-list .badge-tip-gravado {
    color: #198754;
    font-weight: 700;
}
.com-search-list .badge-tip-no {
    color: var(--jd-text-muted);
}

/* Buscador con vista filtros (COM-08b) */
.com-search-filters {
    display: flex;
    align-items: center;
    gap: .8rem;
    font-size: .8rem;
    color: var(--jd-text-secondary);
    margin-bottom: .65rem;
}
.com-search-filters .form-check {
    margin: 0;
}

/* ----- COM-02h / COM-04g / COM-08g — modal de confirmación verde ----- */
.com-success-modal .modal-content {
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    overflow: hidden;
}
.com-success-modal .modal-header {
    background: #198754;
    color: #fff;
    border: 0;
    padding: .7rem 1.05rem;
    display: flex;
    align-items: center;
    gap: .5rem;
    font-weight: 700;
}
.com-success-modal .modal-header .btn-close { filter: invert(1) brightness(2); }
.com-success-modal .modal-body {
    text-align: center;
    padding: 1.5rem 1.5rem 1rem;
    color: var(--jd-text-primary);
}
.com-success-icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: color-mix(in srgb, #198754 22%, transparent);
    color: #198754;
    margin: 0 auto 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5rem;
}
.com-success-modal .com-success-msg {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--jd-text-primary);
    margin-bottom: .25rem;
}
.com-success-modal .com-success-num {
    font-family: monospace;
    color: #198754;
    font-size: 1.25rem;
    font-weight: 800;
    margin-bottom: 1.2rem;
}
.com-success-modal .com-success-actions {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    margin-top: 1rem;
}
.com-success-modal .com-success-actions .btn-imprimir {
    background: var(--erp-accent);
    color: #fff;
    border: 0;
    font-weight: 700;
    padding: .55rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-size: .82rem;
}
.com-success-modal .com-success-actions .btn-imprimir:hover { background: var(--erp-accent-strong); }
.com-success-modal .com-success-actions .btn-cerrar {
    background: var(--jd-bg-card-hover);
    border: 1px solid var(--jd-border-color);
    color: var(--jd-text-primary);
    font-weight: 600;
    padding: .5rem;
}

/* ----- COM-08 / COM-08b — Pago a proveedores ----- */
.com-pay-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 1rem;
}
@media (max-width: 950px) { .com-pay-grid { grid-template-columns: 1fr; } }

.com-pay-info-card {
    background: #fff5d6;
    border: 1px solid color-mix(in srgb, var(--bs-warning) 35%, var(--jd-border-color));
    border-radius: var(--jd-radius-md);
    padding: .65rem .9rem;
    font-size: .8rem;
    color: #6b4f00;
    margin-top: .55rem;
}
body.jd-light-theme .com-pay-info-card { background: #fff8e1; }
body:not(.jd-light-theme) .com-pay-info-card {
    background: color-mix(in srgb, var(--bs-warning) 14%, var(--jd-bg-card));
    color: var(--jd-text-primary);
}

.com-pay-empty {
    text-align: center;
    color: var(--jd-text-muted);
    padding: 2.6rem 1rem;
    background: var(--jd-bg-card);
    border-radius: var(--jd-radius-md);
    border: 1px dashed var(--jd-border-color);
}

.com-pay-total-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--jd-bg-card);
    border-top: 1px solid var(--jd-border-color);
    padding: .65rem 1.05rem;
    font-size: .92rem;
    color: var(--jd-text-primary);
}
.com-pay-total-bar strong { color: var(--jd-crimson); font-size: 1.05rem; }
.com-pay-total-bar .btn-save {
    background: #198754;
    color: #fff;
    border: 0;
    font-weight: 700;
    padding: .5rem 1.4rem;
}
.com-pay-total-bar .btn-save:hover { background: #146c43; color: #fff; }
.com-pay-total-bar .btn-save:disabled { opacity: .5; }

/* Modal COM-08b — buscador de cuotas con encabezados y sub-filas */
.com-pay-doc-table thead th {
    background: var(--jd-bg-card-hover);
    color: var(--jd-text-label);
    font-size: .68rem;
    text-transform: uppercase;
    padding: .45rem .55rem;
    border-bottom: 1px solid var(--jd-border-color);
    text-align: left;
}
.com-pay-doc-table td {
    padding: .45rem .55rem;
    border-bottom: 1px solid var(--jd-border-color);
    font-size: .82rem;
    color: var(--jd-text-primary);
}
.com-pay-doc-table tr.row-header td { background: var(--jd-bg-card-hover); font-weight: 700; }
.com-pay-doc-table tr.row-cuota td  { color: var(--jd-text-secondary); }
.com-pay-doc-table tr.row-cuota-vencida td { color: var(--bs-danger); }
.com-pay-doc-table tr.row-detraccion td {
    background: color-mix(in srgb, var(--bs-warning) 14%, var(--jd-bg-card));
}
.com-pay-doc-table .badge-saldo { color: var(--jd-text-primary); font-weight: 700; }
.com-pay-doc-table .badge-det { background:#f59e0b;color:#fff;padding:2px 8px;border-radius:var(--jd-radius-pill);font-size:.65rem;font-weight:700; }

/* Botón "Añadir seleccionados" (footer azul) */
.com-modal-footer-blue {
    background: var(--jd-bg-card-hover);
    border-top: 1px solid var(--jd-border-color);
    padding: .65rem 1rem;
    display: flex;
    justify-content: flex-end;
    gap: .5rem;
}
.com-modal-footer-blue .btn-add {
    background: var(--erp-accent);
    color: #fff;
    border: 0;
    font-weight: 700;
    padding: .5rem 1.5rem;
    text-transform: uppercase;
    letter-spacing: .03em;
    font-size: .82rem;
}
.com-modal-footer-blue .btn-add:hover { background: var(--erp-accent-strong); color: #fff; }

/* ----- Notas-para-el-programador (panel lateral amarillo) ----- */
.com-notes {
    background: #fff8d6;
    border: 1px solid #f0d76e;
    color: #4a3a00;
    padding: .9rem 1rem;
    border-radius: var(--jd-radius-md);
    font-size: .82rem;
    line-height: 1.45;
}
body.jd-light-theme .com-notes { background: #fff8d6; color: #4a3a00; }
body:not(.jd-light-theme) .com-notes {
    background: color-mix(in srgb, var(--bs-warning) 12%, var(--jd-bg-card));
    border-color: var(--jd-border-color);
    color: var(--jd-text-primary);
}

/* ============================================================
   Generador estilos COM — fin
   ============================================================ */

/* ============================================================
   MÓDULO IMPORTACIONES (IMP-01 + modales IMP-01d/e/f)
   ============================================================ */

/* Layout de 3 columnas */
.imp-doc-grid {
    display: grid;
    grid-template-columns: 26% 30% 44%;
    gap: 1rem;
}
@media (max-width: 1200px) {
    .imp-doc-grid { grid-template-columns: 1fr; }
}

.imp-section {
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.imp-section-header {
    background: var(--jd-bg-card-hover);
    padding: .55rem .9rem;
    font-weight: 600;
    font-size: .85rem;
    color: var(--jd-text-primary);
    border-bottom: 1px solid var(--jd-border-color);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
}
.imp-section-header .btn-plus {
    background: var(--erp-accent);
    color: #fff;
    border: 0;
    width: 30px; height: 30px;
    padding: 0;
    border-radius: var(--jd-radius-sm);
    font-size: 1rem;
    cursor: pointer;
}
.imp-section-header .btn-plus:hover { background: var(--erp-accent-strong); color: #fff; }
.imp-section-body { padding: .85rem; flex: 1; overflow-y: auto; }

/* Campos auto-rellenados (IMP-01c) en azul claro */
.imp-autofilled {
    background: color-mix(in srgb, var(--erp-accent) 8%, var(--jd-bg-card)) !important;
    border-color: color-mix(in srgb, var(--erp-accent) 35%, var(--jd-border-color)) !important;
    color: var(--jd-text-primary) !important;
}

/* Tarjeta de documento relacionado (Col 2) */
.imp-doc-card {
    background: var(--jd-bg-card-hover);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    padding: .65rem .8rem;
    margin-bottom: .55rem;
    cursor: pointer;
    transition: var(--jd-transition);
    position: relative;
}
.imp-doc-card:hover {
    border-color: var(--jd-crimson);
    background: var(--jd-bg-card);
    transform: translateY(-1px);
    box-shadow: var(--jd-shadow-sm);
}
.imp-doc-card.es-origen {
    border-color: #198754;
}
.imp-doc-card .doc-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: .5rem;
    margin-bottom: .25rem;
}
.imp-doc-card .doc-numero {
    color: var(--erp-accent);
    font-weight: 700;
    font-family: monospace;
    font-size: .92rem;
    display: flex;
    align-items: center;
    gap: .4rem;
}
.imp-doc-card.es-origen .doc-numero::before {
    content: '';
    width: 8px;
    height: 8px;
    background: #198754;
    border-radius: 50%;
    display: inline-block;
}
.imp-doc-card .doc-fecha {
    color: var(--jd-text-muted);
    font-size: .7rem;
}
.imp-doc-card .doc-proveedor {
    font-size: .78rem;
    color: var(--jd-text-primary);
    margin-bottom: .25rem;
}
.imp-doc-card .doc-foot {
    display: flex;
    justify-content: space-between;
    font-size: .72rem;
    color: var(--jd-text-muted);
    margin-top: .2rem;
}
.imp-doc-card .doc-foot strong { color: var(--jd-text-primary); }
.imp-doc-card .doc-subtotal {
    color: #198754;
    font-weight: 700;
}

.imp-doc-empty {
    text-align: center;
    padding: 2rem 1rem;
    color: var(--jd-text-muted);
    font-size: .82rem;
}
.imp-doc-empty i { font-size: 2.4rem; opacity: .35; display: block; margin-bottom: .35rem; }

/* Footer Costo S/. */
.imp-costo-bar {
    border-top: 1px solid var(--jd-border-color);
    padding: .55rem .9rem;
    background: var(--jd-bg-card);
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: .9rem;
}
.imp-costo-bar strong { color: var(--jd-crimson); font-weight: 800; }

/* Top-bar de la OI: igual estilo que com-toolbar pero compact */
.imp-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .85rem;
}
.imp-toolbar .imp-title {
    font-weight: 700;
    color: var(--jd-text-primary);
    display: flex; align-items: center; gap: .55rem;
}
.imp-toolbar-actions { display: flex; gap: .5rem; }
.imp-toolbar-actions .btn {
    font-size: .8rem;
    padding: .4rem 1rem;
    color: var(--jd-text-primary);
    background: var(--jd-bg-card-hover);
    border: 1px solid var(--jd-border-color);
}
.imp-toolbar-actions .btn-primary {
    background: var(--erp-accent); color: #fff; border-color: var(--erp-accent);
}
.imp-toolbar-actions .btn-primary:hover { background: var(--erp-accent-strong); color: #fff; }

/* Modal detalle documento (IMP-01d/e/f) — toggle Origen */
.imp-origen-switch {
    display: flex;
    align-items: center;
    gap: .55rem;
    font-size: .8rem;
    color: var(--jd-text-primary);
    font-weight: 600;
}
.imp-origen-switch .form-check-input {
    width: 2.6em;
    background-color: var(--jd-bg-card-hover);
    border-color: var(--jd-border-color);
}
.imp-origen-switch .form-check-input:checked {
    background-color: #198754;
    border-color: #198754;
}

/* ============================================================
   MÓDULO VENTAS (VEN-00 + VEN-02)
   ============================================================ */

.ven-stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: .75rem;
    margin-bottom: 1.25rem;
}
.ven-stat-card {
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    padding: .85rem 1rem;
    text-align: center;
}
.ven-stat-card .ven-stat-num {
    font-size: 1.4rem;
    font-weight: 800;
    color: var(--jd-text-primary);
    margin: 0;
    font-family: monospace;
}
.ven-stat-card .ven-stat-lbl {
    font-size: .72rem;
    color: var(--jd-text-muted);
    margin-top: .25rem;
    text-transform: uppercase;
    letter-spacing: .05em;
}
.ven-stat-card.ok      .ven-stat-num { color: #198754; }
.ven-stat-card.warn    .ven-stat-num { color: #f59e0b; }
.ven-stat-card.danger  .ven-stat-num { color: #dc3545; }
.ven-stat-card.info    .ven-stat-num { color: var(--erp-accent); }

/* VEN-02 layout 2 columnas */
.ven-doc-grid {
    display: grid;
    grid-template-columns: 1.1fr 1.6fr;
    gap: 1rem;
}
@media (max-width: 900px) {
    .ven-doc-grid { grid-template-columns: 1fr; }
}

.ven-cliente-historial {
    background: var(--erp-accent);
    color: #fff;
    border: 0;
    font-weight: 700;
    font-size: .72rem;
    padding: .35rem .85rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    border-radius: var(--jd-radius-sm);
    margin-left: .4rem;
}
.ven-cliente-historial:hover { background: var(--erp-accent-strong); color: #fff; }

/* VEN-02b — Lista de cotizaciones (card style) */
.ven-cot-list {
    display: flex;
    flex-direction: column;
    gap: .5rem;
}
.ven-cot-card {
    background: var(--jd-bg-card-hover);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    padding: .7rem 1rem;
    cursor: pointer;
    display: grid;
    grid-template-columns: 130px 100px 130px 1fr 130px;
    gap: 1rem;
    align-items: center;
    transition: var(--jd-transition);
}
.ven-cot-card:hover {
    background: var(--jd-bg-card);
    border-color: var(--erp-accent);
    transform: translateY(-1px);
    box-shadow: var(--jd-shadow-sm);
}
.ven-cot-card .lbl {
    font-size: .65rem;
    color: var(--jd-text-muted);
    text-transform: uppercase;
    letter-spacing: .04em;
    display: block;
    margin-bottom: 2px;
}
.ven-cot-card .val {
    font-size: .88rem;
    color: var(--jd-text-primary);
}
.ven-cot-card .val-num {
    font-family: monospace;
    color: var(--erp-accent);
    font-weight: 700;
    text-decoration: underline;
}
.ven-cot-card .val-muted { color: var(--jd-text-muted); font-style: italic; }
.ven-cot-card .estado-badge {
    background: color-mix(in srgb, var(--erp-accent) 18%, transparent);
    color: var(--erp-accent);
    font-weight: 700;
    font-size: .72rem;
    padding: 4px 12px;
    border-radius: var(--jd-radius-pill);
    display: inline-block;
}
body.jd-light-theme .ven-cot-card .estado-badge { background: color-mix(in srgb, var(--erp-accent) 15%, #fff); color: var(--erp-accent); }

/* VEN-02c — Detail card style */
.ven-detail-list {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    padding: .5rem;
}
.ven-detail-card {
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    padding: .7rem .9rem;
    display: grid;
    grid-template-columns: 1fr 70px 90px 100px 40px;
    gap: 1rem;
    align-items: center;
    cursor: pointer;
    transition: var(--jd-transition);
}
.ven-detail-card:hover {
    background: var(--jd-bg-card-hover);
    transform: translateX(2px);
}
.ven-detail-card .ven-prod-name {
    font-weight: 700;
    color: var(--jd-text-primary);
    line-height: 1.2;
}
.ven-detail-card .ven-prod-code {
    font-size: .7rem;
    color: var(--jd-text-muted);
    font-family: monospace;
    margin-top: 2px;
    display: block;
}
.ven-detail-card .lbl-mini {
    font-size: .65rem;
    color: var(--jd-text-muted);
    text-transform: uppercase;
    display: block;
    text-align: right;
}
.ven-detail-card .val-mini {
    font-size: .88rem;
    color: var(--jd-text-primary);
    text-align: right;
    display: block;
    font-variant-numeric: tabular-nums;
}
.ven-detail-card .val-sub {
    color: var(--erp-accent);
    font-weight: 700;
}
.ven-detail-card .btn-eliminar {
    background: transparent;
    border: 0;
    color: var(--bs-danger);
    padding: .3rem .5rem;
    border-radius: var(--jd-radius-sm);
    cursor: pointer;
    justify-self: center;
}
.ven-detail-card .btn-eliminar:hover {
    background: color-mix(in srgb, var(--bs-danger) 18%, transparent);
}

/* VEN-02d — Modal Editar Producto con tabs */
.ven-modal-tabs {
    display: flex;
    gap: 0;
    border-bottom: 1px solid var(--jd-border-color);
    margin-bottom: 1rem;
}
.ven-modal-tab {
    background: transparent;
    border: 0;
    color: var(--jd-text-muted);
    padding: .55rem 1.1rem;
    font-size: .75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    transition: var(--jd-transition);
}
.ven-modal-tab:hover { color: var(--jd-text-primary); }
.ven-modal-tab.active {
    color: var(--erp-accent);
    border-bottom-color: var(--erp-accent);
}
.ven-modal-panel { display: none; }
.ven-modal-panel.active { display: block; }

/* Precio unitario destacado (verde) */
.ven-total-preview {
    background: color-mix(in srgb, #198754 12%, var(--jd-bg-card));
    border: 1px solid color-mix(in srgb, #198754 32%, var(--jd-border-color));
    padding: .55rem .85rem;
    border-radius: var(--jd-radius-md);
    color: #198754;
    font-weight: 800;
    font-size: 1rem;
    text-align: center;
    font-family: monospace;
}

/* Tabla dentro del modal editar producto */
.ven-inner-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: .85rem;
}
.ven-inner-table thead th {
    background: var(--jd-bg-card-hover);
    color: var(--jd-text-label);
    font-size: .7rem;
    text-transform: uppercase;
    padding: .55rem .75rem;
    border-bottom: 1px solid var(--jd-border-color);
    text-align: left;
}
.ven-inner-table tbody td {
    padding: .55rem .75rem;
    border-bottom: 1px solid var(--jd-border-color);
    color: var(--jd-text-primary);
}
.ven-inner-table .col-num { text-align: right; font-variant-numeric: tabular-nums; }
.ven-inner-table tr.aplicado td {
    background: color-mix(in srgb, #198754 8%, var(--jd-bg-card));
}
.ven-inner-table .aplicado-icon { color: #198754; font-size: 1.05rem; }

.ven-info-box {
    background: color-mix(in srgb, var(--erp-accent) 12%, var(--jd-bg-card));
    border: 1px solid color-mix(in srgb, var(--erp-accent) 30%, var(--jd-border-color));
    color: var(--jd-text-primary);
    border-radius: var(--jd-radius-md);
    padding: .55rem .85rem;
    font-size: .82rem;
    margin-top: .85rem;
}
.ven-info-box strong { color: var(--erp-accent); }

/* VEN-02g — Buscar Producto */
.ven-buscar-prod-table {
    width: 100%;
    font-size: .88rem;
    border-collapse: collapse;
}
.ven-buscar-prod-table thead th {
    background: var(--jd-bg-card-hover);
    color: var(--jd-text-label);
    font-size: .7rem;
    text-transform: uppercase;
    padding: .55rem .75rem;
    border-bottom: 1px solid var(--jd-border-color);
    text-align: left;
    letter-spacing: .04em;
}
.ven-buscar-prod-table tbody td {
    padding: .55rem .75rem;
    border-bottom: 1px solid var(--jd-border-color);
    color: var(--jd-text-primary);
    cursor: pointer;
}
.ven-buscar-prod-table tbody tr:hover td { background: color-mix(in srgb, var(--erp-accent) 8%, var(--jd-bg-card)); }
.ven-buscar-prod-table .col-codigo {
    font-family: monospace;
    color: var(--erp-accent);
    font-weight: 700;
}
.ven-buscar-prod-table .col-stock { text-align: right; font-variant-numeric: tabular-nums; }
.ven-buscar-prod-table .col-stock.ok  { color: #198754; font-weight: 700; }
.ven-buscar-prod-table .col-stock.zero { color: var(--bs-danger); font-weight: 700; }
.ven-buscar-prod-table .col-precio {
    text-align: right;
    font-variant-numeric: tabular-nums;
    color: var(--jd-text-primary);
    font-weight: 600;
}

/* VEN-03 — Venta Directa */
.ven-pos-progress {
    display: flex;
    align-items: center;
    gap: .35rem;
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    padding: .55rem .85rem;
    border-radius: var(--jd-radius-md);
    margin-bottom: .85rem;
    flex-wrap: wrap;
}
.ven-pos-step {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .3rem .75rem;
    border-radius: var(--jd-radius-pill);
    font-size: .78rem;
    font-weight: 600;
    background: var(--jd-bg-card-hover);
    color: var(--jd-text-muted);
    border: 1px solid var(--jd-border-color);
}
.ven-pos-step.active {
    background: var(--jd-crimson);
    color: #fff;
    border-color: var(--jd-crimson);
}
.ven-pos-step.done {
    background: color-mix(in srgb, #198754 22%, transparent);
    color: #198754;
    border-color: color-mix(in srgb, #198754 40%, var(--jd-border-color));
}
.ven-pos-step-sep { color: var(--jd-text-muted); font-size: .8rem; }

.ven-pos-section {
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    padding: 1rem;
    margin-bottom: .85rem;
}
.ven-pos-section-title {
    color: var(--jd-crimson);
    font-weight: 800;
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .07em;
    margin-bottom: .65rem;
    padding-bottom: .35rem;
    border-bottom: 1px solid var(--jd-border-color);
    display: flex;
    align-items: center;
    gap: .5rem;
}
.ven-pos-radios {
    display: flex;
    gap: .85rem;
    align-items: center;
    margin-bottom: .75rem;
}
.ven-pos-radios .form-check {
    background: var(--jd-bg-card-hover);
    border: 2px solid var(--jd-border-color);
    padding: .35rem .85rem .35rem 2rem;
    border-radius: var(--jd-radius-pill);
    cursor: pointer;
    transition: var(--jd-transition);
}
.ven-pos-radios .form-check:has(input:checked) {
    border-color: var(--erp-accent);
    background: color-mix(in srgb, var(--erp-accent) 12%, var(--jd-bg-card));
    color: var(--erp-accent);
    font-weight: 700;
}

.ven-pos-prods-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .85rem;
}
.ven-pos-prods-table thead th {
    background: var(--jd-crimson);
    color: #fff;
    font-size: .7rem;
    text-transform: uppercase;
    padding: .5rem .65rem;
    text-align: left;
    letter-spacing: .04em;
}
.ven-pos-prods-table tbody td {
    padding: .55rem .65rem;
    border-bottom: 1px solid var(--jd-border-color);
    color: var(--jd-text-primary);
}
.ven-pos-prods-table .col-num { text-align: right; font-variant-numeric: tabular-nums; }
.ven-pos-prods-table input.form-control {
    padding: .2rem .4rem;
    font-size: .85rem;
    text-align: right;
}
.ven-pos-prods-table .col-codigo { font-family: monospace; color: var(--erp-accent); font-weight: 700; }
.ven-pos-prods-table .col-stock.zero { color: var(--bs-danger); font-weight: 700; }

.ven-pos-totales {
    background: var(--jd-bg-card-hover);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    padding: .85rem 1rem;
    font-size: .9rem;
}
.ven-pos-totales .row-t {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .15rem 0;
}
.ven-pos-totales .row-t.total {
    border-top: 1px solid var(--jd-border-color);
    margin-top: .35rem;
    padding-top: .55rem;
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--jd-crimson);
}
.ven-pos-registrar {
    background: var(--jd-crimson);
    color: #fff;
    border: 0;
    width: 100%;
    padding: .7rem;
    border-radius: var(--jd-radius-md);
    font-weight: 800;
    font-size: 1rem;
    margin-top: .85rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    transition: var(--jd-transition);
}
.ven-pos-registrar:hover { background: var(--jd-crimson-dark); color: #fff; }

/* =====================================================================
   PRC-01 — Maestro de Precios
   Sidebar de listas (001..004) + tabla de precios + banners
   ===================================================================== */

.prc-wrap {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 0;
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    overflow: hidden;
    min-height: 480px;
}

/* topbar */
.prc-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .6rem 1rem;
    background: var(--jd-bg-card-hover);
    border-bottom: 1px solid var(--jd-border-color);
}
.prc-topbar-title {
    display: flex;
    align-items: center;
    gap: .5rem;
    color: var(--jd-text-primary);
    font-weight: 700;
    font-size: .95rem;
}
.prc-topbar-title i { color: var(--jd-crimson); }

/* sidebar de listas */
.prc-side {
    background: var(--jd-bg-card-hover);
    border-right: 1px solid var(--jd-border-color);
}
.prc-side-title {
    padding: .65rem 1rem;
    font-size: .72rem;
    font-weight: 800;
    color: var(--jd-crimson);
    letter-spacing: .04em;
    border-bottom: 1px solid var(--jd-border-color);
    text-transform: uppercase;
}
.prc-side-item {
    padding: .6rem 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    border-bottom: 1px solid var(--jd-border-color);
    color: var(--jd-text-primary);
    transition: var(--jd-transition);
    background: transparent;
    border-left: 0;
    border-right: 0;
    width: 100%;
    text-align: left;
}
.prc-side-item:hover { background: var(--jd-bg-card); }
.prc-side-item.active {
    background: var(--jd-crimson);
    color: #fff;
}
.prc-side-item.active .prc-side-code,
.prc-side-item.active .prc-side-name { color: #fff; }
.prc-side-item.active .prc-side-arrow { color: #fff; }
.prc-side-code {
    font-family: monospace;
    font-weight: 800;
    font-size: .85rem;
    color: var(--jd-text-primary);
    display: block;
    line-height: 1.1;
}
.prc-side-name {
    font-size: .7rem;
    color: var(--jd-text-muted);
    text-transform: uppercase;
    letter-spacing: .04em;
}
.prc-side-arrow { color: var(--jd-text-muted); font-size: .85rem; }
.prc-side-badge {
    background: var(--jd-crimson);
    color: #fff;
    font-size: .65rem;
    font-weight: 700;
    padding: 1px 7px;
    border-radius: var(--jd-radius-pill);
    margin-left: .35rem;
}
.prc-side-item.active .prc-side-badge { background: #fff; color: var(--jd-crimson); }

/* panel derecho */
.prc-main {
    padding: 1rem 1.15rem 1.25rem 1.15rem;
    display: flex;
    flex-direction: column;
    gap: .75rem;
    min-width: 0;
}
.prc-main-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    flex-wrap: wrap;
}
.prc-main-title {
    display: flex;
    align-items: center;
    gap: .5rem;
    color: var(--jd-crimson);
    font-weight: 800;
    font-size: 1rem;
}

/* buscador */
.prc-search {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .45rem .7rem;
    background: var(--jd-bg-card-hover);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-sm);
}
.prc-search input {
    background: transparent;
    border: 0;
    color: var(--jd-text-primary);
    flex: 1;
    outline: none;
    font-size: .9rem;
}
.prc-search i { color: var(--jd-text-muted); }

/* estado vacio */
.prc-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 220px;
    color: var(--jd-text-muted);
    text-align: center;
    gap: .35rem;
}
.prc-empty i { font-size: 2rem; color: var(--jd-text-disabled); }

/* tabla de precios */
.prc-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: .82rem;
}
.prc-table thead th {
    background: var(--jd-crimson);
    color: #fff;
    text-transform: uppercase;
    font-size: .68rem;
    letter-spacing: .04em;
    padding: .55rem .7rem;
    text-align: left;
    border-bottom: 1px solid var(--jd-border-color);
    white-space: nowrap;
}
.prc-table thead th.th-num { text-align: right; }
.prc-table tbody td {
    padding: .55rem .7rem;
    border-bottom: 1px solid var(--jd-border-color);
    color: var(--jd-text-primary);
    background: var(--jd-bg-card);
    vertical-align: middle;
}
.prc-table tbody tr:hover td { background: var(--jd-bg-card-hover); }
.prc-table td.td-num { text-align: right; font-variant-numeric: tabular-nums; }
.prc-table td.td-util  { color: var(--jd-crimson); font-weight: 700; }
.prc-table td.td-price { color: #16a34a; font-weight: 700; }
.prc-table td.td-code  { font-family: monospace; color: var(--jd-crimson); font-weight: 700; }
.prc-table td.td-empty { color: var(--jd-text-disabled); font-style: italic; }
.prc-table tr.prc-row-new td {
    background: color-mix(in srgb, #f59e0b 12%, var(--jd-bg-card));
}

/* boton eliminar por fila */
.prc-btn-del {
    background: transparent;
    border: 0;
    color: var(--bs-danger);
    cursor: pointer;
    padding: .2rem .35rem;
    border-radius: var(--jd-radius-sm);
    transition: var(--jd-transition);
}
.prc-btn-del:hover { background: color-mix(in srgb, var(--bs-danger) 18%, transparent); }

/* banners */
.prc-banner {
    padding: .65rem .9rem;
    border-radius: var(--jd-radius-md);
    display: flex;
    align-items: flex-start;
    gap: .55rem;
    font-size: .85rem;
    border: 1px solid transparent;
}
.prc-banner i { font-size: 1.05rem; margin-top: 1px; }
.prc-banner-warn {
    background: color-mix(in srgb, #f59e0b 12%, var(--jd-bg-card));
    color: color-mix(in srgb, #f59e0b 90%, var(--jd-text-primary));
    border-color: color-mix(in srgb, #f59e0b 40%, transparent);
}
.prc-banner-warn i { color: #f59e0b; }
.prc-banner-ok {
    background: color-mix(in srgb, #16a34a 14%, var(--jd-bg-card));
    color: var(--jd-text-primary);
    border-color: color-mix(in srgb, #16a34a 40%, transparent);
}
.prc-banner-ok i { color: #16a34a; }

/* modal Nuevo Precio (header verde tal como mockup) */
.prc-modal-head-green {
    background: #16a34a !important;
    color: #fff !important;
}
.prc-modal-head-green .modal-title { color: #fff; }
.prc-modal-head-green .btn-close {
    filter: brightness(0) invert(1);
    opacity: .9;
}

/* switch IGV pill */
.prc-igv-switch {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .35rem 0;
}
.prc-igv-switch label {
    font-size: .78rem;
    color: var(--jd-text-primary);
    font-weight: 600;
}

/* sub-modal buscar producto (header azul) */
.prc-modal-head-blue {
    background: var(--erp-accent) !important;
    color: #fff !important;
}
.prc-modal-head-blue .modal-title { color: #fff; }
.prc-modal-head-blue .btn-close {
    filter: brightness(0) invert(1);
    opacity: .9;
}

/* lista de productos en el sub-modal */
.prc-prod-list {
    max-height: 340px;
    overflow-y: auto;
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-sm);
}
.prc-prod-list table {
    width: 100%;
    border-collapse: collapse;
    margin: 0;
}
.prc-prod-list thead th {
    background: var(--jd-crimson);
    color: #fff;
    font-size: .7rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    padding: .55rem .7rem;
    text-align: left;
    position: sticky; top: 0; z-index: 1;
}
.prc-prod-list tbody td {
    padding: .5rem .7rem;
    color: var(--jd-text-primary);
    border-bottom: 1px solid var(--jd-border-color);
    background: var(--jd-bg-card);
}
.prc-prod-list tbody tr { cursor: pointer; transition: var(--jd-transition); }
.prc-prod-list tbody tr:hover td { background: var(--jd-bg-card-hover); color: var(--jd-crimson); }
.prc-prod-list td.td-code { font-family: monospace; color: var(--jd-crimson); font-weight: 700; }

/* input con leve tinte azul (autollenado) — coincide con mockup */
.prc-input-autofill {
    background: color-mix(in srgb, var(--erp-accent) 10%, var(--jd-bg-card));
    border-color: color-mix(in srgb, var(--erp-accent) 40%, var(--jd-border-color));
    color: var(--jd-text-primary);
}
.prc-input-utility {
    background: color-mix(in srgb, var(--jd-crimson) 10%, var(--jd-bg-card));
    border-color: var(--jd-crimson);
    color: var(--jd-crimson);
    font-weight: 800;
}

/* =====================================================================
   INV-02 — Nota de Ingreso (split cabecera + detalle en cards)
   ===================================================================== */

/* wrap: 2 columnas (cabecera / detalle) */
.ni-wrap {
    display: grid;
    grid-template-columns: minmax(320px, 400px) 1fr;
    gap: 0;
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    overflow: hidden;
    min-height: 500px;
}
@media (max-width: 991px) {
    .ni-wrap { grid-template-columns: 1fr; }
}

/* topbar de la NI (dentro del wrap) — no confundir con el hero */
.ni-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: .55rem .95rem;
    background: var(--jd-crimson-dark);
    color: #fff;
    border-bottom: 1px solid var(--jd-border-color);
    grid-column: 1 / -1;
    flex-wrap: wrap;
}
.ni-topbar-title {
    font-weight: 700;
    font-size: .95rem;
    display: flex;
    align-items: center;
    gap: .45rem;
}
.ni-topbar-title small { opacity: .8; }
.ni-topbar-actions { display: flex; gap: .5rem; flex-wrap: wrap; }
.ni-topbar .btn { padding: .35rem .8rem; font-size: .78rem; }
.ni-topbar .btn-jd-secondary,
.ni-topbar .btn-outline-light {
    background: #fff;
    color: var(--jd-crimson-dark);
    border: 0;
    font-weight: 700;
}
.ni-topbar .btn-jd-secondary:hover,
.ni-topbar .btn-outline-light:hover {
    background: color-mix(in srgb, #000 6%, #fff);
    color: var(--jd-crimson-dark);
}

/* cabecera (izq) */
.ni-cab {
    padding: 1rem 1.05rem;
    border-right: 1px solid var(--jd-border-color);
    background: var(--jd-bg-card);
    display: flex;
    flex-direction: column;
    gap: .8rem;
}
.ni-cab-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    color: var(--jd-text-primary);
    font-weight: 800;
    font-size: .95rem;
    padding-bottom: .3rem;
    border-bottom: 1px solid var(--jd-border-color);
}
.ni-cab-title i { color: var(--jd-crimson); }
.ni-cab-serie {
    font-size: .78rem;
    font-weight: 700;
    color: var(--jd-text-muted);
}
.ni-cab-serie strong { color: var(--jd-crimson); font-family: monospace; }

/* input + lupa (patron reutilizable en toda la NI) */
.ni-lookup {
    display: flex;
    gap: 4px;
}
.ni-lookup .form-control { flex: 1; }
.ni-lookup .btn-lupa {
    background: var(--jd-crimson);
    color: #fff;
    border: 0;
    padding: .35rem .55rem;
    border-radius: var(--jd-radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--jd-transition);
}
.ni-lookup .btn-lupa:hover { background: var(--jd-crimson-dark); }
.ni-lookup .btn-lupa:disabled { background: var(--jd-text-disabled); cursor: not-allowed; }

/* input rellenado (verde suave — highlight visual del mockup) */
.ni-input-filled {
    background: color-mix(in srgb, #16a34a 12%, var(--jd-bg-card));
    border-color: color-mix(in srgb, #16a34a 45%, var(--jd-border-color));
    color: var(--jd-text-primary);
    font-weight: 700;
}
/* input auto (fondo azul, como el Nro correlativo) */
.ni-input-auto {
    background: color-mix(in srgb, var(--erp-accent) 12%, var(--jd-bg-card));
    border-color: color-mix(in srgb, var(--erp-accent) 40%, var(--jd-border-color));
    font-family: monospace;
    font-weight: 700;
}

/* detalle (der) — cards */
.ni-det {
    padding: 1rem 1.15rem;
    display: flex;
    flex-direction: column;
    gap: .75rem;
    min-width: 0;
}
.ni-det-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
}
.ni-det-title {
    color: var(--jd-text-primary);
    font-weight: 800;
    font-size: .95rem;
    display: flex;
    align-items: center;
    gap: .45rem;
}
.ni-det-title i { color: var(--jd-crimson); }

/* estado vacio del detalle */
.ni-det-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 1rem;
    color: var(--jd-text-muted);
    text-align: center;
    gap: .4rem;
    border: 1.5px dashed var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    background: color-mix(in srgb, var(--jd-crimson) 3%, var(--jd-bg-card));
}
.ni-det-empty i { font-size: 2.2rem; color: var(--jd-crimson); opacity: .55; }

/* card de linea de detalle */
.ni-line-card {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: .75rem;
    padding: .7rem .9rem;
    background: var(--jd-bg-card-hover);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    transition: var(--jd-transition);
}
.ni-line-card:hover { border-color: var(--jd-crimson); }
.ni-line-card-title {
    font-weight: 700;
    color: var(--jd-text-primary);
    font-size: .95rem;
}
.ni-line-card-sub {
    font-size: .78rem;
    color: var(--jd-text-muted);
    font-family: monospace;
    margin-top: 1px;
}
.ni-line-card-actions {
    display: flex;
    align-items: center;
    gap: .4rem;
    flex-shrink: 0;
}
.ni-line-cant {
    display: flex;
    align-items: center;
    gap: .35rem;
    font-size: .75rem;
    color: var(--jd-text-muted);
}
.ni-line-cant strong {
    color: var(--jd-crimson);
    font-size: 1.05rem;
    font-weight: 800;
}
.ni-line-cant input {
    width: 66px;
    padding: .25rem .4rem;
    text-align: right;
    font-size: .95rem;
    font-weight: 700;
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-sm);
    color: var(--jd-text-primary);
}
.ni-line-btn {
    background: transparent;
    border: 1px solid var(--jd-border-color);
    color: var(--jd-text-primary);
    padding: .35rem .5rem;
    border-radius: var(--jd-radius-sm);
    cursor: pointer;
    transition: var(--jd-transition);
}
.ni-line-btn:hover { background: var(--jd-bg-card); border-color: var(--jd-crimson); color: var(--jd-crimson); }
.ni-line-btn-danger { color: var(--bs-danger); border-color: color-mix(in srgb, var(--bs-danger) 35%, var(--jd-border-color)); }
.ni-line-btn-danger:hover { background: color-mix(in srgb, var(--bs-danger) 15%, transparent); color: var(--bs-danger); border-color: var(--bs-danger); }

/* banner verde de exito post-carga de movimiento */
.ni-banner-ok {
    padding: .55rem .8rem;
    border-radius: var(--jd-radius-md);
    background: color-mix(in srgb, #16a34a 15%, var(--jd-bg-card));
    border: 1px solid color-mix(in srgb, #16a34a 45%, transparent);
    color: var(--jd-text-primary);
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: .85rem;
}
.ni-banner-ok i { color: #16a34a; }
.ni-banner-ok code {
    background: color-mix(in srgb, #16a34a 22%, transparent);
    padding: 1px 6px;
    border-radius: 4px;
    color: var(--jd-text-primary);
    font-weight: 700;
}

/* badge de estado en el hero */
.ni-badge {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .3rem .75rem;
    border-radius: var(--jd-radius-pill);
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.ni-badge-pend {
    background: color-mix(in srgb, #f59e0b 22%, transparent);
    color: #f59e0b;
    border: 1px solid color-mix(in srgb, #f59e0b 40%, transparent);
}
.ni-badge-conf {
    background: color-mix(in srgb, #16a34a 22%, transparent);
    color: #16a34a;
    border: 1px solid color-mix(in srgb, #16a34a 45%, transparent);
}
.ni-badge-anu {
    background: color-mix(in srgb, var(--bs-danger) 20%, transparent);
    color: var(--bs-danger);
    border: 1px solid color-mix(in srgb, var(--bs-danger) 40%, transparent);
}

/* =====================================================================
   INV-02f/f2/g — Modal Datos por linea (seriales + niveles CFG-17)
   ===================================================================== */

/* header custom del modal — con subtitulo del producto y contador cant */
.ni-mod-header {
    background: var(--jd-crimson-dark);
    color: #fff;
    padding: .65rem 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
}
.ni-mod-header-title {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-weight: 700;
}
.ni-mod-header-title small {
    opacity: .85;
    font-weight: 400;
}
.ni-mod-header .btn-close { filter: brightness(0) invert(1); }

/* layout del modal: sidebar + tabla */
.ni-mod-body {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: 0;
    min-height: 380px;
}
@media (max-width: 767px) { .ni-mod-body { grid-template-columns: 1fr; } }

.ni-mod-side {
    padding: .9rem;
    background: var(--jd-bg-card-hover);
    border-right: 1px solid var(--jd-border-color);
    display: flex;
    flex-direction: column;
    gap: .75rem;
}
.ni-mod-main { padding: .9rem; display: flex; flex-direction: column; }

/* toggle seriales unicos con candado (readonly) */
.ni-toggle-block {
    padding: .55rem .7rem;
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-sm);
}
.ni-toggle-block .form-check-input:disabled + label { opacity: 1; }
.ni-toggle-block .form-switch { margin: 0; }
.ni-toggle-block small { color: var(--jd-text-muted); font-size: .7rem; display: block; margin-top: 2px; }
.ni-toggle-block .bi-lock-fill { color: var(--jd-text-disabled); }

/* selector de nivel + input de valor */
.ni-nivel-row {
    display: flex;
    align-items: center;
    gap: .35rem;
    padding: .35rem;
    background: color-mix(in srgb, var(--erp-accent) 6%, var(--jd-bg-card));
    border: 1px solid color-mix(in srgb, var(--erp-accent) 25%, var(--jd-border-color));
    border-radius: var(--jd-radius-sm);
    margin-bottom: .35rem;
}
.ni-nivel-row .nivel-label {
    font-size: .72rem;
    font-weight: 700;
    color: var(--erp-accent);
    padding: .1rem .45rem;
    background: color-mix(in srgb, var(--erp-accent) 20%, transparent);
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: .04em;
    white-space: nowrap;
}
.ni-nivel-row input {
    background: transparent;
    border: 0;
    color: var(--jd-text-primary);
    outline: none;
    font-size: .85rem;
    flex: 1;
    min-width: 0;
}
.ni-nivel-row .btn-remove {
    background: transparent;
    border: 0;
    color: var(--jd-text-muted);
    cursor: pointer;
    padding: 0 .2rem;
    font-size: .95rem;
}
.ni-nivel-row .btn-remove:hover { color: var(--bs-danger); }

/* dropdown "+ agregar nivel" */
.ni-nivel-add {
    padding: .35rem .55rem;
    background: transparent;
    border: 1.5px dashed var(--jd-border-color);
    color: var(--jd-text-muted);
    border-radius: var(--jd-radius-sm);
    width: 100%;
    text-align: center;
    cursor: pointer;
    transition: var(--jd-transition);
    font-size: .78rem;
}
.ni-nivel-add:hover { border-color: var(--jd-crimson); color: var(--jd-crimson); }
.ni-nivel-add:disabled { opacity: .5; cursor: not-allowed; }

/* popover con las opciones de nivel disponibles */
.ni-nivel-popup {
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-sm);
    box-shadow: var(--jd-shadow-md);
    max-height: 200px;
    overflow-y: auto;
}
.ni-nivel-popup button {
    display: block;
    width: 100%;
    text-align: left;
    padding: .4rem .7rem;
    background: transparent;
    border: 0;
    color: var(--jd-text-primary);
    font-size: .82rem;
    cursor: pointer;
    transition: var(--jd-transition);
}
.ni-nivel-popup button:hover { background: var(--jd-bg-card-hover); color: var(--jd-crimson); }

/* input codigo de barras */
.ni-codigo-input-group {
    display: flex;
    gap: 4px;
    align-items: stretch;
}
.ni-codigo-input-group input {
    flex: 1;
    background: var(--jd-bg-card);
    color: var(--jd-text-primary);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-sm);
    padding: .4rem .6rem;
    font-family: monospace;
}
.ni-codigo-input-group .btn-enter {
    background: var(--jd-crimson);
    color: #fff;
    border: 0;
    padding: 0 .8rem;
    border-radius: var(--jd-radius-sm);
    cursor: pointer;
}

/* botones del sidebar */
.ni-mod-side-btn {
    padding: .5rem;
    background: transparent;
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-sm);
    color: var(--jd-text-primary);
    cursor: pointer;
    font-size: .82rem;
    transition: var(--jd-transition);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    width: 100%;
    text-align: center;
}
.ni-mod-side-btn-green {
    background: #16a34a;
    color: #fff;
    border: 0;
    font-weight: 700;
}
.ni-mod-side-btn-green:hover { background: #15803d; }
.ni-mod-side-btn:hover { border-color: var(--jd-crimson); color: var(--jd-crimson); }

/* tabla de seriales agregados */
.ni-serials-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: .4rem;
    border-bottom: 1px solid var(--jd-border-color);
    color: var(--jd-text-primary);
    font-weight: 700;
    font-size: .88rem;
}
.ni-serials-header .count {
    font-size: .78rem;
    color: var(--jd-crimson);
    font-weight: 800;
    background: color-mix(in srgb, var(--jd-crimson) 12%, transparent);
    padding: 2px 8px;
    border-radius: var(--jd-radius-pill);
}
.ni-serials-wrap {
    margin-top: .5rem;
    max-height: 320px;
    overflow-y: auto;
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-sm);
}
.ni-serials-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .82rem;
    margin: 0;
}
.ni-serials-table thead th {
    background: var(--jd-crimson);
    color: #fff;
    text-transform: uppercase;
    font-size: .68rem;
    letter-spacing: .04em;
    padding: .45rem .6rem;
    text-align: left;
    position: sticky; top: 0; z-index: 1;
}
.ni-serials-table tbody td {
    padding: .45rem .6rem;
    border-bottom: 1px solid var(--jd-border-color);
    color: var(--jd-text-primary);
    background: var(--jd-bg-card);
}
.ni-serials-table td.td-cant { text-align: right; font-family: monospace; font-weight: 700; }
.ni-serials-table td.td-code { font-family: monospace; color: var(--jd-crimson); font-weight: 700; }
.ni-serials-table .btn-del {
    background: transparent;
    border: 0;
    color: var(--bs-danger);
    cursor: pointer;
    padding: .2rem .35rem;
    border-radius: var(--jd-radius-sm);
}
.ni-serials-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 2.5rem 1rem;
    color: var(--jd-text-muted);
    gap: .35rem;
}
.ni-serials-empty i { font-size: 2rem; color: var(--jd-text-disabled); }

/* sub-modal de cantidad (INV-02g) — encima del modal seriales */
.ni-cant-dialog {
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    box-shadow: var(--jd-shadow-lg);
    max-width: 320px;
}
.ni-cant-dialog-header {
    background: var(--jd-crimson-dark);
    color: #fff;
    padding: .55rem .9rem;
    font-weight: 700;
    font-size: .9rem;
    border-radius: var(--jd-radius-md) var(--jd-radius-md) 0 0;
}
.ni-cant-dialog-body { padding: 1rem; }
.ni-cant-dialog-body .cod {
    font-size: .8rem;
    color: var(--jd-text-muted);
    margin-bottom: .4rem;
}
.ni-cant-dialog-body .cod code {
    background: color-mix(in srgb, var(--jd-crimson) 12%, transparent);
    color: var(--jd-crimson);
    padding: 2px 8px;
    border-radius: 4px;
    font-weight: 700;
}
.ni-cant-dialog-footer {
    display: flex;
    justify-content: flex-end;
    gap: .5rem;
    padding: .55rem .9rem;
    border-top: 1px solid var(--jd-border-color);
}

/* Buscar Movimientos — tabla del modal */
.ni-mov-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .84rem;
}
.ni-mov-table thead th {
    background: var(--jd-crimson);
    color: #fff;
    text-transform: uppercase;
    font-size: .68rem;
    letter-spacing: .04em;
    padding: .5rem .7rem;
    text-align: left;
    position: sticky; top: 0; z-index: 1;
}
.ni-mov-table tbody td {
    padding: .55rem .7rem;
    border-bottom: 1px solid var(--jd-border-color);
    color: var(--jd-text-primary);
    background: var(--jd-bg-card);
}
.ni-mov-table tbody tr { cursor: pointer; transition: var(--jd-transition); }
.ni-mov-table tbody tr:hover td { background: var(--jd-bg-card-hover); }
.ni-mov-table tbody tr.hit td {
    background: color-mix(in srgb, var(--erp-accent) 12%, var(--jd-bg-card));
    color: var(--jd-text-primary);
}
.ni-mov-table td.td-code { font-family: monospace; color: var(--jd-crimson); font-weight: 700; }
.ni-mov-table td.td-badge span {
    font-size: .68rem;
    padding: 2px 8px;
    border-radius: var(--jd-radius-pill);
    font-weight: 800;
    text-transform: uppercase;
}
.ni-mov-fin {
    text-align: center;
    padding: .8rem;
    color: var(--jd-text-muted);
    font-size: .78rem;
    border-top: 1px dotted var(--jd-border-color);
    background: var(--jd-bg-card);
}

/* lista simple para el sub-modal de almacenes */
.ni-alm-list {
    display: flex;
    flex-direction: column;
    gap: .3rem;
    max-height: 340px;
    overflow-y: auto;
}
.ni-alm-item {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .55rem .8rem;
    background: var(--jd-bg-card-hover);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-sm);
    cursor: pointer;
    text-align: left;
    transition: var(--jd-transition);
    width: 100%;
}
.ni-alm-item:hover { border-color: var(--jd-crimson); background: var(--jd-bg-card); }
.ni-alm-item-code {
    font-family: monospace;
    font-weight: 800;
    color: var(--jd-crimson);
    background: color-mix(in srgb, var(--jd-crimson) 10%, transparent);
    padding: 2px 8px;
    border-radius: 4px;
    font-size: .82rem;
}
.ni-alm-item-name { flex: 1; color: var(--jd-text-primary); font-weight: 600; }
.ni-alm-count {
    font-size: .78rem;
    color: var(--jd-text-muted);
    padding: .3rem .1rem;
}

/* =====================================================================
   INV-02h/j — Ajustes modal seriales (Cant Total verde, campos verticales)
   ===================================================================== */

/* cantidad total en el header derecho */
.ni-serials-header .cant-total {
    font-size: .82rem;
    color: #16a34a;
    font-weight: 800;
    display: flex;
    align-items: center;
    gap: .35rem;
}
.ni-serials-header .cant-total i { font-size: 1rem; }

/* nivel como campo vertical (INV-02h): label arriba, input abajo, sin bg azul */
.ni-nivel-vert {
    margin-bottom: .65rem;
}
.ni-nivel-vert label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: .68rem;
    font-weight: 700;
    color: var(--jd-text-muted);
    text-transform: uppercase;
    letter-spacing: .04em;
    margin-bottom: 3px;
}
.ni-nivel-vert label .btn-remove {
    background: transparent;
    border: 0;
    color: var(--jd-text-muted);
    cursor: pointer;
    font-size: .8rem;
    padding: 0 .2rem;
}
.ni-nivel-vert label .btn-remove:hover { color: var(--bs-danger); }
.ni-nivel-vert input {
    width: 100%;
    padding: .35rem .55rem;
    background: var(--jd-bg-card);
    color: var(--jd-text-primary);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-sm);
    font-size: .85rem;
}
.ni-nivel-vert input:focus {
    border-color: var(--jd-crimson);
    outline: none;
}

/* input codigo de barras con foco activo */
.ni-codigo-input-group input:focus {
    border-color: var(--erp-accent);
    outline: none;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--erp-accent) 20%, transparent);
}

/* cantidad en verde en la tabla */
.ni-serials-table td.td-cant-green {
    text-align: right;
    font-family: monospace;
    font-weight: 700;
    color: #16a34a;
}

/* toggle seriales unicos ON (verde) */
.ni-toggle-block .form-check-input:checked {
    background-color: #16a34a;
    border-color: #16a34a;
}
.ni-toggle-block .toggle-hint-on {
    color: #16a34a;
    font-weight: 700;
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .04em;
}

/* zona importar Excel (INV-02i/ia) */
.ni-excel-drop {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1rem .7rem;
    background: color-mix(in srgb, #16a34a 8%, var(--jd-bg-card));
    border: 2px dashed #16a34a;
    border-radius: var(--jd-radius-md);
    text-align: center;
    gap: .4rem;
}
.ni-excel-drop i {
    font-size: 1.8rem;
    color: #16a34a;
}
.ni-excel-drop .title {
    font-weight: 800;
    color: var(--jd-text-primary);
    font-size: .82rem;
}
.ni-excel-drop small {
    color: var(--jd-text-muted);
    font-size: .68rem;
    line-height: 1.4;
}
.ni-excel-drop .btn-select {
    background: #16a34a;
    color: #fff;
    border: 0;
    padding: .4rem .85rem;
    font-weight: 700;
    font-size: .78rem;
    border-radius: var(--jd-radius-sm);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    margin-top: .3rem;
}
.ni-excel-drop .btn-select:hover { background: #15803d; }

/* banner de excel importado exitoso */
.ni-excel-ok {
    display: flex;
    align-items: center;
    gap: .35rem;
    padding: .45rem .7rem;
    background: color-mix(in srgb, #16a34a 15%, var(--jd-bg-card));
    border: 1px solid color-mix(in srgb, #16a34a 40%, transparent);
    color: var(--jd-text-primary);
    font-size: .78rem;
    border-radius: var(--jd-radius-sm);
    margin-top: .5rem;
}
.ni-excel-ok i { color: #16a34a; }

/* =====================================================================
   INV-02b/l — Modal exito guardar/actualizar
   ===================================================================== */

.ni-ok-modal-body {
    text-align: center;
    padding: 1.8rem 1.5rem 1.5rem;
}
.ni-ok-check {
    width: 68px;
    height: 68px;
    border-radius: 50%;
    background: #16a34a;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
    font-size: 2rem;
    box-shadow: 0 4px 24px color-mix(in srgb, #16a34a 45%, transparent);
}
.ni-ok-title {
    font-weight: 800;
    font-size: 1.1rem;
    color: var(--jd-text-primary);
    margin-bottom: .35rem;
}
.ni-ok-info {
    color: var(--jd-text-muted);
    font-size: .88rem;
    line-height: 1.6;
    margin-bottom: 1.1rem;
}
.ni-ok-info strong { color: var(--jd-crimson); font-family: monospace; font-size: 1rem; }
.ni-ok-actions {
    display: flex;
    flex-direction: column;
    gap: .5rem;
}
.ni-ok-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    background: var(--erp-accent);
    color: #fff;
    border: 0;
    padding: .7rem 1rem;
    font-weight: 700;
    font-size: .95rem;
    border-radius: var(--jd-radius-md);
    cursor: pointer;
    transition: var(--jd-transition);
    text-decoration: none;
}
.ni-ok-btn:hover { background: var(--erp-accent-strong); color: #fff; }
.ni-ok-btn-outline {
    background: transparent;
    color: var(--jd-text-primary);
    border: 1px solid var(--jd-border-color);
}
.ni-ok-btn-outline:hover { background: var(--jd-bg-card-hover); color: var(--jd-crimson); border-color: var(--jd-crimson); }

/* =====================================================================
   INV-05 — Reporte de Stock
   ===================================================================== */

.stk-wrap {
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    overflow: hidden;
}
.stk-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .7rem 1rem;
    background: var(--jd-bg-card-hover);
    border-bottom: 1px solid var(--jd-border-color);
    gap: .5rem;
    flex-wrap: wrap;
}
.stk-toolbar-title {
    display: flex;
    align-items: center;
    gap: .45rem;
    color: var(--jd-text-primary);
    font-weight: 700;
    font-size: .95rem;
}
.stk-toolbar-title i { color: var(--jd-crimson); }
.stk-toolbar-actions {
    display: flex;
    align-items: center;
    gap: .55rem;
    flex-wrap: wrap;
}
.stk-toggle-lbl {
    display: flex;
    align-items: center;
    gap: .3rem;
    font-size: .78rem;
    color: var(--jd-text-primary);
    padding: .35rem .5rem;
    background: var(--jd-bg-card);
    border-radius: var(--jd-radius-sm);
}
.stk-toggle-lbl .form-check-input { margin: 0; cursor: pointer; }

/* tabs de stock */
.stk-tabs {
    display: flex;
    gap: .25rem;
    padding: .5rem 1rem 0;
    background: var(--jd-bg-card-hover);
    border-bottom: 1px solid var(--jd-border-color);
    overflow-x: auto;
}
.stk-tab {
    background: transparent;
    border: 0;
    padding: .55rem .95rem;
    color: var(--jd-text-muted);
    font-weight: 700;
    font-size: .82rem;
    cursor: pointer;
    border-bottom: 3px solid transparent;
    transition: var(--jd-transition);
    display: flex;
    align-items: center;
    gap: .35rem;
    white-space: nowrap;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.stk-tab:hover { color: var(--jd-text-primary); }
.stk-tab.active {
    color: var(--jd-crimson);
    border-bottom-color: var(--jd-crimson);
}
.stk-tab small {
    font-size: .65rem;
    color: var(--jd-text-muted);
    text-transform: uppercase;
    font-weight: 500;
    letter-spacing: .04em;
}

/* tabla */
.stk-body { padding: 0; }
.stk-table-wrap { overflow-x: auto; }
.stk-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .85rem;
    margin: 0;
}
.stk-table thead th {
    background: var(--jd-crimson);
    color: #fff;
    text-transform: uppercase;
    font-size: .68rem;
    letter-spacing: .04em;
    padding: .6rem .8rem;
    text-align: left;
    position: sticky; top: 0; z-index: 2;
}
.stk-table thead th.th-num { text-align: right; }
.stk-table tbody td {
    padding: .55rem .8rem;
    border-bottom: 1px solid var(--jd-border-color);
    color: var(--jd-text-primary);
    background: var(--jd-bg-card);
}
.stk-table tbody tr:hover td { background: var(--jd-bg-card-hover); }
.stk-table td.td-code { font-family: monospace; color: var(--jd-crimson); font-weight: 700; }
.stk-table td.td-num  { text-align: right; font-variant-numeric: tabular-nums; }
.stk-table tr.stk-row-neg td.td-num { color: var(--erp-num-neg); font-weight: 700; }
.stk-table tr.stk-row-zero td { opacity: .65; }

/* estado vacio */
.stk-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3.5rem 1rem;
    color: var(--jd-text-muted);
    gap: .5rem;
    text-align: center;
}
.stk-empty i { font-size: 2.4rem; color: var(--jd-text-disabled); opacity: .55; }

/* footer con stats */
.stk-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .55rem 1rem;
    background: var(--jd-bg-card-hover);
    border-top: 1px solid var(--jd-border-color);
    color: var(--jd-text-muted);
    font-size: .8rem;
    flex-wrap: wrap;
}
.stk-stats {
    display: flex;
    gap: 1.5rem;
    align-items: center;
}
.stk-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1.1;
}
.stk-stat-label {
    font-size: .65rem;
    color: var(--jd-text-muted);
    text-transform: uppercase;
    letter-spacing: .04em;
}
.stk-stat-value {
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--jd-text-primary);
}
.stk-stat-value.neg { color: var(--erp-num-neg); }

/* badges de estado en tabla stock (mockup INV-09e) */
.stk-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: var(--jd-radius-pill);
    font-size: .65rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
    white-space: nowrap;
}
.stk-badge-ok  { background: color-mix(in srgb, #16a34a 22%, transparent); color: #16a34a; border: 1px solid color-mix(in srgb, #16a34a 40%, transparent); }
.stk-badge-low { background: color-mix(in srgb, #f59e0b 22%, transparent); color: #f59e0b; border: 1px solid color-mix(in srgb, #f59e0b 40%, transparent); }
.stk-badge-neg { background: color-mix(in srgb, var(--bs-danger) 22%, transparent); color: var(--bs-danger); border: 1px solid color-mix(in srgb, var(--bs-danger) 40%, transparent); }

/* fila bajo minimo (naranja suave) */
.stk-table tr.stk-row-low td { background: color-mix(in srgb, #f59e0b 8%, var(--jd-bg-card)); }

/* boton relojito para abrir kardex */
.stk-btn-kardex {
    background: transparent;
    border: 1px solid var(--jd-border-color);
    color: var(--erp-accent);
    padding: .2rem .45rem;
    border-radius: 50%;
    cursor: pointer;
    font-size: .85rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: var(--jd-transition);
    width: 28px;
    height: 28px;
}
.stk-btn-kardex:hover { background: color-mix(in srgb, var(--erp-accent) 15%, transparent); border-color: var(--erp-accent); }

/* boton "i" para abrir detalle guia (habilitado o gris deshabilitado) */
.stk-btn-i {
    background: transparent;
    border: 0;
    color: var(--erp-accent);
    cursor: pointer;
    font-size: 1.05rem;
    padding: .1rem .3rem;
    transition: var(--jd-transition);
}
.stk-btn-i:hover { color: var(--erp-accent); transform: scale(1.1); }
.stk-btn-i.off, .stk-btn-i:disabled { color: var(--jd-text-disabled); cursor: default; }
.stk-btn-i.off:hover { transform: none; }

/* link a la OT en la tabla kardex */
.stk-table td .td-ot,
.stk-table td.td-ot {
    color: var(--erp-accent);
    font-weight: 700;
    font-family: monospace;
    text-decoration: none;
}
.stk-table td .td-ot:hover { text-decoration: underline; }

/* =====================================================================
   INV-07 — Nota de Salida (usa mismas clases que INV-02, extras solo)
   ===================================================================== */

/* pill de tipo de movimiento en el modal de seleccion */
.ns-tmv-item {
    display: flex;
    align-items: center;
    gap: .8rem;
    padding: .6rem .85rem;
    background: var(--jd-bg-card-hover);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-sm);
    cursor: pointer;
    text-align: left;
    transition: var(--jd-transition);
    width: 100%;
}
.ns-tmv-item:hover { border-color: var(--jd-crimson); background: var(--jd-bg-card); }
.ns-tmv-item-code {
    font-family: monospace;
    font-weight: 800;
    color: var(--jd-crimson);
    background: color-mix(in srgb, var(--jd-crimson) 10%, transparent);
    padding: 2px 8px;
    border-radius: 4px;
    font-size: .82rem;
    min-width: 44px;
    text-align: center;
}
.ns-tmv-item-name { flex: 1; color: var(--jd-text-primary); font-weight: 600; }

/* =====================================================================
   INV-07f/g/h — Extras para Nota de Salida
   ===================================================================== */

/* stock disponible en la card del detalle NS (verde) */
.ns-stock-line {
    font-size: .78rem;
    margin-top: 3px;
    display: flex;
    align-items: center;
    gap: .3rem;
    font-weight: 600;
}
.ns-stock-line i { font-size: .85rem; }

/* header verde del modal exito NS (INV-07h) */
.ns-ok-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .65rem 1rem;
    background: #16a34a;
    color: #fff;
    font-weight: 700;
    font-size: .95rem;
    border-radius: var(--jd-radius-md) var(--jd-radius-md) 0 0;
}
.ns-ok-head .btn-close { filter: brightness(0) invert(1); }
.ns-ok-head i { font-size: 1.1rem; }

/* =====================================================================
   INV-08 — Reporte de Movimientos (badges, agrupacion visual)
   ===================================================================== */

/* tabla movimientos ancha */
.stk-table.mov-table th,
.stk-table.mov-table td {
    font-size: .8rem;
    padding: .45rem .5rem;
}

/* filas encabezado por almacen */
.stk-table tr.mov-alm-row td.mov-alm-title {
    background: color-mix(in srgb, var(--erp-accent) 15%, var(--jd-bg-card-hover));
    color: var(--jd-text-primary);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-size: .78rem;
    padding: .5rem .8rem;
    border-top: 2px solid var(--erp-accent);
    border-bottom: 1px solid var(--jd-border-color);
}
.stk-table tr.mov-alm-row td.mov-alm-title i { color: var(--erp-accent); }

/* agrupamiento por nro_guia — ING azul claro, SAL violeta claro */
.stk-table tr.mov-grp-ing td { background: var(--jd-bg-card); }
.stk-table tr.mov-grp-ing td.td-code { color: var(--jd-text-primary) !important; }

.stk-table tr.mov-grp-sal td { background: var(--jd-bg-card-hover); }
.stk-table tr.mov-grp-sal td.td-code { color: var(--jd-text-secondary) !important; }

/* =====================================================================
   INV-05i — Boton Valorizacion (ambar tal como el mockup)
   ===================================================================== */
.btn-valorizar {
    background: #f59e0b;
    color: #fff;
    border: 0;
    font-weight: 700;
    padding: .35rem .8rem;
    border-radius: var(--jd-radius-sm);
    font-size: .82rem;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    transition: var(--jd-transition);
}
.btn-valorizar:hover { background: var(--erp-accent-strong); color: #fff; }
.btn-valorizar:disabled { background: var(--jd-text-disabled); cursor: not-allowed; opacity: .6; }

/* stat valor total */
.stk-stat-value[id="statValor"] { color: var(--jd-text-primary); }

/* boton Valorizacion en estado ACTIVO (post-click, mockup INV-05l) */
.btn-valorizar.active {
    background: #b45309;
    color: #fff;
    box-shadow: 0 0 0 2px color-mix(in srgb, #b45309 40%, transparent);
}
.btn-valorizar.active:hover { background: #92400e; }

/* card highlighted primero (TES-00) */
.erp-mod-card-primary {
    border: 2px solid var(--jd-crimson);
    box-shadow: 0 4px 18px color-mix(in srgb, var(--jd-crimson) 22%, transparent);
}

/* =====================================================================
   INV-KV01 — Kardex Valorizado (saldo anterior amarillo + badges rotacion)
   ===================================================================== */

/* fila header producto dentro del kardex */
.stk-table tr.kv-prod-row td.kv-prod-title {
    background: color-mix(in srgb, #64748b 12%, var(--jd-bg-card-hover));
    color: var(--jd-text-primary);
    padding: .45rem .8rem;
    font-weight: 700;
    border-bottom: 1px solid var(--jd-border-color);
}
.stk-table tr.kv-prod-row td.kv-prod-title code {
    background: color-mix(in srgb, var(--jd-crimson) 12%, transparent);
    color: var(--jd-crimson);
    padding: 1px 6px;
    border-radius: 4px;
    font-size: .82rem;
}

/* fila saldo anterior (amarillo suave) */
.stk-table tr.kv-saldo-anterior td {
    background: color-mix(in srgb, #f59e0b 12%, var(--jd-bg-card));
    font-style: italic;
}

/* badges rotacion (Alta / Normal / Lento / Inmovilizado) */
.stk-badge-alta {
    background: color-mix(in srgb, #f59e0b 22%, transparent);
    color: #f59e0b;
    border: 1px solid color-mix(in srgb, #f59e0b 40%, transparent);
}
.stk-badge-inm {
    background: color-mix(in srgb, #64748b 20%, transparent);
    color: var(--jd-text-primary);
    border: 1px solid color-mix(in srgb, #64748b 40%, transparent);
}

/* =====================================================================
   TES — Tesoreria (filtros, empty, cards resumen, boton teal)
   ===================================================================== */

/* boton verde-azulado del CONSULTAR (TES-06) */
.btn-teal {
    background: var(--erp-accent);
    color: #fff;
    border: 0;
    padding: .35rem .8rem;
    font-size: .82rem;
    border-radius: var(--jd-radius-sm);
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    transition: var(--jd-transition);
}
.btn-teal:hover { background: var(--erp-accent-strong); color: #fff; }

/* filtros en linea (Año / Mes / Banco / Cuenta) */
.tes-filtros {
    display: grid;
    grid-template-columns: 100px 130px 1fr 1fr;
    gap: .75rem;
    padding: .75rem 1rem;
    background: var(--jd-bg-card-hover);
    border-bottom: 1px solid var(--jd-border-color);
}
@media (max-width: 767px) {
    .tes-filtros { grid-template-columns: 1fr 1fr; }
}

/* empty state con icono grande centrado (TES-06) */
.tes-empty {
    padding: 3.5rem 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    text-align: center;
    color: var(--jd-text-primary);
}
.tes-empty-icon {
    width: 68px;
    height: 68px;
    background: color-mix(in srgb, #f59e0b 18%, var(--jd-bg-card-hover));
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: #f59e0b;
    margin-bottom: .5rem;
}
.tes-empty small { display: block; color: var(--jd-text-muted); font-size: .8rem; }

/* subheader del modal detalle bancos */
.tes-subheader {
    background: var(--jd-bg-card-hover);
    padding: .5rem .75rem;
    border-radius: var(--jd-radius-sm);
    font-size: .85rem;
}

/* cards de egresos (TES-03) */
.tes-eg-cards {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 1rem;
}
@media (max-width: 767px) {
    .tes-eg-cards { grid-template-columns: 1fr; }
}
.tes-eg-card {
    background: var(--jd-bg-card);
    border: 2px solid color-mix(in srgb, var(--bs-danger) 30%, transparent);
    border-radius: var(--jd-radius-md);
    padding: 1rem 1.25rem;
    text-align: center;
    transition: var(--jd-transition);
}
.tes-eg-card:hover { border-color: var(--bs-danger); }
.tes-eg-monto {
    font-size: 1.85rem;
    font-weight: 800;
    color: var(--bs-danger);
    line-height: 1.1;
}
.tes-eg-label {
    color: var(--jd-text-muted);
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    margin-top: 4px;
}

/* =====================================================================
   TES-11 — Activos internos (cards + tabla + badges origen)
   ===================================================================== */

.tes-act-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
}
@media (max-width: 991px) { .tes-act-cards { grid-template-columns: 1fr 1fr; } }
@media (max-width: 575px) { .tes-act-cards { grid-template-columns: 1fr; } }

.tes-act-card {
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    padding: 1rem 1.25rem;
    text-align: center;
    transition: var(--jd-transition);
}
.tes-act-card:hover { border-color: var(--jd-crimson); }
.tes-act-card.highlighted {
    border: 2px solid var(--jd-crimson);
    background: color-mix(in srgb, var(--jd-crimson) 5%, var(--jd-bg-card));
}
.tes-act-num {
    font-size: 1.6rem;
    font-weight: 800;
    color: var(--jd-text-primary);
    line-height: 1.1;
}
.tes-act-card.highlighted .tes-act-num { color: var(--jd-crimson); }
.tes-act-label {
    color: var(--jd-text-muted);
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    margin-top: 4px;
}

/* badges de origen del activo */
.tes-badge-origen {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: 3px 8px;
    border-radius: var(--jd-radius-pill);
    font-size: .68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.tes-badge-oc {
    background: color-mix(in srgb, var(--erp-accent) 18%, transparent);
    color: var(--erp-accent);
    border: 1px solid color-mix(in srgb, var(--erp-accent) 40%, transparent);
    font-family: monospace;
}
.tes-badge-manual {
    background: color-mix(in srgb, #f59e0b 18%, transparent);
    color: #b45309;
    border: 1px solid color-mix(in srgb, #f59e0b 40%, transparent);
}

/* fila de activo dado de baja (atenuada) */
.stk-table tr.tes-row-baja td {
    opacity: .55;
    background: color-mix(in srgb, var(--bs-danger) 5%, var(--jd-bg-card));
}

/* =====================================================================
   TES-10 — Super Reporte de Costos por CC (KPI + bloques)
   ===================================================================== */

.tes-kpi-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    margin-bottom: 1.25rem;
}
@media (max-width: 991px) { .tes-kpi-row { grid-template-columns: 1fr 1fr; } }
@media (max-width: 575px) { .tes-kpi-row { grid-template-columns: 1fr; } }

/* KPIs de centros de costo en superficie neutra; el total se distingue por peso, no por color */
.tes-kpi {
    background: var(--jd-bg-card-hover);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-md);
    padding: 1rem 1.25rem;
    color: var(--jd-text-primary);
    position: relative;
    overflow: hidden;
}
.tes-kpi-total { background: var(--jd-bg-card); border-color: var(--jd-border-color-hover, var(--jd-border-color)); }
.tes-kpi-total .tes-kpi-label { color: var(--erp-accent); }

.tes-kpi-label {
    font-size: .68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--jd-text-muted);
}
.tes-kpi-val {
    font-size: 1.7rem;
    font-weight: 800;
    line-height: 1.15;
    margin: .35rem 0;
}
.tes-kpi-sub {
    font-size: .7rem;
    color: var(--jd-text-muted);
}

/* bloques del reporte */
.tes-bloque {
    background: var(--jd-bg-card);
    border-radius: var(--jd-radius-md);
    overflow: hidden;
    margin-bottom: 1rem;
    border: 1px solid var(--jd-border-color);
}
.tes-bloque-head {
    padding: .65rem 1rem;
    background: var(--jd-bg-card-hover);
    color: var(--erp-accent);
    border-bottom: 1px solid var(--jd-border-color);
    font-weight: 700;
    font-size: .9rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
}
.tes-bloque-head .tes-bloque-total {
    font-family: monospace;
    font-weight: 800;
    background: var(--jd-bg-card);
    border: 1px solid var(--jd-border-color);
    color: var(--jd-text-primary);
    padding: 3px 12px;
    border-radius: var(--jd-radius-pill);
}

.tes-bloque-body table { margin: 0; }

/* =====================================================================
   TES-08 — Estado de Resultados
   ===================================================================== */

.tes-ec-header {
    background: var(--jd-bg-card-hover);
    border-bottom: 1px solid var(--jd-border-color);
}
.tes-ec-empresa {
    font-size: 1.6rem;
    font-weight: 800;
    color: var(--jd-text-primary);
    letter-spacing: .05em;
}
.tes-ec-periodo {
    color: var(--jd-text-muted);
    font-size: .95rem;
    margin-top: 2px;
}
.tes-ec-section { margin: 0 1.5rem 1rem; }
/* titulo de seccion del estado de resultados, superficie neutra con el acento solo en el texto */
.tes-ec-section-title {
    background: var(--jd-bg-card-hover);
    color: var(--erp-accent);
    padding: .5rem .95rem;
    font-weight: 800;
    letter-spacing: .04em;
    font-size: .85rem;
    text-transform: uppercase;
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-sm) var(--jd-radius-sm) 0 0;
}
.tes-ec-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .6rem 1rem;
    border-bottom: 1px solid var(--jd-border-color);
    background: var(--jd-bg-card);
}
.tes-ec-lbl { color: var(--jd-text-primary); }
.tes-ec-val {
    font-family: monospace;
    font-weight: 700;
    color: var(--jd-text-primary);
    font-size: 1rem;
    min-width: 130px;
    text-align: right;
}
/* los importes q restan van en rojo claro, el resto en blanco. el color fuerte solo en las etiquetas */
.tes-ec-neg { color: var(--erp-num-neg); }
.tes-ec-total {
    background: var(--jd-bg-card-hover);
    font-weight: 800;
}
.tes-ec-total .tes-ec-lbl { color: var(--erp-accent); text-transform: uppercase; letter-spacing: .04em; font-size: .82rem; }
.tes-ec-total .tes-ec-val { color: var(--jd-text-primary); font-size: 1.1rem; }
.tes-ec-total-cv,
.tes-ec-total-go { background: var(--jd-bg-card-hover); }
.tes-ec-total-cv .tes-ec-lbl,
.tes-ec-total-go .tes-ec-lbl { color: var(--erp-accent); }
.tes-ec-total-cv .tes-ec-val,
.tes-ec-total-go .tes-ec-val { color: var(--erp-num-neg); }

/* filas de utilidad, se destacan con superficie y peso; la etiqueta lleva el acento */
.tes-ec-utilidad {
    background: var(--jd-bg-card-hover);
    border: 1px solid var(--jd-border-color);
    border-radius: var(--jd-radius-sm);
    padding: .75rem 1rem;
}
.tes-ec-utilidad .tes-ec-lbl { color: var(--erp-accent); font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.tes-ec-utilidad .tes-ec-val { color: var(--jd-text-primary); font-size: 1.2rem; }
.tes-ec-utilidad-neg .tes-ec-val { color: var(--erp-num-neg); }

.tes-ec-margen {
    padding: .25rem 1rem .5rem;
    font-size: .78rem;
    color: var(--jd-text-muted);
    text-align: right;
}
.tes-ec-sub {
    padding: .35rem 1rem;
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
    font-size: .78rem;
    color: var(--jd-text-muted);
    background: var(--jd-bg-card-hover);
    border-bottom: 1px solid var(--jd-border-color);
}
.tes-ec-sub strong { color: var(--jd-text-primary); }

/* impresion — quita chrome del navegador */
@media print {
    body.with-sidebar { background: #fff !important; }
    aside, header, .stk-toolbar, .stk-toolbar-actions, .erp-page-back, .admin-hero { display: none !important; }
    .stk-wrap { border: 0 !important; box-shadow: none !important; }
    .tes-ec-empresa, .tes-ec-lbl, .tes-ec-val { color: #000 !important; }
    .tes-kpi { color: #fff !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
    .tes-bloque-head { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}





