.validar-page{
padding:0.35rem 0.5rem;
}

.validar-page .validar-card{
background:#fff;
border:1px solid rgba(0,0,0,0.07);
border-radius:10px;
box-shadow:0 2px 10px rgba(0,0,0,0.04);
margin-bottom:0.5rem;
}

.validar-filtros{
padding:0.35rem 0.5rem;
margin-bottom:0.5rem;
border:1px solid rgba(0,0,0,0.07);
box-shadow:0 2px 14px rgba(0,0,0,0.04);
}

.validar-filtros .validar-fila-filtro{
align-items:center;
}

.validar-filtros .rz-label{
font-size:0.72rem;
font-weight:600;
color:rgba(0,0,0,0.62);
letter-spacing:0.1px;
}

.validar-filtros .validar-search-wrap{
align-items:center;
}

.validar-filtros .validar-input .rz-inputtext,
.validar-filtros .validar-input.rz-dropdown,
.validar-filtros .validar-input.rz-multiselect{
border-radius:10px;
border-color:rgba(0,0,0,0.14);
background:rgba(255,255,255,0.98);
}

.validar-filtros .validar-input .rz-inputtext:focus,
.validar-filtros .validar-input .rz-inputtext:focus-visible{
outline:none;
box-shadow:0 0 0 3px rgba(42,47,114,0.12);
border-color:rgba(42,47,114,0.35);
}

.validar-filtros .validar-input.rz-dropdown:focus-within,
.validar-filtros .validar-input.rz-multiselect:focus-within{
box-shadow:0 0 0 3px rgba(42,47,114,0.12);
border-color:rgba(42,47,114,0.35);
}

.validar-filtros .validar-btn-search{
border-radius:12px;
box-shadow:0 6px 16px rgba(0,0,0,0.10);
}

.validar-filtros .validar-btn-search:hover{
transform:translateY(-0.5px);
}

.validar-filtros .validar-btn-search:active{
transform:translateY(0);
box-shadow:0 4px 12px rgba(0,0,0,0.10);
}

.validar-filtros .validar-btn-search .rz-button-icon{
font-size:1.05rem;
}

.validar-clientes{
padding:0.35rem 0.5rem;
margin-bottom:0.5rem;
}

.validar-clientes-header{
border-bottom:1px solid rgba(0,0,0,0.08);
margin-bottom:0.35rem;
padding-bottom:0.25rem;
}

.validar-clientes-body{
max-height:30vh;
overflow-y:auto;
}

.validar-cuentas{
padding:0.35rem 0.5rem;
}

.validar-page .validar-resumen{
padding:0.35rem 0.35rem;
background:linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.96) 100%);
border:1px solid rgba(0,0,0,0.07);
box-shadow:0 2px 10px rgba(0,0,0,0.05);
}

.validar-page .validar-title{
font-size:0.85rem;
font-weight:700;
color:rgba(0,0,0,0.78);
text-align:center;
margin:0 0 0.35rem 0;
line-height:1.1rem;
display:flex;
align-items:center;
justify-content:center;
gap:0.5rem;
}

.validar-title::before,
.validar-title::after{
content:"";
flex:0 0 40px;
height:2px;
border-radius:999px;
background:rgba(42,47,114,0.20);
}

.validar-page .validar-subtitle{
font-size:0.78rem;
font-weight:700;
color:rgba(0,0,0,0.70);
text-align:center;
margin:0.1rem 0 0.35rem 0;
}

.validar-page .validar-grid .rz-grid-table{
border-collapse:separate;
border-spacing:0;
width:100%;
}

.validar-page .validar-grid .rz-grid-table thead th{
position:sticky;
top:0;
z-index:3;
background:rgba(42,47,114,0.06);
border-bottom:1px solid rgba(0,0,0,0.10);
}

.validar-page .validar-grid .rz-grid-table thead th .rz-column-title{
text-align:center;
width:100%;
display:block;
font-size:0.72rem;
font-weight:650;
color:rgba(0,0,0,0.72);
letter-spacing:0.1px;
}

.validar-page .validar-grid .rz-grid-table td{
padding:0.28rem 0.40rem;
border-bottom:1px solid rgba(0,0,0,0.06);
}

.validar-page .validar-grid .rz-grid-table td .rz-cell-data{
align-items:center;
}

.validar-page .validar-grid .rz-grid-table tbody tr:hover{
background:rgba(42,47,114,0.04);
}

.validar-page .validar-grid .rz-grid-table tbody tr:nth-child(even){
background:rgba(0,0,0,0.012);
}

.validar-page .validar-card .rz-data-grid{
border-radius:10px;
overflow:hidden;
}

.validar-grid-clientes .rz-grid-table tbody td:nth-child(2) .rz-cell-data{
text-align:center;
}

.validar-page .validar-btn-ver{
border-radius:10px;
min-height:1.45rem;
height:1.45rem;
padding:0 0.50rem;
font-size:0.72rem;
text-transform:none;
box-shadow:none;
}

.validar-page .validar-btn-ver:hover{
filter:brightness(0.98);
}

.validar-resumen .fila-titulo,
.validar-resumen .fila-detalle,
.validar-resumen .fila-subtotal,
.validar-resumen .fila-total{
border-left:0;
border-right:0;
}

.validar-resumen .fila-titulo{
border-top-left-radius:10px;
border-top-right-radius:10px;
border:1px solid rgba(0,0,0,0.10);
background:rgba(245,245,220,0.9);
}

.validar-resumen .fila-detalle{
border-bottom:1px solid rgba(0,0,0,0.10);
}

.validar-resumen .fila-subtotal{
border-bottom:1px solid rgba(0,0,0,0.10);
background:rgba(245,245,220,0.75);
}

/* Total tasa — destacado en azul */
.validar-resumen .fila-total-tasa{
background:rgba(59, 130, 246, 0.10) !important;
border-left:3px solid rgba(37, 99, 235, 0.45) !important;
border-bottom:1px solid rgba(37, 99, 235, 0.20) !important;
}

.validar-resumen .fila-total-tasa span{
color:#1d4ed8 !important;
font-weight:700 !important;
}

.validar-resumen .fila-total{
border-bottom:1px solid rgba(0,0,0,0.12);
border-bottom-left-radius:10px;
border-bottom-right-radius:10px;
background:var(--rz-primary);
color:#fff;
font-weight:700;
}

.validar-resumen .rz-col-2,
.validar-resumen .rz-col-10,
.validar-resumen .rz-col-6{
padding:0.2rem 0.35rem;
}

.validar-resumen .fila-detalle .rz-col-2 span,
.validar-resumen .fila-titulo .rz-col-2 span,
.validar-resumen .fila-subtotal .rz-col-2 span,
.validar-resumen .fila-total .rz-col-2 span{
display:block;
text-align:right;
font-variant-numeric:tabular-nums;
}

.validar-resumen .fila-titulo span{
font-weight:700;
color:rgba(0,0,0,0.70);
}

.validar-resumen .fila-subtotal span{
font-weight:600;
color:rgba(0,0,0,0.68);
}

.validar-resumen .fila-total span{
font-weight:800;
letter-spacing:0.2px;
}

.validar-resumen span{
font-size:0.72rem;
line-height:1rem;
}

.validar-grid-cuentas .validar-btn-ver{
min-width:2.6rem;
}

.validar-cuentas-cliente{
padding:0.35rem 0.5rem;
margin-bottom:0.5rem;
}

.validar-cuentas-cliente .rz-datatable,
.validar-cuentas-cliente .rz-grid{
max-height:30vh;
overflow:auto;
}

.validar-grid-cuentas-cliente{
font-size:0.85rem;
}

.validar-periodos{
padding:0.35rem 0.5rem;
position:relative;
}

.validar-periodos .rz-datatable,
.validar-periodos .rz-grid{
max-height:50vh;
overflow:auto;
}

.validar-grid-periodos{
font-size:0.85rem;
}

.validar-page .grid-watermark{
position:absolute;
inset:0;
display:flex;
align-items:center;
justify-content:center;
font-size:5.5rem;
font-weight:bold;
color:rgba(180,180,180,0.3);
pointer-events:none;
user-select:none;
transform:rotate(20deg);
z-index:2;
white-space:nowrap;
}

.validar-alert{
margin-top:0.25rem;
padding:0.35rem 0.5rem;
border-radius:10px;
border:1px solid rgba(165,42,42,0.25);
background:rgba(245,245,220,0.55);
color:rgba(120,30,30,0.95);
font-size:0.72rem;
line-height:1rem;
}

.validar-page .rz-row{
align-items:stretch;
}

.validar-page .validar-clientes,
.validar-page .validar-cuentas-cliente{
height:100%;
display:flex;
flex-direction:column;
min-height:180px;
}

.validar-page .validar-clientes-body{
flex:1 1 auto;
overflow:auto;
}

.validar-page .validar-cuentas-cliente .rz-data-grid,
.validar-page .validar-cuentas-cliente .rz-datatable{
flex:1 1 auto;
max-height:100%;
overflow:auto;
}

.validar-page .validar-periodos,
.validar-page .validar-resumen{
height:100%;
display:flex;
flex-direction:column;
min-height:280px;
}

.validar-page .validar-periodos .rz-data-grid,
.validar-page .validar-periodos .rz-datatable{
flex:1 1 auto;
max-height:100%;
overflow:auto;
}

.validar-page .validar-resumen{
overflow:auto;
}

.validar-filtros .rz-row{
align-items:center;
}

.validar-filtros .rz-label{
font-size:0.72rem;
color:rgba(0,0,0,0.70);
}

.validar-filtros .rz-textbox,
.validar-filtros .rz-dropdown,
.validar-filtros .rz-multiselect{
width:100%;
max-width:400px;
}

.validar-filtros .rz-button{
border-radius:10px;
}

.validar-page .validar-clientes{
margin:0.25rem auto;
max-width:80vw;
}

.validar-page .validar-clientes-header{
padding:0.25rem 0.5rem;
}

.validar-page .validar-clientes-body{
max-height:26vh;
overflow:auto;
padding:0 0.35rem 0.35rem 0.35rem;
}

@media (max-height: 800px){
.validar-page .validar-clientes-body{
max-height:20vh;
}
}

.validar-page .validar-grid-clientes .rz-grid-table thead{
position:sticky;
top:0;
z-index:2;
}

.validar-page .validar-grid-clientes .rz-grid-table td,
.validar-page .validar-grid-clientes .rz-grid-table th{
white-space:nowrap;
}

.validar-page .rz-row{
row-gap:0.25rem;
}

.validar-page .rz-col{
padding-top:0.15rem;
padding-bottom:0.15rem;
}

.validar-layout{
max-width:1400px;
margin:0.25rem auto 0 auto;
display:flex;
flex-direction:column;
gap:0.35rem;
}

.validar-row{
display:flex;
gap:0.35rem;
align-items:stretch;
}

.validar-col{
flex:1;
min-width:0;
}

.validar-col-6{
flex:0 0 calc(50% - 0.175rem);
}

.validar-col-12{
flex:0 0 100%;
}

.validar-card--fill{
height:100%;
display:flex;
flex-direction:column;
}

.validar-card--scroll{
max-height:32vh;
overflow:auto;
flex:1;
}

@media (max-width: 992px){
.validar-row{
flex-direction:column;
}

.validar-col-6,
.validar-col-12{
flex:0 0 100%;
}
}

/* Estilos para documentos */
.fila-titulo-documentos{
background:rgba(245,245,220,0.9);
border:1px solid rgba(0,0,0,0.10);
padding:0.3rem 0.35rem;
font-weight:700;
color:rgba(0,0,0,0.70);
margin-top:0.5rem;
}

.fila-encabezado-documentos{
background:rgba(245,245,220,0.75);
border-bottom:1px solid rgba(0,0,0,0.10);
padding:0.25rem 0.35rem;
font-weight:600;
color:rgba(0,0,0,0.68);
font-size:0.70rem;
}

.fila-detalle-documento{
border-bottom:1px solid rgba(0,0,0,0.08);
padding:0.2rem 0.35rem;
font-size:0.72rem;
}

.fila-total-documentos{
background:rgba(245,245,220,0.85);
border-top:2px solid rgba(0,0,0,0.12);
padding:0.3rem 0.35rem;
font-weight:700;
color:rgba(0,0,0,0.75);
margin-top:0.25rem;
}

.saldo-favor-cliente{
color:#22543d;
font-weight:700;
}

.saldo-contra-cliente{
color:#742a2a;
font-weight:700;
}

.etiqueta-saldado{
display:inline-block;
margin-left:0.3rem;
padding:0.1rem 0.4rem;
font-size:0.7rem;
background:#c6f6d5;
color:#22543d;
border-radius:3px;
font-weight:600;
}

.etiqueta-cerrado{
display:inline-block;
margin-left:0.5rem;
padding:0.15rem 0.5rem;
font-size:0.7rem;
background:#fbbf24;
color:#78350f;
border-radius:3px;
font-weight:600;
}

.fila-detalle-documento.documento-cerrado{
background-color:#fffbeb !important;
}

.fila-detalle-documento.documento-saldado{
    background-color:#f0fff4 !important;
}

/* Estilo distintivo pero discreto para Total a pagar por el período */
.validar-resumen .fila-total-periodo{
    border:1px solid rgba(79, 70, 229, 0.3);
    border-radius:8px;
    background:linear-gradient(135deg, rgba(79, 70, 229, 0.06) 0%, rgba(129, 140, 248, 0.04) 100%);
    padding:0.3rem 0.4rem;
    margin-top:0.25rem;
    box-shadow:0 2px 6px rgba(79, 70, 229, 0.08);
    border-left:3px solid rgba(79, 70, 229, 0.5);
}

.validar-resumen .fila-total-periodo .rz-col-10 span{
    font-size:0.74rem;
    font-weight:700;
    color:#4338ca;
    letter-spacing:0.1px;
    display:block;
}

.validar-resumen .fila-total-periodo .rz-col-2 span{
    font-size:0.76rem;
    font-weight:800;
    color:#312e81;
    letter-spacing:0.2px;
    display:block;
    text-align:right;
    font-variant-numeric:tabular-nums;
}

.validar-resumen .fila-total-periodo:hover{
    border-color:rgba(79, 70, 229, 0.4);
    box-shadow:0 3px 8px rgba(79, 70, 229, 0.12);
    transition:all 0.2s ease;
}

/* Estilo para "A pagar por tasa" cuando hay documentos - similar a fila-total pero azul menos intenso */
.validar-resumen .fila-apagar-tasa-destacada{
    border-bottom:1px solid rgba(66, 153, 225, 0.15);
    border-bottom-left-radius:8px;
    border-bottom-right-radius:8px;
    background:rgba(66, 153, 225, 0.08);
    color:#2c5282;
    font-weight:700;
    padding:0.25rem 0.35rem;
}

.validar-resumen .fila-apagar-tasa-destacada span{
    font-weight:700;
    color:#2c5282;
}

.validar-resumen .fila-apagar-tasa-destacada .rz-col-2 span{
    display:block;
    text-align:right;
    font-variant-numeric:tabular-nums;
}

/* Estilo para documentos informativos (NC/ND) */
.validar-resumen .fila-documento-info{
    padding-left:0.5rem;
    margin-top:0.15rem;
}

.validar-resumen .fila-documento-info span{
    font-size:0.70rem;
}

/* Nota de Crédito - A favor del cliente (verde leve) */
.validar-resumen .fila-documento-nc{
    background:rgba(34, 197, 94, 0.08);
    border-left:3px solid rgba(34, 197, 94, 0.4);
}

.validar-resumen .fila-documento-nc span{
    color:#15803d;
}

/* Nota de Débito - En contra del cliente (rojo leve) */
.validar-resumen .fila-documento-nd{
    background:rgba(239, 68, 68, 0.08);
    border-left:3px solid rgba(239, 68, 68, 0.4);
}

.validar-resumen .fila-documento-nd span{
    color:#b91c1c;
}

/* Título de cuenta/período en encabezado del panel resumen */
.validar-resumen .fila-cuenta-titulo{
    background:rgba(79, 70, 229, 0.05);
    border-bottom:1px solid rgba(79, 70, 229, 0.15);
    padding:0.20rem 0.35rem;
    margin-bottom:0.15rem;
}

.validar-resumen .fila-cuenta-titulo span{
    font-size:0.68rem;
    color:#4338ca;
    font-weight:600;
}

.validar-resumen .fila-cuenta-titulo-sep{
    margin:0 0.35rem;
    color:rgba(79, 70, 229, 0.35);
    font-weight:400;
}

/* Valores impagos — tono ámbar muy leve */
.validar-resumen .fila-impagos-header{
    background:rgba(251, 191, 36, 0.10);
    border-left:3px solid rgba(217, 119, 6, 0.45);
    margin-top:0.15rem;
}

.validar-resumen .fila-impagos-header span{
    color:#92400e;
    font-weight:600;
    font-size:0.70rem;
}

.validar-resumen .fila-impago-detalle{
    background:rgba(251, 191, 36, 0.06);
    border-left:3px solid rgba(217, 119, 6, 0.25);
}

.validar-resumen .fila-impago-detalle span{
    color:#b45309;
    font-size:0.70rem;
}

.validar-resumen .fila-impago-total{
    background:rgba(251, 191, 36, 0.12);
    border-left:3px solid rgba(217, 119, 6, 0.50);
}

.validar-resumen .fila-impago-total span{
    color:#92400e;
    font-weight:600;
    font-size:0.70rem;
}

/* Botón "Ver documentos" dentro de las filas del resumen */
.validar-btn-docs{
border-radius:6px !important;
min-height:1.3rem !important;
height:1.3rem !important;
padding:0 0.45rem !important;
font-size:0.68rem !important;
font-weight:600 !important;
text-transform:none !important;
box-shadow:none !important;
vertical-align:middle;
line-height:1rem !important;
border:1px solid rgba(0,0,0,0.12) !important;
background:rgba(255,255,255,0.85) !important;
color:rgba(0,0,0,0.65) !important;
margin-left:0.4rem;
}

.validar-btn-docs:hover{
background:rgba(255,255,255,1) !important;
border-color:rgba(0,0,0,0.22) !important;
color:rgba(0,0,0,0.80) !important;
}

.validar-btn-docs .rz-button-icon{
font-size:0.78rem !important;
}

/* =============================================
   MODAL DE DOCUMENTOS
   ============================================= */
.modal-docs-overlay{
position:fixed;
inset:0;
background:rgba(0,0,0,0.45);
z-index:2000;
display:flex;
align-items:center;
justify-content:center;
padding:1rem;
backdrop-filter:blur(2px);
}

.modal-docs-contenido{
background:#fff;
border-radius:14px;
box-shadow:0 20px 60px rgba(0,0,0,0.20), 0 4px 16px rgba(0,0,0,0.10);
width:100%;
max-width:760px;
max-height:85vh;
display:flex;
flex-direction:column;
overflow:hidden;
animation:modalDocsFadeIn 0.18s ease;
}

@keyframes modalDocsFadeIn{
from{ opacity:0; transform:translateY(-12px) scale(0.98); }
to{ opacity:1; transform:translateY(0) scale(1); }
}

.modal-docs-header{
display:flex;
align-items:center;
justify-content:space-between;
padding:0.75rem 1rem 0.6rem 1rem;
border-bottom:1px solid rgba(0,0,0,0.08);
background:linear-gradient(135deg, rgba(42,47,114,0.06) 0%, rgba(42,47,114,0.02) 100%);
border-radius:14px 14px 0 0;
gap:0.5rem;
}

.modal-docs-titulo{
font-size:0.82rem;
font-weight:700;
color:rgba(0,0,0,0.75);
letter-spacing:0.1px;
flex:1;
}

.modal-docs-btn-cerrar{
flex-shrink:0;
border-radius:8px !important;
}

.modal-docs-body{
flex:1;
overflow:auto;
padding:0.6rem 0.75rem;
}

.modal-docs-body .rz-data-grid{
border-radius:8px;
overflow:hidden;
border:1px solid rgba(0,0,0,0.07);
}

.modal-docs-grid .rz-grid-table thead th{
background:rgba(42,47,114,0.06);
border-bottom:1px solid rgba(0,0,0,0.10);
position:sticky;
top:0;
z-index:1;
}

.modal-docs-grid .rz-grid-table thead th .rz-column-title{
font-size:0.70rem;
font-weight:650;
color:rgba(0,0,0,0.70);
text-align:center;
width:100%;
display:block;
}

.modal-docs-grid .rz-grid-table td{
padding:0.25rem 0.40rem;
border-bottom:1px solid rgba(0,0,0,0.06);
font-size:0.72rem;
}

.modal-docs-grid .rz-grid-table tbody tr:hover{
background:rgba(42,47,114,0.04);
}

.modal-docs-grid .rz-grid-table tbody tr:nth-child(even){
background:rgba(0,0,0,0.012);
}

.modal-docs-footer{
display:flex;
align-items:center;
justify-content:flex-end;
gap:0.6rem;
padding:0.55rem 1rem;
border-top:1px solid rgba(0,0,0,0.08);
background:rgba(245,245,220,0.70);
border-radius:0 0 14px 14px;
}

.modal-docs-total-label{
font-size:0.74rem;
font-weight:600;
color:rgba(0,0,0,0.65);
}

.modal-docs-total-valor{
font-size:0.80rem;
font-weight:800;
color:rgba(42,47,114,0.85);
font-variant-numeric:tabular-nums;
min-width:70px;
text-align:right;
}
