.material-switch > input[type="checkbox"] {        
    display: none;  
    height: 0;
}
    .material-switch > label {
    cursor: pointer;
    height: 0px;
    position: relative; 
    width: 50px;  
}
    .material-switch > label::before {
    background: rgb(0, 0, 0);
    box-shadow: inset 0px 0px 10px rgba(0, 0, 0, 0.5);
    border-radius: 8px;
    content: '';
    height: 16px;
    margin-top: 25px;
    position:absolute;
    opacity: 0.3;
    transition: all 0.4s ease-in-out;
    width: 50px;
}
    .material-switch > label::after {
    background: rgb(255, 255, 255);
    border-radius: 16px;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
    content: '';
    height: 24px;
    left: -4px;
    margin-top: 25px;
    position: absolute;
    top: -4px;
    transition: all 0.3s ease-in-out;
    width: 24px;
}
    .material-switch > input[type="checkbox"]:checked + label::before {
    background: inherit;
    opacity: 0.5;
}
    .material-switch > input[type="checkbox"]:checked + label::after {
    background: inherit;
    left: 30px;
}

    /* Agregando Inputs */
    .input-group {width: 100%;}
    .input-group-addon { min-width: 180px;text-align: right;}    
    
    /* Estilos Comprobante*/
    .clase_tahoma{
        /*font-family: Helvetica, Verdana, Segoe, sans-serif;
        //font-family: italic normal 400 16px/22px Arial, Verdana, Sans-serif;*/
        font-size: 13px;
    }    
    .panel-title{
        font-size: 13px;
        font-weight: bold;
    }    
    
    
    /* AGREGADO VALIDA */    
    .fila-base{
        display: none;        
    }                	
     /* SPAN */     
    #btnEdit{
      margin:-10px 0 0 20px;
    }        

    .btn_buscar{
        margin-top: 10px;
    }


    @media (min-width:0px) {
       .btn_buscar {
           margin-top: 8px;
           width: 100px;
           font-size: 13px;
        }
       .input_cliente{
           width: 330px;
       }
       .input_busqueda{
           width: 240px;            
       }

       }    
    @media (min-width: 768px) {
        .btn_buscar {
           margin-top: 8px;
           width: 100px;
           font-size: 13px;
        }
        .input_cliente{
           width: 250px;
       }
       .input_busqueda{
           width: 240px;            
       }

    }
    @media (min-width: 992px) {
        .btn_buscar {
           margin-top: 8px;
           width: 100px;
           font-size: 13px;
        }
       .input_cliente{
           width: 230px;
       }
       .input_busqueda{
           width: 240px;            
       }
    }
    @media (min-width: 1200px) {
       .btn_buscar {
           margin-top: 8px;
           width: 100px;
           font-size: 13px;
        }
       .input_cliente{
           width: 300px;
       }
       .input_busqueda{
           width: 240px;            
       }
    }

    @media (min-width: 1300px) {
       .btn_buscar {
           margin-top: 8px;
           width: 100px;
           font-size: 13px;
    }
       .input_cliente{
           width: 330px;
       }
       .input_busqueda{
           width: 240px;            
       }
    }

    @media (min-width: 1500px) {
       .btn_buscar {
           margin-top: 8px;
           width: 100px;
           font-size: 13px;
    }
       .input_cliente{
           width: 300px;
       }
       .input_busqueda{
           width: 240px;            
       }
    }
    
    @media (min-width: 1600px) {
       .btn_buscar {
           margin-top: 8px;
           width: 100px;
           font-size: 13px;
    }
       .input_cliente{
           width: 480px;
       }
       .input_busqueda{
           width: 280px;            
       }
    }

   @media (min-width: 1900px) {
       .btn_buscar {
           margin-top: 8px;
           width: 100px;
           font-size: 13px;
    }
       .input_cliente{
           width: 680px;
       }
       .input_busqueda{
           width: 250px;            
       }
    }

    #formComprobante .comprobante-accion-generar,
    .comprobante-accion-generar {
        width: 100%;
        margin-top: 40px;
        padding-top: 28px;
        padding-bottom: 12px;
        border-top: 1px solid #d5e8f3;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
    }

    #formComprobante #guardar.btn-generar-comprobante,
    #formComprobante #guardar2.btn-generar-comprobante,
    .btn-generar-comprobante {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        gap: 10px;
        min-width: 320px;
        padding: 14px 36px;
        font-size: 16px;
        font-weight: 600;
        letter-spacing: 0.3px;
        color: #fff !important;
        background-color: #27ae60 !important;
        background-image: none !important;
        border: none !important;
        border-radius: 8px;
        box-shadow: 0 4px 14px rgba(39, 174, 96, 0.4);
        transition: all 0.2s ease-in-out;
        float: none !important;
        width: auto !important;
    }

    #formComprobante #guardar.btn-generar-comprobante:hover,
    #formComprobante #guardar.btn-generar-comprobante:focus,
    #formComprobante #guardar2.btn-generar-comprobante:hover,
    #formComprobante #guardar2.btn-generar-comprobante:focus,
    .btn-generar-comprobante:hover,
    .btn-generar-comprobante:focus {
        color: #fff !important;
        background-color: #219653 !important;
        box-shadow: 0 6px 18px rgba(39, 174, 96, 0.5);
        transform: translateY(-1px);
        outline: none;
    }

    #formComprobante #guardar.btn-generar-comprobante:active,
    #formComprobante #guardar2.btn-generar-comprobante:active,
    .btn-generar-comprobante:active {
        transform: translateY(0);
        background-color: #1e8449 !important;
        box-shadow: 0 2px 8px rgba(39, 174, 96, 0.35);
    }

    #formComprobante #guardar.btn-generar-comprobante .glyphicon,
    #formComprobante #guardar2.btn-generar-comprobante .glyphicon,
    .btn-generar-comprobante .glyphicon {
        font-size: 18px;
        top: 0;
    }

    .comprobante-items-wrap {
        width: 100%;
        overflow-x: auto;
        overflow-y: visible;
        margin-bottom: 10px;
    }

    .comprobante-items-wrap .chosen-container {
        width: 100% !important;
    }

    .comprobante-items-wrap .chosen-container .chosen-drop {
        z-index: 10080;
    }

    @media (min-width: 992px) {
        .comprobante-items-wrap {
            overflow: visible;
        }
    }

    .comprobante-form-panel.comprobante-form-panel--conceptos {
        overflow: visible;
    }

    .comprobante-form-panel.comprobante-form-panel--conceptos .comprobante-form-panel-body {
        overflow: visible;
    }

    #tabla.table-comprobante-items {
        width: 100%;
        min-width: 980px;
        table-layout: fixed;
        margin-bottom: 0;
    }

    #tabla.table-comprobante-items thead th {
        font-size: 12px;
        font-weight: 600;
        vertical-align: middle;
        padding: 8px 6px;
        border-bottom: 2px solid #bce8f1 !important;
        white-space: nowrap;
    }

    #tabla.table-comprobante-items thead th.col-item-pres,
    #tabla.table-comprobante-items thead th.col-item-cant,
    #tabla.table-comprobante-items thead th.col-item-igv,
    #tabla.table-comprobante-items thead th.col-item-precio,
    #tabla.table-comprobante-items thead th.col-item-btn,
    #tabla.table-comprobante-items thead th.col-item-descuento,
    #tabla.table-comprobante-items thead th.col-item-total {
        text-align: center;
    }

    #tabla.table-comprobante-items thead th.col-item-desc {
        text-align: left;
    }

    #tabla.table-comprobante-items tbody td {
        vertical-align: middle;
        padding: 6px;
        border-top: 1px solid #eef5f9 !important;
    }

    #tabla.table-comprobante-items .form-control {
        width: 100%;
        min-height: 34px;
        padding: 6px 8px;
        font-size: 13px;
    }

    #tabla.table-comprobante-items .col-item-desc {
        width: 34%;
        min-width: 280px;
    }

    #tabla.table-comprobante-items .col-item-medida {
        width: 0;
        display: none;
        padding: 0;
        border: 0 !important;
    }

    #tabla.table-comprobante-items .col-item-pres {
        width: 11%;
        min-width: 100px;
    }

    #tabla.table-comprobante-items .col-item-cant {
        width: 7%;
        min-width: 70px;
        text-align: center;
    }

    #tabla.table-comprobante-items .input-cantidad-centro {
        text-align: center;
    }

    #tabla.table-comprobante-items .col-item-precio,
    #tabla.table-comprobante-items .col-item-total {
        text-align: center;
    }

    #tabla.table-comprobante-items .input-moneda-wrap {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        max-width: 100%;
    }

    #tabla.table-comprobante-items .input-moneda-simbolo {
        flex-shrink: 0;
        margin-right: 4px;
        font-size: 13px;
        font-weight: 600;
        color: #555;
        line-height: 1;
    }

    #tabla.table-comprobante-items .input-monto-centro {
        text-align: center;
        flex: 1;
        min-width: 0;
        padding-left: 6px;
        padding-right: 6px;
    }

    #tabla.table-comprobante-items .col-item-igv {
        width: 15%;
        min-width: 150px;
        max-width: 180px;
        overflow: visible;
        position: relative;
        z-index: 2;
    }

    #tabla.table-comprobante-items .col-item-igv select.tipo_igv {
        width: 100%;
        min-height: 34px;
        padding: 4px 6px;
        font-size: 12px;
        cursor: pointer;
        position: relative;
        z-index: 3;
    }

    #tabla.table-comprobante-items .col-item-igv select.tipo_igv:focus {
        z-index: 10050;
    }

    .comprobantes-compras-form-page #tabla.table-comprobante-items .col-item-igv {
        width: 220px;
        min-width: 220px;
        max-width: 220px;
    }

    .comprobantes-compras-form-page #tabla.table-comprobante-items .col-item-igv .chosen-container {
        width: 100% !important;
    }

    .comprobantes-compras-form-page #tabla.table-comprobante-items .col-item-igv .chosen-drop {
        width: 280px;
    }

    .comprobantes-compras-form-page #tabla.table-comprobante-items .col-item-igv .chosen-results li {
        white-space: normal;
        line-height: 1.3;
    }

    .comprobantes-compras-form-page #tabla.table-comprobante-items {
        table-layout: fixed !important;
    }

    .comprobantes-compras-form-page #tabla.table-comprobante-items .col-item-desc {
        width: 55% !important;
        min-width: 0;
    }

    .comprobantes-compras-form-page #tabla.table-comprobante-items .col-item-cant {
        width: 8% !important;
        min-width: 75px;
    }

    .comprobantes-compras-form-page #tabla.table-comprobante-items .col-item-igv {
        width: 12% !important;
        min-width: 170px !important;
        max-width: 205px !important;
    }

    .comprobantes-compras-form-page #tabla.table-comprobante-items .col-item-igv .chosen-container {
        width: 100% !important;
        max-width: 205px !important;
    }

    .comprobantes-compras-form-page #tabla.table-comprobante-items .col-item-btn {
        display: none;
        width: 0;
        min-width: 0;
        max-width: 0;
        padding: 0;
    }

    .comprobantes-compras-form-page #tabla.table-comprobante-items .col-item-descuento {
        display: none !important;
        width: 0 !important;
        min-width: 0 !important;
        max-width: 0 !important;
        padding: 0 !important;
        border: 0 !important;
    }

    .comprobantes-compras-form-page .comprobante-form-panel--conceptos,
    .comprobantes-compras-form-page .comprobante-form-panel--conceptos .comprobante-form-panel-body {
        overflow: visible;
    }

    #tabla.table-comprobante-items .col-item-precio {
        width: 9%;
        min-width: 95px;
    }

    .comprobantes-compras-form-page #tabla.table-comprobante-items .col-item-precio,
    .comprobantes-compras-form-page #tabla.table-comprobante-items .col-item-total {
        width: 11% !important;
        min-width: 110px;
    }

    #tabla.table-comprobante-items .col-item-btn {
        width: 4%;
        min-width: 36px;
        text-align: center;
    }

    #tabla.table-comprobante-items .col-item-descuento {
        width: 8%;
        min-width: 80px;
    }

    #tabla.table-comprobante-items .col-item-total {
        width: 9%;
        min-width: 90px;
    }

    .comprobantes-compras-form-page #tabla.table-comprobante-items .col-item-del {
        width: 3% !important;
        min-width: 36px;
    }

    #tabla.table-comprobante-items .col-item-del {
        width: 3%;
        min-width: 34px;
        text-align: center;
    }

    #tabla.table-comprobante-items .descripcion-item {
        min-width: 260px;
    }

    #tabla.table-comprobante-items .precios .glyphicon {
        font-size: 16px;
        cursor: pointer;
        color: #337ab7;
    }

    #tabla.table-comprobante-items .eliminar .glyphicon {
        cursor: pointer;
    }

    .comprobante-datos-documento {
        width: 100%;
        margin: 0;
        padding: 0;
        clear: none;
    }

    .comprobante-datos-documento-inner {
        display: grid;
        grid-template-columns: 96px 120px repeat(2, minmax(130px, 1fr)) minmax(140px, 180px);
        align-items: end;
        gap: 12px 14px;
        width: 100%;
        max-width: 100%;
    }

    .comprobante-doc-campo {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        flex: 0 0 auto;
        text-align: left;
    }

    .comprobante-doc-campo .control-label {
        display: block;
        margin-bottom: 4px;
        font-size: 12px;
        white-space: nowrap;
        text-align: left;
        width: 100%;
    }

    .comprobante-doc-input {
        width: 100%;
    }

    .comprobante-doc-campo .form-control {
        width: 100%;
        min-width: 0;
        padding: 8px 10px;
        min-height: 38px;
        height: auto;
        text-align: center;
        border-radius: 8px;
        border-color: #cbd5e1;
        font-size: 13px;
    }

    .comprobante-doc-campo select.form-control {
        text-align-last: center;
    }

    .comprobante-doc-serie,
    .comprobante-doc-numero,
    .comprobante-doc-fecha,
    .comprobante-doc-moneda {
        width: auto;
        min-width: 0;
    }

    @media (max-width: 1199px) {
        .comprobante-datos-documento-inner {
            grid-template-columns: repeat(3, minmax(0, 1fr));
        }
    }

    @media (max-width: 991px) {
        .comprobante-datos-documento-inner {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }
    }

    @media (max-width: 767px) {
        .comprobante-datos-documento-inner {
            grid-template-columns: 1fr;
        }
    }

    .nota-datos-panel {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 8px;
        box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
        margin-bottom: 20px;
        overflow: hidden;
    }

    .nota-datos-panel-header {
        background: linear-gradient(135deg, #0ea5e9, #0284c7);
        color: #fff;
        font-size: 14px;
        font-weight: 700;
        letter-spacing: 0.4px;
        text-transform: uppercase;
        padding: 12px 18px;
    }

    .nota-datos-panel-body {
        padding: 18px;
    }

    .nota-datos-grid {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        gap: 10px 12px;
    }

    .nota-datos-bloque-cliente {
        flex: 0 0 auto;
    }

    .nota-datos-fila-interna {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-end;
        gap: 10px 12px;
    }

    .nota-datos-bloque-numero-moneda {
        display: flex;
        flex-direction: column;
        gap: 12px;
        flex: 0 0 auto;
    }

    .nota-datos-bloque-fecha {
        flex: 0 0 auto;
    }

    .nota-datos-bloque-cliente .nota-campo-direccion {
        margin-top: 12px;
    }

    .nota-datos-campo {
        display: flex;
        flex-direction: column;
        flex: 0 0 auto;
    }

    .nota-campo-cliente,
    .nota-campo-direccion {
        width: 540px;
    }

    .nota-datos-grid .comprobante-doc-campo {
        display: flex;
        flex-direction: column;
        flex: 0 0 auto;
    }

    .nota-datos-grid .comprobante-doc-numero {
        width: 90px;
    }

    .nota-datos-grid .comprobante-doc-fecha {
        width: 118px;
    }

    .nota-datos-grid .comprobante-doc-moneda {
        width: 130px;
    }

    .nota-datos-grid .comprobante-doc-cambio {
        width: 100px;
    }

    .nota-datos-section {
        margin-bottom: 16px;
    }

    .nota-datos-section:last-child {
        margin-bottom: 0;
    }

    .nota-datos-cliente-actions {
        display: flex;
        flex-wrap: nowrap;
        gap: 8px;
        flex: 0 0 auto;
        padding-bottom: 1px;
    }

    .nota-datos-cliente-actions .btn-nuevo-cliente,
    .nota-datos-cliente-actions .btn-buscar-cliente {
        min-width: 92px;
        font-weight: 600;
        border-radius: 6px;
        padding: 7px 12px;
    }

    .nota-datos-cliente-actions .btn-nuevo-cliente {
        background: #16a34a;
        border-color: #16a34a;
    }

    .nota-datos-cliente-actions .btn-buscar-cliente {
        background: #2563eb;
        border-color: #2563eb;
    }

    .nota-datos-extra-row {
        display: flex;
        flex-wrap: wrap;
        gap: 12px 14px;
        align-items: end;
    }

    .nota-datos-panel .control-label {
        display: block;
        margin-bottom: 5px;
        font-size: 12px;
        font-weight: 600;
        color: #374151;
        text-align: left;
    }

    .nota-datos-panel .form-control {
        border-radius: 6px;
        border-color: #d1d5db;
        box-shadow: none;
    }

    .nota-datos-panel .form-control:focus {
        border-color: #0ea5e9;
        box-shadow: 0 0 0 2px rgba(14, 165, 233, 0.15);
    }

    .comprobante-doc-cambio {
        width: 118px;
    }

    .comprobante-doc-transportista {
        width: 180px;
    }

    .comprobante-doc-placa {
        width: 140px;
    }

    @media (max-width: 991px) {
        .nota-campo-cliente,
        .nota-campo-direccion {
            width: 100%;
            max-width: 560px;
        }

        .nota-datos-bloque-numero-moneda,
        .nota-datos-bloque-fecha {
            width: 100%;
        }

        .nota-datos-extra-row {
            flex-wrap: wrap;
        }
    }

    @media (max-width: 575px) {
        .nota-datos-cliente-actions {
            width: auto;
        }

        .nota-datos-cliente-actions .btn-nuevo-cliente,
        .nota-datos-cliente-actions .btn-buscar-cliente {
            flex: 0 0 auto;
        }
    }

    .nota-conceptos-row {
        margin-top: 0;
    }

    .nota-form-page.comprobante-form-page {
        max-width: 100%;
        padding-bottom: 28px;
    }

    .nota-form-page .comprobante-form-panel.nota-conceptos-panel {
        border: 1px solid #e5e7eb;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
    }

    .nota-form-page .nota-conceptos-panel-body {
        padding: 16px 20px 20px;
        background: #fff;
    }

    .nota-form-page .nota-barcode-input {
        max-width: 420px;
        border-radius: 8px;
    }

    .nota-form-page .nota-pie-row {
        margin-top: 14px;
    }

    .nota-conceptos-panel {
        background: #fff;
        border: 1px solid #dbeafe;
        border-radius: 12px;
        overflow: hidden;
        box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
    }

    .nota-conceptos-panel-header {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 14px 18px;
        font-size: 14px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        color: #1e3a5f;
        background: linear-gradient(180deg, #f0f9ff 0%, #e0f2fe 100%);
        border-bottom: 1px solid #dbeafe;
    }

    .nota-conceptos-panel-icon {
        font-size: 16px;
        color: #0284c7;
    }

    .nota-conceptos-panel-body {
        padding: 18px;
        background: #fafbfc;
    }

    .nota-conceptos-panel-body .comprobante-items-wrap {
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        padding: 4px;
        margin-bottom: 0;
    }

    .nota-conceptos-panel-body #tabla.table-comprobante-items thead th {
        background: #f8fafc;
    }

    .nota-conceptos-toolbar {
        margin-bottom: 14px;
        max-width: 480px;
    }

    .nota-barcode-label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 600;
        color: #374151;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .nota-barcode-input {
        border-radius: 8px;
        border-color: #d1d5db;
        min-height: 40px;
        box-shadow: none;
        transition: border-color 0.15s ease, box-shadow 0.15s ease;
    }

    .nota-barcode-input:focus {
        border-color: #38bdf8;
        box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.18);
    }

    .nota-items-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 16px;
        padding-top: 14px;
        border-top: 1px dashed #dbeafe;
    }

    .nota-items-actions .nota-btn-item {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        min-height: 38px;
        padding: 8px 16px;
        font-size: 13px;
        font-weight: 600;
        border-radius: 8px;
        border: 0;
        color: #fff;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
        transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;
    }

    .nota-items-actions .nota-btn-item .glyphicon {
        top: 0;
        font-size: 13px;
    }

    .nota-items-actions .nota-btn-item:hover,
    .nota-items-actions .nota-btn-item:focus {
        color: #fff;
        transform: translateY(-1px);
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
    }

    .nota-items-actions .nota-btn-item:active {
        transform: translateY(0);
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
    }

    .nota-items-actions .nota-btn-agregar {
        background: linear-gradient(135deg, #16a34a 0%, #15803d 100%);
    }

    .nota-items-actions .nota-btn-agregar:hover,
    .nota-items-actions .nota-btn-agregar:focus {
        background: linear-gradient(135deg, #15803d 0%, #166534 100%);
    }

    .nota-items-actions .nota-btn-sin-stock {
        background: linear-gradient(135deg, #f97316 0%, #ea580c 100%);
    }

    .nota-items-actions .nota-btn-sin-stock:hover,
    .nota-items-actions .nota-btn-sin-stock:focus {
        background: linear-gradient(135deg, #ea580c 0%, #c2410c 100%);
    }

    .nota-items-actions .nota-btn-buscar {
        background: linear-gradient(135deg, #0ea5e9 0%, #2563eb 100%);
    }

    .nota-items-actions .nota-btn-buscar:hover,
    .nota-items-actions .nota-btn-buscar:focus {
        background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
    }

    .nota-mostrar-imagen-wrap {
        display: none !important;
    }

    @media (max-width: 575px) {
        .nota-items-actions {
            flex-direction: column;
        }

        .nota-items-actions .nota-btn-item {
            width: 100%;
            justify-content: center;
        }
    }

    /* Modal buscar producto - nota de venta */
    #myModalProducto .modal-buscar-producto-nota {
        width: min(980px, 96vw);
        max-width: 96vw;
        margin: 24px auto;
    }

    #myModalProducto .modal-buscar-producto-nota .modal-content {
        border: 0;
        border-radius: 12px;
        overflow: hidden;
        box-shadow: 0 18px 40px rgba(15, 23, 42, 0.18);
    }

    #myModalProducto .modal-buscar-producto-nota-header {
        background: linear-gradient(135deg, #0ea5e9 0%, #2563eb 100%);
        color: #fff;
        border-bottom: 0;
        padding: 16px 20px 14px;
    }

    #myModalProducto .modal-buscar-producto-nota-header .close {
        color: #fff;
        opacity: 0.85;
        text-shadow: none;
        margin-top: 2px;
    }

    #myModalProducto .modal-buscar-producto-nota-header .close:hover {
        opacity: 1;
    }

    #myModalProducto .modal-buscar-producto-nota-header .modal-title {
        font-size: 18px;
        font-weight: 700;
        margin: 0;
    }

    #myModalProducto .modal-buscar-producto-nota-subtitle {
        margin: 4px 0 0;
        font-size: 12px;
        opacity: 0.92;
    }

    #myModalProducto .modal-buscar-producto-nota-body {
        padding: 16px 18px 10px;
        background: #f8fafc;
    }

    #myModalProducto .modal-buscar-producto-nota-grid {
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        overflow: hidden;
    }

    #myModalProducto .modal-buscar-producto-nota-grid .k-grid {
        border: 0;
        font-size: 13px;
    }

    #myModalProducto .modal-buscar-producto-nota-grid .k-grid-header {
        background: #f1f5f9;
    }

    #myModalProducto .modal-buscar-producto-nota-grid .k-grid-header .k-header {
        height: auto;
        min-height: 36px;
        padding: 8px 10px;
        font-size: 12px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.3px;
        color: #475569;
        vertical-align: middle;
        border-color: #e2e8f0;
    }

    #myModalProducto .modal-buscar-producto-nota-grid .k-grid-header .k-filter-row .k-header {
        padding: 6px 8px;
        background: #fff;
    }

    #myModalProducto .modal-buscar-producto-nota-grid .k-grid-header .k-filter-row .k-textbox,
    #myModalProducto .modal-buscar-producto-nota-grid .k-grid-header .k-filter-row .k-input {
        width: 100% !important;
        min-height: 32px;
        border-radius: 6px;
    }

    #myModalProducto .modal-buscar-producto-nota-grid .k-grid tbody tr {
        height: auto;
        min-height: 38px;
    }

    #myModalProducto .modal-buscar-producto-nota-grid .k-grid tbody td {
        padding: 8px 10px;
        vertical-align: middle;
        border-color: #eef2f7;
        line-height: 1.35;
    }

    #myModalProducto .modal-buscar-producto-nota-col-accion,
    #myModalProducto .modal-buscar-producto-nota-col-codigo,
    #myModalProducto .modal-buscar-producto-nota-col-precio,
    #myModalProducto .modal-buscar-producto-nota-col-stock {
        text-align: center;
    }

    #myModalProducto .modal-buscar-producto-nota-col-nombre {
        text-align: left;
        white-space: normal;
        word-break: break-word;
    }

    #myModalProducto .modal-buscar-producto-nota-grid .btn_agregarItem {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 34px;
        height: 34px;
        padding: 0;
        border: 0;
        border-radius: 8px;
        background: linear-gradient(135deg, #16a34a 0%, #15803d 100%);
        color: #fff !important;
        box-shadow: 0 1px 3px rgba(22, 163, 74, 0.35);
        transition: transform 0.12s ease, box-shadow 0.12s ease;
    }

    #myModalProducto .modal-buscar-producto-nota-grid .btn_agregarItem:hover,
    #myModalProducto .modal-buscar-producto-nota-grid .btn_agregarItem:focus {
        color: #fff !important;
        transform: translateY(-1px);
        box-shadow: 0 4px 10px rgba(22, 163, 74, 0.28);
    }

    #myModalProducto .modal-buscar-producto-nota-grid .btn_agregarItem .glyphicon {
        top: 0;
        font-size: 14px;
    }

    #myModalProducto .modal-buscar-producto-nota-footer {
        background: #fff;
        border-top: 1px solid #e5e7eb;
        padding: 12px 18px;
    }

    #myModalProducto .modal-buscar-producto-nota-btn-cerrar {
        min-width: 100px;
        border-radius: 8px;
        font-weight: 600;
    }

    #myModalProducto .modal-buscar-producto-nota-grid .k-pager-wrap {
        border-top: 1px solid #e5e7eb;
        background: #fff;
        padding: 8px 10px;
    }

    @media (max-width: 767px) {
        #myModalProducto .modal-buscar-producto-nota {
            width: 98vw;
            margin: 10px auto;
        }

        #myModalProducto .modal-buscar-producto-nota-body {
            padding: 12px;
        }
    }

    .nota-pie-row {
        margin-top: 20px;
        display: flex;
        flex-wrap: wrap;
        align-items: stretch;
    }

    .nota-pie-row > [class*="col-"] {
        display: flex;
        flex-direction: column;
    }

    .nota-pie-card {
        display: flex;
        flex-direction: column;
        flex: 1;
        background: #fff;
        border: 1px solid #dbeafe;
        border-radius: 12px;
        overflow: hidden;
        box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
    }

    .nota-pie-card-header {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 12px 16px;
        font-size: 13px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        color: #1e3a5f;
        background: linear-gradient(180deg, #f0f9ff 0%, #e0f2fe 100%);
        border-bottom: 1px solid #dbeafe;
    }

    .nota-pie-card-icon {
        font-size: 14px;
        color: #0284c7;
    }

    .nota-pie-card-body {
        flex: 1;
        padding: 16px;
    }

    .nota-observaciones-input {
        width: 100%;
        min-height: 120px;
        resize: vertical;
        border-radius: 8px;
        border-color: #d1d5db;
        padding: 12px 14px;
        font-size: 14px;
        line-height: 1.5;
        box-shadow: none;
        transition: border-color 0.15s ease, box-shadow 0.15s ease;
    }

    .nota-observaciones-input:focus {
        border-color: #38bdf8;
        box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.16);
    }

    .nota-total-card .nota-pie-card-body {
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 120px;
        background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
    }

    .nota-total-display {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    .nota-total-label {
        display: block;
        width: 100%;
        margin-bottom: 10px;
        font-size: 12px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        color: #64748b;
        text-align: center;
    }

    .nota-total-monto {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        width: 100%;
        max-width: 280px;
        margin: 0 auto;
        padding: 12px 16px;
        border-radius: 10px;
        background: #fff;
        border: 2px solid #bae6fd;
        box-shadow: 0 2px 8px rgba(14, 165, 233, 0.12);
        box-sizing: border-box;
    }

    .nota-total-simbolo {
        flex-shrink: 0;
        font-size: 22px;
        font-weight: 700;
        color: #0369a1;
        line-height: 1;
    }

    .nota-total-input {
        flex: 1;
        width: 100%;
        min-width: 0;
        max-width: none;
        border: 0;
        background: transparent;
        font-size: 32px;
        font-weight: 700;
        color: #0f172a;
        text-align: center;
        padding: 0;
        box-shadow: none;
        cursor: default;
    }

    .nota-total-input:focus {
        outline: none;
        box-shadow: none;
    }

    .nota-accion-generar {
        width: 100%;
        margin-top: 24px;
        padding-top: 22px;
        padding-bottom: 8px;
        border-top: 1px solid #e2e8f0;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    #formComprobante #guardar.btn-generar-nota,
    .btn-generar-nota {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        gap: 10px;
        min-width: 300px;
        padding: 14px 36px;
        font-size: 16px;
        font-weight: 600;
        letter-spacing: 0.3px;
        color: #fff !important;
        background-color: #16a34a !important;
        background-image: linear-gradient(135deg, #16a34a 0%, #15803d 100%) !important;
        border: 1px solid #15803d !important;
        border-radius: 10px;
        box-shadow: 0 4px 14px rgba(22, 163, 74, 0.35);
        transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
        float: none !important;
        width: auto !important;
    }

    #formComprobante #guardar.btn-generar-nota:hover,
    #formComprobante #guardar.btn-generar-nota:focus,
    .btn-generar-nota:hover,
    .btn-generar-nota:focus {
        color: #fff !important;
        background-color: #15803d !important;
        background-image: linear-gradient(135deg, #15803d 0%, #166534 100%) !important;
        border-color: #166534 !important;
        box-shadow: 0 6px 18px rgba(22, 163, 74, 0.42);
        transform: translateY(-1px);
        outline: none;
    }

    #formComprobante #guardar.btn-generar-nota:active,
    .btn-generar-nota:active {
        color: #fff !important;
        background-color: #166534 !important;
        background-image: linear-gradient(135deg, #166534 0%, #14532d 100%) !important;
        transform: translateY(0);
        box-shadow: 0 2px 8px rgba(22, 163, 74, 0.3);
    }

    #formComprobante #guardar.btn-generar-nota .glyphicon,
    .btn-generar-nota .glyphicon {
        font-size: 18px;
        top: 0;
        color: #fff !important;
    }

    @media (max-width: 767px) {
        .nota-pie-row > [class*="col-"] {
            margin-bottom: 14px;
        }

        .nota-total-card .nota-pie-card-body {
            min-height: 100px;
        }

        .nota-total-input {
            font-size: 28px;
        }

        #formComprobante #guardar.btn-generar-nota,
        .btn-generar-nota {
            min-width: 0;
            width: 100% !important;
            max-width: 420px;
        }
    }

    /* Notas index - grilla */
    .notas-flash {
        margin: 12px 15px 0;
        padding: 12px 16px;
        border-radius: 8px;
        text-align: center;
        font-weight: 600;
        font-size: 14px;
        color: #fff;
        background: linear-gradient(135deg, #0ea5e9, #0284c7);
        box-shadow: 0 2px 8px rgba(14, 165, 233, 0.25);
    }

    .notas-grid-card {
        margin: 0 15px 24px;
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
        overflow: visible;
    }

    .notas-grid-card-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 12px;
        padding: 16px 20px;
        border-bottom: 1px solid #eef2f7;
        background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
    }

    .notas-grid-card-header h3 {
        margin: 0;
        font-size: 17px;
        font-weight: 700;
        color: #1e293b;
    }

    .notas-grid-card-header p {
        margin: 4px 0 0;
        font-size: 12px;
        color: #64748b;
    }

    .notas-grid-toolbar {
        display: flex;
        align-items: center;
        gap: 12px;
    }

    .notas-grid-toolbar .notas-toggle {
        position: relative;
        display: inline-flex;
        align-items: center;
        width: 44px;
        height: 24px;
        flex-shrink: 0;
    }

    .notas-grid-toolbar .notas-toggle input {
        opacity: 0;
        width: 0;
        height: 0;
        position: absolute;
    }

    .notas-grid-toolbar .notas-toggle-slider {
        position: absolute;
        inset: 0;
        cursor: pointer;
        background: #cbd5e1;
        border-radius: 999px;
        transition: background 0.2s ease;
    }

    .notas-grid-toolbar .notas-toggle-slider:before {
        content: "";
        position: absolute;
        width: 18px;
        height: 18px;
        left: 3px;
        top: 3px;
        background: #fff;
        border-radius: 50%;
        transition: transform 0.2s ease;
        box-shadow: 0 1px 3px rgba(15, 23, 42, 0.2);
    }

    .notas-grid-toolbar .notas-toggle input:checked + .notas-toggle-slider {
        background: #16a34a;
    }

    .notas-grid-toolbar .notas-toggle input:checked + .notas-toggle-slider:before {
        transform: translateX(20px);
    }

    .notas-grid-toolbar-label {
        margin: 0;
        font-size: 13px;
        font-weight: 600;
        color: #475569;
        cursor: pointer;
    }

    #grid-notas-wrapper {
        padding: 0;
    }

    #grid {
        width: 100%;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    #grid .k-grid-header {
        background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
        border-bottom: 0;
    }

    #grid .k-grid-header th.k-header {
        text-align: center !important;
        font-weight: 700;
        font-size: 11px;
        letter-spacing: 0.6px;
        text-transform: uppercase;
        color: #f8fafc !important;
        padding: 12px 10px;
        white-space: normal;
        vertical-align: middle;
        border-color: rgba(255, 255, 255, 0.08) !important;
        background: transparent !important;
    }

    #grid .k-grid-header th.col-cliente-nota-header {
        text-align: left !important;
    }

    #grid .k-grid-content td {
        font-size: 13px;
        padding: 10px;
        vertical-align: middle;
        text-align: center !important;
        border-color: #eef2f7 !important;
        color: #334155;
    }

    #grid .k-grid-content td.col-cliente-nota {
        text-align: left !important;
        font-weight: 500;
        color: #1e293b;
    }

    #grid .k-grid-content tr.notas-row {
        transition: background-color 0.15s ease;
    }

    #grid .k-grid-content tr.notas-row-alt {
        background-color: #fafbfc;
    }

    #grid .k-grid-content tr.notas-row:hover {
        background-color: #f0f7ff !important;
    }

    #grid .k-grid-content tr.notas-row-anulado {
        background-color: #fef2f2 !important;
        box-shadow: inset 4px 0 0 #ef4444;
    }

    #grid .k-grid-content tr.notas-row-anulado:hover {
        background-color: #fee2e2 !important;
    }

    #grid .k-grid-content tr.notas-row-tributario {
        background-color: #eff6ff !important;
        box-shadow: inset 4px 0 0 #3b82f6;
    }

    #grid .k-grid-content tr.notas-row-tributario:hover {
        background-color: #dbeafe !important;
    }

    #grid .k-hierarchy-col,
    #grid .k-hierarchy-cell {
        width: 28px !important;
        min-width: 28px !important;
        max-width: 28px !important;
    }

    #grid .k-hierarchy-cell {
        padding: 0 !important;
        text-align: center !important;
    }

    #grid .k-hierarchy-cell .k-icon {
        color: #64748b;
    }

    #grid .k-pager-wrap {
        padding: 10px 16px;
        background: #f8fafc;
        border-top: 1px solid #e5e7eb;
    }

    #grid .k-pager-wrap .k-link,
    #grid .k-pager-wrap .k-state-selected {
        border-radius: 6px;
    }

    #grid .k-detail-row .k-detail-cell {
        padding: 0 !important;
        border-color: #eef2f7 !important;
    }

    #grid .lista_notas {
        margin: 0;
        padding: 12px 16px 16px 44px;
        background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
        border-top: 1px dashed #cbd5e1;
    }

    #grid .lista_notas .k-grid {
        border: 1px solid #e2e8f0;
        border-radius: 8px;
        overflow: hidden;
        background: #fff;
    }

    #grid .lista_notas .k-grid-header {
        background: #e2e8f0;
    }

    #grid .lista_notas .k-grid-header th.k-header {
        font-size: 11px;
        font-weight: 700;
        color: #475569 !important;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        padding: 8px;
        background: transparent !important;
    }

    #grid .lista_notas .k-grid-content td {
        font-size: 12px;
        padding: 7px 8px;
    }

    #grid .lista_notas .k-grid-content td.col-producto-nota,
    #grid .lista_notas .k-grid-header th.col-producto-nota-header {
        text-align: left !important;
    }

    .notas-corr-badge {
        display: inline-block;
        padding: 4px 10px;
        border-radius: 999px;
        background: #eef2ff;
        color: #4338ca;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.2px;
        white-space: nowrap;
    }

    .notas-total-cell {
        display: inline-block;
        font-weight: 700;
        color: #0f766e;
        font-size: 13px;
        white-space: nowrap;
    }

    .notas-doc-cell {
        font-family: Consolas, "Courier New", monospace;
        font-size: 12px;
        color: #475569;
    }

    .notas-fecha-cell {
        color: #64748b;
        font-size: 12px;
        white-space: nowrap;
    }

    .notas-grid-icon-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 34px;
        height: 34px;
        border-radius: 8px;
        border: 1px solid #dbeafe;
        background: #eff6ff;
        color: #2563eb;
        text-decoration: none !important;
        transition: all 0.15s ease;
    }

    .notas-grid-icon-btn:hover,
    .notas-grid-icon-btn:focus {
        background: #2563eb;
        border-color: #2563eb;
        color: #fff;
        transform: translateY(-1px);
        box-shadow: 0 4px 10px rgba(37, 99, 235, 0.25);
    }

    .notas-grid-icon-btn img {
        width: 18px;
        height: 18px;
    }

    .notas-grid-icon-export {
        border-color: #bbf7d0;
        background: #f0fdf4;
        color: #16a34a;
    }

    .notas-grid-icon-export:hover,
    .notas-grid-icon-export:focus {
        background: #16a34a;
        border-color: #16a34a;
        color: #fff;
        box-shadow: 0 4px 10px rgba(22, 163, 74, 0.25);
    }

    .notas-estado-dropdown .btn {
        width: auto;
        min-width: 0;
        max-width: 100%;
        padding: 5px 10px;
        font-size: 12px;
        font-weight: 700;
        border-radius: 999px;
        border: 0;
        box-shadow: 0 2px 6px rgba(15, 23, 42, 0.12);
        white-space: nowrap;
        line-height: 1.2;
    }

    .notas-estado-dropdown {
        display: inline-block;
        width: auto;
        max-width: 100%;
    }

    .notas-estado-dropdown .dropdown-menu {
        border-radius: 8px;
        border: 1px solid #e5e7eb;
        box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
        padding: 4px 0;
        min-width: 140px;
    }

    /*
     * El contenido de la grilla Kendo tiene scroll propio. Un menú Bootstrap
     * dentro de una celda queda recortado por ese contenedor, sobre todo en
     * estados como "Rechazado SUNAT". Al abrirlo, JavaScript lo coloca sobre
     * la página con esta clase; así se ven todas sus acciones.
     */
    .comp-estado-menu-floating {
        position: absolute !important;
        display: block !important;
        float: none !important;
        z-index: 1080 !important;
    }

    .notas-estado-dropdown .dropdown-menu > li > a {
        padding: 8px 14px;
        font-size: 13px;
        color: #b91c1c;
        font-weight: 600;
    }

    .notas-estado-dropdown .dropdown-menu > li > a:hover {
        background: #fef2f2;
    }

    .notas-estado-generado .btn {
        background: linear-gradient(135deg, #22c55e, #16a34a);
    }

    .notas-estado-anulado .btn {
        background: linear-gradient(135deg, #f87171, #ef4444);
    }

    .notas-estado-tributario .btn {
        background: linear-gradient(135deg, #60a5fa, #3b82f6);
    }

    @media (max-width: 767px) {
        .notas-grid-card {
            margin: 0 0 20px;
            border-radius: 0;
        }

        .notas-grid-card-header {
            padding: 14px 16px;
        }
    }

    /* Notas de venta — grilla compacta en móvil */
    .notas-grid-card.comp-grid-mobile #grid-notas-wrapper {
        overflow-x: hidden;
        overflow-y: visible;
    }

    .notas-grid-card.comp-grid-mobile #grid .k-grid-header-wrap {
        overflow-x: hidden !important;
        overflow-y: hidden !important;
    }

    .notas-grid-card.comp-grid-mobile #grid .k-grid-content {
        overflow-x: auto !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    .notas-grid-card.comp-grid-mobile #grid .k-grid-header table,
    .notas-grid-card.comp-grid-mobile #grid .k-grid-content table {
        width: auto !important;
        min-width: 520px !important;
        table-layout: auto !important;
    }

    .notas-grid-card.comp-grid-mobile #grid .comp-col-desktop {
        display: none !important;
    }

    .notas-grid-card.comp-grid-mobile #grid .k-grid-header th.k-header,
    .notas-grid-card.comp-grid-mobile #grid .k-grid-content td {
        font-size: 11px !important;
        padding: 6px 4px !important;
    }

    .notas-grid-card.comp-grid-mobile #grid .k-grid-header th.comp-col-numero,
    .notas-grid-card.comp-grid-mobile #grid td.comp-col-numero {
        width: 76px !important;
        min-width: 76px !important;
        max-width: none !important;
        white-space: nowrap !important;
    }

    .notas-grid-card.comp-grid-mobile #grid .notas-corr-badge {
        font-size: 10px;
        padding: 2px 4px;
    }

    .notas-grid-card.comp-grid-mobile #grid .k-grid-header th.comp-col-cliente,
    .notas-grid-card.comp-grid-mobile #grid td.comp-col-cliente {
        width: 140px !important;
        min-width: 140px !important;
        max-width: 140px !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
        line-height: 1.25;
        word-break: break-word;
    }

    .notas-grid-card.comp-grid-mobile #grid td.col-cliente-nota,
    .notas-grid-card.comp-grid-mobile #grid .k-grid-header th.col-cliente-nota-header {
        font-size: 11px !important;
        font-weight: 500;
        text-align: left !important;
    }

    .notas-grid-card.comp-grid-mobile #grid .k-grid-header th.comp-col-total,
    .notas-grid-card.comp-grid-mobile #grid td.comp-col-total {
        width: 78px !important;
        min-width: 78px !important;
        max-width: none !important;
        font-weight: 700;
        white-space: nowrap !important;
    }

    .notas-grid-card.comp-grid-mobile #grid .notas-total-cell {
        font-size: 10px;
    }

    .notas-grid-card.comp-grid-mobile #grid .k-grid-header th.comp-col-pdf,
    .notas-grid-card.comp-grid-mobile #grid td.comp-col-pdf,
    .notas-grid-card.comp-grid-mobile #grid .k-grid-header th.comp-col-ticket,
    .notas-grid-card.comp-grid-mobile #grid td.comp-col-ticket {
        width: 46px !important;
        min-width: 46px !important;
        max-width: none !important;
        padding-left: 2px !important;
        padding-right: 2px !important;
    }

    .notas-grid-card.comp-grid-mobile #grid .k-grid-header th.comp-col-ticket,
    .notas-grid-card.comp-grid-mobile #grid td.comp-col-ticket {
        width: 54px !important;
        min-width: 54px !important;
    }

    .notas-grid-card.comp-grid-mobile #grid .k-grid-header th.comp-col-estado,
    .notas-grid-card.comp-grid-mobile #grid td.comp-col-estado {
        width: auto !important;
        min-width: 0 !important;
        max-width: 88px !important;
        white-space: nowrap !important;
        overflow: visible !important;
        padding-left: 2px !important;
        padding-right: 2px !important;
        text-align: center !important;
    }

    .notas-grid-card.comp-grid-mobile #grid .notas-estado-dropdown {
        display: inline-block;
        width: auto;
        max-width: 100%;
    }

    .notas-grid-card.comp-grid-mobile #grid .notas-estado-dropdown .btn {
        min-width: 0 !important;
        width: auto !important;
        max-width: 100%;
        padding: 3px 7px !important;
        font-size: 10px !important;
        line-height: 1.15;
        overflow: visible;
        white-space: nowrap;
    }

    .notas-grid-card.comp-grid-mobile #grid .k-hierarchy-col,
    .notas-grid-card.comp-grid-mobile #grid .k-hierarchy-cell {
        width: 14px !important;
        min-width: 14px !important;
        max-width: 14px !important;
        padding: 0 !important;
    }

    .notas-grid-card.comp-grid-mobile #grid .notas-grid-icon-btn img {
        width: 18px;
        height: auto;
    }

    .notas-grid-card.comp-grid-mobile #grid .notas-estado-dropdown .caret {
        display: none;
    }

    .notas-grid-card.comp-grid-mobile #grid .k-pager-wrap {
        padding: 8px 10px;
    }

    .notas-grid-card.comp-grid-mobile #grid .k-pager-info {
        display: block;
        width: 100%;
        text-align: center;
        margin-top: 4px;
        font-size: 11px;
    }

    /* Reporte total ventas */
    .reporte-tv-panel {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
        padding: 20px;
        margin-bottom: 16px;
    }

    .reporte-tv-panel h3 {
        margin: 0 0 18px;
        font-size: 22px;
        font-weight: 700;
        color: #1e293b;
    }

    .reporte-tv-panel label {
        display: block;
        font-weight: 600;
        color: #374151;
        font-size: 13px;
        margin-bottom: 6px;
    }

    .reporte-tv-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        align-items: center;
        padding-top: 8px;
    }

    .reporte-tv-actions .btn {
        min-width: 130px;
        font-weight: 600;
        border-radius: 8px;
        padding: 8px 14px;
    }

    .reporte-tv-stats {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 12px;
        margin-bottom: 16px;
    }

    .reporte-tv-stat {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 10px;
        padding: 16px 14px;
        box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
        text-align: center;
    }

    .reporte-tv-stat-label {
        display: block;
        font-size: 12px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        color: #64748b;
        margin-bottom: 8px;
        text-align: center;
    }

    .reporte-tv-stat-value {
        display: block;
        font-size: 24px;
        font-weight: 700;
        color: #0f766e;
        line-height: 1.15;
        text-align: center;
        white-space: nowrap;
    }

    .reporte-tv-stat-value--venta {
        color: #1d4ed8;
        font-size: 26px;
    }

    .reporte-tv-grid-card {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
        overflow: hidden;
        position: relative;
    }

    .reporte-tv-grid-header {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 12px;
        padding: 14px 18px;
        border-bottom: 1px solid #eef2f7;
        background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
    }

    .reporte-tv-grid-header h4 {
        margin: 0;
        font-size: 16px;
        font-weight: 700;
        color: #1e293b;
    }

    .reporte-tv-grid-subtitle {
        margin: 4px 0 0;
        font-size: 12px;
        color: #64748b;
    }

    .reporte-tv-tipo-filtros {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px;
    }

    .reporte-tv-tipo-label {
        font-size: 12px;
        font-weight: 700;
        color: #64748b;
        margin-right: 4px;
    }

    .reporte-tv-tipo-btn {
        border-radius: 999px;
        font-weight: 600;
        padding: 5px 14px;
        border: 1px solid #cbd5e1;
        background: #fff;
        color: #475569;
    }

    .reporte-tv-tipo-btn.is-active,
    .reporte-tv-tipo-btn:hover,
    .reporte-tv-tipo-btn:focus {
        background: #2563eb;
        border-color: #2563eb;
        color: #fff;
    }

    .reporte-tv-grid-body {
        position: relative;
        min-height: 560px;
    }

    .reporte-tv-loading {
        display: none !important;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: rgba(255, 255, 255, 0.82);
        z-index: 30;
        align-items: center;
        justify-content: center;
        font-weight: 600;
        color: #2563eb;
        pointer-events: none;
    }

    .reporte-tv-loading.is-visible {
        display: flex !important;
        pointer-events: auto;
    }

    #gridTotalVentas .k-grid-header {
        background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
    }

    #gridTotalVentas .k-grid-header th.k-header {
        color: #f8fafc !important;
        font-weight: 700;
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        background: transparent !important;
        border-color: rgba(255, 255, 255, 0.08) !important;
    }

    #gridTotalVentas .k-grid-content td {
        font-size: 13px;
        vertical-align: middle;
    }

    #gridTotalVentas .col-cliente-tv {
        text-align: left !important;
    }

    @media (max-width: 991px) {
        .reporte-tv-stats {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }
    }

    @media (max-width: 575px) {
        .reporte-tv-stats {
            grid-template-columns: 1fr;
        }

        .reporte-tv-actions .btn {
            width: 100%;
            min-width: 0;
        }
    }

    .reporte-tv-dashboard .reporte-tv-kpis-extended {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .reporte-tv-grid-tools {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        align-items: center;
        justify-content: flex-end;
    }

    .reporte-tv-quick-filter input {
        min-width: 220px;
        border-radius: 8px;
    }

    .reporte-tv-badge {
        display: inline-block;
        padding: 3px 8px;
        border-radius: 999px;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .reporte-tv-badge--boleta {
        background: #dbeafe;
        color: #1d4ed8;
    }

    .reporte-tv-badge--factura {
        background: #fef3c7;
        color: #b45309;
    }

    .reporte-tv-badge--nota {
        background: #ede9fe;
        color: #6d28d9;
    }

    .reporte-ru-chart-empty {
        padding: 28px 16px;
        text-align: center;
        color: #64748b;
        font-size: 13px;
        background: #f8fafc;
        border: 1px dashed #cbd5e1;
        border-radius: 8px;
    }

    @media (max-width: 991px) {
        .reporte-tv-dashboard .reporte-tv-kpis-extended {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }
    }

    @media (max-width: 575px) {
        .reporte-tv-dashboard .reporte-tv-kpis-extended {
            grid-template-columns: 1fr;
        }

        .reporte-tv-grid-tools {
            width: 100%;
            flex-direction: column;
            align-items: stretch;
        }

        .reporte-tv-quick-filter input {
            width: 100%;
            min-width: 0;
        }
    }

    /* Reporte utilidades — dashboard ejecutivo */
    .reporte-ru-page {
        max-width: 100%;
    }

    .reporte-ru-panel h3 {
        margin: 0 0 4px;
    }

    .reporte-ru-panel-subtitle {
        margin: 0 0 16px;
        font-size: 13px;
        color: #64748b;
    }

    .reporte-ru-filters {
        margin-bottom: 4px;
    }

    .reporte-ru-filters label {
        display: block;
        font-weight: 600;
        color: #374151;
        font-size: 13px;
        margin-bottom: 6px;
    }

    .reporte-ru-toolbar {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        align-items: center;
        padding-top: 12px;
        border-top: 1px solid #eef2f7;
        margin-top: 12px;
    }

    .reporte-ru-toolbar .btn {
        min-width: 110px;
        font-weight: 600;
        border-radius: 8px;
    }

    .reporte-ru-export .dropdown-menu {
        border-radius: 10px;
        box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
        min-width: 160px;
    }

    .reporte-ru-resultados {
        margin-top: 16px;
    }

    .reporte-ru-kpis {
        grid-template-columns: repeat(5, minmax(0, 1fr));
        margin-bottom: 16px;
    }

    .reporte-ru-kpis.has-comprobantes {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    @media (max-width: 1199px) {
        .reporte-ru-kpis {
            grid-template-columns: repeat(3, minmax(0, 1fr));
        }
    }

    @media (max-width: 767px) {
        .reporte-ru-kpis {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .reporte-ru-toolbar .btn,
        .reporte-ru-export {
            width: 100%;
        }

        .reporte-ru-export .btn {
            width: 100%;
        }
    }

    @media (max-width: 575px) {
        .reporte-ru-kpis {
            grid-template-columns: 1fr;
        }
    }

    .reporte-ru-ejecutivo {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
        margin-bottom: 16px;
        overflow: hidden;
    }

    .reporte-ru-ejecutivo-head {
        padding: 14px 18px;
        border-bottom: 1px solid #eef2f7;
        background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
    }

    .reporte-ru-ejecutivo-head h4 {
        margin: 0;
        font-size: 16px;
        font-weight: 700;
        color: #1e293b;
    }

    .reporte-ru-ejecutivo-body {
        padding: 6px 0;
    }

    .reporte-ru-ejecutivo-row {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 8px 16px;
        padding: 12px 18px;
        border-bottom: 1px solid #f1f5f9;
    }

    .reporte-ru-ejecutivo-row:last-child {
        border-bottom: none;
    }

    .reporte-ru-ejecutivo-label {
        font-size: 13px;
        color: #64748b;
        font-weight: 500;
    }

    .reporte-ru-ejecutivo-value {
        text-align: right;
        min-width: 0;
    }

    .reporte-ru-ejecutivo-value strong {
        display: block;
        font-size: 14px;
        color: #1e293b;
        font-weight: 600;
    }

    .reporte-ru-ejecutivo-value em {
        display: block;
        font-style: normal;
        font-size: 13px;
        font-weight: 700;
        color: #0f766e;
        margin-top: 2px;
    }

    .reporte-ru-chart-card {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
        margin-bottom: 16px;
        overflow: hidden;
    }

    .reporte-ru-chart-head {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 14px 18px;
        border-bottom: 1px solid #eef2f7;
        background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
    }

    .reporte-ru-chart-head h4 {
        margin: 0;
        font-size: 16px;
        font-weight: 700;
        color: #1e293b;
    }

    .reporte-ru-analisis-select {
        min-width: 220px;
        max-width: 100%;
    }

    .reporte-ru-chart-body {
        position: relative;
        height: 320px;
        padding: 16px 18px 20px;
    }

    @media (max-width: 767px) {
        .reporte-ru-chart-body {
            height: 260px;
        }

        .reporte-ru-analisis-select {
            width: 100%;
        }
    }

    .reporte-ru-cell-util {
        display: inline-block;
        min-width: 72px;
        padding: 3px 8px;
        border-radius: 6px;
        font-weight: 700;
        text-align: right;
    }

    .reporte-ru-cell-util--pos {
        background: #ecfdf5;
        color: #047857;
    }

    .reporte-ru-cell-util--baja {
        background: #fffbeb;
        color: #b45309;
    }

    .reporte-ru-cell-util--neg {
        background: #fef2f2;
        color: #b91c1c;
    }

    .reporte-ru-row-alert td {
        background: #fff7ed !important;
    }

    .reporte-ru-page {
        background: #f8fafc;
        color: #0f172a;
    }

    .reporte-ru-hero {
        border-radius: 10px;
        box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
        border-color: #e2e8f0;
    }

    .reporte-ru-hero h3 {
        text-transform: uppercase;
        letter-spacing: 0.02em;
        color: #0f172a;
    }

    .reporte-ru-kpis {
        display: grid;
        grid-template-columns: repeat(6, minmax(0, 1fr));
        gap: 12px;
        margin-bottom: 16px;
    }

    .reporte-ru-kpi {
        position: relative;
        min-height: 128px;
        padding: 18px 16px 14px 72px;
        border-radius: 10px;
        border: 1px solid #e2e8f0;
        box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
        overflow: hidden;
    }

    .reporte-ru-kpi-icon {
        position: absolute;
        left: 16px;
        top: 20px;
        width: 42px;
        height: 42px;
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #fff;
        font-size: 18px;
        box-shadow: 0 10px 20px rgba(15, 23, 42, 0.14);
    }

    .reporte-ru-kpi--blue .reporte-ru-kpi-icon { background: #2563eb; }
    .reporte-ru-kpi--teal .reporte-ru-kpi-icon { background: #0f766e; }
    .reporte-ru-kpi--green .reporte-ru-kpi-icon { background: #10b981; }
    .reporte-ru-kpi--purple .reporte-ru-kpi-icon { background: #7c3aed; }
    .reporte-ru-kpi--orange .reporte-ru-kpi-icon { background: #f59e0b; }
    .reporte-ru-kpi--cyan .reporte-ru-kpi-icon { background: #0891b2; }

    .reporte-ru-kpi .reporte-tv-stat-label {
        font-size: 11px;
        font-weight: 800;
        color: #334155;
        text-transform: uppercase;
    }

    .reporte-ru-kpi .reporte-tv-stat-value {
        margin-top: 8px;
        font-size: 22px;
        line-height: 1.15;
        color: #0f172a;
    }

    .reporte-ru-kpi-var,
    .reporte-ru-kpi-sub {
        display: block;
        margin-top: 10px;
        font-size: 12px;
        color: #64748b;
        white-space: normal;
    }

    .reporte-ru-kpi-var.is-up { color: #059669; font-weight: 700; }
    .reporte-ru-kpi-var.is-down { color: #dc2626; font-weight: 700; }

    .reporte-ru-card,
    .reporte-ru-chart-card,
    .reporte-ru-ejecutivo,
    .reporte-ru-grid-card {
        border-radius: 10px;
        border: 1px solid #e2e8f0;
        box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
        background: #fff;
    }

    .reporte-ru-chart-card {
        margin-bottom: 14px;
    }

    .reporte-ru-chart-head,
    .reporte-ru-card-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 16px 18px 8px;
    }

    .reporte-ru-chart-head h4,
    .reporte-ru-card-head h4 {
        margin: 0;
        font-size: 14px;
        font-weight: 800;
        color: #0f172a;
        text-transform: uppercase;
    }

    .reporte-ru-card-head h4 span,
    .reporte-ru-chart-head h4 span {
        color: #64748b;
        font-weight: 600;
        text-transform: none;
    }

    .reporte-ru-analisis-select {
        display: none;
    }

    #reporteRuResultados > .reporte-ru-chart-card:not(.reporte-ru-card) .reporte-ru-chart-head h4 {
        font-size: 0;
    }

    #reporteRuResultados > .reporte-ru-chart-card:not(.reporte-ru-card) .reporte-ru-chart-head h4:before {
        content: "EVOLUCION MENSUAL";
        font-size: 13px;
        font-weight: 800;
        color: #0f172a;
    }

    #reporteRuResultados > .reporte-ru-chart-card:not(.reporte-ru-card) .reporte-ru-chart-head h4:after {
        content: " (enero - mes actual)";
        font-size: 12px;
        font-weight: 600;
        color: #64748b;
        text-transform: none;
    }

    #reporteRuResultados {
        display: grid;
        grid-template-columns: repeat(16, minmax(0, 1fr));
        gap: 14px;
        align-items: stretch;
    }

    #reporteRuResultados > .reporte-ru-kpis {
        grid-column: 1 / -1;
        margin-bottom: 0;
    }

    #reporteRuResultados > .reporte-ru-chart-card:not(.reporte-ru-card) {
        grid-column: 1 / 6;
        grid-row: 2;
        margin-bottom: 0;
    }

    #reporteRuResultados > .reporte-ru-dashboard-row {
        display: contents;
    }

    #reporteRuResultados > .reporte-ru-dashboard-row > .reporte-ru-chart-card:first-child {
        grid-column: 6 / 10;
        grid-row: 2;
        margin-bottom: 0;
    }

    #reporteRuResultados > .reporte-ru-dashboard-row > .reporte-ru-chart-card--donut {
        grid-column: 10 / 14;
        grid-row: 2;
        margin-bottom: 0;
    }

    #reporteRuResultados > .reporte-ru-ejecutivo {
        grid-column: 14 / 17;
        grid-row: 2;
        margin-bottom: 0;
        min-width: 0;
    }

    #reporteRuResultados > .reporte-ru-grid-card {
        grid-column: 1 / -1;
        grid-row: 3;
    }

    .reporte-ru-chart-body {
        height: 224px;
        padding: 8px 16px 14px;
    }

    .reporte-ru-chart-legend {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: 10px 18px;
        min-height: 22px;
        margin: -2px 0 4px;
        color: #334155;
        font-size: 11px;
        font-weight: 600;
    }

    .reporte-ru-chart-legend span {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        white-space: nowrap;
    }

    .reporte-ru-dot {
        display: inline-block;
        width: 9px;
        height: 9px;
        border-radius: 50%;
    }

    .reporte-ru-dot--blue { background: #2563eb; }
    .reporte-ru-dot--red { background: #ef4444; }
    .reporte-ru-dot--green { background: #10b981; }

    .reporte-ru-donut-layout {
        display: grid;
        grid-template-columns: minmax(150px, 0.95fr) minmax(120px, 1fr);
        gap: 12px;
        align-items: center;
        padding: 0 16px 16px;
    }

    .reporte-ru-chart-body--donut {
        height: 212px;
        padding: 4px;
    }

    #reporteRuResultados > .reporte-ru-ejecutivo .reporte-ru-ejecutivo-head {
        padding: 14px 14px 8px;
        border-bottom: none;
        background: #fff;
    }

    #reporteRuResultados > .reporte-ru-ejecutivo .reporte-ru-ejecutivo-head h4 {
        font-size: 13px;
        font-weight: 800;
        color: #0f172a;
        text-transform: uppercase;
    }

    #reporteRuResultados > .reporte-ru-ejecutivo .reporte-ru-ejecutivo-body {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        padding: 0 12px 12px;
    }

    #reporteRuResultados > .reporte-ru-ejecutivo .reporte-ru-ejecutivo-row {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
        padding: 10px 12px;
        margin-bottom: 0;
        border: 1px solid #e5e7eb;
        border-radius: 8px;
        background: #fff;
        box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04);
    }

    #reporteRuResultados > .reporte-ru-ejecutivo #ru_ej_prod_max_row,
    #reporteRuResultados > .reporte-ru-ejecutivo #ru_ej_prod_min_row {
        grid-column: 1 / -1;
        min-height: 62px;
    }

    #reporteRuResultados > .reporte-ru-ejecutivo #ru_ej_productos_row,
    #reporteRuResultados > .reporte-ru-ejecutivo #ru_ej_productos_row ~ .reporte-ru-ejecutivo-row {
        align-items: center;
        justify-content: center;
        min-height: 58px;
        padding: 8px 6px;
        text-align: center;
    }

    #reporteRuResultados > .reporte-ru-ejecutivo #ru_ej_productos_row .reporte-ru-ejecutivo-value,
    #reporteRuResultados > .reporte-ru-ejecutivo #ru_ej_productos_row ~ .reporte-ru-ejecutivo-row .reporte-ru-ejecutivo-value {
        text-align: center;
    }

    #reporteRuResultados > .reporte-ru-ejecutivo .reporte-ru-ejecutivo-label {
        font-size: 11px;
        color: #64748b;
        line-height: 1.2;
    }

    #reporteRuResultados > .reporte-ru-ejecutivo .reporte-ru-ejecutivo-value {
        width: 100%;
        text-align: left;
    }

    #reporteRuResultados > .reporte-ru-ejecutivo .reporte-ru-ejecutivo-value strong {
        display: block;
        color: #0f172a;
        font-size: 12px;
        font-weight: 800;
        line-height: 1.25;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    #reporteRuResultados > .reporte-ru-ejecutivo .reporte-ru-ejecutivo-value em {
        display: block;
        margin-top: 3px;
        color: #047857;
        font-size: 12px;
        font-style: normal;
        font-weight: 800;
    }

    #reporteRuResultados > .reporte-ru-ejecutivo #ru_ej_prod_min_row .reporte-ru-ejecutivo-value em {
        color: #dc2626;
    }

    .reporte-ru-donut-legend-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        padding: 8px 0;
        font-size: 13px;
        color: #0f172a;
    }

    .reporte-ru-donut-legend-row span {
        display: flex;
        align-items: center;
        gap: 8px;
        min-width: 0;
    }

    .reporte-ru-donut-legend-row i {
        display: inline-block;
        width: 10px;
        height: 10px;
        border-radius: 50%;
    }

    .reporte-ru-grid-card {
        overflow: hidden;
    }

    .reporte-ru-grid-tools {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-left: auto;
    }

    .reporte-ru-grid-tools input {
        width: 240px;
        border-radius: 8px;
    }

    .reporte-ru-column-menu {
        position: absolute;
        z-index: 10000;
        min-width: 210px;
        padding: 10px;
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 8px;
        box-shadow: 0 14px 32px rgba(15, 23, 42, 0.14);
        display: none;
    }

    .reporte-ru-column-menu label {
        display: block;
        margin: 0;
        padding: 6px 4px;
        font-size: 12px;
        font-weight: 600;
        color: #334155;
    }

    .reporte-ru-margin-bar {
        display: inline-block;
        width: 62px;
        height: 8px;
        margin-left: 8px;
        background: #e5e7eb;
        border-radius: 999px;
        overflow: hidden;
        vertical-align: middle;
    }

    .reporte-ru-margin-bar i {
        display: block;
        height: 100%;
        border-radius: 999px;
    }

    .reporte-ru-margin-bar .is-pos { background: #10b981; }
    .reporte-ru-margin-bar .is-baja { background: #f59e0b; }
    .reporte-ru-margin-bar .is-neg { background: #dc2626; }

    .reporte-ru-grid-card .k-grid-header th.k-header {
        position: sticky;
        top: 0;
        z-index: 2;
        background: #f8fafc;
        color: #334155;
        font-weight: 800;
    }

    .reporte-ru-btn-detalle {
        border-radius: 7px;
    }

    @media (max-width: 1400px) {
        .reporte-ru-kpis {
            grid-template-columns: repeat(3, minmax(0, 1fr));
        }
    }

    @media (max-width: 992px) {
        .reporte-ru-kpis,
        .reporte-ru-dashboard-row {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .reporte-ru-donut-layout {
            grid-template-columns: 1fr;
        }

        .reporte-ru-grid-tools {
            width: 100%;
            margin-left: 0;
            margin-top: 10px;
        }
    }

    @media (max-width: 640px) {
        .reporte-ru-kpis,
        .reporte-ru-dashboard-row {
            grid-template-columns: 1fr;
        }

        .reporte-ru-kpi {
            padding-left: 68px;
        }

        .reporte-ru-grid-tools {
            flex-direction: column;
            align-items: stretch;
        }

        .reporte-ru-grid-tools input {
            width: 100%;
        }
    }

    @media (max-width: 1500px) {
        #reporteRuResultados {
            grid-template-columns: repeat(12, minmax(0, 1fr));
        }

        #reporteRuResultados > .reporte-ru-chart-card:not(.reporte-ru-card) {
            grid-column: 1 / 7;
            grid-row: 2;
        }

        #reporteRuResultados > .reporte-ru-dashboard-row > .reporte-ru-chart-card:first-child {
            grid-column: 7 / 13;
            grid-row: 2;
        }

        #reporteRuResultados > .reporte-ru-dashboard-row > .reporte-ru-chart-card--donut {
            grid-column: 1 / 7;
            grid-row: 3;
        }

        #reporteRuResultados > .reporte-ru-ejecutivo {
            grid-column: 7 / 13;
            grid-row: 3;
        }

        #reporteRuResultados > .reporte-ru-grid-card {
            grid-row: 4;
        }
    }

    @media (max-width: 992px) {
        #reporteRuResultados {
            grid-template-columns: 1fr;
        }

        #reporteRuResultados > .reporte-ru-kpis,
        #reporteRuResultados > .reporte-ru-chart-card:not(.reporte-ru-card),
        #reporteRuResultados > .reporte-ru-dashboard-row > .reporte-ru-chart-card:first-child,
        #reporteRuResultados > .reporte-ru-dashboard-row > .reporte-ru-chart-card--donut,
        #reporteRuResultados > .reporte-ru-ejecutivo,
        #reporteRuResultados > .reporte-ru-grid-card {
            grid-column: 1 / -1;
            grid-row: auto;
        }

        .reporte-ru-chart-body {
            height: 250px;
        }

        .reporte-ru-chart-body--donut {
            height: 230px;
        }
    }

    @media (max-width: 640px) {
        .reporte-ru-chart-body,
        .reporte-ru-chart-body--donut {
            height: 220px;
        }

        #reporteRuResultados > .reporte-ru-ejecutivo .reporte-ru-ejecutivo-body {
            grid-template-columns: 1fr;
        }
    }

    .reporte-ru-modal-dialog {
        width: min(1180px, calc(100% - 28px));
    }

    .reporte-ru-modal {
        border: 0;
        border-radius: 12px;
        overflow: hidden;
        box-shadow: 0 24px 70px rgba(15, 23, 42, 0.28);
    }

    .reporte-ru-modal .modal-header {
        position: relative;
        padding: 18px 56px 16px 22px;
        border-bottom: 1px solid #e5e7eb;
        background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
    }

    .reporte-ru-modal .modal-header .close {
        position: absolute;
        top: 15px;
        right: 18px;
        width: 34px;
        height: 34px;
        border-radius: 8px;
        color: #475569;
        opacity: 1;
        text-shadow: none;
    }

    .reporte-ru-modal .modal-header .close:hover {
        background: #e5e7eb;
        color: #0f172a;
    }

    .reporte-ru-modal-eyebrow {
        display: block;
        margin-bottom: 4px;
        font-size: 11px;
        font-weight: 800;
        letter-spacing: 0.04em;
        text-transform: uppercase;
        color: #2563eb;
    }

    .reporte-ru-modal .modal-title {
        margin: 0;
        max-width: 100%;
        overflow: hidden;
        color: #0f172a;
        font-size: 18px;
        font-weight: 800;
        line-height: 1.25;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .reporte-ru-modal .modal-body {
        padding: 18px 22px 22px;
        background: #f8fafc;
    }

    .reporte-ru-modal .modal-footer {
        padding: 12px 22px;
        border-top: 1px solid #e5e7eb;
        background: #fff;
    }

    .reporte-ru-detail-hero {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 16px;
        margin-bottom: 14px;
        padding: 16px;
        border: 1px solid #e5e7eb;
        border-radius: 10px;
        background: #fff;
    }

    .reporte-ru-detail-product {
        min-width: 0;
    }

    .reporte-ru-detail-code {
        display: inline-block;
        margin-bottom: 8px;
        padding: 3px 8px;
        border-radius: 999px;
        background: #eff6ff;
        color: #1d4ed8;
        font-size: 11px;
        font-weight: 800;
    }

    .reporte-ru-detail-product h3 {
        margin: 0;
        color: #0f172a;
        font-size: 18px;
        font-weight: 800;
        line-height: 1.25;
    }

    .reporte-ru-detail-product p {
        margin: 6px 0 0;
        color: #64748b;
        font-size: 13px;
        font-weight: 600;
    }

    .reporte-ru-detail-status {
        flex: 0 0 auto;
        padding: 7px 10px;
        border-radius: 999px;
        font-size: 12px;
        font-weight: 800;
        white-space: nowrap;
    }

    .reporte-ru-detail-status.is-ok {
        background: #ecfdf5;
        color: #047857;
    }

    .reporte-ru-detail-status.is-service {
        background: #eff6ff;
        color: #1d4ed8;
    }

    .reporte-ru-detail-status.is-warning {
        background: #fffbeb;
        color: #b45309;
    }

    .reporte-ru-detail-status.is-danger {
        background: #fef2f2;
        color: #b91c1c;
    }

    .reporte-ru-detail-metrics {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 12px;
    }

    .reporte-ru-detail-kpis {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 12px;
        margin-bottom: 14px;
    }

    .reporte-ru-detail-kpi {
        position: relative;
        min-height: 104px;
        padding: 18px 14px 14px 76px;
        border: 1px solid #e5e7eb;
        border-radius: 10px;
        background: #fff;
        box-shadow: 0 6px 18px rgba(15, 23, 42, 0.05);
    }

    .reporte-ru-detail-kpi-icon {
        position: absolute;
        left: 16px;
        top: 22px;
        width: 44px;
        height: 44px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 18px;
        color: #fff;
    }

    .reporte-ru-detail-kpi.is-blue .reporte-ru-detail-kpi-icon { background: #2563eb; }
    .reporte-ru-detail-kpi.is-green .reporte-ru-detail-kpi-icon { background: #10b981; }
    .reporte-ru-detail-kpi.is-orange .reporte-ru-detail-kpi-icon { background: #f59e0b; }
    .reporte-ru-detail-kpi.is-positive .reporte-ru-detail-kpi-icon { background: #7c3aed; }
    .reporte-ru-detail-kpi.is-negative .reporte-ru-detail-kpi-icon { background: #dc2626; }

    .reporte-ru-detail-kpi-label {
        display: block;
        margin-bottom: 8px;
        color: #475569;
        font-size: 12px;
        font-weight: 800;
        text-transform: uppercase;
    }

    .reporte-ru-detail-kpi strong {
        display: block;
        color: #0f172a;
        font-size: 24px;
        font-weight: 800;
        line-height: 1.15;
        white-space: nowrap;
    }

    .reporte-ru-detail-kpi.is-positive strong { color: #047857; }
    .reporte-ru-detail-kpi.is-negative strong { color: #b91c1c; }

    .reporte-ru-analysis-blocks {
        display: grid;
        grid-template-columns: minmax(280px, 0.9fr) minmax(360px, 1.35fr);
        gap: 14px;
        margin-bottom: 16px;
    }

    .reporte-ru-analysis-card,
    .reporte-ru-sales-section {
        border: 1px solid #e5e7eb;
        border-radius: 10px;
        background: #fff;
        box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04);
    }

    .reporte-ru-analysis-card {
        padding: 18px 18px 16px;
    }

    .reporte-ru-analysis-card h4,
    .reporte-ru-sales-section h4 {
        margin: 0 0 16px;
        color: #17315f;
        font-size: 14px;
        font-weight: 900;
        letter-spacing: 0.02em;
        text-transform: uppercase;
    }

    .reporte-ru-breakdown-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 9px 0;
        color: #334155;
        font-size: 14px;
    }

    .reporte-ru-breakdown-row strong {
        color: #0f172a;
        font-size: 15px;
        font-weight: 800;
        white-space: nowrap;
    }

    .reporte-ru-breakdown-row.is-total {
        margin-top: 8px;
        padding-top: 14px;
        border-top: 1px dashed #cbd5e1;
        font-size: 15px;
        font-weight: 800;
    }

    .reporte-ru-breakdown-row.is-total strong {
        color: #047857;
        font-size: 17px;
    }

    .reporte-ru-calc-row {
        display: grid;
        grid-template-columns: 14px minmax(150px, 1fr) minmax(170px, auto) minmax(110px, auto);
        gap: 12px;
        align-items: center;
        padding: 12px 0;
        border-bottom: 1px solid #e5e7eb;
    }

    .reporte-ru-calc-row:last-child {
        border-bottom: 0;
    }

    .reporte-ru-calc-dot {
        width: 11px;
        height: 11px;
        border-radius: 50%;
    }

    .reporte-ru-calc-dot.is-blue { background: #2563eb; }
    .reporte-ru-calc-dot.is-red { background: #ef4444; }
    .reporte-ru-calc-dot.is-green { background: #10b981; }

    .reporte-ru-calc-text strong {
        display: block;
        color: #0f172a;
        font-size: 14px;
        font-weight: 800;
    }

    .reporte-ru-calc-text em {
        display: block;
        margin-top: 3px;
        color: #64748b;
        font-size: 12px;
        font-style: normal;
    }

    .reporte-ru-calc-formula {
        color: #334155;
        font-size: 14px;
        text-align: right;
        white-space: nowrap;
    }

    .reporte-ru-calc-result {
        color: #0f172a;
        font-size: 15px;
        font-weight: 900;
        text-align: right;
        white-space: nowrap;
    }

    .reporte-ru-sales-section {
        padding: 18px 18px 14px;
    }

    .reporte-ru-detail-table-wrap {
        overflow-x: auto;
        border: 1px solid #e5e7eb;
        border-radius: 8px;
    }

    .reporte-ru-detail-table {
        width: 100%;
        min-width: 760px;
        margin: 0;
        border-collapse: collapse;
        color: #1e293b;
        font-size: 13px;
    }

    .reporte-ru-detail-table th,
    .reporte-ru-detail-table td {
        padding: 10px 12px;
        border-bottom: 1px solid #e5e7eb;
        vertical-align: middle;
    }

    .reporte-ru-detail-table th {
        background: #f8fafc;
        color: #475569;
        font-size: 12px;
        font-weight: 900;
        text-transform: uppercase;
    }

    .reporte-ru-detail-table tbody tr:hover {
        background: #f8fafc;
    }

    .reporte-ru-detail-table tfoot td {
        background: #f8fafc;
        color: #0f172a;
        font-weight: 900;
    }

    .reporte-ru-detail-table .is-center {
        text-align: center;
    }

    .reporte-ru-detail-table .is-money {
        text-align: right;
        white-space: nowrap;
    }

    .reporte-ru-detail-empty {
        padding: 18px !important;
        color: #64748b;
        text-align: center;
    }

    .reporte-ru-detail-metric {
        min-height: 78px;
        padding: 12px;
        border: 1px solid #e5e7eb;
        border-radius: 10px;
        background: #fff;
    }

    .reporte-ru-detail-metric span {
        display: block;
        margin-bottom: 8px;
        color: #64748b;
        font-size: 11px;
        font-weight: 800;
        text-transform: uppercase;
    }

    .reporte-ru-detail-metric strong {
        display: block;
        color: #0f172a;
        font-size: 17px;
        font-weight: 800;
        line-height: 1.15;
        word-break: break-word;
    }

    .reporte-ru-detail-metric.is-main {
        border-color: #bfdbfe;
        background: #eff6ff;
    }

    .reporte-ru-detail-metric.is-positive strong {
        color: #047857;
    }

    .reporte-ru-detail-metric.is-negative {
        border-color: #fecaca;
        background: #fef2f2;
    }

    .reporte-ru-detail-metric.is-negative strong {
        color: #b91c1c;
    }

    @media (max-width: 768px) {
        .reporte-ru-detail-hero {
            flex-direction: column;
        }

        .reporte-ru-detail-status {
            white-space: normal;
        }

        .reporte-ru-detail-kpis,
        .reporte-ru-analysis-blocks {
            grid-template-columns: 1fr;
        }

        .reporte-ru-detail-metrics {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .reporte-ru-calc-row {
            grid-template-columns: 14px minmax(0, 1fr);
        }

        .reporte-ru-calc-formula,
        .reporte-ru-calc-result {
            grid-column: 2;
            text-align: left;
        }
    }

    @media (max-width: 480px) {
        .reporte-ru-modal-dialog {
            width: calc(100% - 14px);
            margin: 7px auto;
        }

        .reporte-ru-modal .modal-title {
            white-space: normal;
        }

        .reporte-ru-detail-metrics {
            grid-template-columns: 1fr;
        }

        .reporte-ru-detail-kpi {
            padding-left: 68px;
        }

        .reporte-ru-detail-kpi strong {
            font-size: 20px;
        }
    }

    @media print {
        .reporte-ru-panel,
        .reporte-ru-toolbar,
        .reporte-tv-loading,
        .k-pager-wrap,
        .reporte-ru-btn-detalle {
            display: none !important;
        }

        .reporte-ru-page {
            padding: 0 !important;
        }

        .reporte-ru-resultados {
            display: block !important;
        }
    }

    .reporte-arqueo-panel {
        display: none;
        margin: 14px 0 18px;
        padding: 16px;
        border: 1px solid #dbe3ef;
        border-radius: 12px;
        background: #fff;
        box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
    }

    .reporte-arqueo-panel.is-open {
        display: block;
    }

    .reporte-arqueo-head {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        justify-content: space-between;
        gap: 10px;
        margin-bottom: 12px;
    }

    .reporte-arqueo-head h4 {
        margin: 0 0 4px;
        font-size: 16px;
        font-weight: 700;
        color: #0f172a;
    }

    .reporte-arqueo-head p {
        margin: 0;
        font-size: 12px;
        color: #64748b;
    }

    .reporte-arqueo-stats {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        margin-bottom: 14px;
    }

    @media (min-width: 992px) {
        .reporte-arqueo-stats {
            grid-template-columns: repeat(3, minmax(0, 1fr));
        }
    }

    @media (min-width: 1200px) {
        .reporte-arqueo-stats {
            grid-template-columns: repeat(6, minmax(0, 1fr));
        }
    }

    .reporte-arqueo-stat {
        padding: 10px 12px;
        border-radius: 10px;
        background: #f8fafc;
        border: 1px solid #e2e8f0;
    }

    .reporte-arqueo-stat--total {
        background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
        border-color: #93c5fd;
    }

    .reporte-arqueo-stat-label {
        display: block;
        font-size: 10px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.35px;
        color: #64748b;
        margin-bottom: 4px;
    }

    .reporte-arqueo-stat-value {
        display: block;
        font-size: 15px;
        font-weight: 700;
        color: #0f172a;
    }

    .reporte-arqueo-stat-value--egreso {
        color: #b91c1c;
    }

    .reporte-arqueo-stat-value--saldo {
        color: #1d4ed8;
        font-size: 16px;
    }

    .reporte-arqueo-grid-card {
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        overflow: hidden;
    }

    .reporte-arqueo-grid-header {
        padding: 10px 14px;
        background: #f8fafc;
        border-bottom: 1px solid #e2e8f0;
    }

    .reporte-arqueo-grid-header h4 {
        margin: 0 0 3px;
        font-size: 13px;
        font-weight: 700;
        color: #334155;
    }

    .reporte-arqueo-grid-header p {
        margin: 0;
        font-size: 11px;
        color: #64748b;
    }

    .reporte-arqueo-grid-body {
        position: relative;
        min-height: 120px;
    }

    .reporte-arqueo-loading {
        display: none;
        position: absolute;
        inset: 0;
        z-index: 5;
        align-items: center;
        justify-content: center;
        background: rgba(255, 255, 255, 0.88);
        font-weight: 600;
        color: #2563eb;
    }

    .reporte-arqueo-loading.is-visible {
        display: flex;
    }

    .reporte-arqueo-row--informativo {
        background: #f8fafc !important;
        color: #64748b;
    }

    #btnArqueoGeneral,
    #exportar_arqueo_pdf {
        background: linear-gradient(135deg, #fbbf24, #f59e0b);
        border-color: #d97706;
        color: #78350f;
        font-weight: 700;
    }

    #btnArqueoGeneral:hover,
    #btnArqueoGeneral:focus,
    #exportar_arqueo_pdf:hover,
    #exportar_arqueo_pdf:focus {
        background: linear-gradient(135deg, #f59e0b, #d97706);
        border-color: #b45309;
        color: #78350f;
    }

    #gridArqueoGeneral .k-grid-header {
        background: linear-gradient(135deg, #78350f 0%, #b45309 100%);
    }

    #gridArqueoGeneral .k-grid-header th.k-header {
        color: #fffbeb !important;
        font-weight: 700;
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: 0.35px;
        background: transparent !important;
        border-color: rgba(255, 255, 255, 0.1) !important;
    }

    /* Dashboard inicio — viewport-aware (FHD sin scroll, responsive en pantallas pequeñas) */
    body.page-inicio {
        display: flex;
        flex-direction: column;
        min-height: 100vh;
        max-height: 100vh;
        overflow: hidden;
    }

    body.page-inicio .app-topnav-shell {
        flex-shrink: 0;
    }

    body.page-inicio > .container-fluid {
        display: none !important;
    }

    body.page-inicio #container2 {
        flex-shrink: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 2px;
        padding: 6px 12px 8px;
        margin: 0;
        text-align: center;
        border-top: 1px solid #e2e8f0;
        background: #f8fafc;
    }

    body.page-inicio #container2 img {
        width: 56px !important;
        height: auto;
        margin: 0 !important;
    }

    body.page-inicio #container2 h3 {
        margin: 0;
        font-size: 12px;
        font-weight: 700;
        line-height: 1.25;
        color: #334155;
    }

    .inicio-dash {
        width: 100%;
        max-width: 100%;
        flex: 1 1 auto;
        min-height: 0;
        padding: 0 10px 6px;
        box-sizing: border-box;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        gap: 6px;
    }

    .inicio-dash-toolbar {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 6px 10px;
        padding: 7px 12px;
        border-radius: 8px;
        background: linear-gradient(135deg, #0f172a 0%, #1e293b 55%, #334155 100%);
        border: 1px solid #334155;
        min-height: 36px;
        width: 100%;
        box-sizing: border-box;
        box-shadow: 0 2px 8px rgba(15, 23, 42, 0.1);
        flex-shrink: 0;
    }

    .inicio-dash-toolbar-user {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: 12px;
        font-weight: 600;
        color: #f8fafc;
        min-width: 0;
    }

    .inicio-dash-toolbar-user .glyphicon {
        color: #94a3b8;
        font-size: 12px;
    }

    .inicio-dash-toolbar-user span {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .inicio-dash-toolbar-filters {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 6px 8px;
        padding: 4px 8px;
        border-radius: 6px;
        background: rgba(255, 255, 255, 0.97);
    }

    .inicio-dash-toolbar-filters label {
        margin: 0;
        font-size: 10px;
        font-weight: 700;
        color: #64748b;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .inicio-dash-toolbar-filters select {
        width: auto;
        min-width: 110px;
        max-width: 140px;
        height: 26px;
        padding: 2px 6px;
        font-size: 11px;
        border-radius: 5px;
        border-color: #cbd5e1;
    }

    .inicio-dash .sms {
        flex-shrink: 0;
    }

    .inicio-dash-section-head {
        padding: 0 2px 3px;
        flex-shrink: 0;
    }

    .inicio-dash-section-head h3,
    .inicio-dash-panel-head h3 {
        margin: 0;
        font-size: 11px;
        font-weight: 700;
        color: #0f172a;
        text-transform: uppercase;
        letter-spacing: 0.35px;
    }

    .inicio-dash-section-head p,
    .inicio-dash-panel-head p {
        display: none;
    }

    .inicio-dash-shortcuts-section {
        width: 100%;
        flex-shrink: 0;
    }

    .inicio-dash-shortcuts {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px;
        width: 100%;
        box-sizing: border-box;
    }

    @media (min-width: 640px) {
        .inicio-dash-shortcuts {
            grid-template-columns: repeat(3, minmax(0, 1fr));
        }
    }

    @media (min-width: 992px) {
        .inicio-dash-shortcuts {
            grid-template-columns: repeat(6, minmax(0, 1fr));
        }
    }

    .inicio-dash-shortcut {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        gap: 8px;
        min-height: 44px;
        padding: 6px 10px;
        border-radius: 8px;
        border: 1px solid #e2e8f0;
        background: #fff;
        color: #1e293b;
        text-decoration: none;
        box-shadow: 0 1px 4px rgba(15, 23, 42, 0.04);
        transition: border-color 0.15s ease, box-shadow 0.15s ease;
    }

    .inicio-dash-shortcut:hover,
    .inicio-dash-shortcut:focus {
        text-decoration: none;
        color: #0f172a;
        box-shadow: 0 3px 10px rgba(15, 23, 42, 0.08);
    }

    .inicio-dash-shortcut-icon {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 32px;
        height: 32px;
        border-radius: 8px;
        flex-shrink: 0;
    }

    .inicio-dash-shortcut--ventas .inicio-dash-shortcut-icon { background: linear-gradient(135deg, #dbeafe, #bfdbfe); }
    .inicio-dash-shortcut--proformas .inicio-dash-shortcut-icon { background: linear-gradient(135deg, #ede9fe, #ddd6fe); }
    .inicio-dash-shortcut--clientes .inicio-dash-shortcut-icon { background: linear-gradient(135deg, #ccfbf1, #99f6e4); }
    .inicio-dash-shortcut--proveedores .inicio-dash-shortcut-icon { background: linear-gradient(135deg, #ffedd5, #fed7aa); }
    .inicio-dash-shortcut--ingresos .inicio-dash-shortcut-icon { background: linear-gradient(135deg, #dcfce7, #bbf7d0); }
    .inicio-dash-shortcut--compras .inicio-dash-shortcut-icon { background: linear-gradient(135deg, #fce7f3, #fbcfe8); }

    .inicio-dash-shortcut--ventas:hover { border-color: #3b82f6; }
    .inicio-dash-shortcut--proformas:hover { border-color: #8b5cf6; }
    .inicio-dash-shortcut--clientes:hover { border-color: #14b8a6; }
    .inicio-dash-shortcut--proveedores:hover { border-color: #f97316; }
    .inicio-dash-shortcut--ingresos:hover { border-color: #22c55e; }
    .inicio-dash-shortcut--compras:hover { border-color: #ec4899; }

    .inicio-dash-shortcut-icon img {
        width: 22px;
        height: 22px;
        object-fit: contain;
        display: block;
    }

    .inicio-dash-shortcut-text {
        font-size: 11px;
        font-weight: 700;
        text-align: left;
        line-height: 1.2;
    }

    .inicio-dash-panel {
        display: flex;
        flex-direction: column;
        min-height: 0;
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 8px;
        box-shadow: 0 2px 8px rgba(15, 23, 42, 0.05);
        overflow: hidden;
    }

    .inicio-dash-panel-head {
        flex-shrink: 0;
        padding: 7px 12px;
        border-bottom: 1px solid #eef2f7;
        background: #f8fafc;
    }

    .inicio-dash-panel-head--chart {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 6px 12px;
    }

    .inicio-dash-chart-legend {
        display: inline-flex;
        align-items: center;
        gap: 10px;
    }

    .inicio-dash-chart-legend-item {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        font-size: 10px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .inicio-dash-chart-legend-item::before {
        content: "";
        width: 8px;
        height: 8px;
        border-radius: 2px;
        flex-shrink: 0;
    }

    .inicio-dash-chart-legend-item--ventas::before {
        background: linear-gradient(135deg, #3b82f6, #1d4ed8);
    }

    .inicio-dash-chart-legend-item--compras::before {
        background: linear-gradient(135deg, #a78bfa, #7c3aed);
    }

    .inicio-dash-panel-body {
        flex: 1;
        min-height: 0;
        display: flex;
        flex-direction: column;
        padding: 0;
    }

    .inicio-dash-panel--chart {
        flex: 1 1 auto;
        min-height: 140px;
    }

    .inicio-dash-chart-wrap {
        flex: 1 1 auto;
        position: relative;
        min-height: 140px;
        height: auto;
        width: 100%;
        padding: 2px 10px 8px;
        box-sizing: border-box;
    }

    .inicio-dash-chart-wrap canvas {
        width: 100% !important;
        height: 100% !important;
    }

    .inicio-dash-metrics-footer {
        width: 100%;
        flex-shrink: 0;
    }

    .inicio-dash-metrics {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px;
        width: 100%;
        box-sizing: border-box;
    }

    @media (min-width: 768px) {
        .inicio-dash-metrics {
            grid-template-columns: repeat(4, minmax(0, 1fr));
        }
    }

    .inicio-dash-metric {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 8px;
        min-height: 54px;
        padding: 8px 10px;
        border-radius: 8px;
        color: #fff;
        box-shadow: 0 2px 8px rgba(15, 23, 42, 0.1);
        overflow: hidden;
        position: relative;
    }

    .inicio-dash-metric::after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        width: 50px;
        height: 50px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.08);
        transform: translate(30%, -30%);
        pointer-events: none;
    }

    .inicio-dash-metric--ventas-hoy {
        background: linear-gradient(135deg, #0d9488 0%, #0f766e 100%);
    }

    .inicio-dash-metric--ventas-mes {
        background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
    }

    .inicio-dash-metric--compras-mes {
        background: linear-gradient(135deg, #f97316 0%, #ea580c 100%);
    }

    .inicio-dash-metric--clientes {
        background: linear-gradient(135deg, #0891b2 0%, #0e7490 100%);
    }

    .inicio-dash-metric-icon {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 30px;
        height: 30px;
        border-radius: 7px;
        background: rgba(255, 255, 255, 0.18);
        flex-shrink: 0;
    }

    .inicio-dash-metric-icon .glyphicon {
        font-size: 14px;
    }

    .inicio-dash-metric-body {
        min-width: 0;
        flex: 1;
    }

    .inicio-dash-metric-label {
        font-size: 9px;
        font-weight: 700;
        letter-spacing: 0.4px;
        text-transform: uppercase;
        opacity: 0.92;
        margin-bottom: 2px;
        line-height: 1.2;
    }

    .inicio-dash-metric-value {
        font-size: 14px;
        font-weight: 700;
        line-height: 1.2;
        word-break: break-word;
    }

    .inicio-dash-metric-value span {
        display: inline-block;
    }

    /* FHD: gráfico grande, todo visible sin scroll */
    @media (min-width: 1200px) and (min-height: 700px) {
        .inicio-dash {
            gap: 8px;
            padding: 0 12px 8px;
        }

        .inicio-dash-shortcut {
            min-height: 48px;
            padding: 8px 12px;
        }

        .inicio-dash-shortcut-icon {
            width: 36px;
            height: 36px;
        }

        .inicio-dash-shortcut-icon img {
            width: 24px;
            height: 24px;
        }

        .inicio-dash-shortcut-text {
            font-size: 12px;
        }

        .inicio-dash-panel--chart {
            min-height: 180px;
        }

        .inicio-dash-chart-wrap {
            min-height: 180px;
        }

        .inicio-dash-metric {
            min-height: 58px;
            padding: 10px 12px;
        }

        .inicio-dash-metric-value {
            font-size: 16px;
        }

        body.page-inicio #container2 h3 {
            font-size: 13px;
        }
    }

    /* Pantallas pequeñas: permitir scroll y alturas fijas más bajas */
    @media (max-width: 991px) {
        body.page-inicio {
            max-height: none;
            overflow-y: auto;
            overflow-x: hidden;
        }

        .inicio-dash {
            overflow: visible;
            flex: none;
        }

        .inicio-dash-panel--chart {
            flex: none;
        }

        .inicio-dash-chart-wrap {
            flex: none;
            height: 200px;
            min-height: 200px;
        }

        .inicio-dash-shortcut {
            flex-direction: column;
            justify-content: center;
            min-height: 58px;
            padding: 6px 4px;
        }

        .inicio-dash-shortcut-text {
            font-size: 10px;
            text-align: center;
        }

        .inicio-dash-metric {
            min-height: 50px;
            padding: 7px 8px;
        }

        .inicio-dash-metric-value {
            font-size: 13px;
        }
    }

    @media (max-width: 575px) {
        .inicio-dash-chart-wrap {
            height: 170px;
            min-height: 170px;
        }
    }

    /* Login */
    body:has(.login-page) {
        margin: 0;
        min-height: 100vh;
        background: #0f172a;
    }

    .login-page {
        min-height: 100vh;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 24px 16px;
        box-sizing: border-box;
        background:
            linear-gradient(135deg, rgba(15, 23, 42, 0.92) 0%, rgba(30, 58, 95, 0.88) 50%, rgba(51, 65, 85, 0.9) 100%),
            url('../../images/fondo.jpg') center center / cover no-repeat;
    }

    .login-card {
        width: 100%;
        max-width: 420px;
        padding: 28px 28px 24px;
        border-radius: 16px;
        background: rgba(255, 255, 255, 0.98);
        border: 1px solid rgba(226, 232, 240, 0.9);
        box-shadow: 0 24px 48px rgba(15, 23, 42, 0.28);
        box-sizing: border-box;
    }

    .login-card-brand {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 10px;
        margin-bottom: 22px;
    }

    .login-logo-wrap {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 150px;
        height: 105px;
        box-sizing: border-box;
    }

    .login-logo {
        width: 100%;
        height: 100%;
        object-fit: contain;
        display: block;
    }

    .login-empresa {
        margin: 0;
        font-size: 18px;
        font-weight: 700;
        line-height: 1.25;
        color: #0f172a;
    }

    .login-modo {
        display: inline-block;
        padding: 4px 12px;
        border-radius: 999px;
        background: #eff6ff;
        border: 1px solid #bfdbfe;
        color: #1d4ed8;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.35px;
        text-transform: uppercase;
    }

    .login-alert {
        margin-bottom: 16px;
        padding: 10px 12px;
        border-radius: 8px;
        background: #fef3c7;
        border: 1px solid #fcd34d;
        color: #92400e;
        font-size: 13px;
        font-weight: 600;
        text-align: center;
        line-height: 1.35;
    }

    .login-form {
        display: flex;
        flex-direction: column;
        gap: 16px;
    }

    .login-field label {
        display: block;
        margin: 0 0 6px;
        font-size: 11px;
        font-weight: 700;
        color: #64748b;
        text-transform: uppercase;
        letter-spacing: 0.35px;
    }

    .login-input-wrap {
        position: relative;
    }

    .login-input-icon {
        position: absolute;
        left: 12px;
        top: 50%;
        transform: translateY(-50%);
        color: #94a3b8;
        font-size: 14px;
        pointer-events: none;
        z-index: 1;
    }

    .login-input,
    .login-select {
        width: 100%;
        height: 44px;
        padding: 8px 12px 8px 38px;
        font-size: 14px;
        font-weight: 500;
        color: #0f172a;
        border: 1px solid #cbd5e1;
        border-radius: 10px;
        background: #fff;
        box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
        transition: border-color 0.15s ease, box-shadow 0.15s ease;
        box-sizing: border-box;
    }

    .login-input:focus,
    .login-select:focus {
        outline: none;
        border-color: #3b82f6;
        box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
    }

    .login-select {
        appearance: none;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%2364748b' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: right 12px center;
        padding-right: 34px;
    }

    .login-submit {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        width: 100%;
        height: 46px;
        margin-top: 4px;
        border: none;
        border-radius: 10px;
        background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
        color: #fff;
        font-size: 15px;
        font-weight: 700;
        cursor: pointer;
        box-shadow: 0 8px 20px rgba(37, 99, 235, 0.28);
        transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
    }

    .login-submit:hover,
    .login-submit:focus {
        background: linear-gradient(135deg, #1d4ed8 0%, #1e40af 100%);
        box-shadow: 0 10px 24px rgba(37, 99, 235, 0.34);
        color: #fff;
        outline: none;
    }

    .login-submit:active {
        transform: translateY(1px);
    }

    @media (max-width: 480px) {
        .login-card {
            padding: 22px 18px 18px;
            border-radius: 14px;
        }

        .login-logo-wrap {
            width: 130px;
            height: 92px;
        }

        .login-empresa {
            font-size: 16px;
        }
    }

    /* Menú superior */
    .app-topnav-shell {
        padding: 4px 12px 0;
        margin: 0;
        box-sizing: border-box;
    }

    .app-topnav {
        background: #fff;
        border: 1px solid #dbe3ef;
        border-radius: 8px;
        box-shadow: 0 2px 10px rgba(15, 23, 42, 0.07);
        margin-bottom: 0;
        min-height: 48px;
    }

    .app-topnav-inner {
        padding: 0 8px;
    }

    .app-topnav .navbar-header {
        display: flex;
        align-items: center;
        gap: 8px;
        min-height: 48px;
    }

    .app-topnav-modo {
        display: inline-block;
        padding: 3px 10px;
        border-radius: 999px;
        background: #eff6ff;
        border: 1px solid #bfdbfe;
        color: #1d4ed8;
        font-size: 10px;
        font-weight: 700;
        letter-spacing: 0.3px;
        line-height: 1.2;
    }

    .app-topnav .navbar-toggle {
        border-color: #cbd5e1;
        margin-top: 8px;
        margin-bottom: 8px;
        padding: 7px 8px;
    }

    .app-topnav .navbar-toggle .icon-bar {
        background-color: #334155;
    }

    .app-topnav .navbar-collapse {
        border-top: none;
    }

    .app-topnav-menu {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 1px;
        padding: 2px 0;
    }

    .app-topnav-menu > li {
        float: none;
    }

    .app-topnav-menu > li > a,
    .app-topnav-menu > li > a:hover,
    .app-topnav-menu > li > a:focus {
        background: transparent !important;
    }

    .app-topnav-item {
        display: inline-flex !important;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        gap: 6px;
        min-height: 38px;
        padding: 5px 10px !important;
        color: #1e293b !important;
        text-decoration: none;
        border-radius: 6px;
        border: 1px solid transparent;
        transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
        white-space: nowrap;
    }

    .app-topnav-item:hover,
    .app-topnav-item:focus,
    .app-topnav .dropdown.open > a.app-topnav-item {
        background: #f1f5f9 !important;
        border-color: #e2e8f0;
        color: #0f172a !important;
    }

    .app-topnav-item--plain {
        padding: 5px 12px !important;
    }

    .app-topnav-item--logout {
        color: #b91c1c !important;
    }

    .app-topnav-item--logout:hover,
    .app-topnav-item--logout:focus {
        background: #fef2f2 !important;
        border-color: #fecaca !important;
        color: #991b1b !important;
    }

    .app-topnav-icon {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 28px;
        height: 28px;
        border-radius: 6px;
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        padding: 3px;
        box-sizing: border-box;
        flex-shrink: 0;
    }

    .app-topnav-icon img {
        max-width: 20px;
        max-height: 20px;
        display: block;
        object-fit: contain;
    }

    .app-topnav-label {
        font-size: 13px;
        font-weight: 600;
        line-height: 1.2;
        color: inherit;
        letter-spacing: 0;
        text-transform: none;
    }

    .app-topnav-caret {
        margin-left: 2px;
        border-top-color: #64748b;
    }

    .app-topnav-item--menu .app-topnav-label {
        max-width: 160px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .app-topnav-dropdown {
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        padding: 8px 0;
        margin-top: 2px;
        box-shadow: 0 12px 32px rgba(15, 23, 42, 0.12);
        min-width: 240px;
    }

    .app-topnav-dropdown > li > a {
        padding: 11px 18px;
        font-size: 14px;
        font-weight: 600;
        color: #334155;
        line-height: 1.35;
        transition: background 0.12s ease, color 0.12s ease;
    }

    .app-topnav-dropdown > li > a:hover,
    .app-topnav-dropdown > li > a:focus {
        background: #eff6ff;
        color: #1d4ed8;
    }

    .app-topnav-brand {
        display: flex;
        align-items: center;
        margin-right: 4px !important;
        min-height: 48px;
    }

    .app-topnav-brand > li {
        display: flex;
        align-items: center;
    }

    .app-topnav-logo {
        max-height: 36px;
        max-width: 120px;
        width: auto;
        height: auto;
        object-fit: contain;
        padding: 2px 0;
    }

    @media (max-width: 991px) {
        .app-topnav-shell {
            padding: 6px 8px 0;
        }

        .app-topnav {
            border-radius: 8px;
        }

        .app-topnav .navbar-header {
            min-height: 44px;
        }

        .app-topnav-menu {
            flex-direction: column;
            align-items: stretch;
            width: 100%;
            margin: 0;
            padding: 6px 0 10px;
            gap: 3px;
        }

        .app-topnav-item {
            width: 100%;
            min-height: 40px;
            padding: 8px 12px !important;
            white-space: normal;
        }

        .app-topnav-item--menu .app-topnav-label {
            max-width: none;
            flex: 1;
        }

        .app-topnav-brand {
            width: 100%;
            justify-content: center;
            margin: 4px 0 8px !important;
            float: none !important;
            min-height: 0;
        }

        .app-topnav-dropdown {
            position: static;
            float: none;
            width: 100%;
            box-shadow: none;
            border: none;
            background: #f8fafc;
            margin: 0 0 6px;
            padding: 4px 0;
        }

        .app-topnav-dropdown > li > a {
            padding-left: 56px;
        }
    }

    nav.app-topnav:hover {
        box-shadow: 0 4px 16px rgba(15, 23, 42, 0.1);
    }

    /* Módulo clientes — columnas y detalles (layout estándar en nexo-module-layout.css) */
    .clientes-page {
        padding: 0 12px 24px;
    }

    .clientes-page.erp-module-page {
        padding: 0;
    }

    .clientes-panel {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
        padding: 18px 20px;
        margin-bottom: 14px;
    }

    .clientes-panel-head {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        margin-bottom: 16px;
    }

    .clientes-panel-head h2 {
        margin: 0;
        font-size: 22px;
        font-weight: 700;
        color: #1e293b;
    }

    .clientes-panel-head p {
        margin: 0;
        font-size: 13px;
        color: #64748b;
    }

    .clientes-flash {
        border-radius: 8px;
        padding: 10px 14px;
        margin-bottom: 14px;
        font-size: 13px;
        font-weight: 600;
    }

    .clientes-flash:not(:empty) {
        background: #eff6ff;
        border: 1px solid #bfdbfe;
        color: #1d4ed8;
    }

    .clientes-filters {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 12px;
        align-items: end;
    }

    .clientes-field label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .clientes-field .form-control {
        border-radius: 8px;
        border-color: #cbd5e1;
        min-height: 36px;
        font-size: 13px;
    }

    .clientes-filter-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .clientes-filter-actions .btn {
        min-width: 100px;
        font-weight: 600;
        border-radius: 8px;
        padding: 8px 14px;
    }

    .clientes-toolbar {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        margin-bottom: 14px;
        padding: 12px 16px;
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 10px;
        box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
    }

    .clientes-toolbar-left,
    .clientes-toolbar-right {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px;
    }

    .clientes-toolbar .btn {
        font-weight: 600;
        border-radius: 8px;
        padding: 7px 14px;
        font-size: 13px;
    }

    .clientes-toolbar .btn-success {
        background: #16a34a;
        border-color: #15803d;
    }

    .clientes-toolbar .btn-export {
        background: #2563eb;
        border-color: #1d4ed8;
        color: #fff;
    }

    .clientes-toolbar .btn-export-pdf {
        background: #fff;
        border-color: #cbd5e1;
        color: #334155;
    }

    .clientes-toolbar .btn-import {
        background: #0ea5e9;
        border-color: #0284c7;
        color: #fff;
    }

    .clientes-grid-card {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
        overflow: hidden;
    }

    .clientes-table-wrap {
        overflow-x: auto;
    }

    .clientes-table {
        width: 100%;
        margin: 0;
        border-collapse: collapse;
        font-size: 13px;
    }

    .clientes-table thead {
        background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
    }

    .clientes-table thead th {
        color: #f8fafc !important;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        padding: 12px 10px;
        text-align: center;
        vertical-align: middle;
        border: none !important;
        white-space: nowrap;
    }

    .clientes-table thead th.col-cliente-nombre {
        text-align: left;
    }

    .clientes-table tbody td {
        padding: 10px;
        vertical-align: middle;
        border-top: 1px solid #eef2f7 !important;
        color: #334155;
    }

    .clientes-table tbody tr:hover {
        background: #f8fafc;
    }

    .clientes-table .col-num {
        text-align: center;
        width: 60px;
        color: #64748b;
        font-weight: 600;
    }

    .clientes-table .col-tipo,
    .clientes-table .col-doc,
    .clientes-table .col-usuario {
        text-align: center;
        white-space: nowrap;
    }

    .clientes-table .col-nombre {
        text-align: left;
        font-weight: 600;
        color: #1e293b;
        max-width: 280px;
    }

    .clientes-table .col-direccion {
        text-align: left;
        max-width: 220px;
        color: #64748b;
    }

    .clientes-table .col-acciones {
        text-align: center;
        white-space: nowrap;
        width: 90px;
    }

    .clientes-table a.clientes-link-doc {
        color: #2563eb;
        font-weight: 700;
        text-decoration: none;
    }

    .clientes-table a.clientes-link-doc:hover {
        text-decoration: underline;
        color: #1d4ed8;
    }

    .clientes-btn-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 32px;
        height: 32px;
        border-radius: 8px;
        padding: 0;
        font-size: 13px;
    }

    .clientes-btn-icon.btn-primary {
        background: #2563eb;
        border-color: #1d4ed8;
    }

    .clientes-btn-icon.btn-danger {
        background: #ef4444;
        border-color: #dc2626;
    }

    .clientes-pagination {
        padding: 14px 16px;
        border-top: 1px solid #eef2f7;
        text-align: center;
        background: #f8fafc;
    }

    .clientes-pagination .pagination {
        margin: 0;
    }

    .clientes-empty {
        padding: 40px 20px;
        text-align: center;
        color: #64748b;
        font-size: 14px;
    }

    .clientes-estado-page .clientes-panel-head p {
        margin: 4px 0 0;
    }

    .clientes-estado-filters {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        align-items: flex-end;
    }

    .clientes-field--cliente {
        flex: 1 1 260px;
        min-width: 220px;
    }

    .clientes-field--fecha {
        width: 140px;
    }

    .clientes-field--actions {
        flex: 1 1 320px;
    }

    .clientes-actions-label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .clientes-estado-result-head {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 16px 18px 0;
    }

    .clientes-estado-print-btn {
        font-weight: 600;
        border-radius: 8px;
        padding: 8px 14px;
        font-size: 13px;
        border-color: #2563eb;
        color: #1d4ed8;
        background: #eff6ff;
    }

    .clientes-estado-print-btn:hover,
    .clientes-estado-print-btn:focus {
        background: #2563eb;
        border-color: #1d4ed8;
        color: #fff;
    }

    .clientes-estado-result-head h3 {
        margin: 0;
        font-size: 16px;
        font-weight: 700;
        color: #1e293b;
    }

    .clientes-estado-result-head p {
        margin: 4px 0 0;
        font-size: 12px;
        color: #64748b;
    }

    .clientes-estado-content {
        padding: 16px 18px 20px;
        min-height: 120px;
    }

    .clientes-estado-result .clientes-estado-content:empty::before {
        content: 'Seleccione un cliente y pulse Buscar para ver el detalle.';
        display: block;
        padding: 28px 12px;
        text-align: center;
        color: #94a3b8;
        font-size: 14px;
    }

    .clientes-estado-loading,
    .clientes-estado-empty {
        padding: 36px 20px;
        text-align: center;
        color: #64748b;
        font-size: 14px;
    }

    .clientes-estado-loading i,
    .clientes-estado-empty i {
        display: block;
        font-size: 28px;
        margin-bottom: 10px;
        color: #94a3b8;
    }

    .clientes-estado-table-scroll {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .clientes-estado-table {
        margin: 0;
        min-width: 1080px;
        font-size: 12px;
        border-collapse: separate;
        border-spacing: 0;
    }

    .clientes-estado-table thead th {
        background: #f8fafc;
        color: #475569;
        font-size: 10px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.3px;
        border-bottom: 2px solid #e2e8f0 !important;
        padding: 10px 8px !important;
        white-space: nowrap;
        vertical-align: middle;
        text-align: center !important;
    }

    .clientes-estado-table thead th.clientes-estado-th-cliente,
    .clientes-estado-table tbody td.clientes-estado-td-cliente {
        text-align: left !important;
    }

    .clientes-estado-table tbody td {
        padding: 8px !important;
        vertical-align: middle !important;
        border-top: 1px solid #eef2f7 !important;
        text-align: center !important;
    }

    .clientes-estado-table tbody td.clientes-estado-td-cliente {
        max-width: 180px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-weight: 600;
        color: #1e293b;
    }

    .clientes-estado-table tbody td.clientes-estado-td-usuario {
        max-width: 110px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 11px;
    }

    .clientes-estado-table tbody td.clientes-estado-td-monto,
    .clientes-estado-table tbody td.clientes-estado-td-saldo {
        white-space: nowrap;
        font-variant-numeric: tabular-nums;
    }

    .clientes-estado-group-row td {
        background: #f1f5f9 !important;
        border-top: 0 !important;
        padding: 8px 12px !important;
        text-align: left !important;
    }

    .clientes-estado-group-badge {
        display: inline-block;
        padding: 4px 10px;
        border-radius: 999px;
        background: #dbeafe;
        color: #1d4ed8;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.4px;
    }

    .clientes-estado-doc-row--credito {
        background: #fff7ed;
    }

    .clientes-estado-doc-row--credito:hover {
        background: #ffedd5;
    }

    .clientes-estado-cobro-row {
        background: #eff6ff;
    }

    .clientes-estado-cobro-row:hover {
        background: #dbeafe;
    }

    .clientes-estado-cobro-tag {
        display: inline-block;
        padding: 2px 8px;
        border-radius: 999px;
        background: #2563eb;
        color: #fff;
        font-size: 10px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .clientes-estado-subtotal-row td,
    .clientes-estado-grand-total-row td {
        background: #f8fafc !important;
        text-align: left !important;
        font-size: 11px;
    }

    .clientes-estado-grand-total-row td {
        border-top: 2px solid #2563eb !important;
        background: #eff6ff !important;
    }

    .clientes-estado-td-saldo strong {
        color: #1d4ed8;
    }

    .clientes-estado-th-estado,
    .clientes-estado-td-estado {
        min-width: 130px;
        max-width: 170px;
        text-align: center !important;
    }

    .clientes-estado-badge {
        display: inline-block;
        padding: 2px 8px;
        border-radius: 999px;
        font-size: 10px;
        font-weight: 700;
        letter-spacing: 0.2px;
        line-height: 1.3;
        white-space: nowrap;
    }

    .clientes-estado-badge--pagado {
        background: #dcfce7;
        color: #15803d;
    }

    .clientes-estado-badge--pendiente {
        background: #ffedd5;
        color: #c2410c;
    }

    .clientes-estado-badge--parcial {
        background: #fef3c7;
        color: #b45309;
    }

    .clientes-estado-badge--contado {
        background: #f1f5f9;
        color: #475569;
    }

    .clientes-estado-badge--en-plazo {
        background: #dbeafe;
        color: #1d4ed8;
    }

    .clientes-estado-badge--fuera-plazo,
    .clientes-estado-badge--vencido {
        background: #fee2e2;
        color: #b91c1c;
    }

    .clientes-estado-badge--en-curso {
        background: #f1f5f9;
        color: #64748b;
    }

    .clientes-estado-td-comp strong {
        color: #1e293b;
        font-weight: 700;
    }

    @media (max-width: 991px) {
        .clientes-filters {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .clientes-field--fecha,
        .clientes-field--actions {
            width: 100%;
        }
    }

    @media (max-width: 575px) {
        .clientes-page {
            padding: 0 8px 16px;
        }

        .clientes-filters {
            grid-template-columns: 1fr;
        }

        .clientes-filter-actions {
            width: 100%;
        }

        .clientes-filter-actions .btn {
            flex: 1;
        }

        .clientes-toolbar {
            flex-direction: column;
            align-items: stretch;
        }

        .clientes-toolbar-left,
        .clientes-toolbar-right {
            width: 100%;
            justify-content: center;
        }

        .clientes-toolbar .btn {
            flex: 1 1 auto;
        }
    }

    /* Formulario clientes */
    .clientes-form-page {
        padding: 0 12px 28px;
        max-width: 960px;
        margin: 0 auto;
    }

    .clientes-form-top {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 14px;
    }

    .clientes-form-top h2 {
        margin: 0;
        font-size: 22px;
        font-weight: 700;
        color: #1e293b;
    }

    .clientes-form-top p {
        margin: 4px 0 0;
        font-size: 13px;
        color: #64748b;
    }

    .clientes-form-back {
        font-weight: 600;
        border-radius: 8px;
        padding: 8px 16px;
    }

    .clientes-form-panel {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
        padding: 20px 22px;
        margin-bottom: 14px;
    }

    .clientes-form-section-title {
        margin: 0 0 14px;
        padding-bottom: 8px;
        border-bottom: 1px solid #eef2f7;
        font-size: 13px;
        font-weight: 700;
        color: #334155;
        text-transform: uppercase;
        letter-spacing: 0.35px;
    }

    .clientes-form-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px 16px;
    }

    .clientes-form-field {
        min-width: 0;
    }

    .clientes-form-field label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
    }

    .clientes-form-field .form-control {
        border-radius: 8px;
        border-color: #cbd5e1;
        min-height: 38px;
        font-size: 13px;
    }

    .clientes-form-field--full {
        grid-column: 1 / -1;
    }

    .clientes-form-doc-row {
        display: flex;
        gap: 8px;
        align-items: stretch;
    }

    .clientes-form-doc-row .form-control {
        flex: 1;
    }

    .clientes-form-search {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 38px;
        min-width: 38px;
        border-radius: 8px;
        border: 1px solid #cbd5e1;
        background: #f8fafc;
        color: #2563eb;
        text-decoration: none;
        transition: background 0.15s ease, border-color 0.15s ease;
    }

    .clientes-form-search:hover,
    .clientes-form-search:focus {
        background: #eff6ff;
        border-color: #2563eb;
        color: #1d4ed8;
        text-decoration: none;
    }

    .clientes-form-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        justify-content: flex-end;
        padding-top: 6px;
    }

    .clientes-form-actions .btn-primary {
        min-width: 140px;
        font-weight: 700;
        border-radius: 8px;
        padding: 10px 20px;
        background: #2563eb;
        border-color: #1d4ed8;
    }

    @media (max-width: 767px) {
        .clientes-form-page {
            padding: 0 8px 20px;
        }

        .clientes-form-grid {
            grid-template-columns: 1fr;
        }

        .clientes-form-actions {
            justify-content: stretch;
        }

        .clientes-form-actions .btn-primary {
            width: 100%;
        }
    }

    /* Módulo comprobantes — listado */
    .comprobantes-page {
        padding: 0 8px 24px;
        max-width: 100%;
        overflow-x: hidden;
    }

    .comprobantes-panel {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
        padding: 18px 20px;
        margin-bottom: 14px;
    }

    .comprobantes-panel-head {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        justify-content: space-between;
        gap: 10px;
        margin-bottom: 16px;
    }

    .comprobantes-panel-head h2 {
        margin: 0;
        font-size: 22px;
        font-weight: 700;
        color: #1e293b;
    }

    .comprobantes-panel-head p {
        margin: 4px 0 0;
        font-size: 13px;
        color: #64748b;
    }

    .comprobantes-panel-head p strong {
        color: #0f172a;
    }

    .comprobantes-flash {
        border-radius: 8px;
        padding: 10px 14px;
        margin-bottom: 14px;
        font-size: 13px;
        font-weight: 600;
        background: #ecfdf5;
        border: 1px solid #a7f3d0;
        color: #047857;
    }

    .comprobantes-filters {
        display: grid;
        grid-template-columns: repeat(6, minmax(0, 1fr));
        gap: 12px;
        align-items: end;
    }

    .comprobantes-field label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .comprobantes-field .form-control {
        border-radius: 8px;
        border-color: #cbd5e1;
        min-height: 36px;
        font-size: 13px;
    }

    .comprobantes-field--wide {
        grid-column: span 2;
    }

    .comprobantes-field--dates .comprobantes-date-range {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        align-items: center;
    }

    .comprobantes-field--dates .comprobantes-date-range .form-control {
        flex: 1 1 110px;
        min-width: 110px;
    }

    .comprobantes-filter-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .comprobantes-filter-actions .btn {
        min-width: 100px;
        font-weight: 600;
        border-radius: 8px;
        padding: 8px 14px;
    }

    .comprobantes-filters-extra {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        align-items: center;
        margin-top: 12px;
        padding-top: 12px;
        border-top: 1px solid #eef2f7;
    }

    .comprobantes-total-row {
        margin-top: 12px;
        min-height: 24px;
    }

    .comprobantes-stats-row {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px;
    }

    .comprobantes-stats-row--index {
        width: 100%;
    }

    .comprobantes-stats-row--index .comprobantes-stats-filters {
        margin-left: auto;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-end;
        gap: 8px;
    }

    .comprobantes-stats-row--index .comprobantes-stat-filter.is-active {
        box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.28);
    }

    .comprobantes-stats-row--index .comprobantes-stat-total.is-active {
        box-shadow: 0 0 0 2px rgba(100, 116, 139, 0.35);
    }

    .comprobantes-total-badge {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 6px 12px;
        border-radius: 999px;
        background: #f1f5f9;
        border: 1px solid #e2e8f0;
        font-size: 12px;
        color: #475569;
    }

    .comprobantes-stat-enviado {
        background: #ecfdf5;
        border-color: #bbf7d0;
        color: #166534;
    }

    .comprobantes-stat-enviado strong {
        color: #15803d;
    }

    .comprobantes-stat-xml {
        background: #eff6ff;
        border-color: #bfdbfe;
        color: #1d4ed8;
    }

    .comprobantes-stat-xml strong {
        color: #1e40af;
    }

    .comprobantes-stat-no-enviado {
        background: #f8fafc;
        border-color: #cbd5e1;
        color: #475569;
    }

    .comprobantes-stat-no-enviado strong {
        color: #334155;
    }

    .comprobantes-stat-detraccion {
        background: #fff7ed;
        border-color: #fdba74;
        color: #9a3412;
    }

    .comprobantes-stat-detraccion strong {
        color: #c2410c;
    }

    .comprobantes-stats-row--index .comprobantes-stat-detraccion.is-active {
        background: #ffedd5;
        border-color: #fb923c;
        box-shadow: 0 0 0 2px rgba(251, 146, 60, 0.35);
    }

    .comprobantes-stat-dot {
        display: inline-block;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        flex-shrink: 0;
    }

    .comprobantes-stat-dot--det {
        background: #f97316;
    }

    .comp-doc-badges {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        gap: 4px;
    }

    .comp-doc-badge {
        display: inline-flex;
        align-items: center;
        gap: 2px;
        padding: 2px 7px;
        border-radius: 999px;
        font-size: 10px;
        font-weight: 700;
        line-height: 1.2;
        letter-spacing: 0.02em;
        white-space: nowrap;
    }

    .comp-doc-badge--fac {
        background: #dbeafe;
        color: #1d4ed8;
        border: 1px solid #bfdbfe;
    }

    .comp-doc-badge--bol {
        background: #dcfce7;
        color: #15803d;
        border: 1px solid #bbf7d0;
    }

    .comp-doc-badge--nc,
    .comp-doc-badge--nd,
    .comp-doc-badge--other {
        background: #f1f5f9;
        color: #475569;
        border: 1px solid #e2e8f0;
    }

    .comp-doc-badge--det {
        background: #fef3c7;
        color: #92400e;
        border: 1px solid #fcd34d;
        cursor: help;
    }

    .comp-doc-badge-det-icon {
        font-size: 10px;
        line-height: 1;
    }

    .comp-col-doc {
        overflow: visible !important;
    }

    #grid .k-grid-content td.comp-col-doc {
        overflow: visible;
    }

    .comprobantes-total-badge.comprobantes-stat-anulado {
        background: #fee2e2;
        border-color: #fca5a5;
        color: #b91c1c;
    }

    .comprobantes-total-badge.comprobantes-stat-anulado strong {
        color: #991b1b;
    }

    .comprobantes-stats-row--index .comprobantes-total-badge.comprobantes-stat-anulado.is-active {
        background: #fee2e2;
        border-color: #fca5a5;
        box-shadow: 0 0 0 2px rgba(252, 165, 165, 0.45);
        color: #b91c1c;
    }

    .comprobantes-stats-row--index .comprobantes-total-badge.comprobantes-stat-anulado.is-active strong {
        color: #991b1b;
    }

    .comprobantes-total-badge.comprobantes-stat-anulado.comprobantes-stat-filter:hover {
        background: #fee2e2;
        border-color: #fca5a5;
        box-shadow: 0 2px 8px rgba(239, 68, 68, 0.12);
    }

    .comprobantes-stat-filter {
        cursor: pointer;
        user-select: none;
        transition: box-shadow 0.15s ease, transform 0.12s ease, opacity 0.15s ease;
    }

    .comprobantes-stats-row--index button.comprobantes-stat-filter {
        appearance: none;
        -webkit-appearance: none;
        font: inherit;
        line-height: inherit;
        text-align: left;
    }

    .comprobantes-stats-row--index .comprobantes-stat-filter strong,
    .comprobantes-stats-row--index .comprobantes-stat-dot {
        pointer-events: none;
    }

    .comprobantes-stat-filter:hover {
        transform: translateY(-1px);
        box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
    }

    .comprobantes-stat-filter.is-active {
        box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.35);
        font-weight: 700;
    }

    .comprobantes-stat-total.is-active {
        box-shadow: 0 0 0 2px rgba(100, 116, 139, 0.35);
    }

    .comprobantes-stats-hint {
        margin-top: 6px;
        font-size: 11px;
        color: #64748b;
    }

    .comprobantes-stats-hint .glyphicon {
        font-size: 10px;
        margin-right: 4px;
    }

    .comprobantes-total-badge strong {
        color: #0f172a;
        font-size: 13px;
    }

    .comprobantes-total-badge.comprobantes-stat-anulado strong {
        color: #991b1b;
    }

    .comprobantes-toolbar {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        margin-bottom: 14px;
        padding: 12px 16px;
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 10px;
        box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
    }

    .comprobantes-toolbar-left,
    .comprobantes-toolbar-reports {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 10px;
    }

    .comprobantes-toolbar-reports {
        margin-left: auto;
        justify-content: flex-end;
    }

    .comprobantes-toolbar .btn {
        font-weight: 600;
        border-radius: 8px;
        padding: 7px 14px;
        font-size: 13px;
    }

    .comprobantes-toolbar .btn-success {
        background: #16a34a;
        border-color: #15803d;
    }

    .comprobantes-toolbar .btn-export {
        background: #0ea5e9;
        border-color: #0284c7;
        color: #fff;
    }

    .comprobantes-switch {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 6px 12px;
        border-radius: 8px;
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        font-size: 13px;
        color: #334155;
        cursor: pointer;
        margin: 0;
        user-select: none;
    }

    .comprobantes-switch input {
        margin: 0;
        cursor: pointer;
    }

    #btnComprobante {
        display: none !important;
    }

    #myModal.modal {
        z-index: 1060;
    }

    #myModal .modal-dialog {
        margin: 80px auto;
    }

    .comprobantes-grid-card {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
        overflow: visible;
        padding: 4px;
        max-width: 100%;
    }

    .comprobantes-grid-card #grid,
    .comprobantes-grid-card .k-grid {
        width: 100% !important;
        max-width: 100%;
        border-radius: 0 0 10px 10px;
        overflow: hidden;
    }

    .comprobantes-grid-card .k-grid-header-wrap {
        overflow-x: auto;
    }

    .comprobantes-grid-card .k-grid-content {
        overflow-x: auto;
        overflow-y: auto !important;
    }

    .comprobantes-grid-card.comp-grid-mobile .k-grid-header-wrap {
        overflow-x: hidden !important;
    }

    .comprobantes-grid-card.comp-grid-mobile .k-grid-content {
        overflow-x: hidden !important;
    }

    .comprobantes-grid-card .k-pager-wrap {
        display: block !important;
        visibility: visible !important;
        padding: 10px 16px;
        background: #f8fafc;
        border-top: 1px solid #e5e7eb;
    }

    .comprobantes-grid-card .k-pager-wrap .k-link,
    .comprobantes-grid-card .k-pager-wrap .k-state-selected {
        border-radius: 6px;
        min-width: 28px;
        text-align: center;
        font-size: 13px;
    }

    .comprobantes-grid-card .k-pager-info {
        color: #64748b;
        font-size: 13px;
    }

    .comprobantes-grid-card .k-grid-header table,
    .comprobantes-grid-card .k-grid-content table {
        width: 100% !important;
        table-layout: fixed;
    }

    .comprobantes-grid-card .k-grid th,
    .comprobantes-grid-card .k-grid td {
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 13px;
        padding: 8px 7px !important;
        line-height: 1.4;
    }

    .comprobantes-grid-card .k-grid td label {
        font-size: 13px !important;
        font-weight: 600;
        margin: 0;
    }

    .comprobantes-grid-card #grid .k-grid-header th.k-header {
        text-align: center !important;
        font-size: 12px !important;
    }

    .comprobantes-grid-card #grid .k-grid-header th.col-cliente-header,
    .comprobantes-grid-card #grid td.col-cliente-cell {
        text-align: left !important;
        padding-left: 10px !important;
        padding-right: 6px !important;
    }

    .comprobantes-grid-card #grid td.col-cliente-cell .comp-cliente-nombre {
        display: block;
        text-align: left;
        font-size: 14px;
        font-weight: 600;
        color: #34495e;
        line-height: 1.35;
    }

    .comprobantes-grid-card #grid .k-grid-header th.k-header[style*="text-align:center"],
    .comprobantes-grid-card #grid td[style*="text-align: center"],
    .comprobantes-grid-card #grid td[style*="text-align:center"] {
        text-align: center !important;
    }

    .comprobantes-grid-card #grid .k-hierarchy-col,
    .comprobantes-grid-card #grid .k-hierarchy-cell {
        width: 16px !important;
        min-width: 16px !important;
        max-width: 16px !important;
    }

    .comprobantes-grid-card #grid .k-hierarchy-cell {
        padding: 0 !important;
        text-align: center !important;
        line-height: 16px !important;
    }

    .comprobantes-grid-card #grid .k-hierarchy-cell .k-icon {
        margin: 0 !important;
        font-size: 11px !important;
        line-height: 16px !important;
    }

    .comprobantes-grid-card #grid .k-hierarchy-cell a {
        padding: 0 !important;
        display: inline-block !important;
    }

    /* Dropdown estado SUNAT en grilla */
    .comprobantes-grid-card .comp-estado-cell,
    .comprobantes-grid-card #grid th.comp-estado-col {
        white-space: nowrap !important;
        padding-left: 4px !important;
        padding-right: 4px !important;
        overflow: visible !important;
        text-align: center !important;
    }

    .comp-estado-dropdown {
        display: inline-block;
        vertical-align: middle;
        max-width: 100%;
        width: auto;
    }

    .comp-estado-dropdown.open {
        z-index: 10060;
    }

    .comp-estado-btn {
        width: auto;
        min-width: 0;
        max-width: 100%;
        padding: 5px 9px;
        font-size: 12px;
        font-weight: 700;
        line-height: 1.25;
        border-radius: 999px;
        border: 0 !important;
        box-shadow: 0 2px 8px rgba(15, 23, 42, 0.14);
        white-space: nowrap;
        text-transform: none;
        letter-spacing: 0.2px;
    }

    .comp-estado-btn .caret {
        margin-left: 3px;
        border-top-width: 4px;
        border-right-width: 4px;
        border-left-width: 4px;
    }

    .comp-estado-static .comp-estado-btn {
        cursor: default;
        pointer-events: none;
    }

    .comp-estado-no-generado .comp-estado-btn {
        background: linear-gradient(135deg, #64748b, #475569) !important;
    }

    .comp-estado-xml .comp-estado-btn {
        background: linear-gradient(135deg, #60a5fa, #3b82f6) !important;
    }

    .comp-estado-enviado .comp-estado-btn {
        background: linear-gradient(135deg, #4ade80, #16a34a) !important;
    }

    .comp-estado-pendiente .comp-estado-btn,
    .comp-estado-resumen .comp-estado-btn {
        background: linear-gradient(135deg, #fbbf24, #f59e0b) !important;
    }

    .comp-estado-anulado .comp-estado-btn {
        background: linear-gradient(135deg, #f87171, #ef4444) !important;
    }

    .comp-estado-menu {
        border-radius: 10px;
        border: 1px solid #e5e7eb;
        box-shadow: 0 10px 28px rgba(15, 23, 42, 0.16);
        padding: 6px 0;
        min-width: 210px;
        z-index: 10070;
    }

    .comp-estado-menu > li > a {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 10px 14px;
        font-size: 14px;
        font-weight: 600;
        color: #334155;
        white-space: nowrap;
        line-height: 1.4;
    }

    .comp-estado-menu > li > a .glyphicon {
        font-size: 14px;
        color: #64748b;
        width: 15px;
        text-align: center;
    }

    .comp-estado-menu > li > a:hover,
    .comp-estado-menu > li > a:focus {
        background: #f8fafc;
        color: #0f172a;
    }

    .comp-estado-menu > li > a.comp-estado-item-danger,
    .comp-estado-menu > li > a[onclick*="anulacion"],
    .comp-estado-menu > li > a[onclick*="Anulacion"] {
        color: #b91c1c;
    }

    .comp-estado-menu > li > a.comp-estado-item-danger:hover,
    .comp-estado-menu > li > a[onclick*="anulacion"]:hover,
    .comp-estado-menu > li > a[onclick*="Anulacion"]:hover {
        background: #fef2f2;
        color: #991b1b;
    }

    .comp-estado-menu > li > a.comp-estado-item-danger .glyphicon,
    .comp-estado-menu > li > a[onclick*="anulacion"] .glyphicon {
        color: #ef4444;
    }

    .comp-estado-menu > li > a input[type="hidden"] {
        display: none;
    }

    /* Comprobantes — grilla compacta en móvil (solo columnas esenciales) */
    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .comp-col-desktop {
        display: none !important;
    }

    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .k-grid-header th.k-header,
    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .k-grid-content td {
        font-size: 11px !important;
        padding: 6px 4px !important;
    }

    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .k-grid-header th.comp-col-cliente,
    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid td.comp-col-cliente {
        width: 38% !important;
        max-width: 38% !important;
        white-space: normal !important;
        line-height: 1.25;
        word-break: break-word;
    }

    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .k-grid-header th.comp-col-numero,
    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid td.comp-col-numero {
        width: 14% !important;
        max-width: 14% !important;
        white-space: normal !important;
        line-height: 1.2;
        padding-left: 2px !important;
        padding-right: 2px !important;
        text-align: center !important;
        vertical-align: middle !important;
    }

    .comprobantes-page #grid .comp-num-doc-mobile {
        display: none;
    }

    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .comp-num-doc-desktop {
        display: none !important;
    }

    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .comp-num-doc-mobile {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;
        margin: 0 auto;
        gap: 2px;
        line-height: 1.2;
        text-align: center;
    }

    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .comp-num-serie {
        display: block;
        width: 100%;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        letter-spacing: 0.3px;
        text-align: center;
    }

    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .comp-num-correlativo {
        display: block;
        width: 100%;
        font-size: 14px;
        font-weight: 700;
        color: #1e293b;
        font-family: Consolas, "Courier New", monospace;
        text-align: center;
    }

    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .k-grid-header th.comp-col-total,
    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid td.comp-col-total {
        width: 12% !important;
        max-width: 12% !important;
        font-weight: 700;
        white-space: nowrap !important;
    }

    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .k-grid-header th.comp-col-pdf,
    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid td.comp-col-pdf,
    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .k-grid-header th.comp-col-ticket,
    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid td.comp-col-ticket {
        width: 8% !important;
        max-width: 8% !important;
        padding-left: 2px !important;
        padding-right: 2px !important;
    }

    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .k-grid-header th.comp-col-estado,
    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid td.comp-col-estado {
        width: 20% !important;
        max-width: 20% !important;
    }

    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .k-hierarchy-col,
    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .k-hierarchy-cell {
        width: 14px !important;
        min-width: 14px !important;
        max-width: 14px !important;
        padding: 0 !important;
    }

    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid td.comp-col-pdf img,
    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid td.comp-col-ticket img {
        width: 18px;
        height: auto;
    }

    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid td.comp-col-ticket .glyphicon {
        font-size: 14px;
    }

    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .comp-estado-btn {
        padding: 4px 6px;
        font-size: 10px;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .comp-estado-btn .caret {
        display: none;
    }

    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .k-pager-wrap {
        padding: 8px 10px;
    }

    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .k-pager-info {
        display: block;
        width: 100%;
        text-align: center;
        margin-top: 4px;
        font-size: 11px;
    }

    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .k-pager-numbers {
        margin: 0 auto;
    }

    @media (max-width: 1199px) {
        .comprobantes-filters {
            grid-template-columns: repeat(3, minmax(0, 1fr));
        }

        .comprobantes-field--wide {
            grid-column: span 1;
        }
    }

    @media (max-width: 767px) {
        .comprobantes-page {
            padding: 0 8px 16px;
        }

        .comprobantes-filters {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .comprobantes-field--dates {
            grid-column: span 2;
        }

        .comprobantes-toolbar {
            flex-direction: column;
            align-items: stretch;
        }

        .comprobantes-toolbar-left,
        .comprobantes-toolbar-reports {
            width: 100%;
            justify-content: center;
        }

        .comprobantes-toolbar-reports {
            margin-left: 0;
        }
    }

    @media (max-width: 575px) {
        .comprobantes-filters {
            grid-template-columns: 1fr;
        }

        .comprobantes-field--dates {
            grid-column: span 1;
        }

        .comprobantes-filter-actions {
            width: 100%;
        }

        .comprobantes-filter-actions .btn {
            flex: 1;
        }
    }

    /* Listado de comprobantes — cabecera compacta */
    .comprobantes-index-page .comprobantes-panel {
        padding: 14px 16px 10px;
        margin-bottom: 10px;
    }

    .comprobantes-index-page .comprobantes-panel-head {
        align-items: center;
        margin-bottom: 10px;
    }

    .comprobantes-index-page .comprobantes-panel-head > div {
        display: flex;
        flex-wrap: wrap;
        align-items: baseline;
        gap: 4px 12px;
    }

    .comprobantes-index-page .comprobantes-panel-head h2 {
        font-size: 21px;
    }

    .comprobantes-index-page .comprobantes-panel-head p {
        margin: 0;
    }

    .comprobantes-index-page .comprobantes-field label {
        margin-bottom: 4px;
        font-size: 11px;
    }

    .comprobantes-index-page .comprobantes-field .form-control {
        min-height: 34px;
        height: 34px;
    }

    .comprobantes-index-page .comprobantes-total-row {
        min-height: 24px;
        margin-top: 9px;
        padding-top: 9px;
        border-top: 1px solid #e2e8f0;
    }

    @media (min-width: 1400px) {
        .comprobantes-index-page .comprobantes-filters {
            grid-template-columns:
                minmax(240px, 2.05fr)
                minmax(160px, 1.25fr)
                minmax(100px, 0.75fr)
                minmax(110px, 0.85fr)
                minmax(165px, 1.3fr)
                minmax(260px, 1.9fr)
                auto;
            gap: 10px;
        }

        .comprobantes-index-page .comprobantes-field--wide {
            grid-column: auto;
        }

        .comprobantes-index-page .comprobantes-field--dates .comprobantes-date-range,
        .comprobantes-index-page .comprobantes-filter-actions {
            flex-wrap: nowrap;
        }

        .comprobantes-index-page .comprobantes-field--dates .comprobantes-date-range .form-control {
            min-width: 0;
        }

        .comprobantes-index-page .comprobantes-filter-actions .btn {
            min-width: 0;
            padding: 7px 12px;
            white-space: nowrap;
        }
    }
    /* Formulario comprobante — nuevo / modificar */
    .comprobante-form-page {
        padding: 0 12px 28px;
        max-width: 100%;
    }

    .comprobante-form-top {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 14px;
    }

    .comprobante-form-top h2 {
        margin: 0;
        font-size: 22px;
        font-weight: 700;
        color: #1e293b;
    }

    .comprobante-form-top p {
        margin: 4px 0 0;
        font-size: 13px;
        color: #64748b;
    }

    .comprobante-form-top p strong {
        color: #0f172a;
    }

    .comprobante-form-back {
        font-weight: 600;
        border-radius: 8px;
        padding: 8px 16px;
    }

    .comprobante-form-panel {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
        margin-bottom: 14px;
        overflow: hidden;
    }

    .comprobante-form-section-title {
        margin: 0;
        padding: 14px 20px;
        border-bottom: 1px solid #eef2f7;
        font-size: 13px;
        font-weight: 700;
        color: #334155;
        text-transform: uppercase;
        letter-spacing: 0.35px;
        background: #f8fafc;
    }

    .comprobante-form-panel-body {
        padding: 16px 20px 20px;
    }

    .comprobante-form-panel-body .form-control {
        border-radius: 8px;
        border-color: #cbd5e1;
        font-size: 13px;
    }

    .comprobante-form-panel-body .control-label {
        font-size: 12px;
        font-weight: 700;
        color: #475569;
    }

    .comprobante-detraccion-wrap {
        margin-bottom: 0;
        height: 100%;
    }

    .comprobante-detraccion-wrap .comprobante-detraccion-panel {
        height: 100%;
        margin-bottom: 0;
    }

    .comprobante-detraccion-obs-row {
        margin-left: -8px;
        margin-right: -8px;
        margin-bottom: 14px;
        display: flex;
        flex-wrap: wrap;
    }

    .comprobante-detraccion-col,
    .comprobante-observaciones-col {
        padding-left: 8px;
        padding-right: 8px;
        margin-bottom: 12px;
        display: flex;
        flex-direction: column;
    }

    .comprobante-detraccion-obs-row .comprobante-form-panel {
        flex: 1;
        display: flex;
        flex-direction: column;
        margin-bottom: 0;
    }

    .comprobante-detraccion-obs-row .comprobante-form-panel-body {
        flex: 1;
        display: flex;
        flex-direction: column;
    }

    .comprobante-detraccion-obs-row .comprobante-form-section-title {
        padding: 10px 14px;
        font-size: 12px;
    }

    .comprobante-detraccion-body-compact {
        padding: 12px 14px 14px !important;
    }

    .comprobante-detraccion-check {
        display: flex;
        align-items: center;
        gap: 8px;
        margin: 0 0 10px;
        padding: 8px 10px;
        border: 1px solid #fde68a;
        border-radius: 8px;
        background: #fffbeb;
        cursor: pointer;
        font-size: 12px;
        font-weight: 700;
        color: #92400e;
    }

    .comprobante-detraccion-check input[type="checkbox"] {
        width: 16px;
        height: 16px;
        margin: 0;
        cursor: pointer;
    }

    .comprobante-detraccion-grid.comprobante-detraccion-grid--compact {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 8px 10px;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        min-width: 0;
    }

    .comprobante-detraccion-grid--compact > .comprobante-detraccion-field {
        min-width: 0;
        max-width: 100%;
    }

    .comprobante-detraccion-grid--compact .form-control,
    .comprobante-detraccion-grid--compact select {
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
    }

    .comprobante-detraccion-field--tipo {
        grid-column: 1 / -1;
    }

    .comprobante-detraccion-field--cuenta {
        grid-column: 1 / -1;
        min-width: 0;
        width: auto;
    }

    .comprobante-detraccion-cuenta-status {
        min-height: 34px;
        width: auto;
        max-width: none;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 7px;
        padding: 6px 10px;
        border: 1px solid #fde68a;
        border-radius: 8px;
        background: #fffbeb;
        color: #92400e;
        font-size: 12px;
        line-height: 1.25;
        overflow: hidden;
    }

    .comprobante-detraccion-cuenta-status > .glyphicon {
        flex: 0 0 auto;
        color: #64748b;
    }

    .comprobante-detraccion-cuenta-status-text {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-family: Consolas, "Courier New", ui-monospace, monospace;
        font-weight: 600;
        letter-spacing: 0.03em;
    }

    .comprobante-detraccion-cuenta-status.is-missing {
        border-color: #fcd34d;
        background: #fffbeb;
        color: #92400e;
    }

    .comprobante-detraccion-cuenta-status.is-missing > .glyphicon {
        color: #d97706;
    }

    .comprobante-detraccion-cuenta-status.is-ready {
        border-color: #bbf7d0;
        background: #f0fdf4;
        color: #166534;
    }

    .comprobante-detraccion-cuenta-status.is-ready > .glyphicon {
        color: #16a34a;
    }

    .comprobante-detraccion-cuenta-hint {
        display: none;
    }

    .comprobante-detraccion-field--pct,
    .comprobante-detraccion-field--total {
        min-width: 0;
    }

    .comprobante-detraccion-body-compact .comprobante-detraccion-field label {
        margin-bottom: 4px;
        font-size: 11px;
    }

    .comprobante-detraccion-body-compact .form-control.input-sm {
        min-height: 32px;
        padding: 4px 8px;
        font-size: 12px;
    }

    .comprobante-detraccion-resumen--compact {
        margin-top: auto;
        padding: 8px 10px;
        font-size: 12px;
    }

    .comprobante-detraccion-resumen--compact strong {
        font-size: 15px;
    }

    .comprobante-observaciones-col #panel_otros .comprobante-form-panel-body textarea {
        flex: 1;
        min-height: 118px;
        margin-bottom: 0;
    }

    .comprobante-accion-generar--inline {
        margin-top: 12px !important;
        padding-top: 12px !important;
        padding-bottom: 0 !important;
        border-top: 1px solid #e2e8f0;
    }

    .comprobante-accion-generar--inline .btn-generar-comprobante {
        min-width: 0;
        width: 100%;
        padding: 12px 16px;
        font-size: 14px;
    }

    .comprobante-detraccion-estado {
        margin: 0 0 8px;
        padding: 6px 8px;
        border-radius: 6px;
        font-size: 11px;
        line-height: 1.35;
        color: #64748b;
        background: #f8fafc;
        border: 1px dashed #cbd5e1;
    }

    .comprobante-detraccion-wrap.is-pending .comprobante-detraccion-panel {
        opacity: 0.92;
    }

    .comprobante-detraccion-wrap.is-no-factura .comprobante-detraccion-panel {
        opacity: 0.75;
    }

    .comprobante-detraccion-wrap.is-no-factura .comprobante-detraccion-estado {
        color: #92400e;
        background: #fffbeb;
        border-color: #fde68a;
    }

    .comprobante-detraccion-wrap.is-active .comprobante-detraccion-estado {
        color: #166534;
        background: #ecfdf5;
        border: 1px solid #86efac;
    }

    .comprobante-detraccion-wrap.is-active .comprobante-detraccion-panel {
        box-shadow: 0 0 0 2px rgba(245, 158, 11, 0.35);
    }

    .comprobante-detraccion-wrap.is-active .comprobante-detraccion-check {
        border-color: #f59e0b;
        background: linear-gradient(135deg, #fff7ed 0%, #ffedd5 100%);
    }

    .comprobante-detraccion-panel .comprobante-form-section-title {
        border-left: 3px solid #f59e0b;
    }

    .comprobante-detraccion-grid {
        display: grid;
        grid-template-columns: minmax(220px, 1.2fr) repeat(2, minmax(160px, 1fr));
        gap: 12px 14px;
        align-items: end;
    }

    .comprobante-detraccion-toggle {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        grid-column: 1 / -1;
        padding: 12px 14px;
        border: 1px solid #fde68a;
        border-radius: 10px;
        background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
    }

    .comprobante-detraccion-toggle input[type="checkbox"] {
        width: 18px;
        height: 18px;
        margin-top: 2px;
        cursor: pointer;
    }

    .comprobante-detraccion-toggle strong {
        display: block;
        color: #92400e;
        margin-bottom: 2px;
    }

    .comprobante-detraccion-toggle p {
        margin: 0;
        font-size: 12px;
        color: #78350f;
        line-height: 1.35;
    }

    .comprobante-detraccion-field label {
        display: block;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        margin-bottom: 6px;
    }

    .comprobante-detraccion-resumen {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 12px;
        margin-top: 14px;
        padding: 12px 14px;
        border-radius: 10px;
        background: #eff6ff;
        border: 1px solid #bfdbfe;
        color: #1e3a8a;
        font-size: 13px;
    }

    .comprobante-detraccion-resumen strong {
        font-size: 18px;
        color: #1d4ed8;
    }

    @media (max-width: 767px) {
        .comprobante-detraccion-obs-row {
            margin-bottom: 8px;
        }

        .comprobante-detraccion-col,
        .comprobante-observaciones-col {
            margin-bottom: 10px;
        }

        .comprobante-accion-generar--inline .btn-generar-comprobante {
            font-size: 13px;
            padding: 11px 12px;
        }
    }

    @media (max-width: 575px) {
        .comprobante-detraccion-grid.comprobante-detraccion-grid--compact {
            grid-template-columns: minmax(0, 1fr);
        }

        .comprobante-detraccion-field--tipo {
            grid-column: auto;
        }
    }

    @media (max-width: 991px) {
        .comprobante-detraccion-grid {
            grid-template-columns: 1fr 1fr;
        }
    }

    @media (max-width: 575px) {
        .comprobante-detraccion-grid {
            grid-template-columns: 1fr;
        }
    }

    .comprobante-form-panel-body .btn_buscar {
        border-radius: 8px;
        font-weight: 700;
        font-size: 11px;
        letter-spacing: 0.3px;
    }

    .comprobante-form-datos-grid {
        padding-top: 4px;
    }

    /* Layout datos del comprobante — nuevo */
    .comprobante-datos-layout {
        display: flex;
        flex-direction: column;
        gap: 14px;
    }

    .comprobante-datos-row--comprobante {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-end;
        gap: 10px 12px;
        padding-bottom: 14px;
        border-bottom: 1px solid #eef2f7;
    }

    .comprobante-datos-row--cliente {
        display: grid;
        grid-template-columns: minmax(280px, 1.5fr) auto minmax(240px, 1fr);
        gap: 10px 12px;
        align-items: end;
    }

    .comprobante-datos-field {
        flex: 0 0 auto;
        min-width: 0;
    }

    .comprobante-datos-field label.control-label {
        display: block;
        margin-bottom: 5px;
        font-size: 11px;
        font-weight: 700;
        color: #64748b;
        white-space: nowrap;
    }

    .comprobante-datos-row--comprobante .comprobante-datos-field label.control-label {
        text-align: center;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .comprobante-datos-field--cliente label.control-label,
    .comprobante-datos-field--direccion label.control-label {
        text-align: left;
        text-transform: uppercase;
        letter-spacing: 0.3px;
        color: #475569;
    }

    .comprobante-datos-field .form-control {
        width: 100%;
        min-height: 36px;
        height: 36px;
        padding: 6px 10px;
        border-radius: 7px;
        border-color: #cbd5e1;
        font-size: 13px;
        box-shadow: none;
    }

    .comprobante-datos-field--tipo {
        width: 185px;
    }

    .comprobante-datos-field--serie {
        width: 82px;
    }

    .comprobante-datos-field--serie .form-control {
        text-align: center;
        padding-left: 6px;
        padding-right: 6px;
    }

    .comprobante-datos-field--numero {
        width: 100px;
    }

    .comprobante-datos-field--numero .form-control {
        text-align: center;
    }

    .comprobante-datos-field--fecha {
        width: 112px;
        max-width: 112px;
    }

    .comprobante-datos-field--fecha .form-control {
        text-align: center;
        padding-left: 8px;
        padding-right: 8px;
    }

    .comprobante-datos-field--moneda {
        width: 138px;
    }

    .comprobante-datos-field--cliente {
        flex: 1 1 auto;
        min-width: 0;
    }

    .comprobante-datos-field--direccion {
        min-width: 0;
    }

    .comprobante-datos-label-hidden {
        visibility: hidden;
        margin-bottom: 5px;
        height: 16px;
    }

    .comprobante-datos-extras {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-end;
        gap: 10px 12px;
        margin-left: auto;
    }

    .comprobante-datos-field--pedido {
        width: 110px;
    }

    .comprobante-datos-field--orden-compra,
    .comprobante-datos-field--orden-servicio {
        width: 140px;
    }

    .comprobante-datos-field--guia {
        width: 190px;
    }

    .comprobante-datos-guia-group .form-control {
        min-height: 36px;
        height: 36px;
    }

    .comprobante-datos-guia-group .input-group-btn .btn {
        min-height: 36px;
        height: 36px;
        padding: 6px 10px;
        border-radius: 0 7px 7px 0;
    }

    .comprobante-datos-field--anticipo .btn {
        min-height: 36px;
        height: 36px;
        border-radius: 7px;
        font-weight: 600;
        padding: 6px 14px;
    }

    .comprobante-datos-cliente-btns {
        display: flex;
        flex-wrap: nowrap;
        gap: 6px;
    }

    .comprobante-datos-layout .input_cliente,
    .comprobante-datos-layout .input_busqueda {
        width: auto !important;
        max-width: none;
    }

    .comprobante-datos-layout .btn_buscar {
        margin-top: 0 !important;
        width: auto;
        min-width: 72px;
        height: 36px;
        padding: 6px 12px;
        font-size: 12px;
    }

    .comprobante-datos-hidden {
        display: none;
    }

    @media (max-width: 1199px) {
        .comprobante-datos-row--cliente {
            grid-template-columns: 1fr auto;
        }

        .comprobante-datos-field--direccion {
            grid-column: 1 / -1;
        }

        .comprobante-datos-extras {
            margin-left: 0;
            width: 100%;
        }
    }

    @media (max-width: 767px) {
        .comprobante-datos-row--comprobante {
            gap: 10px;
        }

        .comprobante-datos-field--tipo {
            width: 100%;
        }

        .comprobante-datos-field--serie,
        .comprobante-datos-field--numero {
            width: calc(50% - 6px);
        }

        .comprobante-datos-field--fecha {
            width: calc(50% - 6px);
            max-width: none;
        }

        .comprobante-datos-field--moneda {
            width: 100%;
        }

        .comprobante-datos-row--cliente {
            grid-template-columns: 1fr;
        }

        .comprobante-datos-cliente-btns {
            width: 100%;
        }

        .comprobante-datos-layout .btn_buscar {
            flex: 1;
        }
    }

    .comprobante-form-doc-type {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 10px;
        margin-bottom: 12px;
    }

    .comprobante-form-doc-type .control-label {
        margin: 0;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
    }

    .comprobante-form-layout {
        padding-top: 6px;
    }

    .comprobante-barcode-input {
        max-width: 420px;
        border-radius: 8px;
        border-color: #cbd5e1;
        margin-bottom: 10px;
    }

    .comprobante-items-toolbar {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 10px;
    }

    .comprobante-items-toolbar .btn {
        border-radius: 8px;
        font-weight: 600;
    }

    .comprobante-items-toolbar #agrega_sin {
        background: #ea580c !important;
        border-color: #c2410c !important;
    }

    .comprobante-totals-col {
        margin-bottom: 14px;
    }

    .comprobante-totals-panel {
        background: #fff;
        border: 1px solid #bae6fd;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
        overflow: hidden;
    }

    .comprobante-totals-panel .input-group {
        width: 100%;
        margin: 0;
    }

    .comprobante-totals-panel .input-group-addon {
        min-width: 180px;
        text-align: right;
        font-size: 12px;
        font-weight: 600;
        color: #475569;
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        border-bottom: 0;
        border-right: 0;
        border-radius: 0;
    }

    .comprobante-totals-panel .form-control {
        border: 1px solid #e2e8f0;
        border-bottom: 0;
        border-radius: 0;
        text-align: right;
        font-weight: 600;
        min-height: 38px;
        font-size: 13px;
        box-shadow: none;
    }

    .comprobante-totals-panel .input-group:last-child .input-group-addon {
        border-bottom: 1px solid #bae6fd;
        background: #eff6ff;
        font-weight: 700;
        color: #1e40af;
    }

    .comprobante-totals-panel .input-group:last-child .form-control {
        border-bottom: 1px solid #bae6fd;
        font-size: 16px;
        font-weight: 700;
        color: #0f172a;
        background: #f0f9ff;
    }

    #panel_otros .comprobante-form-panel-body textarea {
        width: 100%;
        resize: vertical;
        min-height: 120px;
        margin-bottom: 0;
        border-radius: 8px;
        border-color: #cbd5e1;
    }

    @media (min-width: 992px) {
        .comprobante-totals-col {
            position: sticky;
            top: 12px;
            align-self: flex-start;
        }
    }

    @media (max-width: 767px) {
        .comprobante-form-page {
            padding: 0 8px 20px;
        }

        .comprobante-form-top {
            flex-direction: column;
            align-items: stretch;
        }

        .comprobante-form-back {
            width: 100%;
            text-align: center;
        }

        .comprobante-totals-panel .input-group-addon {
            min-width: 140px;
            font-size: 11px;
        }
    }

    /* Modal pago monto — comprobantes */
    #myModalPagoMonto.modal {
        z-index: 1065;
        text-align: center;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    #myModalPagoMonto.modal.in {
        display: block !important;
        overflow-y: auto;
        padding: 16px 0;
    }

    #myModalPagoMonto.modal.in:before {
        display: none;
    }

    #myModalPagoMonto .modal-dialog.comp-pago-modal,
    #myModalPagoMonto .modal-dialog.modal-dialog-pagoMonto {
        display: block;
        text-align: left;
        margin: 0 auto 24px !important;
        width: 94%;
        max-width: 920px;
        position: relative;
        left: auto;
        right: auto;
        float: none;
    }

    .comp-pago-modal-content {
        border: none;
        border-radius: 16px;
        box-shadow: 0 24px 60px rgba(15, 23, 42, 0.24);
        overflow: hidden;
        max-height: calc(100vh - 32px);
        display: flex;
        flex-direction: column;
    }

    .comp-pago-modal-header {
        background: #fff;
        border-bottom: 1px solid #e5e7eb;
        padding: 18px 24px 16px;
    }

    .comp-pago-modal-header-inner {
        display: flex;
        align-items: center;
        gap: 14px;
        padding-right: 28px;
    }

    .comp-pago-modal-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
        border-radius: 12px;
        background: #eff6ff;
        color: #2563eb;
        font-size: 20px;
    }

    .comp-pago-modal-header .close {
        color: #64748b;
        opacity: 1;
        text-shadow: none;
        margin-top: 0;
        font-size: 26px;
    }

    .comp-pago-modal-header .close:hover {
        color: #0f172a;
    }

    .comp-pago-modal-header .modal-title {
        font-size: 20px;
        font-weight: 700;
        color: #0f172a;
        margin: 0;
    }

    .comp-pago-modal-subtitle {
        margin: 3px 0 0;
        font-size: 13px;
        color: #64748b;
    }

    .comp-pago-modal-body {
        padding: 20px 24px;
        background: #f1f5f9;
        overflow-y: auto;
        flex: 1 1 auto;
        min-height: 0;
    }

    .comp-pago-modal-layout {
        display: grid;
        grid-template-columns: minmax(0, 1.35fr) minmax(220px, 0.85fr);
        gap: 16px;
        align-items: start;
    }

    .comp-pago-section {
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        padding: 16px;
        box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
    }

    .comp-pago-section--totales {
        position: sticky;
        top: 0;
    }

    .comp-pago-section-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        margin-bottom: 12px;
    }

    .comp-pago-section-title {
        margin: 0 0 12px;
        font-size: 12px;
        font-weight: 700;
        color: #334155;
        text-transform: uppercase;
        letter-spacing: 0.4px;
    }

    .comp-pago-section-head .comp-pago-section-title {
        margin-bottom: 0;
    }

    .comp-pago-items {
        display: flex;
        flex-direction: column;
        gap: 10px;
        max-height: none;
        overflow: visible;
        padding-right: 0;
    }

    .comp-pago-items::-webkit-scrollbar {
        width: 6px;
    }

    .comp-pago-items::-webkit-scrollbar-thumb {
        background: #cbd5e1;
        border-radius: 999px;
    }

    .comp-pago-item {
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        overflow: hidden;
    }

    .comp-pago-item-head {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 8px 12px;
        background: #fff;
        border-bottom: 1px solid #e2e8f0;
    }

    .comp-pago-item-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 22px;
        height: 22px;
        padding: 0 6px;
        border-radius: 999px;
        background: #2563eb;
        color: #fff;
        font-size: 11px;
        font-weight: 700;
    }

    .comp-pago-item-title {
        flex: 1;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .comp-pago-item-body {
        padding: 12px;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .comp-pago-item-grid--main {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 118px;
        gap: 10px;
        align-items: end;
    }

    .comp-pago-item-grid--extra {
        display: none;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .comp-pago-item-grid--extra.is-visible {
        display: grid;
    }

    .comp-pago-item-field--full {
        width: 100%;
    }

    .comp-pago-item-field label {
        display: block;
        margin-bottom: 5px;
        font-size: 10px;
        font-weight: 700;
        color: #64748b;
        text-transform: uppercase;
        letter-spacing: 0.25px;
    }

    .comp-pago-item-field .form-control {
        min-height: 36px;
        height: 36px;
        border-radius: 8px;
        border-color: #cbd5e1;
        font-size: 13px;
        box-shadow: none;
    }

    .comp-pago-item-field--monto .comp-pago-resumen-input .form-control {
        min-height: 36px;
        height: 36px;
        font-size: 13px;
    }

    .comp-pago-item-remove {
        color: #64748b !important;
        font-size: 11px;
        font-weight: 600;
        cursor: pointer;
        padding: 2px 8px;
        border-color: #e2e8f0 !important;
        border-radius: 6px;
        transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
    }

    .comp-pago-item-remove:hover,
    .comp-pago-item-remove:focus {
        color: #b91c1c !important;
        border-color: #fecaca !important;
        background: #fef2f2 !important;
    }

    .comp-pago-btn-add {
        border-radius: 8px;
        font-weight: 600;
        font-size: 12px;
        padding: 5px 12px;
        border: 1px dashed #93c5fd;
        background: #eff6ff;
        color: #1d4ed8;
    }

    .comp-pago-btn-add:hover,
    .comp-pago-btn-add:focus {
        background: #dbeafe;
        border-color: #60a5fa;
        color: #1e40af;
    }

    .comp-pago-resumen {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .comp-pago-resumen-row {
        display: flex;
        flex-direction: column;
        gap: 6px;
        padding: 10px 12px;
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        border-radius: 10px;
    }

    .comp-pago-resumen-label {
        font-size: 11px;
        font-weight: 700;
        color: #64748b;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .comp-pago-resumen-input {
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .comp-pago-resumen-moneda {
        font-size: 14px;
        font-weight: 700;
        color: #475569;
        min-width: 28px;
    }

    .comp-pago-resumen-input .form-control {
        flex: 1;
        text-align: right;
        font-weight: 700;
        font-size: 15px;
        min-height: 38px;
        height: 38px;
        border-radius: 8px;
        border-color: #cbd5e1;
        background: #fff;
        box-shadow: none;
    }

    .comp-pago-resumen-row--vuelto .form-control {
        font-size: 16px;
    }

    .comp-pago-resumen-row--ok {
        border-color: #a7f3d0;
        background: #ecfdf5;
    }

    .comp-pago-resumen-row--ok .comp-pago-resumen-label {
        color: #047857;
    }

    .comp-pago-resumen-row--ok .form-control {
        color: #047857;
        border-color: #6ee7b7;
        background: #fff;
    }

    .comp-pago-resumen-row--negativo {
        border-color: #fecaca;
        background: #fef2f2;
    }

    .comp-pago-resumen-row--negativo .comp-pago-resumen-label {
        color: #b91c1c;
    }

    .comp-pago-resumen-row--negativo .form-control {
        color: #b91c1c;
        border-color: #fca5a5;
        background: #fff;
    }

    .comp-pago-methods-hint {
        margin: -4px 0 12px;
        font-size: 12px;
        color: #64748b;
        line-height: 1.45;
    }

    .comp-pago-alert {
        margin-bottom: 12px;
        padding: 10px 12px;
        border-radius: 10px;
        font-size: 13px;
        line-height: 1.45;
        border: 1px solid transparent;
    }

    .comp-pago-alert--ok {
        background: #ecfdf5;
        border-color: #a7f3d0;
        color: #065f46;
    }

    .comp-pago-alert--error {
        background: #fef2f2;
        border-color: #fecaca;
        color: #991b1b;
    }

    .comp-pago-alert-monto {
        font-weight: 700;
    }

    .comp-pago-resumen-row--total {
        background: #fff;
        border-color: #cbd5e1;
    }

    .comp-pago-resumen-row--total .form-control {
        font-size: 16px;
        color: #0f172a;
    }

    .comp-pago-resumen-row--pendiente {
        display: none;
    }

    .comp-pago-resumen-row--pendiente.is-visible {
        display: flex;
    }

    .comp-pago-resumen-row--pendiente.is-visible,
    .comp-pago-resumen-row--warn {
        border-color: #fecaca;
        background: #fef2f2;
    }

    .comp-pago-resumen-row--pendiente.is-visible .comp-pago-resumen-label,
    .comp-pago-resumen-row--warn .comp-pago-resumen-label {
        color: #b91c1c;
    }

    .comp-pago-resumen-row--pendiente.is-visible .form-control,
    .comp-pago-resumen-row--warn .form-control {
        color: #b91c1c;
        border-color: #fca5a5;
    }

    .comp-pago-resumen-row--neutral {
        border-color: #e2e8f0;
        background: #f8fafc;
    }

    .comp-pago-resumen-hint {
        margin: 10px 0 0;
        font-size: 11px;
        color: #94a3b8;
        line-height: 1.4;
    }

    .comp-pago-cuotas-wrap {
        margin-top: 4px;
        padding: 10px;
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        background: #fff;
    }

    .comp-pago-cuotas-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        margin-bottom: 8px;
    }

    .comp-pago-cuotas-title {
        font-size: 11px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .comp-pago-cuotas-hint {
        margin: 0 0 8px;
        font-size: 11px;
        line-height: 1.35;
        color: #64748b;
    }

    .comp-pago-cuotas-hint.is-warn {
        color: #b45309;
    }

    .comp-pago-cuotas-table-wrap {
        overflow-x: auto;
    }

    .comp-pago-cuotas-table {
        width: 100%;
        border-collapse: collapse;
        font-size: 12px;
    }

    .comp-pago-cuotas-table th {
        padding: 6px 8px;
        font-size: 10px;
        font-weight: 700;
        color: #64748b;
        text-transform: uppercase;
        letter-spacing: 0.25px;
        border-bottom: 1px solid #e2e8f0;
        background: #f8fafc;
    }

    .comp-pago-cuotas-table td {
        padding: 6px 4px;
        vertical-align: middle;
        border-bottom: 1px solid #f1f5f9;
    }

    .comp-pago-cuota-num {
        width: 52px;
        text-align: center;
        font-weight: 700;
        color: #2563eb;
        font-size: 12px;
    }

    .comp-pago-cuota-monto-wrap {
        min-width: 110px;
    }

    .comp-pago-cuota-monto-wrap .form-control {
        min-height: 32px;
        height: 32px;
        font-size: 12px;
    }

    .comp-pago-cuota-fecha {
        min-width: 118px;
        min-height: 32px !important;
        height: 32px !important;
        font-size: 12px !important;
    }

    .comp-pago-cuota-actions {
        width: 36px;
        text-align: center;
    }

    .comp-pago-btn-add-cuota {
        padding: 3px 10px;
        font-size: 11px;
    }

    .comp-pago-modal-footer {
        background: #fff;
        border-top: 1px solid #e5e7eb;
        padding: 14px 24px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 10px;
        flex-shrink: 0;
    }

    .comp-pago-modal-footer .btn {
        border-radius: 10px;
        font-weight: 600;
        min-height: 40px;
        padding: 8px 18px;
    }

    .comp-pago-btn-volver,
    .comp-pago-btn-cancelar {
        border-color: #cbd5e1;
        color: #475569;
    }

    .comp-pago-btn-cancelar:hover,
    .comp-pago-btn-cancelar:focus {
        background: #f8fafc;
        border-color: #94a3b8;
        color: #334155;
    }

    .comp-pago-btn-guardar {
        background: #16a34a !important;
        border-color: #15803d !important;
        min-width: 180px;
    }

    .comp-pago-btn-guardar:hover,
    .comp-pago-btn-guardar:focus {
        background: #15803d !important;
        border-color: #166534 !important;
    }

    .comp-pago-btn-guardar.comp-pago-btn-guardar--disabled,
    .comp-pago-btn-guardar:disabled {
        background: #94a3b8 !important;
        border-color: #64748b !important;
        cursor: not-allowed;
        opacity: 0.85;
        box-shadow: none;
    }

    .comp-pago-modal--compras .comp-pago-modal-icon {
        background: #ecfeff;
        color: #0891b2;
    }

    .comp-pago-modal--compras .comp-pago-item-badge {
        background: #0891b2;
    }

    .comp-pago-modal--compras .comp-pago-btn-add {
        background: #ecfeff;
        border-color: #67e8f9;
        color: #0e7490;
    }

    .comp-pago-modal--compras .comp-pago-btn-add:hover,
    .comp-pago-modal--compras .comp-pago-btn-add:focus {
        background: #cffafe;
        border-color: #22d3ee;
        color: #155e75;
    }

    .comp-pago-modal--compras .comp-pago-btn-guardar--compras {
        background: #0891b2 !important;
        border-color: #0e7490 !important;
    }

    .comp-pago-modal--compras .comp-pago-btn-guardar--compras:hover,
    .comp-pago-modal--compras .comp-pago-btn-guardar--compras:focus {
        background: #0e7490 !important;
        border-color: #155e75 !important;
    }

    @media (max-width: 767px) {
        #myModalPagoMonto .modal-dialog.comp-pago-modal,
        #myModalPagoMonto .modal-dialog.modal-dialog-pagoMonto {
            width: 96%;
            margin: 10px auto !important;
        }

        .comp-pago-modal-layout {
            grid-template-columns: 1fr;
        }

        .comp-pago-section--totales {
            position: static;
        }

        .comp-pago-item-grid--main,
        .comp-pago-item-grid--extra {
            grid-template-columns: 1fr;
        }

        .comp-pago-modal-footer {
            flex-direction: column-reverse;
        }

        .comp-pago-modal-footer .btn {
            width: 100%;
        }
    }

    /* Modal envío / impresión documento */
    #myModal.modal {
        text-align: center;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    #myModal.modal.in {
        display: flex !important;
        align-items: center;
        justify-content: center;
    }

    #myModal.modal.in .modal-dialog.pagos-historial-modal-dialog,
    #myModal.modal.in .modal-dialog.pagos-modal-dialog,
    #myModal.modal.in .modal-dialog.comp-pago-modal {
        display: block;
        flex: 0 0 auto;
        position: relative;
    }

    #myModal .modal-dialog.comp-envio-modal {
        display: inline-block;
        text-align: left;
        vertical-align: middle;
        margin: 16px auto !important;
        width: 94%;
        max-width: 520px;
    }

    .comp-envio-modal-content {
        border: none;
        border-radius: 14px;
        overflow: hidden;
        box-shadow: 0 18px 40px rgba(15, 23, 42, 0.18);
    }

    .comp-envio-modal-header {
        background: linear-gradient(135deg, #1e40af, #2563eb);
        color: #fff;
        border-bottom: none;
        padding: 18px 20px;
        position: relative;
    }

    .comp-envio-modal-header .close {
        position: absolute;
        top: 12px;
        right: 14px;
        color: #fff;
        opacity: 0.85;
        text-shadow: none;
        font-size: 24px;
    }

    .comp-envio-modal-header .close:hover {
        opacity: 1;
    }

    .comp-envio-modal-header-inner {
        display: flex;
        align-items: center;
        gap: 14px;
        padding-right: 28px;
    }

    .comp-envio-modal-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
        border-radius: 12px;
        background: rgba(255, 255, 255, 0.16);
        font-size: 20px;
        flex-shrink: 0;
    }

    .comp-envio-modal-header .modal-title {
        margin: 0;
        font-size: 18px;
        font-weight: 700;
        color: #fff;
    }

    .comp-envio-modal-subtitle {
        margin: 4px 0 0;
        font-size: 12px;
        color: rgba(255, 255, 255, 0.88);
    }

    .comp-envio-modal-body {
        padding: 20px;
        background: #f8fafc;
    }

    .comp-envio-resumen {
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        padding: 16px;
        margin-bottom: 18px;
    }

    .comp-envio-resumen-badge {
        display: inline-block;
        padding: 4px 10px;
        border-radius: 999px;
        background: #eff6ff;
        color: #1d4ed8;
        font-size: 10px;
        font-weight: 700;
        letter-spacing: 0.4px;
        text-transform: uppercase;
    }

    .comp-envio-resumen-doc {
        margin: 10px 0 6px;
        font-size: 20px;
        font-weight: 700;
        color: #0f172a;
    }

    .comp-envio-resumen-cliente {
        margin: 0 0 12px;
        font-size: 13px;
        color: #475569;
        line-height: 1.35;
        word-break: break-word;
    }

    .comp-envio-resumen-monto {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin: 0;
        padding-top: 12px;
        border-top: 1px dashed #dbeafe;
        font-size: 13px;
        color: #64748b;
    }

    .comp-envio-resumen-monto strong {
        font-size: 18px;
        color: #047857;
    }

    .comp-envio-actions {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 12px;
    }

    .comp-envio-action {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 8px;
        min-height: 118px;
        padding: 14px 10px;
        border: 1px solid #dbeafe;
        border-radius: 12px;
        background: #fff;
        cursor: pointer;
        transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
    }

    .comp-envio-action:hover,
    .comp-envio-action:focus {
        transform: translateY(-2px);
        border-color: #93c5fd;
        box-shadow: 0 8px 20px rgba(37, 99, 235, 0.12);
        outline: none;
    }

    .comp-envio-action-icon {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 58px;
        height: 58px;
    }

    .comp-envio-action-icon img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }

    .comp-envio-action-label {
        font-size: 12px;
        font-weight: 700;
        color: #334155;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .comp-envio-modal-footer {
        background: #fff;
        border-top: 1px solid #e2e8f0;
        padding: 12px 20px;
        text-align: right;
    }

    .comp-envio-btn-cerrar {
        border-radius: 8px;
        font-weight: 600;
    }

    .comp-envio-modal--whatsapp .comp-envio-modal-header {
        background: linear-gradient(135deg, #15803d, #22c55e);
    }

    .comp-envio-modal--whatsapp .comp-envio-modal-icon {
        background: rgba(255, 255, 255, 0.18);
        padding: 6px;
    }

    .comp-envio-modal--whatsapp .comp-envio-modal-icon img {
        width: 28px;
        height: 28px;
        object-fit: contain;
    }

    .comp-envio-form {
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        padding: 16px;
    }

    .comp-envio-form-field label {
        display: block;
        margin-bottom: 6px;
        font-size: 11px;
        font-weight: 700;
        color: #64748b;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .comp-envio-form-field .form-control {
        min-height: 40px;
        border-radius: 8px;
        border-color: #cbd5e1;
        box-shadow: none;
    }

    .comp-envio-modal-footer--split {
        display: flex;
        justify-content: space-between;
        gap: 10px;
    }

    .comp-envio-modal-footer--split .btn {
        border-radius: 8px;
        font-weight: 600;
    }

    .comp-envio-btn-enviar {
        min-width: 170px;
    }

    @media (max-width: 575px) {
        #myModal .modal-dialog.comp-envio-modal {
            width: 96%;
            margin: 10px auto !important;
        }

        .comp-envio-actions {
            grid-template-columns: 1fr;
        }

        .comp-envio-action {
            min-height: 88px;
            flex-direction: row;
            justify-content: flex-start;
            padding: 12px 16px;
        }

        .comp-envio-action-icon {
            width: 48px;
            height: 48px;
        }

        .comp-envio-modal-footer--split {
            flex-direction: column-reverse;
        }

        .comp-envio-modal-footer--split .btn {
            width: 100%;
        }
    }

    /* Módulo proformas — listado */
    .proformas-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .proformas-filters .comprobantes-field--wide {
        grid-column: span 2;
    }

    .comprobantes-grid-card .notas-grid-card-header {
        padding: 16px 20px;
        border-bottom: 1px solid #eef2f7;
        background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
    }

    @media (min-width: 768px) {
        .proformas-filters {
            grid-template-columns: repeat(3, minmax(0, 1fr));
        }

        .proformas-filters .comprobantes-field--wide {
            grid-column: span 1;
        }
    }

    @media (min-width: 1200px) {
        .proformas-filters {
            grid-template-columns: repeat(6, minmax(0, 1fr));
        }

        .proformas-filters .comprobantes-field--wide {
            grid-column: span 2;
        }
    }

    /* Proformas — grilla centrada excepto cliente */
    .comprobantes-page #grid .k-grid-header th.k-header {
        text-align: center !important;
    }

    .comprobantes-page #grid .k-grid-header th.col-cliente-nota-header {
        text-align: left !important;
    }

    .comprobantes-page #grid .k-grid-content td {
        text-align: center !important;
    }

    .comprobantes-page #grid .k-grid-content td.col-cliente-nota {
        text-align: left !important;
    }

    .comprobantes-page #grid .k-grid-content td .btn,
    .comprobantes-page #grid .k-grid-content td a,
    .comprobantes-page #grid .k-grid-content td img {
        display: inline-block;
        vertical-align: middle;
    }

    .comprobantes-page #grid .lista_proformas {
        margin: 0;
        padding: 12px 16px 16px 44px;
        background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
        border-top: 1px dashed #cbd5e1;
    }

    .comprobantes-page #grid .lista_proformas .k-grid {
        border: 1px solid #e2e8f0;
        border-radius: 8px;
        overflow: hidden;
        background: #fff;
    }

    .comprobantes-page #grid .lista_proformas .k-grid-header th.k-header {
        text-align: center !important;
        font-size: 11px;
        font-weight: 700;
        color: #475569 !important;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        padding: 8px;
        background: #e2e8f0 !important;
    }

    .comprobantes-page #grid .lista_proformas .k-grid-content td {
        text-align: center !important;
        font-size: 12px;
        padding: 7px 8px;
    }

    .comprobantes-page #grid .lista_proformas .k-grid-content td.col-producto-nota,
    .comprobantes-page #grid .lista_proformas .k-grid-header th.col-producto-nota-header {
        text-align: left !important;
    }

    /* Proformas — colores de estado en grilla */
    .proformas-estado-pendiente .btn {
        background: linear-gradient(135deg, #fbbf24, #d97706);
        color: #fff;
    }

    .proformas-estado-aceptado .btn {
        background: linear-gradient(135deg, #22c55e, #16a34a);
        color: #fff;
    }

    .proformas-estado-anulado .btn {
        background: linear-gradient(135deg, #f87171, #ef4444);
        color: #fff;
    }

    .comprobantes-page #grid .k-grid-content tr.proformas-row-pendiente {
        background-color: #fffbeb !important;
        box-shadow: inset 4px 0 0 #f59e0b;
    }

    .comprobantes-page #grid .k-grid-content tr.proformas-row-pendiente:hover {
        background-color: #fef3c7 !important;
    }

    .comprobantes-page #grid .k-grid-content tr.proformas-row-aceptado {
        background-color: #f0fdf4 !important;
        box-shadow: inset 4px 0 0 #22c55e;
    }

    .comprobantes-page #grid .k-grid-content tr.proformas-row-aceptado:hover {
        background-color: #dcfce7 !important;
    }

    .comprobantes-page #grid .k-grid-content tr.proformas-row-anulado {
        background-color: #fee2e2 !important;
        box-shadow: inset 4px 0 0 #ef4444;
    }

    .comprobantes-page #grid .k-grid-content tr.proformas-row-anulado:hover {
        background-color: #fecaca !important;
    }

    /* Guías — filtros, estado y detalle en grilla */
    .guias-page {
        padding: 0 12px 24px;
    }

    .guias-page .comprobantes-panel-head h2,
    .guias-grid-header h3 {
        color: #0f766e;
    }

    .guias-grid-header {
        background: linear-gradient(180deg, #f0fdfa 0%, #fff 100%);
    }

    .guias-panel {
        overflow: visible;
    }

    .guias-panel-head p {
        margin: 4px 0 0;
        font-size: 13px;
        color: #64748b;
    }

    .guias-filters {
        grid-template-columns: 1fr;
    }

    @media (min-width: 768px) {
        .guias-filters {
            grid-template-columns: minmax(220px, 2.2fr) minmax(120px, 1fr) minmax(120px, 1fr) auto;
            align-items: end;
        }
    }

    .guias-field label,
    .guias-actions-label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .guias-field .form-control {
        border-radius: 8px;
        border-color: #cbd5e1;
        min-height: 36px;
    }

    .guias-filter-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .guias-filter-actions .btn {
        font-weight: 600;
        border-radius: 8px;
    }

    .guias-secondary-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 14px;
        padding-top: 14px;
        border-top: 1px solid #eef2f7;
    }

    .guias-secondary-actions .btn {
        font-weight: 600;
        border-radius: 8px;
    }

    .guias-total-row {
        margin-top: 12px;
    }

    .guias-stats-row {
        align-items: center;
        width: 100%;
    }

    .guias-stats-row #totalNoEnviado {
        margin-left: auto;
    }

    .guias-stats-row .guias-btn-nueva {
        font-weight: 600;
        border-radius: 999px;
        padding: 6px 16px;
        font-size: 12px;
    }

    .guias-total-badge {
        background: #ccfbf1;
        color: #0f766e;
        border-color: #99f6e4;
    }

    .guias-stat-pendiente {
        background: #fffbeb;
        border-color: #fde68a;
        color: #92400e;
    }

    .guias-stat-pendiente strong {
        color: #b45309;
    }

    .guias-stats-row .comprobantes-stat-filter {
        border: 1px solid transparent;
        cursor: pointer;
    }

    .guias-stats-row button.comprobantes-stat-filter {
        appearance: none;
        -webkit-appearance: none;
        font: inherit;
        line-height: inherit;
    }

    .guias-stats-row .comprobantes-stat-filter.is-active {
        box-shadow: 0 0 0 2px rgba(245, 158, 11, 0.35);
    }

    .guias-stats-row .comprobantes-stat-total.is-active {
        box-shadow: 0 0 0 2px rgba(15, 118, 110, 0.35);
    }

    .guias-corr-badge {
        background: #ccfbf1;
        color: #0f766e;
        border: 1px solid #99f6e4;
    }

    .guias-doc-cell {
        font-weight: 600;
        color: #334155;
    }

    .guias-empty-cell {
        color: #94a3b8;
    }

    .guias-grid-actions {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 4px;
        flex-wrap: nowrap;
    }

    .guias-grid-actions .notas-grid-icon-btn img {
        width: 22px;
        height: 22px;
    }

    .guias-grid-actions .btn-eliminar {
        border-radius: 6px;
        padding: 3px 7px;
        line-height: 1.2;
    }

    .guias-page #grid .k-grid-header th.guias-th-cliente,
    .guias-page #grid .k-grid-content td.guias-td-cliente {
        text-align: left !important;
    }

    .guias-page #grid .k-grid-header th:not(.guias-th-cliente),
    .guias-page #grid .k-grid-content td:not(.guias-td-cliente) {
        text-align: center !important;
    }

    .guias-page #grid .k-grid-content td.guias-td-cliente {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 220px;
    }

    .guias-preview-modal .comp-preview-modal-header {
        background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
    }

    .guias-preview-modal .comp-preview-modal-icon {
        background: #0f766e;
    }

    .guias-estado-pendiente .btn {
        background: linear-gradient(135deg, #fbbf24, #d97706);
        color: #fff;
    }

    .guias-estado-enviado .btn {
        background: linear-gradient(135deg, #22c55e, #16a34a);
        color: #fff;
    }

    .comprobantes-page #grid .k-grid-content tr.guias-row-pendiente {
        background-color: #fffbeb !important;
        box-shadow: inset 4px 0 0 #f59e0b;
    }

    .comprobantes-page #grid .k-grid-content tr.guias-row-pendiente:hover {
        background-color: #fef3c7 !important;
    }

    .comprobantes-page #grid .k-grid-content tr.guias-row-enviado {
        background-color: #f0fdf4 !important;
        box-shadow: inset 4px 0 0 #22c55e;
    }

    .comprobantes-page #grid .k-grid-content tr.guias-row-enviado:hover {
        background-color: #dcfce7 !important;
    }

    .guias-page #grid .btn-group .btn-default.dropdown-toggle,
    .guias-page #grid .btn-group .btn-success.dropdown-toggle {
        border: 0;
        border-radius: 999px;
        font-size: 11px;
        font-weight: 700;
        padding: 5px 12px;
        box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
    }

    .guias-page #grid .btn-group .btn-default.dropdown-toggle {
        background: linear-gradient(135deg, #fbbf24, #d97706);
        color: #fff;
    }

    .guias-page #grid .btn-group .btn-success.dropdown-toggle {
        background: linear-gradient(135deg, #22c55e, #16a34a);
        color: #fff;
    }

    .guias-page #grid .btn-group .dropdown-menu {
        border-radius: 10px;
        border-color: #e2e8f0;
        box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
        padding: 6px 0;
        min-width: 210px;
    }

    .guias-page #grid .btn-group .dropdown-menu > li > a {
        padding: 8px 14px;
        font-size: 12px;
        color: #334155;
    }

    .guias-page #grid .btn-group .dropdown-menu > li > a:hover {
        background: #f0fdfa;
        color: #0f766e;
    }

    .guias-page #grid img.descargar-pdf,
    .guias-page #grid .notas-grid-icon-btn img {
        width: 22px;
        height: 22px;
        object-fit: contain;
    }

    .comprobantes-page #grid .lista_guias {
        margin: 0;
        padding: 12px 16px 16px 44px;
        background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
        border-top: 1px dashed #cbd5e1;
    }

    .comprobantes-page #grid .lista_guias .k-grid {
        border: 1px solid #e2e8f0;
        border-radius: 8px;
        overflow: hidden;
        background: #fff;
    }

    .comprobantes-page #grid .lista_guias .k-grid-header th.k-header {
        text-align: center !important;
        font-size: 11px;
        font-weight: 700;
        color: #475569 !important;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        padding: 8px;
        background: #e2e8f0 !important;
    }

    .comprobantes-page #grid .lista_guias .k-grid-content td {
        text-align: center !important;
        font-size: 12px;
        padding: 7px 8px;
    }

    .comprobantes-page #grid .lista_guias .k-grid-content td.col-producto-nota,
    .comprobantes-page #grid .lista_guias .k-grid-header th.col-producto-nota-header {
        text-align: left !important;
    }

    /* Resúmenes — boletas anuladas */
    .resumenes-page {
        padding: 0 12px 24px;
    }

    .resumenes-page .comprobantes-panel-head h2,
    .resumenes-grid-header h3 {
        color: #b45309;
    }

    .resumenes-panel-head p {
        margin: 4px 0 0;
        font-size: 13px;
        color: #64748b;
    }

    .resumenes-grid-header {
        background: linear-gradient(180deg, #fffbeb 0%, #fff 100%);
    }

    .resumenes-filters {
        grid-template-columns: 1fr;
    }

    @media (min-width: 768px) {
        .resumenes-filters {
            grid-template-columns: minmax(220px, 1.5fr) auto;
            align-items: end;
        }
    }

    .resumenes-field label,
    .resumenes-actions-label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .resumenes-field .form-control {
        border-radius: 8px;
        border-color: #cbd5e1;
        min-height: 36px;
    }

    .resumenes-filter-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .resumenes-filter-actions .btn {
        font-weight: 600;
        border-radius: 8px;
    }

    .resumenes-total-row {
        margin-top: 12px;
    }

    .resumenes-total-badge {
        background: #fef3c7;
        color: #92400e;
        border-color: #fde68a;
    }

    .resumenes-total-badge strong {
        color: #b45309;
    }

    .resumenes-page #grid .k-grid-header th.resumenes-th-center,
    .resumenes-page #grid .k-grid-content td.resumenes-td-center {
        text-align: center !important;
    }

    .resumenes-page #grid .k-grid-header th.resumenes-th-cliente,
    .resumenes-page #grid .k-grid-content td.resumenes-td-cliente {
        text-align: left !important;
    }

    .resumenes-page #grid .k-grid-content td.resumenes-td-numero {
        font-weight: 700;
        color: #334155;
    }

    .resumenes-page #grid .k-grid-content td.resumenes-td-monto {
        font-variant-numeric: tabular-nums;
    }

    .resumenes-page #grid .k-grid-content td.resumenes-td-total {
        font-weight: 700;
        color: #0f172a;
    }

    .resumenes-page #grid .k-grid-content tr.resumenes-row-pendiente {
        background-color: #fffbeb !important;
        box-shadow: inset 4px 0 0 #f59e0b;
    }

    .resumenes-page #grid .k-grid-content tr.resumenes-row-pendiente:hover {
        background-color: #fef3c7 !important;
    }

    .resumenes-page #grid .k-grid-content tr.resumenes-row-consulta {
        background-color: #fff7ed !important;
        box-shadow: inset 4px 0 0 #fb923c;
    }

    .resumenes-page #grid .k-grid-content tr.resumenes-row-consulta:hover {
        background-color: #ffedd5 !important;
    }

    .resumenes-page #grid .k-grid-content tr.resumenes-row-enviado {
        background-color: #f0fdf4 !important;
        box-shadow: inset 4px 0 0 #22c55e;
    }

    .resumenes-page #grid .k-grid-content tr.resumenes-row-enviado:hover {
        background-color: #dcfce7 !important;
    }

    .resumenes-page #grid .comp-estado-btn {
        border: 0;
        border-radius: 999px;
        font-size: 11px;
        font-weight: 700;
        padding: 5px 12px;
        min-width: 130px;
        box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
    }

    .resumenes-page #grid .comp-estado-static .comp-estado-btn {
        cursor: default;
        pointer-events: none;
    }

    .resumenes-page #grid .comp-estado-resumen .comp-estado-btn,
    .resumenes-page #grid .comp-estado-pendiente .comp-estado-btn {
        cursor: pointer;
    }

    .resumenes-page #grid .lista_resumenes {
        margin: 0;
        padding: 12px 16px 16px 44px;
        background: linear-gradient(180deg, #fffbeb 0%, #f8fafc 100%);
        border-top: 1px dashed #fcd34d;
    }

    .resumenes-page #grid .lista_resumenes .k-grid {
        border: 1px solid #e2e8f0;
        border-radius: 8px;
        overflow: hidden;
        background: #fff;
    }

    .resumenes-page #grid .lista_resumenes .k-grid-header th.k-header {
        font-size: 11px;
        font-weight: 700;
        color: #475569 !important;
        text-transform: uppercase;
        letter-spacing: 0.35px;
        padding: 8px;
        background: #fef3c7 !important;
    }

    .resumenes-page #grid .lista_resumenes .k-grid-content td {
        font-size: 12px;
        padding: 7px 8px;
    }

    .resumenes-page #grid .lista_resumenes .k-grid-content td.resumenes-td-cliente {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 220px;
    }

    .resumen-estado-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 72px;
        padding: 3px 10px;
        border-radius: 999px;
        font-size: 11px;
        font-weight: 700;
        line-height: 1.2;
    }

    .resumen-estado-adicionar {
        background: #dbeafe;
        color: #1d4ed8;
        border: 1px solid #bfdbfe;
    }

    .resumen-estado-modificar {
        background: #fef3c7;
        color: #b45309;
        border: 1px solid #fde68a;
    }

    .resumen-estado-anulado {
        background: #fee2e2;
        color: #991b1b;
        border: 1px solid #fca5a5;
    }

    /* Generar comprobante tributario (proforma / nota) */
    .generar-comprobante-page.tributario-form-page .comprobante-form-section-title {
        border-left: 3px solid #0ea5e9;
        padding-left: 17px;
    }

    .generar-comprobante-page.tributario-form-page .comprobante-form-top h2::after {
        content: ' — Tributario';
        font-size: 14px;
        font-weight: 600;
        color: #0369a1;
    }

    .generar-comprobante-page .generar-comp-campos-ocultos {
        display: none !important;
    }

    .generar-comprobante-page .comprobante-datos-layout {
        gap: 16px;
    }

    .generar-comprobante-page .comprobante-datos-row--comprobante {
        padding-bottom: 16px;
    }

    .generar-comprobante-page .comprobante-datos-row--cliente {
        padding-top: 2px;
    }

    .generar-comprobante-page .generar-comp-conceptos-panel {
        border-color: #bae6fd;
    }

    .generar-comprobante-page .generar-comp-conceptos-panel .comprobante-form-section-title {
        border-left: 3px solid #0ea5e9;
        padding-left: 17px;
    }

    .generar-comprobante-page .generar-comp-conceptos-panel .nota-conceptos-panel-body {
        padding-top: 12px;
    }

    .generar-comprobante-page .generar-comp-layout {
        align-items: flex-start;
    }

    .generar-comprobante-page .comprobante-totals-col {
        position: sticky;
        top: 12px;
    }

    .generar-comprobante-page .generar-comp-side .comprobante-form-panel + .comprobante-form-panel {
        margin-top: 14px;
    }

    .generar-comprobante-page .generar-comp-observaciones {
        min-height: 88px;
        border-radius: 8px;
        resize: vertical;
    }

    .generar-comprobante-page .generar-comp-submit-wrap {
        padding: 8px 0 24px;
        clear: both;
    }

    .generar-comprobante-page #tabla.table-comprobante-items {
        margin-bottom: 0;
    }

    .generar-comprobante-page #tabla.table-comprobante-items thead th {
        background: #f8fafc;
        font-size: 11px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.25px;
        border-bottom: 1px solid #e2e8f0;
        white-space: nowrap;
    }

    .generar-comprobante-page #tabla.table-comprobante-items tbody td {
        vertical-align: middle;
        font-size: 13px;
    }

    .generar-comprobante-page .generar-comp-items-toolbar {
        margin-top: 12px;
    }

    .generar-comprobante-page .material-switch > input[type="checkbox"] {
        display: none;
        height: 0;
    }

    .generar-comprobante-page .material-switch > label {
        cursor: pointer;
        height: 0;
        position: relative;
        width: 50px;
    }

    .generar-comprobante-page .fila-base {
        display: none;
    }

    @media (max-width: 991px) {
        .generar-comprobante-page .generar-comp-datos-grid {
            grid-template-columns: 1fr;
        }

        .generar-comprobante-page .input_cliente {
            grid-column: auto;
            min-width: 0;
        }
    }

    /* Formulario proforma — nuevo / editar */
    .proforma-form-page .comprobante-form-section-title {
        border-left: 3px solid #d97706;
        padding-left: 17px;
    }

    .proforma-form-page .comprobante-form-top h2::after {
        content: ' — Cotización';
        font-size: 14px;
        font-weight: 600;
        color: #b45309;
    }

    .proforma-form-page .comprobante-datos-field--estado {
        width: 160px;
    }

    .proforma-form-page .proforma-datos-row--extra {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px 12px;
        padding-top: 4px;
    }

    .proforma-form-page .nota-conceptos-panel {
        border-color: #fde68a;
    }

    .proforma-form-page .proforma-observaciones-card,
    .proforma-form-page .proforma-total-card {
        border-color: #fde68a;
    }

    .proforma-form-page .proforma-observaciones-card .nota-pie-card-header,
    .proforma-form-page .proforma-total-card .nota-pie-card-header {
        color: #92400e;
        background: linear-gradient(180deg, #fffbeb 0%, #fef3c7 100%);
        border-bottom-color: #fde68a;
    }

    .proforma-form-page .proforma-observaciones-card .nota-pie-card-icon,
    .proforma-form-page .proforma-total-card .nota-pie-card-icon {
        color: #d97706;
    }

    .proforma-form-page .proforma-total-card .nota-pie-card-body {
        background: linear-gradient(180deg, #fff 0%, #fffbeb 100%);
    }

    .proforma-form-page .proforma-total-card .nota-total-monto {
        border-color: #fcd34d;
        box-shadow: 0 2px 8px rgba(217, 119, 6, 0.12);
    }

    .proforma-form-page .proforma-total-card .nota-total-simbolo,
    .proforma-form-page .proforma-total-card .nota-total-input {
        color: #b45309;
    }

    .proforma-form-page .nota-observaciones-input:focus {
        border-color: #f59e0b;
        box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.16);
    }

    #formComprobante #guardar.btn-generar-proforma,
    .btn-generar-proforma {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        gap: 10px;
        min-width: 300px;
        padding: 14px 36px;
        font-size: 16px;
        font-weight: 600;
        letter-spacing: 0.3px;
        color: #fff !important;
        background-color: #d97706 !important;
        background-image: linear-gradient(135deg, #d97706 0%, #b45309 100%) !important;
        border: 1px solid #b45309 !important;
        border-radius: 10px;
        box-shadow: 0 4px 14px rgba(217, 119, 6, 0.35);
        transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
        float: none !important;
        width: auto !important;
    }

    #formComprobante #guardar.btn-generar-proforma:hover,
    #formComprobante #guardar.btn-generar-proforma:focus,
    .btn-generar-proforma:hover,
    .btn-generar-proforma:focus {
        color: #fff !important;
        background-color: #b45309 !important;
        background-image: linear-gradient(135deg, #b45309 0%, #92400e 100%) !important;
        border-color: #92400e !important;
        box-shadow: 0 6px 18px rgba(217, 119, 6, 0.42);
        transform: translateY(-1px);
        outline: none;
    }

    @media (max-width: 991px) {
        .proforma-form-page .proforma-datos-row--extra {
            grid-template-columns: 1fr;
        }
    }

    /* Formulario guía de remisión — nuevo / editar */
    .guia-form-page .comprobante-form-section-title {
        border-left: 3px solid #0ea5e9;
        padding-left: 17px;
    }

    .guia-form-page .comprobante-form-top h2::after {
        content: ' — Remisión';
        font-size: 14px;
        font-weight: 600;
        color: #0369a1;
    }

    .guia-form-top {
        align-items: flex-start;
    }

    .guia-datos-panel-body {
        max-width: 1180px;
        padding: 14px 16px 16px;
    }

    .guia-datos-field--stock {
        min-width: 88px;
        max-width: 88px;
    }

    .guia-switch-pill {
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0;
        height: 36px;
        min-height: 36px;
        padding: 0 8px;
        border: 1px solid #bae6fd;
        border-radius: 10px;
        background: linear-gradient(180deg, #f8fafc 0%, #f0f9ff 100%);
        cursor: pointer;
        user-select: none;
        box-sizing: border-box;
        width: 100%;
        transition: border-color 0.15s ease, box-shadow 0.15s ease;
    }

    .guia-switch-pill:hover {
        border-color: #7dd3fc;
        box-shadow: 0 2px 8px rgba(2, 132, 199, 0.12);
    }

    .guia-switch-pill input[type="checkbox"] {
        position: absolute;
        opacity: 0;
        width: 0;
        height: 0;
        pointer-events: none;
    }

    .guia-switch-pill-track {
        position: relative;
        display: block;
        width: 44px;
        height: 24px;
        border-radius: 999px;
        background: #cbd5e1;
        transition: background-color 0.22s ease;
        flex-shrink: 0;
    }

    .guia-switch-pill-knob {
        position: absolute;
        top: 3px;
        left: 3px;
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background: #fff;
        box-shadow: 0 1px 4px rgba(15, 23, 42, 0.22);
        transition: transform 0.22s ease;
    }

    .guia-switch-pill input[type="checkbox"]:checked + .guia-switch-pill-track {
        background: linear-gradient(135deg, #0284c7 0%, #0369a1 100%);
    }

    .guia-switch-pill input[type="checkbox"]:checked + .guia-switch-pill-track .guia-switch-pill-knob {
        transform: translateX(20px);
    }

    .guia-switch-pill input[type="checkbox"]:focus + .guia-switch-pill-track {
        box-shadow: 0 0 0 3px rgba(2, 132, 199, 0.25);
    }

    .guia-stock-toggle {
        display: flex;
        align-items: center;
        justify-content: center;
        border: 1px solid #dbeafe;
        border-radius: 8px;
        background: #f8fafc;
        box-sizing: border-box;
    }

    .guia-stock-toggle--inline {
        width: 100%;
        height: 36px;
        min-height: 36px;
        padding: 0;
    }

    .guia-form-page .comprobante-datos-field {
        display: flex;
        flex-direction: column;
        align-items: stretch;
    }

    .guia-form-page .comprobante-datos-field label.control-label {
        display: block;
        width: 100%;
        margin-bottom: 5px;
        text-align: center;
        text-transform: uppercase;
        letter-spacing: 0.3px;
        font-size: 11px;
        font-weight: 700;
        color: #64748b;
        white-space: nowrap;
    }

    .guia-datos-field--stock .material-switch {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 24px;
        line-height: 0;
    }

    .guia-form-page .guia-datos-field--stock .material-switch > label {
        height: 24px;
        width: 50px;
        margin: 0;
    }

    .guia-form-page .guia-datos-field--stock .material-switch > label::before {
        margin-top: 0;
        top: 4px;
    }

    .guia-form-page .guia-datos-field--stock .material-switch > label::after {
        margin-top: 0;
        top: 0;
    }

    .guia-envio-panel .comprobante-form-panel-body {
        max-width: none;
        padding: 12px 14px 14px;
    }

    .guia-envio-stack {
        display: flex;
        flex-direction: column;
        gap: 16px;
        margin-bottom: 16px;
    }

    .guia-form-split.guia-form-split--envio-generales {
        display: grid;
        grid-template-columns: minmax(0, 17fr) minmax(0, 3fr);
        gap: 10px;
        align-items: stretch;
        margin-bottom: 16px;
    }

    .guia-form-split.guia-form-split--envio-generales .guia-envio-panel,
    .guia-form-split.guia-form-split--envio-generales .guia-panel-generales--compact {
        margin-bottom: 0;
        height: 100%;
        min-width: 0;
    }

    .guia-panel-generales--compact {
        max-width: none;
        min-width: 0;
    }

    .guia-panel-generales--compact .comprobante-form-section-title {
        font-size: 10px;
        padding: 8px 8px 6px;
        margin: 0;
        letter-spacing: 0.2px;
    }

    .guia-panel-generales--compact .comprobante-form-panel-body {
        padding: 8px 8px 10px;
    }

    .guia-panel-generales--compact .guia-input-compact {
        max-width: 88px;
        margin-left: auto;
        margin-right: auto;
    }

    .guia-panel-generales--compact .comprobante-datos-field label.control-label {
        font-size: 10px;
    }

    .guia-fields-stack--generales {
        gap: 10px;
    }

    .guia-input-compact {
        max-width: 100%;
        text-align: center;
        padding-left: 6px;
        padding-right: 6px;
        font-size: 13px;
    }

    .guia-input-mini {
        text-align: center;
        padding-left: 6px;
        padding-right: 6px;
        font-size: 12px;
    }

    .guia-datos-field--orden {
        width: 76px;
        max-width: 76px;
        min-width: 76px;
    }

    .guia-envio-stack .guia-envio-panel {
        margin-bottom: 0;
    }

    .guia-panel-generales--below {
        max-width: 860px;
        margin-bottom: 0;
    }

    .guia-fields-grid--generales {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .guia-envio-dest-grid--wide {
        grid-template-columns: 132px 140px minmax(0, 1.15fr) minmax(0, 1fr);
    }

    .guia-envio-dest-grid--wide .guia-envio-field--tipo {
        width: 132px;
        max-width: 132px;
        min-width: 132px;
    }

    .guia-envio-dest-grid--wide .guia-envio-field--doc {
        width: 140px;
        max-width: 140px;
        min-width: 140px;
    }

    .guia-envio-dest-grid--wide .guia-envio-field--nombre,
    .guia-envio-dest-grid--wide .guia-envio-field--direccion-dest {
        min-width: 0;
        width: auto;
        max-width: none;
    }

    .guia-envio-hint {
        font-size: 9px;
        font-weight: 600;
        color: #94a3b8;
        text-transform: none;
        letter-spacing: 0;
    }

    .guia-ubigeo-field-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        margin-bottom: 5px;
        flex-wrap: wrap;
    }

    .guia-ubigeo-field-head .control-label {
        margin-bottom: 0 !important;
        text-align: left !important;
        flex: 1 1 auto;
    }

    .guia-ubigeo-lock-options {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        flex-shrink: 0;
    }

    .guia-ubigeo-lock-opt {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        margin: 0;
        font-size: 11px;
        font-weight: 600;
        color: #64748b;
        cursor: pointer;
        text-transform: none;
        letter-spacing: 0;
        white-space: nowrap;
    }

    .guia-ubigeo-lock-opt input[type="radio"] {
        margin: 0;
        position: relative;
        top: -1px;
    }

    .guia-form-page #ubigeo_partida[readonly] {
        background: #f1f5f9;
        cursor: not-allowed;
    }

    .guia-destinatario-bloqueado .form-control,
    .guia-destinatario-bloqueado select.form-control {
        background: #f1f5f9 !important;
        cursor: not-allowed;
        color: #334155;
    }

    .guia-destinatario-bloqueado select.form-control:disabled {
        opacity: 1;
        -webkit-text-fill-color: #334155;
    }

    .guia-form-split--datos-generales .comprobante-form-panel {
        margin-bottom: 0;
        min-width: 0;
        height: 100%;
    }

    .guia-panel-generales {
        max-width: none;
        min-width: 0;
    }

    .guia-form-split--datos-generales .guia-datos-panel-body {
        max-width: none;
    }

    .guia-form-split--datos-generales .guia-panel-generales .comprobante-form-panel-body {
        padding: 12px 14px 14px;
    }

    .guia-envio-layout {
        display: flex;
        flex-direction: column;
        gap: 14px;
    }

    .guia-envio-subtitle {
        margin-bottom: 8px;
        font-size: 10px;
        font-weight: 700;
        color: #64748b;
        text-transform: uppercase;
        letter-spacing: 0.45px;
        text-align: center;
    }

    .guia-envio-dest-grid {
        display: grid;
        grid-template-columns: 148px 152px minmax(140px, 1fr) minmax(160px, 1.25fr);
        gap: 8px 10px;
        align-items: end;
    }

    .guia-envio-field--tipo {
        width: 148px;
        max-width: 148px;
        min-width: 148px;
    }

    .guia-envio-field--doc {
        width: 152px;
        max-width: 152px;
    }

    .guia-envio-field--nombre,
    .guia-envio-field--direccion-dest {
        min-width: 0;
    }

    .guia-envio-field--tipo .form-control,
    .guia-envio-field--doc .form-control,
    .guia-envio-field--ubigeo .form-control {
        text-align: center;
        padding-left: 6px;
        padding-right: 6px;
    }

    .guia-envio-block--rutas {
        min-width: 0;
    }

    .guia-rutas-split {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
        align-items: stretch;
    }

    .guia-ruta-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px 10px;
        align-items: end;
    }

    .guia-envio-field--ubigeo,
    .guia-envio-field--direccion {
        min-width: 0;
        width: auto;
        max-width: none;
    }

    .guia-ruta-group {
        display: flex;
        flex-direction: column;
        padding: 10px 12px;
        border: 1px solid #e2e8f0;
        border-radius: 8px;
        background: #f8fafc;
        min-width: 0;
        min-height: 100%;
    }

    .guia-ruta-group--llegada .guia-ruta-grid--llegada {
        margin-top: auto;
        padding-top: 0;
        align-self: stretch;
    }

    .guia-ruta-group--llegada .guia-envio-subtitle {
        margin-bottom: 0;
    }

    .guia-form-page .material-switch > input[type="checkbox"] {
        display: none;
        height: 0;
    }

    .guia-form-page .material-switch > label {
        cursor: pointer;
        height: 0;
        position: relative;
        width: 50px;
        margin: 0;
    }

    .guia-form-page .material-switch > label::before {
        background: rgb(0, 0, 0);
        box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5);
        border-radius: 8px;
        content: '';
        height: 16px;
        margin-top: 4px;
        position: absolute;
        opacity: 0.3;
        transition: all 0.4s ease-in-out;
        width: 50px;
    }

    .guia-form-page .material-switch > label::after {
        background: rgb(255, 255, 255);
        border-radius: 16px;
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
        content: '';
        height: 24px;
        left: -4px;
        margin-top: 4px;
        position: absolute;
        top: -4px;
        transition: all 0.3s ease-in-out;
        width: 24px;
    }

    .guia-form-page .material-switch > input[type="checkbox"]:checked + label::before {
        background: inherit;
        opacity: 0.5;
    }

    .guia-form-page .material-switch > input[type="checkbox"]:checked + label::after {
        background: inherit;
        left: 30px;
    }

    .guia-form-split {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
        margin-bottom: 16px;
    }

    .guia-form-split--triple {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 12px;
        align-items: stretch;
    }

    .guia-form-split.guia-form-split--datos-generales {
        grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
        gap: 12px;
        align-items: stretch;
    }

    .guia-form-split--triple .comprobante-form-panel {
        margin-bottom: 0;
        min-width: 0;
        height: 100%;
    }

    .guia-form-split--triple .comprobante-form-panel-body {
        padding: 12px 14px 14px;
    }

    .guia-fields-stack {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .guia-mini-row {
        display: grid;
        grid-template-columns: minmax(88px, 0.9fr) minmax(0, 1.1fr);
        gap: 8px;
        align-items: end;
    }

    .guia-form-page .comprobante-form-panel,
    .guia-form-page .comprobante-form-panel-body,
    .guia-form-page .comprobante-datos-layout,
    .guia-form-page .guia-datos-row--main {
        overflow: visible;
    }

    .guia-form-page .comprobante-form-panel-body select.form-control {
        position: relative;
        z-index: 3;
        width: 100%;
        max-width: 100%;
    }

    .guia-datos-row--main {
        display: grid;
        grid-template-columns:
            132px
            88px
            78px
            88px
            76px
            112px
            minmax(160px, 1fr)
            minmax(140px, 180px);
        gap: 8px 10px;
        align-items: end;
    }

    .guia-datos-field--factura {
        width: 132px;
        max-width: 132px;
    }

    .guia-datos-field--serie-guia {
        width: 78px;
        max-width: 78px;
    }

    .guia-datos-field--numero-guia {
        width: 88px;
        max-width: 88px;
    }

    .guia-datos-field--fecha-guia {
        width: 112px;
        max-width: 112px;
    }

    .guia-datos-field--motivo,
    .guia-datos-field--modalidad {
        min-width: 0;
    }

    .guia-fields-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px 12px;
        align-items: end;
    }

    .guia-datos-field--full {
        grid-column: 1 / -1;
    }

    .guia-datos-field--factura .form-control,
    .guia-datos-field--serie-guia .form-control,
    .guia-datos-field--numero-guia .form-control,
    .guia-datos-field--orden .form-control,
    .guia-datos-field--fecha-guia .form-control {
        text-align: center;
        padding-left: 6px;
        padding-right: 6px;
    }

    .guia-factura-group {
        width: 100%;
    }

    .guia-factura-group .form-control {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        font-size: 12px;
    }

    .guia-factura-group .btn {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        height: 36px;
        width: 34px;
        padding: 6px 8px;
    }

    .guia-form-page .guia-conceptos-panel {
        width: calc((100% - 12px) * 8 / 12);
        max-width: calc((100% - 12px) * 8 / 12);
        margin-left: auto;
        margin-right: auto;
        border-color: #bae6fd;
    }

    .guia-form-page .guia-panel-generales--compact .guia-datos-field--observacion {
        width: 100%;
    }

    .guia-form-page .guia-observacion-input {
        min-height: 72px;
        resize: vertical;
    }

    .guia-form-page .guia-conceptos-panel .nota-conceptos-panel-body {
        padding: 12px 14px 14px;
    }

    .guia-form-page .guia-conceptos-panel .nota-items-actions {
        text-align: center;
    }

    .guia-form-page .guia-conceptos-panel .comprobante-items-wrap {
        overflow-x: auto;
        overflow-y: visible;
    }

    /* Anula min-width 980px de comprobante-items dentro del panel guía */
    .guia-form-page #tabla.guia-items-table.table-comprobante-items {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        table-layout: fixed;
    }

    .guia-form-page #tabla.guia-items-table tbody td {
        vertical-align: middle;
        padding: 6px 5px;
        overflow: hidden;
    }

    .guia-form-page #tabla.guia-items-table .form-control {
        display: block;
        width: 100%;
        max-width: 100%;
        min-height: 34px;
        box-sizing: border-box;
    }

    .guia-form-page #tabla.guia-items-table thead th.col-item-codigo,
    .guia-form-page #tabla.guia-items-table tbody td.col-item-codigo {
        width: 13%;
        text-align: center;
    }

    .guia-form-page #tabla.guia-items-table thead th.col-item-desc,
    .guia-form-page #tabla.guia-items-table tbody td.col-item-desc {
        width: 46%;
    }

    .guia-form-page #tabla.guia-items-table thead th.col-item-cant,
    .guia-form-page #tabla.guia-items-table tbody td.col-item-cant {
        width: 12%;
        text-align: center;
    }

    .guia-form-page #tabla.guia-items-table thead th.col-item-precio,
    .guia-form-page #tabla.guia-items-table tbody td.col-item-precio {
        width: 18%;
        text-align: center;
    }

    .guia-form-page #tabla.guia-items-table thead th.col-item-del,
    .guia-form-page #tabla.guia-items-table tbody td.col-item-del {
        width: 6%;
        text-align: center;
    }

    .guia-form-page #tabla.guia-items-table .col-item-codigo .form-control,
    .guia-form-page #tabla.guia-items-table .guia-item-cantidad,
    .guia-form-page #tabla.guia-items-table .guia-item-precio {
        text-align: center;
        padding-left: 4px;
        padding-right: 4px;
    }

    .guia-form-page #tabla.guia-items-table .descripcion-item,
    .guia-form-page #tabla.guia-items-table .guia-item-descripcion {
        width: 100%;
        max-width: 100%;
    }

    .guia-form-page #tabla.guia-items-table .col-item-desc--sin-stock .guia-item-medida-select {
        margin-top: 6px;
        width: 100%;
        max-width: 100%;
    }

    .guia-form-page #tabla.guia-items-table .col-item-medida {
        display: none;
    }

    .guia-form-page #tabla.guia-items-table .guia-item-data {
        display: none;
    }

    .guia-accion-generar {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 16px;
        margin-bottom: 24px;
        text-align: center;
    }

    #formComprobante #guardar.btn-generar-guia,
    .btn-generar-guia {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        gap: 10px;
        min-width: 300px;
        padding: 14px 36px;
        font-size: 16px;
        font-weight: 600;
        letter-spacing: 0.3px;
        color: #fff !important;
        background-color: #0284c7 !important;
        background-image: linear-gradient(135deg, #0284c7 0%, #0369a1 100%) !important;
        border: 1px solid #0369a1 !important;
        border-radius: 10px;
        box-shadow: 0 4px 14px rgba(2, 132, 199, 0.35);
        transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
        float: none !important;
        width: auto !important;
    }

    #formComprobante #guardar.btn-generar-guia:hover,
    #formComprobante #guardar.btn-generar-guia:focus,
    .btn-generar-guia:hover,
    .btn-generar-guia:focus {
        color: #fff !important;
        background-color: #0369a1 !important;
        background-image: linear-gradient(135deg, #0369a1 0%, #075985 100%) !important;
        border-color: #075985 !important;
        box-shadow: 0 6px 18px rgba(2, 132, 199, 0.42);
        transform: translateY(-1px);
        outline: none;
    }

    @media (max-width: 1199px) {
        .guia-form-split--triple {
            grid-template-columns: 1fr;
        }

        .guia-datos-row--main {
            grid-template-columns: repeat(4, minmax(0, 1fr));
        }

        .guia-datos-field--factura,
        .guia-datos-field--stock,
        .guia-datos-field--serie-guia,
        .guia-datos-field--numero-guia,
        .guia-datos-field--orden,
        .guia-datos-field--fecha-guia {
            width: auto;
            max-width: none;
            min-width: 0;
        }
    }

    @media (max-width: 991px) {
        .guia-form-split,
        .guia-form-split.guia-form-split--envio-generales,
        .guia-fields-grid,
        .guia-fields-grid--generales,
        .guia-datos-row--main,
        .guia-envio-dest-grid,
        .guia-envio-dest-grid--wide,
        .guia-ruta-grid,
        .guia-rutas-split {
            grid-template-columns: 1fr;
        }

        .guia-form-split.guia-form-split--envio-generales {
            display: flex;
            flex-direction: column;
        }

        .guia-panel-generales--compact {
            max-width: none;
            min-width: 0;
        }

        .guia-fields-stack--generales {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .guia-panel-generales--compact .guia-datos-field--observacion {
            grid-column: 1 / -1;
        }

        .guia-panel-generales--below {
            max-width: none;
        }

        .guia-ubigeo-field-head {
            flex-direction: column;
            align-items: stretch;
        }

        .guia-ubigeo-lock-options {
            justify-content: center;
        }

        .guia-envio-field--tipo,
        .guia-envio-field--doc {
            width: auto;
            max-width: none;
        }

        .guia-datos-field--full,
        .guia-envio-field--nombre {
            grid-column: auto;
        }

        .guia-envio-panel .comprobante-form-panel-body {
            max-width: none;
        }

        .guia-datos-field--stock,
        .guia-datos-field--factura,
        .guia-datos-field--serie-guia,
        .guia-datos-field--numero-guia,
        .guia-datos-field--fecha-guia {
            max-width: none;
        }

        .guia-datos-panel-body {
            max-width: none;
        }

        .guia-form-page .guia-conceptos-panel {
            width: 100%;
            max-width: none;
        }
    }

    /* Listado ingresos de almacén */
    .compras-page .comprobantes-panel-head h2::after {
        content: ' — Almacén';
        font-size: 14px;
        font-weight: 600;
        color: #047857;
    }

    .compras-page .comprobantes-panel {
        border-color: #a7f3d0;
    }

    .compras-page .comprobantes-total-badge {
        border-color: #6ee7b7;
        background: linear-gradient(180deg, #ecfdf5 0%, #d1fae5 100%);
        color: #065f46;
    }

    .compras-page .comprobantes-toolbar .btn-success {
        background-color: #059669;
        border-color: #047857;
    }

    .compras-page .comprobantes-toolbar .btn-success:hover,
    .compras-page .comprobantes-toolbar .btn-success:focus {
        background-color: #047857;
        border-color: #065f46;
    }

    .compras-page #grid .k-grid-content tr.compras-row-alt {
        background: #f0fdf4;
    }

    .compras-page #grid .lista_compras .k-grid-header th.k-header {
        background: #ecfdf5;
        color: #065f46;
    }

    /* Formulario ingreso de almacén — nuevo / editar */
    .compra-form-page .comprobante-form-section-title {
        border-left: 3px solid #059669;
        padding-left: 17px;
    }

    .compra-form-page .comprobante-form-top h2::after {
        content: ' — Almacén';
        font-size: 14px;
        font-weight: 600;
        color: #047857;
    }

    .compra-form-page .comprobante-datos-field label.control-label,
    .compra-form-page .comprobante-form-panel-body .control-label {
        display: block;
        text-align: center;
        text-transform: uppercase;
        letter-spacing: 0.35px;
        font-size: 11px;
        font-weight: 700;
        color: #475569;
        margin-bottom: 5px;
    }

    .compra-form-page .comprobante-form-panel {
        border-color: #a7f3d0;
        box-shadow: 0 4px 18px rgba(5, 150, 105, 0.08);
    }

    .compra-form-page .comprobante-form-section-title {
        background: linear-gradient(180deg, #ecfdf5 0%, #f8fafc 100%);
        color: #065f46;
    }

    .compra-form-page.nota-form-page .nota-conceptos-panel {
        border-color: #6ee7b7;
    }

    .compra-form-page .nota-conceptos-panel-body {
        background: #fff;
    }

    .compra-form-page .nota-items-actions .nota-btn-agregar {
        background: #059669;
        border-color: #047857;
        color: #fff;
    }

    .compra-form-page .nota-items-actions .nota-btn-agregar:hover,
    .compra-form-page .nota-items-actions .nota-btn-agregar:focus {
        background: #047857;
        border-color: #065f46;
        color: #fff;
    }

    .compra-form-page .compra-datos-row--documento {
        display: grid;
        grid-template-columns: 100px 120px minmax(140px, 1fr) minmax(140px, 1fr) minmax(160px, 1fr);
        gap: 10px 12px;
        padding-top: 4px;
    }

    .compra-form-page .nota-conceptos-panel,
    .compra-form-page .compra-observaciones-card,
    .compra-form-page .compra-total-card {
        border-color: #a7f3d0;
    }

    .compra-form-page .compra-observaciones-card .nota-pie-card-header,
    .compra-form-page .compra-total-card .nota-pie-card-header {
        color: #065f46;
        background: linear-gradient(180deg, #ecfdf5 0%, #d1fae5 100%);
        border-bottom-color: #a7f3d0;
    }

    .compra-form-page .compra-observaciones-card .nota-pie-card-icon,
    .compra-form-page .compra-total-card .nota-pie-card-icon {
        color: #059669;
    }

    .compra-form-page .compra-total-card .nota-pie-card-body {
        background: linear-gradient(180deg, #fff 0%, #ecfdf5 100%);
    }

    .compra-form-page .nota-observaciones-input:focus {
        border-color: #10b981;
        box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.16);
    }

    .compra-form-page .compra-totales-rows {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .compra-form-page .compra-total-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 8px 10px;
        border: 1px solid #d1fae5;
        border-radius: 8px;
        background: #fff;
    }

    .compra-form-page .compra-total-row--final {
        border-color: #6ee7b7;
        background: linear-gradient(180deg, #fff 0%, #ecfdf5 100%);
        box-shadow: 0 2px 8px rgba(5, 150, 105, 0.12);
    }

    .compra-form-page .compra-total-label {
        font-size: 12px;
        font-weight: 600;
        color: #065f46;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .compra-form-page .compra-total-valor {
        display: flex;
        align-items: center;
        gap: 6px;
        min-width: 130px;
    }

    .compra-form-page .compra-total-simbolo {
        font-size: 13px;
        font-weight: 600;
        color: #047857;
    }

    .compra-form-page .compra-total-input {
        width: 100px;
        text-align: right;
        font-weight: 600;
        border: none;
        background: transparent;
        box-shadow: none;
        padding: 0;
        color: #065f46;
    }

    .compra-form-page .compra-total-input--final {
        font-size: 16px;
        color: #047857;
    }

    .compra-form-page #tabla.compra-items-table thead th.col-item-igv,
    .compra-form-page #tabla.compra-items-table tbody td.col-item-igv {
        width: 130px;
        min-width: 130px;
    }

    .compra-form-page #tabla.compra-items-table thead th.col-item-descuento,
    .compra-form-page #tabla.compra-items-table tbody td.col-item-descuento {
        width: 90px;
        min-width: 90px;
    }

    #formComprobante #guardar.btn-generar-compra,
    .btn-generar-compra {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        gap: 10px;
        min-width: 300px;
        padding: 14px 36px;
        font-size: 16px;
        font-weight: 600;
        letter-spacing: 0.3px;
        color: #fff !important;
        background-color: #059669 !important;
        background-image: linear-gradient(135deg, #059669 0%, #047857 100%) !important;
        border: 1px solid #047857 !important;
        border-radius: 10px;
        box-shadow: 0 4px 14px rgba(5, 150, 105, 0.35);
        transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
        float: none !important;
        width: auto !important;
    }

    #formComprobante #guardar.btn-generar-compra:hover,
    #formComprobante #guardar.btn-generar-compra:focus,
    .btn-generar-compra:hover,
    .btn-generar-compra:focus {
        color: #fff !important;
        background-color: #047857 !important;
        background-image: linear-gradient(135deg, #047857 0%, #065f46 100%) !important;
        border-color: #065f46 !important;
        box-shadow: 0 6px 18px rgba(5, 150, 105, 0.42);
        transform: translateY(-1px);
        outline: none;
    }

    @media (max-width: 991px) {
        .compra-form-page .compra-datos-row--documento {
            grid-template-columns: 1fr 1fr;
        }
    }

    /* Listado comprobantes de compra */
    .comprobantes-compras-page .comprobantes-panel-head h2::after {
        content: ' — Compras';
        font-size: 14px;
        font-weight: 600;
        color: #0e7490;
    }

    .comprobantes-compras-page .comprobantes-panel {
        border-color: #a5f3fc;
    }

    .comprobantes-compras-page .comprobantes-total-badge {
        border-color: #67e8f9;
        background: linear-gradient(180deg, #ecfeff 0%, #cffafe 100%);
        color: #155e75;
    }

    .comprobantes-compras-page .comprobantes-toolbar .btn-success {
        background-color: #0891b2;
        border-color: #0e7490;
    }

    .comprobantes-compras-page .comprobantes-toolbar .btn-success:hover,
    .comprobantes-compras-page .comprobantes-toolbar .btn-success:focus {
        background-color: #0e7490;
        border-color: #155e75;
    }

    .comprobantes-compras-page #grid .k-grid-content tr.comprobantes-compras-row-alt {
        background: #ecfeff;
    }

    .comprobantes-compras-page .comp-compras-accion-cell,
    .comprobantes-compras-page #grid th.comp-compras-accion-col {
        overflow: visible !important;
        white-space: nowrap !important;
        padding-left: 4px !important;
        padding-right: 4px !important;
    }

    .comp-compras-accion-dropdown .comp-estado-btn {
        background: linear-gradient(135deg, #0891b2, #0e7490) !important;
    }

    .comp-compras-accion-menu {
        min-width: 160px;
    }

    .comp-compras-accion-menu > li > a.comp-compras-accion-delete {
        color: #b91c1c;
    }

    .comp-compras-accion-menu > li > a.comp-compras-accion-delete:hover,
    .comp-compras-accion-menu > li > a.comp-compras-accion-delete:focus {
        background: #fef2f2;
        color: #991b1b;
    }

    .comp-compras-accion-menu > li > a.comp-compras-accion-delete .glyphicon {
        color: #ef4444;
    }

    .comprobantes-compras-page .comprobantes-filters.comprobantes-compras-filters {
        display: flex !important;
        flex-wrap: wrap;
        align-items: flex-end;
        justify-content: flex-start;
        gap: 12px;
    }

    .comprobantes-compras-page .comprobantes-compras-filters .comprobantes-compras-field {
        flex: 0 0 auto;
        min-width: 0;
        grid-column: auto;
    }

    .comprobantes-compras-page .comprobantes-compras-filters .comprobantes-compras-field--proveedor {
        flex: 0 1 300px;
        width: 300px;
        max-width: 100%;
    }

    .comprobantes-compras-page .comprobantes-compras-filters .comprobantes-compras-field--tipo {
        flex: 0 0 190px;
        width: 190px;
    }

    .comprobantes-compras-page .comprobantes-compras-filters .comprobantes-compras-field--doc {
        flex: 0 0 auto;
    }

    .comprobantes-compras-page .comprobantes-compras-filters .comprobantes-compras-field--pedido,
    .comprobantes-compras-page .comprobantes-compras-filters .comprobantes-compras-field--guia {
        flex: 0 0 130px;
        width: 130px;
    }

    .comprobantes-compras-page .comprobantes-compras-filters .comprobantes-compras-field--actions {
        flex: 0 0 auto;
    }

    .comprobantes-compras-filters {
        gap: 12px;
    }

    .comprobantes-compras-filters .comprobantes-doc-inline {
        display: flex;
        flex-wrap: nowrap;
        align-items: flex-end;
        gap: 8px;
    }

    .comprobantes-compras-filters .comprobantes-doc-inline-item label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .comprobantes-compras-filters .comprobantes-doc-inline-item--fecha {
        flex: 0 0 118px;
        width: 118px;
    }

    .comprobantes-compras-filters .comprobantes-doc-inline-item--fecha .form-control {
        text-align: center;
        padding-left: 8px;
        padding-right: 8px;
    }

    .comprobantes-compras-filters .comprobantes-doc-inline-item--serie {
        flex: 0 0 72px;
        width: 72px;
    }

    .comprobantes-compras-filters .comprobantes-doc-inline-item--serie .form-control {
        text-align: center;
        padding-left: 6px;
        padding-right: 6px;
        letter-spacing: 0.5px;
    }

    .comprobantes-compras-filters .comprobantes-doc-inline-item--numero {
        flex: 0 0 112px;
        width: 112px;
    }

    .comprobantes-compras-filters .comprobantes-doc-inline-item--numero .form-control {
        text-align: center;
        padding-left: 8px;
        padding-right: 8px;
    }

    .comprobantes-compras-filters .comprobantes-actions-label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .comprobantes-compras-filter-actions {
        display: inline-flex;
        flex-wrap: nowrap;
        gap: 8px;
        align-items: center;
    }

    .comprobantes-compras-filter-actions .btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        min-width: 108px;
        min-height: 36px;
        padding: 7px 16px;
        border-radius: 8px;
        font-weight: 600;
        font-size: 13px;
        white-space: nowrap;
    }

    .comprobantes-compras-filter-actions .btn-compras-buscar {
        background-color: #0891b2;
        border-color: #0e7490;
        color: #fff;
    }

    .comprobantes-compras-filter-actions .btn-compras-buscar:hover,
    .comprobantes-compras-filter-actions .btn-compras-buscar:focus {
        background-color: #0e7490;
        border-color: #155e75;
        color: #fff;
    }

    .comprobantes-compras-filter-actions .btn-compras-limpiar {
        background: #fff;
        border-color: #cbd5e1;
        color: #475569;
    }

    .comprobantes-compras-filter-actions .btn-compras-limpiar:hover,
    .comprobantes-compras-filter-actions .btn-compras-limpiar:focus {
        background: #f8fafc;
        border-color: #94a3b8;
        color: #0f172a;
    }

    @media (max-width: 991px) {
        .comprobantes-compras-page .comprobantes-compras-filters .comprobantes-compras-field--proveedor,
        .comprobantes-compras-page .comprobantes-compras-filters .comprobantes-compras-field--tipo {
            flex: 1 1 220px;
            width: auto;
        }

        .comprobantes-compras-page .comprobantes-compras-filters .comprobantes-compras-field--actions {
            width: 100%;
        }

        .comprobantes-compras-filter-actions {
            width: 100%;
        }

        .comprobantes-compras-filter-actions .btn {
            flex: 1;
        }
    }

    @media (max-width: 575px) {
        .comprobantes-compras-filters .comprobantes-doc-inline {
            flex-wrap: wrap;
            width: 100%;
        }

        .comprobantes-compras-filters .comprobantes-doc-inline-item--fecha,
        .comprobantes-compras-filters .comprobantes-doc-inline-item--serie,
        .comprobantes-compras-filters .comprobantes-doc-inline-item--numero {
            flex: 1 1 calc(33.333% - 6px);
            width: auto;
            min-width: 90px;
        }
    }

    /* Formulario comprobante de compra — nuevo */
    .comprobantes-compras-form-page .comprobante-form-section-title {
        border-left: 3px solid #0891b2;
        padding-left: 17px;
    }

    .comprobantes-compras-form-page .comprobante-form-top h2::after {
        content: ' — Compras';
        font-size: 14px;
        font-weight: 600;
        color: #0e7490;
    }

    .comprobantes-compras-form-page .comprobante-form-panel {
        border-color: #a5f3fc;
        box-shadow: 0 4px 18px rgba(8, 145, 178, 0.08);
    }

    .comprobantes-compras-form-page .comprobante-form-section-title {
        background: linear-gradient(180deg, #ecfeff 0%, #f8fafc 100%);
        color: #155e75;
    }

    .comprobantes-compras-form-page .comprobante-items-toolbar .btn-info {
        background-color: #0891b2;
        border-color: #0e7490;
    }

    .comprobantes-compras-form-page .comprobante-totals-panel .input-group-addon {
        background: #ecfeff;
        color: #155e75;
        font-weight: 600;
    }

    #formComprobante #guardar.btn-generar-compra-cc,
    .btn-generar-compra-cc {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        gap: 10px;
        min-width: 320px;
        padding: 14px 36px;
        font-size: 16px;
        font-weight: 600;
        color: #fff !important;
        background-color: #0891b2 !important;
        background-image: linear-gradient(135deg, #0891b2 0%, #0e7490 100%) !important;
        border: 1px solid #0e7490 !important;
        border-radius: 10px;
        box-shadow: 0 4px 14px rgba(8, 145, 178, 0.35);
        float: none !important;
        width: auto !important;
    }

    #formComprobante #guardar.btn-generar-compra-cc:hover,
    #formComprobante #guardar.btn-generar-compra-cc:focus,
    .btn-generar-compra-cc:hover,
    .btn-generar-compra-cc:focus {
        background-color: #0e7490 !important;
        background-image: linear-gradient(135deg, #0e7490 0%, #155e75 100%) !important;
        border-color: #155e75 !important;
        color: #fff !important;
        outline: none;
    }

    /* Módulo proveedores */
    .proveedores-page {
        padding: 0 12px 24px;
        overflow: visible;
    }

    .proveedores-panel {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
        padding: 18px 20px;
        margin-bottom: 14px;
        overflow: visible;
    }

    .proveedores-panel-head {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        margin-bottom: 16px;
    }

    .proveedores-panel-head h2 {
        margin: 0;
        font-size: 22px;
        font-weight: 700;
        color: #1e293b;
    }

    .proveedores-panel-head p {
        margin: 4px 0 0;
        font-size: 13px;
        color: #64748b;
    }

    .proveedores-filters,
    .proveedores-estado-filters {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        align-items: flex-end;
    }

    .proveedores-field {
        flex: 0 0 auto;
    }

    .proveedores-field--search {
        width: 520px;
        min-width: 320px;
        max-width: 100%;
        flex: 1 1 420px;
        position: relative;
        overflow: visible;
    }

    .proveedores-field--proveedor {
        flex: 1 1 260px;
        min-width: 220px;
    }

    .proveedores-field--fecha {
        width: 140px;
    }

    .proveedores-field label,
    .proveedores-actions-label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .proveedores-field .form-control {
        border-radius: 8px;
        border-color: #cbd5e1;
        min-height: 36px;
        font-size: 13px;
    }

    .proveedores-filter-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .proveedores-filter-actions .btn {
        min-width: 100px;
        font-weight: 600;
        border-radius: 8px;
        padding: 8px 14px;
        font-size: 13px;
    }

    .proveedores-secondary-actions {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px;
        margin-top: 4px;
        margin-bottom: 14px;
        padding-top: 12px;
        border-top: 1px solid #eef2f7;
    }

    .proveedores-secondary-actions .btn {
        font-weight: 600;
        border-radius: 8px;
        padding: 7px 14px;
        font-size: 13px;
    }

    .proveedores-secondary-actions .btn-success {
        background: #16a34a;
        border-color: #15803d;
    }

    .proveedores-secondary-actions .btn-export {
        background: #2563eb;
        border-color: #1d4ed8;
        color: #fff;
    }

    .proveedores-secondary-actions .btn-export:hover,
    .proveedores-secondary-actions .btn-export:focus {
        background: #1d4ed8;
        border-color: #1e40af;
        color: #fff;
    }

    .proveedores-total-row {
        margin-top: 14px;
        display: flex;
        justify-content: flex-end;
    }

    .proveedores-total-badge {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 6px 14px;
        border-radius: 999px;
        background: #fff7ed;
        border: 1px solid #fed7aa;
        color: #9a3412;
        font-size: 13px;
    }

    .proveedores-total-badge strong {
        color: #c2410c;
        font-size: 14px;
    }

    .proveedores-toolbar {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        margin-bottom: 14px;
        padding: 12px 16px;
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 10px;
        box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
    }

    .proveedores-toolbar-left,
    .proveedores-toolbar-right {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px;
    }

    .proveedores-toolbar .btn {
        font-weight: 600;
        border-radius: 8px;
        padding: 7px 14px;
        font-size: 13px;
    }

    .proveedores-toolbar .btn-success {
        background: #16a34a;
        border-color: #15803d;
    }

    .proveedores-toolbar .btn-export,
    .proveedores-filter-actions .btn-export {
        background: #2563eb;
        border-color: #1d4ed8;
        color: #fff;
    }

    .proveedores-toolbar .btn-export:hover,
    .proveedores-filter-actions .btn-export:hover,
    .proveedores-toolbar .btn-export:focus,
    .proveedores-filter-actions .btn-export:focus {
        background: #1d4ed8;
        border-color: #1e40af;
        color: #fff;
    }

    .proveedores-grid-card {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
        overflow: visible;
        padding: 4px;
        max-width: 100%;
    }

    .proveedores-grid-card #grid,
    .proveedores-grid-card .k-grid {
        width: 100% !important;
        max-width: 100%;
        border-radius: 0 0 10px 10px;
        overflow: hidden;
    }

    .proveedores-grid-card .k-grid-header-wrap {
        overflow-x: hidden !important;
    }

    .proveedores-grid-card .k-grid-content {
        overflow-x: hidden !important;
        overflow-y: auto !important;
    }

    .proveedores-grid-card .k-pager-wrap {
        display: block !important;
        visibility: visible !important;
        padding: 10px 16px;
        background: #f8fafc;
        border-top: 1px solid #e5e7eb;
    }

    .proveedores-grid-header {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        padding: 14px 18px;
        border-bottom: 1px solid #eef2f7;
        background: linear-gradient(180deg, #fff7ed 0%, #fff 100%);
    }

    .proveedores-grid-header h3 {
        margin: 0;
        font-size: 16px;
        font-weight: 700;
        color: #9a3412;
    }

    .proveedores-grid-header p {
        margin: 2px 0 0;
        font-size: 12px;
        color: #64748b;
    }

    .proveedores-page .k-grid {
        border: 0;
    }

    .proveedores-page .k-grid-header {
        background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
    }

    .proveedores-page .k-grid-header th.k-header {
        border-color: rgba(255, 255, 255, 0.08);
        color: #f8fafc;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.4px;
    }

    .proveedores-row-alt {
        background: #fffbf5 !important;
    }

    .proveedores-estado-content {
        padding: 16px 18px 20px;
        min-height: 120px;
    }

    .proveedores-estado-result .proveedores-estado-content:empty::before {
        content: 'Seleccione un proveedor y pulse Buscar para ver el detalle.';
        display: block;
        padding: 28px 12px;
        text-align: center;
        color: #94a3b8;
        font-size: 14px;
    }

    .notas-grid-icon-danger {
        border-color: #fecaca;
        background: #fef2f2;
        color: #dc2626;
    }

    .notas-grid-icon-danger:hover,
    .notas-grid-icon-danger:focus {
        background: #dc2626;
        border-color: #dc2626;
        color: #fff;
        box-shadow: 0 4px 10px rgba(220, 38, 38, 0.25);
    }

    .proveedores-search-wrap {
        position: relative;
    }

    .proveedores-suggest {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        min-width: 100%;
        width: max(100%, 520px);
        z-index: 10050;
        margin: 4px 0 0;
        padding: 4px 0;
        list-style: none;
        background: #fff;
        border: 1px solid #cbd5e1;
        border-radius: 8px;
        box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
        max-height: 320px;
        overflow-y: auto;
        overflow-x: hidden;
    }

    .proveedores-suggest-item {
        display: block;
        width: 100%;
        padding: 10px 14px;
        border: 0;
        background: transparent;
        text-align: left;
        font-size: 13px;
        line-height: 1.4;
        color: #1e293b;
        white-space: normal;
        word-break: break-word;
        cursor: pointer;
    }

    .proveedores-suggest-item:hover,
    .proveedores-suggest-item:focus {
        background: #fff7ed;
        color: #9a3412;
        outline: none;
    }

    .proveedores-page .ui-autocomplete,
    .ui-autocomplete.proveedores-autocomplete-menu {
        z-index: 10050 !important;
        max-height: 280px;
        overflow-y: auto;
        overflow-x: hidden;
        border-radius: 8px;
        border: 1px solid #cbd5e1;
        box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
        font-size: 13px;
        min-width: 320px;
        background: #fff;
    }

    .proveedores-page .ui-autocomplete .ui-menu-item,
    .ui-autocomplete.proveedores-autocomplete-menu .ui-menu-item {
        border: 0;
    }

    .proveedores-page .ui-autocomplete .ui-menu-item a,
    .ui-autocomplete.proveedores-autocomplete-menu .ui-menu-item a {
        padding: 8px 12px;
        color: #1e293b;
        border: 0;
    }

    .proveedores-page .ui-autocomplete .ui-state-focus,
    .proveedores-page .ui-autocomplete .ui-state-active,
    .ui-autocomplete.proveedores-autocomplete-menu .ui-state-focus,
    .ui-autocomplete.proveedores-autocomplete-menu .ui-state-active {
        border: 0;
        background: #fff7ed;
        color: #9a3412;
        margin: 0;
    }

    /* Modal proveedor */
    .proveedores-modal-dialog {
        width: 640px;
        max-width: calc(100vw - 24px);
    }

    .proveedores-modal-content {
        border: 0;
        border-radius: 14px;
        overflow: hidden;
        box-shadow: 0 20px 50px rgba(15, 23, 42, 0.18);
    }

    .proveedores-modal-header {
        background: linear-gradient(135deg, #ea580c 0%, #c2410c 100%);
        border: 0;
        padding: 18px 22px;
        color: #fff;
    }

    .proveedores-modal-header .close {
        color: #fff;
        opacity: 0.85;
        text-shadow: none;
        margin-top: 2px;
    }

    .proveedores-modal-header .close:hover {
        opacity: 1;
    }

    .proveedores-modal-header-inner {
        display: flex;
        align-items: center;
        gap: 14px;
        padding-right: 24px;
    }

    .proveedores-modal-icon {
        width: 44px;
        height: 44px;
        border-radius: 12px;
        background: rgba(255, 255, 255, 0.16);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 18px;
    }

    .proveedores-modal-header .modal-title {
        margin: 0;
        font-size: 18px;
        font-weight: 700;
        color: #fff;
    }

    .proveedores-modal-subtitle {
        margin: 2px 0 0;
        font-size: 12px;
        color: rgba(255, 255, 255, 0.85);
    }

    .proveedores-modal-body {
        padding: 18px 22px 16px;
        background: #f1f5f9;
    }

    .proveedores-modal-section {
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        padding: 14px 16px 16px;
        margin-bottom: 12px;
        box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
    }

    .proveedores-modal-section:last-of-type {
        margin-bottom: 0;
    }

    .proveedores-modal-section-title {
        margin: 0 0 12px;
        padding-bottom: 8px;
        border-bottom: 1px solid #eef2f7;
        font-size: 11px;
        font-weight: 700;
        color: #9a3412;
        text-transform: uppercase;
        letter-spacing: 0.45px;
    }

    .proveedores-modal-row {
        display: flex;
        flex-wrap: wrap;
        gap: 12px 16px;
        align-items: flex-end;
    }

    .proveedores-modal-row--ident .proveedores-modal-field--ruc {
        flex: 0 0 168px;
        width: 168px;
        max-width: 100%;
    }

    .proveedores-modal-row--ident .proveedores-modal-field--razon {
        flex: 1 1 260px;
        min-width: 0;
    }

    .proveedores-modal-row--contacto .proveedores-modal-field--telefono {
        flex: 0 0 148px;
        width: 148px;
        max-width: 100%;
    }

    .proveedores-modal-row--contacto .proveedores-modal-field--direccion {
        flex: 1 1 280px;
        min-width: 0;
    }

    .proveedores-modal-field {
        min-width: 0;
    }

    .proveedores-modal-field label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .proveedores-modal-field .form-control {
        border-radius: 8px;
        border-color: #cbd5e1;
        min-height: 38px;
        font-size: 13px;
        width: 100%;
    }

    .proveedores-modal-field.has-error .form-control {
        border-color: #ef4444;
        box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.12);
    }

    .proveedores-required {
        color: #ef4444;
    }

    .proveedores-modal-note {
        margin: 12px 2px 0;
        font-size: 12px;
        color: #64748b;
    }

    .proveedores-modal-footer {
        border-top: 1px solid #eef2f7;
        background: #f8fafc;
        padding: 12px 22px;
        display: flex;
        justify-content: flex-end;
        gap: 8px;
    }

    .proveedores-modal-footer .btn {
        min-width: 110px;
        font-weight: 600;
        border-radius: 8px;
        padding: 8px 16px;
    }

    .proveedores-btn-save {
        background: #ea580c;
        border-color: #c2410c;
    }

    .proveedores-btn-save:hover,
    .proveedores-btn-save:focus {
        background: #c2410c;
        border-color: #9a3412;
        color: #fff;
    }

    @media (max-width: 767px) {
        .proveedores-field--search,
        .proveedores-field--fecha,
        .proveedores-field--proveedor,
        .proveedores-field--actions {
            width: 100%;
        }

        .proveedores-filter-actions {
            width: 100%;
        }

        .proveedores-filter-actions .btn {
            flex: 1;
        }

        .proveedores-secondary-actions {
            width: 100%;
        }

        .proveedores-secondary-actions .btn {
            flex: 1 1 auto;
        }

        .proveedores-modal-row--ident .proveedores-modal-field--ruc,
        .proveedores-modal-row--ident .proveedores-modal-field--razon,
        .proveedores-modal-row--contacto .proveedores-modal-field--telefono,
        .proveedores-modal-row--contacto .proveedores-modal-field--direccion {
            flex: 1 1 100%;
            width: 100%;
        }
    }

    /* Módulo cajas */
    .cajas-page {
        padding: 0 12px 24px;
    }

    .cajas-panel {
        overflow: visible;
        margin-bottom: 12px;
    }

    .cajas-panel-head {
        margin-bottom: 12px;
    }

    .cajas-panel-head h2 {
        margin: 0;
        font-size: 22px;
        font-weight: 700;
        color: #1e293b;
    }

    .cajas-panel-head p {
        margin: 4px 0 0;
        font-size: 13px;
        color: #64748b;
    }

    .cajas-page .cajas-filters {
        display: flex;
        flex-wrap: wrap;
        gap: 8px 10px;
        align-items: flex-end;
        grid-template-columns: none;
    }

    .cajas-page .cajas-field {
        flex: 0 0 auto;
        min-width: 0;
    }

    .cajas-field--fecha {
        width: 128px;
    }

    .cajas-field--vendedor {
        width: 220px;
        max-width: 240px;
    }

    .cajas-filters-inline {
        display: flex;
        flex-wrap: wrap;
        gap: 8px 10px;
        align-items: flex-end;
    }

    .cajas-field--actions {
        flex: 0 0 auto;
    }

    .cajas-page .cajas-field label {
        margin-bottom: 4px;
        font-size: 11px;
    }

    .cajas-page .cajas-field .form-control {
        min-height: 34px;
        padding: 6px 10px;
    }

    .cajas-filter-actions {
        gap: 6px;
    }

    .cajas-filter-actions .btn {
        min-width: 84px;
        padding: 6px 12px;
        font-size: 12px;
    }

    .cajas-secondary-actions {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px;
        margin-top: 10px;
        padding-top: 10px;
        border-top: 1px solid #eef2f7;
    }

    .cajas-secondary-actions .btn-success,
    .cajas-secondary-actions .btn-danger {
        font-weight: 600;
        border-radius: 8px;
        padding: 6px 12px;
        font-size: 12px;
    }

    .cajas-total-row {
        margin-top: 10px;
        margin-bottom: 0;
    }

    .cajas-grid-card {
        margin-top: 0;
        border-radius: 12px;
        overflow: visible;
    }

    .cajas-grid-card .k-grid {
        overflow: visible;
    }

    .cajas-grid-card .k-grid-header,
    .cajas-grid-card .k-grid-header-wrap {
        overflow-x: scroll !important;
        overflow-y: hidden !important;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .cajas-grid-card .k-grid-header-wrap::-webkit-scrollbar,
    .cajas-grid-card .k-grid-header::-webkit-scrollbar {
        display: none;
        width: 0;
        height: 0;
    }

    .cajas-grid-card .k-grid-content {
        overflow-x: auto !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    .cajas-grid-card .k-grid-header table,
    .cajas-grid-card .k-grid-content table {
        width: max-content !important;
        min-width: 100%;
        table-layout: auto !important;
    }

    .cajas-grid-card .k-grid th,
    .cajas-grid-card .k-grid td {
        overflow: visible;
        text-overflow: clip;
        white-space: nowrap;
    }

    .cajas-grid-header h3 {
        margin: 0;
        font-size: 16px;
        font-weight: 700;
        color: #1e293b;
    }

    .cajas-grid-header p {
        margin: 4px 0 0;
        font-size: 12px;
        color: #64748b;
    }

    .cajas-page .k-grid {
        border: 0;
    }

    .cajas-page .k-grid-header {
        background: linear-gradient(135deg, #0f766e 0%, #115e59 100%);
    }

    .cajas-page .k-grid-header th.k-header {
        border-color: rgba(255, 255, 255, 0.08);
        color: #f8fafc;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.2px;
    }

    .cajas-page .k-grid-content tr.cajas-row-alt {
        background: #f8fafc;
    }

    .cajas-page .k-grid-content tr.cajas-row:hover {
        background: #ecfdf5;
    }

    .cajas-monto {
        font-variant-numeric: tabular-nums;
        font-size: 12px;
        color: #334155;
    }

    .cajas-monto--total {
        font-weight: 700;
        color: #0f766e;
    }

    .cajas-fecha {
        font-size: 12px;
        color: #475569;
        white-space: nowrap;
    }

    .cajas-estado-badge {
        display: inline-block;
        padding: 3px 8px;
        border-radius: 999px;
        font-size: 11px;
        font-weight: 700;
        background: #ecfdf5;
        color: #047857;
        text-transform: uppercase;
    }

    .cajas-page .k-grid .cajas-action-cell {
        text-align: center !important;
        vertical-align: middle !important;
        padding: 6px 4px !important;
    }

    .cajas-page .k-grid .cajas-action-cell .notas-grid-icon-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 32px;
        height: 32px;
        margin: 0 auto;
        padding: 0;
        line-height: 1;
        vertical-align: middle;
    }

    .cajas-page .k-grid .cajas-action-cell .cajas-btn-pdf img {
        display: block;
        width: 18px;
        height: 18px;
        margin: 0;
    }

    .cajas-page .k-grid .cajas-action-cell .cajas-btn-ticket .glyphicon {
        display: block;
        position: static;
        top: auto;
        line-height: 1;
        font-size: 16px;
        margin: 0;
    }

    /* Modal cierre de caja */
    .cajas-cierre-modal-dialog {
        width: 920px;
        max-width: calc(100vw - 24px);
        margin: 24px auto;
    }

    .cajas-cierre-modal-content {
        border: 0;
        border-radius: 14px;
        overflow: hidden;
        box-shadow: 0 20px 50px rgba(15, 23, 42, 0.2);
    }

    .cajas-cierre-modal-header {
        background: linear-gradient(135deg, #0f766e 0%, #115e59 100%);
        border: 0;
        padding: 18px 22px;
        color: #fff;
    }

    .cajas-cierre-modal-header .close {
        color: #fff;
        opacity: 0.85;
        text-shadow: none;
        margin-top: 2px;
    }

    .cajas-cierre-modal-header .close:hover {
        opacity: 1;
    }

    .cajas-cierre-modal-header-inner {
        display: flex;
        align-items: center;
        gap: 14px;
        padding-right: 24px;
    }

    .cajas-cierre-modal-icon {
        width: 44px;
        height: 44px;
        border-radius: 12px;
        background: rgba(255, 255, 255, 0.16);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 18px;
    }

    .cajas-cierre-modal-header .modal-title {
        margin: 0;
        font-size: 18px;
        font-weight: 700;
        color: #fff;
    }

    .cajas-cierre-modal-subtitle {
        margin: 2px 0 0;
        font-size: 12px;
        color: rgba(255, 255, 255, 0.85);
    }

    .cajas-cierre-modal-body {
        padding: 16px 20px 12px;
        background: #f1f5f9;
        max-height: calc(100vh - 180px);
        overflow-y: auto;
    }

    .cajas-cierre-info-bar {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px;
        margin-bottom: 12px;
    }

    .cajas-cierre-info-item {
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        padding: 10px 12px;
    }

    .cajas-cierre-info-label {
        display: block;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.3px;
        color: #64748b;
        margin-bottom: 4px;
    }

    .cajas-cierre-info-item strong {
        display: block;
        font-size: 13px;
        color: #1e293b;
        word-break: break-word;
    }

    .cajas-cierre-section {
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        padding: 14px 16px 12px;
        margin-bottom: 12px;
        box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
    }

    .cajas-cierre-section:last-child {
        margin-bottom: 0;
    }

    .cajas-cierre-section-title {
        margin: 0 0 12px;
        font-size: 13px;
        font-weight: 700;
        color: #0f766e;
        text-transform: uppercase;
        letter-spacing: 0.3px;
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .cajas-cierre-section-title .glyphicon {
        font-size: 14px;
    }

    .cajas-cierre-grid {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 10px 12px;
    }

    .cajas-cierre-grid--compact {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .cajas-cierre-field label {
        display: block;
        margin-bottom: 5px;
        font-size: 11px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.2px;
    }

    .cajas-cierre-readonly,
    .cajas-cierre-total-input {
        background: #f8fafc !important;
        border-color: #cbd5e1 !important;
        color: #1e293b;
        font-variant-numeric: tabular-nums;
        text-align: right;
        font-weight: 600;
        border-radius: 8px;
        min-height: 34px;
        box-shadow: none;
    }

    .cajas-cierre-total-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-top: 12px;
        padding-top: 12px;
        border-top: 1px dashed #e2e8f0;
    }

    .cajas-cierre-total-row label {
        margin: 0;
        font-size: 12px;
        font-weight: 700;
        color: #334155;
        text-transform: uppercase;
        letter-spacing: 0.2px;
        white-space: nowrap;
    }

    .cajas-cierre-total-input {
        max-width: 180px;
        font-size: 14px;
    }

    .cajas-cierre-total-row--highlight {
        background: #ecfdf5;
        border: 1px solid #a7f3d0;
        border-radius: 10px;
        padding: 10px 12px;
        margin-top: 14px;
        border-top: 1px solid #a7f3d0;
    }

    .cajas-cierre-total-input--main {
        max-width: 200px;
        font-size: 16px;
        font-weight: 700;
        color: #047857;
        background: #fff !important;
    }

    .cajas-cierre-modal-footer {
        background: #fff;
        border-top: 1px solid #e2e8f0;
        padding: 12px 20px;
        display: flex;
        justify-content: flex-end;
        gap: 8px;
    }

    .cajas-cierre-btn-cancel,
    .cajas-cierre-btn-close {
        min-width: 120px;
        font-weight: 600;
        border-radius: 8px;
        padding: 8px 16px;
    }

    .cajas-cierre-btn-close .glyphicon {
        margin-right: 4px;
    }

    @media (max-width: 768px) {
        .cajas-cierre-info-bar,
        .cajas-cierre-grid,
        .cajas-cierre-grid--compact {
            grid-template-columns: 1fr;
        }

        .cajas-cierre-total-row {
            flex-direction: column;
            align-items: stretch;
        }

        .cajas-cierre-total-input,
        .cajas-cierre-total-input--main {
            max-width: 100%;
        }

        .cajas-cierre-modal-footer {
            flex-direction: column-reverse;
        }

        .cajas-cierre-btn-cancel,
        .cajas-cierre-btn-close {
            width: 100%;
        }
    }

    /* Modal vista previa ticket / PDF caja */
    .cajas-preview-modal .modal-dialog {
        margin: 20px auto;
        width: auto;
        max-width: calc(100vw - 24px);
    }

    .cajas-preview-modal-dialog--ticket {
        max-width: 460px;
    }

    .cajas-preview-modal-dialog--pdf {
        max-width: 920px;
        width: calc(100vw - 32px);
    }

    .cajas-preview-modal-content {
        border: 0;
        border-radius: 14px;
        overflow: hidden;
        box-shadow: 0 20px 50px rgba(15, 23, 42, 0.22);
    }

    .cajas-preview-modal-header {
        background: linear-gradient(135deg, #0f766e 0%, #115e59 100%);
        border: 0;
        padding: 18px 22px;
        color: #fff;
        position: relative;
    }

    .cajas-preview-modal-header .cajas-preview-close {
        position: absolute;
        top: 12px;
        right: 14px;
        width: 32px;
        height: 32px;
        padding: 0;
        border: 0;
        background: transparent;
        color: #fff;
        opacity: 0.85;
        font-size: 24px;
        line-height: 1;
        margin: 0;
    }

    .cajas-preview-modal-header .cajas-preview-close:hover {
        opacity: 1;
    }

    .cajas-preview-modal-header-inner {
        display: flex;
        align-items: center;
        gap: 14px;
        padding-right: 28px;
    }

    .cajas-preview-modal-icon {
        width: 44px;
        height: 44px;
        border-radius: 12px;
        background: rgba(255, 255, 255, 0.16);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 18px;
        flex-shrink: 0;
    }

    .cajas-preview-modal-header .modal-title {
        margin: 0;
        font-size: 18px;
        font-weight: 700;
        color: #fff;
    }

    .cajas-preview-modal-subtitle {
        margin: 2px 0 0;
        font-size: 12px;
        color: rgba(255, 255, 255, 0.85);
    }

    .cajas-preview-modal-body {
        padding: 14px 16px 16px;
        background: #f1f5f9;
    }

    .cajas-preview-toolbar {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-end;
        gap: 8px;
        margin-bottom: 12px;
    }

    .cajas-preview-toolbar .btn {
        font-weight: 600;
        border-radius: 8px;
        padding: 7px 14px;
    }

    .cajas-preview-toolbar .btn-primary {
        background: #0f766e;
        border-color: #0f766e;
    }

    .cajas-preview-toolbar .btn-primary:hover,
    .cajas-preview-toolbar .btn-primary:focus {
        background: #115e59;
        border-color: #115e59;
    }

    .cajas-preview-frame-wrap {
        position: relative;
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        overflow: hidden;
        min-height: 420px;
        box-shadow: inset 0 1px 3px rgba(15, 23, 42, 0.04);
    }

    .cajas-preview-modal-dialog--ticket .cajas-preview-frame-wrap {
        min-height: 520px;
    }

    .cajas-preview-modal-dialog--pdf .cajas-preview-frame-wrap {
        min-height: 480px;
    }

    .cajas-preview-frame {
        display: block;
        width: 100%;
        height: 68vh;
        min-height: 420px;
        border: 0;
        background: #fff;
    }

    .cajas-preview-loading {
        position: absolute;
        inset: 0;
        z-index: 2;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 12px;
        background: rgba(255, 255, 255, 0.92);
        color: #475569;
        font-size: 13px;
        font-weight: 600;
    }

    .cajas-preview-loading-spinner {
        width: 34px;
        height: 34px;
        border: 3px solid #cbd5e1;
        border-top-color: #0f766e;
        border-radius: 50%;
        animation: cajasPreviewSpin 0.75s linear infinite;
    }

    @keyframes cajasPreviewSpin {
        to {
            transform: rotate(360deg);
        }
    }

    .cajas-preview-modal-footer {
        background: #fff;
        border-top: 1px solid #e2e8f0;
        padding: 12px 16px;
        display: flex;
        justify-content: flex-end;
    }

    .cajas-preview-btn-cerrar {
        min-width: 120px;
        font-weight: 600;
        border-radius: 8px;
        padding: 8px 16px;
    }

    .cajas-preview-btn-cerrar .glyphicon {
        margin-right: 4px;
    }

    @media (max-width: 768px) {
        .cajas-preview-modal-dialog--ticket,
        .cajas-preview-modal-dialog--pdf {
            max-width: calc(100vw - 16px);
            width: calc(100vw - 16px);
            margin: 10px auto;
        }

        .cajas-preview-frame {
            height: 58vh;
            min-height: 320px;
        }

        .cajas-preview-toolbar {
            justify-content: flex-end;
        }

        .cajas-preview-toolbar .btn {
            width: auto;
        }

        .cajas-preview-modal-footer {
            padding: 10px 12px;
        }

        .cajas-preview-btn-cerrar {
            width: 100%;
        }
    }

    /* Modal vista previa ticket / PDF comprobantes */
    .comp-preview-modal .modal-dialog {
        margin: 20px auto;
        width: auto;
        max-width: calc(100vw - 24px);
    }

    .comp-preview-modal-dialog--ticket {
        max-width: 460px;
    }

    .comp-preview-modal-dialog--pdf {
        max-width: 920px;
        width: calc(100vw - 32px);
    }

    .comp-preview-modal-content {
        border: 0;
        border-radius: 14px;
        overflow: hidden;
        box-shadow: 0 20px 50px rgba(15, 23, 42, 0.22);
    }

    .comp-preview-modal-header {
        background: linear-gradient(135deg, #1e40af 0%, #2563eb 100%);
        border: 0;
        padding: 18px 22px;
        color: #fff;
        position: relative;
    }

    .comp-preview-modal-header .comp-preview-close {
        position: absolute;
        top: 12px;
        right: 14px;
        width: 32px;
        height: 32px;
        padding: 0;
        border: 0;
        background: transparent;
        color: #fff;
        opacity: 0.85;
        font-size: 24px;
        line-height: 1;
        margin: 0;
    }

    .comp-preview-modal-header .comp-preview-close:hover {
        opacity: 1;
    }

    .comp-preview-modal-header-inner {
        display: flex;
        align-items: center;
        gap: 14px;
        padding-right: 28px;
    }

    .comp-preview-modal-icon {
        width: 44px;
        height: 44px;
        border-radius: 12px;
        background: rgba(255, 255, 255, 0.16);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 18px;
        flex-shrink: 0;
    }

    .comp-preview-modal-header .modal-title {
        margin: 0;
        font-size: 18px;
        font-weight: 700;
        color: #fff;
    }

    .comp-preview-modal-subtitle {
        margin: 2px 0 0;
        font-size: 12px;
        color: rgba(255, 255, 255, 0.85);
    }

    .comp-preview-modal-body {
        padding: 14px 16px 16px;
        background: #f1f5f9;
    }

    .comp-preview-toolbar {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-end;
        gap: 8px;
        margin-bottom: 12px;
    }

    .comp-preview-toolbar .btn {
        font-weight: 600;
        border-radius: 8px;
        padding: 7px 14px;
    }

    .comp-preview-toolbar .btn-primary {
        background: #2563eb;
        border-color: #2563eb;
    }

    .comp-preview-toolbar .btn-primary:hover,
    .comp-preview-toolbar .btn-primary:focus {
        background: #1d4ed8;
        border-color: #1d4ed8;
    }

    .comp-preview-frame-wrap {
        position: relative;
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        overflow: hidden;
        min-height: 420px;
        box-shadow: inset 0 1px 3px rgba(15, 23, 42, 0.04);
    }

    .comp-preview-modal-dialog--ticket .comp-preview-frame-wrap {
        min-height: 520px;
    }

    .comp-preview-modal-dialog--pdf .comp-preview-frame-wrap {
        min-height: 480px;
    }

    .comp-preview-frame {
        display: block;
        width: 100%;
        height: 68vh;
        min-height: 420px;
        border: 0;
        background: #fff;
    }

    .comp-preview-loading {
        position: absolute;
        inset: 0;
        z-index: 2;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 12px;
        background: rgba(255, 255, 255, 0.92);
        color: #475569;
        font-size: 13px;
        font-weight: 600;
    }

    .comp-preview-loading-spinner {
        width: 34px;
        height: 34px;
        border: 3px solid #cbd5e1;
        border-top-color: #2563eb;
        border-radius: 50%;
        animation: compPreviewSpin 0.75s linear infinite;
    }

    @keyframes compPreviewSpin {
        to {
            transform: rotate(360deg);
        }
    }

    .comp-preview-modal-footer {
        background: #fff;
        border-top: 1px solid #e2e8f0;
        padding: 12px 16px;
        display: flex;
        justify-content: flex-end;
    }

    .comp-preview-btn-cerrar {
        min-width: 120px;
        font-weight: 600;
        border-radius: 8px;
        padding: 8px 16px;
    }

    .comp-preview-btn-cerrar .glyphicon {
        margin-right: 4px;
    }

    @media (max-width: 768px) {
        .comp-preview-modal-dialog--ticket,
        .comp-preview-modal-dialog--pdf {
            max-width: calc(100vw - 16px);
            width: calc(100vw - 16px);
            margin: 10px auto;
        }

        .comp-preview-frame {
            height: 58vh;
            min-height: 320px;
        }

        .comp-preview-toolbar {
            justify-content: flex-end;
        }

        .comp-preview-toolbar .btn {
            width: auto;
        }

        .comp-preview-modal-footer {
            padding: 10px 12px;
        }

        .comp-preview-btn-cerrar {
            width: 100%;
        }
    }

    /* Módulo movimientos de caja */
    .caja-mov-page {
        padding: 0 12px 24px;
    }

    .caja-mov-panel {
        margin-bottom: 12px;
    }

    .caja-mov-panel-head {
        margin-bottom: 12px;
    }

    .caja-mov-panel-head h2 {
        margin: 0;
        font-size: 22px;
        font-weight: 700;
        color: #1e293b;
    }

    .caja-mov-panel-head p {
        margin: 4px 0 0;
        font-size: 13px;
        color: #64748b;
    }

    .caja-mov-page .caja-mov-filters {
        display: flex;
        flex-wrap: wrap;
        gap: 8px 10px;
        align-items: flex-end;
        grid-template-columns: none;
    }

    .caja-mov-page .caja-mov-field {
        flex: 0 0 auto;
        min-width: 0;
    }

    .caja-mov-field--fecha {
        width: 128px;
    }

    .caja-mov-field--vendedor {
        width: 220px;
        max-width: 240px;
    }

    .caja-mov-filters-inline {
        display: flex;
        flex-wrap: wrap;
        gap: 8px 10px;
        align-items: flex-end;
    }

    .caja-mov-field--actions {
        flex: 0 0 auto;
    }

    .caja-mov-page .caja-mov-field label {
        margin-bottom: 4px;
        font-size: 11px;
    }

    .caja-mov-page .caja-mov-field .form-control {
        min-height: 34px;
        padding: 6px 10px;
    }

    .caja-mov-filter-actions {
        gap: 6px;
    }

    .caja-mov-filter-actions .btn {
        min-width: 84px;
        padding: 6px 12px;
        font-size: 12px;
    }

    .caja-mov-secondary-actions {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px;
        margin-top: 10px;
        padding-top: 10px;
        border-top: 1px solid #eef2f7;
    }

    .caja-mov-secondary-actions .btn {
        font-weight: 600;
        border-radius: 8px;
        padding: 6px 12px;
        font-size: 12px;
    }

    .caja-mov-total-row {
        margin-top: 10px;
        margin-bottom: 0;
    }

    .caja-mov-grid-card {
        margin-top: 0;
    }

    .caja-mov-grid-header h3 {
        margin: 0;
        font-size: 16px;
        font-weight: 700;
        color: #1e293b;
    }

    .caja-mov-grid-header p {
        margin: 4px 0 0;
        font-size: 12px;
        color: #64748b;
    }

    .caja-mov-page .k-grid {
        border: 0;
    }

    .caja-mov-page .k-grid-header {
        background: linear-gradient(135deg, #1d4ed8 0%, #1e40af 100%);
    }

    .caja-mov-page .k-grid-header th.k-header {
        border-color: rgba(255, 255, 255, 0.08);
        color: #f8fafc;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.2px;
    }

    .caja-mov-page .k-grid-content tr.caja-mov-row-alt {
        background: #f8fafc;
    }

    .caja-mov-page .k-grid-content tr.caja-mov-row:hover {
        background: #eff6ff;
    }

    .caja-mov-monto {
        font-variant-numeric: tabular-nums;
        font-size: 13px;
        font-weight: 700;
        color: #1e293b;
        white-space: nowrap;
    }

    .caja-mov-monto-symbol {
        color: #1d4ed8;
        font-weight: 700;
        margin-right: 2px;
    }

    .caja-mov-fecha {
        font-size: 12px;
        color: #475569;
        white-space: nowrap;
    }

    .caja-mov-page .k-grid .caja-mov-obs-header {
        text-align: left !important;
    }

    .caja-mov-page .k-grid .caja-mov-obs-cell {
        text-align: left !important;
    }

    .caja-mov-obs-text {
        display: block;
        text-align: left;
        white-space: normal;
        word-break: break-word;
        color: #334155;
        font-size: 13px;
    }

    .caja-mov-badge {
        display: inline-block;
        padding: 3px 10px;
        border-radius: 999px;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        background: #e2e8f0;
        color: #334155;
    }

    .caja-mov-badge--ingreso {
        background: #dcfce7;
        color: #166534;
    }

    .caja-mov-badge--salida {
        background: #fee2e2;
        color: #b91c1c;
    }

    .caja-mov-page .k-grid .caja-mov-action-cell {
        text-align: center !important;
        vertical-align: middle !important;
    }

    .caja-mov-page .k-grid .caja-mov-action-cell .notas-grid-icon-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 32px;
        height: 32px;
        margin: 0 auto;
        padding: 0;
    }

    .caja-mov-page .k-grid .caja-mov-action-cell .glyphicon {
        position: static;
        top: auto;
        line-height: 1;
    }

    /* Modal movimiento de caja */
    .caja-mov-modal-dialog {
        width: 640px;
        max-width: calc(100vw - 24px);
        margin: 30px auto;
    }

    .caja-mov-modal-content {
        border: 0;
        border-radius: 14px;
        overflow: hidden;
        box-shadow: 0 20px 50px rgba(15, 23, 42, 0.2);
    }

    .caja-mov-modal-header {
        background: linear-gradient(135deg, #1d4ed8 0%, #1e40af 100%);
        border: 0;
        padding: 18px 22px;
        color: #fff;
    }

    .caja-mov-modal-header .close {
        color: #fff;
        opacity: 0.85;
        text-shadow: none;
        margin-top: 2px;
    }

    .caja-mov-modal-header .close:hover {
        opacity: 1;
    }

    .caja-mov-modal-header-inner {
        display: flex;
        align-items: center;
        gap: 14px;
        padding-right: 24px;
    }

    .caja-mov-modal-icon {
        width: 44px;
        height: 44px;
        border-radius: 12px;
        background: rgba(255, 255, 255, 0.16);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 18px;
    }

    .caja-mov-modal-header .modal-title {
        margin: 0;
        font-size: 18px;
        font-weight: 700;
        color: #fff;
    }

    .caja-mov-modal-subtitle {
        margin: 2px 0 0;
        font-size: 12px;
        color: rgba(255, 255, 255, 0.85);
    }

    .caja-mov-modal-body {
        padding: 16px 20px 12px;
        background: #f1f5f9;
    }

    .caja-mov-modal-info-bar {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        margin-bottom: 12px;
    }

    .caja-mov-modal-info-item {
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        padding: 10px 12px;
    }

    .caja-mov-modal-info-label {
        display: block;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.3px;
        color: #64748b;
        margin-bottom: 4px;
    }

    .caja-mov-modal-info-item strong {
        display: block;
        font-size: 13px;
        color: #1e293b;
    }

    .caja-mov-modal-section {
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        padding: 14px 16px 16px;
        box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
    }

    .caja-mov-modal-section-title {
        margin: 0 0 12px;
        font-size: 13px;
        font-weight: 700;
        color: #1d4ed8;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .caja-mov-modal-grid {
        display: grid;
        grid-template-columns: 1.2fr 0.8fr 1fr;
        gap: 10px 12px;
        margin-bottom: 10px;
    }

    .caja-mov-modal-field label {
        display: block;
        margin-bottom: 5px;
        font-size: 11px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.2px;
    }

    .caja-mov-modal-field--center label {
        text-align: center;
    }

    .caja-mov-modal-field .form-control {
        border-radius: 8px;
        border-color: #cbd5e1;
        min-height: 34px;
        font-size: 13px;
    }

    .caja-mov-monto-group {
        width: 100%;
    }

    .caja-mov-monto-group .input-group-addon {
        background: #eff6ff;
        border-color: #cbd5e1;
        color: #1d4ed8;
        font-weight: 700;
        font-size: 13px;
        border-radius: 8px 0 0 8px;
        min-width: 42px;
    }

    .caja-mov-monto-group .form-control {
        border-radius: 0 8px 8px 0;
        text-align: right;
        font-variant-numeric: tabular-nums;
        font-weight: 600;
    }

    .caja-mov-modal-field--obs textarea {
        resize: vertical;
        min-height: 72px;
    }

    .caja-mov-modal-footer {
        background: #fff;
        border-top: 1px solid #e2e8f0;
        padding: 12px 20px;
        display: flex;
        justify-content: flex-end;
        gap: 8px;
    }

    .caja-mov-modal-btn-cancel,
    .caja-mov-modal-btn-save {
        min-width: 110px;
        font-weight: 600;
        border-radius: 8px;
        padding: 8px 16px;
    }

    .caja-mov-modal-btn-save .glyphicon {
        margin-right: 4px;
    }

    @media (max-width: 768px) {
        .caja-mov-modal-grid,
        .caja-mov-modal-info-bar {
            grid-template-columns: 1fr;
        }

        .caja-mov-modal-footer {
            flex-direction: column-reverse;
        }

        .caja-mov-modal-btn-cancel,
        .caja-mov-modal-btn-save {
            width: 100%;
        }
    }

    @media (max-width: 768px) {
        .caja-mov-field--fecha,
        .caja-mov-field--vendedor,
        .caja-mov-field--actions {
            width: 100%;
            max-width: 100%;
        }

        .caja-mov-filters-inline {
            width: 100%;
        }

        .caja-mov-filter-actions {
            width: 100%;
        }

        .caja-mov-filter-actions .btn {
            flex: 1;
        }

        .caja-mov-secondary-actions {
            width: 100%;
        }

        .caja-mov-secondary-actions .btn {
            flex: 1 1 auto;
        }
    }

    @media (max-width: 768px) {
        .cajas-field--fecha,
        .cajas-field--vendedor,
        .cajas-field--actions {
            width: 100%;
            max-width: 100%;
        }

        .cajas-filters-inline {
            width: 100%;
        }

        .cajas-filter-actions {
            width: 100%;
        }

        .cajas-filter-actions .btn {
            flex: 1;
        }

        .cajas-secondary-actions {
            width: 100%;
        }

        .cajas-secondary-actions .btn {
            flex: 1 1 auto;
        }
    }

    /* Módulo pagos a proveedores */
    .pagos-page {
        padding-bottom: 28px;
    }

    .pagos-filters {
        grid-template-columns: minmax(220px, 2fr) minmax(140px, 1fr) minmax(180px, 1.2fr) minmax(220px, 1.4fr);
    }

    .pagos-field--actions .comprobantes-filter-actions {
        flex-wrap: nowrap;
    }

    .pagos-grid-card {
        margin-top: 0;
    }

    .pagos-grid-header h3 {
        margin: 0 0 4px;
        font-size: 18px;
        font-weight: 700;
        color: #1e293b;
    }

    .pagos-grid-header p {
        margin: 0;
        font-size: 13px;
        color: #64748b;
    }

    .pagos-list-wrap {
        padding: 0;
    }

    .pagos-loading,
    .pagos-empty {
        padding: 36px 20px;
        text-align: center;
        color: #64748b;
        font-size: 14px;
    }

    .pagos-empty i,
    .pagos-loading i {
        display: block;
        font-size: 28px;
        margin-bottom: 10px;
        color: #94a3b8;
    }

    .pagos-table-scroll {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .pagos-table {
        margin: 0;
        font-size: 13px;
        border-collapse: separate;
        border-spacing: 0;
        min-width: 1100px;
    }

    .pagos-table thead th {
        background: #f8fafc;
        color: #475569;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.3px;
        border-bottom: 2px solid #e2e8f0 !important;
        padding: 12px 10px !important;
        white-space: nowrap;
        vertical-align: middle;
        text-align: center !important;
    }

    .pagos-table tbody td {
        padding: 10px !important;
        vertical-align: middle !important;
        border-top: 1px solid #eef2f7 !important;
    }

    .pagos-col-monto {
        text-align: right !important;
        white-space: nowrap;
        font-variant-numeric: tabular-nums;
    }

    .pagos-col-proveedor {
        max-width: 220px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .pagos-col-historial-pago {
        min-width: 150px;
        max-width: 190px;
    }

    .pagos-historial-cell {
        display: flex;
        flex-direction: column;
        gap: 2px;
        line-height: 1.3;
    }

    .pagos-historial-cell strong {
        font-size: 12px;
        color: #1e293b;
    }

    .pagos-historial-cell span {
        font-size: 11px;
        color: #64748b;
    }

    .pagos-link-historial {
        font-size: 11px;
        font-weight: 700;
        color: #2563eb;
        text-decoration: none !important;
    }

    .pagos-link-historial:hover {
        color: #1d4ed8;
        text-decoration: underline !important;
    }

    .pagos-historial-sin {
        font-size: 11px;
        color: #94a3b8;
        font-style: italic;
    }

    .pagos-col-historial,
    .pagos-col-preview,
    .pagos-col-accion {
        width: 56px;
        text-align: center !important;
    }

    .pagos-btn-preview {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 32px;
        height: 32px;
        padding: 0;
        border: 0;
        border-radius: 8px;
        background: #fef2f2;
        cursor: pointer;
    }

    .pagos-btn-preview img {
        width: 18px;
        height: 18px;
        display: block;
    }

    .pagos-btn-preview:hover {
        background: #fee2e2;
    }

    .pagos-group-row td,
    .pagos-subgroup-row td {
        background: #f1f5f9 !important;
        border-top: 0 !important;
        padding: 8px 12px !important;
    }

    .pagos-group-badge {
        display: inline-block;
        padding: 4px 10px;
        border-radius: 999px;
        background: #dbeafe;
        color: #1d4ed8;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.4px;
    }

    .pagos-subgroup-label {
        font-size: 12px;
        font-weight: 700;
        color: #475569;
    }

    .pagos-row-pendiente {
        background: #fff7ed;
    }

    .pagos-row-pendiente:hover {
        background: #ffedd5;
    }

    .pagos-row-cancelado {
        background: #ecfdf5;
    }

    .pagos-row-cancelado:hover {
        background: #d1fae5;
    }

    .pagos-col-saldo strong {
        color: #b45309;
    }

    .pagos-row-cancelado .pagos-col-saldo strong {
        color: #047857;
    }

    .pagos-btn-historial {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 30px;
        height: 30px;
        border-radius: 8px;
        background: #eff6ff;
        color: #2563eb;
        text-decoration: none !important;
    }

    .pagos-btn-historial:hover {
        background: #dbeafe;
        color: #1d4ed8;
    }

    .pagos-col-accion .btn_regPago {
        border-radius: 8px;
        padding: 5px 9px;
    }

    .pagos-total-row td,
    .pagos-grand-total-row td {
        background: #f8fafc !important;
        border-top: 2px solid #e2e8f0 !important;
        font-size: 12px;
    }

    .pagos-grand-total-row td {
        background: #eef2ff !important;
    }

    /* Modal pagos */
    .pagos-modal-dialog {
        width: 760px;
        max-width: calc(100vw - 24px);
    }

    .pagos-modal-icon {
        background: linear-gradient(135deg, #059669, #047857) !important;
    }

    .pagos-modal-body {
        padding-top: 18px;
    }

    .pagos-modal-form-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
        margin-bottom: 16px;
    }

    .pagos-modal-field label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .pagos-modal-field .form-control {
        border-radius: 8px;
        min-height: 38px;
    }

    .pagos-modal-field--saldo .form-control {
        font-weight: 700;
        color: #b45309;
        background: #fff7ed;
        border-color: #fdba74;
    }

    .pagos-modal-field.has-error .form-control {
        border-color: #ef4444;
    }

    .pagos-modal-actions-row {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 12px;
        padding: 14px 0 18px;
        border-bottom: 1px solid #eef2f7;
    }

    .pagos-btn-guardar {
        background: #059669 !important;
        border-color: #047857 !important;
    }

    .pagos-btn-guardar:hover,
    .pagos-btn-guardar:focus {
        background: #047857 !important;
        border-color: #065f46 !important;
    }

    .pagos-modal-user {
        margin-left: auto;
        font-size: 12px;
        color: #64748b;
    }

    .pagos-modal-history h5 {
        margin: 16px 0 10px;
        font-size: 13px;
        font-weight: 700;
        color: #334155;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .pagos-modal-table-wrap {
        overflow-x: auto;
    }

    .pagos-modal-table {
        margin: 0;
        font-size: 13px;
    }

    .pagos-modal-table thead th {
        background: #f8fafc;
        font-size: 11px;
        text-transform: uppercase;
        color: #64748b;
        border-bottom: 2px solid #e2e8f0 !important;
        text-align: center !important;
    }

    .pagos-modal-empty {
        padding: 18px;
        text-align: center;
        color: #64748b;
        background: #f8fafc;
        border-radius: 8px;
        font-size: 13px;
    }

    .pagos-modal-print-panel {
        margin: 16px 0 0;
        padding: 16px;
        border: 1px solid #dbeafe;
        border-radius: 12px;
        background: linear-gradient(180deg, #f8fafc 0%, #eff6ff 100%);
    }

    .pagos-modal-print-head h5 {
        margin: 0 0 4px;
        font-size: 13px;
        font-weight: 700;
        color: #1e293b;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .pagos-modal-print-head p {
        margin: 0 0 12px;
        font-size: 12px;
        color: #64748b;
    }

    .pagos-modal-print-buttons,
    .pagos-perfil-print-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }

    .pagos-print-btn {
        display: inline-flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        gap: 2px;
        min-width: 140px;
        padding: 12px 14px;
        border: 1px solid transparent;
        border-radius: 10px;
        cursor: pointer;
        text-align: left;
        transition: transform 0.15s ease, box-shadow 0.15s ease;
    }

    .pagos-print-btn i {
        font-size: 16px;
        margin-bottom: 2px;
    }

    .pagos-print-btn span {
        font-size: 13px;
        font-weight: 700;
        line-height: 1.2;
    }

    .pagos-print-btn small {
        font-size: 10px;
        font-weight: 600;
        opacity: 0.85;
    }

    .pagos-print-btn:hover {
        transform: translateY(-1px);
        box-shadow: 0 8px 18px rgba(15, 23, 42, 0.12);
    }

    .pagos-print-btn--pdf {
        background: #fff;
        border-color: #fecaca;
        color: #b91c1c;
    }

    .pagos-print-btn--pdf:hover {
        background: #fef2f2;
    }

    .pagos-print-btn--ticket {
        background: #fff;
        border-color: #bbf7d0;
        color: #047857;
    }

    .pagos-print-btn--ticket:hover {
        background: #ecfdf5;
    }

    .pagos-modal-footer {
        border-top: 1px solid #eef2f7;
    }

    /* Popup historial pagos */
    body .pagos-perfil-popup {
        max-width: 920px;
        margin: 20px auto 28px;
        padding: 0 18px 24px;
    }

    .pagos-perfil-popup-head {
        display: flex;
        align-items: flex-start;
        gap: 14px;
        padding: 18px 20px;
        margin-bottom: 16px;
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 14px;
        box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
    }

    .pagos-perfil-popup-icon {
        width: 52px;
        height: 52px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, #059669, #047857);
        color: #fff;
        font-size: 22px;
        flex-shrink: 0;
    }

    .pagos-perfil-popup-head h1 {
        margin: 0 0 6px;
        font-size: 24px;
        font-weight: 700;
        color: #0f172a;
    }

    .pagos-perfil-popup-head p {
        margin: 0 0 4px;
        font-size: 13px;
        color: #64748b;
    }

    .pagos-perfil-doc {
        font-size: 14px !important;
    }

    .pagos-perfil-stats {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 12px;
        margin-bottom: 16px;
    }

    .pagos-perfil-stat {
        padding: 14px 16px;
        border-radius: 12px;
        background: #fff;
        border: 1px solid #e2e8f0;
    }

    .pagos-perfil-stat-label {
        display: block;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.3px;
        color: #64748b;
        margin-bottom: 6px;
    }

    .pagos-perfil-stat strong {
        font-size: 20px;
        color: #0f172a;
    }

    .pagos-perfil-stat--ok {
        border-color: #bbf7d0;
        background: #ecfdf5;
    }

    .pagos-perfil-stat--ok strong {
        color: #047857;
    }

    .pagos-perfil-stat--pending {
        border-color: #fed7aa;
        background: #fff7ed;
    }

    .pagos-perfil-stat--pending strong {
        color: #c2410c;
    }

    .pagos-perfil-print-panel {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        padding: 16px 18px;
        margin-bottom: 16px;
        border-radius: 12px;
        border: 1px solid #dbeafe;
        background: linear-gradient(180deg, #f8fafc 0%, #eff6ff 100%);
    }

    .pagos-perfil-print-panel h2 {
        margin: 0 0 4px;
        font-size: 15px;
        font-weight: 700;
        color: #1e293b;
    }

    .pagos-perfil-print-panel p {
        margin: 0;
        font-size: 12px;
        color: #64748b;
    }

    .pagos-perfil-table-card {
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 14px;
        overflow: hidden;
        box-shadow: 0 4px 16px rgba(15, 23, 42, 0.05);
    }

    .pagos-perfil-table-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        padding: 14px 16px;
        background: #f8fafc;
        border-bottom: 1px solid #e2e8f0;
    }

    .pagos-perfil-table-head h3 {
        margin: 0;
        font-size: 15px;
        font-weight: 700;
        color: #1e293b;
    }

    .pagos-perfil-table-head span {
        font-size: 12px;
        color: #64748b;
        font-weight: 600;
    }

    .pagos-perfil-popup-footer {
        margin-top: 18px;
        text-align: right;
    }

    .pagos-historial-modal-dialog {
        width: 920px;
        max-width: calc(100vw - 24px);
        margin: 24px auto;
    }

    .pagos-historial-modal-content {
        border: 0;
        border-radius: 16px;
        overflow: hidden;
        box-shadow: 0 24px 48px rgba(15, 23, 42, 0.18);
    }

    .pagos-historial-modal-header {
        border-bottom: 1px solid #e2e8f0;
        padding: 16px 18px 12px;
        background: #fff;
    }

    .pagos-historial-modal-header .close {
        position: absolute;
        right: 16px;
        top: 14px;
        z-index: 2;
    }

    .pagos-perfil-popup-head--modal {
        margin-bottom: 0;
        padding: 0;
        border: 0;
        box-shadow: none;
        background: transparent;
    }

    .pagos-perfil-popup-head--modal h4.modal-title {
        margin: 0 0 6px;
        font-size: 22px;
        font-weight: 700;
        color: #0f172a;
    }

    .pagos-historial-modal-body {
        padding: 16px 18px 18px;
        background: #f8fafc;
        max-height: calc(100vh - 220px);
        overflow-y: auto;
    }

    .pagos-historial-modal-footer {
        border-top: 1px solid #e2e8f0;
        background: #fff;
        padding: 12px 18px;
    }

    .pagos-modal-loading {
        padding: 48px 20px;
        text-align: center;
        color: #64748b;
        font-size: 14px;
    }

    .pagos-modal-loading i {
        display: block;
        font-size: 24px;
        margin-bottom: 10px;
        color: #94a3b8;
    }

    .pagos-perfil-table {
        min-width: 0;
    }

    @media (max-width: 992px) {
        .pagos-filters {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .pagos-field--actions {
            grid-column: span 2;
        }

        .pagos-perfil-stats {
            grid-template-columns: 1fr;
        }
    }

    @media (max-width: 768px) {
        .pagos-filters {
            grid-template-columns: 1fr;
        }

        .pagos-field--actions {
            grid-column: span 1;
        }

        .pagos-modal-form-grid {
            grid-template-columns: 1fr;
        }

        .pagos-modal-user {
            width: 100%;
            margin-left: 0;
        }

        .pagos-perfil-print-panel,
        .pagos-modal-print-panel {
            flex-direction: column;
            align-items: stretch;
        }

        .pagos-print-btn {
            width: 100%;
        }
    }

    /* Módulo series y numeración (serNums) */
    .sernums-page {
        padding: 0 12px 24px;
        overflow: visible;
    }

    .sernums-panel {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
        padding: 18px 20px;
        margin-bottom: 14px;
        overflow: visible;
    }

    .sernums-panel-head {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        margin-bottom: 16px;
    }

    .sernums-panel-head h2 {
        margin: 0;
        font-size: 22px;
        font-weight: 700;
        color: #1e293b;
    }

    .sernums-panel-head p {
        margin: 4px 0 0;
        font-size: 13px;
        color: #64748b;
    }

    .sernums-filters {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        align-items: flex-end;
    }

    .sernums-field--search {
        flex: 1 1 360px;
        min-width: 260px;
        max-width: 100%;
    }

    .sernums-field label,
    .sernums-actions-label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .sernums-field .form-control {
        border-radius: 8px;
        border-color: #cbd5e1;
        min-height: 36px;
        font-size: 13px;
    }

    .sernums-filter-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .sernums-filter-actions .btn {
        min-width: 100px;
        font-weight: 600;
        border-radius: 8px;
        padding: 8px 14px;
        font-size: 13px;
    }

    .sernums-secondary-actions {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px;
        margin-top: 4px;
        margin-bottom: 14px;
        padding-top: 12px;
        border-top: 1px solid #eef2f7;
    }

    .sernums-secondary-actions .btn {
        font-weight: 600;
        border-radius: 8px;
        padding: 7px 14px;
        font-size: 13px;
    }

    .sernums-total-row {
        margin-top: 2px;
    }

    .sernums-total-badge {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 8px 12px;
        border-radius: 999px;
        background: #eef2ff;
        border: 1px solid #c7d2fe;
        color: #3730a3;
        font-size: 12px;
        font-weight: 600;
    }

    .sernums-total-badge strong {
        color: #312e81;
        font-size: 13px;
    }

    .sernums-grid-card {
        overflow: visible;
    }

    .sernums-grid-header {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        padding: 14px 18px;
        border-bottom: 1px solid #eef2f7;
        background: linear-gradient(180deg, #eef2ff 0%, #fff 100%);
    }

    .sernums-grid-header h3 {
        margin: 0;
        font-size: 16px;
        font-weight: 700;
        color: #3730a3;
    }

    .sernums-grid-header p {
        margin: 2px 0 0;
        font-size: 12px;
        color: #64748b;
    }

    .sernums-page .k-grid {
        border: 0;
    }

    .sernums-page .k-grid-header {
        background: linear-gradient(135deg, #312e81 0%, #4338ca 100%);
    }

    .sernums-page .k-grid-header th.k-header {
        border-color: rgba(255, 255, 255, 0.08);
        color: #f8fafc;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        text-align: center !important;
    }

    .sernums-row-alt {
        background: #f5f3ff !important;
    }

    .sernums-serie-badge {
        display: inline-block;
        padding: 4px 10px;
        border-radius: 999px;
        background: #eef2ff;
        border: 1px solid #c7d2fe;
        color: #3730a3;
        font-weight: 700;
        font-size: 12px;
        letter-spacing: 0.4px;
    }

    .sernums-numero-cell {
        font-variant-numeric: tabular-nums;
        font-weight: 700;
        color: #0f172a;
    }

    .sernums-modal-dialog {
        width: 640px;
        max-width: calc(100vw - 24px);
    }

    .sernums-modal-content {
        border: 0;
        border-radius: 14px;
        overflow: hidden;
        box-shadow: 0 24px 48px rgba(15, 23, 42, 0.18);
    }

    .sernums-modal-header {
        border-bottom: 1px solid #e2e8f0;
        padding: 16px 18px 12px;
        background: #fff;
    }

    .sernums-modal-header .close {
        position: absolute;
        right: 16px;
        top: 14px;
        z-index: 2;
    }

    .sernums-modal-header-inner {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        padding-right: 28px;
    }

    .sernums-modal-icon {
        width: 42px;
        height: 42px;
        border-radius: 10px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, #4f46e5, #4338ca);
        color: #fff;
        font-size: 18px;
        flex-shrink: 0;
    }

    .sernums-modal-header .modal-title {
        margin: 0 0 4px;
        font-size: 20px;
        font-weight: 700;
        color: #0f172a;
    }

    .sernums-modal-subtitle {
        margin: 0;
        font-size: 12px;
        color: #64748b;
    }

    .sernums-modal-body {
        padding: 16px 18px 8px;
        background: #f8fafc;
    }

    .sernums-modal-section {
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        padding: 14px;
        margin-bottom: 12px;
    }

    .sernums-modal-section-title {
        margin: 0 0 12px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .sernums-modal-row {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .sernums-modal-field label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
    }

    .sernums-modal-field .form-control {
        border-radius: 8px;
        min-height: 36px;
    }

    .sernums-modal-field.has-error .form-control {
        border-color: #ef4444;
        box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.12);
    }

    .sernums-required {
        color: #ef4444;
    }

    .sernums-modal-note {
        margin: 0 0 4px;
        font-size: 11px;
        color: #64748b;
    }

    .sernums-modal-footer {
        border-top: 1px solid #e2e8f0;
        background: #fff;
        padding: 12px 18px;
        display: flex;
        justify-content: flex-end;
        gap: 8px;
    }

    .sernums-modal-footer .btn {
        min-width: 120px;
        font-weight: 600;
        border-radius: 8px;
    }

    .sernums-btn-save {
        background: #4f46e5 !important;
        border-color: #4338ca !important;
    }

    .sernums-btn-save:hover,
    .sernums-btn-save:focus {
        background: #4338ca !important;
        border-color: #3730a3 !important;
    }

    @media (max-width: 768px) {
        .sernums-filters {
            flex-direction: column;
            align-items: stretch;
        }

        .sernums-modal-row {
            grid-template-columns: 1fr;
        }

        .sernums-modal-footer {
            flex-direction: column;
        }

        .sernums-modal-footer .btn {
            width: 100%;
        }
    }

    /* Módulo empresas */
    .empresas-page {
        padding: 0 12px 24px;
        overflow: visible;
    }

    .empresas-panel {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
        padding: 18px 20px;
        margin-bottom: 14px;
    }

    .empresas-panel-head {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
    }

    .empresas-panel-head h2 {
        margin: 0;
        font-size: 22px;
        font-weight: 700;
        color: #1e293b;
    }

    .empresas-panel-head p {
        margin: 4px 0 0;
        font-size: 13px;
        color: #64748b;
    }

    .empresas-status-card {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: 8px;
        padding: 12px 14px;
        border-radius: 10px;
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        min-width: 180px;
    }

    .empresas-status-label {
        font-size: 11px;
        font-weight: 700;
        color: #64748b;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .empresas-switch-wrap {
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .empresas-switch {
        position: relative;
        display: inline-block;
        width: 46px;
        height: 26px;
        margin: 0;
    }

    .empresas-switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

    .empresas-switch-slider {
        position: absolute;
        cursor: pointer;
        inset: 0;
        background: #cbd5e1;
        border-radius: 999px;
        transition: background 0.2s ease;
    }

    .empresas-switch-slider:before {
        position: absolute;
        content: "";
        height: 20px;
        width: 20px;
        left: 3px;
        bottom: 3px;
        background: #fff;
        border-radius: 50%;
        transition: transform 0.2s ease;
        box-shadow: 0 1px 3px rgba(15, 23, 42, 0.2);
    }

    .empresas-switch input:checked + .empresas-switch-slider {
        background: #059669;
    }

    .empresas-switch input:checked + .empresas-switch-slider:before {
        transform: translateX(20px);
    }

    .empresas-status-text {
        font-size: 13px;
        font-weight: 700;
        color: #64748b;
    }

    .empresas-status-text.is-active {
        color: #047857;
    }

    .empresas-profile-grid {
        display: grid;
        grid-template-columns: 1.4fr 1fr 1fr;
        gap: 14px;
        margin-bottom: 14px;
    }

    .empresas-profile-card,
    .empresas-detail-card,
    .empresas-actions-card {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.05);
        padding: 18px;
    }

    .empresas-profile-card--main {
        display: flex;
        align-items: center;
        gap: 16px;
    }

    .empresas-profile-logo img,
    .empresas-profile-logo-placeholder {
        width: 88px;
        height: 88px;
        border-radius: 14px;
        object-fit: contain;
        background: #f8fafc;
        border: 1px solid #e2e8f0;
    }

    .empresas-profile-logo-placeholder {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: #94a3b8;
        font-size: 28px;
    }

    .empresas-profile-info h3 {
        margin: 0 0 6px;
        font-size: 20px;
        font-weight: 700;
        color: #0f172a;
    }

    .empresas-profile-commercial {
        margin: 0 0 10px;
        font-size: 13px;
        color: #64748b;
    }

    .empresas-profile-meta {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .empresas-meta-badge {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 5px 10px;
        border-radius: 999px;
        background: #ecfdf5;
        border: 1px solid #bbf7d0;
        color: #047857;
        font-size: 12px;
        font-weight: 600;
    }

    .empresas-detail-card h4,
    .empresas-actions-card h4,
    .empresas-logo-preview-card h3,
    .empresas-logo-upload-card h3,
    .empresas-media-upload-card h3,
    .empresas-media-preview-card h3,
    .empresas-form-section-title {
        margin: 0 0 10px;
        font-size: 14px;
        font-weight: 700;
        color: #0f172a;
    }

    .empresas-detail-card p {
        margin: 0;
        font-size: 13px;
        color: #334155;
        line-height: 1.5;
    }

    .empresas-detail-sub {
        margin-top: 8px !important;
        color: #64748b !important;
        font-size: 12px !important;
    }

    .empresas-contact-list {
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .empresas-contact-list li {
        display: flex;
        justify-content: space-between;
        gap: 12px;
        padding: 8px 0;
        border-bottom: 1px solid #eef2f7;
        font-size: 13px;
    }

    .empresas-contact-list li:last-child {
        border-bottom: 0;
    }

    .empresas-contact-list span {
        color: #64748b;
    }

    .empresas-actions-card {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
    }

    .empresas-actions-card p {
        margin: 4px 0 0;
        font-size: 12px;
        color: #64748b;
    }

    .empresas-actions-buttons {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .empresas-btn-action,
    .empresas-btn-back,
    .empresas-btn-save {
        font-weight: 600;
        border-radius: 8px;
    }

    .empresas-btn-save {
        background: #059669 !important;
        border-color: #047857 !important;
    }

    .empresas-btn-save:hover,
    .empresas-btn-save:focus {
        background: #047857 !important;
        border-color: #065f46 !important;
    }

    .empresas-form-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
    }

    .empresas-form-card {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        padding: 16px 18px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.05);
    }

    .empresas-form-card--full {
        grid-column: 1 / -1;
    }

    .empresas-form-section-title {
        padding-bottom: 10px;
        margin-bottom: 14px !important;
        border-bottom: 1px solid #eef2f7;
        text-transform: uppercase;
        letter-spacing: 0.3px;
        font-size: 12px !important;
        color: #475569 !important;
    }

    .empresas-form-row {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
        margin-bottom: 12px;
    }

    .empresas-form-row:last-child {
        margin-bottom: 0;
    }

    .empresas-form-row--3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .empresas-form-row--single {
        grid-template-columns: minmax(0, 1fr);
    }

    .empresas-form-subsection-title {
        margin: 16px 0 12px;
        padding-top: 14px;
        border-top: 1px solid #eef2f7;
        font-size: 12px !important;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.3px;
        color: #475569 !important;
    }

    .empresas-bancos-card .empresas-form-section-title {
        margin-bottom: 6px !important;
    }

    .empresas-bancos-intro {
        margin: 0 0 16px;
    }

    .empresas-bancos-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
    }

    .empresas-banco-block {
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        padding: 14px 16px;
    }

    .empresas-banco-block-title {
        margin: 0 0 12px;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.35px;
        color: #64748b;
    }

    .empresas-banco-block .empresas-form-row {
        margin-bottom: 10px;
    }

    .empresas-banco-block .empresas-form-row:last-child {
        margin-bottom: 0;
    }

    .empresas-banco-block--detraccion {
        grid-column: 1 / -1;
        max-width: calc(50% - 7px);
    }

    .empresas-form-row--detraccion {
        grid-template-columns: minmax(0, 1fr);
        max-width: 50%;
    }

    .empresas-input-detraccion {
        font-family: Consolas, "Courier New", ui-monospace, monospace;
        letter-spacing: 0.03em;
    }

    .empresas-form-field label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
    }

    .empresas-form-field .form-control {
        border-radius: 8px;
        min-height: 36px;
    }

    .empresas-field-help {
        margin: 6px 0 0;
        font-size: 11px;
        color: #64748b;
    }

    /* Legacy numero_de_cuenta: oculto en UI; sigue en formulario para lectura/guardado */
    .empresas-legacy-cuenta-historico {
        display: none !important;
    }

    /* Información adicional (pie de página + histórico): oculto en UI; campos siguen en POST */
    .empresas-informacion-adicional-legacy {
        display: none !important;
    }

    .empresas-form-field--full {
        grid-column: 1 / -1;
    }

    .empresas-required {
        color: #ef4444;
    }

    .empresas-ruc-wrap {
        display: flex;
        gap: 8px;
    }

    .empresas-ruc-wrap .form-control {
        flex: 1;
    }

    .empresas-btn-sunat {
        white-space: nowrap;
        border-radius: 8px;
        font-weight: 600;
    }

    .empresas-form-actions {
        display: flex;
        justify-content: flex-end;
        gap: 8px;
        margin-top: 14px;
        padding: 14px 18px;
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
    }

    .empresas-modalidad-card .empresas-field-help {
        margin-top: -5px;
        margin-bottom: 13px;
    }

    .empresas-modalidad-options {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px;
    }

    .empresas-modalidad-option {
        display: grid;
        grid-template-columns: 23px minmax(0, 1fr);
        column-gap: 8px;
        align-items: center;
        min-height: 82px;
        margin: 0;
        padding: 12px;
        border: 1px solid #dbe4ef;
        border-radius: 10px;
        color: #405670;
        background: #f8fafc;
        cursor: pointer;
        transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
    }

    .empresas-modalidad-option:hover,
    .empresas-modalidad-option.is-selected {
        border-color: #2f70e7;
        background: #f3f7ff;
        box-shadow: 0 3px 10px rgba(47, 112, 231, .12);
    }

    .empresas-modalidad-option input {
        grid-row: 1 / 3;
        margin: 0;
    }

    .empresas-modalidad-option .glyphicon {
        color: #2f70e7;
        font-size: 17px;
    }

    .empresas-modalidad-option strong,
    .empresas-modalidad-option small {
        grid-column: 2;
    }

    .empresas-modalidad-option strong {
        font-size: 12px;
    }

    .empresas-modalidad-option small {
        margin-top: 2px;
        color: #708198;
        font-size: 10px;
        line-height: 1.35;
    }

    .empresas-modalidad-warning {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        margin-top: 12px;
        padding: 10px 12px;
        border: 1px solid #f6c96a;
        border-radius: 9px;
        color: #8a5700;
        background: #fff8df;
        font-size: 11px;
        line-height: 1.45;
    }

    .empresas-modalidad-warning[hidden] {
        display: none;
    }

    /* Módulo Servicios — base visual; no representa un Kardex físico. */
    .servicios-page {
        max-width: 1180px;
        margin: 0 auto;
        padding: 0 12px 24px;
    }

    .servicios-panel,
    .servicios-next-card,
    .servicios-card {
        border: 1px solid #dfe7f1;
        border-radius: 12px;
        background: #fff;
        box-shadow: 0 4px 18px rgba(15, 23, 42, .05);
    }

    .servicios-panel {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        margin-bottom: 14px;
        padding: 18px 20px;
    }

    .servicios-kicker {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        color: #64748b;
        font-size: 10px;
        font-weight: 800;
        letter-spacing: .055em;
    }

    .servicios-panel h2 {
        margin: 5px 0 4px;
        color: #15345b;
        font-size: 23px;
        font-weight: 700;
    }

    .servicios-panel p,
    .servicios-card p,
    .servicios-next-card p {
        margin: 0;
        color: #64748b;
        font-size: 12px;
        line-height: 1.5;
    }

    .servicios-history-link {
        flex: 0 0 auto;
        border-radius: 8px;
        font-weight: 600;
    }

    .servicios-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 14px;
    }

    .servicios-card,
    .servicios-next-card {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        padding: 17px;
    }

    .servicios-card--catalogo {
        border-color: #b9d1ff;
        background: #f6f9ff;
    }

    .servicios-card h3,
    .servicios-next-card h3 {
        margin: 1px 0 7px;
        color: #294a70;
        font-size: 13px;
        font-weight: 700;
    }

    .servicios-card strong {
        display: block;
        margin-bottom: 4px;
        color: #246bfd;
        font-size: 25px;
        line-height: 1;
    }

    .servicios-card-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        width: 34px;
        height: 34px;
        border-radius: 9px;
        color: #246bfd;
        background: #eaf2ff;
        font-size: 16px;
    }

    .servicios-next-card {
        margin-top: 14px;
    }

    .servicios-next-card--history {
        max-width: 720px;
    }

    .servicios-muted {
        margin-top: 8px !important;
        color: #94a3b8 !important;
    }

    .empresas-logo-layout,
    .empresas-media-layout {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 14px;
    }

    .empresas-logo-preview-card,
    .empresas-logo-upload-card,
    .empresas-media-upload-card,
    .empresas-media-preview-card {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        padding: 18px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.05);
    }

    .empresas-logo-preview-wrap,
    .empresas-media-preview-wrap {
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 220px;
        padding: 20px;
        border-radius: 12px;
        background: #f8fafc;
        border: 1px dashed #cbd5e1;
    }

    .empresas-logo-preview-wrap img,
    .empresas-media-preview-wrap img {
        max-width: 100%;
        max-height: 220px;
        object-fit: contain;
    }

    .empresas-logo-empty {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 8px;
        color: #94a3b8;
        text-align: center;
    }

    .empresas-logo-empty .glyphicon {
        font-size: 34px;
    }

    .empresas-logo-filename,
    .empresas-media-filename,
    .empresas-logo-upload-help {
        margin: 10px 0 0;
        font-size: 12px;
        color: #64748b;
    }

    .empresas-logo-upload-actions {
        margin-top: 14px;
    }

    .empresas-page--standalone {
        max-width: 980px;
        margin: 0 auto;
    }

    @media (max-width: 992px) {
        .empresas-profile-grid,
        .empresas-form-grid,
        .empresas-logo-layout,
        .empresas-media-layout {
            grid-template-columns: 1fr;
        }

        .empresas-profile-card--main {
            flex-direction: column;
            align-items: flex-start;
        }

        .empresas-form-row,
        .empresas-form-row--3,
        .empresas-form-row--detraccion,
        .empresas-form-row--single {
            grid-template-columns: 1fr;
            max-width: none;
        }

        .empresas-bancos-grid {
            grid-template-columns: 1fr;
        }

        .empresas-banco-block--detraccion {
            max-width: none;
        }

        .empresas-status-card {
            align-items: flex-start;
            width: 100%;
        }

        .empresas-modalidad-options {
            grid-template-columns: 1fr;
        }

        .servicios-grid {
            grid-template-columns: 1fr;
        }
    }

    @media (max-width: 768px) {
        .empresas-actions-card,
        .empresas-form-actions {
            flex-direction: column;
            align-items: stretch;
        }

        .empresas-actions-buttons,
        .empresas-form-actions .btn {
            width: 100%;
        }

        .empresas-ruc-wrap {
            flex-direction: column;
        }

        .servicios-panel {
            align-items: stretch;
            flex-direction: column;
        }

        .servicios-history-link {
            width: 100%;
        }
    }

    /* Módulo perfiles */
    .perfiles-page {
        padding: 0 12px 24px;
        overflow: visible;
    }

    .perfiles-panel {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
        padding: 18px 20px;
        margin-bottom: 14px;
        overflow: visible;
    }

    .perfiles-panel-head {
        margin-bottom: 16px;
    }

    .perfiles-panel-head h2 {
        margin: 0;
        font-size: 22px;
        font-weight: 700;
        color: #1e293b;
    }

    .perfiles-panel-head p {
        margin: 4px 0 0;
        font-size: 13px;
        color: #64748b;
    }

    .perfiles-filters {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        align-items: flex-end;
    }

    .perfiles-field--search {
        flex: 1 1 360px;
        min-width: 260px;
    }

    .perfiles-field label,
    .perfiles-actions-label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .perfiles-field .form-control {
        border-radius: 8px;
        border-color: #cbd5e1;
        min-height: 36px;
        font-size: 13px;
    }

    .perfiles-filter-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .perfiles-filter-actions .btn {
        min-width: 100px;
        font-weight: 600;
        border-radius: 8px;
        padding: 8px 14px;
        font-size: 13px;
    }

    .perfiles-secondary-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 4px;
        margin-bottom: 14px;
        padding-top: 12px;
        border-top: 1px solid #eef2f7;
    }

    .perfiles-secondary-actions .btn {
        font-weight: 600;
        border-radius: 8px;
        padding: 7px 14px;
        font-size: 13px;
    }

    .perfiles-total-badge {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 8px 12px;
        border-radius: 999px;
        background: #ecfeff;
        border: 1px solid #a5f3fc;
        color: #0e7490;
        font-size: 12px;
        font-weight: 600;
    }

    .perfiles-total-badge strong {
        color: #155e75;
        font-size: 13px;
    }

    .perfiles-grid-card {
        overflow: visible;
    }

    .perfiles-grid-header {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        padding: 14px 18px;
        border-bottom: 1px solid #eef2f7;
        background: linear-gradient(180deg, #ecfeff 0%, #fff 100%);
    }

    .perfiles-grid-header h3 {
        margin: 0;
        font-size: 16px;
        font-weight: 700;
        color: #0e7490;
    }

    .perfiles-grid-header p {
        margin: 2px 0 0;
        font-size: 12px;
        color: #64748b;
    }

    .perfiles-page .k-grid {
        border: 0;
    }

    .perfiles-page .k-grid-header {
        background: linear-gradient(135deg, #0f766e 0%, #115e59 100%);
    }

    .perfiles-page .k-grid-header th.k-header {
        border-color: rgba(255, 255, 255, 0.08);
        color: #f8fafc;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        text-align: center !important;
    }

    .perfiles-row-alt {
        background: #f0fdfa !important;
    }

    .perfiles-name-cell {
        font-weight: 600;
        color: #0f172a;
    }

    .perfiles-modal-dialog {
        width: 860px;
        max-width: calc(100vw - 24px);
    }

    .perfiles-modal-content {
        border: 0;
        border-radius: 14px;
        overflow: hidden;
        box-shadow: 0 24px 48px rgba(15, 23, 42, 0.18);
    }

    .perfiles-modal-header {
        border-bottom: 1px solid #e2e8f0;
        padding: 16px 18px 12px;
        background: #fff;
    }

    .perfiles-modal-header .close {
        position: absolute;
        right: 16px;
        top: 14px;
        z-index: 2;
    }

    .perfiles-modal-header-inner {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        padding-right: 28px;
    }

    .perfiles-modal-icon {
        width: 42px;
        height: 42px;
        border-radius: 10px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, #0d9488, #0f766e);
        color: #fff;
        font-size: 18px;
        flex-shrink: 0;
    }

    .perfiles-modal-header .modal-title {
        margin: 0 0 4px;
        font-size: 20px;
        font-weight: 700;
        color: #0f172a;
    }

    .perfiles-modal-subtitle {
        margin: 0;
        font-size: 12px;
        color: #64748b;
    }

    .perfiles-modal-body {
        padding: 16px 18px;
        background: #f8fafc;
    }

    .perfiles-modal-field {
        margin-bottom: 14px;
    }

    .perfiles-modal-field label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
    }

    .perfiles-modal-field .form-control {
        border-radius: 8px;
        min-height: 36px;
    }

    .perfiles-modal-field.has-error .form-control {
        border-color: #ef4444;
        box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.12);
    }

    .perfiles-required {
        color: #ef4444;
    }

    .perfiles-field-help {
        margin: 6px 0 0;
        font-size: 11px;
        color: #64748b;
    }

    .perfiles-modulos-head {
        margin-bottom: 10px;
    }

    .perfiles-modulos-head h5 {
        margin: 0 0 4px;
        font-size: 13px;
        font-weight: 700;
        color: #0f172a;
    }

    .perfiles-modulos-head p {
        margin: 0;
        font-size: 12px;
        color: #64748b;
    }

    .perfiles-modulos-scroll {
        max-height: 420px;
        overflow: auto;
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        background: #fff;
        padding: 12px;
    }

    .perfiles-modulos-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .perfiles-mod-group {
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        overflow: hidden;
        background: #fff;
    }

    .perfiles-mod-group-head {
        padding: 10px 12px;
        background: linear-gradient(180deg, #f0fdfa 0%, #fff 100%);
        border-bottom: 1px solid #e2e8f0;
    }

    .perfiles-mod-parent-label {
        display: flex;
        align-items: center;
        gap: 8px;
        margin: 0;
        cursor: pointer;
        font-size: 12px;
        color: #0f766e;
    }

    .perfiles-mod-list {
        list-style: none;
        margin: 0;
        padding: 8px 10px;
    }

    .perfiles-mod-item {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        margin: 0;
        padding: 6px 4px;
        cursor: pointer;
        font-size: 13px;
        color: #334155;
        font-weight: 400;
    }

    .perfiles-mod-item input {
        margin: 2px 0 0;
    }

    .perfiles-mod-item:hover {
        background: #f8fafc;
        border-radius: 6px;
    }

    .perfiles-modal-footer {
        border-top: 1px solid #e2e8f0;
        background: #fff;
        padding: 12px 18px;
        display: flex;
        justify-content: flex-end;
        gap: 8px;
    }

    .perfiles-modal-footer .btn {
        min-width: 120px;
        font-weight: 600;
        border-radius: 8px;
    }

    .perfiles-btn-save {
        background: #0d9488 !important;
        border-color: #0f766e !important;
    }

    .perfiles-btn-save:hover,
    .perfiles-btn-save:focus {
        background: #0f766e !important;
        border-color: #115e59 !important;
    }

    @media (max-width: 992px) {
        .perfiles-modulos-grid {
            grid-template-columns: 1fr;
        }
    }

    @media (max-width: 768px) {
        .perfiles-filters {
            flex-direction: column;
            align-items: stretch;
        }

        .perfiles-modal-footer {
            flex-direction: column;
        }

        .perfiles-modal-footer .btn {
            width: 100%;
        }
    }

    /* Módulo empleados / usuarios */
    .empleados-page {
        padding: 0 12px 24px;
        overflow: visible;
    }

    .empleados-panel {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
        padding: 18px 20px;
        margin-bottom: 14px;
        overflow: visible;
    }

    .empleados-panel-head {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 16px;
    }

    .empleados-panel-head h2 {
        margin: 0;
        font-size: 22px;
        font-weight: 700;
        color: #1e293b;
    }

    .empleados-panel-head p {
        margin: 4px 0 0;
        font-size: 13px;
        color: #64748b;
    }

    .empleados-filters {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        align-items: flex-end;
    }

    .empleados-field--search {
        flex: 1 1 360px;
        min-width: 260px;
    }

    .empleados-field label,
    .empleados-actions-label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .empleados-field .form-control {
        border-radius: 8px;
        border-color: #cbd5e1;
        min-height: 36px;
        font-size: 13px;
    }

    .empleados-filter-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .empleados-filter-actions .btn,
    .empleados-secondary-actions .btn,
    .empleados-btn-back {
        font-weight: 600;
        border-radius: 8px;
    }

    .empleados-secondary-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 4px;
        margin-bottom: 14px;
        padding-top: 12px;
        border-top: 1px solid #eef2f7;
    }

    .empleados-total-badge {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 8px 12px;
        border-radius: 999px;
        background: #eff6ff;
        border: 1px solid #bfdbfe;
        color: #1d4ed8;
        font-size: 12px;
        font-weight: 600;
    }

    .empleados-total-badge strong {
        color: #1e3a8a;
        font-size: 13px;
    }

    .empleados-total-sep {
        color: #93c5fd;
    }

    .empleados-grid-card {
        overflow: visible;
    }

    .empleados-grid-header {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        padding: 14px 18px;
        border-bottom: 1px solid #eef2f7;
        background: linear-gradient(180deg, #eff6ff 0%, #fff 100%);
    }

    .empleados-grid-header h3 {
        margin: 0;
        font-size: 16px;
        font-weight: 700;
        color: #1d4ed8;
    }

    .empleados-grid-header p {
        margin: 2px 0 0;
        font-size: 12px;
        color: #64748b;
    }

    .empleados-table-scroll {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .empleados-table {
        margin: 0;
        font-size: 13px;
        min-width: 980px;
    }

    .empleados-table thead th {
        background: linear-gradient(135deg, #1e40af 0%, #1d4ed8 100%);
        color: #f8fafc;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.3px;
        border: 0 !important;
        padding: 12px 10px !important;
        text-align: center !important;
        white-space: nowrap;
        vertical-align: middle !important;
    }

    .empleados-table tbody td {
        padding: 10px !important;
        vertical-align: middle !important;
        border-top: 1px solid #eef2f7 !important;
    }

    .empleados-table tbody tr:nth-child(even) {
        background: #f8fbff;
    }

    .empleados-col-nombre {
        font-weight: 600;
        color: #0f172a;
    }

    .empleados-col-clave code {
        display: inline-block;
        padding: 3px 8px;
        border-radius: 6px;
        background: #f1f5f9;
        border: 1px solid #e2e8f0;
        color: #334155;
        font-size: 12px;
    }

    .empleados-perfil-badge {
        display: inline-block;
        padding: 4px 10px;
        border-radius: 999px;
        background: #dbeafe;
        border: 1px solid #bfdbfe;
        color: #1e40af;
        font-size: 11px;
        font-weight: 700;
        white-space: nowrap;
    }

    .empleados-col-accion {
        width: 56px;
        text-align: center !important;
    }

    .empleados-empty {
        padding: 36px 16px;
        text-align: center;
        color: #64748b;
        font-size: 14px;
    }

    .empleados-empty .glyphicon {
        display: block;
        font-size: 28px;
        margin-bottom: 10px;
        color: #94a3b8;
    }

    .empleados-form-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
    }

    .empleados-form-card {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        padding: 16px 18px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.05);
    }

    .empleados-form-section-title {
        margin: 0 0 14px;
        padding-bottom: 10px;
        border-bottom: 1px solid #eef2f7;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .empleados-form-row {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
        margin-bottom: 12px;
    }

    .empleados-form-row:last-child {
        margin-bottom: 0;
    }

    .empleados-form-field label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
    }

    .empleados-form-field .form-control {
        border-radius: 8px;
        min-height: 36px;
    }

    .empleados-field-help {
        margin: 6px 0 0;
        font-size: 11px;
        color: #64748b;
    }

    .empleados-required {
        color: #ef4444;
    }

    .empleados-form-actions {
        display: flex;
        justify-content: flex-end;
        gap: 8px;
        margin-top: 14px;
        padding: 14px 18px;
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
    }

    .empleados-btn-save {
        background: #2563eb !important;
        border-color: #1d4ed8 !important;
    }

    .empleados-btn-save:hover,
    .empleados-btn-save:focus {
        background: #1d4ed8 !important;
        border-color: #1e40af !important;
    }

    @media (max-width: 992px) {
        .empleados-form-grid {
            grid-template-columns: 1fr;
        }
    }

    @media (max-width: 768px) {
        .empleados-filters {
            flex-direction: column;
            align-items: stretch;
        }

        .empleados-form-row {
            grid-template-columns: 1fr;
        }

        .empleados-form-actions {
            flex-direction: column;
        }

        .empleados-form-actions .btn {
            width: 100%;
        }
    }

    .empleados-modal-dialog {
        width: 760px;
        max-width: calc(100vw - 24px);
    }

    .empleados-modal-content {
        border: 0;
        border-radius: 14px;
        overflow: hidden;
        box-shadow: 0 24px 48px rgba(15, 23, 42, 0.18);
    }

    .empleados-modal-header {
        border-bottom: 1px solid #e2e8f0;
        padding: 16px 18px 12px;
        background: #fff;
    }

    .empleados-modal-header .close {
        position: absolute;
        right: 16px;
        top: 14px;
        z-index: 2;
    }

    .empleados-modal-header-inner {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        padding-right: 28px;
    }

    .empleados-modal-icon {
        width: 42px;
        height: 42px;
        border-radius: 10px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, #2563eb, #1d4ed8);
        color: #fff;
        font-size: 18px;
        flex-shrink: 0;
    }

    .empleados-modal-header .modal-title {
        margin: 0 0 4px;
        font-size: 20px;
        font-weight: 700;
        color: #0f172a;
    }

    .empleados-modal-subtitle {
        margin: 0;
        font-size: 12px;
        color: #64748b;
    }

    .empleados-modal-body {
        padding: 16px 18px;
        background: #f8fafc;
        max-height: calc(100vh - 220px);
        overflow-y: auto;
    }

    .empleados-modal-section {
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        padding: 14px;
        margin-bottom: 12px;
    }

    .empleados-modal-section:last-child {
        margin-bottom: 0;
    }

    .empleados-modal-section-title {
        margin: 0 0 12px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .empleados-modal-row {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
        margin-bottom: 12px;
    }

    .empleados-modal-row:last-child {
        margin-bottom: 0;
    }

    .empleados-modal-field label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
    }

    .empleados-modal-field .form-control {
        border-radius: 8px;
        min-height: 36px;
    }

    .empleados-modal-field.has-error .form-control {
        border-color: #ef4444;
        box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.12);
    }

    .empleados-modal-footer {
        border-top: 1px solid #e2e8f0;
        background: #fff;
        padding: 12px 18px;
        display: flex;
        justify-content: flex-end;
        gap: 8px;
    }

    .empleados-modal-footer .btn {
        min-width: 120px;
        font-weight: 600;
        border-radius: 8px;
    }

    @media (max-width: 768px) {
        .empleados-modal-row {
            grid-template-columns: 1fr;
        }

        .empleados-modal-footer {
            flex-direction: column;
        }

        .empleados-modal-footer .btn {
            width: 100%;
        }
    }

    /* Módulo productos / inventario */
    .productos-page {
        padding: 0 12px 24px;
        overflow: visible;
    }

    .productos-panel {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
        padding: 18px 20px;
        margin-bottom: 14px;
        overflow: visible;
    }

    .productos-panel-head h2 {
        margin: 0;
        font-size: 22px;
        font-weight: 700;
        color: #1e293b;
    }

    .productos-panel-head p {
        margin: 4px 0 0;
        font-size: 13px;
        color: #64748b;
    }

    .productos-filters {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        align-items: flex-end;
        margin-top: 16px;
    }

    .productos-field--almacen {
        flex: 0 1 220px;
        min-width: 180px;
    }

    .productos-field--search {
        flex: 1 1 360px;
        min-width: 260px;
    }

    .productos-field label,
    .productos-actions-label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .productos-field .form-control {
        border-radius: 8px;
        border-color: #cbd5e1;
        min-height: 36px;
        font-size: 13px;
    }

    .productos-filter-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .productos-filter-actions .btn,
    .productos-secondary-actions .btn {
        font-weight: 600;
        border-radius: 8px;
    }

    .productos-options-row {
        margin-top: 12px;
        padding-top: 12px;
        border-top: 1px solid #eef2f7;
    }

    .productos-codigo-auto {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        margin: 0;
        font-size: 13px;
        font-weight: 600;
        color: #475569;
        cursor: pointer;
    }

    .productos-secondary-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 12px;
        margin-bottom: 14px;
    }

    .productos-total-badge {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 8px 12px;
        border-radius: 999px;
        background: #fff7ed;
        border: 1px solid #fed7aa;
        color: #c2410c;
        font-size: 12px;
        font-weight: 600;
    }

    .productos-total-badge strong {
        color: #9a3412;
        font-size: 13px;
    }

    .productos-stock-filter-active {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-top: 12px;
        padding: 9px 11px;
        border: 1px solid #fed7aa;
        border-radius: 9px;
        color: #9a3412;
        background: #fff7ed;
        font-size: 12px;
    }

    .productos-stock-filter-active[hidden] {
        display: none !important;
    }

    .productos-stock-filter-active strong {
        color: inherit;
    }

    .productos-stock-filter-active--sin_stock {
        border-color: #fecaca;
        color: #b42318;
        background: #fff1f2;
    }

    .productos-stock-filter-active .btn {
        flex: 0 0 auto;
        border-radius: 7px;
        font-weight: 600;
    }

    @media (max-width: 767px) {
        .productos-stock-filter-active {
            align-items: flex-start;
            flex-direction: column;
        }
    }

    .productos-grid-card {
        overflow: visible;
    }

    .productos-grid-header {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        padding: 14px 18px;
        border-bottom: 1px solid #eef2f7;
        background: linear-gradient(180deg, #fff7ed 0%, #fff 100%);
    }

    .productos-grid-header h3 {
        margin: 0;
        font-size: 16px;
        font-weight: 700;
        color: #c2410c;
    }

    .productos-grid-header p {
        margin: 2px 0 0;
        font-size: 12px;
        color: #64748b;
    }

    .productos-page .k-grid-header {
        background: linear-gradient(135deg, #ea580c 0%, #c2410c 100%);
    }

    .productos-page .k-grid-header th.k-header {
        border-color: rgba(255, 255, 255, 0.08);
        color: #fff7ed;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .productos-name-cell {
        font-weight: 600;
        color: #0f172a;
        line-height: 1.25;
    }

    .productos-codigo-col {
        display: inline-block;
        font-size: 10px;
        font-weight: 700;
        color: #475569;
        letter-spacing: 0.1px;
        line-height: 1.2;
        word-break: break-all;
    }

    .productos-page #grid .prod-col-codigo {
        padding-left: 4px !important;
        padding-right: 4px !important;
        vertical-align: top !important;
    }

    .productos-page #grid th.prod-col-codigo .k-link {
        font-size: 10px;
        padding: 0 2px;
    }

    .productos-composicion-cell {
        display: block;
        font-size: 11px;
        line-height: 1.35;
        color: #334155;
        white-space: normal;
        word-break: break-word;
        max-height: 3.9em;
        overflow: hidden;
    }

    .productos-composicion-empty {
        color: #94a3b8;
        font-size: 11px;
    }

    .productos-page #grid .prod-col-composicion {
        vertical-align: top !important;
    }

    .productos-stock-badge {
        display: inline-block;
        min-width: 36px;
        padding: 3px 8px;
        border-radius: 999px;
        background: #ffedd5;
        border: 1px solid #fdba74;
        color: #9a3412;
        font-weight: 700;
        font-size: 12px;
    }

    .productos-btn-icon {
        border-radius: 6px !important;
        padding: 4px 7px !important;
    }

    .productos-row-alt {
        background: #fffaf5;
    }

    .productos-modal-dialog {
        width: 920px;
        max-width: calc(100vw - 24px);
    }

    .productos-modal-content {
        border: 0;
        border-radius: 14px;
        overflow: hidden;
        box-shadow: 0 24px 48px rgba(15, 23, 42, 0.18);
    }

    .productos-modal-header {
        border-bottom: 1px solid #e2e8f0;
        padding: 16px 18px 12px;
        background: #fff;
        position: relative;
    }

    .productos-modal-header .close {
        position: absolute;
        right: 16px;
        top: 14px;
        z-index: 2;
    }

    .productos-modal-header-inner {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        padding-right: 28px;
    }

    .productos-modal-icon {
        width: 42px;
        height: 42px;
        border-radius: 10px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, #ea580c, #c2410c);
        color: #fff;
        font-size: 18px;
        flex-shrink: 0;
    }

    .productos-modal-header .modal-title {
        margin: 0 0 4px;
        font-size: 20px;
        font-weight: 700;
        color: #0f172a;
    }

    .productos-modal-subtitle {
        margin: 0;
        font-size: 12px;
        color: #64748b;
    }

    .productos-modal-image-wrap {
        margin-top: 12px;
        text-align: center;
    }

    .productos-modal-image-wrap img {
        width: 120px;
        height: 130px;
        object-fit: cover;
        border-radius: 10px;
        border: 1px solid #e2e8f0;
    }

    .productos-modal-image-placeholder {
        display: inline-flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 6px;
        width: 120px;
        height: 130px;
        border-radius: 10px;
        border: 1px dashed #cbd5e1;
        background: #f8fafc;
        color: #94a3b8;
        font-size: 11px;
    }

    .productos-modal-image-placeholder .glyphicon {
        font-size: 24px;
    }

    .productos-modal-body {
        padding: 16px 18px;
        background: #f8fafc;
        max-height: calc(100vh - 260px);
        overflow-y: auto;
    }

    .productos-modal-section {
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        padding: 14px;
        margin-bottom: 12px;
    }

    .productos-modal-section:last-child {
        margin-bottom: 0;
    }

    .productos-modal-section-title {
        margin: 0 0 12px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .productos-modal-row {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
        margin-bottom: 12px;
    }

    .productos-modal-row--3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .productos-modal-row--4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .productos-modal-row:last-child {
        margin-bottom: 0;
    }

    .productos-modal-field--wide {
        grid-column: 1 / -1;
    }

    .productos-modal-field label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
    }

    .productos-modal-field .form-control {
        border-radius: 8px;
        min-height: 36px;
    }

    .productos-modal-field.has-error .form-control {
        border-color: #ef4444;
        box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.12);
    }

    .productos-required {
        color: #ef4444;
    }

    .productos-input-prefix {
        display: flex;
        align-items: stretch;
    }

    .productos-input-prefix > span {
        display: inline-flex;
        align-items: center;
        padding: 0 10px;
        border: 1px solid #cbd5e1;
        border-right: 0;
        border-radius: 8px 0 0 8px;
        background: #fff7ed;
        color: #c2410c;
        font-size: 12px;
        font-weight: 700;
    }

    /* Inventario: rojo para agotado y ámbar para existencias aún disponibles. */
    .productos-page #grid tr.productos-row--sin-stock > td {
        background-color: #fef2f2 !important;
    }

    .productos-page #grid tr.productos-row--stock-bajo > td {
        background-color: #fef3c7 !important;
    }

    .productos-page #grid tr.productos-row--sin-stock .productos-stock-badge {
        color: #b42318;
        border-color: #fca5a5;
        background-color: #fee2e2;
    }

    .productos-input-prefix .form-control {
        border-radius: 0 8px 8px 0;
    }

    .productos-modal-footer {
        border-top: 1px solid #e2e8f0;
        background: #fff;
        padding: 12px 18px;
        display: flex;
        justify-content: flex-end;
        gap: 8px;
    }

    .productos-modal-footer .btn {
        min-width: 120px;
        font-weight: 600;
        border-radius: 8px;
    }

    .productos-btn-save {
        background: #ea580c !important;
        border-color: #c2410c !important;
    }

    .productos-btn-save:hover,
    .productos-btn-save:focus {
        background: #c2410c !important;
        border-color: #9a3412 !important;
    }

    @media (max-width: 992px) {
        .productos-modal-row--4,
        .productos-modal-row--3 {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }
    }

    @media (max-width: 768px) {
        .productos-page {
            padding: 0 8px 16px;
        }

        .productos-panel {
            padding: 14px 14px 12px;
            margin-bottom: 10px;
        }

        .productos-panel-head h2 {
            font-size: 18px;
        }

        .productos-filters {
            flex-direction: column;
            align-items: stretch;
            gap: 10px;
            margin-top: 12px;
        }

        .productos-field--almacen,
        .productos-field--search,
        .productos-field--actions {
            flex: 0 0 auto;
            min-width: 0;
            width: 100%;
        }

        .productos-field--actions .productos-actions-label {
            display: none;
        }

        .productos-filter-actions {
            width: 100%;
        }

        .productos-filter-actions .btn {
            flex: 1 1 0;
            min-width: 0;
        }

        .productos-options-row {
            margin-top: 8px;
            padding-top: 8px;
        }

        .productos-secondary-actions {
            margin-top: 8px;
            margin-bottom: 10px;
            gap: 6px;
        }

        .productos-secondary-actions .btn {
            flex: 1 1 calc(50% - 3px);
            min-width: 0;
            padding-left: 8px;
            padding-right: 8px;
            font-size: 12px;
        }

        .productos-total-row {
            margin-top: 0;
        }

        .productos-grid-header {
            padding: 12px 14px;
        }

        .productos-modal-row,
        .productos-modal-row--3,
        .productos-modal-row--4 {
            grid-template-columns: 1fr;
        }

        .productos-modal-footer {
            flex-direction: column;
        }

        .productos-modal-footer .btn {
            width: 100%;
        }
    }

    .productos-presentacion-dialog {
        width: 760px;
        max-width: calc(100vw - 24px);
    }

    .productos-presentacion-header .productos-modal-subtitle {
        max-width: 620px;
    }

    .productos-presentacion-code {
        display: inline-block;
        padding: 2px 8px;
        border-radius: 999px;
        background: #ffedd5;
        border: 1px solid #fdba74;
        color: #9a3412;
        font-size: 11px;
        font-weight: 700;
    }

    .productos-presentacion-body {
        padding-top: 14px;
    }

    .productos-presentacion-form-card,
    .productos-presentacion-list-card {
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        padding: 14px;
        margin-bottom: 12px;
    }

    .productos-presentacion-list-card {
        margin-bottom: 0;
    }

    .productos-presentacion-form-row {
        display: grid;
        grid-template-columns: 1.4fr 0.8fr 0.9fr auto;
        gap: 12px;
        align-items: end;
    }

    .productos-presentacion-form-action {
        min-width: 120px;
    }

    .productos-presentacion-action-label {
        display: block;
        margin-bottom: 6px;
    }

    .productos-presentacion-btn-add {
        width: 100%;
        min-height: 36px;
        font-weight: 600;
        border-radius: 8px;
    }

    .productos-presentacion-list-head p {
        margin: -6px 0 12px;
        font-size: 12px;
        color: #64748b;
    }

    .productos-presentacion-table-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .productos-presentacion-table {
        margin: 0;
        font-size: 13px;
        min-width: 520px;
    }

    .productos-presentacion-table thead th {
        background: linear-gradient(135deg, #ea580c 0%, #c2410c 100%);
        color: #fff7ed;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.3px;
        border: 0 !important;
        padding: 11px 10px !important;
        white-space: nowrap;
        vertical-align: middle !important;
    }

    .productos-presentacion-table tbody td {
        padding: 10px !important;
        vertical-align: middle !important;
        border-top: 1px solid #eef2f7 !important;
    }

    .productos-presentacion-table tbody tr:nth-child(even) {
        background: #fffaf5;
    }

    .productos-presentacion-qty {
        display: inline-block;
        min-width: 36px;
        padding: 3px 8px;
        border-radius: 999px;
        background: #f1f5f9;
        border: 1px solid #e2e8f0;
        color: #334155;
        font-weight: 700;
        font-size: 12px;
    }

    .productos-presentacion-price {
        display: inline-block;
        padding: 3px 8px;
        border-radius: 6px;
        background: #fff7ed;
        border: 1px solid #fed7aa;
        color: #9a3412;
        font-weight: 700;
        font-size: 12px;
        white-space: nowrap;
    }

    .productos-presentacion-col-accion {
        width: 70px;
    }

    .productos-presentacion-empty {
        padding: 28px 16px;
        text-align: center;
        color: #64748b;
        font-size: 13px;
        border: 1px dashed #cbd5e1;
        border-radius: 10px;
        background: #f8fafc;
    }

    .productos-presentacion-empty .glyphicon {
        display: block;
        font-size: 26px;
        margin-bottom: 10px;
        color: #94a3b8;
    }

    .productos-presentacion-empty p {
        margin: 0;
    }

    .productos-presentacion-footer {
        justify-content: flex-end;
    }

    @media (max-width: 768px) {
        .productos-presentacion-form-row {
            grid-template-columns: 1fr;
        }

        .productos-presentacion-btn-add {
            width: 100%;
        }
    }

    /* Nota de venta — prototipo compacto para futura base tributaria */
    .nota-form-prototype.comprobante-form-page {
        padding: 0 12px 18px;
    }

    .nota-form-prototype .comprobante-form-top {
        margin-bottom: 10px;
    }

    .nota-form-prototype .comprobante-form-top > div {
        display: flex;
        flex-wrap: wrap;
        align-items: baseline;
        gap: 4px 12px;
    }

    .nota-form-prototype .comprobante-form-top p {
        margin: 0;
    }

    .nota-form-prototype .comprobante-form-back {
        padding: 7px 12px;
        font-size: 12px;
    }

    .nota-form-prototype .comprobante-form-panel {
        margin-bottom: 10px;
    }

    .nota-form-prototype .comprobante-form-section-title {
        padding: 10px 16px;
        font-size: 12px;
    }

    .nota-form-prototype .comprobante-form-panel-body {
        padding: 10px 16px 12px;
    }

    .nota-form-prototype .comprobante-datos-layout {
        gap: 10px;
    }

    .nota-form-prototype .comprobante-datos-row--comprobante {
        gap: 8px 10px;
        padding-bottom: 10px;
    }

    .nota-form-prototype .comprobante-datos-row--cliente {
        gap: 8px 10px;
    }
    @media (min-width: 1200px) {
        .nota-form-prototype .comprobante-datos-layout {
            display: grid;
            grid-template-columns: minmax(300px, 1.6fr) auto minmax(220px, 1fr) 112px 138px 100px;
            gap: 10px;
            align-items: end;
        }

        .nota-form-prototype .comprobante-datos-row--comprobante,
        .nota-form-prototype .comprobante-datos-row--cliente {
            display: contents;
        }

        .nota-form-prototype .comprobante-datos-row--comprobante {
            padding-bottom: 0;
            border-bottom: 0;
        }
        .nota-form-prototype .comprobante-datos-field--cliente { grid-column: 1; grid-row: 1; }
        .nota-form-prototype .comprobante-datos-field--acciones { grid-column: 2; grid-row: 1; }
        .nota-form-prototype .comprobante-datos-field--direccion { grid-column: 3; grid-row: 1; }
        .nota-form-prototype .comprobante-datos-field--fecha { grid-column: 4; grid-row: 1; }
        .nota-form-prototype .comprobante-datos-field--moneda { grid-column: 5; grid-row: 1; }
        .nota-form-prototype .comprobante-datos-field--numero { grid-column: 6; grid-row: 1; }
    }

    .nota-form-prototype .btn-nuevo-cliente {
        display: none !important;
    }

    .nota-form-prototype .comprobante-datos-field label.control-label {
        margin-bottom: 4px;
    }

    .nota-form-prototype .comprobante-datos-field .form-control {
        min-height: 34px;
        height: 34px;
    }

    .nota-form-prototype .comprobante-datos-cliente-btns .btn {
        min-height: 34px;
        height: 34px;
        padding: 6px 10px;
    }

    .nota-form-prototype .nota-conceptos-panel-body {
        padding: 10px 16px 12px;
    }

    .nota-form-prototype .nota-conceptos-toolbar {
        margin-bottom: 8px;
    }

    .nota-form-prototype .nota-barcode-label {
        margin-bottom: 4px;
        font-size: 11px;
    }

    .nota-form-prototype .nota-barcode-input,
    .nota-form-prototype .nota-barcode-scan-btn {
        min-height: 34px;
        height: 34px;
    }

    .nota-form-prototype .nota-barcode-scan-btn {
        padding: 6px 10px;
        font-size: 12px;
    }

    .nota-form-prototype .nota-conceptos-panel-body .comprobante-items-wrap {
        padding: 2px;
        border-radius: 7px;
    }

    .nota-form-prototype .nota-items-actions {
        gap: 8px;
        margin-top: 10px;
        padding-top: 8px;
    }

    .nota-form-prototype .nota-items-actions .nota-btn-item {
        min-height: 34px;
        padding: 6px 12px;
        font-size: 12px;
        border-radius: 7px;
    }

    .nota-form-prototype .nota-pie-row {
        margin-top: 10px;
    }

    .nota-form-prototype .nota-pie-card-header {
        padding: 9px 12px;
        font-size: 12px;
    }

    .nota-form-prototype .nota-pie-card-body {
        padding: 10px 12px;
    }

    .nota-form-prototype .nota-observaciones-input {
        min-height: 84px;
        height: 84px;
        padding: 9px 11px;
        font-size: 13px;
    }

    .nota-form-prototype .nota-total-card .nota-pie-card-body {
        min-height: 84px;
    }

    .nota-form-prototype .nota-total-label {
        margin-bottom: 6px;
        font-size: 11px;
    }

    .nota-form-prototype .nota-total-monto {
        max-width: 240px;
        padding: 8px 12px;
    }

    .nota-form-prototype .nota-total-simbolo {
        font-size: 20px;
    }

    .nota-form-prototype .nota-total-input {
        font-size: 28px;
    }

    .nota-form-prototype .nota-accion-generar {
        margin-top: 12px;
        padding-top: 12px;
        padding-bottom: 4px;
    }

    .nota-form-prototype #guardar.btn-generar-nota {
        min-width: 260px;
        padding: 11px 28px;
        font-size: 14px;
    }
    /* Productos — cabecera compacta */
    .productos-page .productos-panel {
        padding: 12px 16px 10px;
        margin-bottom: 10px;
    }

    .productos-page .productos-panel-head {
        padding-bottom: 7px;
        margin-bottom: 9px;
        border-bottom: 1px solid #e5e7eb;
    }

    .productos-page .productos-panel-head > div {
        display: flex;
        flex-wrap: wrap;
        align-items: baseline;
        gap: 4px 12px;
    }

    .productos-page .productos-panel-head p {
        margin: 0;
        font-size: 12px;
    }

    .productos-page .productos-filters {
        gap: 10px;
        margin-top: 0;
    }

    .productos-page .productos-field label,
    .productos-page .productos-actions-label {
        margin-bottom: 4px;
        font-size: 11px;
    }

    .productos-page .productos-field .form-control {
        min-height: 34px;
        height: 34px;
        font-size: 12px;
    }

    .productos-page .productos-filter-actions {
        flex-wrap: nowrap;
    }

    .productos-page .productos-filter-actions .btn,
    .productos-page .productos-secondary-actions .btn {
        min-width: 0;
        padding: 7px 12px;
        border-radius: 7px;
        font-size: 12px;
        white-space: nowrap;
    }

    .productos-page .productos-footer-row,
    .productos-page .productos-footer-meta {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
    }

    .productos-page .productos-footer-row {
        justify-content: space-between;
        gap: 10px;
        margin-top: 9px;
        padding-top: 8px;
        border-top: 1px solid #e5e7eb;
    }

    .productos-page .productos-footer-meta {
        gap: 12px;
    }

    .productos-page .productos-options-row {
        margin: 0;
        padding: 0;
        border: 0;
    }

    .productos-page .productos-secondary-actions {
        margin: 0 0 0 auto;
    }

    .productos-page .productos-total-badge {
        padding: 6px 10px;
    }

    @media (max-width: 768px) {
        .productos-page .productos-panel {
            padding: 12px 14px 10px;
        }

        .productos-page .productos-filters {
            margin-top: 0;
        }

        .productos-page .productos-footer-row {
            align-items: stretch;
        }

        .productos-page .productos-footer-meta,
        .productos-page .productos-secondary-actions {
            width: 100%;
        }

        .productos-page .productos-secondary-actions {
            margin: 0;
            gap: 6px;
        }
    }
    /* Reporte stock mínimo */
    .reporte-sm-page {
        padding: 15px;
    }

    .reporte-sm-panel {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
        padding: 20px;
        margin-bottom: 16px;
    }

    .reporte-sm-panel-head h3 {
        margin: 0;
        font-size: 22px;
        font-weight: 700;
        color: #1e293b;
    }

    .reporte-sm-panel-head p {
        margin: 4px 0 0;
        font-size: 13px;
        color: #64748b;
    }

    .reporte-sm-filters {
        display: grid;
        grid-template-columns: 280px minmax(260px, 1fr);
        gap: 12px;
        margin-top: 16px;
    }

    .reporte-sm-field label {
        display: block;
        font-weight: 600;
        color: #374151;
        font-size: 13px;
        margin-bottom: 6px;
    }

    .reporte-sm-field .form-control {
        border-radius: 8px;
        min-height: 36px;
    }

    .reporte-sm-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        align-items: center;
        padding-top: 14px;
        margin-top: 14px;
        border-top: 1px solid #eef2f7;
    }

    .reporte-sm-actions .btn {
        min-width: 130px;
        font-weight: 600;
        border-radius: 8px;
        padding: 8px 14px;
    }

    .reporte-sm-stats {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 12px;
        margin-bottom: 16px;
    }

    .reporte-sm-stat {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 10px;
        padding: 16px 14px;
        box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
        text-align: center;
    }

    .reporte-sm-stat-label {
        display: block;
        font-size: 12px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        color: #64748b;
        margin-bottom: 8px;
    }

    .reporte-sm-stat-value {
        display: block;
        font-size: 28px;
        font-weight: 700;
        color: #0f766e;
        line-height: 1.15;
    }

    .reporte-sm-stat-value--alert {
        color: #dc2626;
    }

    .reporte-sm-grid-card {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
        overflow: hidden;
    }

    .reporte-sm-grid-header {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        padding: 14px 18px;
        border-bottom: 1px solid #eef2f7;
        background: linear-gradient(180deg, #fef2f2 0%, #fff 100%);
    }

    .reporte-sm-grid-header h4 {
        margin: 0;
        font-size: 16px;
        font-weight: 700;
        color: #b91c1c;
    }

    .reporte-sm-grid-subtitle {
        margin: 2px 0 0;
        font-size: 12px;
        color: #64748b;
    }

    .reporte-sm-grid-body {
        position: relative;
        min-height: 180px;
        padding: 0;
    }

    .reporte-sm-loading {
        position: absolute;
        inset: 0;
        z-index: 3;
        display: none;
        align-items: center;
        justify-content: center;
        gap: 10px;
        background: rgba(255, 255, 255, 0.82);
        color: #475569;
        font-size: 14px;
        font-weight: 600;
    }

    .reporte-sm-loading.is-visible {
        display: flex;
    }

    .reporte-sm-loading-spinner {
        width: 18px;
        height: 18px;
        border: 2px solid #fecaca;
        border-top-color: #dc2626;
        border-radius: 50%;
        animation: reporteSmSpin 0.8s linear infinite;
    }

    @keyframes reporteSmSpin {
        to {
            transform: rotate(360deg);
        }
    }

    .reporte-sm-table-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .reporte-sm-table {
        margin: 0;
        font-size: 13px;
        min-width: 860px;
    }

    .reporte-sm-table thead th {
        background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);
        color: #fff;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.3px;
        border: 0 !important;
        padding: 12px 10px !important;
        white-space: nowrap;
        vertical-align: middle !important;
    }

    .reporte-sm-table tbody td {
        padding: 10px !important;
        vertical-align: middle !important;
        border-top: 1px solid #eef2f7 !important;
    }

    .reporte-sm-row-alt {
        background: #fffafb;
    }

    .reporte-sm-cat-badge {
        display: inline-block;
        padding: 4px 10px;
        border-radius: 999px;
        background: #f1f5f9;
        border: 1px solid #e2e8f0;
        color: #334155;
        font-size: 11px;
        font-weight: 700;
        white-space: nowrap;
    }

    .reporte-sm-code {
        display: inline-block;
        padding: 3px 8px;
        border-radius: 6px;
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        color: #334155;
        font-size: 12px;
    }

    .reporte-sm-desc {
        font-weight: 600;
        color: #0f172a;
    }

    .reporte-sm-stock {
        display: inline-block;
        min-width: 42px;
        padding: 4px 10px;
        border-radius: 999px;
        font-size: 12px;
        font-weight: 700;
    }

    .reporte-sm-stock--current {
        background: #ecfdf5;
        border: 1px solid #a7f3d0;
        color: #047857;
    }

    .reporte-sm-stock--min {
        background: #fffbeb;
        border: 1px solid #fde68a;
        color: #b45309;
    }

    .reporte-sm-stock--repo {
        background: #fef2f2;
        border: 1px solid #fecaca;
        color: #b91c1c;
    }

    .reporte-sm-empty {
        padding: 42px 16px;
        text-align: center;
        color: #64748b;
        font-size: 14px;
    }

    .reporte-sm-empty .glyphicon {
        display: block;
        font-size: 30px;
        margin-bottom: 10px;
        color: #22c55e;
    }

    .reporte-sm-empty--error .glyphicon {
        color: #ef4444;
    }

    .reporte-sm-empty p {
        margin: 0;
    }

    @media (max-width: 992px) {
        .reporte-sm-stats {
            grid-template-columns: 1fr;
        }

        .reporte-sm-filters {
            grid-template-columns: 1fr;
        }
    }

    @media (max-width: 768px) {
        .reporte-sm-actions {
            flex-direction: column;
            align-items: stretch;
        }

        .reporte-sm-actions .btn {
            width: 100%;
        }
    }

    /* Módulo cobros a clientes (basado en pagos) */
    .cobros-page .comprobantes-panel-head h2,
    .cobros-grid-header h3 {
        color: #1d4ed8;
    }

    .cobros-grid-header {
        background: linear-gradient(180deg, #eff6ff 0%, #fff 100%);
    }

    .cobros-group-badge {
        background: #dbeafe;
        color: #1d4ed8;
    }

    .cobros-row-pendiente {
        background: #eff6ff;
    }

    .cobros-row-pendiente:hover {
        background: #dbeafe;
    }

    .cobros-col-saldo strong {
        color: #1d4ed8;
    }

    .cobros-row-cancelado .cobros-col-saldo strong {
        color: #047857;
    }

    .cobros-grand-total-row td {
        background: #eff6ff !important;
    }

    .cobros-link-historial {
        color: #2563eb;
    }

    .cobros-col-accion .btn_regCobro {
        border-radius: 8px;
        padding: 5px 9px;
    }

    .cobros-table--compact {
        table-layout: fixed;
        width: 100%;
        min-width: 1120px;
        font-size: 12px;
    }

    .cobros-table--compact thead th {
        padding: 8px 6px !important;
        font-size: 10px;
        letter-spacing: 0.2px;
    }

    .cobros-table--compact tbody td {
        padding: 7px 6px !important;
        font-size: 12px;
    }

    .cobros-table--compact .cobros-col-num,
    .cobros-table--compact .cobros-th-num,
    .cobros-table--compact .cobros-td-num {
        width: 34px;
        text-align: center !important;
    }

    .cobros-table--compact .cobros-col-cliente,
    .cobros-table--compact .cobros-th-cliente,
    .cobros-table--compact .cobros-td-cliente {
        width: 150px;
        max-width: 150px;
        text-align: left !important;
    }

    .cobros-table--compact .cobros-td-cliente {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .cobros-table--compact thead th:not(.cobros-th-cliente),
    .cobros-table--compact tbody tr:not(.pagos-group-row):not(.cobros-group-row):not(.pagos-total-row):not(.cobros-total-row):not(.pagos-grand-total-row):not(.cobros-grand-total-row) td:not(.cobros-td-cliente) {
        text-align: center !important;
    }

    .cobros-table--compact tbody tr.pagos-group-row > td,
    .cobros-table--compact tbody tr.cobros-group-row > td,
    .cobros-table--compact tbody tr.pagos-total-row > td,
    .cobros-table--compact tbody tr.cobros-total-row > td,
    .cobros-table--compact tbody tr.pagos-grand-total-row > td,
    .cobros-table--compact tbody tr.cobros-grand-total-row > td {
        text-align: left !important;
        padding-left: 12px !important;
    }

    .cobros-table--compact .pagos-group-badge,
    .cobros-table--compact .cobros-group-badge {
        display: inline-block;
        text-align: left;
    }

    .cobros-table--compact .pagos-col-monto,
    .cobros-table--compact .cobros-col-monto,
    .cobros-table--compact .cobros-th-monto,
    .cobros-table--compact .cobros-td-monto {
        text-align: center !important;
    }

    .cobros-table--compact .cobros-col-numero,
    .cobros-table--compact .cobros-th-numero,
    .cobros-table--compact .cobros-td-numero {
        width: 96px;
        text-align: center !important;
        white-space: nowrap;
    }

    .cobros-table--compact .cobros-col-preview,
    .cobros-table--compact .cobros-th-preview,
    .cobros-table--compact .cobros-col-preview {
        width: 42px;
        text-align: center !important;
    }

    .cobros-table--compact .cobros-col-fecha,
    .cobros-table--compact .cobros-th-fecha,
    .cobros-table--compact .cobros-td-fecha {
        width: 78px;
        text-align: center !important;
        white-space: nowrap;
        font-size: 11px;
    }

    .cobros-table--compact .cobros-col-moneda,
    .cobros-table--compact .cobros-th-moneda,
    .cobros-table--compact .cobros-td-moneda {
        width: 46px;
        text-align: center !important;
        font-size: 11px;
    }

    .cobros-table--compact .cobros-col-monto,
    .cobros-table--compact .cobros-th-monto,
    .cobros-table--compact .cobros-td-monto {
        width: 82px;
    }

    .cobros-table--compact .cobros-col-usuario,
    .cobros-table--compact .cobros-th-usuario,
    .cobros-table--compact .cobros-td-usuario {
        width: 92px;
        max-width: 92px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 11px;
        text-align: center !important;
    }

    .cobros-table--compact .cobros-col-historial,
    .cobros-table--compact .cobros-th-historial,
    .cobros-table--compact .cobros-td-historial {
        width: 118px;
        max-width: 118px;
        text-align: center !important;
    }

    .cobros-table--compact .cobros-col-estado,
    .cobros-table--compact .cobros-th-estado,
    .cobros-table--compact .cobros-td-estado {
        width: 132px;
        min-width: 132px;
        max-width: 150px;
        text-align: center !important;
        vertical-align: middle !important;
    }

    .cobros-table--compact .cobros-td-estado .clientes-estado-badge {
        display: inline-block;
        margin: 1px 0;
    }

    .cobros-table--compact .cobros-historial-compact {
        align-items: center;
    }

    .cobros-table--compact .pagos-col-historial-pago,
    .cobros-table--compact .cobros-col-historial-cobro {
        min-width: 0 !important;
        max-width: 118px !important;
    }

    .cobros-table--compact .pagos-col-proveedor,
    .cobros-table--compact .cobros-col-cliente {
        max-width: 150px !important;
    }

    .cobros-table--compact .cobros-col-accion,
    .cobros-table--compact .cobros-th-accion,
    .cobros-table--compact .cobros-col-accion {
        width: 46px;
        text-align: center !important;
    }

    .cobros-table--compact .pagos-btn-preview,
    .cobros-table--compact .cobros-btn-preview {
        width: 28px;
        height: 28px;
    }

    .cobros-table--compact .pagos-btn-preview img,
    .cobros-table--compact .cobros-btn-preview img {
        width: 16px;
        height: 16px;
    }

    .cobros-table--compact .cobros-col-accion .btn_regCobro {
        padding: 3px 7px !important;
    }

    .cobros-historial-compact {
        display: flex;
        flex-direction: column;
        gap: 1px;
        line-height: 1.2;
        min-width: 0;
    }

    .cobros-historial-count {
        font-size: 11px;
        font-weight: 700;
        color: #1e293b;
        white-space: nowrap;
    }

    .cobros-historial-amount {
        font-size: 10px;
        color: #64748b;
        white-space: nowrap;
    }

    .cobros-link-historial--compact {
        font-size: 10px;
        line-height: 1.2;
    }

    .cobros-table--compact .pagos-group-row td,
    .cobros-table--compact .pagos-subgroup-row td {
        padding: 6px 8px !important;
    }

    .cobros-table--compact .pagos-total-row td,
    .cobros-table--compact .pagos-grand-total-row td {
        padding: 8px 6px !important;
        font-size: 11px;
    }

    .cobros-modal-icon,
    .cobros-perfil-popup-icon {
        background: linear-gradient(135deg, #2563eb, #1d4ed8) !important;
    }

    .cobros-btn-guardar {
        background: #2563eb !important;
        border-color: #1d4ed8 !important;
    }

    .cobros-btn-guardar:hover,
    .cobros-btn-guardar:focus {
        background: #1d4ed8 !important;
        border-color: #1e40af !important;
    }

    .cobros-modal-field--saldo .form-control {
        font-weight: 700;
        color: #1d4ed8;
        background: #eff6ff;
        border-color: #93c5fd;
    }

    .cobros-modal-empty {
        padding: 18px 14px;
        border: 1px dashed #cbd5e1;
        border-radius: 10px;
        background: #f8fafc;
        color: #64748b;
        font-size: 13px;
        text-align: center;
    }

    .cobros-preview-dialog {
        width: min(920px, calc(100vw - 24px));
        max-width: calc(100vw - 24px);
    }

    .cobros-preview-body {
        padding: 0 !important;
        background: #f1f5f9;
    }

    .cobros-preview-iframe {
        display: block;
        width: 100%;
        height: calc(100vh - 220px);
        min-height: 480px;
        border: 0;
        background: #fff;
    }

    .cobros-historial-modal-body,
    .cobros-modal-body {
        max-height: calc(100vh - 180px);
        overflow-y: auto;
    }

    #myModal.modal.in .modal-dialog.cobros-preview-dialog,
    #myModal.modal.in .modal-dialog.cobros-historial-modal-dialog,
    #myModal.modal.in .modal-dialog.cobros-modal-dialog {
        margin: 20px auto;
    }

    @media (max-width: 768px) {
        .cobros-preview-iframe {
            height: calc(100vh - 180px);
            min-height: 360px;
        }
    }

    /* --- Grillas móviles genéricas --- */
    .comp-grid-mobile .comp-col-desktop,
    .comp-grid-mobile th.comp-col-desktop,
    .comp-grid-mobile td.comp-col-desktop {
        display: none !important;
    }

    .comp-grid-mobile .grid-col-desktop,
    .comp-grid-mobile th.grid-col-desktop,
    .comp-grid-mobile td.grid-col-desktop,
    .comp-grid-mobile col.grid-col-desktop {
        display: none !important;
    }

    .comp-grid-mobile .k-grid-content {
        overflow-x: hidden !important;
    }

    .comp-grid-mobile .k-grid-header th.k-header,
    .comp-grid-mobile .k-grid-content td {
        font-size: 11px;
        padding: 6px 4px;
    }

    .comp-grid-mobile .k-pager-wrap {
        flex-wrap: wrap;
    }

    .comp-grid-mobile .k-pager-info {
        width: 100%;
        text-align: center;
        margin-top: 4px;
    }

    .productos-grid-card.comp-grid-mobile #grid-productos-wrapper {
        overflow-x: hidden;
    }

    .productos-page .productos-grid-card.comp-grid-mobile.comprobantes-grid-card .k-grid-header-wrap {
        overflow-x: hidden !important;
    }

    .productos-page .productos-grid-card.comp-grid-mobile.comprobantes-grid-card .k-grid-content {
        overflow-x: auto !important;
        overflow-y: auto !important;
    }

    .productos-grid-card.comp-grid-mobile #grid .k-grid-header-wrap {
        overflow-x: hidden !important;
        overflow-y: hidden !important;
    }

    .productos-grid-card.comp-grid-mobile #grid .k-grid-content {
        overflow-x: auto !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    .productos-grid-card.comp-grid-mobile #grid .k-grid-header table,
    .productos-grid-card.comp-grid-mobile #grid .k-grid-content table {
        width: auto !important;
        min-width: 448px !important;
        table-layout: auto !important;
    }

    .productos-grid-card.comp-grid-mobile #grid .k-grid-header th.k-header,
    .productos-grid-card.comp-grid-mobile #grid .k-grid-content td {
        font-size: 11px !important;
        padding: 6px 4px !important;
    }

    .productos-grid-card.comp-grid-mobile #grid .k-grid-header th.prod-col-codigo,
    .productos-grid-card.comp-grid-mobile #grid td.prod-col-codigo {
        width: 52px !important;
        min-width: 52px !important;
        max-width: 58px !important;
        white-space: normal !important;
        word-break: break-all;
        text-align: center !important;
        font-size: 10px !important;
    }

    .productos-grid-card.comp-grid-mobile #grid .k-grid-header th.prod-col-nombre,
    .productos-grid-card.comp-grid-mobile #grid td.prod-col-nombre {
        width: 140px !important;
        min-width: 130px !important;
        max-width: none !important;
        white-space: normal !important;
        line-height: 1.25;
        word-break: break-word;
        text-align: left !important;
    }

    .productos-grid-card.comp-grid-mobile #grid .k-grid-header th.prod-col-precio,
    .productos-grid-card.comp-grid-mobile #grid td.prod-col-precio {
        width: 72px !important;
        min-width: 72px !important;
        max-width: none !important;
        white-space: nowrap !important;
        text-align: center !important;
    }

    .productos-grid-card.comp-grid-mobile #grid .k-grid-header th.prod-col-stock,
    .productos-grid-card.comp-grid-mobile #grid td.prod-col-stock {
        width: 58px !important;
        min-width: 58px !important;
        max-width: none !important;
        text-align: center !important;
    }

    .productos-grid-card.comp-grid-mobile #grid .k-grid-header th.prod-col-editar,
    .productos-grid-card.comp-grid-mobile #grid td.prod-col-editar {
        width: 52px !important;
        min-width: 52px !important;
        max-width: none !important;
        text-align: center !important;
        padding-left: 2px !important;
        padding-right: 2px !important;
    }

    .productos-grid-card.comp-grid-mobile #grid .productos-stock-badge {
        font-size: 10px;
        min-width: 0;
        padding: 2px 6px;
    }

    .productos-grid-card.comp-grid-mobile #grid .productos-btn-icon {
        padding: 3px 6px !important;
    }

    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .k-grid-header th[data-field="prof_correlativo"],
    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid td:nth-child(1) {
        width: 14% !important;
    }

    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .k-grid-header th[data-field="razon_social"],
    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid td:nth-child(2) {
        width: 30% !important;
    }

    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid .k-grid-header th[data-field="prof_doc_total"],
    .comprobantes-page .comprobantes-grid-card.comp-grid-mobile #grid td:nth-child(3) {
        width: 16% !important;
    }

    .cobros-grid-card.comp-grid-mobile .cobros-table-scroll,
    .pagos-grid-card.comp-grid-mobile .pagos-table-scroll,
    .clientes-grid-card.comp-grid-mobile .clientes-table-wrap {
        overflow-x: hidden;
    }

    .cobros-grid-card.comp-grid-mobile .cobros-table--compact {
        min-width: 0;
        width: 100%;
        table-layout: fixed;
    }

    .cobros-grid-card.comp-grid-mobile .cobros-table--compact thead th,
    .cobros-grid-card.comp-grid-mobile .cobros-table--compact tbody td {
        font-size: 10px;
        padding: 5px 4px;
    }

    .cobros-grid-card.comp-grid-mobile .cobros-col-cliente,
    .cobros-grid-card.comp-grid-mobile .cobros-td-cliente {
        width: 28% !important;
    }

    .cobros-grid-card.comp-grid-mobile .cobros-col-numero,
    .cobros-grid-card.comp-grid-mobile .cobros-td-numero {
        width: 22% !important;
    }

    .cobros-grid-card.comp-grid-mobile .cobros-col-saldo,
    .cobros-grid-card.comp-grid-mobile .cobros-td-monto.cobros-col-saldo {
        width: 18% !important;
    }

    .cobros-grid-card.comp-grid-mobile .cobros-col-estado,
    .cobros-grid-card.comp-grid-mobile .cobros-td-estado {
        width: 18% !important;
    }

    .cobros-grid-card.comp-grid-mobile .cobros-col-accion,
    .cobros-grid-card.comp-grid-mobile .cobros-col-accion {
        width: 14% !important;
    }

    .cobros-grid-card.comp-grid-mobile .pagos-group-row td,
    .cobros-grid-card.comp-grid-mobile .cobros-group-row td,
    .cobros-grid-card.comp-grid-mobile .pagos-total-row,
    .cobros-grid-card.comp-grid-mobile .cobros-total-row,
    .cobros-grid-card.comp-grid-mobile .pagos-grand-total-row,
    .cobros-grid-card.comp-grid-mobile .cobros-grand-total-row {
        display: none;
    }

    .clientes-grid-card.comp-grid-mobile .clientes-table {
        table-layout: fixed;
        width: 100%;
    }

    .clientes-grid-card.comp-grid-mobile .clientes-table thead th,
    .clientes-grid-card.comp-grid-mobile .clientes-table tbody td {
        font-size: 11px;
        padding: 6px 4px;
    }

    .clientes-grid-card.comp-grid-mobile .col-doc {
        width: 24%;
    }

    .clientes-grid-card.comp-grid-mobile .col-nombre {
        width: 46%;
    }

    .clientes-grid-card.comp-grid-mobile .col-acciones {
        width: 15%;
        text-align: center;
    }

    /* Módulo administración de módulos */
    .modulos-page {
        padding: 0 12px 24px;
        overflow: visible;
    }

    .modulos-panel {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
        padding: 18px 20px;
        margin-bottom: 14px;
        overflow: visible;
    }

    .modulos-panel-head {
        margin-bottom: 16px;
    }

    .modulos-panel-head h2 {
        margin: 0;
        font-size: 22px;
        font-weight: 700;
        color: #1e293b;
    }

    .modulos-panel-head p {
        margin: 4px 0 0;
        font-size: 13px;
        color: #64748b;
    }

    .modulos-filters {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        align-items: flex-end;
    }

    .modulos-field--search {
        flex: 1 1 280px;
        min-width: 220px;
    }

    .modulos-field--estado,
    .modulos-field--categoria {
        flex: 0 1 180px;
        min-width: 150px;
    }

    .modulos-field label,
    .modulos-actions-label {
        display: block;
        margin-bottom: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .modulos-field .form-control {
        border-radius: 8px;
        border-color: #cbd5e1;
        min-height: 36px;
        font-size: 13px;
    }

    .modulos-filter-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .modulos-filter-actions .btn {
        min-width: 100px;
        font-weight: 600;
        border-radius: 8px;
        padding: 8px 14px;
        font-size: 13px;
    }

    .modulos-secondary-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 4px;
        margin-bottom: 12px;
        padding-top: 12px;
        border-top: 1px solid #eef2f7;
    }

    .modulos-secondary-actions .btn {
        font-weight: 600;
        border-radius: 8px;
        padding: 7px 14px;
        font-size: 13px;
    }

    .modulos-legend {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px;
        padding-top: 10px;
        border-top: 1px dashed #e2e8f0;
    }

    .modulos-legend-note {
        margin-left: 4px;
        font-size: 12px;
        color: #64748b;
    }

    .modulos-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 68px;
        padding: 3px 10px;
        border-radius: 999px;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.2px;
        text-transform: uppercase;
    }

    .modulos-badge--activo {
        background: #dcfce7;
        color: #166534;
        border: 1px solid #bbf7d0;
    }

    .modulos-badge--inactivo {
        background: #fef3c7;
        color: #92400e;
        border: 1px solid #fde68a;
    }

    .modulos-badge--oculto {
        background: #f1f5f9;
        color: #475569;
        border: 1px solid #e2e8f0;
    }

    .modulos-grid-card {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
        box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
        overflow: hidden;
    }

    .modulos-grid-header {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        padding: 16px 18px 10px;
        border-bottom: 1px solid #eef2f7;
    }

    .modulos-grid-header h3 {
        margin: 0;
        font-size: 16px;
        font-weight: 700;
        color: #0f172a;
    }

    .modulos-grid-header p {
        margin: 3px 0 0;
        font-size: 12px;
        color: #64748b;
    }

    .modulos-total-badge {
        display: inline-flex;
        align-items: center;
        padding: 6px 12px;
        border-radius: 999px;
        background: #eff6ff;
        color: #1d4ed8;
        font-size: 12px;
        font-weight: 600;
    }

    .modulos-page .k-grid {
        border: 0;
    }

    .modulos-page .k-grid-header {
        background: linear-gradient(135deg, #1d4ed8 0%, #1e40af 100%);
    }

    .modulos-page .k-grid-header th.k-header {
        border-color: rgba(255, 255, 255, 0.08);
        color: #f8fafc;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        text-align: center !important;
        vertical-align: middle;
    }

    .modulos-page .k-grid td {
        vertical-align: middle !important;
        font-size: 13px;
    }

    .modulos-col-center {
        text-align: center !important;
    }

    .modulos-col-left {
        text-align: left !important;
    }

    .modulos-col-actions {
        white-space: nowrap;
    }

    .modulos-row-alt {
        background: #f8fafc !important;
    }

    .modulos-corr-badge,
    .modulos-orden-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 28px;
        padding: 2px 8px;
        border-radius: 8px;
        background: #eef2ff;
        color: #3730a3;
        font-size: 12px;
        font-weight: 700;
    }

    .modulos-name-cell {
        font-weight: 600;
        color: #0f172a;
    }

    .modulos-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 34px;
        height: 34px;
        border-radius: 8px;
        background: #f1f5f9;
        color: #334155;
        font-size: 16px;
    }

    .modulos-icon .glyphicon {
        font-size: 15px;
        top: 0;
    }

    .modulos-icon--empty {
        color: #94a3b8;
    }

    .modulos-ruta {
        display: inline-block;
        max-width: 100%;
        padding: 2px 6px;
        border-radius: 6px;
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        color: #334155;
        font-size: 11px;
        word-break: break-all;
    }

    .modulos-ruta--empty {
        background: transparent;
        border: 0;
        color: #94a3b8;
    }

    .modulos-actions {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 2px;
    }

    .modulos-actions .btn {
        width: 28px;
        height: 28px;
        padding: 0;
        line-height: 26px;
        border-radius: 7px;
    }

    .modulos-actions .btn i {
        font-size: 13px;
        line-height: 1;
    }

    .modulos-actions--locked {
        color: #94a3b8;
        font-size: 16px;
    }

    @media (max-width: 768px) {
        .modulos-filters {
            flex-direction: column;
            align-items: stretch;
        }

        .modulos-field--search,
        .modulos-field--estado,
        .modulos-field--categoria {
            flex: 1 1 auto;
            min-width: 0;
        }

        .modulos-grid-header {
            flex-direction: column;
            align-items: flex-start;
        }
    }

    /* Control de Detracciones */
    .control-detracc-page .control-detracc-filters {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .control-detracc-total-badge {
        display: inline-flex;
        align-items: center;
        padding: 6px 12px;
        border-radius: 999px;
        background: #eff6ff;
        color: #1d4ed8;
        font-size: 12px;
        font-weight: 600;
    }

    .control-detracc-loading {
        padding: 18px;
        text-align: center;
        color: #64748b;
        font-size: 13px;
    }

    .control-detracc-table thead th.text-right,
    .control-detracc-table tbody td.text-right {
        text-align: right !important;
    }

    .control-detracc-actions {
        white-space: nowrap;
    }

    .control-detracc-actions .btn {
        margin: 2px 1px;
        border-radius: 7px;
    }

    .detracc-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 82px;
        padding: 4px 10px;
        border-radius: 999px;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.25px;
    }

    .detracc-badge--pendiente {
        background: #fef3c7;
        color: #92400e;
        border: 1px solid #fde68a;
    }

    .detracc-badge--depositado {
        background: #dbeafe;
        color: #1d4ed8;
        border: 1px solid #bfdbfe;
    }

    .detracc-badge--verificado {
        background: #dcfce7;
        color: #166534;
        border: 1px solid #bbf7d0;
    }

    .control-detracc-modal {
        width: 640px;
        max-width: calc(100vw - 24px);
    }

    .control-detracc-modal--wide {
        width: 920px;
    }

    .control-detracc-modal-subtitle {
        margin: 6px 0 0;
        font-size: 12px;
        color: #64748b;
    }

    .control-detracc-help {
        margin: 12px 0 0;
        padding: 10px 12px;
        border-radius: 8px;
        background: #f8fafc;
        border: 1px dashed #cbd5e1;
        color: #475569;
        font-size: 12px;
    }

    .control-detracc-historial-table code {
        font-size: 11px;
        background: #f1f5f9;
        padding: 2px 6px;
        border-radius: 4px;
    }

    @media (max-width: 1199px) {
        .control-detracc-page .control-detracc-filters {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }
    }

    @media (max-width: 767px) {
        .control-detracc-page .control-detracc-filters {
            grid-template-columns: 1fr;
        }
    }

    /* Kárdex físico — plantilla ERP Base */
    body.nexo-app .kardex-fisico-page .kardex-fisico-filters {
        grid-template-columns: minmax(0, 1.1fr) minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr) auto;
    }

    body.nexo-app .kardex-fisico-page .kardex-fisico-field--actions .erp-module-filter-actions {
        justify-content: flex-end;
    }

    body.nexo-app .kardex-fisico-page #data_prod {
        display: none;
    }

    /* Buscador de producto — Kárdex físico */
    .ui-autocomplete.kardex-product-autocomplete {
        z-index: 2500;
        box-sizing: border-box;
        max-width: calc(100vw - 32px) !important;
        max-height: min(390px, calc(100vh - 132px));
        overflow-x: hidden;
        overflow-y: auto;
        margin: 4px 0 0;
        padding: 6px;
        border: 1px solid #cbd5e1;
        border-radius: 10px;
        background: #ffffff;
        box-shadow: 0 14px 34px rgba(15, 23, 42, 0.18);
        font-family: inherit;
    }

    .ui-autocomplete.kardex-product-autocomplete .kardex-product-suggestion {
        margin: 0;
        border: 0;
        border-bottom: 1px solid #e8eef5;
    }

    .ui-autocomplete.kardex-product-autocomplete .kardex-product-suggestion:last-child {
        border-bottom: 0;
    }

    .ui-autocomplete.kardex-product-autocomplete .kardex-product-suggestion__link {
        display: block;
        margin: 0;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 7px;
        background: transparent !important;
        color: #1e293b !important;
        text-decoration: none;
    }

    .ui-autocomplete.kardex-product-autocomplete .kardex-product-suggestion__content {
        display: grid;
        grid-template-columns: auto minmax(170px, 1fr) auto auto;
        align-items: center;
        gap: 12px;
        min-height: 54px;
        padding: 8px 10px;
    }

    .ui-autocomplete.kardex-product-autocomplete .kardex-product-suggestion__code {
        min-width: 62px;
        padding: 4px 7px;
        border-radius: 5px;
        background: #eaf2ff;
        color: #175cd3;
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
        font-size: 12px;
        font-weight: 700;
        line-height: 1.2;
        text-align: center;
        white-space: nowrap;
    }

    .ui-autocomplete.kardex-product-autocomplete .kardex-product-suggestion__name {
        overflow: hidden;
        color: #172b4d;
        font-size: 13px;
        font-weight: 600;
        line-height: 1.3;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .ui-autocomplete.kardex-product-autocomplete .kardex-product-suggestion__metric {
        display: flex;
        min-width: 76px;
        flex-direction: column;
        gap: 1px;
        padding-left: 11px;
        border-left: 1px solid #e2e8f0;
        line-height: 1.1;
        text-align: right;
        white-space: nowrap;
    }

    .ui-autocomplete.kardex-product-autocomplete .kardex-product-suggestion__metric small {
        color: #64748b;
        font-size: 10px;
        font-weight: 600;
        text-transform: uppercase;
    }

    .ui-autocomplete.kardex-product-autocomplete .kardex-product-suggestion__metric strong {
        color: #0f172a;
        font-size: 12px;
        font-weight: 700;
    }

    .ui-autocomplete.kardex-product-autocomplete .kardex-product-suggestion__metric--stock strong {
        color: #047857;
    }

    .ui-autocomplete.kardex-product-autocomplete .kardex-product-suggestion > .ui-state-focus,
    .ui-autocomplete.kardex-product-autocomplete .kardex-product-suggestion__link:hover {
        margin: 0;
        border: 0 !important;
        background: #edf5ff !important;
        color: #172b4d !important;
    }

    @media (max-width: 640px) {
        .ui-autocomplete.kardex-product-autocomplete {
            max-height: min(330px, calc(100vh - 116px));
            padding: 4px;
        }

        .ui-autocomplete.kardex-product-autocomplete .kardex-product-suggestion__content {
            grid-template-columns: auto minmax(0, 1fr);
            gap: 7px 9px;
            min-height: 0;
            padding: 9px 8px;
        }

        .ui-autocomplete.kardex-product-autocomplete .kardex-product-suggestion__name {
            white-space: normal;
        }

        .ui-autocomplete.kardex-product-autocomplete .kardex-product-suggestion__metric {
            min-width: 0;
            flex-direction: row;
            align-items: baseline;
            gap: 4px;
            padding-left: 0;
            border-left: 0;
            text-align: left;
        }

        .ui-autocomplete.kardex-product-autocomplete .kardex-product-suggestion__metric--price {
            grid-column: 1;
        }

        .ui-autocomplete.kardex-product-autocomplete .kardex-product-suggestion__metric--stock {
            grid-column: 2;
        }
    }

    body.nexo-app .kardex-fisico-page .kardex-fisico-grid-card .erp-module-table-wrap {
        min-height: 220px;
    }

    body.nexo-app .kardex-fisico-page #tbl {
        width: 100%;
        margin: 0;
        border-collapse: collapse;
        font-size: 13px;
        background: #fff;
    }

    body.nexo-app .kardex-fisico-page #tbl tr:first-child td {
        background: linear-gradient(135deg, #1e293b 0%, #334155 100%) !important;
        color: #f8fafc !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        text-transform: uppercase;
        letter-spacing: 0.35px;
        padding: 13px 12px !important;
        border: none !important;
        text-align: center;
        vertical-align: middle;
        white-space: nowrap;
    }

    body.nexo-app .kardex-fisico-page #tbl tr:first-child td:nth-child(7) {
        background: linear-gradient(135deg, #047857 0%, #059669 100%) !important;
    }

    body.nexo-app .kardex-fisico-page #tbl tr:first-child td:nth-child(8) {
        background: linear-gradient(135deg, #b91c1c 0%, #dc2626 100%) !important;
    }

    body.nexo-app .kardex-fisico-page #tbl tr:first-child td:nth-child(9) {
        background: linear-gradient(135deg, #b45309 0%, #d97706 100%) !important;
        color: #fff !important;
    }

    body.nexo-app .kardex-fisico-page #tbl tr:not(:first-child) td:nth-child(5),
    body.nexo-app .kardex-fisico-page #tbl tr:not(:first-child) td:nth-child(6) {
        text-align: left;
    }

    body.nexo-app .kardex-fisico-page #tbl tr:not(:first-child) td {
        padding: 11px 12px !important;
        border-top: 1px solid #eef2f7 !important;
        border-left: none !important;
        border-right: none !important;
        border-bottom: none !important;
        color: #475569;
        font-weight: 400 !important;
        font-size: 13px !important;
        vertical-align: middle;
    }

    body.nexo-app .kardex-fisico-page #tbl tr:not(:first-child):nth-child(even) {
        background: #fafbfc;
    }

    body.nexo-app .kardex-fisico-page #tbl tr:not(:first-child):hover td {
        background: #f1f5f9 !important;
    }

    body.nexo-app .kardex-fisico-page #tbl tr:not(:first-child) td:nth-child(7),
    body.nexo-app .kardex-fisico-page #tbl tr:not(:first-child) td:nth-child(8),
    body.nexo-app .kardex-fisico-page #tbl tr:not(:first-child) td:nth-child(9) {
        text-align: center;
        font-weight: 600 !important;
    }

    body.nexo-app .kardex-fisico-page #tbl tr:not(:first-child) td:nth-child(7) {
        color: #047857;
    }

    body.nexo-app .kardex-fisico-page #tbl tr:not(:first-child) td:nth-child(8) {
        color: #b91c1c;
    }

    body.nexo-app .kardex-fisico-page #tbl tr:not(:first-child) td:nth-child(9) {
        color: #b45309;
        font-weight: 700 !important;
    }

    @media (max-width: 1199px) {
        body.nexo-app .kardex-fisico-page .kardex-fisico-filters {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        body.nexo-app .kardex-fisico-page .kardex-fisico-field--producto {
            grid-column: span 2;
        }

        body.nexo-app .kardex-fisico-page .kardex-fisico-field--actions {
            grid-column: span 2;
        }
    }

    @media (max-width: 767px) {
        body.nexo-app .kardex-fisico-page .kardex-fisico-filters {
            grid-template-columns: 1fr;
        }

        body.nexo-app .kardex-fisico-page .kardex-fisico-field--producto,
        body.nexo-app .kardex-fisico-page .kardex-fisico-field--actions {
            grid-column: auto;
        }

        body.nexo-app .kardex-fisico-page .kardex-fisico-field--actions .erp-module-filter-actions {
            justify-content: stretch;
        }

        body.nexo-app .kardex-fisico-page .kardex-fisico-field--actions .erp-module-filter-actions .btn {
            flex: 1 1 0;
        }
    }

    /* Reporte stock valorizado — dashboard gerencial */
    .reporte-sv-dashboard .reporte-sv-kpis {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .reporte-sv-kpi--primary .reporte-tv-stat-value {
        color: #0f766e;
    }

    .reporte-sv-kpi--warn .reporte-tv-stat-value {
        color: #b45309;
    }

    .reporte-sv-alert-banner {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 12px 16px;
        margin-bottom: 14px;
        border-radius: 10px;
        border: 1px solid #fcd34d;
        background: #fffbeb;
        color: #92400e;
        font-size: 13px;
        font-weight: 600;
    }

    .reporte-sv-alert-banner .glyphicon {
        font-size: 16px;
        color: #d97706;
    }

    .reporte-sv-alerta-filtros {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 6px;
    }

    .reporte-sv-alerta-label {
        font-size: 12px;
        font-weight: 600;
        color: #64748b;
        margin-right: 4px;
    }

    .reporte-sv-alerta-btn {
        border-radius: 999px !important;
        font-size: 11px !important;
        padding: 4px 12px !important;
    }

    .reporte-sv-alerta-btn.is-active,
    .reporte-sv-alerta-btn:hover,
    .reporte-sv-alerta-btn:focus {
        background: #0f766e !important;
        border-color: #0f766e !important;
        color: #fff !important;
    }

    .reporte-sv-badge {
        display: inline-block;
        padding: 3px 8px;
        border-radius: 999px;
        font-size: 10px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.02em;
        white-space: nowrap;
    }

    .reporte-sv-badge--sin-costo {
        background: #fef3c7;
        color: #92400e;
        border: 1px solid #fcd34d;
    }

    .reporte-sv-badge--sin-stock {
        background: #f1f5f9;
        color: #64748b;
        border: 1px solid #cbd5e1;
    }

    .reporte-sv-badge--alto-valor {
        background: #d1fae5;
        color: #065f46;
        border: 1px solid #6ee7b7;
    }

    .reporte-sv-badge--normal {
        background: #eff6ff;
        color: #1d4ed8;
        border: 1px solid #bfdbfe;
    }

    .reporte-sv-cell-valor {
        font-weight: 700;
        color: #0f766e;
    }

    .reporte-sv-cell-valor--warn {
        color: #b45309;
    }

    .reporte-sv-cell-valor--high {
        color: #047857;
    }

    .reporte-sv-grid-tools {
        flex-wrap: wrap;
        gap: 10px;
    }

    .reporte-sv-loading {
        display: none;
        align-items: center;
        justify-content: center;
        gap: 10px;
        min-height: 120px;
        color: #64748b;
        font-weight: 600;
    }

    .reporte-sv-loading.is-visible {
        display: flex;
    }

    .reporte-sv-loading-spinner {
        width: 22px;
        height: 22px;
        border: 3px solid #e2e8f0;
        border-top-color: #0f766e;
        border-radius: 50%;
        animation: reporteSvSpin 0.8s linear infinite;
    }

    @keyframes reporteSvSpin {
        to { transform: rotate(360deg); }
    }

    @media (max-width: 1199px) {
        .reporte-sv-dashboard .reporte-sv-kpis {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }
    }

    @media (max-width: 767px) {
        .reporte-sv-dashboard .reporte-sv-kpis {
            grid-template-columns: 1fr;
        }

        .reporte-sv-grid-header .reporte-sv-grid-tools {
            flex-direction: column;
            align-items: stretch;
        }

        .reporte-sv-alerta-filtros {
            overflow-x: auto;
            flex-wrap: nowrap;
            padding-bottom: 4px;
        }

        .reporte-sv-col-desktop,
        .reporte-sv-grid-card .k-grid th.reporte-sv-col-desktop,
        .reporte-sv-grid-card .k-grid td.reporte-sv-col-desktop {
            display: none !important;
        }

        .reporte-sv-filters .col-lg-3,
        .reporte-sv-filters .col-lg-4 {
            margin-bottom: 8px;
        }
    }

    @media (max-width: 480px) {
        .reporte-sv-dashboard .reporte-ru-toolbar {
            flex-direction: column;
            align-items: stretch;
        }

        .reporte-sv-dashboard .reporte-ru-toolbar .btn,
        .reporte-sv-dashboard .reporte-ru-export {
            width: 100%;
        }

        .reporte-sv-dashboard .reporte-ru-export .dropdown-toggle {
            width: 100%;
            text-align: center;
        }
    }

    /* Reporte Productos sin Movimiento (reporte-psm-*) */
    .reporte-psm-dashboard .reporte-psm-kpis {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .reporte-psm-kpi--primary .reporte-tv-stat-value {
        color: #0f766e;
    }

    .reporte-psm-kpi--warn .reporte-tv-stat-value,
    .reporte-psm-kpi-producto {
        font-size: 13px !important;
        line-height: 1.3;
    }

    .reporte-psm-estado-filtros {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 6px;
    }

    .reporte-psm-estado-label {
        font-size: 11px;
        font-weight: 700;
        color: #64748b;
        margin-right: 4px;
    }

    .reporte-psm-estado-btn {
        border-radius: 999px !important;
        font-size: 11px !important;
        padding: 4px 10px !important;
    }

    .reporte-psm-estado-btn.is-active,
    .reporte-psm-estado-btn:hover,
    .reporte-psm-estado-btn:focus {
        background: #0f766e !important;
        border-color: #0f766e !important;
        color: #fff !important;
    }

    .reporte-psm-badge {
        display: inline-block;
        padding: 3px 8px;
        border-radius: 999px;
        font-size: 10px;
        font-weight: 700;
        white-space: nowrap;
    }

    .reporte-psm-badge--critico {
        background: #fee2e2;
        color: #991b1b;
        border: 1px solid #fca5a5;
    }

    .reporte-psm-badge--alto {
        background: #ffedd5;
        color: #9a3412;
        border: 1px solid #fdba74;
    }

    .reporte-psm-badge--medio {
        background: #fef9c3;
        color: #854d0e;
        border: 1px solid #fde047;
    }

    .reporte-psm-badge--bajo {
        background: #d1fae5;
        color: #065f46;
        border: 1px solid #6ee7b7;
    }

    .reporte-psm-grid-tools {
        flex-wrap: wrap;
        gap: 10px;
    }

    .reporte-psm-loading {
        display: none;
        align-items: center;
        justify-content: center;
        gap: 10px;
        min-height: 120px;
        color: #64748b;
        font-weight: 600;
    }

    .reporte-psm-loading.is-visible {
        display: flex;
    }

    .reporte-psm-loading-spinner {
        width: 22px;
        height: 22px;
        border: 3px solid #e2e8f0;
        border-top-color: #0f766e;
        border-radius: 50%;
        animation: reportePsmSpin 0.8s linear infinite;
    }

    @keyframes reportePsmSpin {
        to { transform: rotate(360deg); }
    }

    @media (max-width: 1199px) {
        .reporte-psm-dashboard .reporte-psm-kpis {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }
    }

    @media (max-width: 767px) {
        .reporte-psm-dashboard .reporte-psm-kpis {
            grid-template-columns: 1fr;
        }

        .reporte-psm-grid-header .reporte-psm-grid-tools {
            flex-direction: column;
            align-items: stretch;
        }

        .reporte-psm-estado-filtros {
            overflow-x: auto;
            flex-wrap: nowrap;
            padding-bottom: 4px;
        }

        .reporte-psm-col-desktop,
        .reporte-psm-grid-card .k-grid th.reporte-psm-col-desktop,
        .reporte-psm-grid-card .k-grid td.reporte-psm-col-desktop {
            display: none !important;
        }
    }

/* Cajas: resumen operativo compacto. Los medios de pago viven en el detalle para evitar desplazamiento horizontal. */
.cajas-page {
    padding: 0 10px 8px;
}

.cajas-page .cajas-panel {
    margin-bottom: 10px;
}

.cajas-page .cajas-panel-head {
    margin-bottom: 8px;
}

.cajas-page .cajas-estado-alert {
    margin: 0 0 8px;
    padding: 9px 12px;
    font-size: 12px;
}

.cajas-page .cajas-filters {
    gap: 6px 8px;
}

.cajas-page .cajas-secondary-actions {
    margin-top: 8px;
    padding-top: 8px;
}

.cajas-page .cajas-total-row {
    margin-top: 8px;
}

.cajas-page .cajas-grid-card {
    overflow: hidden;
}

.cajas-page .cajas-grid-card .k-grid,
.cajas-page .cajas-grid-card .k-grid-header,
.cajas-page .cajas-grid-card .k-grid-header-wrap {
    overflow: hidden !important;
}

.cajas-page .cajas-grid-card .k-grid-content {
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

.cajas-page .cajas-grid-card .k-grid-header table,
.cajas-page .cajas-grid-card .k-grid-content table {
    width: 100% !important;
    min-width: 0 !important;
    table-layout: fixed !important;
}

.cajas-page .cajas-grid-card .k-grid th,
.cajas-page .cajas-grid-card .k-grid td {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    vertical-align: middle;
}

.cajas-page .k-grid-header th.k-header {
    padding: 9px 7px;
}

.cajas-page .k-grid-content td {
    padding: 7px 8px;
}

.cajas-turno {
    display: grid;
    gap: 2px;
    line-height: 1.2;
}

.cajas-turno strong {
    color: #334155;
    font-size: 11px;
}

.cajas-turno span,
.cajas-turno small {
    color: #64748b;
    font-size: 11px;
}

.cajas-turno small {
    color: #94a3b8;
}

.cajas-actions-compact {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 4px;
}

.cajas-actions-compact .cajas-btn-detalle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-height: 30px;
    padding: 5px 7px;
    border-color: #bfdbfe;
    color: #1d4ed8;
    background: #eff6ff;
    font-weight: 600;
}

.cajas-page .cajas-actions-compact .notas-grid-icon-btn {
    width: 30px;
    height: 30px;
}

.cajas-detail-modal-dialog {
    width: 860px;
    max-width: calc(100vw - 24px);
    margin: 18px auto;
}

.cajas-detail-modal-content {
    max-height: calc(100vh - 36px);
    overflow: hidden;
    border: 0;
    border-radius: 14px;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.22);
}

.cajas-detail-modal-header {
    padding: 16px 20px;
    color: #fff;
    border: 0;
    background: linear-gradient(135deg, #0f766e 0%, #115e59 100%);
}

.cajas-detail-modal-header .close {
    color: #fff;
    opacity: .88;
    text-shadow: none;
}

.cajas-detail-modal-header .modal-title {
    font-size: 18px;
    font-weight: 700;
}

.cajas-detail-modal-subtitle {
    margin: 4px 0 0;
    font-size: 12px;
    opacity: .9;
}

.cajas-detail-modal-body {
    overflow-y: auto;
    padding: 16px 20px;
}

.cajas-detail-periodo {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.cajas-detail-periodo > div,
.cajas-detail-item {
    display: grid;
    gap: 4px;
    padding: 10px 12px;
    border: 1px solid #e2e8f0;
    border-radius: 9px;
    background: #fff;
}

.cajas-detail-periodo span,
.cajas-detail-item span {
    color: #64748b;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
}

.cajas-detail-periodo strong,
.cajas-detail-item strong {
    color: #1e293b;
    font-size: 14px;
    font-variant-numeric: tabular-nums;
}

.cajas-detail-modal-body h5 {
    margin: 0 0 8px;
    color: #334155;
    font-size: 13px;
    font-weight: 700;
}

.cajas-detail-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.cajas-detail-item--featured {
    background: #ecfdf5;
    border-color: #a7f3d0;
}

.cajas-detail-item--featured strong {
    color: #047857;
    font-size: 16px;
}

@media (max-width: 960px) {
    .cajas-page .cajas-field--vendedor {
        width: 200px;
    }

    .cajas-detail-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .cajas-page {
        padding: 0 6px 6px;
    }

    .cajas-panel-head h2 {
        font-size: 20px;
    }

    .cajas-page .cajas-field--fecha {
        width: calc(50% - 4px);
    }

    .cajas-page .cajas-filters-inline,
    .cajas-page .cajas-field--vendedor,
    .cajas-page .cajas-field--actions {
        width: 100%;
        max-width: none;
    }

    .cajas-page .cajas-filter-actions .btn {
        flex: 1;
    }

    .cajas-page .k-grid-header th.k-header,
    .cajas-page .k-grid-content td {
        padding: 6px 4px;
        font-size: 11px;
    }

    .cajas-page .cajas-actions-compact .cajas-btn-detalle span {
        display: none;
    }

    .cajas-page .cajas-actions-compact .cajas-btn-detalle {
        width: 30px;
        padding: 5px;
    }

    .cajas-detail-periodo,
    .cajas-detail-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cajas-detail-modal-body {
        padding: 12px;
    }
}
/* Grilla plana de Cajas: altura natural, sin bloque vacío ni columnas auxiliares. */
.cajas-page .cajas-grid-card .k-grid,
.cajas-page .cajas-grid-card .k-grid-content {
    height: auto !important;
}

.cajas-turno-abierto {
    display: inline-block;
    color: #0284c7;
    font-size: 12px;
    font-weight: 700;
}
/* Refinamiento UX: módulo de Caja (sin cambios de reglas ni cálculos). */
.cajas-page {
    padding: 0 12px 16px;
}

.cajas-current-card,
.cajas-history-panel {
    margin: 0 0 12px;
    padding: 16px 18px;
    border: 1px solid #dbe7f4;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(15, 42, 74, 0.05);
}

.cajas-current-card {
    border-left: 4px solid #2563eb;
}

.cajas-current-card--open {
    border-left-color: #059669;
}

.cajas-current-head,
.cajas-history-toolbar,
.cajas-current-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.cajas-current-title-wrap {
    display: flex;
    align-items: center;
    gap: 11px;
}

.cajas-current-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    color: #fff;
    background: linear-gradient(135deg, #1e3a5f 0%, #2563eb 100%);
    font-size: 16px;
}

.cajas-current-eyebrow {
    margin: 0 0 3px;
    color: #64748b;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
    line-height: 1.1;
}

.cajas-current-card h2,
.cajas-history-toolbar h3 {
    margin: 0;
    color: #102a43;
    font-size: 20px;
    font-weight: 700;
}

.cajas-history-toolbar h3 {
    font-size: 16px;
}

.cajas-current-badge,
.cajas-estado-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 26px;
    padding: 5px 10px;
    border-radius: 999px;
    background: #fef2f2;
    color: #b91c1c;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .04em;
}

.cajas-current-card--open .cajas-current-badge {
    background: #ecfdf5;
    color: #047857;
}

.cajas-current-data {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
    margin-top: 14px;
}

.cajas-current-data-item {
    display: grid;
    gap: 3px;
    min-height: 60px;
    padding: 9px 10px;
    border: 1px solid #e4edf7;
    border-radius: 9px;
    background: #f8fbff;
}

.cajas-current-data-item > span,
.cajas-current-data-item small {
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .025em;
    text-transform: uppercase;
}

.cajas-current-data-item strong {
    overflow: hidden;
    color: #1e3a5f;
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cajas-current-data-item small {
    color: #94a3b8;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
}

.cajas-current-message {
    margin-top: 10px;
    color: #475569;
    font-size: 12px;
    line-height: 1.35;
}

.cajas-current-actions {
    margin-top: 12px;
    padding-top: 11px;
    border-top: 1px solid #e7eef7;
}

.cajas-ver-turno {
    color: #1d4ed8;
    border-color: #bfdbfe;
    background: #eff6ff;
    font-weight: 600;
}

.cajas-page .cajas-secondary-actions {
    display: flex;
    flex: 1;
    justify-content: flex-end;
    gap: 7px;
    margin: 0;
    padding: 0;
    border: 0;
}

.cajas-page .cajas-secondary-actions .btn {
    min-height: 34px;
    border-radius: 8px;
    font-weight: 700;
}

.cajas-page .cajas-secondary-actions .btn_cerrar_cajaMov {
    background: #dc2626;
    border-color: #dc2626;
}

.cajas-page .cajas-secondary-actions .btn_agregar_cajaMov {
    background: #059669;
    border-color: #059669;
}

.cajas-history-toolbar {
    margin-bottom: 12px;
}

.cajas-page .cajas-total-badge {
    margin: 0;
    white-space: nowrap;
}

.cajas-page .cajas-filters {
    display: grid;
    grid-template-columns: 132px 132px minmax(190px, 1fr) 130px auto;
    gap: 8px;
    align-items: end;
}

.cajas-page .cajas-field {
    width: auto;
    max-width: none;
}

.cajas-page .cajas-field--fecha,
.cajas-page .cajas-field--vendedor,
.cajas-page .cajas-field--estado,
.cajas-page .cajas-field--actions {
    width: auto;
    max-width: none;
}

.cajas-page .cajas-filters-inline {
    display: contents;
}

.cajas-page .cajas-field label {
    margin-bottom: 4px;
    color: #475569;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.cajas-page .cajas-field .form-control {
    height: 34px;
    border-color: #cbd9e8;
    border-radius: 8px;
    box-shadow: none;
    font-size: 12px;
}

.cajas-page .cajas-filter-actions {
    display: flex;
    gap: 6px;
}

.cajas-page .cajas-filter-actions .btn {
    min-height: 34px;
    border-radius: 8px;
    font-weight: 700;
}

.cajas-page .cajas-grid-card {
    margin-top: 0;
    border: 1px solid #dbe7f4;
    border-radius: 14px;
    box-shadow: 0 8px 22px rgba(15, 42, 74, 0.05);
}

.cajas-page .cajas-grid-header {
    padding: 13px 16px;
    border-bottom: 1px solid #e5edf7;
    background: #fff;
}

.cajas-page .cajas-grid-header h3 {
    color: #102a43;
}

.cajas-page .cajas-grid-header p {
    margin-top: 3px;
    font-size: 11px;
}

.cajas-page .k-grid-header {
    background: #18375d;
}

.cajas-page .k-grid-header th.k-header {
    padding: 9px 7px;
    background: #18375d;
    color: #fff;
    font-size: 10px;
}

.cajas-page .k-grid-content td {
    padding: 8px 7px;
}

.cajas-grid-actions {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
}

.cajas-grid-action {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    color: #475569;
    font-size: 10px;
    font-weight: 700;
}

.cajas-page .cajas-grid-action .notas-grid-icon-btn {
    width: 28px;
    height: 28px;
    margin: 0;
}

.cajas-page .cajas-grid-action .notas-grid-icon-btn img {
    width: 16px;
    height: 16px;
}

.cajas-page .cajas-grid-action .cajas-btn-ticket .glyphicon {
    font-size: 14px;
}

.cajas-turno-abierto {
    color: #047857;
    font-size: 11px;
    font-weight: 700;
}

.cajas-apertura-modal-dialog {
    width: 560px;
    max-width: calc(100vw - 24px);
    margin: 30px auto;
}

.cajas-apertura-modal-content {
    overflow: hidden;
    border: 0;
    border-radius: 14px;
    box-shadow: 0 20px 50px rgba(15, 42, 74, .22);
}

.cajas-apertura-modal-header {
    padding: 15px 18px 12px;
    border-bottom: 1px solid #e5edf7;
    background: #fff;
}

.cajas-apertura-modal-header .close {
    color: #64748b;
    opacity: .8;
}

.cajas-apertura-modal-header .modal-title {
    margin: 0;
    color: #102a43;
    font-size: 19px;
    font-weight: 700;
}

.cajas-apertura-modal-body {
    padding: 17px 18px 8px;
}

.cajas-apertura-context {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 18px;
}

.cajas-apertura-context-item {
    display: grid;
    gap: 3px;
    min-height: 60px;
    padding: 9px;
    border: 1px solid #e4edf7;
    border-radius: 9px;
    background: #f8fbff;
}

.cajas-apertura-context-item span,
.cajas-apertura-context-item small {
    color: #64748b;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
}

.cajas-apertura-context-item strong {
    overflow: hidden;
    color: #1e3a5f;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cajas-apertura-context-item small {
    color: #94a3b8;
    font-size: 10px;
    font-weight: 500;
    text-transform: none;
}

.cajas-apertura-monto-field {
    margin-bottom: 10px;
}

.cajas-apertura-monto-field label {
    color: #334155;
    font-size: 12px;
    font-weight: 700;
}

.cajas-apertura-monto-field .input-group-addon {
    color: #1e3a5f;
    border-color: #bfdbfe;
    background: #eff6ff;
    font-weight: 800;
}

.cajas-apertura-monto-field .form-control {
    height: 42px;
    border-color: #93c5fd;
    font-size: 18px;
    font-weight: 700;
}

.cajas-apertura-monto-field .help-block {
    margin: 6px 0 0;
    color: #64748b;
    font-size: 11px;
}

.cajas-apertura-modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin: 0;
    padding: 12px 18px;
    border-top: 1px solid #e5edf7;
    background: #f8fafc;
}

.cajas-apertura-modal-footer .btn {
    min-height: 34px;
    border-radius: 8px;
    font-weight: 700;
}

@media (max-width: 1100px) {
    .cajas-current-data {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cajas-page .cajas-filters {
        grid-template-columns: 132px 132px minmax(180px, 1fr) 125px;
    }

    .cajas-page .cajas-field--actions {
        grid-column: 1 / -1;
    }
}

@media (max-width: 700px) {
    .cajas-page {
        padding: 0 7px 10px;
    }

    .cajas-current-card,
    .cajas-history-panel {
        padding: 13px;
        border-radius: 11px;
    }

    .cajas-current-head,
    .cajas-history-toolbar,
    .cajas-current-actions {
        align-items: flex-start;
    }

    .cajas-current-head,
    .cajas-history-toolbar {
        flex-direction: column;
    }

    .cajas-current-badge {
        align-self: flex-start;
    }

    .cajas-current-data,
    .cajas-page .cajas-filters,
    .cajas-apertura-context {
        grid-template-columns: 1fr;
    }

    .cajas-current-actions {
        flex-direction: column;
    }

    .cajas-ver-turno,
    .cajas-page .cajas-secondary-actions,
    .cajas-page .cajas-secondary-actions .btn {
        width: 100%;
    }

    .cajas-page .cajas-secondary-actions {
        justify-content: stretch;
        flex-wrap: wrap;
    }

    .cajas-page .cajas-filter-actions,
    .cajas-page .cajas-filter-actions .btn {
        width: 100%;
    }

    .cajas-page .cajas-filter-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cajas-apertura-modal-dialog {
        width: auto;
        max-width: none;
        min-height: 100vh;
        margin: 0;
    }

    .cajas-apertura-modal-content {
        min-height: 100vh;
        border-radius: 0;
    }

    .cajas-apertura-modal-footer {
        position: sticky;
        bottom: 0;
    }
}
/* Consulta del historial integrada a la operación de caja. */
.cajas-page .cajas-current-history {
    margin-top: 13px;
    padding-top: 12px;
    border-top: 1px solid #e7eef7;
}

.cajas-page .cajas-current-history .cajas-history-toolbar {
    margin-bottom: 9px;
}

.cajas-page .cajas-current-history .cajas-history-toolbar h3 {
    font-size: 14px;
}

.cajas-page .cajas-current-history .cajas-total-badge {
    margin: 0;
}

.cajas-page .cajas-current-history .cajas-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 8px;
}

.cajas-page .cajas-current-history .cajas-field--fecha {
    flex: 0 0 132px;
}

.cajas-page .cajas-current-history .cajas-field--vendedor {
    flex: 0 1 330px;
    width: 330px;
}

.cajas-page .cajas-current-history .cajas-field--estado {
    flex: 0 0 130px;
}

.cajas-page .cajas-current-history .cajas-field--actions {
    flex: 0 0 auto;
}

@media (max-width: 700px) {
    .cajas-page .cajas-current-history .cajas-history-toolbar {
        flex-direction: column;
        align-items: flex-start;
    }

    .cajas-page .cajas-current-history .cajas-field--fecha,
    .cajas-page .cajas-current-history .cajas-field--vendedor,
    .cajas-page .cajas-current-history .cajas-field--estado,
    .cajas-page .cajas-current-history .cajas-field--actions {
        flex: 1 1 100%;
        width: 100%;
    }
}
/* Estado resumido junto al título de la operación de caja. */
.cajas-page .cajas-current-title-wrap {
    flex: 1;
    min-width: 0;
}

.cajas-page .cajas-current-heading-row {
    display: flex;
    align-items: baseline;
    min-width: 0;
    gap: 9px;
}

.cajas-page .cajas-current-heading-row h2 {
    flex: 0 0 auto;
    white-space: nowrap;
}

.cajas-page .cajas-current-title-separator {
    color: #cbd5e1;
    font-size: 18px;
    font-weight: 400;
}

.cajas-page .cajas-current-heading-row .cajas-current-message {
    min-width: 0;
    margin: 0;
    color: #64748b;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.35;
}

@media (max-width: 1100px) {
    .cajas-page .cajas-current-heading-row {
        flex-wrap: wrap;
        gap: 3px 7px;
    }

    .cajas-page .cajas-current-title-separator {
        display: none;
    }

    .cajas-page .cajas-current-heading-row .cajas-current-message {
        flex-basis: 100%;
    }
}
/* Cierre operativo junto a los filtros y total dentro de la grilla de turnos. */
.cajas-page .cajas-current-history .cajas-filter-cash-action {
    align-self: flex-end;
    min-width: max-content;
}

.cajas-page .cajas-grid-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.cajas-page .cajas-grid-header .cajas-total-badge {
    flex: 0 0 auto;
    margin: 0;
    white-space: nowrap;
}

@media (max-width: 700px) {
    .cajas-page .cajas-current-history .cajas-filter-cash-action {
        align-self: stretch;
        min-width: 0;
    }

    .cajas-page .cajas-grid-header {
        align-items: flex-start;
        flex-direction: column;
    }
}
/* Prueba tipográfica exclusiva del módulo Caja. */
.cajas-page,
.cajas-page .form-control,
.cajas-page .btn,
.cajas-page .k-widget,
.cajas-page .k-grid,
.cajas-page .k-dropdown,
.cajas-page .k-input {
    font-family: var(--nexo-font);
}

.cajas-page .cajas-current-card h2,
.cajas-page .cajas-grid-header h3,
.cajas-page .cajas-history-toolbar h3 {
    font-family: var(--nexo-font);
    letter-spacing: -.012em;
}

.cajas-page .cajas-current-data-item strong,
.cajas-page .k-grid td,
.cajas-page .k-grid th {
    font-variant-numeric: tabular-nums;
}
/* Cierre de caja: resumen compacto y arqueo físico opcional. */
.cajas-cierre-modal-dialog {
    width: 1040px;
    max-width: calc(100vw - 24px);
    margin: 16px auto;
}

.cajas-cierre-modal-content {
    display: flex;
    max-height: calc(100vh - 32px);
    flex-direction: column;
    border-radius: 14px;
}

.cajas-cierre-modal-header {
    flex: 0 0 auto;
    padding: 13px 18px;
    background: linear-gradient(135deg, #15375f 0%, #2563eb 100%);
}

.cajas-cierre-modal-header-inner {
    gap: 10px;
}

.cajas-cierre-modal-icon {
    width: 36px;
    height: 36px;
    border-radius: 9px;
    font-size: 15px;
}

.cajas-cierre-modal-eyebrow {
    margin: 0 0 2px;
    color: rgba(255, 255, 255, .72);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .08em;
}

.cajas-cierre-modal-header .modal-title {
    font-family: var(--nexo-font);
    font-size: 17px;
}

.cajas-cierre-modal-subtitle {
    margin-top: 1px;
    font-size: 11px;
}

.cajas-cierre-modal-body {
    min-height: 0;
    max-height: none;
    flex: 1 1 auto;
    padding: 11px 16px;
    background: #f5f8fc;
}

.cajas-cierre-info-bar--compact {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 7px;
    margin-bottom: 9px;
}

.cajas-cierre-info-item {
    min-height: 58px;
    padding: 8px 9px;
    border-radius: 9px;
}

.cajas-cierre-info-label {
    margin-bottom: 3px;
    font-size: 9px;
}

.cajas-cierre-info-item strong {
    overflow: hidden;
    color: #173b66;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cajas-cierre-info-item small {
    display: block;
    margin-top: 2px;
    color: #8797ad;
    font-size: 9px;
}

.cajas-cierre-info-item--amount strong {
    color: #075d4f;
}

.cajas-cierre-section {
    margin-bottom: 9px;
    padding: 10px 12px;
    border-radius: 10px;
    box-shadow: none;
}

.cajas-cierre-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.cajas-cierre-section-title {
    margin: 0;
    font-size: 12px;
}

.cajas-cierre-section-total,
.cajas-cierre-section-note {
    color: #61758e;
    font-size: 10px;
    white-space: nowrap;
}

.cajas-cierre-section-total strong {
    margin-left: 4px;
    color: #173b66;
    font-size: 12px;
}

.cajas-cierre-grid,
.cajas-cierre-grid--compact,
.cajas-cierre-grid--ventas {
    grid-template-columns: repeat(4, minmax(112px, 1fr));
    gap: 8px 10px;
}

.cajas-cierre-grid--cobros,
.cajas-cierre-grid--efectivo {
    grid-template-columns: repeat(5, minmax(112px, 1fr));
}

.cajas-cierre-field label {
    margin-bottom: 3px;
    color: #5d718b;
    font-size: 10px;
}

.cajas-cierre-field .form-control {
    width: 100%;
    max-width: 128px;
    height: 30px;
    margin-left: auto;
    padding: 4px 8px;
    text-align: right;
    font-size: 12px;
}

.cajas-cierre-readonly,
.cajas-cierre-total-input {
    background: #f8fbff !important;
}

.cajas-cierre-field--expected .form-control {
    color: #075d4f;
    border-color: #86dfc5 !important;
    background: #ecfdf5 !important;
    font-size: 13px;
    font-weight: 800;
}

.cajas-arqueo-section {
    overflow: hidden;
    margin-bottom: 2px;
    border: 1px solid #dce7f3;
    border-radius: 10px;
    background: #fff;
}

.cajas-arqueo-toggle {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    padding: 10px 12px;
    border: 0;
    color: #234166;
    background: #f8fbff;
    font-size: 12px;
    font-weight: 700;
    text-align: left;
}

.cajas-arqueo-toggle:hover,
.cajas-arqueo-toggle:focus {
    background: #eff6ff;
    outline: 0;
}

.cajas-arqueo-toggle small {
    display: inline-block;
    margin-left: 6px;
    padding: 2px 6px;
    border-radius: 999px;
    color: #5d718b;
    background: #e7eef7;
    font-size: 9px;
    font-weight: 700;
}

.cajas-arqueo-toggle-icon {
    transition: transform .16s ease;
}

.cajas-arqueo-toggle.is-open .cajas-arqueo-toggle-icon {
    transform: rotate(180deg);
}

.cajas-arqueo-panel {
    padding: 11px 12px 12px;
    border-top: 1px solid #dce7f3;
}

.cajas-arqueo-panel-head h5 {
    margin: 0;
    color: #173b66;
    font-size: 12px;
    font-weight: 800;
}

.cajas-arqueo-panel-head p {
    margin: 2px 0 9px;
    color: #718399;
    font-size: 10px;
}

.cajas-arqueo-denominaciones {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px 10px;
}

.cajas-arqueo-row {
    display: grid;
    grid-template-columns: minmax(92px, .8fr) minmax(0, 1.45fr);
    align-items: center;
    gap: 8px;
    min-width: 0;
    padding: 6px 7px;
    border: 1px solid #e2eaf4;
    border-radius: 8px;
    background: #fbfdff;
}

.cajas-arqueo-denom span {
    display: block;
    color: #74879d;
    font-size: 9px;
    line-height: 1.1;
}

.cajas-arqueo-denom strong {
    color: #173b66;
    font-size: 12px;
}

.cajas-arqueo-operacion {
    display: grid;
    grid-template-columns: 48px minmax(64px, 1fr) 78px;
    align-items: center;
    gap: 5px;
    min-width: 0;
    color: #6a7d93;
    font-size: 10px;
    white-space: nowrap;
}

.cajas-arqueo-cantidad {
    height: 28px;
    min-width: 0;
    padding: 3px 5px;
    text-align: right;
    font-size: 12px;
}

.cajas-arqueo-subtotal {
    overflow: hidden;
    color: #173b66;
    font-size: 11px;
    font-weight: 800;
    text-align: right;
    text-overflow: ellipsis;
}

.cajas-arqueo-resultados {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 7px;
    margin-top: 9px;
}

.cajas-arqueo-resultados > div:not(.cajas-arqueo-estado) {
    display: grid;
    gap: 2px;
    padding: 7px 8px;
    border: 1px solid #dce7f3;
    border-radius: 8px;
    background: #f8fbff;
}

.cajas-arqueo-resultados span {
    color: #718399;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
}

.cajas-arqueo-resultados strong {
    color: #173b66;
    font-size: 13px;
}

.cajas-arqueo-estado {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 7px;
    border-radius: 8px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .02em;
    text-align: center;
}

.cajas-arqueo-estado--correcto {
    color: #047857;
    background: #ecfdf5;
}

.cajas-arqueo-estado--faltante {
    color: #b91c1c;
    background: #fef2f2;
}

.cajas-arqueo-estado--sobrante {
    color: #1d4ed8;
    background: #eff6ff;
}

.cajas-cierre-modal-footer {
    position: sticky;
    z-index: 2;
    bottom: 0;
    flex: 0 0 auto;
    padding: 10px 16px;
}

.cajas-cierre-btn-cancel,
.cajas-cierre-btn-close {
    min-width: 112px;
    padding: 7px 13px;
}

@media (max-width: 980px) {
    .cajas-cierre-info-bar--compact {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .cajas-cierre-grid--cobros,
    .cajas-cierre-grid--efectivo {
        grid-template-columns: repeat(3, minmax(112px, 1fr));
    }
}

@media (max-width: 768px) {
    .cajas-cierre-modal-dialog {
        width: auto;
        max-width: calc(100vw - 12px);
        margin: 6px auto;
    }

    .cajas-cierre-modal-content {
        max-height: calc(100vh - 12px);
        border-radius: 10px;
    }

    .cajas-cierre-modal-body {
        padding: 9px 10px;
    }

    .cajas-cierre-info-bar--compact,
    .cajas-cierre-grid--ventas,
    .cajas-cierre-grid--cobros,
    .cajas-cierre-grid--efectivo,
    .cajas-arqueo-denominaciones,
    .cajas-arqueo-resultados {
        grid-template-columns: 1fr;
    }

    .cajas-cierre-section-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 3px;
    }

    .cajas-cierre-field .form-control {
        max-width: 100%;
    }

    .cajas-arqueo-row {
        grid-template-columns: 94px minmax(0, 1fr);
    }

    .cajas-cierre-modal-footer {
        padding: 9px 10px;
    }
}
/* Caja: estados legibles, constancias compactas y alineación de importes. */
.cajas-page .cajas-grid-card .k-grid-header th.k-header,
.cajas-page .cajas-grid-card .k-grid-content td {
    vertical-align: middle !important;
}

.cajas-page .cajas-estado-badge--apertura {
    background: #ecfdf5;
    border-color: #a7f3d0;
    color: #047857;
}

.cajas-page .cajas-estado-badge--cierre {
    background: #fef2f2;
    border-color: #fecaca;
    color: #b91c1c;
}

.cajas-page .cajas-grid-actions {
    gap: 6px;
}

.cajas-page .cajas-grid-actions .cajas-constancia-btn {
    align-items: center;
    background: #ffffff;
    border: 1px solid #dbe7f5;
    border-radius: 8px;
    display: inline-flex;
    height: 32px;
    justify-content: center;
    margin: 0;
    transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease;
    width: 32px;
}

.cajas-page .cajas-grid-actions .cajas-constancia-btn .glyphicon {
    font-size: 15px;
    line-height: 1;
}

.cajas-page .cajas-grid-actions .cajas-constancia-btn--a4 {
    background: #fff7f7;
    border-color: #fecaca;
    color: #c24141;
}

.cajas-page .cajas-grid-actions .cajas-constancia-btn--ticket {
    background: #eff6ff;
    border-color: #bfdbfe;
    color: #2563eb;
}

.cajas-page .cajas-grid-actions .cajas-constancia-btn:hover,
.cajas-page .cajas-grid-actions .cajas-constancia-btn:focus {
    box-shadow: 0 4px 10px rgba(15, 40, 76, .14);
    outline: 0;
    transform: translateY(-1px);
}

.cajas-page .cajas-grid-actions .cajas-constancia-btn--a4:hover,
.cajas-page .cajas-grid-actions .cajas-constancia-btn--a4:focus {
    background: #feecec;
    border-color: #f87171;
    color: #b91c1c;
}

.cajas-page .cajas-grid-actions .cajas-constancia-btn--ticket:hover,
.cajas-page .cajas-grid-actions .cajas-constancia-btn--ticket:focus {
    background: #dbeafe;
    border-color: #60a5fa;
    color: #1d4ed8;
}

.cajas-page .cajas-cierre-field {
    align-items: center;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.cajas-page .cajas-cierre-field label {
    align-self: center;
    text-align: center;
    width: 128px;
}

.cajas-page .cajas-cierre-field .form-control {
    margin-left: 0;
}

@media (max-width: 768px) {
    .cajas-page .cajas-cierre-field {
        align-items: stretch;
    }

    .cajas-page .cajas-cierre-field label {
        text-align: left;
        width: 100%;
    }
}
/* El modal se monta fuera de .cajas-page: centrar cada campo en su propio eje. */
.cajas-cierre-modal-content .cajas-cierre-info-item {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 66px;
    text-align: center;
}

.cajas-cierre-modal-content .cajas-cierre-info-label {
    font-size: 10px;
    text-align: center;
    width: 100%;
}

.cajas-cierre-modal-content .cajas-cierre-info-item strong,
.cajas-cierre-modal-content .cajas-cierre-info-item small {
    text-align: center;
    width: 100%;
}

.cajas-cierre-modal-content .cajas-cierre-info-item strong {
    font-size: 13px;
    line-height: 1.3;
}

.cajas-cierre-modal-content .cajas-cierre-field {
    align-items: start;
    display: grid;
    grid-template-columns: minmax(0, 128px);
    justify-content: center;
    min-width: 0;
}

.cajas-cierre-modal-content .cajas-cierre-field label {
    justify-self: center;
    margin: 0 0 5px;
    max-width: 100%;
    text-align: center;
    width: 128px;
}

.cajas-cierre-modal-content .cajas-cierre-field .form-control {
    height: 32px;
    justify-self: center;
    margin: 0 !important;
    max-width: 100%;
    width: 128px;
}
/* Caja: moneda visible y constancias centradas. */
.cajas-page .cajas-monto-moneda {
    color: #5d718b;
    font-size: 11px;
    font-weight: 700;
    margin-right: 3px;
}

.cajas-page .cajas-monto--total .cajas-monto-moneda {
    color: inherit;
}

.cajas-page .cajas-grid-actions {
    min-height: 36px;
}

.cajas-page .cajas-grid-actions .cajas-constancia-btn {
    height: 36px;
    vertical-align: middle;
    width: 36px;
}

.cajas-page .cajas-grid-actions .cajas-constancia-btn .glyphicon {
    align-items: center;
    display: flex;
    font-size: 18px;
    height: 100%;
    justify-content: center;
    line-height: 1 !important;
    position: static;
    top: auto;
    width: 100%;
}
/* Caja: icono Ticket como recibo. */
.cajas-page .cajas-grid-actions .cajas-ticket-icon {
    display: block;
    fill: none;
    height: 20px;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.9;
    width: 20px;
}
/* Caja: hereda la tipografía global de NEXO. */
.cajas-cierre-modal-content,
.cajas-cierre-modal-content .form-control,
.cajas-cierre-modal-content .btn {
    font-family: var(--nexo-font);
}
/* Caja: composición del modal de cierre basada en el mockup operativo. */
.cajas-cierre-modal-dialog {
    width: 1290px;
    max-width: calc(100vw - 32px);
}

.cajas-cierre-modal-content {
    border: 1px solid #dbe7f5;
    box-shadow: 0 18px 46px rgba(15, 40, 76, .24);
}

.cajas-cierre-modal-header {
    padding: 12px 20px;
}

.cajas-cierre-modal-icon {
    width: 42px;
    height: 42px;
    font-size: 18px;
}

.cajas-cierre-modal-body {
    overflow-x: hidden;
    overflow-y: auto;
    padding: 14px 18px;
}

.cajas-cierre-info-bar--compact {
    gap: 9px;
    margin-bottom: 14px;
}

.cajas-cierre-modal-content .cajas-cierre-info-item {
    align-items: center;
    border-color: #dce7f3;
    min-height: 70px;
    padding: 10px 11px;
}

.cajas-cierre-modal-content .cajas-cierre-info-item strong {
    font-size: 13px;
}

.cajas-cierre-dashboard {
    align-items: stretch;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(0, 1.52fr) minmax(340px, .88fr);
    margin-bottom: 12px;
}

.cajas-cierre-dashboard-main {
    display: grid;
    gap: 12px;
}

.cajas-cierre-dashboard .cajas-cierre-section {
    background: #ffffff;
    border: 1px solid #dce7f3;
    border-radius: 12px;
    box-shadow: 0 3px 12px rgba(15, 40, 76, .045);
    margin: 0;
    padding: 14px 16px;
}

.cajas-cierre-dashboard .cajas-cierre-section-head {
    margin-bottom: 10px;
}

.cajas-cierre-dashboard .cajas-cierre-section-title {
    color: #173b66;
    font-size: 15px;
    font-weight: 700;
}

.cajas-cierre-dashboard .cajas-cierre-section-title .glyphicon {
    margin-right: 8px;
}

.cajas-cierre-dashboard .cajas-cierre-section-total {
    background: #edf5ff;
    border-radius: 9px;
    color: #234166;
    font-size: 11px;
    padding: 8px 11px;
}

.cajas-cierre-dashboard .cajas-cierre-section-total strong {
    font-size: 13px;
}

.cajas-cierre-dashboard-main .cajas-cierre-grid--ventas {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 9px;
}

.cajas-cierre-dashboard-main .cajas-cierre-grid--cobros {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 9px;
}

.cajas-cierre-dashboard-main .cajas-cierre-field {
    background: #f8fbff;
    border: 1px solid #dce7f3;
    border-radius: 9px;
    display: block;
    min-height: 72px;
    padding: 8px 9px;
}

.cajas-cierre-dashboard-main .cajas-cierre-field label {
    align-items: center;
    color: #234166;
    display: flex;
    font-size: 11px;
    gap: 6px;
    margin: 0 0 8px;
    text-align: left;
    width: 100%;
}

.cajas-cierre-dashboard-main .cajas-cierre-field label .glyphicon {
    align-items: center;
    background: #e5f0ff;
    border-radius: 6px;
    color: #2563eb;
    display: inline-flex;
    font-size: 12px;
    height: 24px;
    justify-content: center;
    width: 24px;
}

.cajas-cierre-dashboard-main .cajas-cierre-field .form-control {
    height: 32px;
    margin-left: auto !important;
    max-width: 112px;
    width: 112px;
}

.cajas-cierre-dashboard > .cajas-cierre-section--efectivo {
    display: flex;
    flex-direction: column;
}

.cajas-cierre-dashboard > .cajas-cierre-section--efectivo .cajas-cierre-grid--efectivo {
    display: grid;
    gap: 8px;
    grid-template-columns: 1fr;
    margin-top: auto;
}

.cajas-cierre-dashboard > .cajas-cierre-section--efectivo .cajas-cierre-field {
    align-items: center;
    background: transparent;
    border: 0;
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(0, 1fr) 144px;
    min-height: 38px;
    padding: 0;
}

.cajas-cierre-dashboard > .cajas-cierre-section--efectivo .cajas-cierre-field label {
    justify-self: start;
    margin: 0;
    text-align: left;
    width: auto;
}

.cajas-cierre-dashboard > .cajas-cierre-section--efectivo .cajas-cierre-field .form-control {
    height: 36px;
    justify-self: end;
    margin: 0 !important;
    max-width: 144px;
    width: 144px;
}

.cajas-cierre-dashboard > .cajas-cierre-section--efectivo .cajas-cierre-field--expected {
    background: linear-gradient(135deg, #ecfdf5 0%, #f2fff8 100%);
    border: 1px solid #c8f0dc;
    border-radius: 9px;
    margin-top: 4px;
    padding: 9px 10px;
}

.cajas-cierre-dashboard > .cajas-cierre-section--efectivo .cajas-cierre-field--expected label {
    color: #047857;
    font-size: 13px;
    font-weight: 800;
}

.cajas-arqueo-section {
    border-radius: 12px;
    margin-bottom: 0;
}

.cajas-arqueo-toggle {
    min-height: 54px;
    padding: 12px 15px;
}

.cajas-arqueo-toggle > span:first-child {
    color: #173b66;
    font-size: 15px;
}

.cajas-arqueo-toggle > span:first-child > .glyphicon {
    margin-right: 8px;
}

.cajas-arqueo-panel {
    padding: 13px 15px 15px;
}

.cajas-arqueo-panel-head h5 {
    font-size: 14px;
}

.cajas-arqueo-panel-head p {
    font-size: 11px;
}

.cajas-arqueo-workspace {
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(0, 1.55fr) minmax(255px, .8fr);
}

.cajas-arqueo-workspace .cajas-arqueo-denominaciones {
    grid-auto-flow: column;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(5, minmax(0, 1fr));
    margin: 0;
}

.cajas-arqueo-workspace .cajas-arqueo-row {
    min-height: 44px;
}

.cajas-arqueo-workspace .cajas-arqueo-resultados {
    align-content: start;
    grid-template-columns: 1fr;
    margin: 0;
}

.cajas-arqueo-workspace .cajas-arqueo-resultados > div:not(.cajas-arqueo-estado) {
    align-items: center;
    display: flex;
    justify-content: space-between;
    min-height: 38px;
}

.cajas-arqueo-workspace .cajas-arqueo-resultados span {
    font-size: 11px;
    text-transform: none;
}

.cajas-arqueo-workspace .cajas-arqueo-resultados strong {
    font-size: 14px;
}

.cajas-arqueo-workspace .cajas-arqueo-estado {
    min-height: 62px;
}

.cajas-cierre-modal-footer {
    background: #ffffff;
    border-top: 1px solid #dce7f3;
    box-shadow: 0 -4px 12px rgba(15, 40, 76, .05);
    padding: 11px 18px;
}

@media (max-width: 1120px) {
    .cajas-cierre-modal-dialog {
        width: 960px;
    }

    .cajas-cierre-dashboard {
        grid-template-columns: 1fr;
    }

    .cajas-cierre-dashboard > .cajas-cierre-section--efectivo .cajas-cierre-grid--efectivo {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 780px) {
    .cajas-cierre-info-bar--compact {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cajas-cierre-dashboard-main .cajas-cierre-grid--ventas,
    .cajas-cierre-dashboard-main .cajas-cierre-grid--cobros {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cajas-arqueo-workspace {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 540px) {
    .cajas-cierre-modal-dialog {
        max-width: calc(100vw - 8px);
        margin: 4px auto;
    }

    .cajas-cierre-modal-body {
        padding: 10px;
    }

    .cajas-cierre-info-bar--compact,
    .cajas-cierre-dashboard-main .cajas-cierre-grid--ventas,
    .cajas-cierre-dashboard-main .cajas-cierre-grid--cobros,
    .cajas-cierre-dashboard > .cajas-cierre-section--efectivo .cajas-cierre-grid--efectivo,
    .cajas-arqueo-workspace .cajas-arqueo-denominaciones {
        grid-template-columns: 1fr;
    }

    .cajas-arqueo-workspace .cajas-arqueo-denominaciones {
        grid-auto-flow: row;
        grid-template-rows: none;
    }

    .cajas-cierre-dashboard > .cajas-cierre-section--efectivo .cajas-cierre-field {
        grid-template-columns: minmax(0, 1fr) 132px;
    }

    .cajas-cierre-dashboard > .cajas-cierre-section--efectivo .cajas-cierre-field .form-control {
        max-width: 132px;
        width: 132px;
    }

    .cajas-cierre-modal-footer {
        display: grid;
        gap: 8px;
        grid-template-columns: 1fr 1fr;
        padding: 10px;
    }

    .cajas-cierre-btn-cancel,
    .cajas-cierre-btn-close {
        min-width: 0;
        width: 100%;
    }
}
/* Caja: tarjetas de resumen del modal de cierre. */
.cajas-cierre-modal-content .cajas-cierre-info-item {
    align-items: center;
    display: grid;
    gap: 0 9px;
    grid-template-columns: 34px minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    justify-content: stretch;
    text-align: left;
}

.cajas-cierre-modal-content .cajas-cierre-info-icon {
    align-items: center;
    align-self: center;
    background: #e8f2ff;
    border-radius: 8px;
    color: #2563eb;
    display: inline-flex;
    font-size: 15px;
    grid-column: 1;
    grid-row: 1 / 4;
    height: 34px;
    justify-content: center;
    width: 34px;
}

.cajas-cierre-modal-content .cajas-cierre-info-label,
.cajas-cierre-modal-content .cajas-cierre-info-item strong,
.cajas-cierre-modal-content .cajas-cierre-info-item small {
    grid-column: 2;
    text-align: left;
    width: 100%;
}

.cajas-cierre-modal-content .cajas-cierre-info-label {
    grid-row: 1;
    margin: 0 0 2px;
}

.cajas-cierre-modal-content .cajas-cierre-info-item strong {
    grid-row: 2;
}

.cajas-cierre-modal-content .cajas-cierre-info-item small {
    grid-row: 3;
}

@media (max-width: 540px) {
    .cajas-cierre-modal-content .cajas-cierre-info-item {
        min-height: 62px;
    }
}
/* Caja: refinamiento visual de medios de pago y arqueo opcional. */
.cajas-cierre-dashboard > .cajas-cierre-section--efectivo .cajas-cierre-grid--efectivo {
    align-content: start;
    margin-top: 6px;
}

.cajas-cierre-dashboard-main .cajas-cierre-field label .glyphicon {
    position: static;
    top: auto;
}

.cajas-cierre-dashboard-main label[for="totalContado"] .glyphicon,
.cajas-cierre-dashboard-main label[for="cobroTotalContado"] .glyphicon {
    background: #dcfce7;
    color: #16a34a;
}

.cajas-cierre-dashboard-main label[for="totalDeposito"] .glyphicon,
.cajas-cierre-dashboard-main label[for="cobroTotalDeposito"] .glyphicon {
    background: #dbeafe;
    color: #2563eb;
}

.cajas-cierre-dashboard-main label[for="totalCheque"] .glyphicon,
.cajas-cierre-dashboard-main label[for="cobroTotalCheque"] .glyphicon {
    background: #e0f2fe;
    color: #0284c7;
}

.cajas-cierre-dashboard-main label[for="totalTarjeta"] .glyphicon,
.cajas-cierre-dashboard-main label[for="cobroTotalTarjeta"] .glyphicon,
.cajas-cierre-dashboard-main label[for="totalCredito"] .glyphicon {
    background: #f3e8ff;
    color: #7e22ce;
}

.cajas-cierre-dashboard-main label[for="totalPlin"] .glyphicon,
.cajas-cierre-dashboard-main label[for="cobroTotalPlin"] .glyphicon {
    background: #fee2e2;
    color: #e11d48;
}

.cajas-cierre-dashboard-main label[for="totalTransferencia"] .glyphicon {
    background: #dbeafe;
    color: #2563eb;
}

.cajas-cierre-dashboard-main label[for="totalYape"] .glyphicon {
    background: #f3e8ff;
    color: #6d28d9;
}

.cajas-arqueo-toggle {
    align-items: center;
}

.cajas-arqueo-toggle-copy {
    display: grid;
    gap: 2px;
}

.cajas-arqueo-toggle-title {
    color: #173b66;
    font-size: 15px;
}

.cajas-arqueo-toggle-title .glyphicon {
    margin-right: 8px;
}

.cajas-arqueo-toggle-help {
    color: #718399;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.25;
}

@media (max-width: 540px) {
    .cajas-arqueo-toggle-help {
        display: none;
    }
}
/* Cajas: composición final compacta con Bootstrap Icons ya cargados por NEXO. */
.cajas-page .cajas-module-hero {
    display:flex;
    align-items:center;
    gap:11px;
    margin:0 0 8px;
    padding:10px 13px;
    border:1px solid #d7e6f7;
    border-radius:11px;
    background:linear-gradient(105deg,#fff 0%,#f4f8ff 100%);
    box-shadow:0 4px 14px rgba(15,42,74,.04);
}

.cajas-page .cajas-module-hero-icon,
.cajas-page .cajas-current-icon {
    display:inline-flex;
    flex:0 0 auto;
    align-items:center;
    justify-content:center;
    width:36px;
    height:36px;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(135deg,#0f4fa8,#2563eb);
    font-size:17px;
}

.cajas-page .cajas-module-hero h1 {
    margin:0;
    color:#102a43;
    font-size:19px;
    font-weight:700;
    line-height:1.15;
}

.cajas-page .cajas-module-hero p {
    margin:2px 0 0;
    color:#5d7190;
    font-size:11px;
    line-height:1.3;
}

.cajas-page .cajas-current-card {
    margin-bottom:8px;
    padding:10px 12px;
    border-radius:11px;
}

.cajas-page .cajas-current-head {
    min-height:34px;
}

.cajas-page .cajas-current-title-wrap {
    min-width:0;
    gap:9px;
}

.cajas-page .cajas-current-icon {
    width:33px;
    height:33px;
    border-radius:9px;
    font-size:15px;
}

.cajas-page .cajas-current-card--open .cajas-current-icon {
    background:linear-gradient(135deg,#047857,#10b981);
}

.cajas-page .cajas-current-eyebrow {
    margin-bottom:1px;
    font-size:9px;
}

.cajas-page .cajas-current-card h2 {
    font-size:17px;
}

.cajas-page .cajas-current-heading-row {
    display:flex;
    min-width:0;
    align-items:baseline;
    gap:7px;
}

.cajas-page .cajas-current-message {
    margin:0;
    overflow:hidden;
    color:#58708f;
    font-size:11px;
    line-height:1.25;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.cajas-page .cajas-current-primary-actions {
    display:flex;
    flex:0 0 auto;
    align-items:center;
    justify-content:flex-end;
    gap:7px;
}

.cajas-page .cajas-current-badge {
    min-height:25px;
    padding:4px 9px;
    font-size:9px;
}

.cajas-page .cajas-ver-turno,
.cajas-page .cajas-secondary-actions .btn {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    min-height:32px;
    padding:6px 10px;
    border-radius:7px;
    font-size:12px;
    font-weight:700;
    white-space:nowrap;
}

.cajas-page .cajas-ver-turno i,
.cajas-page .cajas-secondary-actions .btn i,
.cajas-page .cajas-history-toolbar h3 i,
.cajas-page .cajas-grid-header h3 i {
    font-size:14px;
}

.cajas-page .cajas-current-data {
    gap:7px;
    margin-top:8px;
}

.cajas-page .cajas-current-data-item {
    display:flex;
    align-items:center;
    min-height:50px;
    padding:7px 8px;
    border-radius:8px;
    gap:8px;
}

.cajas-page .cajas-current-data-item > i {
    display:inline-flex;
    flex:0 0 auto;
    align-items:center;
    justify-content:center;
    width:25px;
    height:25px;
    border-radius:7px;
    color:#2563eb;
    background:#eaf2ff;
    font-size:13px;
}

.cajas-page .cajas-current-data-item > div {
    display:grid;
    min-width:0;
    gap:2px;
}

.cajas-page .cajas-current-data-item span,
.cajas-page .cajas-current-data-item small {
    font-size:9px;
}

.cajas-page .cajas-current-data-item strong {
    font-size:11px;
}

.cajas-page .cajas-turno-summary {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:0;
    margin-top:7px;
    overflow:hidden;
    border:1px solid #e4edf7;
    border-radius:8px;
    background:#f8fbff;
}

.cajas-page .cajas-turno-metric {
    display:flex;
    align-items:center;
    min-width:0;
    padding:7px 9px;
    gap:8px;
    border-right:1px solid #dce7f3;
}

.cajas-page .cajas-turno-metric:last-child { border-right:0; }

.cajas-page .cajas-turno-metric > i {
    display:inline-flex;
    flex:0 0 auto;
    align-items:center;
    justify-content:center;
    width:26px;
    height:26px;
    border-radius:7px;
    font-size:14px;
}

.cajas-page .cajas-turno-metric > div { min-width:0; }
.cajas-page .cajas-turno-metric span { display:block; color:#607491; font-size:9px; line-height:1.15; }
.cajas-page .cajas-turno-metric strong { display:block; margin-top:2px; color:#13395f; font-size:13px; line-height:1.1; white-space:nowrap; }
.cajas-page .cajas-turno-metric--ventas > i { color:#047857; background:#d1fae5; }
.cajas-page .cajas-turno-metric--ventas strong { color:#047857; }
.cajas-page .cajas-turno-metric--ingreso > i { color:#2563eb; background:#dbeafe; }
.cajas-page .cajas-turno-metric--egreso > i { color:#dc2626; background:#fee2e2; }
.cajas-page .cajas-turno-metric--esperado > i { color:#047857; background:#dcfce7; }
.cajas-page .cajas-turno-metric--esperado strong { color:#047857; }

.cajas-page .cajas-current-history {
    margin-top:8px;
    padding-top:8px;
    border-top:1px solid #e6eef7;
}

.cajas-page .cajas-history-toolbar {
    margin-bottom:6px;
}

.cajas-page .cajas-history-toolbar h3,
.cajas-page .cajas-grid-header h3 {
    display:flex;
    align-items:center;
    gap:7px;
}

.cajas-page .cajas-history-toolbar h3 { font-size:14px; }

.cajas-page .cajas-export-btn {
    display:inline-flex;
    align-items:center;
    gap:6px;
    min-height:30px;
    padding:5px 9px;
    color:#1557cc;
    border-color:#c7dcff;
    background:#f6f9ff;
    border-radius:7px;
    font-size:11px;
    font-weight:700;
}

.cajas-page .cajas-filters {
    grid-template-columns:116px 116px minmax(170px,1fr) 116px auto;
    gap:6px;
}

.cajas-page .cajas-field label { margin-bottom:3px; font-size:9px; }
.cajas-page .cajas-field .form-control { height:32px; border-radius:7px; font-size:11px; }
.cajas-page .cajas-filter-actions { gap:5px; }
.cajas-page .cajas-filter-actions .btn { min-height:32px; padding:5px 9px; border-radius:7px; font-size:11px; }

.cajas-page .cajas-grid-card { border-radius:11px; }
.cajas-page .cajas-grid-header { padding:10px 13px; }
.cajas-page .cajas-grid-header h3 { margin:0; font-size:15px; }
.cajas-page .cajas-grid-header p { margin-top:2px; font-size:10px; }
.cajas-page .cajas-total-badge { min-height:28px; padding:4px 8px; font-size:10px; }
.cajas-page .k-grid-header th.k-header { padding:8px 6px; font-size:9px; }
.cajas-page .k-grid-content td { padding:6px; font-size:11px; }

.cajas-page .cajas-grid-actions { gap:4px; }
.cajas-page .cajas-grid-actions .cajas-constancia-btn,
.cajas-page .cajas-grid-more-btn {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:28px;
    height:28px;
    margin:0;
    border-radius:7px;
}

.cajas-page .cajas-grid-actions .cajas-constancia-btn .bi,
.cajas-page .cajas-grid-more-btn .bi { font-size:14px; line-height:1; }
.cajas-page .cajas-grid-actions .cajas-constancia-btn--a4 { color:#dc2626; border-color:#fecaca; background:#fff7f7; }
.cajas-page .cajas-grid-actions .cajas-constancia-btn--ticket { color:#2563eb; border-color:#bfdbfe; background:#f3f8ff; }
.cajas-page .cajas-grid-more { display:inline-block; }
.cajas-page .cajas-grid-more-btn { color:#2563eb; border:1px solid #bfdbfe; background:#f6f9ff; }
.cajas-page .cajas-grid-more .dropdown-menu { right:0; left:auto; min-width:155px; margin-top:4px; padding:4px 0; border-color:#dbe7f4; border-radius:8px; box-shadow:0 8px 22px rgba(15,42,74,.13); }
.cajas-page .cajas-grid-more .dropdown-menu > li > a { display:flex; align-items:center; gap:8px; padding:7px 11px; color:#254567; font-size:11px; }
.cajas-page .cajas-grid-more .dropdown-menu > li > a .bi { width:14px; color:#2563eb; font-size:13px; text-align:center; }

@media (min-width:1100px) and (min-height:700px) {
    body.nexo-app.nexo-layout-v2.cajas-compact-page {
        height:100vh;
        height:100dvh;
        overflow:hidden;
    }

    body.nexo-app.nexo-layout-v2.cajas-compact-page .nexo-v2-shell {
        display:flex;
        height:100vh;
        height:100dvh;
        min-height:0;
        flex-direction:column;
    }

    body.nexo-app.nexo-layout-v2.cajas-compact-page .nexo-topbar,
    body.nexo-app.nexo-layout-v2.cajas-compact-page .nexo-footer--institutional,
    body.nexo-app.nexo-layout-v2.cajas-compact-page .nexo-footer-institutional { flex:0 0 auto; }

    body.nexo-app.nexo-layout-v2.cajas-compact-page .nexo-v2-content {
        display:flex;
        min-height:0;
        padding:8px 18px;
        overflow:hidden;
        flex:1 1 auto;
        flex-direction:column;
    }

    body.nexo-app.nexo-layout-v2.cajas-compact-page .cajas-page {
        display:flex;
        width:100%;
        min-height:0;
        padding:0;
        overflow:hidden;
        flex:1 1 auto;
        flex-direction:column;
    }

    body.nexo-app.nexo-layout-v2.cajas-compact-page .cajas-module-hero,
    body.nexo-app.nexo-layout-v2.cajas-compact-page .cajas-current-card { flex:0 0 auto; }

    body.nexo-app.nexo-layout-v2.cajas-compact-page .cajas-grid-card {
        display:flex;
        min-width:0;
        min-height:0;
        margin-bottom:0;
        overflow:hidden;
        flex:1 1 auto;
        flex-direction:column;
    }

    body.nexo-app.nexo-layout-v2.cajas-compact-page .cajas-grid-card .cajas-grid-header,
    body.nexo-app.nexo-layout-v2.cajas-compact-page .cajas-grid-card .k-grid-header,
    body.nexo-app.nexo-layout-v2.cajas-compact-page .cajas-grid-card .k-pager-wrap { flex:0 0 auto; }

    body.nexo-app.nexo-layout-v2.cajas-compact-page .cajas-grid-card #grid,
    body.nexo-app.nexo-layout-v2.cajas-compact-page .cajas-grid-card #grid.k-grid {
        display:flex;
        min-height:0;
        height:auto !important;
        flex:1 1 auto;
        flex-direction:column;
    }

    body.nexo-app.nexo-layout-v2.cajas-compact-page .cajas-grid-card #grid.k-grid .k-grid-content {
        min-height:0;
        height:auto !important;
        overflow:auto !important;
        flex:1 1 auto;
    }
}

@media (max-width:1099px) {
    .cajas-page .cajas-current-data { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .cajas-page .cajas-turno-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .cajas-page .cajas-turno-metric:nth-child(2) { border-right:0; }
    .cajas-page .cajas-turno-metric:nth-child(-n+2) { border-bottom:1px solid #dce7f3; }
}

@media (max-width:700px) {
    .cajas-page .cajas-module-hero { align-items:flex-start; }
    .cajas-page .cajas-module-hero p { display:none; }
    .cajas-page .cajas-current-head { align-items:flex-start; flex-direction:column; }
    .cajas-page .cajas-current-primary-actions { width:100%; justify-content:flex-start; flex-wrap:wrap; }
    .cajas-page .cajas-current-heading-row { display:block; }
    .cajas-page .cajas-current-title-separator { display:none; }
    .cajas-page .cajas-current-message { display:block; margin-top:3px; white-space:normal; }
    .cajas-page .cajas-current-data,
    .cajas-page .cajas-turno-summary,
    .cajas-page .cajas-filters { grid-template-columns:1fr; }
    .cajas-page .cajas-turno-metric,
    .cajas-page .cajas-turno-metric:nth-child(2) { border-right:0; border-bottom:1px solid #dce7f3; }
    .cajas-page .cajas-turno-metric:last-child { border-bottom:0; }
    .cajas-page .cajas-history-toolbar { align-items:center; flex-direction:row; }
    .cajas-page .cajas-export-btn { font-size:0; }
    .cajas-page .cajas-export-btn .bi { margin:0; font-size:14px; }
}
.cajas-page .cajas-current-primary-actions .cajas-secondary-actions {
    display:flex;
    flex:0 0 auto;
    width:auto;
    justify-content:flex-start;
    margin:0;
    padding:0;
}

.cajas-page .cajas-current-primary-actions .cajas-secondary-actions:empty { display:none; }
/* cajas-native-grid */
.cajas-page .cajas-native-grid-host { min-height: 0; height: 100%; display: flex; flex-direction: column; }
.cajas-page .cajas-native-grid-scroll { flex: 1 1 auto; min-height: 0; overflow: auto; border: 1px solid #e5edf8; border-radius: 8px 8px 0 0; }
.cajas-page .cajas-native-grid { width: 100%; min-width: 940px; margin: 0; border-collapse: collapse; table-layout: fixed; }
.cajas-page .cajas-native-grid th { padding: 11px 10px; border: 0; background: #23344e; color: #fff; font-size: 11px; font-weight: 700; letter-spacing: .025em; text-align: center; text-transform: uppercase; white-space: nowrap; }
.cajas-page .cajas-native-grid td { padding: 10px; border-top: 1px solid #e9eef5; color: #19345e; font-size: 12px; text-align: center; vertical-align: middle; }
.cajas-page .cajas-native-grid tbody tr:hover { background: #f7fbff; }
.cajas-page .cajas-native-grid tbody tr.cajas-row-alt { background: #fbfdff; }
.cajas-page .cajas-native-grid .cajas-native-amount { text-align: right; font-variant-numeric: tabular-nums; }
.cajas-page .cajas-native-grid-empty { padding: 28px 12px; color: #60728d; text-align: center; }
.cajas-page .cajas-native-grid-footer { flex: 0 0 auto; padding: 10px 14px; border: 1px solid #e5edf8; border-top: 0; border-radius: 0 0 8px 8px; color: #60728d; font-size: 12px; text-align: right; }
@media (max-width: 767px) { .cajas-page .cajas-native-grid-scroll { overflow-x: auto; } .cajas-page .cajas-native-grid-footer { text-align: center; } }
/* cajas-turno-detail */
.cajas-turno-detail-dialog { width: min(960px, calc(100% - 28px)); margin: 28px auto; }
.cajas-turno-detail-content { overflow: hidden; border: 0; border-radius: 14px; box-shadow: 0 18px 55px rgba(14, 39, 78, .25); }
.cajas-turno-detail-header { display: flex; align-items: center; gap: 14px; min-height: 78px; padding: 16px 20px; border: 0; background: linear-gradient(120deg, #0f5ecd, #1b74dd); color: #fff; }
.cajas-turno-detail-header .close { margin: -6px -4px 0 0; color: #fff; opacity: .9; text-shadow: none; }
.cajas-turno-detail-title { display: flex; align-items: center; gap: 12px; min-width: 0; }
.cajas-turno-detail-icon { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 38px; width: 38px; height: 38px; border-radius: 10px; background: rgba(255,255,255,.16); font-size: 19px; }
.cajas-turno-detail-title p { margin: 0 0 2px; color: #dbeafe; font-size: 10px; font-weight: 700; letter-spacing: .08em; }
.cajas-turno-detail-title h4 { margin: 0; color: #fff; font-size: 20px; font-weight: 700; }
.cajas-turno-detail-title h4 span { color: #dbeafe; font-weight: 600; }
.cajas-turno-detail-title small { color: #e7f0ff; font-size: 12px; }
.cajas-turno-detail-header .cajas-estado-badge { margin-left: auto; white-space: nowrap; }
.cajas-turno-detail-body { padding: 18px 20px; background: #f7faff; }
.cajas-turno-detail-meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.cajas-turno-detail-meta > div { min-height: 74px; padding: 11px 12px; border: 1px solid #dbe6f5; border-radius: 9px; background: #fff; }
.cajas-turno-detail-meta span { display: block; margin-bottom: 6px; color: #5b7091; font-size: 11px; font-weight: 600; }
.cajas-turno-detail-meta span .bi { margin-right: 4px; color: #2563eb; }
.cajas-turno-detail-meta strong { display: block; color: #102f5d; font-size: 13px; font-weight: 700; }
.cajas-turno-detail-meta small { display: block; margin-top: 3px; color: #7489aa; font-size: 10px; }
.cajas-turno-detail-section { margin-top: 14px; padding: 14px; border: 1px solid #dbe6f5; border-radius: 10px; background: #fff; }
.cajas-turno-detail-section-title { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; color: #123460; }
.cajas-turno-detail-section-title i { color: #2563eb; font-size: 16px; }
.cajas-turno-detail-section-title h5 { margin: 0; font-size: 14px; font-weight: 700; }
.cajas-turno-detail-summary { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.cajas-turno-detail-metric { padding: 11px; border-radius: 8px; background: #f5f8fd; }
.cajas-turno-detail-metric span { display: block; min-height: 29px; color: #5d7293; font-size: 11px; line-height: 1.25; }
.cajas-turno-detail-metric strong { display: block; margin-top: 5px; color: #163969; font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; }
.cajas-turno-detail-metric--ventas strong { color: #008879; }
.cajas-turno-detail-metric--ingreso strong { color: #2563eb; }
.cajas-turno-detail-metric--egreso strong { color: #dc3b46; }
.cajas-turno-detail-metric--final { background: #ecfdf5; }
.cajas-turno-detail-metric--final strong { color: #00855f; }
.cajas-turno-detail-footer { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 12px 20px; border-top: 1px solid #e4edf8; }
.cajas-turno-detail-footer .bi { margin-right: 4px; }
@media (max-width: 767px) { .cajas-turno-detail-dialog { width: calc(100% - 12px); margin: 6px auto; } .cajas-turno-detail-header { align-items: flex-start; min-height: 72px; padding: 13px; } .cajas-turno-detail-header .cajas-estado-badge { display: none; } .cajas-turno-detail-body { padding: 12px; } .cajas-turno-detail-meta { grid-template-columns: 1fr; } .cajas-turno-detail-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } .cajas-turno-detail-footer { position: sticky; bottom: 0; flex-wrap: wrap; padding: 10px 12px; } .cajas-turno-detail-footer .btn { flex: 1 1 auto; } }
/* cajas-current-legibilidad */
.cajas-page .cajas-current-data-item { min-height: 54px; padding: 8px 10px; gap: 10px; }
.cajas-page .cajas-current-data-item > i { width: 29px; height: 29px; border-radius: 8px; font-size: 15px; }
.cajas-page .cajas-current-data-item > div { gap: 3px; }
.cajas-page .cajas-current-data-item span { font-size: 10px; line-height: 1.1; }
.cajas-page .cajas-current-data-item strong { font-size: 12.5px; line-height: 1.15; }
.cajas-page .cajas-current-data-item small { font-size: 10px; line-height: 1.15; }
.cajas-page .cajas-turno-metric { padding: 8px 10px; gap: 9px; }
.cajas-page .cajas-turno-metric > i { width: 28px; height: 28px; font-size: 15px; }
.cajas-page .cajas-turno-metric span { font-size: 10px; }
.cajas-page .cajas-turno-metric strong { font-size: 14px; }
/* cajas-current-icon-visible */
.cajas-page .cajas-current-icon > .bi { display: block; color: #fff; font-size: 19px; line-height: 1; }
/* cajas-exportar-historial */
.cajas-page .cajas-export-dropdown .dropdown-menu { min-width: 148px; margin-top: 5px; border-color: #d7e5f5; border-radius: 8px; box-shadow: 0 8px 20px rgba(18, 52, 96, .14); }
.cajas-page .cajas-export-dropdown .dropdown-menu > li > a { display: flex; align-items: center; gap: 8px; padding: 8px 12px; color: #183a69; font-size: 12px; }
.cajas-page .cajas-export-dropdown .dropdown-menu > li > a .bi { width: 15px; color: #2563eb; font-size: 14px; text-align: center; }
.cajas-page .cajas-export-dropdown .dropdown-menu > li > a:hover,
.cajas-page .cajas-export-dropdown .dropdown-menu > li > a:focus { background: #eff6ff; color: #123e77; }
.cajas-page .cajas-export-dropdown .dropdown-menu > li:first-child > a .bi { color: #0b8a61; }
.cajas-page .cajas-export-dropdown .dropdown-menu > li:last-child > a .bi { color: #dc3545; }
/* movimiento-caja-auditoria */
.caja-mov-page { padding: 10px 14px 14px; }
.caja-mov-status-card,
.caja-mov-filter-card,
.caja-mov-grid-card {
    border: 1px solid #d8e5f4;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 2px 10px rgba(25, 55, 96, .05);
}
.caja-mov-status-card {
    position: relative;
    display: grid;
    grid-template-columns: minmax(285px, 1.2fr) minmax(420px, 2fr) auto;
    gap: 16px;
    align-items: center;
    min-height: 92px;
    margin-bottom: 9px;
    padding: 12px 14px;
    border-left: 4px solid #059669;
}
.caja-mov-status-card.is-closed { border-left-color: #94a3b8; }
.caja-mov-status-main { display: flex; align-items: center; gap: 11px; min-width: 0; }
.caja-mov-status-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: linear-gradient(135deg, #0b9f74, #0fb887);
    color: #fff;
    font-size: 18px;
}
.caja-mov-status-card.is-closed .caja-mov-status-icon { background: #94a3b8; }
.caja-mov-eyebrow { display: block; margin-bottom: 2px; color: #597293; font-size: 9px; font-weight: 700; letter-spacing: .09em; }
.caja-mov-status-main h2 { margin: 0; color: #112e58; font-size: 18px; font-weight: 700; line-height: 1.15; }
.caja-mov-status-main p { margin: 3px 0 0; color: #58708f; font-size: 12px; line-height: 1.25; }
.caja-mov-status-details { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; min-width: 0; }
.caja-mov-status-detail { min-width: 0; padding: 2px 11px; border-left: 1px solid #e5edf7; }
.caja-mov-status-detail:first-child { border-left: 0; }
.caja-mov-status-detail > span { display: block; margin-bottom: 4px; color: #647b99; font-size: 10px; line-height: 1.1; }
.caja-mov-status-detail strong { display: block; overflow: hidden; color: #173967; font-size: 12px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.caja-mov-status-detail small { display: block; margin-top: 2px; overflow: hidden; color: #8194ad; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.caja-mov-status-badge { display: inline-flex !important; align-items: center; width: auto; padding: 4px 8px; border-radius: 999px; background: #e9fbf3; color: #047857 !important; font-size: 9px !important; letter-spacing: .02em; }
.caja-mov-status-actions { display: flex; justify-content: flex-end; }
.caja-mov-status-actions .btn { min-height: 34px; border-radius: 8px; font-size: 12px; font-weight: 700; white-space: nowrap; }
.caja-mov-filter-card { display: flex; align-items: flex-end; gap: 16px; margin-bottom: 9px; padding: 10px 14px; }
.caja-mov-filter-title { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; min-width: 170px; padding-bottom: 2px; color: #173967; }
.caja-mov-filter-title > i { color: #2563eb; font-size: 16px; }
.caja-mov-filter-title strong,
.caja-mov-filter-title span { display: block; }
.caja-mov-filter-title strong { font-size: 13px; line-height: 1.15; }
.caja-mov-filter-title span { margin-top: 2px; color: #6b809c; font-size: 10px; line-height: 1.2; }
.caja-mov-page .caja-mov-filters { flex: 1 1 auto; display: flex; flex-wrap: nowrap; gap: 8px; align-items: flex-end; min-width: 0; }
.caja-mov-page .caja-mov-field { flex: 0 0 auto; }
.caja-mov-field--fecha { width: 124px; }
.caja-mov-field--vendedor { width: min(250px, 23vw); }
.caja-mov-page .caja-mov-field label { margin-bottom: 3px; color: #526b8e; font-size: 10px; font-weight: 700; text-transform: uppercase; }
.caja-mov-page .caja-mov-field .form-control { height: 32px; min-height: 32px; border-radius: 7px; font-size: 12px; }
.caja-mov-filter-buttons,
.caja-mov-filter-export { display: flex; gap: 6px; flex: 0 0 auto; }
.caja-mov-filter-buttons .btn,
.caja-mov-filter-export .btn { height: 32px; padding: 6px 10px; border-radius: 7px; font-size: 12px; font-weight: 600; }
.caja-mov-filter-export { margin-left: auto; }
.caja-mov-grid-card { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; margin-top: 0; overflow: hidden; }
.caja-mov-grid-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex: 0 0 auto; padding: 10px 14px !important; border-bottom: 1px solid #e6eef8; }
.caja-mov-grid-header h3 { display: flex; align-items: center; gap: 7px; margin: 0; color: #173967; font-size: 15px; font-weight: 700; }
.caja-mov-grid-header h3 i { color: #2563eb; font-size: 14px; }
.caja-mov-grid-header p { margin: 3px 0 0; color: #66809f; font-size: 10px; }
.caja-mov-total-badge { flex: 0 0 auto; margin: 0; padding: 7px 10px; font-size: 11px; }
.caja-mov-grid { flex: 1 1 auto; min-height: 0; }
.caja-mov-page .k-grid { border: 0; }
.caja-mov-page .k-grid-header { background: #23344e; }
.caja-mov-page .k-grid-header th.k-header { padding: 9px 8px; border-color: rgba(255,255,255,.1); color: #fff; font-size: 10px; font-weight: 700; letter-spacing: .025em; text-transform: uppercase; }
.caja-mov-page .k-grid td { padding: 8px; font-size: 12px; vertical-align: middle; }
.caja-mov-page .k-grid-content tr.caja-mov-row-alt { background: #f8fbff; }
.caja-mov-page .k-grid-content tr.caja-mov-row:hover { background: #eff6ff; }
.caja-mov-page .k-grid-content tr:has(.caja-mov-badge--anulado) { background: #fafafa; color: #7b8798; }
.caja-mov-monto { font-variant-numeric: tabular-nums; font-size: 12px; font-weight: 700; color: #173967; white-space: nowrap; }
.caja-mov-monto-symbol { margin-right: 2px; color: #2563eb; }
.caja-mov-fecha { color: #425d7e; font-size: 11px; white-space: nowrap; }
.caja-mov-obs-cell { max-width: 250px; }
.caja-mov-obs-cell,
.caja-mov-history-note { color: #415b7a; font-size: 12px; }
.caja-mov-history-note { color: #8a9ab0; font-style: italic; }
.caja-mov-badge { padding: 4px 8px; border-radius: 999px; font-size: 9px; font-weight: 700; letter-spacing: .02em; }
.caja-mov-badge--ingreso,
.caja-mov-badge--activo { background: #dcfce7; color: #15803d; }
.caja-mov-badge--egreso { background: #fee2e2; color: #b91c1c; }
.caja-mov-badge--anulado { background: #eef2f7; color: #64748b; }
.caja-mov-actions { display: inline-flex; align-items: center; justify-content: center; gap: 5px; }
.caja-mov-page .k-grid .caja-mov-action-cell .notas-grid-icon-btn { display: inline-flex; align-items: center; justify-content: center; width: 29px; height: 29px; margin: 0; padding: 0; border-radius: 7px; }
.caja-mov-action-view { border-color: #bfdbfe; color: #2563eb; background: #eff6ff; }
.caja-mov-action-cancel { border-color: #fecaca; background: #fff5f5; }
.caja-mov-modal-dialog { width: min(900px, calc(100vw - 24px)); margin: 22px auto; }
.caja-mov-modal-info-bar--four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.caja-mov-modal-info-item { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 9px 10px; }
.caja-mov-info-icon { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 28px; width: 28px; height: 28px; border-radius: 8px; background: #eaf2ff; color: #2563eb; font-size: 13px; }
.caja-mov-modal-info-item > div { min-width: 0; }
.caja-mov-modal-info-item strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.caja-mov-modal-info-item small { display: block; overflow: hidden; margin-top: 2px; color: #8194ad; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.caja-mov-modal-grid--principal { grid-template-columns: 1fr 1.35fr .82fr 1.08fr; }
.caja-mov-modal-field--wide { grid-column: span 2; }
.caja-mov-modal-field--state { grid-column: span 2; }
.caja-mov-modal-field label { font-size: 10px; }
.caja-mov-required { color: #dc2626; font-weight: 700; }
.caja-mov-optional { color: #8292a8; font-size: 9px; font-weight: 600; text-transform: none; }
.caja-mov-readonly-notice { margin: 0 0 10px; padding: 9px 11px; border: 1px solid #d7e7fb; border-radius: 8px; background: #f1f7ff; color: #315a8e; font-size: 12px; line-height: 1.35; }
.caja-mov-readonly-notice .glyphicon { margin-right: 5px; color: #2563eb; }
.caja-mov-form-error { margin: 0 0 10px; padding: 8px 10px; border: 1px solid #fecaca; border-radius: 7px; background: #fff1f2; color: #b91c1c; font-size: 12px; }
.caja-mov-state-readonly { display: flex; align-items: center; height: 34px; padding: 0 10px; border: 1px solid #a7f3d0; border-radius: 8px; background: #ecfdf5; color: #047857; font-size: 12px; font-weight: 700; }
.caja-mov-state-readonly.is-cancelled { border-color: #dbe2ea; background: #f1f5f9; color: #64748b; }
.caja-mov-audit-note { margin-top: 10px; padding: 9px 10px; border-radius: 8px; background: #f8fafc; color: #526b8e; font-size: 12px; }
@media (min-width: 769px) {
    .nexo-layout-v2 .caja-mov-page { display: flex; flex-direction: column; height: calc(100vh - 100px); min-height: 480px; max-height: calc(100vh - 100px); overflow: hidden; }
}
@media (max-width: 1100px) {
    .caja-mov-status-card { grid-template-columns: minmax(240px, 1fr) minmax(360px, 1.5fr) auto; }
    .caja-mov-status-details { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 0; }
    .caja-mov-status-detail:nth-child(3) { border-left: 0; }
    .caja-mov-filter-card { align-items: flex-start; flex-wrap: wrap; gap: 10px; }
    .caja-mov-filter-title { width: 100%; }
}
@media (max-width: 768px) {
    .caja-mov-page { padding: 8px; }
    .caja-mov-status-card { display: flex; flex-wrap: wrap; gap: 12px; padding: 12px; }
    .caja-mov-status-main { width: 100%; }
    .caja-mov-status-details { width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .caja-mov-status-detail { padding: 5px 8px; }
    .caja-mov-status-detail:nth-child(3) { border-left: 0; }
    .caja-mov-status-actions { width: 100%; }
    .caja-mov-status-actions .btn { width: 100%; }
    .caja-mov-filter-card { display: block; padding: 12px; }
    .caja-mov-filter-title { margin-bottom: 10px; }
    .caja-mov-page .caja-mov-filters { display: grid; grid-template-columns: 1fr 1fr; flex-wrap: wrap; }
    .caja-mov-field--fecha, .caja-mov-field--vendedor { width: auto; max-width: none; }
    .caja-mov-field--vendedor, .caja-mov-filter-buttons, .caja-mov-filter-export { grid-column: span 2; }
    .caja-mov-filter-buttons .btn, .caja-mov-filter-export .btn { flex: 1 1 auto; }
    .caja-mov-filter-export { margin-left: 0; }
    .caja-mov-grid-header { align-items: flex-start; flex-direction: column; }
    .caja-mov-total-badge { align-self: flex-start; }
    .caja-mov-modal-dialog { width: calc(100vw - 12px); margin: 6px auto; }
    .caja-mov-modal-body { padding: 12px; }
    .caja-mov-modal-info-bar--four, .caja-mov-modal-grid--principal { grid-template-columns: 1fr; }
    .caja-mov-modal-field--wide, .caja-mov-modal-field--state { grid-column: auto; }
    .caja-mov-modal-footer { position: sticky; bottom: 0; padding: 10px 12px; }
}

/* Movimiento de Caja: en escritorio la grilla consume el alto disponible y mantiene su propio scroll. */
@media (min-width: 1100px) and (min-height: 700px) {
    body.nexo-app.nexo-layout-v2.caja-mov-compact-page {
        height: 100vh;
        height: 100dvh;
        overflow: hidden;
    }

    body.nexo-app.nexo-layout-v2.caja-mov-compact-page .nexo-v2-shell {
        display: flex;
        height: 100vh;
        height: 100dvh;
        min-height: 0;
        flex-direction: column;
    }

    body.nexo-app.nexo-layout-v2.caja-mov-compact-page .nexo-topbar,
    body.nexo-app.nexo-layout-v2.caja-mov-compact-page .nexo-footer--institutional,
    body.nexo-app.nexo-layout-v2.caja-mov-compact-page .nexo-footer-institutional {
        flex: 0 0 auto;
    }

    body.nexo-app.nexo-layout-v2.caja-mov-compact-page .nexo-v2-content {
        display: flex;
        min-height: 0;
        padding: 8px 14px;
        overflow: hidden;
        flex: 1 1 auto;
        flex-direction: column;
    }

    body.nexo-app.nexo-layout-v2.caja-mov-compact-page .caja-mov-page {
        display: flex;
        width: 100%;
        height: auto;
        min-height: 0;
        max-height: none;
        padding: 0;
        overflow: hidden;
        flex: 1 1 auto;
        flex-direction: column;
    }

    body.nexo-app.nexo-layout-v2.caja-mov-compact-page .caja-mov-status-card,
    body.nexo-app.nexo-layout-v2.caja-mov-compact-page .caja-mov-filter-card {
        flex: 0 0 auto;
    }

    body.nexo-app.nexo-layout-v2.caja-mov-compact-page .caja-mov-grid-card {
        display: flex;
        min-width: 0;
        min-height: 0;
        margin-bottom: 0;
        overflow: hidden;
        flex: 1 1 auto;
        flex-direction: column;
    }

    body.nexo-app.nexo-layout-v2.caja-mov-compact-page .caja-mov-grid-card .caja-mov-grid-header,
    body.nexo-app.nexo-layout-v2.caja-mov-compact-page .caja-mov-grid-card .k-grid-header,
    body.nexo-app.nexo-layout-v2.caja-mov-compact-page .caja-mov-grid-card .k-pager-wrap {
        flex: 0 0 auto;
    }

    body.nexo-app.nexo-layout-v2.caja-mov-compact-page .caja-mov-grid-card #grid,
    body.nexo-app.nexo-layout-v2.caja-mov-compact-page .caja-mov-grid-card #grid.k-grid {
        display: flex;
        min-height: 0;
        height: auto !important;
        flex: 1 1 auto;
        flex-direction: column;
    }

    body.nexo-app.nexo-layout-v2.caja-mov-compact-page .caja-mov-grid-card #grid.k-grid .k-grid-content {
        min-height: 0;
        height: auto !important;
        overflow: auto !important;
        flex: 1 1 auto;
    }
}
/* Fondo institucional del acceso: profundidad, luz y geometría sin imágenes externas. */
body:has(.login-page) {
    background:#081a33;
}

.login-page {
    position:relative;
    isolation:isolate;
    overflow:hidden;
    background:
        radial-gradient(circle at 13% 20%, rgba(56, 189, 248, .22) 0, rgba(56, 189, 248, 0) 27%),
        radial-gradient(circle at 84% 76%, rgba(37, 99, 235, .28) 0, rgba(37, 99, 235, 0) 33%),
        linear-gradient(125deg, #07142a 0%, #102f59 52%, #0a1c38 100%);
}

.login-page::before,
.login-page::after {
    position:absolute;
    z-index:-1;
    content:"";
    pointer-events:none;
}

.login-page::before {
    inset:0;
    opacity:.24;
    background-image:
        linear-gradient(rgba(190, 225, 255, .16) 1px, transparent 1px),
        linear-gradient(90deg, rgba(190, 225, 255, .16) 1px, transparent 1px);
    background-size:68px 68px;
    -webkit-mask-image:linear-gradient(90deg, rgba(0,0,0,.75), transparent 44%, transparent 60%, rgba(0,0,0,.55));
    mask-image:linear-gradient(90deg, rgba(0,0,0,.75), transparent 44%, transparent 60%, rgba(0,0,0,.55));
}

.login-page::after {
    width:min(58vw, 760px);
    height:min(58vw, 760px);
    right:-20vw;
    bottom:-34vw;
    border:1px solid rgba(167, 218, 255, .20);
    border-radius:34% 66% 57% 43%;
    box-shadow:
        0 0 0 52px rgba(92, 175, 246, .035),
        0 0 0 104px rgba(92, 175, 246, .025);
    transform:rotate(-22deg);
}

.login-card {
    position:relative;
    z-index:1;
    border-color:rgba(255, 255, 255, .78);
    box-shadow:0 28px 64px rgba(2, 12, 29, .34);
}

@media (max-width: 600px) {
    .login-page::before {
        background-size:48px 48px;
        opacity:.16;
    }

    .login-page::after {
        width:440px;
        height:440px;
        right:-260px;
        bottom:-190px;
    }
}
/* Identificación visual de medios digitales en el cierre de caja. */
.cajas-cierre-dashboard-main .cajas-cierre-field label .cajas-cierre-payment-icon {
    display: inline-block;
    flex: 0 0 24px;
    height: 24px;
    object-fit: contain;
    width: 24px;
}

.cajas-cierre-dashboard-main .cajas-cierre-field label .cajas-cierre-payment-icon--plin {
    border-radius: 50%;
}

.cajas-cierre-dashboard-main .cajas-cierre-field label .cajas-cierre-payment-icon--yape {
    border-radius: 6px;
}
