/* /Pages/Administracion/ActualizacionCertificado/ActualizacionCertificado.razor.rz.scp.css */
/* ===== ACTUALIZACIÓN DE CERTIFICADO ===== */
.cert-container[b-1lgtqma75r] {
    --cert-primary: var(--color-primary);
    --cert-primary-dark: var(--color-primary-dark);
    --cert-primary-light: var(--color-primary-light);
    --cert-success: var(--color-success);
    --cert-danger: var(--color-danger);
    --cert-warn: var(--color-warning);
    --cert-warn-light: var(--color-warning-light);
    --cert-info: var(--color-info);
    --cert-info-light: var(--color-info-light);
    --cert-bg: var(--bg);
    --cert-card: var(--surface);
    --cert-text: var(--text);
    --cert-text-secondary: var(--text-secondary);
    --cert-text-muted: var(--text-muted);
    --cert-border: var(--border);
    --cert-shadow: var(--shadow-sm);
    --cert-shadow-md: var(--shadow-md);
    --cert-radius: var(--radius-lg);
    --cert-radius-xs: var(--radius-sm);
    --cert-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--cert-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== HEADER ===== */
.cert-header[b-1lgtqma75r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--cert-card);
    border-radius: var(--cert-radius);
    box-shadow: var(--cert-shadow);
    padding: 10px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 56px;
}

.cert-header-left[b-1lgtqma75r] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.cert-header-icon[b-1lgtqma75r] {
    width: 40px;
    height: 40px;
    border-radius: var(--cert-radius-xs);
    background: linear-gradient(135deg, var(--cert-primary) 0%, var(--cert-primary-dark) 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
}

.cert-header-left h2[b-1lgtqma75r] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--cert-text);
}

.cert-header-subtitle[b-1lgtqma75r] {
    margin: 0;
    font-size: 0.72rem;
    color: var(--cert-text-secondary);
}

/* ===== LAYOUT: 2 columnas ===== */
.cert-content[b-1lgtqma75r] {
    flex: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
    gap: 12px;
    min-height: 0;
    overflow: hidden;
}

/* ===== CARDS ===== */
.cert-card[b-1lgtqma75r] {
    background: var(--cert-card);
    border-radius: var(--cert-radius);
    box-shadow: var(--cert-shadow);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0;
    position: relative;
}

.cert-card-header[b-1lgtqma75r] {
    padding: 12px 18px;
    border-bottom: 1px solid var(--cert-border);
    background: linear-gradient(135deg, var(--cert-primary-light) 0%, var(--cert-card) 100%);
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.cert-card-header h3[b-1lgtqma75r] {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--cert-text);
    display: flex;
    align-items: center;
    gap: 8px;
}

.cert-card-header h3 .rzi[b-1lgtqma75r] {
    color: var(--cert-primary);
    font-size: 1.2rem;
}

.cert-card-body[b-1lgtqma75r] {
    flex: 1;
    overflow-y: auto;
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.cert-card-footer[b-1lgtqma75r] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 10px 16px;
    border-top: 1px solid var(--cert-border);
    background: var(--cert-card);
    flex-shrink: 0;
    flex-wrap: wrap;
}

/* ===== FIELDS ===== */
.cert-field[b-1lgtqma75r] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.cert-row[b-1lgtqma75r] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.cert-field label[b-1lgtqma75r] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--cert-text-secondary);
}

.cert-readonly-input[b-1lgtqma75r],
.cert-input[b-1lgtqma75r] {
    height: 36px;
    border: 1.5px solid #CBD5E1;
    border-radius: var(--cert-radius-xs);
    font-size: 0.85rem;
    padding: 0 10px;
    background: white;
    color: var(--cert-text);
    transition: var(--cert-transition);
    box-sizing: border-box;
    width: 100%;
}

.cert-readonly-input[b-1lgtqma75r] {
    background: #F8FAFC;
    color: var(--cert-text-secondary);
}

.cert-input:focus[b-1lgtqma75r] {
    border-color: var(--cert-primary);
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
    outline: none;
}

.cert-card-body[b-1lgtqma75r]  .rz-textbox,
.cert-card-body[b-1lgtqma75r]  .rz-inputtext,
.cert-card-body[b-1lgtqma75r]  .rz-password input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cert-radius-xs) !important;
    font-size: 0.85rem !important;
    height: 36px !important;
    background: white !important;
}

.cert-card-body[b-1lgtqma75r]  .rz-textbox:focus,
.cert-card-body[b-1lgtqma75r]  .rz-state-focused {
    border-color: var(--cert-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
    outline: none;
}

.cert-checkbox[b-1lgtqma75r] {
    flex-direction: row;
    align-items: center;
    gap: 8px;
}

.cert-checkbox label[b-1lgtqma75r] {
    text-transform: none;
    letter-spacing: 0;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--cert-text);
    cursor: pointer;
}

/* ===== INFO / WARN ===== */
.cert-info[b-1lgtqma75r] {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    background: var(--cert-info-light);
    border-left: 4px solid var(--cert-info);
    padding: 12px 14px;
    border-radius: var(--cert-radius-xs);
    font-size: 0.82rem;
    color: var(--cert-text);
    line-height: 1.45;
}

.cert-info .rzi[b-1lgtqma75r] {
    color: var(--cert-info);
    font-size: 1.2rem;
    flex-shrink: 0;
    margin-top: 1px;
}

.cert-info code[b-1lgtqma75r] {
    background: rgba(0,0,0,0.06);
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 0.78rem;
}

.cert-info-warn[b-1lgtqma75r] {
    background: var(--cert-warn-light);
    border-left-color: var(--cert-warn);
}

.cert-info-warn .rzi[b-1lgtqma75r] {
    color: var(--cert-warn);
}

/* ===== FILE PICKER ===== */
.cert-file-picker[b-1lgtqma75r] {
    display: flex;
    width: 100%;
}

.cert-file-label[b-1lgtqma75r] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    border: 2px dashed var(--cert-border);
    border-radius: var(--cert-radius-xs);
    background: #FAFBFC;
    cursor: pointer;
    transition: var(--cert-transition);
    font-size: 0.85rem;
    color: var(--cert-text-secondary);
    width: 100%;
    box-sizing: border-box;
}

.cert-file-label:hover[b-1lgtqma75r] {
    border-color: var(--cert-primary);
    background: var(--cert-primary-light);
    color: var(--cert-primary-dark);
}

.cert-file-label .rzi[b-1lgtqma75r] {
    font-size: 1.4rem;
    color: var(--cert-primary);
}

.cert-input-hidden[b-1lgtqma75r] {
    display: none;
}

/* ===== PREVIEW ===== */
.cert-preview[b-1lgtqma75r] {
    background: var(--cert-bg);
    border-radius: var(--cert-radius-xs);
    padding: 12px 14px;
    border: 1px solid var(--cert-border);
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.cert-preview-title[b-1lgtqma75r] {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--cert-text-secondary);
    letter-spacing: 0.05em;
}

.cert-preview-row[b-1lgtqma75r] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px 14px;
}

.cert-preview-cell[b-1lgtqma75r] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.cert-preview-label[b-1lgtqma75r] {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--cert-text-secondary);
}

.cert-preview-value[b-1lgtqma75r] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--cert-text);
    word-break: break-word;
}

.cert-preview-value-sm[b-1lgtqma75r] {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--cert-text-secondary);
}

/* ===== PILLS ===== */
.cert-pill[b-1lgtqma75r] {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    font-size: 0.7rem;
    font-weight: 700;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.cert-pill-ok[b-1lgtqma75r] {
    background: rgba(16, 185, 129, 0.15);
    color: var(--cert-success);
}

.cert-pill-bad[b-1lgtqma75r] {
    background: rgba(239, 68, 68, 0.15);
    color: var(--cert-danger);
}

/* ===== BUTTONS ===== */
.cert-btn[b-1lgtqma75r] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cert-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cert-transition);
    color: white;
    white-space: nowrap;
}

.cert-btn:hover:not(:disabled)[b-1lgtqma75r] {
    transform: translateY(-1px);
    box-shadow: var(--cert-shadow-md);
}

.cert-btn:disabled[b-1lgtqma75r] {
    opacity: 0.55;
    cursor: not-allowed;
}

.cert-btn .rzi[b-1lgtqma75r] {
    font-size: 1rem;
}

.cert-btn-primary[b-1lgtqma75r] {
    background: var(--cert-success);
}

.cert-btn-secondary[b-1lgtqma75r] {
    background: var(--cert-text-secondary);
}

/* Boton "Limpiar" unificado: solido plomo con icono cleaning_services (--color-limpiar). */
.cert-btn-limpiar[b-1lgtqma75r] {
    background: var(--color-limpiar);
}

.cert-btn-limpiar:hover:not(:disabled)[b-1lgtqma75r] {
    background: var(--color-limpiar-dark);
}

.cert-btn-info[b-1lgtqma75r] {
    background: var(--cert-info);
}

/* ===== LOADING ===== */
.cert-loading-overlay[b-1lgtqma75r] {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    z-index: 10;
    color: var(--cert-text-secondary);
    font-weight: 600;
    font-size: 0.85rem;
}

.cert-loading-spinner[b-1lgtqma75r] {
    width: 42px;
    height: 42px;
    border: 4px solid var(--cert-border);
    border-top-color: var(--cert-primary);
    border-radius: 50%;
    animation: certSpin-b-1lgtqma75r 0.8s linear infinite;
}

@keyframes certSpin-b-1lgtqma75r {
    to { transform: rotate(360deg); }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .cert-content[b-1lgtqma75r] {
        grid-template-columns: 1fr;
        overflow-y: auto;
    }
}

@media (max-width: 640px) {
    .cert-container[b-1lgtqma75r] {
        padding: 6px 8px;
        gap: 6px;
    }

    .cert-row[b-1lgtqma75r] {
        grid-template-columns: 1fr;
    }

    .cert-card-footer[b-1lgtqma75r] {
        justify-content: stretch;
    }

    .cert-card-footer .cert-btn[b-1lgtqma75r] {
        flex: 1;
        justify-content: center;
    }
}
/* /Pages/Administracion/AdministracionPermisos/AdministracionPermisosIndex.razor.rz.scp.css */
/* ===== Administracion de Permisos - DESIGN SYSTEM =====
   Full-height (height:100%), scroll solo en el arbol. Tokens del design
   system, estilos scoped (CSS isolation). Misma familia visual que los
   mantenedores (ms-*), con prefijo ap-. */

.ap-container[b-odbaaxqj0g] {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.ap-control-bar[b-odbaaxqj0g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: 10px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 56px;
}

.ap-control-left[b-odbaaxqj0g] { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }

.ap-header-icon[b-odbaaxqj0g] {
    width: 38px;
    height: 38px;
    border-radius: var(--radius-md);
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--shadow-xs);
}
.ap-header-icon .rzi[b-odbaaxqj0g] { font-size: 1.25rem; }

.ap-title[b-odbaaxqj0g] { font-size: 1rem; font-weight: var(--fw-bold); color: var(--text); margin: 0; line-height: 1.2; }
.ap-subtitle[b-odbaaxqj0g] { font-size: 0.72rem; color: var(--text-secondary); margin: 2px 0 0; }

.ap-control-center[b-odbaaxqj0g] { flex: 1; display: flex; align-items: center; justify-content: center; }

.ap-loading-indicator[b-odbaaxqj0g] { display: flex; align-items: center; gap: 10px; animation: apFadeIn-b-odbaaxqj0g 0.3s ease; }
.ap-loading-spinner[b-odbaaxqj0g] {
    width: 20px; height: 20px;
    border: 2.5px solid var(--border);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: apSpin-b-odbaaxqj0g 0.8s linear infinite;
}
.ap-loading-text[b-odbaaxqj0g] { font-size: 0.8rem; font-weight: var(--fw-semibold); color: var(--color-primary); }

.ap-control-right[b-odbaaxqj0g] { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }

/* ===== BOTONES ===== */
.ap-btn[b-odbaaxqj0g] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--radius-sm);
    font-size: 0.78rem;
    font-weight: var(--fw-bold);
    cursor: pointer;
    transition: var(--transition);
    white-space: nowrap;
    color: white;
}
.ap-btn:hover:not(:disabled)[b-odbaaxqj0g] { transform: translateY(-1px); box-shadow: var(--shadow-md); }
.ap-btn:active:not(:disabled)[b-odbaaxqj0g] { transform: translateY(0); }
.ap-btn:disabled[b-odbaaxqj0g] { opacity: 0.6; cursor: not-allowed; }
.ap-btn .rzi[b-odbaaxqj0g] { font-size: 1rem; }

.ap-btn-sync[b-odbaaxqj0g] { background: var(--color-info); }
.ap-btn-guardar[b-odbaaxqj0g] { background: var(--color-success); }

/* ===== TOOLBAR (selector de rol) ===== */
.ap-toolbar[b-odbaaxqj0g] {
    display: flex;
    align-items: flex-end;
    gap: 16px;
    flex-wrap: wrap;
    background: var(--surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: 10px 16px;
    flex-shrink: 0;
}

.ap-rol-field[b-odbaaxqj0g] { display: flex; flex-direction: column; gap: 4px; }
.ap-rol-label[b-odbaaxqj0g] {
    font-size: 0.7rem;
    font-weight: var(--fw-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.ap-master-hint[b-odbaaxqj0g],
.ap-sel-count[b-odbaaxqj0g] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: var(--text-sm);
    padding-bottom: 4px;
}
.ap-master-hint[b-odbaaxqj0g] { color: var(--color-accent2, var(--color-success-dark)); font-weight: var(--fw-semibold); }
.ap-master-hint .rzi[b-odbaaxqj0g] { color: var(--color-success); }
.ap-sel-count[b-odbaaxqj0g] { color: var(--text-secondary); }
.ap-sel-count .rzi[b-odbaaxqj0g] { color: var(--color-primary); font-size: 1.1rem; }

/* ===== ARBOL (scroll interno) ===== */
.ap-tree-wrapper[b-odbaaxqj0g] {
    flex: 1;
    min-height: 0;
    overflow: auto;
    background: var(--surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
}

.ap-placeholder[b-odbaaxqj0g] {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: var(--text-muted);
    font-size: var(--text-md);
}
.ap-placeholder .rzi[b-odbaaxqj0g] { font-size: 2.5rem; color: var(--color-primary-light); }

/* ===== ANIMACIONES ===== */
@keyframes apSpin-b-odbaaxqj0g { to { transform: rotate(360deg); } }
@keyframes apFadeIn-b-odbaaxqj0g {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .ap-container[b-odbaaxqj0g] { padding: 8px 10px; gap: 8px; }
    .ap-control-bar[b-odbaaxqj0g] { flex-wrap: wrap; padding: 8px 12px; }
    .ap-control-center[b-odbaaxqj0g] { order: 3; width: 100%; }
}

@media (max-width: 640px) {
    .ap-container[b-odbaaxqj0g] { padding: 6px 8px; gap: 6px; }
    .ap-control-bar[b-odbaaxqj0g] { flex-direction: column; gap: 8px; }
    .ap-control-left[b-odbaaxqj0g], .ap-control-right[b-odbaaxqj0g] { width: 100%; justify-content: center; }
    .ap-control-right[b-odbaaxqj0g] { flex-wrap: wrap; }
    .ap-btn[b-odbaaxqj0g] { flex: 1; justify-content: center; min-width: 0; }
}
/* /Pages/Administracion/AdministracionPermisos/Componentes/ArbolPermisos.razor.rz.scp.css */
/* ===== ArbolPermisos - arbol de checkboxes de permisos por rol =====
   Tokens del design system, estilos scoped (CSS isolation). */

.ap-tree[b-tzgu3v1ijh] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-3);
}

/* ----- Estado vacio ----- */
.ap-empty[b-tzgu3v1ijh] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-5);
    color: var(--text-secondary);
    font-size: var(--text-base);
    justify-content: center;
}
.ap-empty .rzi[b-tzgu3v1ijh] { color: var(--color-info); font-size: 1.25rem; }

/* ----- Nodo (opcion principal + sus subopciones) ----- */
.ap-node[b-tzgu3v1ijh] {
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--surface);
    overflow: hidden;
    transition: var(--transition);
}
.ap-node.marcada[b-tzgu3v1ijh] {
    border-color: var(--color-primary-light);
    box-shadow: var(--shadow-xs);
}

/* ----- Fila de opcion principal ----- */
.ap-op-row[b-tzgu3v1ijh] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    background: linear-gradient(135deg, var(--color-primary-light) 0%, var(--surface) 100%);
    border-bottom: 1px solid var(--border);
    cursor: pointer;
    user-select: none;
}

.ap-op-text[b-tzgu3v1ijh] { display: flex; flex-direction: column; line-height: 1.2; }
.ap-op-nombre[b-tzgu3v1ijh] { font-size: var(--text-base); font-weight: var(--fw-bold); color: var(--text); }
.ap-op-key[b-tzgu3v1ijh] {
    font-size: var(--text-xs);
    color: var(--text-muted);
    font-family: ui-monospace, monospace;
}

.ap-op-count[b-tzgu3v1ijh] {
    margin-left: auto;
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    color: var(--text-secondary);
    background: var(--bg);
    border-radius: var(--radius-full);
    padding: 2px 10px;
}

/* ----- Subopciones ----- */
.ap-subs[b-tzgu3v1ijh] {
    display: flex;
    flex-direction: column;
    padding: var(--space-1) var(--space-2);
}

.ap-sub-row[b-tzgu3v1ijh] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: 6px var(--space-3);
    border-radius: var(--radius-sm);
    cursor: pointer;
    user-select: none;
    transition: var(--transition);
}
.ap-sub-row:hover[b-tzgu3v1ijh] { background: var(--bg); }
.ap-sub-row.marcada .ap-sub-nombre[b-tzgu3v1ijh] { color: var(--text); font-weight: var(--fw-medium); }

.ap-sub-text[b-tzgu3v1ijh] { display: flex; flex-direction: column; line-height: 1.2; }
.ap-sub-nombre[b-tzgu3v1ijh] { font-size: var(--text-sm); color: var(--text-secondary); }
.ap-sub-key[b-tzgu3v1ijh] {
    font-size: var(--text-xs);
    color: var(--text-muted);
    font-family: ui-monospace, monospace;
}

/* ----- Contenedor (nivel 2 desplegable, agrupa pantallas de nivel 3) ----- */
.ap-sub-row.contenedor .ap-sub-nombre[b-tzgu3v1ijh] {
    font-weight: var(--fw-semibold);
    color: var(--text);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.ap-sub-row.contenedor .rzi[b-tzgu3v1ijh] { font-size: 1rem; color: var(--color-primary); }

/* ----- Pantallas de nivel 3 (indentadas bajo su contenedor) ----- */
.ap-subs-hijos[b-tzgu3v1ijh] {
    margin-left: var(--space-4);
    padding-left: var(--space-2);
    border-left: 2px solid var(--border);
}

/* ----- Checkboxes ----- */
.ap-op-row input[type="checkbox"][b-tzgu3v1ijh],
.ap-sub-row input[type="checkbox"][b-tzgu3v1ijh] {
    width: 17px;
    height: 17px;
    accent-color: var(--color-primary);
    cursor: pointer;
    flex-shrink: 0;
}
.ap-op-row input[type="checkbox"]:disabled[b-tzgu3v1ijh],
.ap-sub-row input[type="checkbox"]:disabled[b-tzgu3v1ijh] { cursor: not-allowed; }
/* /Pages/Administracion/ParametrosEmpresa/Componentes/AdministracionParametros.razor.rz.scp.css */
/* ===== ADMINISTRACIÓN DE PARÁMETROS (grilla) ===== */
.ap-container[b-kx8uth59zl] {
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-sizing: border-box;
    gap: 10px;
}

/* ===== TOOLBAR ===== */
.ap-toolbar[b-kx8uth59zl] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    background: var(--surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: 12px 16px;
    flex-shrink: 0;
}

.ap-filtros[b-kx8uth59zl] {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    flex-wrap: wrap;
}

.ap-filtro-field[b-kx8uth59zl] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 200px;
}

.ap-filtro-label[b-kx8uth59zl] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--text-secondary);
}

/* ===== BUTTONS ===== */
.ap-btn[b-kx8uth59zl] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--radius-sm);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--transition);
    color: white;
    white-space: nowrap;
    height: 36px;
}

.ap-btn:hover:not(:disabled)[b-kx8uth59zl] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.ap-btn .rzi[b-kx8uth59zl] {
    font-size: 1rem;
}

.ap-btn-buscar[b-kx8uth59zl] {
    background: var(--color-accent);
}

.ap-btn-nuevo[b-kx8uth59zl] {
    background: var(--color-primary);
}

/* ===== GRID ===== */
.ap-grid-wrapper[b-kx8uth59zl] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    background: var(--surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
    padding: 8px;
    box-sizing: border-box;
}

.ap-valor[b-kx8uth59zl] {
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.8rem;
}

.ap-flag[b-kx8uth59zl] {
    font-size: 1.1rem;
}

.ap-flag.on[b-kx8uth59zl] {
    color: var(--color-success);
}

.ap-flag.off[b-kx8uth59zl] {
    color: var(--text-muted);
}

/* ===== ACTION BUTTON ===== */
.ap-action-btn[b-kx8uth59zl] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition);
    background: transparent;
}

.ap-action-btn .rzi[b-kx8uth59zl] {
    font-size: 1.05rem;
}

.ap-action-btn.edit[b-kx8uth59zl] {
    color: var(--color-primary);
}

.ap-action-btn.edit:hover[b-kx8uth59zl] {
    background: var(--color-primary-light);
}

@media (max-width: 640px) {
    .ap-filtro-field[b-kx8uth59zl] {
        min-width: 140px;
    }
}
/* /Pages/Administracion/ParametrosEmpresa/Componentes/FormularioParametros.razor.rz.scp.css */
/* ===== FORMULARIO PARÁMETROS (curado) ===== */
.fp-wrapper[b-w612tdn0l5] {
    height: 100%;
    display: flex;
    justify-content: center;
    overflow: hidden;
    box-sizing: border-box;
}

.fp-card[b-w612tdn0l5] {
    background: var(--surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0;
    position: relative;
    width: 100%;
    max-width: 880px;
}

.fp-card-header[b-w612tdn0l5] {
    padding: 12px 18px;
    border-bottom: 1px solid var(--border);
    background: linear-gradient(135deg, var(--color-primary-light) 0%, var(--surface) 100%);
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 12px;
}

.fp-card-header h3[b-w612tdn0l5] {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--text);
    display: flex;
    align-items: center;
    gap: 8px;
}

.fp-card-header h3 .rzi[b-w612tdn0l5] {
    color: var(--color-primary);
    font-size: 1.2rem;
}

.fp-card-body[b-w612tdn0l5] {
    flex: 1;
    overflow-y: auto;
    padding: 18px;
}

.fp-card-footer[b-w612tdn0l5] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 10px 16px;
    border-top: 1px solid var(--border);
    background: var(--surface);
    flex-shrink: 0;
}

/* ===== FIELDS ===== */
.fp-grid[b-w612tdn0l5] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 18px;
}

.fp-field[b-w612tdn0l5] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.fp-field label[b-w612tdn0l5] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--text-secondary);
}

.fp-input[b-w612tdn0l5] {
    height: 36px;
    border: 1.5px solid #CBD5E1;
    border-radius: var(--radius-sm);
    font-size: 0.85rem;
    padding: 0 10px;
    background: white;
    color: var(--text);
    transition: var(--transition);
    box-sizing: border-box;
    width: 100%;
}

.fp-input:focus[b-w612tdn0l5] {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
    outline: none;
}

.fp-card-body[b-w612tdn0l5]  .rz-textbox,
.fp-card-body[b-w612tdn0l5]  .rz-inputtext,
.fp-card-body[b-w612tdn0l5]  .rz-password input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--radius-sm) !important;
    font-size: 0.85rem !important;
    height: 36px !important;
    background: white !important;
}

.fp-card-body[b-w612tdn0l5]  .rz-textbox:focus,
.fp-card-body[b-w612tdn0l5]  .rz-state-focused {
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
    outline: none;
}

.fp-hint[b-w612tdn0l5] {
    font-size: 0.68rem;
    color: var(--text-muted);
    font-weight: 500;
}

.fp-checkbox[b-w612tdn0l5] {
    grid-column: 1 / -1;
    flex-direction: row;
    align-items: center;
    gap: 8px;
}

.fp-checkbox label[b-w612tdn0l5] {
    text-transform: none;
    letter-spacing: 0;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text);
    cursor: pointer;
}

/* ===== BUTTONS ===== */
.fp-btn[b-w612tdn0l5] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 16px;
    border: none;
    border-radius: var(--radius-sm);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--transition);
    color: white;
    white-space: nowrap;
}

.fp-btn:hover:not(:disabled)[b-w612tdn0l5] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.fp-btn:disabled[b-w612tdn0l5] {
    opacity: 0.55;
    cursor: not-allowed;
}

.fp-btn .rzi[b-w612tdn0l5] {
    font-size: 1rem;
}

.fp-btn-success[b-w612tdn0l5] {
    background: var(--color-success);
}

/* ===== LOADING ===== */
.fp-loading-overlay[b-w612tdn0l5] {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    z-index: 10;
    color: var(--text-secondary);
    font-weight: 600;
    font-size: 0.85rem;
}

.fp-loading-spinner[b-w612tdn0l5] {
    width: 42px;
    height: 42px;
    border: 4px solid var(--border);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: fpSpin-b-w612tdn0l5 0.8s linear infinite;
}

@keyframes fpSpin-b-w612tdn0l5 {
    to { transform: rotate(360deg); }
}

@media (max-width: 640px) {
    .fp-grid[b-w612tdn0l5] {
        grid-template-columns: 1fr;
    }

    .fp-card-footer .fp-btn[b-w612tdn0l5] {
        flex: 1;
        justify-content: center;
    }
}
/* /Pages/Administracion/ParametrosEmpresa/Componentes/ParametroAdminFormulario.razor.rz.scp.css */
/* ===== MODAL PARÁMETRO (ADMIN) ===== */
.paf-modal[b-wkbf9y0zi0] {
    display: flex;
    flex-direction: column;
    position: relative;
    font-family: var(--font-family);
}

.paf-body[b-wkbf9y0zi0] {
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.paf-grid[b-wkbf9y0zi0] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 16px;
}

.paf-field[b-wkbf9y0zi0] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.paf-full[b-wkbf9y0zi0] {
    grid-column: 1 / -1;
}

.paf-label[b-wkbf9y0zi0] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--text-secondary);
}

.paf-input[b-wkbf9y0zi0],
.paf-textarea[b-wkbf9y0zi0] {
    border: 1.5px solid #CBD5E1;
    border-radius: var(--radius-sm);
    font-size: 0.85rem;
    padding: 0 10px;
    background: white;
    color: var(--text);
    transition: var(--transition);
    box-sizing: border-box;
    width: 100%;
    font-family: var(--font-family);
}

.paf-input[b-wkbf9y0zi0] {
    height: 36px;
}

.paf-textarea[b-wkbf9y0zi0] {
    padding: 8px 10px;
    resize: vertical;
    min-height: 64px;
    line-height: 1.4;
}

.paf-input:focus[b-wkbf9y0zi0],
.paf-textarea:focus[b-wkbf9y0zi0] {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
    outline: none;
}

.paf-input[readonly][b-wkbf9y0zi0] {
    background: #F8FAFC;
    color: var(--text-secondary);
    cursor: not-allowed;
}

.paf-checkbox[b-wkbf9y0zi0] {
    flex-direction: row;
    align-items: center;
    gap: 8px;
}

.paf-checkbox label[b-wkbf9y0zi0] {
    text-transform: none;
    letter-spacing: 0;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text);
    cursor: pointer;
}

.paf-note[b-wkbf9y0zi0] {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    background: var(--color-info-light);
    border-left: 4px solid var(--color-info);
    padding: 10px 12px;
    border-radius: var(--radius-sm);
    font-size: 0.78rem;
    color: var(--text);
    line-height: 1.4;
}

.paf-note .rzi[b-wkbf9y0zi0] {
    color: var(--color-info);
    font-size: 1.1rem;
    flex-shrink: 0;
    margin-top: 1px;
}

/* ===== FOOTER ===== */
.paf-footer[b-wkbf9y0zi0] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 12px 16px;
    border-top: 1px solid var(--border);
    background: var(--surface);
}

.paf-btn[b-wkbf9y0zi0] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 16px;
    border: none;
    border-radius: var(--radius-sm);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--transition);
    color: white;
    white-space: nowrap;
}

.paf-btn:hover:not(:disabled)[b-wkbf9y0zi0] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.paf-btn:disabled[b-wkbf9y0zi0] {
    opacity: 0.55;
    cursor: not-allowed;
}

.paf-btn .rzi[b-wkbf9y0zi0] {
    font-size: 1rem;
}

.paf-btn-primary[b-wkbf9y0zi0] {
    background: var(--color-success);
}

.paf-btn-secondary[b-wkbf9y0zi0] {
    background: var(--color-secondary);
}

/* ===== LOADING ===== */
.paf-loading-overlay[b-wkbf9y0zi0] {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    z-index: 10;
    color: var(--text-secondary);
    font-weight: 600;
    font-size: 0.85rem;
}

.paf-loading-spinner[b-wkbf9y0zi0] {
    width: 38px;
    height: 38px;
    border: 4px solid var(--border);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: pafSpin-b-wkbf9y0zi0 0.8s linear infinite;
}

@keyframes pafSpin-b-wkbf9y0zi0 {
    to { transform: rotate(360deg); }
}

@media (max-width: 640px) {
    .paf-grid[b-wkbf9y0zi0] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Administracion/ParametrosEmpresa/ParametrosEmpresaIndex.razor.rz.scp.css */
/* ===== PARÁMETROS DE EMPRESA (host de pestañas) ===== */
.pe-container[b-wsbwgdfsjb] {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== HEADER ===== */
.pe-header[b-wsbwgdfsjb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: 10px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 56px;
}

.pe-header-left[b-wsbwgdfsjb] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.pe-header-icon[b-wsbwgdfsjb] {
    width: 40px;
    height: 40px;
    border-radius: var(--radius-sm);
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
}

.pe-header-left h2[b-wsbwgdfsjb] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--text);
}

.pe-header-subtitle[b-wsbwgdfsjb] {
    margin: 0;
    font-size: 0.72rem;
    color: var(--text-secondary);
}

/* ===== TABS ===== */
/* Override scopeado al AppTabs de esta pantalla (hook CssClass="pe-tabs") para igualar
   el tamaño compacto de los tabs de NuevoDocumento (.dte-tab-btn): padding 7px 12px,
   fuente 0.78rem e icono 1rem. No se modifica el AppTabs compartido. */
.pe-tabs[b-wsbwgdfsjb] {
    flex-shrink: 0;
}

.pe-container[b-wsbwgdfsjb]  .pe-tabs.app-tabs-pill {
    gap: 4px;
}

.pe-container[b-wsbwgdfsjb]  .pe-tabs.app-tabs-pill .app-tab {
    padding: 7px 12px;
    gap: 6px;
    font-size: 0.78rem;
    font-weight: 600;
}

.pe-container[b-wsbwgdfsjb]  .pe-tabs.app-tabs-pill .app-tab i,
.pe-container[b-wsbwgdfsjb]  .pe-tabs.app-tabs-pill .app-tab .rz-icon {
    font-size: 1rem;
    width: auto;
    height: auto;
}

.pe-container[b-wsbwgdfsjb]  .pe-tabs.app-tabs-pill .app-tab.active {
    box-shadow: none;
}

/* ===== CONTENIDO DE PESTAÑA ===== */
.pe-tabcontent[b-wsbwgdfsjb] {
    flex: 1;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
/* /Pages/Administracion/PermisosUsuario/PermisosUsuarioIndex.razor.rz.scp.css */
/* ===== PERMISOS USUARIO (cupos) ===== */
.pu-container[b-wnub6rjg2c] {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== HEADER ===== */
.pu-header[b-wnub6rjg2c] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: 10px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 56px;
}

.pu-header-left[b-wnub6rjg2c] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.pu-header-icon[b-wnub6rjg2c] {
    width: 40px;
    height: 40px;
    border-radius: var(--radius-sm);
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
}

.pu-header-left h2[b-wnub6rjg2c] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--text);
}

.pu-header-subtitle[b-wnub6rjg2c] {
    margin: 0;
    font-size: 0.72rem;
    color: var(--text-secondary);
}

/* ===== CONTENIDO ===== */
.pu-content[b-wnub6rjg2c] {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    min-height: 0;
    overflow: hidden;
}

/* ===== ESTADOS (verificando / denegado) ===== */
.pu-state[b-wnub6rjg2c] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    height: 100%;
    color: var(--text-secondary);
    font-weight: 600;
    font-size: 0.85rem;
}

.pu-denied[b-wnub6rjg2c] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 100%;
    text-align: center;
    color: var(--text-secondary);
}

.pu-denied .rzi[b-wnub6rjg2c] {
    font-size: 2.6rem;
    color: var(--color-danger);
}

.pu-denied h3[b-wnub6rjg2c] {
    margin: 4px 0 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--text);
}

.pu-denied p[b-wnub6rjg2c] {
    margin: 0;
    font-size: 0.82rem;
}

/* ===== CARD ===== */
.pu-card[b-wnub6rjg2c] {
    background: var(--surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0;
    position: relative;
    width: 100%;
    max-width: 620px;
}

.pu-card-header[b-wnub6rjg2c] {
    padding: 12px 18px;
    border-bottom: 1px solid var(--border);
    background: linear-gradient(135deg, var(--color-primary-light) 0%, var(--surface) 100%);
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 12px;
}

.pu-card-header h3[b-wnub6rjg2c] {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--text);
    display: flex;
    align-items: center;
    gap: 8px;
}

.pu-card-header h3 .rzi[b-wnub6rjg2c] {
    color: var(--color-primary);
    font-size: 1.2rem;
}

.pu-card-body[b-wnub6rjg2c] {
    flex: 1;
    overflow-y: auto;
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.pu-card-footer[b-wnub6rjg2c] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 10px 16px;
    border-top: 1px solid var(--border);
    background: var(--surface);
    flex-shrink: 0;
}

/* ===== INFO ===== */
.pu-info[b-wnub6rjg2c] {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    background: var(--color-info-light);
    border-left: 4px solid var(--color-info);
    padding: 10px 12px;
    border-radius: var(--radius-sm);
    font-size: 0.8rem;
    color: var(--text);
    line-height: 1.4;
}

.pu-info .rzi[b-wnub6rjg2c] {
    color: var(--color-info);
    font-size: 1.1rem;
    flex-shrink: 0;
    margin-top: 1px;
}

/* ===== FIELDS ===== */
.pu-grid[b-wnub6rjg2c] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 18px;
}

.pu-field[b-wnub6rjg2c] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.pu-field label[b-wnub6rjg2c] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--text-secondary);
}

.pu-card-body[b-wnub6rjg2c]  .rz-numeric,
.pu-card-body[b-wnub6rjg2c]  .rz-numeric input {
    border-radius: var(--radius-sm) !important;
    font-size: 0.85rem !important;
    height: 36px !important;
    background: white !important;
}

/* ===== BUTTONS ===== */
.pu-btn[b-wnub6rjg2c] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 16px;
    border: none;
    border-radius: var(--radius-sm);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--transition);
    color: white;
    white-space: nowrap;
}

.pu-btn:hover:not(:disabled)[b-wnub6rjg2c] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.pu-btn:disabled[b-wnub6rjg2c] {
    opacity: 0.55;
    cursor: not-allowed;
}

.pu-btn .rzi[b-wnub6rjg2c] {
    font-size: 1rem;
}

.pu-btn-success[b-wnub6rjg2c] {
    background: var(--color-success);
}

/* ===== LOADING ===== */
.pu-loading-overlay[b-wnub6rjg2c] {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    z-index: 10;
    color: var(--text-secondary);
    font-weight: 600;
    font-size: 0.85rem;
}

.pu-loading-spinner[b-wnub6rjg2c] {
    width: 42px;
    height: 42px;
    border: 4px solid var(--border);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: puSpin-b-wnub6rjg2c 0.8s linear infinite;
}

@keyframes puSpin-b-wnub6rjg2c {
    to { transform: rotate(360deg); }
}

@media (max-width: 640px) {
    .pu-grid[b-wnub6rjg2c] {
        grid-template-columns: 1fr;
    }

    .pu-card-footer .pu-btn[b-wnub6rjg2c] {
        flex: 1;
        justify-content: center;
    }
}
/* /Pages/Compras/ConsultaOrdenCompra/ConsultaOrdenCompraIndex.razor.rz.scp.css */
/* =============================================================
   ConsultaOrdenCompra — estilos aislados (consume design tokens)
   ============================================================= */

.coc-container[b-wnvmmqirvg] {
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 10px;
    background: var(--bg);
    font-family: var(--font-family);
    color: var(--text);
    overflow: hidden;
}

/* ===== BARRA DE CONTROL ===== */
.coc-control-bar[b-wnvmmqirvg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 14px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xs);
    flex-shrink: 0;
}

.coc-control-left[b-wnvmmqirvg] { display: flex; align-items: center; min-width: 0; }
.coc-control-right[b-wnvmmqirvg] { display: flex; align-items: center; gap: 8px; }

.coc-loading-text[b-wnvmmqirvg] {
    font-size: 0.8rem;
    font-weight: var(--fw-medium);
    color: var(--color-primary-dark);
}

/* ===== FILTROS ===== */
.coc-filtros[b-wnvmmqirvg] {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    flex-wrap: wrap;
    padding: 12px 14px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xs);
    flex-shrink: 0;
}

.coc-filtro[b-wnvmmqirvg] { display: flex; flex-direction: column; gap: 3px; }
.coc-filtro-grow[b-wnvmmqirvg] { flex: 1; min-width: 200px; }

.coc-filtro label[b-wnvmmqirvg] {
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    color: var(--text-secondary);
}

.coc-filtros[b-wnvmmqirvg]  .rz-textbox,
.coc-filtros[b-wnvmmqirvg]  .rz-numeric,
.coc-filtros[b-wnvmmqirvg]  .rz-datepicker {
    height: 32px !important;
    min-height: 32px !important;
    font-size: 0.8rem !important;
}

.coc-filtros[b-wnvmmqirvg]  .rz-numeric-up,
.coc-filtros[b-wnvmmqirvg]  .rz-numeric-down { display: none !important; }

/* ===== BOTONES ===== */
.coc-btn[b-wnvmmqirvg] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border: none;
    border-radius: var(--radius-md);
    font-size: 0.8rem;
    font-weight: 700;
    cursor: pointer;
    color: #fff;
    transition: var(--transition);
}

.coc-btn:hover:not(:disabled)[b-wnvmmqirvg] { transform: translateY(-1px); box-shadow: var(--shadow-md); }
.coc-btn:disabled[b-wnvmmqirvg] { opacity: 0.6; cursor: not-allowed; }
.coc-btn .rzi[b-wnvmmqirvg] { font-size: 1rem; }
/* Botón Buscar = naranjo de marca, unificado con todos los "Buscar" de la app (--color-accent). */
.coc-btn-buscar[b-wnvmmqirvg] { background: var(--color-accent); }
.coc-btn-buscar:hover:not(:disabled)[b-wnvmmqirvg] { background: var(--color-accent-dark); }

/* Botón Filtros: estilo secundario; "active" cuando el panel está abierto. */
.coc-btn-filtros[b-wnvmmqirvg] {
    background: var(--surface);
    color: var(--text-secondary);
    border: 1px solid var(--border);
}

.coc-btn-filtros:hover:not(:disabled)[b-wnvmmqirvg] { background: var(--bg); color: var(--text); }
.coc-btn-filtros.active[b-wnvmmqirvg] {
    background: var(--color-primary-light);
    color: var(--color-primary-dark);
    border-color: var(--color-primary);
}

/* ===== GRILLA ===== */
.coc-grid-card[b-wnvmmqirvg] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xs);
    overflow: hidden;
}

.coc-grid-head[b-wnvmmqirvg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    border-bottom: 1px solid var(--border);
    flex-shrink: 0;
}

.coc-grid-title[b-wnvmmqirvg] { font-weight: 700; font-size: 0.88rem; }
.coc-grid-count[b-wnvmmqirvg] { font-size: 0.78rem; color: var(--text-secondary); font-weight: 600; }

.coc-grid-wrap[b-wnvmmqirvg] { flex: 1; overflow: auto; min-height: 0; }

.coc-grid[b-wnvmmqirvg] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
    table-layout: fixed;
}

.coc-grid thead th[b-wnvmmqirvg] {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--bg);
    color: var(--text-secondary);
    font-size: 0.66rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 8px 8px;
    text-align: left;
    border-bottom: 1.5px solid var(--border);
}

.coc-grid tbody td[b-wnvmmqirvg] {
    padding: 6px 8px;
    border-bottom: 1px dashed #F1F5F9;
    vertical-align: middle;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.coc-grid tbody tr:hover[b-wnvmmqirvg] { background: var(--color-primary-light); cursor: default; }
.coc-row-sel[b-wnvmmqirvg] { background: var(--color-primary-light); }

.coc-c-num[b-wnvmmqirvg] { font-weight: 700; color: var(--color-primary-dark); }
.coc-c-rut[b-wnvmmqirvg] { font-family: 'Consolas', 'Monaco', monospace; font-size: 0.74rem; color: var(--text-secondary); }
.coc-c-rs[b-wnvmmqirvg] { font-weight: 600; }
.coc-c-monto[b-wnvmmqirvg] { text-align: right; }
.coc-c-total[b-wnvmmqirvg] { font-weight: 700; }

.coc-empty[b-wnvmmqirvg] {
    padding: 36px 14px;
    text-align: center;
    color: var(--text-muted);
    font-size: 0.86rem;
}

.coc-ver-btn[b-wnvmmqirvg] {
    width: 28px;
    height: 28px;
    border: none;
    border-radius: var(--radius-sm);
    background: var(--color-detail);
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition);
}

.coc-ver-btn:hover[b-wnvmmqirvg] { background: var(--color-detail-dark); color: #fff; }
.coc-ver-btn .rzi[b-wnvmmqirvg] { font-size: 0.95rem; }

.coc-acciones[b-wnvmmqirvg] { display: flex; gap: 6px; align-items: center; }

.coc-print-btn[b-wnvmmqirvg] {
    width: 28px;
    height: 28px;
    border: none;
    border-radius: var(--radius-sm);
    background: var(--color-preview);
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition);
}

.coc-print-btn:hover[b-wnvmmqirvg] { background: var(--color-preview-dark); color: #fff; }
.coc-print-btn .rzi[b-wnvmmqirvg] { font-size: 0.95rem; }

/* ===== DRAWER DETALLE ===== */
.coc-drawer-overlay[b-wnvmmqirvg] {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.4);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease;
    z-index: 40;
}

.coc-drawer-overlay.open[b-wnvmmqirvg] { opacity: 1; visibility: visible; }

.coc-drawer[b-wnvmmqirvg] {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: min(560px, 92%);
    background: var(--surface);
    box-shadow: -8px 0 24px rgba(0, 0, 0, 0.18);
    transform: translateX(100%);
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 50;
    display: flex;
    flex-direction: column;
}

.coc-drawer.open[b-wnvmmqirvg] { transform: translateX(0); }

.coc-drawer-header[b-wnvmmqirvg] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 14px;
    border-bottom: 2px solid var(--color-primary);
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--color-primary-dark);
    background: var(--color-primary-light);
    flex-shrink: 0;
}

.coc-drawer-close[b-wnvmmqirvg] {
    margin-left: auto;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--text-secondary);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition);
}

.coc-drawer-close:hover[b-wnvmmqirvg] { background: rgba(0,0,0,0.06); color: var(--text); }

.coc-drawer-body[b-wnvmmqirvg] { flex: 1; min-height: 0; overflow: auto; padding: 14px; }

.coc-det-head[b-wnvmmqirvg] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 12px;
    margin-bottom: 12px;
}

.coc-det-head > div[b-wnvmmqirvg] { display: flex; flex-direction: column; min-width: 0; }
.coc-lbl[b-wnvmmqirvg] { font-size: var(--text-xs); color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.03em; }
.coc-val[b-wnvmmqirvg] { font-size: 0.82rem; color: var(--text); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.coc-det-obs[b-wnvmmqirvg] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-bottom: 12px;
    padding: 8px 10px;
    background: var(--bg);
    border-radius: var(--radius-sm);
    font-size: 0.8rem;
}

.coc-det-grid[b-wnvmmqirvg] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.78rem;
    margin-bottom: 12px;
}

.coc-det-grid thead th[b-wnvmmqirvg] {
    background: var(--bg);
    color: var(--text-secondary);
    font-size: 0.64rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 6px;
    text-align: left;
    border-bottom: 1.5px solid var(--border);
}

.coc-det-grid tbody td[b-wnvmmqirvg] {
    padding: 5px 6px;
    border-bottom: 1px dashed #F1F5F9;
    vertical-align: middle;
}

.coc-det-grid .coc-c-name[b-wnvmmqirvg] { font-weight: 600; line-height: 1.2; }
.coc-det-grid .coc-c-code[b-wnvmmqirvg] { font-family: 'Consolas', 'Monaco', monospace; font-size: 0.68rem; color: var(--text-secondary); }

.coc-det-totales[b-wnvmmqirvg] {
    border-top: 1px solid var(--border);
    padding-top: 10px;
}

.coc-tot-row[b-wnvmmqirvg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 0.82rem;
    color: var(--text-secondary);
    padding: 3px 0;
}

.coc-tot-row span:last-child[b-wnvmmqirvg] { font-weight: 600; color: var(--text); }

.coc-tot-total[b-wnvmmqirvg] {
    margin-top: 6px;
    padding-top: 8px;
    border-top: 2px solid var(--border);
    font-size: 0.98rem;
}

.coc-tot-total span[b-wnvmmqirvg] { font-weight: 800 !important; color: var(--color-primary-dark) !important; }

@media (max-width: 700px) {
    .coc-det-head[b-wnvmmqirvg] { grid-template-columns: 1fr; }
}
/* /Pages/Compras/GeneracionOrdenCompra/Componentes/SelectorProductosOCModal.razor.rz.scp.css */
/* ===== MODAL SELECTOR DE PRODUCTOS (ORDEN DE COMPRA) =====
   Clon visual de GeneracionDTE/Componentes/SelectorProductosModal.razor.css,
   simplificado (sin badges afecto/exento). Consume los design tokens globales. */

.poc-modal[b-214qltlqva] {
    --poc-primary: var(--color-primary);
    --poc-primary-dark: var(--color-primary-dark);
    --poc-primary-light: var(--color-primary-light);
    --poc-success: var(--color-success);
    --poc-success-light: var(--color-success-light);
    --poc-info: var(--color-info);
    --poc-border: var(--border);
    --poc-bg: #F8FAFC;
    --poc-card: var(--surface);
    --poc-text: var(--text);
    --poc-text-secondary: var(--text-secondary);
    --poc-text-muted: var(--text-muted);
    --poc-radius-xs: var(--radius-sm);
    --poc-radius-sm: var(--radius-md);
    --poc-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    background: var(--poc-bg);
    font-family: var(--font-family);
    position: relative;
}

/* ===== LOADING ===== */
.poc-loading-overlay[b-214qltlqva] {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    z-index: 20;
    color: var(--poc-text-secondary);
    font-weight: 600;
    font-size: 0.9rem;
}

.poc-loading-spinner[b-214qltlqva] {
    width: 42px;
    height: 42px;
    border: 4px solid var(--poc-border);
    border-top-color: var(--poc-primary);
    border-radius: 50%;
    animation: pocSpin-b-214qltlqva 0.8s linear infinite;
}

@keyframes pocSpin-b-214qltlqva { to { transform: rotate(360deg); } }

/* ===== QUICK-ADD: agregar producto manual ===== */
.poc-quickadd[b-214qltlqva] {
    padding: 10px 14px;
    background: linear-gradient(135deg, var(--poc-primary-light) 0%, var(--poc-card) 100%);
    border-bottom: 2px solid var(--poc-primary);
    flex-shrink: 0;
}

.poc-quickadd-toggle[b-214qltlqva] {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    padding: 0;
    background: none;
    border: none;
    cursor: pointer;
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--poc-primary-dark);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.poc-quickadd-toggle .rzi[b-214qltlqva] { font-size: 0.95rem; }

.poc-quickadd-chevron[b-214qltlqva] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: var(--radius-full);
    background: var(--poc-primary);
    color: #fff;
    box-shadow: var(--shadow-sm);
    transition: background 0.15s ease, transform 0.15s ease;
}

.poc-quickadd-toggle .poc-quickadd-chevron[b-214qltlqva] { font-size: 1.2rem; }

.poc-quickadd-toggle:hover .poc-quickadd-chevron[b-214qltlqva] {
    background: var(--poc-primary-dark);
    transform: scale(1.08);
}

.poc-quickadd-body[b-214qltlqva] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 8px;
}

.poc-quickadd-row[b-214qltlqva] {
    display: flex;
    align-items: flex-end;
    gap: 8px;
}

.poc-qa-field[b-214qltlqva] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.poc-qa-label[b-214qltlqva] {
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    color: var(--text-secondary);
    margin-bottom: 2px;
    line-height: 1.2;
    white-space: nowrap;
}

.poc-qa-codigo[b-214qltlqva] { width: 140px; flex-shrink: 0; }
.poc-qa-nombre[b-214qltlqva] { flex: 1; }
.poc-qa-cant[b-214qltlqva]   { width: 90px;  flex-shrink: 0; }
.poc-qa-um[b-214qltlqva]     { flex: 1; min-width: 110px; }
.poc-qa-precio[b-214qltlqva] { width: 110px; flex-shrink: 0; }
.poc-qa-action[b-214qltlqva] { flex-shrink: 0; }

.poc-quickadd-btn[b-214qltlqva] {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
}

.poc-quickadd-btn .rzi[b-214qltlqva] { font-size: 1rem; }

.poc-quickadd[b-214qltlqva]  .rz-textbox,
.poc-quickadd[b-214qltlqva]  .rz-numeric,
.poc-quickadd[b-214qltlqva]  .rz-dropdown {
    height: 30px !important;
    min-height: 30px !important;
    width: 100% !important;
}

.poc-quickadd[b-214qltlqva]  .rz-textbox,
.poc-quickadd[b-214qltlqva]  .rz-numeric input {
    font-size: 0.78rem !important;
    padding: 0 8px !important;
}

.poc-quickadd[b-214qltlqva]  .rz-dropdown { font-size: 0.78rem !important; }

.poc-quickadd[b-214qltlqva]  .rz-numeric-up,
.poc-quickadd[b-214qltlqva]  .rz-numeric-down {
    display: none !important;
}

/* ===== TOOLBAR / BUSQUEDA ===== */
.poc-toolbar[b-214qltlqva] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: var(--poc-card);
    border-bottom: 1px solid var(--poc-border);
    flex-shrink: 0;
}

.poc-search[b-214qltlqva] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 10px;
    background: var(--poc-bg);
    border: 1.5px solid var(--poc-border);
    border-radius: var(--poc-radius-sm);
    transition: var(--poc-transition);
    height: 36px;
    max-width: 520px;
}

.poc-search:focus-within[b-214qltlqva] {
    border-color: var(--poc-primary);
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
    background: white;
}

.poc-search .rzi[b-214qltlqva] {
    color: var(--poc-text-muted);
    font-size: 1.1rem;
}

.poc-search-input[b-214qltlqva] {
    flex: 1;
    border: none;
    background: transparent;
    outline: none;
    font-size: 0.85rem;
    color: var(--poc-text);
    font-family: inherit;
}

.poc-search-input[b-214qltlqva]::placeholder { color: var(--poc-text-muted); }

.poc-search-clear[b-214qltlqva] {
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--poc-text-muted);
    padding: 2px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--poc-transition);
}

.poc-search-clear:hover[b-214qltlqva] {
    background: var(--poc-border);
    color: var(--poc-text);
}

.poc-toolbar-right[b-214qltlqva] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.poc-count[b-214qltlqva] {
    font-size: 0.78rem;
    color: var(--poc-text-secondary);
    font-weight: 600;
}

.poc-added-pill[b-214qltlqva] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--poc-success-light);
    color: #065F46;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 999px;
}

.poc-added-pill .rzi[b-214qltlqva] { font-size: 1rem; }

/* ===== GRILLA ===== */
.poc-grid-wrap[b-214qltlqva] {
    flex: 1;
    overflow: auto;
    min-height: 0;
    background: var(--poc-card);
}

.poc-grid[b-214qltlqva] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.78rem;
    table-layout: fixed;
}

.poc-grid thead th[b-214qltlqva] {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--poc-bg);
    color: var(--poc-text-secondary);
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 8px 6px;
    text-align: left;
    border-bottom: 1.5px solid var(--poc-border);
}

.poc-grid tbody tr[b-214qltlqva] { transition: background-color 0.15s ease; }
.poc-grid tbody tr:hover[b-214qltlqva] { background: var(--poc-primary-light); }

.poc-grid tbody td[b-214qltlqva] {
    padding: 5px 6px;
    border-bottom: 1px dashed #F1F5F9;
    color: var(--poc-text);
    vertical-align: middle;
}

.poc-cell-producto[b-214qltlqva] { min-width: 0; }

.poc-cell-meta[b-214qltlqva] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 2px;
}

.poc-cell-code[b-214qltlqva] {
    font-family: 'Consolas', 'Monaco', monospace;
    font-size: 0.7rem;
    color: var(--poc-text-secondary);
    font-weight: 600;
}

.poc-cell-um[b-214qltlqva] {
    font-size: 0.66rem;
    font-weight: 700;
    color: var(--poc-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 1px 6px;
    background: #F1F5F9;
    border-radius: 4px;
}

.poc-cell-name[b-214qltlqva] {
    font-weight: 600;
    color: var(--poc-text);
    font-size: 0.82rem;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.poc-cell-desc[b-214qltlqva] {
    font-size: 0.7rem;
    color: var(--poc-text-secondary);
    margin-top: 1px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.poc-cell-subtotal[b-214qltlqva] {
    font-weight: 700;
    color: var(--poc-text);
    font-size: 0.8rem;
    text-align: right;
}

.poc-empty[b-214qltlqva] {
    padding: 40px 14px;
    text-align: center;
    color: var(--poc-text-muted);
    font-size: 0.9rem;
}

/* ===== ADD BUTTON ===== */
.poc-add-btn[b-214qltlqva] {
    width: 28px;
    height: 28px;
    border: none;
    border-radius: var(--poc-radius-xs);
    background: var(--poc-primary);
    color: white;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: var(--poc-transition);
}

.poc-add-btn:hover[b-214qltlqva] {
    background: var(--poc-primary-dark);
    transform: translateY(-1px) scale(1.05);
    box-shadow: var(--shadow-md);
}

.poc-add-btn:active[b-214qltlqva] { transform: translateY(0) scale(0.95); }

.poc-add-btn .rzi[b-214qltlqva] { font-size: 1rem; }

.poc-add-btn-update[b-214qltlqva] { background: var(--poc-info); }
.poc-add-btn-update:hover[b-214qltlqva] { box-shadow: var(--shadow-md); }

.poc-row-added[b-214qltlqva] {
    background: #ECFDF5 !important;
    border-left: 3px solid var(--poc-success);
}

.poc-grid tbody tr.poc-row-added:hover[b-214qltlqva] { background: #D1FAE5 !important; }

.poc-check[b-214qltlqva] {
    display: inline-flex;
    align-items: center;
    margin-left: 6px;
    color: var(--poc-success);
    vertical-align: middle;
}

.poc-check .rzi[b-214qltlqva] { font-size: 0.95rem; }

.poc-grid[b-214qltlqva]  .rz-numeric {
    height: 26px !important;
    min-height: 26px !important;
    width: 100% !important;
}

.poc-grid[b-214qltlqva]  .rz-numeric input {
    height: 26px !important;
    font-size: 0.74rem !important;
    padding: 0 4px !important;
    text-align: right;
}

.poc-grid[b-214qltlqva]  .rz-numeric-up,
.poc-grid[b-214qltlqva]  .rz-numeric-down {
    display: none !important;
}

/* ===== FOOTER ===== */
.poc-footer[b-214qltlqva] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 16px;
    border-top: 1px solid var(--poc-border);
    background: var(--poc-card);
    flex-shrink: 0;
}

.poc-footer-hint[b-214qltlqva] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.78rem;
    color: var(--poc-text-secondary);
}

.poc-footer-hint .rzi[b-214qltlqva] {
    color: var(--poc-info);
    font-size: 1.1rem;
}

.poc-btn[b-214qltlqva] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--poc-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    color: white;
    transition: var(--poc-transition);
}

.poc-btn:hover[b-214qltlqva] {
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.poc-btn .rzi[b-214qltlqva] { font-size: 1rem; }

.poc-btn-secondary[b-214qltlqva] {
    background: var(--color-secondary);
    color: #fff;
    border: none;
}

.poc-btn-secondary:hover[b-214qltlqva] {
    background: var(--color-secondary-dark);
}
/* /Pages/Compras/GeneracionOrdenCompra/GeneracionOrdenCompraIndex.razor.rz.scp.css */
/* =============================================================
   GeneracionOrdenCompra — estilos aislados
   Misma estetica que GeneracionDTE/Facturador (topbar + workspace
   2 paneles + totales + drawer), consumiendo los design tokens.
   ============================================================= */

.oc-container[b-972p9cypqi] {
    --oc-primary: var(--color-primary);
    --oc-primary-dark: var(--color-primary-dark);
    --oc-primary-light: var(--color-primary-light);
    --oc-accent: var(--color-accent);
    --oc-accent-dark: var(--color-accent-dark);
    --oc-success: var(--color-success);
    --oc-success-dark: var(--color-success-dark);
    --oc-danger: var(--color-danger);
    --oc-bg: var(--bg);
    --oc-card: var(--surface);
    --oc-text: var(--text);
    --oc-text-secondary: var(--text-secondary);
    --oc-text-muted: var(--text-muted);
    --oc-border: var(--border);
    --oc-radius: var(--radius-lg);
    --oc-radius-sm: var(--radius-md);
    --oc-transition: var(--transition);

    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 10px;
    background: var(--oc-bg);
    font-family: var(--font-family);
    color: var(--oc-text);
    overflow: hidden;
}

/* ===== LOADING ===== */
.oc-loading[b-972p9cypqi] {
    position: absolute;
    inset: 0;
    z-index: 1100;
    background: rgba(15, 23, 42, 0.55);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #fff;
    font-weight: 600;
}

/* ===== TOPBAR ===== */
.oc-topbar[b-972p9cypqi] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding: 10px 14px;
    background: var(--oc-card);
    border: 1px solid var(--oc-border);
    border-radius: var(--oc-radius);
    box-shadow: var(--shadow-xs);
    flex-shrink: 0;
}

.oc-topbar-left[b-972p9cypqi], .oc-topbar-right[b-972p9cypqi] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.oc-title-chip[b-972p9cypqi] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 4px 14px 4px 8px;
    border: 2px solid var(--oc-accent);
    border-radius: var(--oc-radius);
    background: linear-gradient(135deg, #FFF7ED 0%, var(--oc-card) 70%);
    box-shadow: 0 2px 10px rgba(255, 165, 0, 0.22);
}

.oc-title-icon[b-972p9cypqi] {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--oc-accent);
    color: #fff;
    font-size: 1.05rem;
    box-shadow: 0 1px 3px rgba(255, 140, 0, 0.4);
}

.oc-title-texts[b-972p9cypqi] { display: flex; flex-direction: column; line-height: 1.1; }
.oc-title[b-972p9cypqi] { font-weight: 700; font-size: 0.95rem; }
.oc-title-sub[b-972p9cypqi] { font-size: 0.66rem; color: var(--oc-text-muted); text-transform: uppercase; letter-spacing: 0.04em; }

.oc-field[b-972p9cypqi] { display: flex; flex-direction: column; gap: 2px; }
.oc-field label[b-972p9cypqi] {
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    color: var(--oc-text-secondary);
}

.oc-numero[b-972p9cypqi] {
    width: 90px;
    height: 30px;
    border: 1.5px solid var(--oc-border);
    border-radius: var(--oc-radius-sm);
    background: var(--oc-bg);
    padding: 0 10px;
    font-weight: 700;
    color: var(--oc-primary-dark);
    font-family: inherit;
    text-align: center;
}

.oc-status-pill[b-972p9cypqi] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border-radius: var(--radius-full);
    font-size: 0.74rem;
    font-weight: 700;
    background: var(--color-warning-light);
    color: var(--color-warning-dark);
}

.oc-status-pill.ready[b-972p9cypqi] {
    background: var(--oc-success-light, var(--color-success-light));
    color: var(--oc-success-dark);
}

.oc-status-pill .rzi[b-972p9cypqi] { font-size: 1rem; }

/* ===== BOTONES ===== */
.oc-btn[b-972p9cypqi] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--oc-radius-sm);
    font-size: 0.8rem;
    font-weight: 700;
    cursor: pointer;
    color: #fff;
    transition: var(--oc-transition);
}

.oc-btn:hover:not(:disabled)[b-972p9cypqi] { transform: translateY(-1px); box-shadow: var(--shadow-md); }
.oc-btn:disabled[b-972p9cypqi] { opacity: 0.6; cursor: not-allowed; }
.oc-btn .rzi[b-972p9cypqi] { font-size: 1rem; }
.oc-btn-sm[b-972p9cypqi] { padding: 5px 11px; font-size: 0.74rem; }

.oc-btn-primary[b-972p9cypqi] { background: var(--oc-primary); }
.oc-btn-primary:hover:not(:disabled)[b-972p9cypqi] { background: var(--oc-primary-dark); }
.oc-btn-success[b-972p9cypqi] { background: var(--oc-success); }
.oc-btn-success:hover:not(:disabled)[b-972p9cypqi] { background: var(--oc-success-dark); }
.oc-btn-print[b-972p9cypqi] { background: var(--color-preview); }
.oc-btn-print:hover:not(:disabled)[b-972p9cypqi] { background: var(--color-preview-dark); }
/* Mismo color que el botón "Buscar productos" de Nuevo Documento (--color-accent). */
.oc-btn-accent[b-972p9cypqi] { background: var(--color-accent); }
.oc-btn-accent:hover:not(:disabled)[b-972p9cypqi] { background: var(--color-accent-dark); }
.oc-btn-ghost[b-972p9cypqi] {
    background: transparent;
    color: var(--oc-text-secondary);
    border: 1.5px solid var(--oc-border);
}
.oc-btn-ghost:hover:not(:disabled)[b-972p9cypqi] { background: var(--oc-bg); }
/* Boton "Limpiar" unificado: solido plomo con icono cleaning_services (--color-limpiar). */
.oc-btn-limpiar[b-972p9cypqi] { background: var(--color-limpiar); }
.oc-btn-limpiar:hover:not(:disabled)[b-972p9cypqi] { background: var(--color-limpiar-dark); }

/* ===== WORKSPACE ===== */
.oc-workspace[b-972p9cypqi] {
    flex: 1;
    min-height: 0;
    display: grid;
    grid-template-columns: 58fr 42fr;
    gap: 10px;
}

.oc-panel-left[b-972p9cypqi], .oc-panel-right[b-972p9cypqi] {
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* ===== PROVEEDOR ===== */
.oc-proveedor[b-972p9cypqi] {
    background: var(--oc-card);
    border: 1px solid var(--oc-border);
    border-radius: var(--oc-radius);
    padding: 12px 14px;
    box-shadow: var(--shadow-xs);
    flex-shrink: 0;
}

.oc-sel-proveedor[b-972p9cypqi] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 12px;
    border: 1.5px dashed var(--oc-primary);
    border-radius: var(--oc-radius-sm);
    background: var(--oc-primary-light);
    color: var(--oc-primary-dark);
    font-weight: 700;
    font-size: 0.85rem;
    cursor: pointer;
    transition: var(--oc-transition);
}

.oc-sel-proveedor:hover:not(:disabled)[b-972p9cypqi] { background: #E0E7FF; }
.oc-sel-proveedor:disabled[b-972p9cypqi] { opacity: 0.6; cursor: not-allowed; }

.oc-proveedor-head[b-972p9cypqi] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}

.oc-proveedor-rs[b-972p9cypqi] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
    font-size: 0.92rem;
    color: var(--oc-text);
}

.oc-proveedor-rs .rzi[b-972p9cypqi] { color: var(--oc-primary); }

.oc-proveedor-actions[b-972p9cypqi] { display: flex; gap: 6px; }

.oc-link[b-972p9cypqi] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: transparent;
    border: none;
    cursor: pointer;
    font-size: 0.74rem;
    font-weight: 600;
    color: var(--oc-primary-dark);
    padding: 3px 6px;
    border-radius: var(--radius-sm);
    transition: var(--oc-transition);
}

.oc-link:hover[b-972p9cypqi] { background: var(--oc-primary-light); }
.oc-link .rzi[b-972p9cypqi] { font-size: 0.9rem; }
.oc-link-danger[b-972p9cypqi] { color: var(--oc-danger); }
.oc-link-danger:hover[b-972p9cypqi] { background: var(--color-danger-light); }

.oc-proveedor-grid[b-972p9cypqi] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
}

.oc-proveedor-grid > div[b-972p9cypqi] { display: flex; flex-direction: column; min-width: 0; }
.oc-lbl[b-972p9cypqi] { font-size: var(--text-xs); color: var(--oc-text-muted); text-transform: uppercase; letter-spacing: 0.03em; }
.oc-val[b-972p9cypqi] { font-size: 0.8rem; color: var(--oc-text); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ===== DETALLE ===== */
.oc-detalle[b-972p9cypqi] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: var(--oc-card);
    border: 1px solid var(--oc-border);
    border-radius: var(--oc-radius);
    box-shadow: var(--shadow-xs);
    overflow: hidden;
}

.oc-detalle-head[b-972p9cypqi] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 12px;
    border-bottom: 1px solid var(--oc-border);
    flex-shrink: 0;
}

.oc-detalle-title[b-972p9cypqi] { font-weight: 700; font-size: 0.86rem; }

.oc-detalle-grid-wrap[b-972p9cypqi] { flex: 1; overflow: auto; min-height: 0; }

.oc-detalle-grid[b-972p9cypqi] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.78rem;
    table-layout: fixed;
}

.oc-detalle-grid thead th[b-972p9cypqi] {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--oc-bg);
    color: var(--oc-text-secondary);
    font-size: 0.66rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 7px 6px;
    text-align: left;
    border-bottom: 1.5px solid var(--oc-border);
}

.oc-detalle-grid tbody td[b-972p9cypqi] {
    padding: 4px 6px;
    border-bottom: 1px dashed #F1F5F9;
    vertical-align: middle;
}

.oc-detalle-grid tbody tr:hover[b-972p9cypqi] { background: var(--oc-primary-light); }

.oc-c-num[b-972p9cypqi] { color: var(--oc-text-muted); text-align: center; }
.oc-c-code[b-972p9cypqi] { font-family: 'Consolas', 'Monaco', monospace; font-size: 0.7rem; color: var(--oc-text-secondary); }
.oc-c-name[b-972p9cypqi] { font-weight: 600; color: var(--oc-text); line-height: 1.2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.oc-c-desc[b-972p9cypqi] { font-size: 0.7rem; color: var(--oc-text-secondary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.oc-c-um[b-972p9cypqi] { text-align: center; color: var(--oc-text-secondary); text-transform: uppercase; font-size: 0.7rem; }
.oc-c-monto[b-972p9cypqi] { text-align: right; font-weight: 700; }

.oc-detalle-empty[b-972p9cypqi] {
    padding: 32px 14px;
    text-align: center;
    color: var(--oc-text-muted);
    font-size: 0.84rem;
}

.oc-del-btn[b-972p9cypqi] {
    width: 26px;
    height: 26px;
    border: none;
    border-radius: var(--radius-sm);
    background: var(--color-danger-light);
    color: var(--oc-danger);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: var(--oc-transition);
}

.oc-del-btn:hover[b-972p9cypqi] { background: var(--oc-danger); color: #fff; }
.oc-del-btn .rzi[b-972p9cypqi] { font-size: 0.95rem; }

/* Inputs Radzen compactos dentro de la grilla */
.oc-detalle-grid[b-972p9cypqi]  .rz-numeric {
    height: 26px !important;
    min-height: 26px !important;
    width: 100% !important;
}

.oc-detalle-grid[b-972p9cypqi]  .rz-numeric input {
    height: 26px !important;
    font-size: 0.74rem !important;
    padding: 0 4px !important;
    text-align: right;
}

.oc-detalle-grid[b-972p9cypqi]  .rz-numeric-up,
.oc-detalle-grid[b-972p9cypqi]  .rz-numeric-down { display: none !important; }

/* ===== TOTALES ===== */
.oc-totales[b-972p9cypqi] {
    background: var(--oc-card);
    border: 1px solid var(--oc-border);
    border-radius: var(--oc-radius);
    padding: 10px 14px;
    box-shadow: var(--shadow-xs);
    flex-shrink: 0;
}

.oc-tot-row[b-972p9cypqi] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 0.82rem;
    color: var(--oc-text-secondary);
    padding: 3px 0;
}

.oc-tot-row span:last-child[b-972p9cypqi] { font-weight: 600; color: var(--oc-text); }

.oc-tot-total[b-972p9cypqi] {
    margin-top: 6px;
    padding-top: 8px;
    border-top: 2px solid var(--oc-border);
    font-size: 1rem;
}

.oc-tot-total span[b-972p9cypqi] { font-weight: 800 !important; color: var(--oc-primary-dark) !important; }

/* ===== PANEL DERECHO ===== */
.oc-panel-right[b-972p9cypqi] {
    background: var(--oc-card);
    border: 1px solid var(--oc-border);
    border-radius: var(--oc-radius);
    box-shadow: var(--shadow-xs);
    overflow: hidden;
}

.oc-panel-right-title[b-972p9cypqi] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--oc-border);
    font-weight: 700;
    font-size: 0.86rem;
    flex-shrink: 0;
}

.oc-panel-right-title .rzi[b-972p9cypqi] { color: var(--oc-primary); }

.oc-form[b-972p9cypqi] {
    flex: 1;
    overflow: auto;
    min-height: 0;
    padding: 14px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px 12px;
    align-content: start;
}

.oc-form-field[b-972p9cypqi] { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.oc-form-full[b-972p9cypqi] { grid-column: 1 / -1; }

.oc-form-field label[b-972p9cypqi] {
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    color: var(--oc-text-secondary);
}

.oc-form[b-972p9cypqi]  .rz-textbox,
.oc-form[b-972p9cypqi]  .rz-dropdown {
    height: 32px !important;
    min-height: 32px !important;
    width: 100% !important;
    font-size: 0.8rem !important;
}

/* Texto del dropdown: llena el wrapper de 32px (evita el "recuadro dentro del recuadro") */
.oc-form[b-972p9cypqi]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.oc-form[b-972p9cypqi]  .rz-textarea { font-size: 0.8rem !important; width: 100% !important; }

/* ===== DRAWER ===== */
.oc-drawer-overlay[b-972p9cypqi] {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.4);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease;
    z-index: 40;
}

.oc-drawer-overlay.open[b-972p9cypqi] { opacity: 1; visibility: visible; }

.oc-drawer[b-972p9cypqi] {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: min(560px, 92%);
    background: var(--oc-card);
    box-shadow: -8px 0 24px rgba(0, 0, 0, 0.18);
    transform: translateX(100%);
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 50;
    display: flex;
    flex-direction: column;
}

.oc-drawer.open[b-972p9cypqi] { transform: translateX(0); }

.oc-drawer-header[b-972p9cypqi] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 14px;
    border-bottom: 2px solid var(--oc-primary);
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--oc-primary-dark);
    background: var(--oc-primary-light);
    flex-shrink: 0;
}

.oc-drawer-close[b-972p9cypqi] {
    margin-left: auto;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--oc-text-secondary);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: var(--oc-transition);
}

.oc-drawer-close:hover[b-972p9cypqi] { background: rgba(0,0,0,0.06); color: var(--oc-text); }

.oc-drawer-body[b-972p9cypqi] { flex: 1; min-height: 0; overflow: hidden; }

/* ===== SOLO LECTURA ===== */
.oc-readonly .oc-workspace[b-972p9cypqi] { opacity: 0.96; }

/* ===== RESPONSIVE ===== */
@media (max-width: 1100px) {
    .oc-workspace[b-972p9cypqi] {
        grid-template-columns: 1fr;
        overflow: auto;
    }
}
/* /Pages/Compras/RecepcionMercaderia/Componentes/PanelRecepcion.razor.rz.scp.css */
/* Contenedor principal del modal de recepción */
.rm-panel[b-b9mxsdg76d] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 12px 4px;
    font-family: var(--font-family);
    height: 100%;
    box-sizing: border-box;
    overflow: hidden;
}

/* Header con datos del DTE + OC */
.rm-header-info[b-b9mxsdg76d] {
    display: grid;
    grid-template-columns: 1.2fr 1fr 1fr 1fr 1.6fr;
    gap: 10px;
    background: #F8FAFC;
    border-radius: 8px;
    padding: 10px 14px;
    border: 1px solid #E2E8F0;
    flex-shrink: 0;
}

.info-cell[b-b9mxsdg76d] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.info-label[b-b9mxsdg76d] {
    font-size: 0.65rem;
    font-weight: 700;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.info-value[b-b9mxsdg76d] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1E293B;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rm-oc-ok[b-b9mxsdg76d] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--color-info, #0284C7);
}

.rm-oc-ok .rzi[b-b9mxsdg76d] { font-size: 1rem; }

.rm-oc-warn[b-b9mxsdg76d] { color: var(--color-warning-dark, #B45309); font-style: italic; }
.rm-oc-none[b-b9mxsdg76d] { color: var(--text-muted, #94A3B8); font-style: italic; }

/* Fila de controles: sucursal + estado */
.rm-controls-row[b-b9mxsdg76d] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.rm-sucursal-row[b-b9mxsdg76d],
.rm-estado-row[b-b9mxsdg76d] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    background: #EEF2FF;
    border-radius: 8px;
    border: 1px solid #C7D2FE;
}

.rm-estado-row[b-b9mxsdg76d] { background: #F0FDF4; border-color: #BBF7D0; }

.rm-sucursal-label[b-b9mxsdg76d] {
    font-size: 0.85rem;
    font-weight: 700;
    color: #4338CA;
    white-space: nowrap;
}

.rm-estado-row .rm-sucursal-label[b-b9mxsdg76d] { color: #15803D; }

.rm-sucursal-hint[b-b9mxsdg76d] {
    font-size: 0.75rem;
    color: #6366F1;
    font-style: italic;
}

.rm-estado-calc[b-b9mxsdg76d] {
    font-size: 0.78rem;
    color: var(--text-secondary);
}

.rm-estado-total[b-b9mxsdg76d]   { color: var(--color-success, #16A34A); }
.rm-estado-parcial[b-b9mxsdg76d] { color: var(--color-info, #0284C7); }

/* Wrapper de la tabla con scroll interno */
.rm-tabla-wrapper[b-b9mxsdg76d] {
    flex: 1;
    overflow: auto;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    background: white;
    min-height: 0;
}

.rm-loading[b-b9mxsdg76d],
.rm-empty[b-b9mxsdg76d] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 40px;
    color: var(--text-secondary);
}

.rm-empty .rzi[b-b9mxsdg76d] { font-size: 2.5rem; color: #CBD5E1; }
.rm-empty p[b-b9mxsdg76d] { margin: 0; font-size: 0.85rem; }

.rm-spinner[b-b9mxsdg76d] {
    width: 24px;
    height: 24px;
    border: 3px solid #E2E8F0;
    border-top-color: #6366F1;
    border-radius: 50%;
    animation: rm-spin-b-b9mxsdg76d 0.8s linear infinite;
}

@keyframes rm-spin-b-b9mxsdg76d { to { transform: rotate(360deg); } }

/* Tabla de ítems */
.rm-tabla[b-b9mxsdg76d] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
}

.rm-tabla thead[b-b9mxsdg76d] {
    position: sticky;
    top: 0;
    background: #F1F5F9;
    z-index: 1;
}

.rm-tabla th[b-b9mxsdg76d] {
    padding: 8px 10px;
    text-align: left;
    font-weight: 700;
    color: #475569;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    border-bottom: 2px solid #E2E8F0;
}

.rm-tabla tbody tr[b-b9mxsdg76d] { transition: background-color 0.15s; }
.rm-tabla tbody tr:hover[b-b9mxsdg76d] { background: #F8FAFC; }
.rm-tabla tbody tr.rm-row-oc[b-b9mxsdg76d] { background: #F0F9FF; }
.rm-tabla tbody tr.rm-row-oc:hover[b-b9mxsdg76d] { background: #E0F2FE; }

.rm-tabla td[b-b9mxsdg76d] {
    padding: 6px 10px;
    border-bottom: 1px solid #F1F5F9;
    vertical-align: middle;
}

.rm-cell-nro[b-b9mxsdg76d] {
    color: var(--text-secondary);
    font-weight: 600;
    text-align: center;
}

.rm-cell-nombre[b-b9mxsdg76d] {
    color: #1E293B;
    max-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rm-oc-tag[b-b9mxsdg76d] {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 6px;
    background: #0284C7;
    color: white;
    font-size: 0.62rem;
    font-weight: 800;
    border-radius: 8px;
    vertical-align: middle;
}

.rm-cell-qty[b-b9mxsdg76d] {
    color: var(--text-secondary);
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* Vínculo de producto: dropdown + botón buscar */
.rm-vinculo[b-b9mxsdg76d] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.rm-btn-buscar[b-b9mxsdg76d] {
    width: 30px;
    height: 30px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    color: white;
    background: var(--color-primary, #6366F1);
    transition: background 0.15s, transform 0.15s;
}

.rm-btn-buscar:hover[b-b9mxsdg76d] {
    background: var(--color-primary-dark, #4F46E5);
    transform: translateY(-1px);
}

.rm-btn-buscar .rzi[b-b9mxsdg76d] { font-size: 0.95rem; }

.rm-vinculo[b-b9mxsdg76d]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: 6px !important;
    font-size: 0.78rem !important;
    height: 30px !important;
    background: white !important;
    box-sizing: border-box !important;
}

.rm-vinculo[b-b9mxsdg76d]  .rz-dropdown .rz-dropdown-label {
    padding: 0 8px !important;
    line-height: 30px !important;
    font-size: 0.78rem !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Inputs */
.rm-input-qty[b-b9mxsdg76d],
.rm-input-codigo[b-b9mxsdg76d] {
    width: 100%;
    padding: 5px 8px;
    border: 1.5px solid #CBD5E1;
    border-radius: 6px;
    font-size: 0.8rem;
    font-family: inherit;
    background: white;
    transition: border-color 0.15s, box-shadow 0.15s;
    box-sizing: border-box;
}

.rm-input-qty[b-b9mxsdg76d] { text-align: right; font-variant-numeric: tabular-nums; }

.rm-input-qty:focus[b-b9mxsdg76d],
.rm-input-codigo:focus[b-b9mxsdg76d] {
    outline: none;
    border-color: #6366F1;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

.rm-input-codigo[b-b9mxsdg76d]::placeholder { color: #94A3B8; font-style: italic; }

.rm-check[b-b9mxsdg76d] {
    width: 16px;
    height: 16px;
    accent-color: var(--color-success, #10B981);
    cursor: pointer;
}

/* Nota informativa */
.rm-footer-note[b-b9mxsdg76d] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: #FEF3C7;
    border: 1px solid #FDE68A;
    border-radius: 6px;
    font-size: 0.75rem;
    color: #92400E;
    flex-shrink: 0;
}

.rm-footer-note .rzi[b-b9mxsdg76d] { color: #D97706; font-size: 1rem; }

/* Botones del footer */
.rm-actions[b-b9mxsdg76d] {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    padding-top: 4px;
    flex-shrink: 0;
}

.rm-btn[b-b9mxsdg76d] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 16px;
    border: none;
    border-radius: 8px;
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s ease;
    color: white;
}

.rm-btn:hover:not(:disabled)[b-b9mxsdg76d] {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12);
}

.rm-btn:disabled[b-b9mxsdg76d] {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

.rm-btn-cancel[b-b9mxsdg76d] { background: var(--color-secondary); }
.rm-btn-cancel:hover:not(:disabled)[b-b9mxsdg76d] { background: var(--color-secondary-dark); }

.rm-btn-save[b-b9mxsdg76d] { background: #10B981; }
.rm-btn-save:hover:not(:disabled)[b-b9mxsdg76d] { background: #059669; }

.rm-btn .rzi.spin[b-b9mxsdg76d] { animation: rm-spin-b-b9mxsdg76d 0.8s linear infinite; }

/* Responsive */
@media (max-width: 900px) {
    .rm-header-info[b-b9mxsdg76d] { grid-template-columns: 1fr 1fr; }
    .rm-controls-row[b-b9mxsdg76d] { flex-direction: column; align-items: stretch; }
}
/* /Pages/Compras/RecepcionMercaderia/Componentes/SelectorProductoItemModal.razor.rz.scp.css */
.spi-modal[b-5etlusov6h] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 10px;
    height: 100%;
    font-family: var(--font-family);
    box-sizing: border-box;
    overflow: hidden;
}

.spi-loading-overlay[b-5etlusov6h] {
    position: absolute;
    inset: 0;
    z-index: 10;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: rgba(255, 255, 255, 0.85);
    color: var(--text-secondary);
    font-size: 0.85rem;
}

.spi-loading-spinner[b-5etlusov6h] {
    width: 26px;
    height: 26px;
    border: 3px solid #E2E8F0;
    border-top-color: #6366F1;
    border-radius: 50%;
    animation: spi-spin-b-5etlusov6h 0.8s linear infinite;
}

@keyframes spi-spin-b-5etlusov6h { to { transform: rotate(360deg); } }

/* Toolbar de búsqueda */
.spi-toolbar[b-5etlusov6h] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-shrink: 0;
}

.spi-search[b-5etlusov6h] {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
    padding: 0 10px;
    border: 1.5px solid #CBD5E1;
    border-radius: 8px;
    background: white;
    height: 36px;
}

.spi-search:focus-within[b-5etlusov6h] {
    border-color: #6366F1;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

.spi-search .rzi[b-5etlusov6h] { color: #94A3B8; font-size: 1.05rem; }

.spi-search-input[b-5etlusov6h] {
    flex: 1;
    border: none;
    outline: none;
    font-size: 0.82rem;
    font-family: inherit;
    background: transparent;
}

.spi-search-clear[b-5etlusov6h] {
    background: none;
    border: none;
    color: #94A3B8;
    cursor: pointer;
    display: flex;
    align-items: center;
    padding: 2px;
}

.spi-search-clear:hover[b-5etlusov6h] { color: #EF4444; }

.spi-count[b-5etlusov6h] {
    font-size: 0.75rem;
    color: var(--text-secondary);
    font-weight: 600;
    white-space: nowrap;
}

/* Grilla */
.spi-grid-wrap[b-5etlusov6h] {
    flex: 1;
    overflow: auto;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    background: white;
    min-height: 0;
}

.spi-grid[b-5etlusov6h] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
}

.spi-grid thead[b-5etlusov6h] {
    position: sticky;
    top: 0;
    background: #F1F5F9;
    z-index: 1;
}

.spi-grid th[b-5etlusov6h] {
    padding: 8px 10px;
    text-align: left;
    font-weight: 700;
    color: #475569;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    border-bottom: 2px solid #E2E8F0;
}

.spi-grid tbody tr[b-5etlusov6h] { transition: background-color 0.15s; }
.spi-grid tbody tr:hover[b-5etlusov6h] { background: #F8FAFC; }

.spi-grid td[b-5etlusov6h] {
    padding: 6px 10px;
    border-bottom: 1px solid #F1F5F9;
    vertical-align: middle;
}

.spi-cell-code[b-5etlusov6h] {
    font-weight: 700;
    color: #4338CA;
    font-variant-numeric: tabular-nums;
}

.spi-cell-name[b-5etlusov6h] { color: #1E293B; font-weight: 600; }
.spi-cell-desc[b-5etlusov6h] { color: var(--text-muted); font-size: 0.72rem; margin-top: 2px; }

.spi-cell-stock[b-5etlusov6h] {
    text-align: right;
    color: var(--text-secondary);
    font-variant-numeric: tabular-nums;
}

.spi-empty[b-5etlusov6h] {
    text-align: center;
    padding: 30px;
    color: var(--text-muted);
    font-size: 0.82rem;
}

.spi-pick-btn[b-5etlusov6h] {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    color: white;
    background: var(--color-success, #10B981);
    transition: background 0.15s, transform 0.15s;
}

.spi-pick-btn:hover[b-5etlusov6h] {
    background: #059669;
    transform: scale(1.08);
}

.spi-pick-btn .rzi[b-5etlusov6h] { font-size: 0.95rem; }

/* Footer */
.spi-footer[b-5etlusov6h] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-shrink: 0;
}

.spi-footer-hint[b-5etlusov6h] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.75rem;
    color: var(--text-muted);
}

.spi-footer-hint .rzi[b-5etlusov6h] { font-size: 0.95rem; }

.spi-btn[b-5etlusov6h] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 16px;
    border: none;
    border-radius: 8px;
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s ease;
    color: white;
}

.spi-btn-secondary[b-5etlusov6h] { background: var(--color-secondary); }
.spi-btn-secondary:hover[b-5etlusov6h] { background: var(--color-secondary-dark); transform: translateY(-1px); }
/* /Pages/Compras/RecepcionMercaderia/RecepcionMercaderiaIndex.razor.rz.scp.css */
/* ===== RECEPCIÓN DE MERCADERÍAS ===== */
/* Reutiliza el lenguaje visual de DocumentosRecepcionados (tokens --cd-* mapeados a --color-*). */

.recep-container[b-40bv1hst5m] {
    --cd-primary: var(--color-primary);
    --cd-primary-dark: var(--color-primary-dark);
    --cd-primary-light: var(--color-primary-light);
    --cd-accent: var(--color-warning);
    --cd-success: var(--color-success);
    --cd-success-light: var(--color-success-light);
    --cd-danger: var(--color-danger);
    --cd-danger-light: var(--color-danger-light);
    --cd-info: var(--color-info);
    --cd-info-light: var(--color-info-light);
    --cd-orange: var(--color-accent);
    --cd-orange-dark: var(--color-accent-dark);
    --cd-bg: var(--bg);
    --cd-card: var(--surface);
    --cd-text: var(--text);
    --cd-text-secondary: var(--text-secondary);
    --cd-text-muted: var(--text-muted);
    --cd-border: var(--border);
    --cd-shadow-sm: var(--shadow-xs);
    --cd-shadow: var(--shadow-sm);
    --cd-shadow-md: var(--shadow-md);
    --cd-shadow-lg: var(--shadow-lg);
    --cd-radius: var(--radius-lg);
    --cd-radius-sm: var(--radius-md);
    --cd-radius-xs: var(--radius-sm);
    --cd-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--cd-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.recep-control-bar[b-40bv1hst5m] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    padding: 8px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 48px;
}

.control-left[b-40bv1hst5m] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.control-left label[b-40bv1hst5m] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    white-space: nowrap;
}

.control-center[b-40bv1hst5m] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loading-indicator[b-40bv1hst5m] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: recepFadeIn-b-40bv1hst5m 0.3s ease;
}

.loading-spinner[b-40bv1hst5m] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--cd-border);
    border-top-color: var(--cd-primary);
    border-radius: 50%;
    animation: recepSpin-b-40bv1hst5m 0.8s linear infinite;
}

.loading-text[b-40bv1hst5m] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--cd-primary);
    animation: recepPulse-b-40bv1hst5m 1.5s ease-in-out infinite;
}

.control-right[b-40bv1hst5m] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES DE ACCIÓN ===== */
.cd-btn[b-40bv1hst5m] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cd-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cd-transition);
    white-space: nowrap;
    color: white;
}

.cd-btn:hover[b-40bv1hst5m] {
    transform: translateY(-1px);
    box-shadow: var(--cd-shadow-md);
}

.cd-btn:active[b-40bv1hst5m] {
    transform: translateY(0);
}

.cd-btn .rzi[b-40bv1hst5m] {
    font-size: 1rem;
}

.btn-buscar[b-40bv1hst5m] {
    background: var(--cd-orange);
}

.btn-filtros[b-40bv1hst5m] {
    background: var(--cd-info);
}

.btn-filtros.active[b-40bv1hst5m] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* ===== PANEL DE FILTROS ===== */
.filtros-wrapper[b-40bv1hst5m] {
    position: relative;
    flex-shrink: 0;
}

.filtros-panel[b-40bv1hst5m] {
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow-md);
    overflow: hidden;
    animation: recepSlideDown-b-40bv1hst5m 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.filtros-header[b-40bv1hst5m] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--cd-border);
    background: linear-gradient(135deg, var(--cd-info-light) 0%, var(--cd-card) 100%);
}

.filtros-header h3[b-40bv1hst5m] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--cd-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.filtros-header h3 .rzi[b-40bv1hst5m] {
    color: var(--cd-info);
    font-size: 1.1rem;
}

.filtros-close-btn[b-40bv1hst5m] {
    background: none;
    border: none;
    color: var(--cd-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--cd-radius-xs);
    transition: var(--cd-transition);
    display: flex;
    align-items: center;
}

.filtros-close-btn:hover[b-40bv1hst5m] {
    background: var(--cd-danger-light);
    color: var(--cd-danger);
}

.filtros-body[b-40bv1hst5m] {
    padding: 12px 16px;
}

.filtros-grid[b-40bv1hst5m] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.filtro-field[b-40bv1hst5m] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.filtro-label[b-40bv1hst5m] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.filtro-field[b-40bv1hst5m]  .rz-textbox,
.filtro-field[b-40bv1hst5m]  .rz-spinner,
.filtro-field[b-40bv1hst5m]  .rz-inputtext,
.filtro-field[b-40bv1hst5m]  .rz-calendar,
.filtro-field[b-40bv1hst5m]  .rz-numeric,
.filtro-field[b-40bv1hst5m]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
}

.filtro-field[b-40bv1hst5m]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.filtro-field[b-40bv1hst5m]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.filtro-field[b-40bv1hst5m]  .rz-textbox:focus,
.filtro-field[b-40bv1hst5m]  .rz-state-focused,
.filtro-field[b-40bv1hst5m]  input:focus,
.filtro-field[b-40bv1hst5m]  .rz-calendar:focus-within,
.filtro-field[b-40bv1hst5m]  .rz-numeric:focus-within {
    border-color: var(--cd-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

.filtro-field[b-40bv1hst5m]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== GRILLA DE DATOS ===== */
.recep-grid-wrapper[b-40bv1hst5m] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    overflow: hidden;
    min-height: 0;
}

[b-40bv1hst5m] .recep-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-40bv1hst5m] .recep-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

[b-40bv1hst5m] .recep-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--cd-bg) !important;
    color: var(--cd-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--cd-border) !important;
}

[b-40bv1hst5m] .recep-grid-wrapper .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
}

[b-40bv1hst5m] .recep-grid-wrapper .rz-datatable-tbody > tr:hover {
    background-color: var(--cd-primary-light) !important;
}

[b-40bv1hst5m] .recep-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

[b-40bv1hst5m] .recep-grid-wrapper .rz-frozen-cell-right {
    box-shadow: -3px 0 5px -2px rgba(0,0,0,0.08);
}

[b-40bv1hst5m] .recep-grid-wrapper .rz-frozen-cell-right.rz-data-cell {
    background: var(--cd-card) !important;
}

[b-40bv1hst5m] .recep-grid-wrapper tr:hover .rz-frozen-cell-right.rz-data-cell {
    background: var(--cd-primary-light) !important;
}

.grid-actions[b-40bv1hst5m] {
    display: flex;
    align-items: center;
    gap: 4px;
}

/* ===== BOTÓN RECEPCIONAR (acción de la grilla) ===== */
.rm-btn-recep[b-40bv1hst5m] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border: none;
    border-radius: var(--cd-radius-xs);
    font-size: 0.74rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cd-transition);
    color: white;
    background: var(--cd-success);
    white-space: nowrap;
}

.rm-btn-recep:hover[b-40bv1hst5m] {
    background: #059669;
    transform: translateY(-1px);
    box-shadow: var(--cd-shadow-md);
}

.rm-btn-recep .rzi[b-40bv1hst5m] {
    font-size: 0.95rem;
}

.rm-recep-done[b-40bv1hst5m] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.74rem;
    font-weight: 600;
    color: var(--cd-text-muted);
}

.rm-recep-done .rzi[b-40bv1hst5m] {
    font-size: 0.95rem;
    color: var(--cd-success);
}

/* ===== BADGE ORDEN DE COMPRA ===== */
.rm-oc-badge[b-40bv1hst5m] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--cd-info);
    background: var(--cd-info-light);
    border: 1px solid var(--cd-info);
}

.rm-oc-badge .rzi[b-40bv1hst5m] {
    font-size: 0.9rem;
}

.rm-oc-none[b-40bv1hst5m] {
    font-size: 0.72rem;
    color: var(--cd-text-muted);
    font-style: italic;
}

/* ===== COLOREADO ESTADO RECEPCIÓN ===== */
.rm-estado-pendiente[b-40bv1hst5m] { color: var(--cd-orange);  font-weight: 700; }
.rm-estado-total[b-40bv1hst5m]     { color: var(--cd-success); font-weight: 700; }
.rm-estado-parcial[b-40bv1hst5m]   { color: var(--cd-info);    font-weight: 700; }

/* ===== ANIMACIONES ===== */
@keyframes recepSpin-b-40bv1hst5m {
    to { transform: rotate(360deg); }
}

@keyframes recepPulse-b-40bv1hst5m {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

@keyframes recepFadeIn-b-40bv1hst5m {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes recepSlideDown-b-40bv1hst5m {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .recep-container[b-40bv1hst5m] { padding: 8px 10px; gap: 8px; }
    .recep-control-bar[b-40bv1hst5m] { flex-wrap: wrap; padding: 8px 12px; }
    .control-center[b-40bv1hst5m] { order: 3; width: 100%; }
    .filtros-grid[b-40bv1hst5m] { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
}

@media (max-width: 640px) {
    .recep-container[b-40bv1hst5m] { padding: 6px 8px; gap: 6px; }
    .recep-control-bar[b-40bv1hst5m] { flex-direction: column; gap: 8px; }
    .control-left[b-40bv1hst5m], .control-right[b-40bv1hst5m] { width: 100%; justify-content: center; }
    .control-right[b-40bv1hst5m] { flex-wrap: wrap; }
    .cd-btn[b-40bv1hst5m] { flex: 1; justify-content: center; min-width: 0; }
    .filtros-grid[b-40bv1hst5m] { grid-template-columns: 1fr; }
}
/* /Pages/ConsultaDocumentos/BuscarBorrador/BuscarBorradorIndex.razor.rz.scp.css */
/* ===== BUSCAR BORRADOR - DESIGN SYSTEM (mismos lineamientos que ConsultaDocumentos) ===== */

/* Variables CSS del módulo */
.borrador-container[b-gbiygy9n44] {
    --cd-primary: var(--color-primary);
    --cd-primary-dark: var(--color-primary-dark);
    --cd-primary-light: var(--color-primary-light);
    --cd-accent: var(--color-warning);
    --cd-accent-dark: var(--color-warning-dark);
    --cd-accent-light: #FFFBEB;
    --cd-success: var(--color-success);
    --cd-success-light: var(--color-success-light);
    --cd-danger: var(--color-danger);
    --cd-danger-light: var(--color-danger-light);
    --cd-info: var(--color-info);
    --cd-info-light: var(--color-info-light);
    --cd-preview: var(--color-preview);
    --cd-preview-dark: var(--color-preview-dark);
    --cd-orange: var(--color-accent);
    --cd-orange-dark: var(--color-accent-dark);
    --cd-bg: var(--bg);
    --cd-card: var(--surface);
    --cd-text: var(--text);
    --cd-text-secondary: var(--text-secondary);
    --cd-text-muted: var(--text-muted);
    --cd-border: var(--border);
    --cd-shadow-sm: var(--shadow-xs);
    --cd-shadow: var(--shadow-sm);
    --cd-shadow-md: var(--shadow-md);
    --cd-shadow-lg: var(--shadow-lg);
    --cd-radius: var(--radius-lg);
    --cd-radius-sm: var(--radius-md);
    --cd-radius-xs: var(--radius-sm);
    --cd-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--cd-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.borrador-control-bar[b-gbiygy9n44] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    padding: 8px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 48px;
}

/* Sección izquierda */
.control-left[b-gbiygy9n44] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* Sección central: indicador de carga */
.control-center[b-gbiygy9n44] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loading-indicator[b-gbiygy9n44] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: bbFadeIn-b-gbiygy9n44 0.3s ease;
}

.loading-spinner[b-gbiygy9n44] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--cd-border);
    border-top-color: var(--cd-primary);
    border-radius: 50%;
    animation: bbSpin-b-gbiygy9n44 0.8s linear infinite;
}

.loading-text[b-gbiygy9n44] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--cd-primary);
    animation: bbPulse-b-gbiygy9n44 1.5s ease-in-out infinite;
}

/* Sección derecha: botones de acción */
.control-right[b-gbiygy9n44] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES DE ACCIÓN ===== */
.bb-btn[b-gbiygy9n44] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cd-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cd-transition);
    white-space: nowrap;
    color: white;
}

.bb-btn:hover[b-gbiygy9n44] {
    transform: translateY(-1px);
    box-shadow: var(--cd-shadow-md);
}

.bb-btn:active[b-gbiygy9n44] {
    transform: translateY(0);
}

.bb-btn .rzi[b-gbiygy9n44] {
    font-size: 1rem;
}

.btn-buscar[b-gbiygy9n44] {
    background: var(--cd-orange);
}

.btn-filtros[b-gbiygy9n44] {
    background: var(--cd-info);
}

.btn-filtros.active[b-gbiygy9n44] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* ===== PANEL DE FILTROS ===== */
.filtros-wrapper[b-gbiygy9n44] {
    position: relative;
    flex-shrink: 0;
}

.filtros-panel[b-gbiygy9n44] {
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow-md);
    overflow: hidden;
    animation: bbSlideDown-b-gbiygy9n44 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.filtros-header[b-gbiygy9n44] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--cd-border);
    background: linear-gradient(135deg, var(--cd-info-light) 0%, var(--cd-card) 100%);
}

.filtros-header h3[b-gbiygy9n44] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--cd-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.filtros-header h3 .rzi[b-gbiygy9n44] {
    color: var(--cd-info);
    font-size: 1.1rem;
}

.filtros-close-btn[b-gbiygy9n44] {
    background: none;
    border: none;
    color: var(--cd-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--cd-radius-xs);
    transition: var(--cd-transition);
    display: flex;
    align-items: center;
}

.filtros-close-btn:hover[b-gbiygy9n44] {
    background: var(--cd-danger-light);
    color: var(--cd-danger);
}

.filtros-body[b-gbiygy9n44] {
    padding: 12px 16px;
}

.filtros-grid[b-gbiygy9n44] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.filtro-field[b-gbiygy9n44] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.filtro-label[b-gbiygy9n44] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Inputs personalizados dentro de filtros - bordes visibles sutiles */
.filtro-field[b-gbiygy9n44]  .rz-textbox,
.filtro-field[b-gbiygy9n44]  .rz-spinner,
.filtro-field[b-gbiygy9n44]  .rz-inputtext,
.filtro-field[b-gbiygy9n44]  .rz-calendar,
.filtro-field[b-gbiygy9n44]  .rz-numeric,
.filtro-field[b-gbiygy9n44]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
}

.filtro-field[b-gbiygy9n44]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.filtro-field[b-gbiygy9n44]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.filtro-field[b-gbiygy9n44]  .rz-textbox:focus,
.filtro-field[b-gbiygy9n44]  .rz-state-focused,
.filtro-field[b-gbiygy9n44]  input:focus,
.filtro-field[b-gbiygy9n44]  .rz-calendar:focus-within,
.filtro-field[b-gbiygy9n44]  .rz-numeric:focus-within {
    border-color: var(--cd-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

/* Texto del dropdown visible sin recorte */
.filtro-field[b-gbiygy9n44]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== GRILLA DE DATOS ===== */
.borrador-grid-wrapper[b-gbiygy9n44] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    overflow: hidden;
    min-height: 0;
}

[b-gbiygy9n44] .borrador-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

[b-gbiygy9n44] .borrador-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--cd-bg) !important;
    color: var(--cd-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--cd-border) !important;
}

[b-gbiygy9n44] .borrador-grid-wrapper .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
}

[b-gbiygy9n44] .borrador-grid-wrapper .rz-datatable-tbody > tr:hover {
    background-color: var(--cd-primary-light) !important;
}

[b-gbiygy9n44] .borrador-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* Botones de acción en la grilla */
.grid-actions[b-gbiygy9n44] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.grid-action-btn[b-gbiygy9n44] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--cd-radius-xs);
    cursor: pointer;
    transition: var(--cd-transition);
    padding: 0;
    color: white;
    font-size: 0.85rem;
}

.grid-action-btn:hover[b-gbiygy9n44] {
    transform: scale(1.12);
    box-shadow: var(--cd-shadow-md);
}

.grid-action-btn:active[b-gbiygy9n44] {
    transform: scale(0.95);
}

.grid-btn-preview[b-gbiygy9n44] {
    background: var(--cd-preview);
}

.grid-btn-preview:hover[b-gbiygy9n44] {
    background: var(--cd-preview-dark);
}

.grid-btn-edit[b-gbiygy9n44] {
    background: var(--cd-info);
}

.grid-btn-edit:hover[b-gbiygy9n44] {
    background: #0284C7;
}

.grid-btn-delete[b-gbiygy9n44] {
    background: var(--cd-danger);
}

.grid-btn-delete:hover[b-gbiygy9n44] {
    background: #DC2626;
}

/* ===== ANIMACIONES ===== */
@keyframes bbSpin-b-gbiygy9n44 {
    to { transform: rotate(360deg); }
}

@keyframes bbPulse-b-gbiygy9n44 {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

@keyframes bbFadeIn-b-gbiygy9n44 {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes bbSlideDown-b-gbiygy9n44 {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

/* ===== RESPONSIVE: TABLET ===== */
@media (max-width: 1024px) {
    .borrador-container[b-gbiygy9n44] {
        padding: 8px 10px;
        gap: 8px;
    }

    .borrador-control-bar[b-gbiygy9n44] {
        flex-wrap: wrap;
        padding: 8px 12px;
    }

    .control-center[b-gbiygy9n44] {
        order: 3;
        width: 100%;
    }

    .filtros-grid[b-gbiygy9n44] {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
}

/* ===== RESPONSIVE: MOBILE ===== */
@media (max-width: 640px) {
    .borrador-container[b-gbiygy9n44] {
        padding: 6px 8px;
        gap: 6px;
    }

    .borrador-control-bar[b-gbiygy9n44] {
        flex-direction: column;
        gap: 8px;
    }

    .control-left[b-gbiygy9n44],
    .control-right[b-gbiygy9n44] {
        width: 100%;
        justify-content: center;
    }

    .control-right[b-gbiygy9n44] {
        flex-wrap: wrap;
    }

    .bb-btn[b-gbiygy9n44] {
        flex: 1;
        justify-content: center;
        min-width: 0;
    }

    .bb-btn span:not(.material-icons):not(.rzi)[b-gbiygy9n44] {
        display: none;
    }

    .filtros-grid[b-gbiygy9n44] {
        grid-template-columns: 1fr;
    }
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-gbiygy9n44] .borrador-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}
/* /Pages/ConsultaDocumentos/ConsultaDeudores/ConsultaDeudoresIndex.razor.rz.scp.css */
/* ===== CONSULTA DEUDORES INTERNOS - DESIGN SYSTEM ===== */

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-sv5n3ue455] .cdi-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

.cdi-container[b-sv5n3ue455] {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    box-sizing: border-box;
    background: var(--bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
}

/* ===== BARRA DE CONTROL ===== */
.cdi-control-bar[b-sv5n3ue455] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: 8px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 50px;
}

.cdi-control-left[b-sv5n3ue455] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.cdi-header-icon[b-sv5n3ue455] {
    width: 38px;
    height: 38px;
    border-radius: var(--radius-md);
    background: linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    flex-shrink: 0;
}

.cdi-header-icon .rzi[b-sv5n3ue455] {
    font-size: 1.2rem;
}

.cdi-control-left h2[b-sv5n3ue455] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: var(--fw-bold);
    color: var(--text);
    line-height: 1.1;
}

.cdi-header-subtitle[b-sv5n3ue455] {
    margin: 2px 0 0;
    font-size: var(--text-xs);
    color: var(--text-secondary);
    font-weight: var(--fw-medium);
}

.cdi-control-center[b-sv5n3ue455] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cdi-loading[b-sv5n3ue455] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.cdi-spinner[b-sv5n3ue455] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--border);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: cdiSpin-b-sv5n3ue455 0.8s linear infinite;
}

.cdi-loading-text[b-sv5n3ue455] {
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    color: var(--color-primary);
}

.cdi-control-right[b-sv5n3ue455] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES ===== */
.cdi-btn[b-sv5n3ue455] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    font-weight: var(--fw-bold);
    cursor: pointer;
    transition: var(--transition);
    white-space: nowrap;
    color: #fff;
}

.cdi-btn .rzi[b-sv5n3ue455] {
    font-size: 1rem;
}

.cdi-btn:hover[b-sv5n3ue455] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.cdi-btn:active[b-sv5n3ue455] {
    transform: translateY(0);
}

.cdi-btn-filtros[b-sv5n3ue455] {
    background: var(--color-info);
}

.cdi-btn-filtros.active[b-sv5n3ue455] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

.cdi-btn-buscar[b-sv5n3ue455] {
    background: var(--color-accent);
}

.cdi-btn-excel[b-sv5n3ue455] {
    background: var(--color-success);
}

.cdi-btn-excel:hover[b-sv5n3ue455] {
    background: var(--color-success-dark);
}

/* ===== PANEL DE FILTROS ===== */
.cdi-filtros-wrapper[b-sv5n3ue455] {
    position: relative;
    flex-shrink: 0;
}

.cdi-filtros-panel[b-sv5n3ue455] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md);
    overflow: hidden;
    animation: cdiSlideDown-b-sv5n3ue455 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.cdi-filtros-header[b-sv5n3ue455] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--border);
    background: linear-gradient(135deg, var(--color-info-light) 0%, var(--surface) 100%);
}

.cdi-filtros-header h3[b-sv5n3ue455] {
    font-size: var(--text-base);
    font-weight: var(--fw-bold);
    color: var(--text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.cdi-filtros-header h3 .rzi[b-sv5n3ue455] {
    color: var(--color-info);
    font-size: 1.1rem;
}

.cdi-filtros-close-btn[b-sv5n3ue455] {
    background: none;
    border: none;
    color: var(--text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    display: flex;
    align-items: center;
}

.cdi-filtros-close-btn:hover[b-sv5n3ue455] {
    background: var(--color-danger-light);
    color: var(--color-danger);
}

.cdi-filtros-body[b-sv5n3ue455] {
    padding: 12px 16px;
}

.cdi-filtros-grid[b-sv5n3ue455] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.cdi-filtro-field[b-sv5n3ue455] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.cdi-filtro-label[b-sv5n3ue455] {
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.cdi-filtro-field[b-sv5n3ue455]  .rz-textbox,
.cdi-filtro-field[b-sv5n3ue455]  .rz-dropdown,
.cdi-filtro-field[b-sv5n3ue455]  .rz-datepicker,
.cdi-filtro-field[b-sv5n3ue455]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--radius-sm) !important;
    font-size: var(--text-sm) !important;
    height: 32px !important;
    background: #fff !important;
    box-sizing: border-box !important;
    transition: var(--transition);
}

.cdi-filtro-field[b-sv5n3ue455]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.cdi-filtro-field[b-sv5n3ue455]  .rz-textbox:focus,
.cdi-filtro-field[b-sv5n3ue455]  .rz-state-focused,
.cdi-filtro-field[b-sv5n3ue455]  input:focus,
.cdi-filtro-field[b-sv5n3ue455]  .rz-datepicker:focus-within {
    border-color: var(--color-primary) !important;
    box-shadow: var(--shadow-focus) !important;
}

.cdi-filtro-field[b-sv5n3ue455]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: var(--text-sm) !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== GRILLA ===== */
.cdi-grid-wrapper[b-sv5n3ue455] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
    min-height: 0;
}

[b-sv5n3ue455] .cdi-grid-wrapper .rz-datatable {
    border: none !important;
    font-size: var(--text-sm);
}

[b-sv5n3ue455] .cdi-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--bg) !important;
    color: var(--text-secondary) !important;
    font-weight: var(--fw-bold) !important;
    font-size: var(--text-xs) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--border) !important;
}

[b-sv5n3ue455] .cdi-grid-wrapper .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
}

[b-sv5n3ue455] .cdi-grid-wrapper .rz-datatable-tbody > tr:hover {
    background-color: var(--color-primary-light) !important;
}

[b-sv5n3ue455] .cdi-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: var(--text-sm);
}

/* ===== ANIMACIONES ===== */
@keyframes cdiSpin-b-sv5n3ue455 {
    to { transform: rotate(360deg); }
}

@keyframes cdiSlideDown-b-sv5n3ue455 {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .cdi-container[b-sv5n3ue455] { padding: 8px 10px; gap: 8px; }
    .cdi-control-bar[b-sv5n3ue455] { flex-wrap: wrap; padding: 8px 12px; }
    .cdi-control-center[b-sv5n3ue455] { order: 3; width: 100%; }
}

@media (max-width: 640px) {
    .cdi-container[b-sv5n3ue455] { padding: 6px 8px; gap: 6px; }
    .cdi-control-bar[b-sv5n3ue455] { flex-direction: column; gap: 8px; }
    .cdi-control-left[b-sv5n3ue455], .cdi-control-right[b-sv5n3ue455] { width: 100%; justify-content: center; }
    .cdi-control-right[b-sv5n3ue455] { flex-wrap: wrap; }
    .cdi-btn[b-sv5n3ue455] { flex: 1; justify-content: center; }
    .cdi-filtros-grid[b-sv5n3ue455] { grid-template-columns: 1fr; }
}
/* /Pages/ConsultaDocumentos/ConsultaGuiasDespacho/Componentes/AnularGuiaDialog.razor.rz.scp.css */
/* ===== ANULAR GUÍA DE DESPACHO - DIÁLOGO ===== */

.anular-container[b-knq26ylos6] {
    display: flex;
    flex-direction: column;
    height: 100%;
    gap: 12px;
    font-family: var(--font-family);
    color: var(--text);
    overflow: hidden;
}

/* ===== INDICADOR DE CARGA ===== */
.anular-loading[b-knq26ylos6] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    color: var(--color-primary);
    font-size: 0.85rem;
    font-weight: 600;
}

.anular-spinner[b-knq26ylos6] {
    width: 32px;
    height: 32px;
    border: 3px solid var(--border);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: anularSpin-b-knq26ylos6 0.8s linear infinite;
}

.anular-spinner-sm[b-knq26ylos6] {
    width: 16px;
    height: 16px;
    border-width: 2px;
    border-top-color: white;
}

@keyframes anularSpin-b-knq26ylos6 {
    to { transform: rotate(360deg); }
}

/* ===== ENCABEZADO DEL DOCUMENTO ===== */
.anular-header-card[b-knq26ylos6] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-xs);
    padding: 12px 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex-shrink: 0;
}

.anular-header-row[b-knq26ylos6] {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

.anular-field[b-knq26ylos6] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 120px;
}

.anular-field-wide[b-knq26ylos6] {
    flex: 1;
}

.anular-label[b-knq26ylos6] {
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.anular-value[b-knq26ylos6] {
    font-size: 0.85rem;
    color: var(--text);
}

.anular-value-strong[b-knq26ylos6] {
    font-weight: 700;
}

/* ===== DETALLE DE ITEMS ===== */
.anular-detalle-wrapper[b-knq26ylos6] {
    flex: 1;
    min-height: 0;
    overflow: auto;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--surface);
}

[b-knq26ylos6] .anular-detalle-wrapper .rz-datatable-thead > tr > th {
    background: var(--bg) !important;
    color: var(--text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.68rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 7px 9px !important;
}

[b-knq26ylos6] .anular-detalle-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 9px !important;
    font-size: 0.78rem;
}

/* ===== MOTIVO ===== */
.anular-motivo-field[b-knq26ylos6] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex-shrink: 0;
}

.anular-required[b-knq26ylos6] {
    color: var(--color-danger);
}

.anular-motivo-field[b-knq26ylos6]  textarea {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--radius-sm) !important;
    font-size: 0.82rem !important;
    transition: var(--transition);
}

.anular-motivo-field[b-knq26ylos6]  textarea:focus {
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

/* ===== ESTADO VACÍO ===== */
.anular-empty[b-knq26ylos6] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: var(--text-muted);
}

/* ===== BOTONES ===== */
.anular-actions[b-knq26ylos6] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    flex-shrink: 0;
    padding-top: 4px;
    border-top: 1px solid var(--border);
}

.anular-btn[b-knq26ylos6] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 18px;
    border: none;
    border-radius: var(--radius-sm);
    font-size: 0.8rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--transition);
    color: white;
}

.anular-btn:hover:not(:disabled)[b-knq26ylos6] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.anular-btn:disabled[b-knq26ylos6] {
    opacity: 0.5;
    cursor: not-allowed;
}

.anular-btn .rzi[b-knq26ylos6] {
    font-size: 1rem;
}

.anular-btn-cancelar[b-knq26ylos6] {
    background: var(--text-muted);
}

.anular-btn-anular[b-knq26ylos6] {
    background: var(--color-danger);
}
/* /Pages/ConsultaDocumentos/ConsultaGuiasDespacho/ConsultaGuiasDespachoIndex.razor.rz.scp.css */
/* ===== CONSULTA GUÍAS DE DESPACHO - DESIGN SYSTEM ===== */
/* Reutiliza el sistema de diseño de ConsultaDocumentos. */

.consulta-container[b-kyb98wie01] {
    --cd-primary: var(--color-primary);
    --cd-primary-dark: var(--color-primary-dark);
    --cd-primary-light: var(--color-primary-light);
    --cd-accent: var(--color-warning);
    --cd-accent-dark: var(--color-warning-dark);
    --cd-accent-light: #FFFBEB;
    --cd-success: var(--color-success);
    --cd-success-light: var(--color-success-light);
    --cd-danger: var(--color-danger);
    --cd-danger-light: var(--color-danger-light);
    --cd-info: var(--color-info);
    --cd-info-light: var(--color-info-light);
    --cd-orange: var(--color-accent);
    --cd-orange-dark: var(--color-accent-dark);
    --cd-bg: var(--bg);
    --cd-card: var(--surface);
    --cd-text: var(--text);
    --cd-text-secondary: var(--text-secondary);
    --cd-text-muted: var(--text-muted);
    --cd-border: var(--border);
    --cd-shadow-sm: var(--shadow-xs);
    --cd-shadow: var(--shadow-sm);
    --cd-shadow-md: var(--shadow-md);
    --cd-shadow-lg: var(--shadow-lg);
    --cd-radius: var(--radius-lg);
    --cd-radius-sm: var(--radius-md);
    --cd-radius-xs: var(--radius-sm);
    --cd-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--cd-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.consulta-control-bar[b-kyb98wie01] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    padding: 8px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 48px;
}

.control-left[b-kyb98wie01] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.control-left label[b-kyb98wie01] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--cd-text);
    white-space: nowrap;
}

.control-left .rzi[b-kyb98wie01] {
    font-size: 1.2rem;
}

.control-center[b-kyb98wie01] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loading-indicator[b-kyb98wie01] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: cdFadeIn-b-kyb98wie01 0.3s ease;
}

.loading-spinner[b-kyb98wie01] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--cd-border);
    border-top-color: var(--cd-primary);
    border-radius: 50%;
    animation: cdSpin-b-kyb98wie01 0.8s linear infinite;
}

.loading-text[b-kyb98wie01] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--cd-primary);
    animation: cdPulse-b-kyb98wie01 1.5s ease-in-out infinite;
}

.control-right[b-kyb98wie01] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES DE ACCIÓN ===== */
.cd-btn[b-kyb98wie01] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cd-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cd-transition);
    white-space: nowrap;
    color: white;
}

.cd-btn:hover[b-kyb98wie01] {
    transform: translateY(-1px);
    box-shadow: var(--cd-shadow-md);
}

.cd-btn:active[b-kyb98wie01] {
    transform: translateY(0);
}

.cd-btn .rzi[b-kyb98wie01] {
    font-size: 1rem;
}

.btn-buscar[b-kyb98wie01] {
    background: var(--cd-orange);
}

.btn-exportar[b-kyb98wie01] {
    background: var(--cd-success);
}

.btn-filtros[b-kyb98wie01] {
    background: var(--cd-info);
}

.btn-filtros.active[b-kyb98wie01] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* ===== PANEL DE FILTROS ===== */
.filtros-wrapper[b-kyb98wie01] {
    position: relative;
    flex-shrink: 0;
}

.filtros-panel[b-kyb98wie01] {
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow-md);
    overflow: hidden;
    animation: cdSlideDown-b-kyb98wie01 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.filtros-header[b-kyb98wie01] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--cd-border);
    background: linear-gradient(135deg, var(--cd-info-light) 0%, var(--cd-card) 100%);
}

.filtros-header h3[b-kyb98wie01] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--cd-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.filtros-header h3 .rzi[b-kyb98wie01] {
    color: var(--cd-info);
    font-size: 1.1rem;
}

.filtros-close-btn[b-kyb98wie01] {
    background: none;
    border: none;
    color: var(--cd-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--cd-radius-xs);
    transition: var(--cd-transition);
    display: flex;
    align-items: center;
}

.filtros-close-btn:hover[b-kyb98wie01] {
    background: var(--cd-danger-light);
    color: var(--cd-danger);
}

.filtros-body[b-kyb98wie01] {
    padding: 12px 16px;
}

.filtros-grid[b-kyb98wie01] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.filtro-field[b-kyb98wie01] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.filtro-label[b-kyb98wie01] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.filtro-field[b-kyb98wie01]  .rz-textbox,
.filtro-field[b-kyb98wie01]  .rz-spinner,
.filtro-field[b-kyb98wie01]  .rz-inputtext,
.filtro-field[b-kyb98wie01]  .rz-calendar,
.filtro-field[b-kyb98wie01]  .rz-numeric,
.filtro-field[b-kyb98wie01]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
}

.filtro-field[b-kyb98wie01]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.filtro-field[b-kyb98wie01]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.filtro-field[b-kyb98wie01]  .rz-textbox:focus,
.filtro-field[b-kyb98wie01]  .rz-state-focused,
.filtro-field[b-kyb98wie01]  input:focus,
.filtro-field[b-kyb98wie01]  .rz-calendar:focus-within,
.filtro-field[b-kyb98wie01]  .rz-numeric:focus-within {
    border-color: var(--cd-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

.filtro-field[b-kyb98wie01]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== GRILLA DE DATOS ===== */
.consulta-grid-wrapper[b-kyb98wie01] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    overflow: hidden;
    min-height: 0;
}

[b-kyb98wie01] .consulta-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-kyb98wie01] .consulta-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

[b-kyb98wie01] .consulta-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--cd-bg) !important;
    color: var(--cd-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--cd-border) !important;
}

[b-kyb98wie01] .consulta-grid-wrapper .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
}

[b-kyb98wie01] .consulta-grid-wrapper .rz-datatable-tbody > tr:hover {
    background-color: var(--cd-primary-light) !important;
}

[b-kyb98wie01] .consulta-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* ===== ACCIONES DE GRILLA ===== */
.grid-actions[b-kyb98wie01] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.grid-action-btn[b-kyb98wie01] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--cd-radius-xs);
    cursor: pointer;
    transition: var(--cd-transition);
    padding: 0;
    color: white;
    font-size: 0.85rem;
}

.grid-action-btn:hover[b-kyb98wie01] {
    transform: scale(1.12);
    box-shadow: var(--cd-shadow-md);
}

.grid-action-btn:active[b-kyb98wie01] {
    transform: scale(0.95);
}

.grid-action-btn:disabled[b-kyb98wie01] {
    opacity: 0.45;
    cursor: not-allowed;
    filter: grayscale(0.5);
}

.grid-action-btn:disabled:hover[b-kyb98wie01] {
    transform: none;
    box-shadow: none;
}

/* Botón anular guía = rojo (acción destructiva). */
.grid-btn-anular[b-kyb98wie01] {
    background: var(--cd-danger);
}

.grid-btn-anular:hover[b-kyb98wie01] {
    background: #B91C1C;
}

/* ===== CELDA DE ANULACIÓN ===== */
.cgd-anulacion-cell[b-kyb98wie01] {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.cgd-anulacion-fecha[b-kyb98wie01] {
    font-weight: 600;
    color: var(--cd-text-secondary);
    font-size: 0.72rem;
}

.cgd-anulacion-motivo[b-kyb98wie01] {
    color: var(--cd-text-muted);
    font-size: 0.72rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 200px;
}

/* ===== BADGE DE ESTADO ===== */
.cd-estado-badge[b-kyb98wie01] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.cd-estado-badge.cd-estado-rechazado[b-kyb98wie01] {
    background: #FEE2E2;
    color: #B91C1C;
}

.cd-estado-badge.cd-estado-aceptado[b-kyb98wie01] {
    background: #D1FAE5;
    color: #047857;
}

/* ===== ANIMACIONES ===== */
@keyframes cdSpin-b-kyb98wie01 {
    to { transform: rotate(360deg); }
}

@keyframes cdPulse-b-kyb98wie01 {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

@keyframes cdFadeIn-b-kyb98wie01 {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes cdSlideDown-b-kyb98wie01 {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

/* ===== RESPONSIVE: TABLET ===== */
@media (max-width: 1024px) {
    .consulta-container[b-kyb98wie01] {
        padding: 8px 10px;
        gap: 8px;
    }

    .consulta-control-bar[b-kyb98wie01] {
        flex-wrap: wrap;
        padding: 8px 12px;
    }

    .control-center[b-kyb98wie01] {
        order: 3;
        width: 100%;
    }

    .filtros-grid[b-kyb98wie01] {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
}

/* ===== RESPONSIVE: MOBILE ===== */
@media (max-width: 640px) {
    .consulta-container[b-kyb98wie01] {
        padding: 6px 8px;
        gap: 6px;
    }

    .consulta-control-bar[b-kyb98wie01] {
        flex-direction: column;
        gap: 8px;
    }

    .control-left[b-kyb98wie01],
    .control-right[b-kyb98wie01] {
        width: 100%;
        justify-content: center;
    }

    .control-right[b-kyb98wie01] {
        flex-wrap: wrap;
    }

    .cd-btn[b-kyb98wie01] {
        flex: 1;
        justify-content: center;
        min-width: 0;
    }

    .cd-btn span:not(.material-icons):not(.rzi)[b-kyb98wie01] {
        display: none;
    }

    .filtros-grid[b-kyb98wie01] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/ConsultaDocumentos/DocumentosEmitidos/Componentes/DetalleRespuestaBoleta.razor.rz.scp.css */
/* ===== DETALLE RESPUESTA BOLETA - ESTILOS ===== */

.detresp-container[b-0xog0asqub] {
    --cd-accent: var(--color-warning);
    --cd-bg: var(--bg);
    --cd-card: var(--surface);
    --cd-text: var(--text);
    --cd-text-secondary: var(--text-secondary);
    --cd-text-muted: var(--text-muted);
    --cd-border: var(--border);

    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 4px 0;
    animation: detFadeIn-b-0xog0asqub 0.3s ease;
    font-family: var(--font-family);
}

.detresp-row[b-0xog0asqub] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px 14px;
    background: var(--cd-bg);
    border-radius: var(--radius-md);
    border-left: 3px solid var(--cd-accent);
}

.detresp-icon[b-0xog0asqub] {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--cd-card);
    color: var(--cd-accent);
    border-radius: var(--radius-sm);
    flex-shrink: 0;
    font-size: 1.1rem;
}

.detresp-content[b-0xog0asqub] {
    flex: 1;
    min-width: 0;
}

.detresp-label[b-0xog0asqub] {
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--cd-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 2px;
}

.detresp-value[b-0xog0asqub] {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--cd-text);
    word-break: break-word;
}

.detresp-value.code[b-0xog0asqub] {
    font-family: 'JetBrains Mono', 'Fira Code', monospace;
    background: var(--cd-card);
    padding: 4px 10px;
    border-radius: var(--radius-xs);
    border: 1px solid var(--cd-border);
    display: inline-block;
}

.detresp-desc[b-0xog0asqub] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 12px 14px;
    background: var(--cd-bg);
    border-radius: var(--radius-md);
    border-left: 3px solid var(--cd-accent);
}

.detresp-text[b-0xog0asqub] {
    font-size: 0.85rem;
    color: var(--cd-text);
    white-space: pre-wrap;
    word-break: break-word;
    max-height: 160px;
    overflow-y: auto;
}

/* Estado de carga */
.detresp-loading[b-0xog0asqub] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 20px;
    color: var(--cd-text-muted);
    font-size: 0.82rem;
}

.detresp-loading-dot[b-0xog0asqub] {
    width: 8px;
    height: 8px;
    background: var(--cd-accent);
    border-radius: 50%;
    animation: detBounce-b-0xog0asqub 0.6s infinite alternate;
}

.detresp-loading-dot:nth-child(2)[b-0xog0asqub] { animation-delay: 0.2s; }
.detresp-loading-dot:nth-child(3)[b-0xog0asqub] { animation-delay: 0.4s; }

@keyframes detFadeIn-b-0xog0asqub {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes detBounce-b-0xog0asqub {
    from { transform: translateY(0); }
    to { transform: translateY(-6px); }
}
/* /Pages/ConsultaDocumentos/DocumentosEmitidos/Componentes/EnviarEmail.razor.rz.scp.css */
/* ===== ENVIAR EMAIL - ESTILOS ===== */

.email-container[b-jibvhpuyo4] {
    --cd-primary: var(--color-primary);
    --cd-primary-light: var(--color-primary-light);
    --cd-accent: var(--color-warning);
    --cd-success: var(--color-success);
    --cd-danger: var(--color-danger);
    --cd-danger-light: var(--color-danger-light);
    --cd-orange: var(--color-accent);
    --cd-orange-dark: var(--color-accent-dark);
    --cd-bg: var(--bg);
    --cd-card: var(--surface);
    --cd-text: var(--text);
    --cd-text-secondary: var(--text-secondary);
    --cd-text-muted: var(--text-muted);
    --cd-border: var(--border);
    --cd-shadow-sm: var(--shadow-xs);
    --cd-radius: var(--radius-lg);
    --cd-radius-sm: var(--radius-md);
    --cd-radius-xs: var(--radius-sm);
    --cd-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    gap: 0;
    font-family: var(--font-family);
}

/* Sección de info del documento */
.email-doc-info[b-jibvhpuyo4] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    padding: 12px 16px;
    background: var(--cd-bg);
    border-radius: var(--cd-radius-sm);
    margin: 0 0 12px 0;
}

.email-doc-field[b-jibvhpuyo4] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.email-doc-label[b-jibvhpuyo4] {
    font-size: 0.65rem;
    font-weight: 700;
    color: var(--cd-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.email-doc-value[b-jibvhpuyo4] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--cd-text);
    background: var(--cd-card);
    padding: 6px 10px;
    border-radius: var(--cd-radius-xs);
    border: 1px solid var(--cd-border);
}

/* Campo de correo */
.email-field[b-jibvhpuyo4] {
    margin-bottom: 12px;
}

.email-label[b-jibvhpuyo4] {
    display: block;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    margin-bottom: 4px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

[b-jibvhpuyo4] .email-field .rz-textbox {
    width: 100% !important;
    border-radius: var(--cd-radius-xs) !important;
    border: 1.5px solid var(--cd-border) !important;
    transition: var(--cd-transition);
    padding: 8px 12px !important;
}

[b-jibvhpuyo4] .email-field .rz-textbox:focus {
    border-color: var(--cd-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.12) !important;
}

/* Checkboxes con estilo */
.email-attachments[b-jibvhpuyo4] {
    display: flex;
    gap: 16px;
    margin-bottom: 12px;
    padding: 10px 14px;
    background: var(--cd-bg);
    border-radius: var(--cd-radius-sm);
}

.email-checkbox-item[b-jibvhpuyo4] {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    transition: var(--cd-transition);
    padding: 4px 8px;
    border-radius: var(--cd-radius-xs);
}

.email-checkbox-item:hover[b-jibvhpuyo4] {
    background: var(--cd-primary-light);
}

[b-jibvhpuyo4] .email-checkbox-item .rz-chkbox {
    transition: var(--cd-transition);
}

.email-checkbox-label[b-jibvhpuyo4] {
    font-size: 0.82rem;
    font-weight: 500;
    color: var(--cd-text);
    user-select: none;
}

/* Área de mensaje */
.email-message[b-jibvhpuyo4] {
    flex: 1;
    display: flex;
    flex-direction: column;
    margin-bottom: 12px;
    min-height: 0;
}

[b-jibvhpuyo4] .email-message .rz-textarea {
    flex: 1;
    width: 100% !important;
    border-radius: var(--cd-radius-sm) !important;
    border: 1.5px solid var(--cd-border) !important;
    transition: var(--cd-transition);
    padding: 10px 12px !important;
    font-size: 0.82rem !important;
    resize: none;
    min-height: 180px;
}

[b-jibvhpuyo4] .email-message .rz-textarea:focus {
    border-color: var(--cd-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.12) !important;
}

/* Footer con botones */
.email-footer[b-jibvhpuyo4] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding-top: 12px;
    border-top: 1px solid var(--cd-border);
    flex-shrink: 0;
}

.email-btn[b-jibvhpuyo4] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cd-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cd-transition);
    color: white;
}

.email-btn:hover[b-jibvhpuyo4] {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.email-btn:active[b-jibvhpuyo4] {
    transform: translateY(0);
}

.email-btn-send[b-jibvhpuyo4] {
    background: var(--cd-orange);
}

.email-btn-send:hover[b-jibvhpuyo4] {
    box-shadow: var(--shadow-md);
}

/* Cancelar = gris (DESIGN_SYSTEM §4.3) */
.email-btn-cancel[b-jibvhpuyo4] {
    background: var(--color-secondary);
}

.email-btn-cancel:hover[b-jibvhpuyo4] {
    background: var(--color-secondary-dark);
    box-shadow: var(--shadow-md);
}

/* Responsive */
@media (max-width: 640px) {
    .email-doc-info[b-jibvhpuyo4] {
        grid-template-columns: repeat(2, 1fr);
    }

    .email-attachments[b-jibvhpuyo4] {
        flex-direction: column;
        gap: 8px;
    }

    .email-footer[b-jibvhpuyo4] {
        flex-direction: column;
    }

    .email-btn[b-jibvhpuyo4] {
        justify-content: center;
    }
}

.email-btn .rzi[b-jibvhpuyo4] {
    font-size: 1rem;
}
/* /Pages/ConsultaDocumentos/DocumentosEmitidos/Componentes/ListaAccionesSii.razor.rz.scp.css */
/* ===== LISTA ACCIONES SII - ESTILOS ===== */

.acciones-container[b-zff5l55k1t] {
    --cd-primary: var(--color-primary);
    --cd-primary-light: var(--color-primary-light);
    --cd-bg: var(--bg);
    --cd-card: var(--surface);
    --cd-text: var(--text);
    --cd-text-secondary: var(--text-secondary);
    --cd-text-muted: var(--text-muted);
    --cd-border: var(--border);
    --cd-radius-sm: var(--radius-md);
    --cd-radius-xs: var(--radius-sm);
    --cd-transition: var(--transition);

    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 4px 0;
    animation: accionFadeIn-b-zff5l55k1t 0.3s ease;
    font-family: var(--font-family);
}

.accion-row[b-zff5l55k1t] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px 14px;
    background: var(--cd-bg);
    border-radius: var(--cd-radius-sm);
    border-left: 3px solid var(--cd-primary);
    transition: var(--cd-transition);
}

.accion-row:hover[b-zff5l55k1t] {
    box-shadow: 0 2px 8px rgba(99, 102, 241, 0.12);
    transform: translateX(2px);
}

.accion-icon[b-zff5l55k1t] {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--cd-primary-light);
    color: var(--cd-primary);
    border-radius: var(--cd-radius-xs);
    flex-shrink: 0;
    font-size: 1.1rem;
}

.accion-content[b-zff5l55k1t] {
    flex: 1;
    min-width: 0;
}

.accion-label[b-zff5l55k1t] {
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--cd-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 2px;
}

.accion-value[b-zff5l55k1t] {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--cd-text);
    word-break: break-word;
}

.accion-value.code[b-zff5l55k1t] {
    font-family: 'JetBrains Mono', 'Fira Code', monospace;
    background: var(--cd-card);
    padding: 4px 10px;
    border-radius: 4px;
    border: 1px solid var(--cd-border);
    display: inline-block;
}

/* Estado de carga */
.accion-loading[b-zff5l55k1t] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 20px;
    color: var(--cd-text-muted);
    font-size: 0.82rem;
}

.accion-loading-dot[b-zff5l55k1t] {
    width: 8px;
    height: 8px;
    background: var(--cd-primary);
    border-radius: 50%;
    animation: accionBounce-b-zff5l55k1t 0.6s infinite alternate;
}

.accion-loading-dot:nth-child(2)[b-zff5l55k1t] {
    animation-delay: 0.2s;
}

.accion-loading-dot:nth-child(3)[b-zff5l55k1t] {
    animation-delay: 0.4s;
}

@keyframes accionFadeIn-b-zff5l55k1t {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes accionBounce-b-zff5l55k1t {
    from { transform: translateY(0); }
    to { transform: translateY(-6px); }
}
/* /Pages/ConsultaDocumentos/DocumentosEmitidos/Componentes/Referencias.razor.rz.scp.css */
/* ===== REFERENCIAS - ESTILOS ===== */

.referencias-container[b-isb4wg8gfi] {
    --cd-primary: var(--color-primary);
    --cd-primary-light: var(--color-primary-light);
    --cd-bg: var(--bg);
    --cd-card: var(--surface);
    --cd-text: var(--text);
    --cd-text-secondary: var(--text-secondary);
    --cd-text-muted: var(--text-muted);
    --cd-border: var(--border);
    --cd-radius-sm: var(--radius-md);
    --cd-radius-xs: var(--radius-sm);
    --cd-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    gap: 10px;
    animation: refFadeIn-b-isb4wg8gfi 0.3s ease;
    font-family: var(--font-family);
}

.referencias-header-bar[b-isb4wg8gfi] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--cd-border);
}

.referencias-header-bar .rzi[b-isb4wg8gfi] {
    color: var(--cd-primary);
    font-size: 1.2rem;
}

.referencias-header-bar h4[b-isb4wg8gfi] {
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--cd-text);
    margin: 0;
}

.referencias-grid-wrapper[b-isb4wg8gfi] {
    flex: 1;
    overflow: hidden;
    border-radius: var(--cd-radius-sm);
}

[b-isb4wg8gfi] .referencias-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: var(--cd-radius-sm) !important;
    overflow: hidden;
    font-size: 0.8rem;
}

[b-isb4wg8gfi] .referencias-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--cd-bg) !important;
    color: var(--cd-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--cd-border) !important;
}

[b-isb4wg8gfi] .referencias-grid-wrapper .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
}

[b-isb4wg8gfi] .referencias-grid-wrapper .rz-datatable-tbody > tr:hover {
    background-color: var(--cd-primary-light) !important;
}

[b-isb4wg8gfi] .referencias-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 6px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* Estado vacío */
.referencias-empty[b-isb4wg8gfi] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 30px;
    color: var(--cd-text-muted);
    gap: 8px;
}

.referencias-empty .rzi[b-isb4wg8gfi] {
    font-size: 2rem;
    opacity: 0.5;
}

.referencias-empty p[b-isb4wg8gfi] {
    font-size: 0.85rem;
    margin: 0;
}

@keyframes refFadeIn-b-isb4wg8gfi {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}
/* /Pages/ConsultaDocumentos/DocumentosEmitidos/Componentes/RespuestaReceptor.razor.rz.scp.css */
/* ===== RESPUESTA RECEPTOR - ESTILOS ===== */

.respuesta-container[b-632xl6kzw6] {
    --cd-primary: var(--color-primary);
    --cd-primary-light: var(--color-primary-light);
    --cd-accent: var(--color-warning);
    --cd-bg: var(--bg);
    --cd-card: var(--surface);
    --cd-text: var(--text);
    --cd-text-secondary: var(--text-secondary);
    --cd-text-muted: var(--text-muted);
    --cd-border: var(--border);
    --cd-radius-sm: var(--radius-md);
    --cd-radius-xs: var(--radius-sm);
    --cd-transition: var(--transition);

    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 4px 0;
    animation: respFadeIn-b-632xl6kzw6 0.3s ease;
    font-family: var(--font-family);
}

.respuesta-row[b-632xl6kzw6] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px 14px;
    background: var(--cd-bg);
    border-radius: var(--cd-radius-sm);
    border-left: 3px solid var(--cd-accent);
    transition: var(--cd-transition);
}

.respuesta-row:hover[b-632xl6kzw6] {
    box-shadow: 0 2px 8px rgba(245, 158, 11, 0.12);
    transform: translateX(2px);
}

.respuesta-icon[b-632xl6kzw6] {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #FFFBEB;
    color: var(--cd-accent);
    border-radius: var(--cd-radius-xs);
    flex-shrink: 0;
    font-size: 1.1rem;
}

.respuesta-content[b-632xl6kzw6] {
    flex: 1;
    min-width: 0;
}

.respuesta-label[b-632xl6kzw6] {
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--cd-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 2px;
}

.respuesta-value[b-632xl6kzw6] {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--cd-text);
    word-break: break-word;
}

.respuesta-value.code[b-632xl6kzw6] {
    font-family: 'JetBrains Mono', 'Fira Code', monospace;
    background: var(--cd-card);
    padding: 4px 10px;
    border-radius: 4px;
    border: 1px solid var(--cd-border);
    display: inline-block;
}

/* Estado de carga */
.respuesta-loading[b-632xl6kzw6] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 20px;
    color: var(--cd-text-muted);
    font-size: 0.82rem;
}

.respuesta-loading-dot[b-632xl6kzw6] {
    width: 8px;
    height: 8px;
    background: var(--cd-accent);
    border-radius: 50%;
    animation: respBounce-b-632xl6kzw6 0.6s infinite alternate;
}

.respuesta-loading-dot:nth-child(2)[b-632xl6kzw6] {
    animation-delay: 0.2s;
}

.respuesta-loading-dot:nth-child(3)[b-632xl6kzw6] {
    animation-delay: 0.4s;
}

/* Estado vacío */
.respuesta-empty[b-632xl6kzw6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px;
    color: var(--cd-text-muted);
    gap: 6px;
}

.respuesta-empty .rzi[b-632xl6kzw6] {
    font-size: 1.8rem;
    opacity: 0.5;
}

.respuesta-empty p[b-632xl6kzw6] {
    font-size: 0.82rem;
    margin: 0;
}

@keyframes respFadeIn-b-632xl6kzw6 {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes respBounce-b-632xl6kzw6 {
    from { transform: translateY(0); }
    to { transform: translateY(-6px); }
}
/* /Pages/ConsultaDocumentos/DocumentosEmitidos/ConsultaDocumentos.razor.rz.scp.css */
/* ===== CONSULTA DOCUMENTOS - DESIGN SYSTEM ===== */

/* Variables CSS del módulo */
.consulta-container[b-h7lxhippje] {
    --cd-primary: var(--color-primary);
    --cd-primary-dark: var(--color-primary-dark);
    --cd-primary-light: var(--color-primary-light);
    --cd-accent: var(--color-warning);
    --cd-accent-dark: var(--color-warning-dark);
    --cd-accent-light: #FFFBEB;
    --cd-success: var(--color-success);
    --cd-success-light: var(--color-success-light);
    --cd-danger: var(--color-danger);
    --cd-danger-light: var(--color-danger-light);
    --cd-info: var(--color-info);
    --cd-info-light: var(--color-info-light);
    --cd-orange: var(--color-accent);
    --cd-orange-dark: var(--color-accent-dark);
    --cd-preview: var(--color-preview);
    --cd-preview-dark: var(--color-preview-dark);
    --cd-bg: var(--bg);
    --cd-card: var(--surface);
    --cd-text: var(--text);
    --cd-text-secondary: var(--text-secondary);
    --cd-text-muted: var(--text-muted);
    --cd-border: var(--border);
    --cd-shadow-sm: var(--shadow-xs);
    --cd-shadow: var(--shadow-sm);
    --cd-shadow-md: var(--shadow-md);
    --cd-shadow-lg: var(--shadow-lg);
    --cd-radius: var(--radius-lg);
    --cd-radius-sm: var(--radius-md);
    --cd-radius-xs: var(--radius-sm);
    --cd-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--cd-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.consulta-control-bar[b-h7lxhippje] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    padding: 8px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 48px;
}

/* Sección izquierda: cantidad de registros */
.control-left[b-h7lxhippje] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.control-left label[b-h7lxhippje] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    white-space: nowrap;
}

[b-h7lxhippje] .control-left .rz-spinner {
    width: 75px !important;
    border-radius: var(--cd-radius-xs) !important;
}

[b-h7lxhippje] .control-left .rz-spinner input {
    height: 32px !important;
    font-size: 0.8rem !important;
}

/* Sección central: indicador de carga */
.control-center[b-h7lxhippje] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loading-indicator[b-h7lxhippje] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: cdFadeIn-b-h7lxhippje 0.3s ease;
}

.loading-spinner[b-h7lxhippje] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--cd-border);
    border-top-color: var(--cd-primary);
    border-radius: 50%;
    animation: cdSpin-b-h7lxhippje 0.8s linear infinite;
}

.loading-text[b-h7lxhippje] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--cd-primary);
    animation: cdPulse-b-h7lxhippje 1.5s ease-in-out infinite;
}

/* Sección derecha: botones de acción */
.control-right[b-h7lxhippje] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES DE ACCIÓN ===== */
.cd-btn[b-h7lxhippje] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cd-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cd-transition);
    white-space: nowrap;
    color: white;
}

.cd-btn:hover[b-h7lxhippje] {
    transform: translateY(-1px);
    box-shadow: var(--cd-shadow-md);
}

.cd-btn:active[b-h7lxhippje] {
    transform: translateY(0);
}

.cd-btn .rzi[b-h7lxhippje] {
    font-size: 1rem;
}

.btn-buscar[b-h7lxhippje] {
    background: var(--cd-orange);
}

.btn-exportar[b-h7lxhippje] {
    background: var(--cd-success);
}

/* Boton "Acciones SII": magenta dedicado para distinguirlo del indigo de "Mas opciones". */
.btn-acciones-sii[b-h7lxhippje] {
    background: #DB2777;
}

.btn-acciones-sii:hover[b-h7lxhippje] {
    background: #BE185D;
}

.btn-filtros[b-h7lxhippje] {
    background: var(--cd-info);
}

.btn-filtros.active[b-h7lxhippje] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* ===== PANEL DE FILTROS ===== */
.filtros-wrapper[b-h7lxhippje] {
    position: relative;
    flex-shrink: 0;
}

.filtros-panel[b-h7lxhippje] {
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow-md);
    overflow: hidden;
    animation: cdSlideDown-b-h7lxhippje 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.filtros-header[b-h7lxhippje] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--cd-border);
    background: linear-gradient(135deg, var(--cd-info-light) 0%, var(--cd-card) 100%);
}

.filtros-header h3[b-h7lxhippje] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--cd-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.filtros-header h3 .rzi[b-h7lxhippje] {
    color: var(--cd-info);
    font-size: 1.1rem;
}

.filtros-close-btn[b-h7lxhippje] {
    background: none;
    border: none;
    color: var(--cd-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--cd-radius-xs);
    transition: var(--cd-transition);
    display: flex;
    align-items: center;
}

.filtros-close-btn:hover[b-h7lxhippje] {
    background: var(--cd-danger-light);
    color: var(--cd-danger);
}

.filtros-body[b-h7lxhippje] {
    padding: 12px 16px;
}

.filtros-grid[b-h7lxhippje] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.filtro-field[b-h7lxhippje] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.filtro-label[b-h7lxhippje] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Inputs personalizados dentro de filtros - bordes visibles sutiles */
.filtro-field[b-h7lxhippje]  .rz-textbox,
.filtro-field[b-h7lxhippje]  .rz-spinner,
.filtro-field[b-h7lxhippje]  .rz-inputtext,
.filtro-field[b-h7lxhippje]  .rz-calendar,
.filtro-field[b-h7lxhippje]  .rz-numeric,
.filtro-field[b-h7lxhippje]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
}

.filtro-field[b-h7lxhippje]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.filtro-field[b-h7lxhippje]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.filtro-field[b-h7lxhippje]  .rz-textbox:focus,
.filtro-field[b-h7lxhippje]  .rz-state-focused,
.filtro-field[b-h7lxhippje]  input:focus,
.filtro-field[b-h7lxhippje]  .rz-calendar:focus-within,
.filtro-field[b-h7lxhippje]  .rz-numeric:focus-within {
    border-color: var(--cd-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

/* Texto del dropdown visible sin recorte */
.filtro-field[b-h7lxhippje]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== GRILLA DE DATOS ===== */
.consulta-grid-wrapper[b-h7lxhippje] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    overflow: hidden;
    min-height: 0;
}

[b-h7lxhippje] .consulta-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-h7lxhippje] .consulta-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--cd-text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

[b-h7lxhippje] .consulta-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--cd-bg) !important;
    color: var(--cd-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--cd-border) !important;
}

[b-h7lxhippje] .consulta-grid-wrapper .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
}

[b-h7lxhippje] .consulta-grid-wrapper .rz-datatable-tbody > tr:hover {
    background-color: var(--cd-primary-light) !important;
}

[b-h7lxhippje] .consulta-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* Botones de acción en la grilla */
.grid-actions[b-h7lxhippje] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.grid-action-btn[b-h7lxhippje] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--cd-radius-xs);
    cursor: pointer;
    transition: var(--cd-transition);
    padding: 0;
    color: white;
    font-size: 0.85rem;
}

.grid-action-btn:hover[b-h7lxhippje] {
    transform: scale(1.12);
    box-shadow: var(--cd-shadow-md);
}

.grid-action-btn:active[b-h7lxhippje] {
    transform: scale(0.95);
}

.grid-btn-email[b-h7lxhippje] {
    background: var(--cd-orange);
}

.grid-btn-email:hover[b-h7lxhippje] {
    background: var(--cd-orange-dark);
}

/* Variantes del boton email segun CodigoEnvio (MEDIUM 8). */
.grid-btn-email-error[b-h7lxhippje] {
    background: var(--cd-danger);
}

.grid-btn-email-error:hover[b-h7lxhippje] {
    background: #B91C1C;
}

.grid-btn-email-sincorreo[b-h7lxhippje] {
    background: var(--cd-text-muted);
}

.grid-btn-email-sincorreo:hover[b-h7lxhippje] {
    background: var(--cd-text-secondary);
}

/* Estado disabled comun a todos los grid-action-btn (MEDIUM 10). */
.grid-action-btn:disabled[b-h7lxhippje] {
    opacity: 0.45;
    cursor: not-allowed;
    filter: grayscale(0.5);
}

.grid-action-btn:disabled:hover[b-h7lxhippje] {
    transform: none;
    box-shadow: none;
}

/* Fecha futura en azul (MEDIUM 11). */
.fecha-futura[b-h7lxhippje] {
    color: var(--cd-info);
    font-weight: 600;
}

/* Emisor electronico — asterisco azul antes del RUT (MEDIUM 12). */
.emisor-electronico[b-h7lxhippje] {
    color: var(--cd-info);
    font-weight: 600;
}

/* Columna Anulado / NC aplicada (MEDIUM 16). */
.badge-anulado[b-h7lxhippje] {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    background: var(--cd-danger-light);
    color: var(--cd-danger);
    font-weight: 700;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.badge-motivo-nc[b-h7lxhippje] {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    background: var(--cd-accent-light);
    color: var(--cd-accent-dark);
    font-weight: 600;
    font-size: 0.7rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 130px;
}

/* Columna Accion SII (MEDIUM 9). */
.accion-sii-cell[b-h7lxhippje] {
    display: flex;
    align-items: center;
    gap: 6px;
    line-height: 1;
}

.accion-sii-icon[b-h7lxhippje] {
    font-family: 'Material Symbols Outlined', 'Material Symbols Rounded', 'Material Icons';
    font-size: 1rem;
    line-height: 1;
}

.sii-ico-green[b-h7lxhippje] {
    color: var(--cd-success);
}

.sii-ico-red[b-h7lxhippje] {
    color: var(--cd-danger);
}

.sii-ico-blue[b-h7lxhippje] {
    color: var(--cd-info);
}

.sii-ico-purple[b-h7lxhippje] {
    color: #A855F7;
}

.grid-btn-download[b-h7lxhippje] {
    background: var(--cd-success);
}

.grid-btn-download:hover[b-h7lxhippje] {
    background: #059669;
}

/* Previsualizar/Vista previa PDF = teal (DESIGN_SYSTEM §4.3) */
.grid-btn-preview[b-h7lxhippje] {
    background: var(--cd-preview);
}

.grid-btn-preview:hover[b-h7lxhippje] {
    background: var(--cd-preview-dark);
}

/* Botón "Más opciones" (índigo primario). Abre el menú contextual de acciones.
   Reemplaza al antiguo RadzenSplitButton. */
.grid-btn-more[b-h7lxhippje] {
    background: var(--cd-primary);
}

.grid-btn-more:hover[b-h7lxhippje] {
    background: var(--cd-primary-dark);
}

/* El modal de vista previa de PDF se unificó en el componente compartido
   Shared/PdfPreviewModal.razor (diseño único para toda la app). */

/* ===== COLUMN PICKER CUSTOM =====
   Boton "Columnas" en la barra de control superior + popup con checkboxes.
   Reemplaza al AllowColumnPicking nativo de Radzen para tener el control en la barra
   superior y no en el header de la grilla. Mismo patron que Documentos Recepcionados. */
.column-picker-wrapper[b-h7lxhippje] {
    position: relative;
    display: inline-flex;
    align-items: center;
}

/* Boton "Columnas": selector de columnas visibles — violeta (violet-600), distinto del indigo
   primario para que no se confunda con otros botones de la barra. */
.btn-columnas[b-h7lxhippje] {
    background: #7C3AED;
}

.btn-columnas:hover[b-h7lxhippje] {
    background: #6D28D9;
}

.btn-columnas.active[b-h7lxhippje] {
    background: #6D28D9;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* Backdrop transparente que captura clicks fuera del popup */
.cp-backdrop[b-h7lxhippje] {
    position: fixed;
    inset: 0;
    background: transparent;
    z-index: 99;
}

/* Popup que aparece debajo del boton Columnas */
.column-picker-popup[b-h7lxhippje] {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    z-index: 100;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow-lg);
    border: 1px solid var(--cd-border);
    min-width: 260px;
    max-height: 70vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    animation: cdSlideDown-b-h7lxhippje 0.2s ease;
}

.cp-header[b-h7lxhippje] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    border-bottom: 1px solid var(--cd-border);
    background: linear-gradient(135deg, var(--cd-primary-light) 0%, var(--cd-card) 100%);
    flex-shrink: 0;
}

.cp-title[b-h7lxhippje] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--cd-text);
}

.cp-title .rzi[b-h7lxhippje] {
    color: var(--cd-primary);
    font-size: 1.05rem;
}

.cp-close[b-h7lxhippje] {
    background: none;
    border: none;
    color: var(--cd-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--cd-radius-xs);
    display: flex;
    align-items: center;
    transition: var(--cd-transition);
}

.cp-close:hover[b-h7lxhippje] {
    background: var(--cd-danger-light);
    color: var(--cd-danger);
}

.cp-quick-actions[b-h7lxhippje] {
    display: flex;
    gap: 6px;
    padding: 8px 14px;
    border-bottom: 1px solid var(--cd-border);
    flex-shrink: 0;
}

.cp-quick-btn[b-h7lxhippje] {
    flex: 1;
    padding: 5px 8px;
    font-size: 0.72rem;
    font-weight: 700;
    border: none;
    border-radius: var(--cd-radius-xs);
    cursor: pointer;
    background: var(--cd-primary);
    color: white;
    transition: var(--cd-transition);
}

.cp-quick-btn:hover[b-h7lxhippje] {
    background: var(--cd-primary-dark);
}

.cp-quick-btn.cp-quick-btn-secondary[b-h7lxhippje] {
    background: var(--cd-text-secondary);
}

.cp-quick-btn.cp-quick-btn-secondary:hover[b-h7lxhippje] {
    background: #475569;
}

.cp-list[b-h7lxhippje] {
    overflow-y: auto;
    padding: 6px 0;
    flex: 1;
    min-height: 0;
}

.cp-item[b-h7lxhippje] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    cursor: pointer;
    font-size: 0.8rem;
    color: var(--cd-text);
    transition: background 0.12s;
    user-select: none;
}

.cp-item:hover[b-h7lxhippje] {
    background: var(--cd-primary-light);
}

.cp-item input[type="checkbox"][b-h7lxhippje] {
    accent-color: var(--cd-primary);
    cursor: pointer;
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

/* ===== AJUSTES PARA COLUMNA FROZEN =====
   La columna Acciones queda fija a la derecha con Frozen + FrozenPosition.Right, por lo que
   los botones quedan SIEMPRE visibles aunque haya scroll horizontal. Agregamos una sombra suave
   a la izquierda del frozen cell para marcar la separacion (mismo patron que Recepcionados). */
[b-h7lxhippje] .consulta-grid-wrapper .rz-frozen-cell-right {
    box-shadow: -3px 0 5px -2px rgba(0,0,0,0.08);
}

[b-h7lxhippje] .consulta-grid-wrapper .rz-frozen-cell-right.rz-data-cell {
    background: var(--cd-card) !important;
}

[b-h7lxhippje] .consulta-grid-wrapper tr:hover .rz-frozen-cell-right.rz-data-cell {
    background: var(--cd-primary-light) !important;
}

/* El estilo que evita el recorte de los botones de accion en las celdas es global
   (wwwroot/css/app.css). */

/* ===== ANIMACIONES ===== */
@keyframes cdSpin-b-h7lxhippje {
    to { transform: rotate(360deg); }
}

@keyframes cdPulse-b-h7lxhippje {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

@keyframes cdFadeIn-b-h7lxhippje {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes cdSlideDown-b-h7lxhippje {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

@keyframes cdOverlayIn-b-h7lxhippje {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes cdModalIn-b-h7lxhippje {
    from { opacity: 0; transform: scale(0.92) translateY(10px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}

/* ===== RESPONSIVE: TABLET ===== */
@media (max-width: 1024px) {
    .consulta-container[b-h7lxhippje] {
        padding: 8px 10px;
        gap: 8px;
    }

    .consulta-control-bar[b-h7lxhippje] {
        flex-wrap: wrap;
        padding: 8px 12px;
    }

    .control-center[b-h7lxhippje] {
        order: 3;
        width: 100%;
    }

    .filtros-grid[b-h7lxhippje] {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
}

/* ===== RESPONSIVE: MOBILE ===== */
@media (max-width: 640px) {
    .consulta-container[b-h7lxhippje] {
        padding: 6px 8px;
        gap: 6px;
    }

    .consulta-control-bar[b-h7lxhippje] {
        flex-direction: column;
        gap: 8px;
    }

    .control-left[b-h7lxhippje],
    .control-right[b-h7lxhippje] {
        width: 100%;
        justify-content: center;
    }

    .control-right[b-h7lxhippje] {
        flex-wrap: wrap;
    }

    .cd-btn[b-h7lxhippje] {
        flex: 1;
        justify-content: center;
        min-width: 0;
    }

    .cd-btn span:not(.material-icons):not(.rzi)[b-h7lxhippje] {
        display: none;
    }

    .filtros-grid[b-h7lxhippje] {
        grid-template-columns: 1fr;
    }
}

/* ===== BADGE DE ESTADO DTE ===== */
/* Pildora coloreada en la columna Estado (replica el estilo de mp-mov-badge
   de MovimientoProductos, pero sin icono de flecha). */
.cd-estado-badge[b-h7lxhippje] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

/* Rechazado => rojo */
.cd-estado-badge.cd-estado-rechazado[b-h7lxhippje] {
    background: #FEE2E2;
    color: #B91C1C;
}

/* Aceptado => verde */
.cd-estado-badge.cd-estado-aceptado[b-h7lxhippje] {
    background: #D1FAE5;
    color: #047857;
}

/* Aceptado con Reparo => amarillo con naranjo */
.cd-estado-badge.cd-estado-reparo[b-h7lxhippje] {
    background: #FEF3C7;
    color: #C2410C;
}

/* Cualquier otro estado => gris */
.cd-estado-badge.cd-estado-otro[b-h7lxhippje] {
    background: #E5E7EB;
    color: #4B5563;
}

/* Pendiente => gris de fondo pero texto en rojo */
.cd-estado-badge.cd-estado-pendiente[b-h7lxhippje] {
    background: #E5E7EB;
    color: #B91C1C;
}
/* /Pages/ConsultaDocumentos/DocumentosRecepcionados/Componentes/ActualizarFechaManual.razor.rz.scp.css */
/* Dialogo Actualizar Fecha Recepcion Manual */
.fecha-manual-container[b-wq7w31oqv4] {
    --fm-primary: var(--color-primary);
    --fm-text: var(--text);
    --fm-text-secondary: var(--text-secondary);
    --fm-border: var(--border);
    --fm-bg: #F8FAFC;
    --fm-danger: var(--color-danger);
    --fm-success: var(--color-success);
    --fm-radius: var(--radius-md);
    font-family: var(--font-family);
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 4px 4px 0;
}

.fecha-manual-info[b-wq7w31oqv4] {
    background: var(--fm-bg);
    border-radius: var(--fm-radius);
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.info-row[b-wq7w31oqv4] {
    display: flex;
    justify-content: space-between;
    font-size: 0.82rem;
}

.info-label[b-wq7w31oqv4] {
    color: var(--fm-text-secondary);
    font-weight: 600;
}

.info-value[b-wq7w31oqv4] {
    color: var(--fm-text);
    font-weight: 700;
}

.fecha-manual-field[b-wq7w31oqv4] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.fecha-manual-label[b-wq7w31oqv4] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--fm-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

[b-wq7w31oqv4] .fecha-manual-field .rz-calendar {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--fm-radius) !important;
    height: 36px !important;
    background: white !important;
}

.fecha-manual-actions[b-wq7w31oqv4] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 4px;
}

.fm-btn[b-wq7w31oqv4] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--fm-radius);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s;
    color: white;
}

.fm-btn:disabled[b-wq7w31oqv4] {
    opacity: 0.55;
    cursor: not-allowed;
}

.fm-btn-cancel[b-wq7w31oqv4] {
    background: var(--color-secondary);
}

.fm-btn-cancel:hover:not(:disabled)[b-wq7w31oqv4] {
    background: var(--color-secondary-dark);
}

/* Grabar = índigo (DESIGN_SYSTEM §4.3) */
.fm-btn-save[b-wq7w31oqv4] {
    background: var(--color-success);
}

.fm-btn-save:hover:not(:disabled)[b-wq7w31oqv4] {
    background: #059669;
}

.fm-btn .rzi[b-wq7w31oqv4] {
    font-size: 1rem;
}

.fm-btn .rzi.spin[b-wq7w31oqv4] {
    animation: fmSpin-b-wq7w31oqv4 0.8s linear infinite;
}

@keyframes fmSpin-b-wq7w31oqv4 {
    to { transform: rotate(360deg); }
}
/* /Pages/ConsultaDocumentos/DocumentosRecepcionados/Componentes/ActualizarInventario.razor.rz.scp.css */
/* Contenedor principal del modal */
.inv-container[b-tc266sx6qz] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 12px 4px;
    font-family: var(--font-family);
    height: 100%;
    box-sizing: border-box;
    overflow: hidden;
}

/* Header: tarjetas con datos del DTE */
.inv-header-info[b-tc266sx6qz] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 10px;
    background: #F8FAFC;
    border-radius: 8px;
    padding: 10px 14px;
    border: 1px solid #E2E8F0;
    flex-shrink: 0;
}

.info-cell[b-tc266sx6qz] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.info-label[b-tc266sx6qz] {
    font-size: 0.65rem;
    font-weight: 700;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.info-value[b-tc266sx6qz] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1E293B;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Fila de sucursal destino */
.inv-sucursal-row[b-tc266sx6qz] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    background: #EEF2FF;
    border-radius: 8px;
    border: 1px solid #C7D2FE;
    flex-shrink: 0;
}

.inv-sucursal-label[b-tc266sx6qz] {
    font-size: 0.85rem;
    font-weight: 700;
    color: #4338CA;
    white-space: nowrap;
}

.inv-sucursal-hint[b-tc266sx6qz] {
    font-size: 0.75rem;
    color: #6366F1;
    font-style: italic;
}

/* Wrapper de la tabla con scroll vertical interno */
.inv-tabla-wrapper[b-tc266sx6qz] {
    flex: 1;
    overflow: auto;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    background: white;
    min-height: 0;
}

/* Estado loading / vacio */
.inv-loading[b-tc266sx6qz],
.inv-empty[b-tc266sx6qz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 40px;
    color: var(--text-secondary);
}

.inv-empty .rzi[b-tc266sx6qz] {
    font-size: 2.5rem;
    color: #CBD5E1;
}

.inv-empty p[b-tc266sx6qz] {
    margin: 0;
    font-size: 0.85rem;
}

.inv-spinner[b-tc266sx6qz] {
    width: 24px;
    height: 24px;
    border: 3px solid #E2E8F0;
    border-top-color: #6366F1;
    border-radius: 50%;
    animation: inv-spin-b-tc266sx6qz 0.8s linear infinite;
}

@keyframes inv-spin-b-tc266sx6qz {
    to { transform: rotate(360deg); }
}

/* Tabla de items */
.inv-tabla[b-tc266sx6qz] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
}

.inv-tabla thead[b-tc266sx6qz] {
    position: sticky;
    top: 0;
    background: #F1F5F9;
    z-index: 1;
}

.inv-tabla th[b-tc266sx6qz] {
    padding: 8px 10px;
    text-align: left;
    font-weight: 700;
    color: #475569;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    border-bottom: 2px solid #E2E8F0;
}

.inv-tabla tbody tr[b-tc266sx6qz] {
    transition: background-color 0.15s;
}

.inv-tabla tbody tr:hover[b-tc266sx6qz] {
    background: #F8FAFC;
}

.inv-tabla td[b-tc266sx6qz] {
    padding: 6px 10px;
    border-bottom: 1px solid #F1F5F9;
    vertical-align: middle;
}

.inv-cell-nro[b-tc266sx6qz] {
    color: var(--text-secondary);
    font-weight: 600;
    text-align: center;
}

.inv-cell-nombre[b-tc266sx6qz] {
    color: #1E293B;
    max-width: 0; /* permite que text-overflow funcione dentro de flex */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.inv-cell-qty[b-tc266sx6qz] {
    color: var(--text-secondary);
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* Inputs editables */
.inv-input-qty[b-tc266sx6qz],
.inv-input-codigo[b-tc266sx6qz] {
    width: 100%;
    padding: 5px 8px;
    border: 1.5px solid #CBD5E1;
    border-radius: 6px;
    font-size: 0.8rem;
    font-family: inherit;
    background: white;
    transition: border-color 0.15s, box-shadow 0.15s;
    box-sizing: border-box;
}

.inv-input-qty:focus[b-tc266sx6qz],
.inv-input-codigo:focus[b-tc266sx6qz] {
    outline: none;
    border-color: #6366F1;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

.inv-input-qty[b-tc266sx6qz] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.inv-input-codigo[b-tc266sx6qz]::placeholder {
    color: #94A3B8;
    font-style: italic;
}

/* Nota informativa */
.inv-footer-note[b-tc266sx6qz] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: #FEF3C7;
    border: 1px solid #FDE68A;
    border-radius: 6px;
    font-size: 0.75rem;
    color: #92400E;
    flex-shrink: 0;
}

.inv-footer-note .rzi[b-tc266sx6qz] {
    color: #D97706;
    font-size: 1rem;
}

/* Botones del footer */
.inv-actions[b-tc266sx6qz] {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    padding-top: 4px;
    flex-shrink: 0;
}

.inv-btn[b-tc266sx6qz] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 14px;
    border: none;
    border-radius: 8px;
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s ease;
    color: white;
}

.inv-btn:hover:not(:disabled)[b-tc266sx6qz] {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12);
}

.inv-btn:disabled[b-tc266sx6qz] {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

.inv-btn-cancel[b-tc266sx6qz] {
    background: var(--color-secondary);
}

.inv-btn-cancel:hover:not(:disabled)[b-tc266sx6qz] {
    background: var(--color-secondary-dark);
}

.inv-btn-save[b-tc266sx6qz] {
    background: #10B981;
}

.inv-btn-save:hover:not(:disabled)[b-tc266sx6qz] {
    background: #059669;
}

.inv-btn .rzi.spin[b-tc266sx6qz] {
    animation: inv-spin-b-tc266sx6qz 0.8s linear infinite;
}

/* Responsive: en pantallas chicas el header se apila */
@media (max-width: 768px) {
    .inv-header-info[b-tc266sx6qz] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 480px) {
    .inv-header-info[b-tc266sx6qz] {
        grid-template-columns: 1fr;
    }
    .inv-sucursal-row[b-tc266sx6qz] {
        flex-direction: column;
        align-items: stretch;
    }
}
/* /Pages/ConsultaDocumentos/DocumentosRecepcionados/Componentes/DescargaRegistroCompras.razor.rz.scp.css */
/* Contenedor principal del modal */
.drc-container[b-67n1fe8wha] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 14px 6px;
    font-family: var(--font-family);
    box-sizing: border-box;
}

/* Header: icono + titulo + subtitulo */
.drc-header[b-67n1fe8wha] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 10px 4px 4px 4px;
    border-bottom: 1px solid #E2E8F0;
}

.drc-header-icon[b-67n1fe8wha] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 10px;
    background: linear-gradient(135deg, #6366F1, #4F46E5);
    color: white;
    flex-shrink: 0;
}

.drc-header-icon .rzi[b-67n1fe8wha] {
    font-size: 1.4rem;
}

.drc-header-text h3[b-67n1fe8wha] {
    margin: 0 0 2px 0;
    font-size: 1rem;
    color: #1E293B;
    font-weight: 700;
}

.drc-header-text p[b-67n1fe8wha] {
    margin: 0;
    font-size: 0.78rem;
    color: var(--text-secondary);
    line-height: 1.4;
}

/* Periodo: anio + mes */
.drc-periodo[b-67n1fe8wha] {
    display: flex;
    gap: 14px;
    align-items: flex-end;
    padding: 6px 4px;
}

.drc-field[b-67n1fe8wha] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.drc-field label[b-67n1fe8wha] {
    font-size: 0.7rem;
    font-weight: 700;
    color: #475569;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* Nota informativa */
.drc-info[b-67n1fe8wha] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    background: #FEF3C7;
    border: 1px solid #FDE68A;
    border-radius: 8px;
    font-size: 0.78rem;
    color: #92400E;
    line-height: 1.45;
}

.drc-info .rzi[b-67n1fe8wha] {
    color: #D97706;
    font-size: 1.1rem;
    flex-shrink: 0;
    margin-top: 1px;
}

.drc-info strong[b-67n1fe8wha] {
    color: #78350F;
}

/* Progreso */
.drc-progreso[b-67n1fe8wha] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    background: #EEF2FF;
    border: 1px solid #C7D2FE;
    border-radius: 10px;
}

.drc-spinner[b-67n1fe8wha] {
    width: 28px;
    height: 28px;
    border: 3px solid #C7D2FE;
    border-top-color: #4F46E5;
    border-radius: 50%;
    animation: drc-spin-b-67n1fe8wha 0.8s linear infinite;
    flex-shrink: 0;
}

@keyframes drc-spin-b-67n1fe8wha {
    to { transform: rotate(360deg); }
}

.drc-progreso-text[b-67n1fe8wha] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.drc-progreso-text strong[b-67n1fe8wha] {
    font-size: 0.9rem;
    color: #312E81;
}

.drc-progreso-text span[b-67n1fe8wha] {
    font-size: 0.78rem;
    color: #4F46E5;
}

/* Resultado */
.drc-resultado[b-67n1fe8wha] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px 16px;
    border-radius: 10px;
    border: 1px solid;
    font-size: 0.82rem;
}

.drc-resultado.ok[b-67n1fe8wha] {
    background: #ECFDF5;
    border-color: #6EE7B7;
    color: #065F46;
}

.drc-resultado.warn[b-67n1fe8wha] {
    background: #FFFBEB;
    border-color: #FCD34D;
    color: #78350F;
}

.drc-resultado-row[b-67n1fe8wha] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.drc-resultado-row .rzi[b-67n1fe8wha] {
    font-size: 1.1rem;
}

.drc-resultado.ok .rzi[b-67n1fe8wha] {
    color: #10B981;
}

.drc-resultado.warn .rzi[b-67n1fe8wha] {
    color: #D97706;
}

.drc-resultado-stats[b-67n1fe8wha] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    font-size: 0.8rem;
    align-items: center;
}

.drc-resultado-stats .sep[b-67n1fe8wha] {
    color: #94A3B8;
}

.drc-errores[b-67n1fe8wha] {
    margin-top: 4px;
    border-top: 1px solid currentColor;
    padding-top: 6px;
    opacity: 0.9;
}

.drc-errores summary[b-67n1fe8wha] {
    cursor: pointer;
    font-weight: 600;
    font-size: 0.78rem;
}

.drc-errores ul[b-67n1fe8wha] {
    margin: 6px 0 0 18px;
    padding: 0;
    font-size: 0.72rem;
    max-height: 140px;
    overflow-y: auto;
}

.drc-errores li[b-67n1fe8wha] {
    margin: 2px 0;
}

.drc-errores .more[b-67n1fe8wha] {
    font-style: italic;
    color: #94A3B8;
}

/* Acciones del footer */
.drc-actions[b-67n1fe8wha] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding-top: 6px;
    border-top: 1px solid #E2E8F0;
}

.drc-btn[b-67n1fe8wha] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 14px;
    border: none;
    border-radius: 8px;
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    color: white;
    transition: all 0.2s ease;
}

.drc-btn:hover:not(:disabled)[b-67n1fe8wha] {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12);
}

.drc-btn:disabled[b-67n1fe8wha] {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

.drc-btn-cancel[b-67n1fe8wha] {
    background: var(--color-secondary);
    color: #fff;
    border: none;
}

.drc-btn-cancel:hover:not(:disabled)[b-67n1fe8wha] {
    background: var(--color-secondary-dark);
}

.drc-btn-go[b-67n1fe8wha] {
    background: #6366F1;
}

.drc-btn-go:hover:not(:disabled)[b-67n1fe8wha] {
    background: #4F46E5;
}

.drc-btn .rzi.spin[b-67n1fe8wha] {
    animation: drc-spin-b-67n1fe8wha 0.8s linear infinite;
}
/* /Pages/ConsultaDocumentos/DocumentosRecepcionados/Componentes/EnviarEmailRecepcionado.razor.rz.scp.css */
/* ===== ENVIAR EMAIL RECEPCIONADO - ESTILOS ===== */
/* Clonado de EnviarEmail.razor.css (emitidos) para mantener UX visual identica. */

.email-container[b-p8cqzlqtgs] {
    --cd-primary: var(--color-primary);
    --cd-primary-light: var(--color-primary-light);
    --cd-accent: var(--color-warning);
    --cd-success: var(--color-success);
    --cd-danger: var(--color-danger);
    --cd-danger-light: var(--color-danger-light);
    --cd-orange: var(--color-accent);
    --cd-orange-dark: var(--color-accent-dark);
    --cd-bg: var(--bg);
    --cd-card: var(--surface);
    --cd-text: var(--text);
    --cd-text-secondary: var(--text-secondary);
    --cd-text-muted: var(--text-muted);
    --cd-border: var(--border);
    --cd-shadow-sm: var(--shadow-xs);
    --cd-radius: var(--radius-lg);
    --cd-radius-sm: var(--radius-md);
    --cd-radius-xs: var(--radius-sm);
    --cd-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    gap: 0;
    font-family: var(--font-family);
}

.email-doc-info[b-p8cqzlqtgs] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    padding: 12px 16px;
    background: var(--cd-bg);
    border-radius: var(--cd-radius-sm);
    margin: 0 0 12px 0;
}

.email-doc-field[b-p8cqzlqtgs] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.email-doc-label[b-p8cqzlqtgs] {
    font-size: 0.65rem;
    font-weight: 700;
    color: var(--cd-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.email-doc-value[b-p8cqzlqtgs] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--cd-text);
    background: var(--cd-card);
    padding: 6px 10px;
    border-radius: var(--cd-radius-xs);
    border: 1px solid var(--cd-border);
}

.email-field[b-p8cqzlqtgs] {
    margin-bottom: 12px;
}

.email-label[b-p8cqzlqtgs] {
    display: block;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    margin-bottom: 4px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

[b-p8cqzlqtgs] .email-field .rz-textbox {
    width: 100% !important;
    border-radius: var(--cd-radius-xs) !important;
    border: 1.5px solid var(--cd-border) !important;
    transition: var(--cd-transition);
    padding: 8px 12px !important;
}

[b-p8cqzlqtgs] .email-field .rz-textbox:focus {
    border-color: var(--cd-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.12) !important;
}

.email-attachments[b-p8cqzlqtgs] {
    display: flex;
    gap: 16px;
    margin-bottom: 12px;
    padding: 10px 14px;
    background: var(--cd-bg);
    border-radius: var(--cd-radius-sm);
}

.email-checkbox-item[b-p8cqzlqtgs] {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    transition: var(--cd-transition);
    padding: 4px 8px;
    border-radius: var(--cd-radius-xs);
}

.email-checkbox-item:hover[b-p8cqzlqtgs] {
    background: var(--cd-primary-light);
}

[b-p8cqzlqtgs] .email-checkbox-item .rz-chkbox {
    transition: var(--cd-transition);
}

.email-checkbox-label[b-p8cqzlqtgs] {
    font-size: 0.82rem;
    font-weight: 500;
    color: var(--cd-text);
    user-select: none;
}

.email-message[b-p8cqzlqtgs] {
    flex: 1;
    display: flex;
    flex-direction: column;
    margin-bottom: 12px;
    min-height: 0;
}

[b-p8cqzlqtgs] .email-message .rz-textarea {
    flex: 1;
    width: 100% !important;
    border-radius: var(--cd-radius-sm) !important;
    border: 1.5px solid var(--cd-border) !important;
    transition: var(--cd-transition);
    padding: 10px 12px !important;
    font-size: 0.82rem !important;
    resize: none;
    min-height: 180px;
}

[b-p8cqzlqtgs] .email-message .rz-textarea:focus {
    border-color: var(--cd-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.12) !important;
}

.email-footer[b-p8cqzlqtgs] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding-top: 12px;
    border-top: 1px solid var(--cd-border);
    flex-shrink: 0;
}

.email-btn[b-p8cqzlqtgs] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cd-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cd-transition);
    color: white;
}

.email-btn:hover:not([disabled])[b-p8cqzlqtgs] {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.email-btn:active:not([disabled])[b-p8cqzlqtgs] {
    transform: translateY(0);
}

.email-btn[disabled][b-p8cqzlqtgs] {
    opacity: 0.6;
    cursor: not-allowed;
}

.email-btn-send[b-p8cqzlqtgs] {
    background: var(--cd-orange);
}

.email-btn-send:hover:not([disabled])[b-p8cqzlqtgs] {
    box-shadow: var(--shadow-md);
}

/* Cancelar = gris (DESIGN_SYSTEM §4.3) */
.email-btn-cancel[b-p8cqzlqtgs] {
    background: var(--color-secondary);
}

.email-btn-cancel:hover:not([disabled])[b-p8cqzlqtgs] {
    background: var(--color-secondary-dark);
    box-shadow: var(--shadow-md);
}

@media (max-width: 640px) {
    .email-doc-info[b-p8cqzlqtgs] {
        grid-template-columns: repeat(2, 1fr);
    }

    .email-attachments[b-p8cqzlqtgs] {
        flex-direction: column;
        gap: 8px;
    }

    .email-footer[b-p8cqzlqtgs] {
        flex-direction: column;
    }

    .email-btn[b-p8cqzlqtgs] {
        justify-content: center;
    }
}

.email-btn .rzi[b-p8cqzlqtgs] {
    font-size: 1rem;
}
/* /Pages/ConsultaDocumentos/DocumentosRecepcionados/Componentes/ResumenDte.razor.rz.scp.css */
/* ===========================================================================
   Componente Resumen de DTE — Layout sin tabs
   ---------------------------------------------------------------------------
   Estructura:
   - Fila superior: 3 cards lado a lado (Emisor | Receptor | Documento)
   - Fila inferior: 2 cards lado a lado (Detalles | Referencias) ocupando el
     espacio vertical restante; cada uno con scroll interno en su grilla.
   Sin RadzenTabs: toda la informacion visible al mismo tiempo.
   El modal padre se abre con Width="min(96vw, 1500px)" desde
   DocumentosRecepcionados.OnVerResumenClick para aprovechar pantallas amplias.
   =========================================================================== */

.resumen-container[b-i0ad4n0ehz] {
    --rd-primary: var(--color-primary);
    --rd-primary-light: var(--color-primary-light);
    --rd-accent: #FF8C00;            /* naranja de marca para el TOTAL */
    --rd-accent-light: #FFF4E6;
    --rd-text: var(--text);
    --rd-text-secondary: var(--text-secondary);
    --rd-text-muted: var(--text-muted);
    --rd-border: var(--border);
    --rd-border-soft: var(--bg);
    --rd-bg: #F8FAFC;
    --rd-card: var(--surface);
    --rd-radius: 10px;
    --rd-radius-sm: var(--radius-sm);
    --rd-shadow-soft: 0 1px 2px rgba(15, 23, 42, 0.04), 0 1px 1px rgba(15, 23, 42, 0.02);
    font-family: var(--font-family);
    display: flex;
    flex-direction: column;
    gap: 12px;
    height: 100%;
    box-sizing: border-box;
    overflow: hidden;
}

/* ===== FILA SUPERIOR: 3 cards (Emisor | Receptor | Documento) ===== */
.resumen-header-row[b-i0ad4n0ehz] {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;
    flex: none;
}

.header-card[b-i0ad4n0ehz] {
    background: var(--rd-card);
    border: 1px solid var(--rd-border);
    border-radius: var(--rd-radius);
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    box-shadow: var(--rd-shadow-soft);
    min-width: 0;
}

/* Header de cada card: icono cuadrado pastel + titulo uppercase */
.card-header[b-i0ad4n0ehz] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--rd-border-soft);
}

.card-icon[b-i0ad4n0ehz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 7px;
    background: var(--rd-primary-light);
    color: var(--rd-primary);
    flex-shrink: 0;
}

.card-icon .rzi[b-i0ad4n0ehz] {
    font-size: 1.05rem;
}

.card-title[b-i0ad4n0ehz] {
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--rd-text);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Grid de label/value dentro de cada header-card */
.enc-grid[b-i0ad4n0ehz] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
    gap: 8px 14px;
}

.enc-field[b-i0ad4n0ehz] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.enc-field-wide[b-i0ad4n0ehz] {
    grid-column: span 2;
}

.enc-label[b-i0ad4n0ehz] {
    font-size: 0.62rem;
    font-weight: 600;
    color: var(--rd-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.enc-value[b-i0ad4n0ehz] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--rd-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Campo TOTAL destacado: ocupa toda la fila final del grid, fondo naranja
   claro y valor en naranja de marca con tipografia mas grande. Refuerza la
   jerarquia: el total es la informacion mas critica del card Documento. */
.enc-field-total[b-i0ad4n0ehz] {
    grid-column: 1 / -1;
    flex-direction: row;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    background: var(--rd-accent-light);
    border-radius: var(--rd-radius-sm);
    padding: 6px 10px;
    margin-top: 4px;
}

.enc-field-total .enc-label[b-i0ad4n0ehz] {
    color: var(--rd-accent);
    font-size: 0.7rem;
    font-weight: 700;
}

.enc-field-total .enc-value[b-i0ad4n0ehz] {
    color: var(--rd-accent);
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

/* ===== FILA INFERIOR: Detalles + Referencias lado a lado ===== */
.resumen-bottom-row[b-i0ad4n0ehz] {
    flex: 1;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
    gap: 12px;
}

.data-card[b-i0ad4n0ehz] {
    background: var(--rd-card);
    border: 1px solid var(--rd-border);
    border-radius: var(--rd-radius);
    box-shadow: var(--rd-shadow-soft);
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

.data-card-header[b-i0ad4n0ehz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--rd-border-soft);
    background: var(--rd-bg);
    flex: none;
}

.data-card-title[b-i0ad4n0ehz] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--rd-text);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.data-card-badge[b-i0ad4n0ehz] {
    background: var(--rd-primary);
    color: white;
    font-size: 0.68rem;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 20px;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

/* Cuerpo del card: contiene la grilla scrollable */
.data-card-body[b-i0ad4n0ehz] {
    flex: 1;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* ===== Estilos de RadzenDataGrid dentro de los data-cards ===== */
[b-i0ad4n0ehz] .data-card-body .rz-data-grid,
[b-i0ad4n0ehz] .data-card-body .rz-datatable {
    height: 100% !important;
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.78rem;
}

[b-i0ad4n0ehz] .data-card-body .rz-datatable-thead > tr > th {
    background: var(--rd-bg) !important;
    color: var(--rd-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.66rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    position: sticky;
    top: 0;
    z-index: 2;
}

[b-i0ad4n0ehz] .data-card-body .rz-datatable-tbody > tr > td {
    padding: 6px 10px !important;
    border-bottom: 1px solid var(--rd-border-soft) !important;
}

[b-i0ad4n0ehz] .data-card-body .rz-datatable-tbody > tr:hover {
    background-color: var(--rd-primary-light) !important;
}

/* ===== Estados: loading y vacio ===== */
.card-loading[b-i0ad4n0ehz],
.card-empty[b-i0ad4n0ehz] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: var(--rd-text-muted);
    font-size: 0.82rem;
    padding: 24px;
}

.card-empty .rzi[b-i0ad4n0ehz] {
    font-size: 2.4rem;
    opacity: 0.4;
}

.card-spinner[b-i0ad4n0ehz] {
    width: 22px;
    height: 22px;
    border: 2.5px solid var(--rd-border);
    border-top-color: var(--rd-primary);
    border-radius: 50%;
    animation: rdSpin-b-i0ad4n0ehz 0.8s linear infinite;
}

@keyframes rdSpin-b-i0ad4n0ehz {
    to { transform: rotate(360deg); }
}

/* ===========================================================================
   RESPONSIVE
   ---------------------------------------------------------------------------
   - >=1100px: layout completo (3-col header + 2-col bottom).
   - 700-1100px: header 2-col con Documento ocupando ancho completo abajo;
     Detalles/Referencias apilados. El contenedor permite scroll vertical de
     modal porque ya no caben con altura fija.
   - <700px: todo en una columna (mobile).
   =========================================================================== */
@media (max-width: 1100px) {
    .resumen-container[b-i0ad4n0ehz] {
        overflow-y: auto;
        height: auto;
        min-height: 100%;
    }

    .resumen-header-row[b-i0ad4n0ehz] {
        grid-template-columns: 1fr 1fr;
    }

    .resumen-header-row .documento[b-i0ad4n0ehz] {
        grid-column: 1 / -1;
    }

    .resumen-bottom-row[b-i0ad4n0ehz] {
        grid-template-columns: 1fr;
        flex: none;
    }

    .data-card[b-i0ad4n0ehz] {
        min-height: 320px;
        max-height: 60vh;
    }
}

@media (max-width: 700px) {
    .resumen-header-row[b-i0ad4n0ehz] {
        grid-template-columns: 1fr;
    }

    .resumen-header-row .documento[b-i0ad4n0ehz] {
        grid-column: auto;
    }

    .enc-field-wide[b-i0ad4n0ehz] {
        grid-column: auto;
    }

    .data-card[b-i0ad4n0ehz] {
        min-height: 280px;
        max-height: none;
    }
}
/* /Pages/ConsultaDocumentos/DocumentosRecepcionados/DocumentosRecepcionados.razor.rz.scp.css */
/* ===== DOCUMENTOS RECEPCIONADOS - DESIGN SYSTEM ===== */

/* Variables CSS del modulo */
.recep-container[b-tfzaiks6rp] {
    --cd-primary: var(--color-primary);
    --cd-primary-dark: var(--color-primary-dark);
    --cd-primary-light: var(--color-primary-light);
    --cd-accent: var(--color-warning);
    --cd-accent-dark: var(--color-warning-dark);
    --cd-accent-light: #FFFBEB;
    --cd-success: var(--color-success);
    --cd-success-light: var(--color-success-light);
    --cd-danger: var(--color-danger);
    --cd-danger-light: var(--color-danger-light);
    --cd-info: var(--color-info);
    --cd-info-light: var(--color-info-light);
    --cd-orange: var(--color-accent);
    --cd-orange-dark: var(--color-accent-dark);
    --cd-bg: var(--bg);
    --cd-card: var(--surface);
    --cd-text: var(--text);
    --cd-text-secondary: var(--text-secondary);
    --cd-text-muted: var(--text-muted);
    --cd-border: var(--border);
    --cd-shadow-sm: var(--shadow-xs);
    --cd-shadow: var(--shadow-sm);
    --cd-shadow-md: var(--shadow-md);
    --cd-shadow-lg: var(--shadow-lg);
    --cd-radius: var(--radius-lg);
    --cd-radius-sm: var(--radius-md);
    --cd-radius-xs: var(--radius-sm);
    --cd-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--cd-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.recep-control-bar[b-tfzaiks6rp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    padding: 8px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 48px;
}

/* Seccion izquierda: cantidad de registros */
.control-left[b-tfzaiks6rp] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.control-left label[b-tfzaiks6rp] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    white-space: nowrap;
}

[b-tfzaiks6rp] .control-left .rz-spinner {
    width: 75px !important;
    border-radius: var(--cd-radius-xs) !important;
}

[b-tfzaiks6rp] .control-left .rz-spinner input {
    height: 32px !important;
    font-size: 0.8rem !important;
}

/* Seccion central: indicador de carga */
.control-center[b-tfzaiks6rp] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loading-indicator[b-tfzaiks6rp] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: recepFadeIn-b-tfzaiks6rp 0.3s ease;
}

.loading-spinner[b-tfzaiks6rp] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--cd-border);
    border-top-color: var(--cd-primary);
    border-radius: 50%;
    animation: recepSpin-b-tfzaiks6rp 0.8s linear infinite;
}

.loading-text[b-tfzaiks6rp] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--cd-primary);
    animation: recepPulse-b-tfzaiks6rp 1.5s ease-in-out infinite;
}

/* Seccion derecha: botones de accion */
.control-right[b-tfzaiks6rp] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES DE ACCION ===== */
.cd-btn[b-tfzaiks6rp] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cd-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cd-transition);
    white-space: nowrap;
    color: white;
}

.cd-btn:hover[b-tfzaiks6rp] {
    transform: translateY(-1px);
    box-shadow: var(--cd-shadow-md);
}

.cd-btn:active[b-tfzaiks6rp] {
    transform: translateY(0);
}

.cd-btn .rzi[b-tfzaiks6rp] {
    font-size: 1rem;
}

.btn-buscar[b-tfzaiks6rp] {
    background: var(--cd-orange);
}

.btn-exportar[b-tfzaiks6rp] {
    background: var(--cd-success);
}

.btn-filtros[b-tfzaiks6rp] {
    background: var(--cd-info);
}

.btn-filtros.active[b-tfzaiks6rp] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* ===== ACCIONES SOBRE LA SELECCION =====
   El divider separa las acciones de busqueda del boton contextual "Acciones (N)",
   que solo aparece con filas seleccionadas. La .bulk-badge muestra el conteo de la
   seleccion actual (reutilizada por el boton contextual). */
.cd-divider[b-tfzaiks6rp] {
    width: 1px;
    height: 22px;
    background: var(--cd-border);
    margin: 0 4px;
    flex-shrink: 0;
}

/* Boton contextual "Acciones (N)": reemplaza a los 3 botones fijos (XMLs/PDFs/Validar Sel.).
   Solo se renderiza cuando hay seleccion, por eso entra con una animacion sutil. Color
   primary (indigo) como accion agrupadora; la badge reusa .bulk-badge con el conteo. */
.btn-acciones-sel[b-tfzaiks6rp] {
    background: var(--cd-primary);
    animation: recepFadeIn-b-tfzaiks6rp 0.25s ease;
}

.btn-acciones-sel:hover[b-tfzaiks6rp] {
    background: var(--cd-primary-dark);
}

/* Caret indicador de menu desplegable, mas pequeno y tenue que el icono principal. */
.btn-acciones-sel .cd-caret[b-tfzaiks6rp] {
    font-size: 0.95rem;
    margin-left: -2px;
    opacity: 0.85;
}

/* Boton "Integrar XMLs": importacion desde la cola de emails — cian (cyan-500), un tono frio
   no usado por ningun otro boton del modulo Consulta. Antes era ambar #F59E0B, demasiado parecido
   al naranja de "Buscar". Distinto del azul "Filtros" y del teal "Descargar Reg". Texto blanco. */
.btn-integrar[b-tfzaiks6rp] {
    background: #06B6D4;
}

.btn-integrar:hover[b-tfzaiks6rp] {
    background: #0891B2;
}

/* Boton "Descarga Reg. Compras": descarga desde SII/Python — teal, distinto del verde "Exportar"
   y del cyan del preview. Color plano (sin gradiente, DESIGN_SYSTEM §7). */
.btn-descargar-reg[b-tfzaiks6rp] {
    background: #0D9488;
}

.btn-descargar-reg:hover[b-tfzaiks6rp] {
    background: #0F766E;
}

.cd-btn:disabled[b-tfzaiks6rp],
.cd-btn[disabled][b-tfzaiks6rp] {
    background: var(--cd-text-muted) !important;
    cursor: not-allowed;
    opacity: 0.55;
    transform: none !important;
    box-shadow: none !important;
}

.cd-btn:disabled:hover[b-tfzaiks6rp],
.cd-btn[disabled]:hover[b-tfzaiks6rp] {
    transform: none;
    box-shadow: none;
}

.bulk-badge[b-tfzaiks6rp] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 6px;
    background: rgba(255, 255, 255, 0.25);
    color: white;
    font-size: 0.7rem;
    font-weight: 800;
    border-radius: 9px;
    margin-left: 2px;
    letter-spacing: 0.02em;
}

/* ===== PANEL DE FILTROS ===== */
.filtros-wrapper[b-tfzaiks6rp] {
    position: relative;
    flex-shrink: 0;
}

.filtros-panel[b-tfzaiks6rp] {
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow-md);
    overflow: hidden;
    animation: recepSlideDown-b-tfzaiks6rp 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.filtros-header[b-tfzaiks6rp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--cd-border);
    background: linear-gradient(135deg, var(--cd-info-light) 0%, var(--cd-card) 100%);
}

.filtros-header h3[b-tfzaiks6rp] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--cd-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.filtros-header h3 .rzi[b-tfzaiks6rp] {
    color: var(--cd-info);
    font-size: 1.1rem;
}

.filtros-close-btn[b-tfzaiks6rp] {
    background: none;
    border: none;
    color: var(--cd-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--cd-radius-xs);
    transition: var(--cd-transition);
    display: flex;
    align-items: center;
}

.filtros-close-btn:hover[b-tfzaiks6rp] {
    background: var(--cd-danger-light);
    color: var(--cd-danger);
}

.filtros-body[b-tfzaiks6rp] {
    padding: 12px 16px;
}

.filtros-grid[b-tfzaiks6rp] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.filtro-field[b-tfzaiks6rp] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.filtro-label[b-tfzaiks6rp] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Inputs personalizados dentro de filtros */
.filtro-field[b-tfzaiks6rp]  .rz-textbox,
.filtro-field[b-tfzaiks6rp]  .rz-spinner,
.filtro-field[b-tfzaiks6rp]  .rz-inputtext,
.filtro-field[b-tfzaiks6rp]  .rz-calendar,
.filtro-field[b-tfzaiks6rp]  .rz-numeric,
.filtro-field[b-tfzaiks6rp]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
}

.filtro-field[b-tfzaiks6rp]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.filtro-field[b-tfzaiks6rp]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.filtro-field[b-tfzaiks6rp]  .rz-textbox:focus,
.filtro-field[b-tfzaiks6rp]  .rz-state-focused,
.filtro-field[b-tfzaiks6rp]  input:focus,
.filtro-field[b-tfzaiks6rp]  .rz-calendar:focus-within,
.filtro-field[b-tfzaiks6rp]  .rz-numeric:focus-within {
    border-color: var(--cd-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

/* Texto del dropdown visible sin recorte */
.filtro-field[b-tfzaiks6rp]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== GRILLA DE DATOS ===== */
.recep-grid-wrapper[b-tfzaiks6rp] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    overflow: hidden;
    min-height: 0;
}

[b-tfzaiks6rp] .recep-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-tfzaiks6rp] .recep-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--cd-text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

[b-tfzaiks6rp] .recep-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--cd-bg) !important;
    color: var(--cd-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--cd-border) !important;
}

[b-tfzaiks6rp] .recep-grid-wrapper .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
}

[b-tfzaiks6rp] .recep-grid-wrapper .rz-datatable-tbody > tr:hover {
    background-color: var(--cd-primary-light) !important;
}

[b-tfzaiks6rp] .recep-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* ===== BOTONES DE ACCION EN GRILLA =====
   Mismos estilos que usa la grilla de ConsultaDocumentos (emitidos) para mantener
   consistencia visual entre ambas pantallas. */
.grid-actions[b-tfzaiks6rp] {
    display: flex;
    align-items: center;
    gap: 4px;
}

/* Separador vertical entre acciones primarias (email/pdf/xml) y el SplitButton (more_vert).
   Replica los CommandSeparator del CommandColumn del legacy. */
.grid-actions-divider[b-tfzaiks6rp] {
    display: inline-block;
    width: 1px;
    height: 18px;
    background: var(--cd-border, rgba(0, 0, 0, 0.12));
    margin: 0 2px;
    flex-shrink: 0;
}

.grid-action-btn[b-tfzaiks6rp] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--cd-radius-xs);
    cursor: pointer;
    transition: var(--cd-transition);
    padding: 0;
    color: white;
    font-size: 0.85rem;
}

.grid-action-btn:hover[b-tfzaiks6rp] {
    transform: scale(1.12);
    box-shadow: var(--cd-shadow-md);
}

.grid-action-btn:active[b-tfzaiks6rp] {
    transform: scale(0.95);
}

.grid-btn-download[b-tfzaiks6rp] {
    background: var(--cd-success);
}

.grid-btn-download:hover[b-tfzaiks6rp] {
    background: #059669;
}

/* Boton XML: usa el azul informativo para distinguirlo del verde del PDF */
.grid-btn-xml[b-tfzaiks6rp] {
    background: var(--cd-info);
}

.grid-btn-xml:hover[b-tfzaiks6rp] {
    background: #0284C7;
}

/* Estado disabled comun a todos los grid-action-btn (EASY 4: Descarga XML cuando Fcorreo=0). */
.grid-action-btn:disabled[b-tfzaiks6rp] {
    opacity: 0.45;
    cursor: not-allowed;
    filter: grayscale(0.5);
}

.grid-action-btn:disabled:hover[b-tfzaiks6rp] {
    transform: none;
    box-shadow: none;
}

/* Boton enviar correo: naranja (mismo color que el equivalente en emitidos). */
.grid-btn-email[b-tfzaiks6rp] {
    background: var(--cd-orange);
}

.grid-btn-email:hover[b-tfzaiks6rp] {
    background: var(--cd-orange-dark);
}

/* ===== COLOREADO POR ESTADO (replica los renderers del legacy) ===== */
.estado-registro[b-tfzaiks6rp]       { color: var(--cd-info);    font-weight: 600; }
.estado-pendiente[b-tfzaiks6rp]      { color: var(--cd-success); font-weight: 600; }
.estado-reclamado[b-tfzaiks6rp]      { color: var(--cd-danger);  font-weight: 600; }
.estado-no-incluido[b-tfzaiks6rp]    { color: var(--cd-orange);  font-weight: 600; }

.venc-contado[b-tfzaiks6rp]          { color: var(--cd-info);    font-weight: 600; }
.venc-otro[b-tfzaiks6rp]             { color: var(--cd-success); font-weight: 600; }

/* ===== COLUMN PICKER CUSTOM =====
   Boton "Columnas" en la barra de control superior + popup con checkboxes.
   Reemplaza al AllowColumnPicking nativo de Radzen para tener el control en la barra
   superior y no en el header de la grilla. */
.column-picker-wrapper[b-tfzaiks6rp] {
    position: relative;
    display: inline-flex;
    align-items: center;
}

/* Boton "Columnas": selector de columnas visibles — violeta (violet-600), distinto del indigo
   primario usado por "Acciones (N)" para que no se confundan en la barra. */
.btn-columnas[b-tfzaiks6rp] {
    background: #7C3AED;
}

.btn-columnas:hover[b-tfzaiks6rp] {
    background: #6D28D9;
}

.btn-columnas.active[b-tfzaiks6rp] {
    background: #6D28D9;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* Backdrop transparente que captura clicks fuera del popup */
.cp-backdrop[b-tfzaiks6rp] {
    position: fixed;
    inset: 0;
    background: transparent;
    z-index: 99;
}

/* Popup que aparece debajo del boton Columnas */
.column-picker-popup[b-tfzaiks6rp] {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    z-index: 100;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow-lg);
    border: 1px solid var(--cd-border);
    min-width: 260px;
    max-height: 70vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    animation: recepSlideDown-b-tfzaiks6rp 0.2s ease;
}

.cp-header[b-tfzaiks6rp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    border-bottom: 1px solid var(--cd-border);
    background: linear-gradient(135deg, var(--cd-primary-light) 0%, var(--cd-card) 100%);
    flex-shrink: 0;
}

.cp-title[b-tfzaiks6rp] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--cd-text);
}

.cp-title .rzi[b-tfzaiks6rp] {
    color: var(--cd-primary);
    font-size: 1.05rem;
}

.cp-close[b-tfzaiks6rp] {
    background: none;
    border: none;
    color: var(--cd-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--cd-radius-xs);
    display: flex;
    align-items: center;
    transition: var(--cd-transition);
}

.cp-close:hover[b-tfzaiks6rp] {
    background: var(--cd-danger-light);
    color: var(--cd-danger);
}

.cp-quick-actions[b-tfzaiks6rp] {
    display: flex;
    gap: 6px;
    padding: 8px 14px;
    border-bottom: 1px solid var(--cd-border);
    flex-shrink: 0;
}

.cp-quick-btn[b-tfzaiks6rp] {
    flex: 1;
    padding: 5px 8px;
    font-size: 0.72rem;
    font-weight: 700;
    border: none;
    border-radius: var(--cd-radius-xs);
    cursor: pointer;
    background: var(--cd-primary);
    color: white;
    transition: var(--cd-transition);
}

.cp-quick-btn:hover[b-tfzaiks6rp] {
    background: var(--cd-primary-dark);
}

.cp-quick-btn.cp-quick-btn-secondary[b-tfzaiks6rp] {
    background: var(--cd-text-secondary);
}

.cp-quick-btn.cp-quick-btn-secondary:hover[b-tfzaiks6rp] {
    background: #475569;
}

.cp-list[b-tfzaiks6rp] {
    overflow-y: auto;
    padding: 6px 0;
    flex: 1;
    min-height: 0;
}

.cp-item[b-tfzaiks6rp] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    cursor: pointer;
    font-size: 0.8rem;
    color: var(--cd-text);
    transition: background 0.12s;
    user-select: none;
}

.cp-item:hover[b-tfzaiks6rp] {
    background: var(--cd-primary-light);
}

.cp-item input[type="checkbox"][b-tfzaiks6rp] {
    accent-color: var(--cd-primary);
    cursor: pointer;
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

/* ===== AJUSTES PARA COLUMNA FROZEN =====
   La columna Acciones queda fija a la derecha con Frozen + FrozenPosition.Right.
   Radzen aplica position: sticky y un fondo, pero por defecto no marca visualmente
   la separacion. Agregamos una sombra suave a la izquierda del frozen cell para
   que el usuario perciba la separacion durante scroll horizontal. */
[b-tfzaiks6rp] .recep-grid-wrapper .rz-frozen-cell-right {
    box-shadow: -3px 0 5px -2px rgba(0,0,0,0.08);
}

[b-tfzaiks6rp] .recep-grid-wrapper .rz-frozen-cell-right.rz-data-cell {
    background: var(--cd-card) !important;
}

[b-tfzaiks6rp] .recep-grid-wrapper tr:hover .rz-frozen-cell-right.rz-data-cell {
    background: var(--cd-primary-light) !important;
}

/* Botón "Más opciones" (índigo primario). Abre el menú contextual de acciones.
   Reemplaza al antiguo RadzenSplitButton. */
.grid-btn-more[b-tfzaiks6rp] {
    background: var(--cd-primary);
}

.grid-btn-more:hover[b-tfzaiks6rp] {
    background: var(--cd-primary-dark);
}

/* El modal de vista previa de PDF se unificó en el componente compartido
   Shared/PdfPreviewModal.razor (diseño único para toda la app). */

/* ===== ANIMACIONES ===== */
@keyframes recepOverlayIn-b-tfzaiks6rp {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes recepModalIn-b-tfzaiks6rp {
    from { opacity: 0; transform: scale(0.92) translateY(10px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}

/* ===== ANIMACIONES PREVIAS ===== */
@keyframes recepSpin-b-tfzaiks6rp {
    to { transform: rotate(360deg); }
}

@keyframes recepPulse-b-tfzaiks6rp {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

@keyframes recepFadeIn-b-tfzaiks6rp {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes recepSlideDown-b-tfzaiks6rp {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

/* ===== RESPONSIVE: TABLET ===== */
@media (max-width: 1024px) {
    .recep-container[b-tfzaiks6rp] {
        padding: 8px 10px;
        gap: 8px;
    }

    .recep-control-bar[b-tfzaiks6rp] {
        flex-wrap: wrap;
        padding: 8px 12px;
    }

    .control-center[b-tfzaiks6rp] {
        order: 3;
        width: 100%;
    }

    .filtros-grid[b-tfzaiks6rp] {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
}

/* ===== RESPONSIVE: MOBILE ===== */
@media (max-width: 640px) {
    .recep-container[b-tfzaiks6rp] {
        padding: 6px 8px;
        gap: 6px;
    }

    .recep-control-bar[b-tfzaiks6rp] {
        flex-direction: column;
        gap: 8px;
    }

    .control-left[b-tfzaiks6rp],
    .control-right[b-tfzaiks6rp] {
        width: 100%;
        justify-content: center;
    }

    .control-right[b-tfzaiks6rp] {
        flex-wrap: wrap;
    }

    .cd-btn[b-tfzaiks6rp] {
        flex: 1;
        justify-content: center;
        min-width: 0;
    }

    .cd-btn span:not(.material-icons):not(.rzi)[b-tfzaiks6rp] {
        display: none;
    }

    .filtros-grid[b-tfzaiks6rp] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/ConsultaDocumentos/VentasDiariasDetalladas/VentasDiariasDetalladasIndex.razor.rz.scp.css */
/* ===== VENTAS DIARIAS DETALLADAS - DESIGN SYSTEM (mismo estilo que Consulta Documentos) ===== */

/* Variables CSS del módulo */
.consulta-container[b-geksd4nnb3] {
    --cd-primary: var(--color-primary);
    --cd-primary-dark: var(--color-primary-dark);
    --cd-primary-light: var(--color-primary-light);
    --cd-accent: var(--color-warning);
    --cd-accent-dark: var(--color-warning-dark);
    --cd-accent-light: #FFFBEB;
    --cd-success: var(--color-success);
    --cd-success-light: var(--color-success-light);
    --cd-danger: var(--color-danger);
    --cd-danger-light: var(--color-danger-light);
    --cd-info: var(--color-info);
    --cd-info-light: var(--color-info-light);
    --cd-orange: var(--color-accent);
    --cd-orange-dark: var(--color-accent-dark);
    --cd-bg: var(--bg);
    --cd-card: var(--surface);
    --cd-text: var(--text);
    --cd-text-secondary: var(--text-secondary);
    --cd-text-muted: var(--text-muted);
    --cd-border: var(--border);
    --cd-shadow-sm: var(--shadow-xs);
    --cd-shadow: var(--shadow-sm);
    --cd-shadow-md: var(--shadow-md);
    --cd-shadow-lg: var(--shadow-lg);
    --cd-radius: var(--radius-lg);
    --cd-radius-sm: var(--radius-md);
    --cd-radius-xs: var(--radius-sm);
    --cd-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--cd-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.consulta-control-bar[b-geksd4nnb3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    padding: 8px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 48px;
}

/* Sección izquierda: cantidad de registros */
.control-left[b-geksd4nnb3] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.control-left label[b-geksd4nnb3] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    white-space: nowrap;
}

[b-geksd4nnb3] .control-left .rz-spinner {
    width: 75px !important;
    border-radius: var(--cd-radius-xs) !important;
}

[b-geksd4nnb3] .control-left .rz-spinner input {
    height: 32px !important;
    font-size: 0.8rem !important;
}

/* Sección central: indicador de carga */
.control-center[b-geksd4nnb3] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loading-indicator[b-geksd4nnb3] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: cdFadeIn-b-geksd4nnb3 0.3s ease;
}

.loading-spinner[b-geksd4nnb3] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--cd-border);
    border-top-color: var(--cd-primary);
    border-radius: 50%;
    animation: cdSpin-b-geksd4nnb3 0.8s linear infinite;
}

.loading-text[b-geksd4nnb3] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--cd-primary);
    animation: cdPulse-b-geksd4nnb3 1.5s ease-in-out infinite;
}

/* Sección derecha: botones de acción */
.control-right[b-geksd4nnb3] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES DE ACCIÓN ===== */
.cd-btn[b-geksd4nnb3] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cd-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cd-transition);
    white-space: nowrap;
    color: white;
}

.cd-btn:hover[b-geksd4nnb3] {
    transform: translateY(-1px);
    box-shadow: var(--cd-shadow-md);
}

.cd-btn:active[b-geksd4nnb3] {
    transform: translateY(0);
}

.cd-btn .rzi[b-geksd4nnb3] {
    font-size: 1rem;
}

.btn-buscar[b-geksd4nnb3] {
    background: var(--cd-orange);
}

.btn-exportar[b-geksd4nnb3] {
    background: var(--cd-success);
}

.btn-filtros[b-geksd4nnb3] {
    background: var(--cd-info);
}

.btn-filtros.active[b-geksd4nnb3] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* ===== PANEL DE FILTROS ===== */
.filtros-wrapper[b-geksd4nnb3] {
    position: relative;
    flex-shrink: 0;
}

.filtros-panel[b-geksd4nnb3] {
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow-md);
    overflow: hidden;
    animation: cdSlideDown-b-geksd4nnb3 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.filtros-header[b-geksd4nnb3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--cd-border);
    background: linear-gradient(135deg, var(--cd-info-light) 0%, var(--cd-card) 100%);
}

.filtros-header h3[b-geksd4nnb3] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--cd-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.filtros-header h3 .rzi[b-geksd4nnb3] {
    color: var(--cd-info);
    font-size: 1.1rem;
}

.filtros-close-btn[b-geksd4nnb3] {
    background: none;
    border: none;
    color: var(--cd-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--cd-radius-xs);
    transition: var(--cd-transition);
    display: flex;
    align-items: center;
}

.filtros-close-btn:hover[b-geksd4nnb3] {
    background: var(--cd-danger-light);
    color: var(--cd-danger);
}

.filtros-body[b-geksd4nnb3] {
    padding: 12px 16px;
}

.filtros-grid[b-geksd4nnb3] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.filtro-field[b-geksd4nnb3] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.filtro-label[b-geksd4nnb3] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Inputs personalizados dentro de filtros - bordes visibles sutiles */
.filtro-field[b-geksd4nnb3]  .rz-textbox,
.filtro-field[b-geksd4nnb3]  .rz-spinner,
.filtro-field[b-geksd4nnb3]  .rz-inputtext,
.filtro-field[b-geksd4nnb3]  .rz-calendar,
.filtro-field[b-geksd4nnb3]  .rz-numeric,
.filtro-field[b-geksd4nnb3]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
}

.filtro-field[b-geksd4nnb3]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.filtro-field[b-geksd4nnb3]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.filtro-field[b-geksd4nnb3]  .rz-textbox:focus,
.filtro-field[b-geksd4nnb3]  .rz-state-focused,
.filtro-field[b-geksd4nnb3]  input:focus,
.filtro-field[b-geksd4nnb3]  .rz-calendar:focus-within,
.filtro-field[b-geksd4nnb3]  .rz-numeric:focus-within {
    border-color: var(--cd-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

/* Texto del dropdown visible sin recorte */
.filtro-field[b-geksd4nnb3]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== GRILLA DE DATOS ===== */
.consulta-grid-wrapper[b-geksd4nnb3] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    overflow: hidden;
    min-height: 0;
}

[b-geksd4nnb3] .consulta-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-geksd4nnb3] .consulta-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

[b-geksd4nnb3] .consulta-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--cd-bg) !important;
    color: var(--cd-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--cd-border) !important;
}

[b-geksd4nnb3] .consulta-grid-wrapper .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
}

[b-geksd4nnb3] .consulta-grid-wrapper .rz-datatable-tbody > tr:hover {
    background-color: var(--cd-primary-light) !important;
}

[b-geksd4nnb3] .consulta-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* ===== SUBGRILLA (ÍTEMS DEL DOCUMENTO) - MAESTRO / DETALLE ===== */

/* Ocultar el botón de expandir/colapsar: las subgrillas van siempre desplegadas */
[b-geksd4nnb3] .consulta-grid-wrapper .rz-row-toggler {
    display: none !important;
    pointer-events: none;
}

/* Contenedor de la subgrilla, anidado e indentado bajo la fila del documento.
   El margen inferior abre un "respiro" entre documentos: junto con el tinte de la
   cabecera (fila maestra) deja claro dónde termina un DTE y empieza el siguiente. */
.subgrid-wrapper[b-geksd4nnb3] {
    padding: 8px 12px 14px 28px;
    margin-bottom: 22px;
    /* Cuerpo del documento con tinte índigo muy claro (indigo-50): tiñe todo el bloque
       y lo separa con claridad de los espacios en blanco entre documentos. La cabecera
       (fila maestra) usa un índigo un poco más saturado (#E0E7FF), creando jerarquía. */
    background: var(--color-primary-light);
    /* Espina índigo continua: enlaza visualmente con la barra izquierda de la fila
       maestra para que encabezado + detalle se lean como un solo documento. */
    border-left: 4px solid var(--cd-primary);
    /* "Cierre" del documento: borde inferior índigo marcado (3px) + esquinas redondeadas
       + sombra suave. Deja claro dónde termina un documento y empieza el siguiente. */
    border-bottom: 3px solid var(--cd-primary);
    border-bottom-left-radius: var(--cd-radius-sm);
    border-bottom-right-radius: var(--cd-radius-sm);
    box-shadow: var(--cd-shadow);
}

/* La subgrilla en sí: más sobria y compacta que la grilla principal */
[b-geksd4nnb3] .subgrid .rz-datatable {
    border: 1px solid var(--cd-border) !important;
    border-radius: var(--cd-radius-xs) !important;
    background: var(--cd-card);
    font-size: 0.75rem;
}

[b-geksd4nnb3] .subgrid .rz-datatable-thead > tr > th {
    background: #F8FAFC !important;
    color: var(--cd-text-muted) !important;
    /* Sin negrita: los encabezados de ítems (Familia/Código/Artículo/Cantidad/Precio/Total)
       no deben competir con los datos principales del documento (fila maestra). */
    font-weight: normal !important;
    font-size: 0.65rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
    padding: 5px 8px !important;
    border-bottom: 1px solid var(--cd-border) !important;
}

/* Quitar la negrita a los encabezados de la subgrilla (Familia/Código/Artículo/Cantidad/
   Precio/Total). En Radzen 6.6.4 el texto del título se renderiza en `.rz-column-title`
   dentro de `.rz-grid-table thead th`, con `font-weight: var(--rz-grid-header-font-weight)`
   (negrita del tema). El selector legacy `.rz-datatable-thead > tr > th` NO coincide en esta
   versión, por eso hay que apuntar a `.rz-grid-table thead th .rz-column-title`. */
[b-geksd4nnb3] .subgrid .rz-grid-table thead th .rz-column-title,
[b-geksd4nnb3] .subgrid .rz-grid-table thead th .rz-column-title-content {
    font-weight: normal !important;
}

[b-geksd4nnb3] .subgrid .rz-datatable-tbody > tr > td {
    padding: 4px 8px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.74rem;
}

[b-geksd4nnb3] .subgrid .rz-datatable-tbody > tr:hover {
    background-color: var(--cd-accent-light) !important;
}

/* ===== SEPARACIÓN VISUAL POR DOCUMENTO (tipo tarjeta) =====
   Cada documento = fila maestra (encabezado: Tipo DTE, Folio, Fecha, Sucursal, Medio de Pago,
   RUT, Razón Social) + fila de detalle (la subgrilla de ítems).

   La "banda índigo" de la cabecera y el énfasis del texto se aplican por CÓDIGO, en el <tr>,
   vía el evento RowRender (OnDocumentoRowRender en el .razor). Motivo: esta grilla NO es
   seleccionable, por lo que Radzen no agrega clases estables a las filas y los selectores CSS
   sobre `tbody > tr` no enganchan de forma fiable. El estilo inline en el <tr> sí se aplica
   siempre.

   Aquí en el CSS queda lo que SÍ es de la página (elementos scopeados directos): la espina
   lateral de la subgrilla y el respiro entre bloques (ver .subgrid-wrapper arriba), que cierran
   visualmente cada documento. */

/* Quita el padding superior de la celda de detalle para que la subgrilla quede pegada a su
   cabecera (el ítem y su documento se leen como una sola unidad). */
[b-geksd4nnb3] .consulta-grid-wrapper .rz-datatable-tbody > tr.rz-expanded-row-content > td {
    padding-top: 0 !important;
}

/* ===== ANIMACIONES ===== */
@keyframes cdSpin-b-geksd4nnb3 {
    to { transform: rotate(360deg); }
}

@keyframes cdPulse-b-geksd4nnb3 {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

@keyframes cdFadeIn-b-geksd4nnb3 {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes cdSlideDown-b-geksd4nnb3 {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

/* ===== RESPONSIVE: TABLET ===== */
@media (max-width: 1024px) {
    .consulta-container[b-geksd4nnb3] {
        padding: 8px 10px;
        gap: 8px;
    }

    .consulta-control-bar[b-geksd4nnb3] {
        flex-wrap: wrap;
        padding: 8px 12px;
    }

    .control-center[b-geksd4nnb3] {
        order: 3;
        width: 100%;
    }

    .filtros-grid[b-geksd4nnb3] {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
}

/* ===== RESPONSIVE: MOBILE ===== */
@media (max-width: 640px) {
    .consulta-container[b-geksd4nnb3] {
        padding: 6px 8px;
        gap: 6px;
    }

    .consulta-control-bar[b-geksd4nnb3] {
        flex-direction: column;
        gap: 8px;
    }

    .control-left[b-geksd4nnb3],
    .control-right[b-geksd4nnb3] {
        width: 100%;
        justify-content: center;
    }

    .control-right[b-geksd4nnb3] {
        flex-wrap: wrap;
    }

    .cd-btn[b-geksd4nnb3] {
        flex: 1;
        justify-content: center;
        min-width: 0;
    }

    .cd-btn span:not(.material-icons):not(.rzi)[b-geksd4nnb3] {
        display: none;
    }

    .filtros-grid[b-geksd4nnb3] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Contabilidad/DocumentosxCobrar/Componentes/CobrarModal.razor.rz.scp.css */
/* ===== MODAL REGISTRAR PAGO (COBRANZA) ===== */
.cobrar-modal[b-4caxvh2ubv] {
    --pm-primary: var(--color-primary);
    --pm-purple: #8B5CF6;
    --pm-purple-dark: #7C3AED;
    --pm-success: var(--color-success);
    --pm-success-dark: var(--color-success-dark);
    --pm-danger: var(--color-danger);
    --pm-text: var(--text);
    --pm-text-secondary: var(--text-secondary);
    --pm-border: var(--border);
    --pm-radius-xs: var(--radius-sm);
    --pm-radius-sm: var(--radius-md);
    --pm-transition: var(--transition);

    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 4px 2px;
    font-family: var(--font-family);
}

.cobrar-grid[b-4caxvh2ubv] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px 16px;
}

.cobrar-field[b-4caxvh2ubv] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.cobrar-field-full[b-4caxvh2ubv] {
    grid-column: 1 / -1;
}

.cobrar-label[b-4caxvh2ubv] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--pm-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Inputs Radzen unificados */
.cobrar-field[b-4caxvh2ubv]  .rz-textbox,
.cobrar-field[b-4caxvh2ubv]  .rz-spinner,
.cobrar-field[b-4caxvh2ubv]  .rz-inputtext,
.cobrar-field[b-4caxvh2ubv]  .rz-calendar,
.cobrar-field[b-4caxvh2ubv]  .rz-numeric,
.cobrar-field[b-4caxvh2ubv]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--pm-radius-xs) !important;
    font-size: 0.78rem !important;
    height: 30px !important;
    transition: var(--pm-transition);
    background: white !important;
}

.cobrar-field[b-4caxvh2ubv]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--pm-radius-xs) !important;
    font-size: 0.78rem !important;
    height: 30px !important;
    background: white !important;
    box-sizing: border-box !important;
}

.cobrar-field[b-4caxvh2ubv]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.cobrar-field[b-4caxvh2ubv]  .rz-textbox:focus,
.cobrar-field[b-4caxvh2ubv]  .rz-state-focused,
.cobrar-field[b-4caxvh2ubv]  input:focus,
.cobrar-field[b-4caxvh2ubv]  .rz-calendar:focus-within,
.cobrar-field[b-4caxvh2ubv]  .rz-numeric:focus-within {
    border-color: var(--pm-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

.cobrar-field[b-4caxvh2ubv]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.85rem !important;
    display: flex !important;
    align-items: center !important;
}

/* ===== ACCIONES ===== */
.cobrar-actions[b-4caxvh2ubv] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding-top: 10px;
    border-top: 1px solid var(--pm-border);
}

.cobrar-btn[b-4caxvh2ubv] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--pm-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--pm-transition);
    white-space: nowrap;
    color: white;
}

.cobrar-btn:hover:not(:disabled)[b-4caxvh2ubv] {
    transform: translateY(-1px);
    box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1);
}

.cobrar-btn:disabled[b-4caxvh2ubv] {
    opacity: 0.6;
    cursor: not-allowed;
}

.cobrar-btn .rzi[b-4caxvh2ubv] {
    font-size: 1rem;
}

.cobrar-btn-cancel[b-4caxvh2ubv] {
    background: var(--color-secondary);
}

.cobrar-btn-cancel:hover:not(:disabled)[b-4caxvh2ubv] {
    background: var(--color-secondary-dark);
}

.cobrar-btn-grabar[b-4caxvh2ubv] {
    background: var(--pm-success);
}

.cobrar-btn-grabar:hover:not(:disabled)[b-4caxvh2ubv] {
    background: var(--pm-success-dark);
}

/* ===== RESPONSIVE ===== */
@media (max-width: 540px) {
    .cobrar-grid[b-4caxvh2ubv] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Contabilidad/DocumentosxCobrar/DocumentosxCobrar.razor.rz.scp.css */
/* ===== DOCUMENTOS POR COBRAR - DESIGN SYSTEM ===== */

/* Variables CSS del módulo */
.consulta-container[b-yf6w4wfcgt] {
    --cd-primary: var(--color-primary);
    --cd-primary-dark: var(--color-primary-dark);
    --cd-primary-light: var(--color-primary-light);
    --cd-accent: var(--color-warning);
    --cd-accent-dark: var(--color-warning-dark);
    --cd-accent-light: #FFFBEB;
    --cd-success: var(--color-success);
    --cd-success-light: var(--color-success-light);
    --cd-danger: var(--color-danger);
    --cd-danger-light: var(--color-danger-light);
    --cd-info: var(--color-info);
    --cd-info-light: var(--color-info-light);
    --cd-orange: var(--color-accent);
    --cd-orange-dark: var(--color-accent-dark);
    --cd-purple: #8B5CF6;
    --cd-purple-dark: #7C3AED;
    --cd-bg: var(--bg);
    --cd-card: var(--surface);
    --cd-text: var(--text);
    --cd-text-secondary: var(--text-secondary);
    --cd-text-muted: var(--text-muted);
    --cd-border: var(--border);
    --cd-shadow-sm: var(--shadow-xs);
    --cd-shadow: var(--shadow-sm);
    --cd-shadow-md: var(--shadow-md);
    --cd-shadow-lg: var(--shadow-lg);
    --cd-radius: var(--radius-lg);
    --cd-radius-sm: var(--radius-md);
    --cd-radius-xs: var(--radius-sm);
    --cd-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--cd-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.consulta-control-bar[b-yf6w4wfcgt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    padding: 8px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 48px;
}

.control-left[b-yf6w4wfcgt] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.control-left label[b-yf6w4wfcgt] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    white-space: nowrap;
}

[b-yf6w4wfcgt] .control-left .rz-spinner {
    width: 75px !important;
    border-radius: var(--cd-radius-xs) !important;
}

[b-yf6w4wfcgt] .control-left .rz-spinner input {
    height: 32px !important;
    font-size: 0.8rem !important;
}

.control-center[b-yf6w4wfcgt] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loading-indicator[b-yf6w4wfcgt] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: cdFadeIn-b-yf6w4wfcgt 0.3s ease;
}

.loading-spinner[b-yf6w4wfcgt] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--cd-border);
    border-top-color: var(--cd-primary);
    border-radius: 50%;
    animation: cdSpin-b-yf6w4wfcgt 0.8s linear infinite;
}

.loading-text[b-yf6w4wfcgt] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--cd-primary);
    animation: cdPulse-b-yf6w4wfcgt 1.5s ease-in-out infinite;
}

.control-right[b-yf6w4wfcgt] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES DE ACCIÓN ===== */
.cd-btn[b-yf6w4wfcgt] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cd-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cd-transition);
    white-space: nowrap;
    color: white;
}

.cd-btn:hover[b-yf6w4wfcgt] {
    transform: translateY(-1px);
    box-shadow: var(--cd-shadow-md);
}

.cd-btn:active[b-yf6w4wfcgt] {
    transform: translateY(0);
}

.cd-btn .rzi[b-yf6w4wfcgt] {
    font-size: 1rem;
}

.btn-buscar[b-yf6w4wfcgt] {
    background: var(--cd-orange);
}

.btn-exportar[b-yf6w4wfcgt] {
    background: var(--cd-success);
}

.btn-pagar[b-yf6w4wfcgt] {
    background: var(--cd-purple);
}

.btn-pagar:hover[b-yf6w4wfcgt] {
    background: var(--cd-purple-dark);
}

.btn-filtros[b-yf6w4wfcgt] {
    background: var(--cd-info);
}

.btn-filtros.active[b-yf6w4wfcgt] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* ===== PANEL DE FILTROS ===== */
.filtros-wrapper[b-yf6w4wfcgt] {
    position: relative;
    flex-shrink: 0;
}

.filtros-panel[b-yf6w4wfcgt] {
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow-md);
    overflow: hidden;
    animation: cdSlideDown-b-yf6w4wfcgt 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.filtros-header[b-yf6w4wfcgt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--cd-border);
    background: linear-gradient(135deg, var(--cd-info-light) 0%, var(--cd-card) 100%);
}

.filtros-header h3[b-yf6w4wfcgt] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--cd-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.filtros-header h3 .rzi[b-yf6w4wfcgt] {
    color: var(--cd-info);
    font-size: 1.1rem;
}

.filtros-close-btn[b-yf6w4wfcgt] {
    background: none;
    border: none;
    color: var(--cd-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--cd-radius-xs);
    transition: var(--cd-transition);
    display: flex;
    align-items: center;
}

.filtros-close-btn:hover[b-yf6w4wfcgt] {
    background: var(--cd-danger-light);
    color: var(--cd-danger);
}

.filtros-body[b-yf6w4wfcgt] {
    padding: 12px 16px;
}

.filtros-grid[b-yf6w4wfcgt] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.filtro-field[b-yf6w4wfcgt] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.filtro-label[b-yf6w4wfcgt] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.filtro-field[b-yf6w4wfcgt]  .rz-textbox,
.filtro-field[b-yf6w4wfcgt]  .rz-spinner,
.filtro-field[b-yf6w4wfcgt]  .rz-inputtext,
.filtro-field[b-yf6w4wfcgt]  .rz-calendar,
.filtro-field[b-yf6w4wfcgt]  .rz-numeric,
.filtro-field[b-yf6w4wfcgt]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
}

.filtro-field[b-yf6w4wfcgt]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.filtro-field[b-yf6w4wfcgt]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.filtro-field[b-yf6w4wfcgt]  .rz-textbox:focus,
.filtro-field[b-yf6w4wfcgt]  .rz-state-focused,
.filtro-field[b-yf6w4wfcgt]  input:focus,
.filtro-field[b-yf6w4wfcgt]  .rz-calendar:focus-within,
.filtro-field[b-yf6w4wfcgt]  .rz-numeric:focus-within {
    border-color: var(--cd-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

.filtro-field[b-yf6w4wfcgt]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== GRILLA DE DATOS ===== */
.consulta-grid-wrapper[b-yf6w4wfcgt] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    overflow: hidden;
    min-height: 0;
}

[b-yf6w4wfcgt] .consulta-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-yf6w4wfcgt] .consulta-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

[b-yf6w4wfcgt] .consulta-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--cd-bg) !important;
    color: var(--cd-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--cd-border) !important;
}

[b-yf6w4wfcgt] .consulta-grid-wrapper .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
}

[b-yf6w4wfcgt] .consulta-grid-wrapper .rz-datatable-tbody > tr:hover {
    background-color: var(--cd-primary-light) !important;
}

[b-yf6w4wfcgt] .consulta-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* Botones de acción en la grilla */
.grid-actions[b-yf6w4wfcgt] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.grid-action-btn[b-yf6w4wfcgt] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--cd-radius-xs);
    cursor: pointer;
    transition: var(--cd-transition);
    padding: 0;
    color: white;
    font-size: 0.85rem;
}

.grid-action-btn:hover[b-yf6w4wfcgt] {
    transform: scale(1.12);
    box-shadow: var(--cd-shadow-md);
}

.grid-action-btn:active[b-yf6w4wfcgt] {
    transform: scale(0.95);
}

.grid-btn-pagar[b-yf6w4wfcgt] {
    background: var(--cd-purple);
}

.grid-btn-pagar:hover[b-yf6w4wfcgt] {
    background: var(--cd-purple-dark);
}

/* ===== DETALLE DE PAGOS (FILA EXPANDIBLE / TIMELINE) ===== */
.pagos-detalle[b-yf6w4wfcgt] {
    padding: 12px 16px 14px 44px;
    background: var(--cd-bg);
    border-left: 3px solid var(--cd-purple);
    animation: cdFadeIn-b-yf6w4wfcgt 0.25s ease;
}

.pagos-titulo[b-yf6w4wfcgt] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--cd-text-secondary);
    margin-bottom: 10px;
}

.pagos-titulo .rzi[b-yf6w4wfcgt] {
    font-size: 0.95rem;
    color: var(--cd-purple);
}

.pagos-timeline[b-yf6w4wfcgt] {
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
}

/* Línea vertical que conecta los puntos del timeline */
.pagos-timeline[b-yf6w4wfcgt]::before {
    content: "";
    position: absolute;
    left: 5px;
    top: 6px;
    bottom: 6px;
    width: 2px;
    background: var(--cd-border);
}

.pago-item[b-yf6w4wfcgt] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 5px 0 5px 22px;
    font-size: 0.78rem;
    color: var(--cd-text);
}

.pago-dot[b-yf6w4wfcgt] {
    position: absolute;
    left: 0;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--cd-card);
    border: 3px solid var(--cd-purple);
    box-sizing: border-box;
}

.pago-fecha[b-yf6w4wfcgt] {
    min-width: 86px;
    color: var(--cd-text-secondary);
    font-variant-numeric: tabular-nums;
}

.pago-monto[b-yf6w4wfcgt] {
    min-width: 96px;
    font-weight: 700;
    color: var(--cd-text);
    font-variant-numeric: tabular-nums;
}

.pago-medio[b-yf6w4wfcgt] {
    color: var(--cd-text-secondary);
}

.pagos-total[b-yf6w4wfcgt] {
    margin-top: 10px;
    padding-top: 8px;
    border-top: 1px dashed var(--cd-border);
    font-size: 0.78rem;
    color: var(--cd-text-secondary);
}

.pagos-total strong[b-yf6w4wfcgt] {
    color: var(--cd-purple-dark);
    font-weight: 700;
}

.pagos-estado[b-yf6w4wfcgt] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.78rem;
    color: var(--cd-text-secondary);
    padding: 4px 0;
}

.pagos-vacio .rzi[b-yf6w4wfcgt] {
    color: var(--cd-info);
}

.pagos-spin[b-yf6w4wfcgt] {
    color: var(--cd-purple);
    animation: cdSpin-b-yf6w4wfcgt 0.8s linear infinite;
}

/* ===== ANIMACIONES ===== */
@keyframes cdSpin-b-yf6w4wfcgt {
    to { transform: rotate(360deg); }
}

@keyframes cdPulse-b-yf6w4wfcgt {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

@keyframes cdFadeIn-b-yf6w4wfcgt {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes cdSlideDown-b-yf6w4wfcgt {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

/* ===== RESPONSIVE: TABLET ===== */
@media (max-width: 1024px) {
    .consulta-container[b-yf6w4wfcgt] {
        padding: 8px 10px;
        gap: 8px;
    }

    .consulta-control-bar[b-yf6w4wfcgt] {
        flex-wrap: wrap;
        padding: 8px 12px;
    }

    .control-center[b-yf6w4wfcgt] {
        order: 3;
        width: 100%;
    }

    .filtros-grid[b-yf6w4wfcgt] {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
}

/* ===== RESPONSIVE: MOBILE ===== */
@media (max-width: 640px) {
    .consulta-container[b-yf6w4wfcgt] {
        padding: 6px 8px;
        gap: 6px;
    }

    .consulta-control-bar[b-yf6w4wfcgt] {
        flex-direction: column;
        gap: 8px;
    }

    .control-left[b-yf6w4wfcgt],
    .control-right[b-yf6w4wfcgt] {
        width: 100%;
        justify-content: center;
    }

    .control-right[b-yf6w4wfcgt] {
        flex-wrap: wrap;
    }

    .cd-btn[b-yf6w4wfcgt] {
        flex: 1;
        justify-content: center;
        min-width: 0;
    }

    .cd-btn span:not(.material-icons):not(.rzi)[b-yf6w4wfcgt] {
        display: none;
    }

    .filtros-grid[b-yf6w4wfcgt] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Contabilidad/DocumentosxPagar/Componentes/PagarModal.razor.rz.scp.css */
/* ===== MODAL REGISTRAR PAGO ===== */
.pagar-modal[b-za7v0bov48] {
    --pm-primary: var(--color-primary);
    --pm-purple: #8B5CF6;
    --pm-purple-dark: #7C3AED;
    --pm-success: var(--color-success);
    --pm-success-dark: var(--color-success-dark);
    --pm-danger: var(--color-danger);
    --pm-text: var(--text);
    --pm-text-secondary: var(--text-secondary);
    --pm-border: var(--border);
    --pm-radius-xs: var(--radius-sm);
    --pm-radius-sm: var(--radius-md);
    --pm-transition: var(--transition);

    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 4px 2px;
    font-family: var(--font-family);
}

.pagar-grid[b-za7v0bov48] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px 16px;
}

.pagar-field[b-za7v0bov48] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.pagar-field-full[b-za7v0bov48] {
    grid-column: 1 / -1;
}

.pagar-label[b-za7v0bov48] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--pm-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Inputs Radzen unificados */
.pagar-field[b-za7v0bov48]  .rz-textbox,
.pagar-field[b-za7v0bov48]  .rz-spinner,
.pagar-field[b-za7v0bov48]  .rz-inputtext,
.pagar-field[b-za7v0bov48]  .rz-calendar,
.pagar-field[b-za7v0bov48]  .rz-numeric,
.pagar-field[b-za7v0bov48]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--pm-radius-xs) !important;
    font-size: 0.78rem !important;
    height: 30px !important;
    transition: var(--pm-transition);
    background: white !important;
}

.pagar-field[b-za7v0bov48]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--pm-radius-xs) !important;
    font-size: 0.78rem !important;
    height: 30px !important;
    background: white !important;
    box-sizing: border-box !important;
}

.pagar-field[b-za7v0bov48]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.pagar-field[b-za7v0bov48]  .rz-textbox:focus,
.pagar-field[b-za7v0bov48]  .rz-state-focused,
.pagar-field[b-za7v0bov48]  input:focus,
.pagar-field[b-za7v0bov48]  .rz-calendar:focus-within,
.pagar-field[b-za7v0bov48]  .rz-numeric:focus-within {
    border-color: var(--pm-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

.pagar-field[b-za7v0bov48]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.85rem !important;
    display: flex !important;
    align-items: center !important;
}

/* ===== ACCIONES ===== */
.pagar-actions[b-za7v0bov48] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding-top: 10px;
    border-top: 1px solid var(--pm-border);
}

.pagar-btn[b-za7v0bov48] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--pm-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--pm-transition);
    white-space: nowrap;
    color: white;
}

.pagar-btn:hover:not(:disabled)[b-za7v0bov48] {
    transform: translateY(-1px);
    box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1);
}

.pagar-btn:disabled[b-za7v0bov48] {
    opacity: 0.6;
    cursor: not-allowed;
}

.pagar-btn .rzi[b-za7v0bov48] {
    font-size: 1rem;
}

.pagar-btn-cancel[b-za7v0bov48] {
    background: var(--color-secondary);
}

.pagar-btn-cancel:hover:not(:disabled)[b-za7v0bov48] {
    background: var(--color-secondary-dark);
}

.pagar-btn-grabar[b-za7v0bov48] {
    background: var(--pm-success);
}

.pagar-btn-grabar:hover:not(:disabled)[b-za7v0bov48] {
    background: var(--pm-success-dark);
}

/* ===== RESPONSIVE ===== */
@media (max-width: 540px) {
    .pagar-grid[b-za7v0bov48] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Contabilidad/DocumentosxPagar/DocumentosxPagar.razor.rz.scp.css */
/* ===== DOCUMENTOS POR PAGAR - DESIGN SYSTEM ===== */

/* Variables CSS del módulo */
.consulta-container[b-zwignnqapl] {
    --cd-primary: var(--color-primary);
    --cd-primary-dark: var(--color-primary-dark);
    --cd-primary-light: var(--color-primary-light);
    --cd-accent: var(--color-warning);
    --cd-accent-dark: var(--color-warning-dark);
    --cd-accent-light: #FFFBEB;
    --cd-success: var(--color-success);
    --cd-success-light: var(--color-success-light);
    --cd-danger: var(--color-danger);
    --cd-danger-light: var(--color-danger-light);
    --cd-info: var(--color-info);
    --cd-info-light: var(--color-info-light);
    --cd-orange: var(--color-accent);
    --cd-orange-dark: var(--color-accent-dark);
    --cd-purple: #8B5CF6;
    --cd-purple-dark: #7C3AED;
    --cd-bg: var(--bg);
    --cd-card: var(--surface);
    --cd-text: var(--text);
    --cd-text-secondary: var(--text-secondary);
    --cd-text-muted: var(--text-muted);
    --cd-border: var(--border);
    --cd-shadow-sm: var(--shadow-xs);
    --cd-shadow: var(--shadow-sm);
    --cd-shadow-md: var(--shadow-md);
    --cd-shadow-lg: var(--shadow-lg);
    --cd-radius: var(--radius-lg);
    --cd-radius-sm: var(--radius-md);
    --cd-radius-xs: var(--radius-sm);
    --cd-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--cd-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.consulta-control-bar[b-zwignnqapl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    padding: 8px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 48px;
}

.control-left[b-zwignnqapl] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.control-left label[b-zwignnqapl] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    white-space: nowrap;
}

[b-zwignnqapl] .control-left .rz-spinner {
    width: 75px !important;
    border-radius: var(--cd-radius-xs) !important;
}

[b-zwignnqapl] .control-left .rz-spinner input {
    height: 32px !important;
    font-size: 0.8rem !important;
}

.control-center[b-zwignnqapl] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loading-indicator[b-zwignnqapl] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: cdFadeIn-b-zwignnqapl 0.3s ease;
}

.loading-spinner[b-zwignnqapl] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--cd-border);
    border-top-color: var(--cd-primary);
    border-radius: 50%;
    animation: cdSpin-b-zwignnqapl 0.8s linear infinite;
}

.loading-text[b-zwignnqapl] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--cd-primary);
    animation: cdPulse-b-zwignnqapl 1.5s ease-in-out infinite;
}

.control-right[b-zwignnqapl] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES DE ACCIÓN ===== */
.cd-btn[b-zwignnqapl] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cd-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cd-transition);
    white-space: nowrap;
    color: white;
}

.cd-btn:hover[b-zwignnqapl] {
    transform: translateY(-1px);
    box-shadow: var(--cd-shadow-md);
}

.cd-btn:active[b-zwignnqapl] {
    transform: translateY(0);
}

.cd-btn .rzi[b-zwignnqapl] {
    font-size: 1rem;
}

.btn-buscar[b-zwignnqapl] {
    background: var(--cd-orange);
}

.btn-exportar[b-zwignnqapl] {
    background: var(--cd-success);
}

.btn-pagar[b-zwignnqapl] {
    background: var(--cd-purple);
}

.btn-pagar:hover[b-zwignnqapl] {
    background: var(--cd-purple-dark);
}

.btn-filtros[b-zwignnqapl] {
    background: var(--cd-info);
}

.btn-filtros.active[b-zwignnqapl] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* ===== PANEL DE FILTROS ===== */
.filtros-wrapper[b-zwignnqapl] {
    position: relative;
    flex-shrink: 0;
}

.filtros-panel[b-zwignnqapl] {
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow-md);
    overflow: hidden;
    animation: cdSlideDown-b-zwignnqapl 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.filtros-header[b-zwignnqapl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--cd-border);
    background: linear-gradient(135deg, var(--cd-info-light) 0%, var(--cd-card) 100%);
}

.filtros-header h3[b-zwignnqapl] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--cd-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.filtros-header h3 .rzi[b-zwignnqapl] {
    color: var(--cd-info);
    font-size: 1.1rem;
}

.filtros-close-btn[b-zwignnqapl] {
    background: none;
    border: none;
    color: var(--cd-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--cd-radius-xs);
    transition: var(--cd-transition);
    display: flex;
    align-items: center;
}

.filtros-close-btn:hover[b-zwignnqapl] {
    background: var(--cd-danger-light);
    color: var(--cd-danger);
}

.filtros-body[b-zwignnqapl] {
    padding: 12px 16px;
}

.filtros-grid[b-zwignnqapl] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.filtro-field[b-zwignnqapl] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.filtro-label[b-zwignnqapl] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.filtro-field[b-zwignnqapl]  .rz-textbox,
.filtro-field[b-zwignnqapl]  .rz-spinner,
.filtro-field[b-zwignnqapl]  .rz-inputtext,
.filtro-field[b-zwignnqapl]  .rz-calendar,
.filtro-field[b-zwignnqapl]  .rz-numeric,
.filtro-field[b-zwignnqapl]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
}

.filtro-field[b-zwignnqapl]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.filtro-field[b-zwignnqapl]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.filtro-field[b-zwignnqapl]  .rz-textbox:focus,
.filtro-field[b-zwignnqapl]  .rz-state-focused,
.filtro-field[b-zwignnqapl]  input:focus,
.filtro-field[b-zwignnqapl]  .rz-calendar:focus-within,
.filtro-field[b-zwignnqapl]  .rz-numeric:focus-within {
    border-color: var(--cd-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

.filtro-field[b-zwignnqapl]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== GRILLA DE DATOS ===== */
.consulta-grid-wrapper[b-zwignnqapl] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    overflow: hidden;
    min-height: 0;
}

[b-zwignnqapl] .consulta-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-zwignnqapl] .consulta-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

[b-zwignnqapl] .consulta-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--cd-bg) !important;
    color: var(--cd-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--cd-border) !important;
}

[b-zwignnqapl] .consulta-grid-wrapper .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
}

[b-zwignnqapl] .consulta-grid-wrapper .rz-datatable-tbody > tr:hover {
    background-color: var(--cd-primary-light) !important;
}

[b-zwignnqapl] .consulta-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* Botones de acción en la grilla */
.grid-actions[b-zwignnqapl] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.grid-action-btn[b-zwignnqapl] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--cd-radius-xs);
    cursor: pointer;
    transition: var(--cd-transition);
    padding: 0;
    color: white;
    font-size: 0.85rem;
}

.grid-action-btn:hover[b-zwignnqapl] {
    transform: scale(1.12);
    box-shadow: var(--cd-shadow-md);
}

.grid-action-btn:active[b-zwignnqapl] {
    transform: scale(0.95);
}

.grid-btn-pagar[b-zwignnqapl] {
    background: var(--cd-purple);
}

.grid-btn-pagar:hover[b-zwignnqapl] {
    background: var(--cd-purple-dark);
}

/* ===== DETALLE DE PAGOS (FILA EXPANDIBLE / TIMELINE) ===== */
.pagos-detalle[b-zwignnqapl] {
    padding: 12px 16px 14px 44px;
    background: var(--cd-bg);
    border-left: 3px solid var(--cd-purple);
    animation: cdFadeIn-b-zwignnqapl 0.25s ease;
}

.pagos-titulo[b-zwignnqapl] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--cd-text-secondary);
    margin-bottom: 10px;
}

.pagos-titulo .rzi[b-zwignnqapl] {
    font-size: 0.95rem;
    color: var(--cd-purple);
}

.pagos-timeline[b-zwignnqapl] {
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
}

/* Línea vertical que conecta los puntos del timeline */
.pagos-timeline[b-zwignnqapl]::before {
    content: "";
    position: absolute;
    left: 5px;
    top: 6px;
    bottom: 6px;
    width: 2px;
    background: var(--cd-border);
}

.pago-item[b-zwignnqapl] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 5px 0 5px 22px;
    font-size: 0.78rem;
    color: var(--cd-text);
}

.pago-dot[b-zwignnqapl] {
    position: absolute;
    left: 0;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--cd-card);
    border: 3px solid var(--cd-purple);
    box-sizing: border-box;
}

.pago-fecha[b-zwignnqapl] {
    min-width: 86px;
    color: var(--cd-text-secondary);
    font-variant-numeric: tabular-nums;
}

.pago-monto[b-zwignnqapl] {
    min-width: 96px;
    font-weight: 700;
    color: var(--cd-text);
    font-variant-numeric: tabular-nums;
}

.pago-medio[b-zwignnqapl] {
    color: var(--cd-text-secondary);
}

.pagos-total[b-zwignnqapl] {
    margin-top: 10px;
    padding-top: 8px;
    border-top: 1px dashed var(--cd-border);
    font-size: 0.78rem;
    color: var(--cd-text-secondary);
}

.pagos-total strong[b-zwignnqapl] {
    color: var(--cd-purple-dark);
    font-weight: 700;
}

.pagos-estado[b-zwignnqapl] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.78rem;
    color: var(--cd-text-secondary);
    padding: 4px 0;
}

.pagos-vacio .rzi[b-zwignnqapl] {
    color: var(--cd-info);
}

.pagos-spin[b-zwignnqapl] {
    color: var(--cd-purple);
    animation: cdSpin-b-zwignnqapl 0.8s linear infinite;
}

/* ===== ANIMACIONES ===== */
@keyframes cdSpin-b-zwignnqapl {
    to { transform: rotate(360deg); }
}

@keyframes cdPulse-b-zwignnqapl {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

@keyframes cdFadeIn-b-zwignnqapl {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes cdSlideDown-b-zwignnqapl {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

/* ===== RESPONSIVE: TABLET ===== */
@media (max-width: 1024px) {
    .consulta-container[b-zwignnqapl] {
        padding: 8px 10px;
        gap: 8px;
    }

    .consulta-control-bar[b-zwignnqapl] {
        flex-wrap: wrap;
        padding: 8px 12px;
    }

    .control-center[b-zwignnqapl] {
        order: 3;
        width: 100%;
    }

    .filtros-grid[b-zwignnqapl] {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
}

/* ===== RESPONSIVE: MOBILE ===== */
@media (max-width: 640px) {
    .consulta-container[b-zwignnqapl] {
        padding: 6px 8px;
        gap: 6px;
    }

    .consulta-control-bar[b-zwignnqapl] {
        flex-direction: column;
        gap: 8px;
    }

    .control-left[b-zwignnqapl],
    .control-right[b-zwignnqapl] {
        width: 100%;
        justify-content: center;
    }

    .control-right[b-zwignnqapl] {
        flex-wrap: wrap;
    }

    .cd-btn[b-zwignnqapl] {
        flex: 1;
        justify-content: center;
        min-width: 0;
    }

    .cd-btn span:not(.material-icons):not(.rzi)[b-zwignnqapl] {
        display: none;
    }

    .filtros-grid[b-zwignnqapl] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Index.razor.rz.scp.css */
/* ===== DASHBOARD - SISTEMA DE DISEÑO ===== */

/* Variables CSS del dashboard */
.dashboard[b-uo8f1pm374] {
    --dash-primary: var(--color-primary);
    --dash-primary-dark: var(--color-primary-dark);
    --dash-primary-light: var(--color-primary-light);
    --dash-success: var(--color-success);
    --dash-success-light: var(--color-success-light);
    --dash-warning: var(--color-warning);
    --dash-warning-light: var(--color-warning-light);
    --dash-danger: var(--color-danger);
    --dash-danger-light: var(--color-danger-light);
    --dash-info: var(--color-info);
    --dash-info-light: var(--color-info-light);
    --dash-bg: var(--bg);
    --dash-card: var(--surface);
    --dash-text: var(--text);
    --dash-text-secondary: var(--text-secondary);
    --dash-text-muted: var(--text-muted);
    --dash-border: var(--border);
    --dash-radius: var(--radius-lg);
    --dash-radius-sm: var(--radius-md);
    --dash-shadow: var(--shadow-sm);
    --dash-shadow-md: var(--shadow-md);
    --dash-transition: var(--transition);
    /* Alias para compatibilidad con métodos del @code */
    --danger-color: var(--color-danger);
    --success-color: var(--color-success);

    height: 100%;
    display: grid;
    grid-template-rows: auto 1fr;
    gap: 8px;
    padding: 8px 16px;
    background: var(--dash-bg);
    overflow: hidden;
    box-sizing: border-box;
    font-family: var(--font-family);
}

/* ===== FILA DE MÉTRICAS ===== */
.dash-metrics-row[b-uo8f1pm374] {
    display: grid;
    grid-template-columns: repeat(4, 1fr) auto;
    gap: 8px;
    animation: dashFadeIn-b-uo8f1pm374 0.4s ease;
}

/* --- Tarjeta de métrica individual --- */
.dash-metric[b-uo8f1pm374] {
    background: var(--dash-card);
    border-radius: var(--dash-radius-sm);
    box-shadow: var(--dash-shadow);
    overflow: hidden;
    transition: var(--dash-transition);
    position: relative;
}

.dash-metric:hover[b-uo8f1pm374] {
    transform: translateY(-2px);
    box-shadow: var(--dash-shadow-md);
}

.dash-metric--clickable[b-uo8f1pm374] {
    cursor: pointer;
    user-select: none;
}

.dash-metric--clickable:hover[b-uo8f1pm374] {
    transform: translateY(-3px);
    box-shadow: var(--dash-shadow-md);
}

.dash-metric--clickable:active[b-uo8f1pm374] {
    transform: translateY(-1px);
}

/* Acento superior coloreado según estado */
.dash-metric-accent[b-uo8f1pm374] {
    height: 3px;
    background: var(--dash-text-muted);
    transition: var(--dash-transition);
}

.dash-metric--success .dash-metric-accent[b-uo8f1pm374] { background: var(--dash-success); }
.dash-metric--warning .dash-metric-accent[b-uo8f1pm374] { background: var(--dash-warning); }
.dash-metric--danger .dash-metric-accent[b-uo8f1pm374] { background: var(--dash-danger); }

.dash-metric-body[b-uo8f1pm374] {
    padding: 8px 12px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.dash-metric-icon-wrap[b-uo8f1pm374] {
    width: 32px;
    height: 32px;
    border-radius: var(--dash-radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: var(--dash-transition);
}

/* Colores del icono según estado */
.dash-metric--success .dash-metric-icon-wrap[b-uo8f1pm374] {
    background: var(--dash-success-light);
    color: var(--dash-success);
}
.dash-metric--warning .dash-metric-icon-wrap[b-uo8f1pm374] {
    background: var(--dash-warning-light);
    color: var(--dash-warning);
}
.dash-metric--danger .dash-metric-icon-wrap[b-uo8f1pm374] {
    background: var(--dash-danger-light);
    color: var(--dash-danger);
}

.dash-metric-info[b-uo8f1pm374] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.dash-metric-value[b-uo8f1pm374] {
    font-size: 1.2rem;
    font-weight: 800;
    color: var(--dash-text);
    line-height: 1.1;
    letter-spacing: -0.02em;
}

.dash-metric-label[b-uo8f1pm374] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--dash-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dash-metric-status[b-uo8f1pm374] {
    font-size: 0.65rem;
    font-weight: 700;
    padding: 3px 8px;
    border-radius: 12px;
    white-space: nowrap;
    flex-shrink: 0;
}

.dash-metric--success .dash-metric-status[b-uo8f1pm374] {
    background: var(--dash-success-light);
    color: var(--dash-success);
}
.dash-metric--warning .dash-metric-status[b-uo8f1pm374] {
    background: var(--dash-warning-light);
    color: var(--dash-warning);
}
.dash-metric--danger .dash-metric-status[b-uo8f1pm374] {
    background: var(--dash-danger-light);
    color: var(--dash-danger);
}

/* --- Tarjeta de certificado --- */
.dash-cert[b-uo8f1pm374] {
    background: var(--dash-card);
    border-radius: var(--dash-radius-sm);
    box-shadow: var(--dash-shadow);
    padding: 8px 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    transition: var(--dash-transition);
    min-width: 140px;
}

.dash-cert--clickable[b-uo8f1pm374] {
    cursor: pointer;
}

.dash-cert:hover[b-uo8f1pm374] {
    transform: translateY(-2px);
    box-shadow: var(--dash-shadow-md);
}

/* ===== MODAL DETALLE DEL CERTIFICADO ===== */
.cert-modal[b-uo8f1pm374] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.cert-modal-hero[b-uo8f1pm374] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border-radius: var(--radius-md);
    background: linear-gradient(135deg, var(--color-success-light), var(--color-info-light));
}

.cert-modal-hero-icon[b-uo8f1pm374] {
    width: 44px;
    height: 44px;
    border-radius: var(--radius-md);
    background: linear-gradient(135deg, var(--color-success), var(--color-info));
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.cert-modal-hero-icon .rzi[b-uo8f1pm374] {
    font-size: 1.4rem;
}

.cert-modal-hero-text[b-uo8f1pm374] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.cert-modal-owner[b-uo8f1pm374] {
    font-size: var(--text-md);
    font-weight: var(--fw-bold);
    color: var(--text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cert-modal-rut[b-uo8f1pm374] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    font-weight: var(--fw-medium);
}

.cert-modal-estado[b-uo8f1pm374] {
    flex-shrink: 0;
    font-size: var(--text-xs);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 4px 10px;
    border-radius: var(--radius-full);
}

.cert-estado-vigente[b-uo8f1pm374] {
    color: var(--color-success-dark);
    background: var(--color-success-light);
}

.cert-estado-expirado[b-uo8f1pm374] {
    color: var(--color-danger-dark);
    background: var(--color-danger-light);
}

.cert-estado-otro[b-uo8f1pm374] {
    color: var(--color-warning-dark);
    background: var(--color-warning-light);
}

.cert-modal-grid[b-uo8f1pm374] {
    margin: 0;
    display: flex;
    flex-direction: column;
}

.cert-modal-row[b-uo8f1pm374] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 2px;
    border-bottom: 1px solid var(--border);
}

.cert-modal-row:last-child[b-uo8f1pm374] {
    border-bottom: none;
}

.cert-modal-row dt[b-uo8f1pm374] {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: var(--text-sm);
    color: var(--text-secondary);
    font-weight: var(--fw-medium);
    flex-shrink: 0;
}

.cert-modal-row dt .rzi[b-uo8f1pm374] {
    font-size: 1rem;
    color: var(--color-primary);
}

.cert-modal-row dd[b-uo8f1pm374] {
    margin: 0;
    font-size: var(--text-sm);
    color: var(--text);
    font-weight: var(--fw-semibold);
    text-align: right;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cert-modal-emisor[b-uo8f1pm374],
.cert-modal-serie[b-uo8f1pm374] {
    font-weight: var(--fw-medium);
    color: var(--text-secondary);
}

.cert-modal-serie[b-uo8f1pm374] {
    font-family: monospace;
    font-size: var(--text-xs);
}

.dash-cert-top[b-uo8f1pm374] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.dash-cert-icon[b-uo8f1pm374] {
    width: 28px;
    height: 28px;
    border-radius: var(--dash-radius-sm);
    background: linear-gradient(135deg, var(--dash-success), var(--dash-info));
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.dash-cert-info[b-uo8f1pm374] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.dash-cert-title[b-uo8f1pm374] {
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--dash-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.dash-cert-badge[b-uo8f1pm374] {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--dash-success);
}

.dash-cert-dates[b-uo8f1pm374] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.dash-cert-date[b-uo8f1pm374] {
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--dash-text-secondary);
    background: var(--dash-bg);
    padding: 2px 6px;
    border-radius: 5px;
}

/* ===== CONTENIDO PRINCIPAL ===== */
.dash-main[b-uo8f1pm374] {
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: 8px;
    min-height: 0;
    overflow: hidden;
}

/* --- Panel genérico (tarjeta contenedora) --- */
.dash-panel[b-uo8f1pm374] {
    background: var(--dash-card);
    border-radius: var(--dash-radius);
    box-shadow: var(--dash-shadow);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0;
    animation: dashSlideUp-b-uo8f1pm374 0.5s ease;
}

/* --- Encabezado del panel --- */
.dash-panel-header[b-uo8f1pm374] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 14px;
    border-bottom: 1px solid var(--dash-border);
    flex-shrink: 0;
}

.dash-panel-header-text[b-uo8f1pm374] {
    display: flex;
    flex-direction: column;
}

.dash-panel-title[b-uo8f1pm374] {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--dash-text);
}

.dash-panel-subtitle[b-uo8f1pm374] {
    font-size: 0.75rem;
    color: var(--dash-text-secondary);
}

/* --- Navegación de pestañas del panel de gráficos --- */
.dash-panel-nav[b-uo8f1pm374] {
    display: flex;
    gap: 4px;
    padding: 6px 14px;
    border-bottom: 1px solid var(--dash-border);
    flex-shrink: 0;
    background: var(--dash-card);
}

.dash-nav-btn[b-uo8f1pm374] {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    border: none;
    background: transparent;
    color: var(--dash-text-secondary);
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: var(--dash-radius-sm);
    cursor: pointer;
    transition: var(--dash-transition);
    white-space: nowrap;
}

.dash-nav-btn:hover[b-uo8f1pm374] {
    background: var(--dash-primary-light);
    color: var(--dash-primary);
}

.dash-nav-btn.active[b-uo8f1pm374] {
    background: var(--dash-primary);
    color: white;
}

/* Variantes coloreadas para tabs del timeline: el active state usa el color del tipo */
.dash-nav-btn--success.active[b-uo8f1pm374] {
    background: var(--dash-success);
}

.dash-nav-btn--warning.active[b-uo8f1pm374] {
    background: var(--dash-warning);
}

.dash-nav-btn--danger.active[b-uo8f1pm374] {
    background: var(--dash-danger);
}

/* Contador a la derecha del label del tab */
.dash-nav-btn-count[b-uo8f1pm374] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 9px;
    background: rgba(0, 0, 0, 0.08);
    color: inherit;
    font-size: 0.65rem;
    font-weight: 700;
    line-height: 1;
}

.dash-nav-btn.active .dash-nav-btn-count[b-uo8f1pm374] {
    background: rgba(255, 255, 255, 0.25);
    color: white;
}

/* --- Cuerpo del panel de gráficos --- */
.dash-panel-body[b-uo8f1pm374] {
    flex: 1;
    overflow: hidden;
    min-height: 0;
    position: relative;
}

.dash-chart-pane[b-uo8f1pm374] {
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 8px 14px;
}

/* Para la pestaña de vencimiento, permitir scroll interno */
.dash-chart-pane--list[b-uo8f1pm374] {
    overflow-y: auto;
}

.dash-chart-header[b-uo8f1pm374] {
    display: flex;
    flex-direction: column;
    margin-bottom: 4px;
    flex-shrink: 0;
}

.dash-chart-title[b-uo8f1pm374] {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--dash-text);
}

.dash-chart-subtitle[b-uo8f1pm374] {
    font-size: 0.7rem;
    color: var(--dash-text-secondary);
}

.dash-chart-area[b-uo8f1pm374] {
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

/* ===== TOP VENTAS (lista con barras) ===== */
.dash-topventas[b-uo8f1pm374] {
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 4px 2px;
    overflow: hidden;
    box-sizing: border-box;
}

.dash-topventa-item[b-uo8f1pm374] {
    flex: 1 1 0;
    min-height: 48px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
}

.dash-topventa-head[b-uo8f1pm374] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.dash-topventa-rank[b-uo8f1pm374] {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}

.dash-topventa-name[b-uo8f1pm374] {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--dash-text);
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.dash-topventa-value[b-uo8f1pm374] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--dash-text);
    flex-shrink: 0;
    font-variant-numeric: tabular-nums;
}

.dash-topventa-bar-track[b-uo8f1pm374] {
    height: 10px;
    background: var(--dash-border);
    border-radius: 6px;
    overflow: hidden;
    position: relative;
}

.dash-topventa-bar-fill[b-uo8f1pm374] {
    height: 100%;
    border-radius: 6px;
    transform-origin: left center;
    animation: dashBarGrow-b-uo8f1pm374 0.9s cubic-bezier(0.22, 1, 0.36, 1);
    box-shadow: inset 0 -2px 4px rgba(0,0,0,0.08);
}

@keyframes dashBarGrow-b-uo8f1pm374 {
    from { transform: scaleX(0); }
    to   { transform: scaleX(1); }
}

/* ===== FOLIOS DISPONIBLES (donut + leyenda) ===== */
.dash-folios-donut-wrap[b-uo8f1pm374] {
    height: 100%;
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
    gap: 18px;
    align-items: center;
    box-sizing: border-box;
    padding: 4px 2px;
    overflow: hidden;
}

.dash-folios-donut[b-uo8f1pm374] {
    position: relative;
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 0;
}

.dash-folios-svg[b-uo8f1pm374] {
    height: 100%;
    width: 100%;
    max-height: 100%;
    max-width: 100%;
    display: block;
    animation: dashDonutFade-b-uo8f1pm374 0.7s ease-out;
}

.dash-folios-slice[b-uo8f1pm374] {
    transition: stroke-width 0.25s ease, filter 0.25s ease;
    cursor: pointer;
}

.dash-folios-slice:hover[b-uo8f1pm374] {
    filter: brightness(1.05) drop-shadow(0 2px 4px rgba(0,0,0,0.15));
}

.dash-folios-legend[b-uo8f1pm374] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-height: 0;
    max-height: 100%;
    overflow-y: auto;
    padding-right: 4px;
}

.dash-folios-legend-item[b-uo8f1pm374] {
    display: grid;
    grid-template-columns: 12px minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    border-radius: 6px;
    transition: background 0.2s ease;
    font-size: 0.8rem;
}

.dash-folios-legend-item:hover[b-uo8f1pm374] {
    background: var(--dash-bg);
}

.dash-folios-legend-item.is-empty[b-uo8f1pm374] {
    opacity: 0.45;
}

.dash-folios-dot[b-uo8f1pm374] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
    box-shadow: 0 1px 2px rgba(0,0,0,0.15);
}

.dash-folios-legend-name[b-uo8f1pm374] {
    color: var(--dash-text);
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.dash-folios-legend-value[b-uo8f1pm374] {
    color: var(--dash-text);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    justify-self: end;
}

.dash-folios-legend-pct[b-uo8f1pm374] {
    color: var(--dash-text-secondary);
    font-size: 0.72rem;
    font-variant-numeric: tabular-nums;
    min-width: 42px;
    text-align: right;
}

@keyframes dashDonutFade-b-uo8f1pm374 {
    from { opacity: 0; transform: scale(0.85) rotate(-8deg); }
    to   { opacity: 1; transform: scale(1) rotate(0); }
}

@media (max-width: 700px) {
    .dash-folios-donut-wrap[b-uo8f1pm374] {
        grid-template-columns: 1fr;
        grid-template-rows: minmax(0, 1fr) auto;
    }
    .dash-folios-legend[b-uo8f1pm374] {
        max-height: 45%;
    }
}

/* ===== VENCIMIENTO DE FOLIOS (lista) ===== */
.dash-vencimiento-list[b-uo8f1pm374] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1;
    overflow-y: auto;
}

.dash-vencimiento-item[b-uo8f1pm374] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    background: var(--dash-bg);
    border-radius: var(--dash-radius-sm);
    border-left: 4px solid var(--dash-success);
    transition: var(--dash-transition);
}

.dash-vencimiento-item:hover[b-uo8f1pm374] {
    transform: translateX(3px);
}

.dash-vencimiento--danger[b-uo8f1pm374] {
    border-left-color: var(--dash-danger);
}

.dash-vencimiento--ok[b-uo8f1pm374] {
    border-left-color: var(--dash-success);
}

.dash-vencimiento-info[b-uo8f1pm374] {
    display: flex;
    flex-direction: column;
}

.dash-vencimiento-name[b-uo8f1pm374] {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--dash-text);
}

.dash-vencimiento-tipo[b-uo8f1pm374] {
    font-size: 0.75rem;
    color: var(--dash-text-secondary);
    margin-top: 2px;
}

.dash-vencimiento-badge[b-uo8f1pm374] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* ===== BADGES (compartidos con métodos @code) ===== */
.dash-badge[b-uo8f1pm374] {
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    white-space: nowrap;
}

.badge-success[b-uo8f1pm374] { background: rgba(16, 185, 129, 0.15); color: var(--dash-success); }
.badge-warning[b-uo8f1pm374] { background: rgba(245, 158, 11, 0.15); color: var(--dash-warning); }
.badge-danger[b-uo8f1pm374] { background: rgba(239, 68, 68, 0.15); color: var(--dash-danger); }
.badge-info[b-uo8f1pm374] { background: rgba(59, 130, 246, 0.15); color: var(--dash-info); }

/* ===== TIMELINE ===== */
.dash-timeline-panel[b-uo8f1pm374] {
    min-height: 0;
}

.dash-timeline-body[b-uo8f1pm374] {
    flex: 1;
    overflow-y: auto;
    padding: 6px 12px;
    min-height: 0;
}

.timeline-event[b-uo8f1pm374] {
    padding: 7px 10px;
    border-radius: var(--dash-radius-sm);
    margin-bottom: 5px;
    border-left: 3px solid transparent;
    cursor: pointer;
    transition: var(--dash-transition);
}

.timeline-event:hover[b-uo8f1pm374] {
    background: rgba(99, 102, 241, 0.05);
    transform: translateX(3px);
}

.timeline-event-warning[b-uo8f1pm374] { border-left-color: var(--dash-warning); }
.timeline-event-success[b-uo8f1pm374] { border-left-color: var(--dash-success); }
.timeline-event-danger[b-uo8f1pm374]  { border-left-color: var(--dash-danger); }

.timeline-event-top[b-uo8f1pm374] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 4px;
    gap: 8px;
}

.timeline-event-title[b-uo8f1pm374] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--dash-text);
}

.timeline-event-desc[b-uo8f1pm374] {
    font-size: 0.78rem;
    color: var(--dash-text-secondary);
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.timeline-event-time[b-uo8f1pm374] {
    display: flex;
    align-items: center;
    margin-top: 4px;
    font-size: 0.7rem;
    color: var(--dash-text-secondary);
}

.dash-empty-state[b-uo8f1pm374] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    color: var(--dash-text-muted);
    font-size: 0.85rem;
    height: 100%;
}

/* ===== MODAL ===== */
.dash-modal-overlay[b-uo8f1pm374] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1100;
    animation: dashOverlayIn-b-uo8f1pm374 0.2s ease;
    padding: 1rem;
}

.dash-modal-card[b-uo8f1pm374] {
    background: #FFFFFF;
    border-radius: 12px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(0, 0, 0, 0.05);
    width: 100%;
    max-width: 520px;
    max-height: 80vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    animation: dashModalIn-b-uo8f1pm374 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.dash-modal-header[b-uo8f1pm374] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    background: linear-gradient(135deg, #6366F1, #4F46E5);
    color: white;
}

.dash-modal-header h3[b-uo8f1pm374] {
    font-size: 0.95rem;
    font-weight: 700;
    margin: 0;
    color: white;
}

/* Botón cerrar del modal (X) */
.dash-modal-close[b-uo8f1pm374] {
    background: rgba(255, 255, 255, 0.25);
    border: none;
    color: white;
    cursor: pointer;
    padding: 6px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    transition: all 0.2s ease;
}

.dash-modal-close:hover[b-uo8f1pm374] {
    background: rgba(255, 255, 255, 0.45);
    transform: scale(1.05);
}

.dash-modal-body[b-uo8f1pm374] {
    padding: 20px;
    flex: 1;
    overflow-y: auto;
    font-size: 0.85rem;
    color: #1E293B;
    background: #FFFFFF;
    line-height: 1.6;
}

.dash-modal-footer[b-uo8f1pm374] {
    padding: 14px 20px;
    border-top: 1px solid #E2E8F0;
    display: flex;
    justify-content: flex-end;
    background: #F8FAFC;
}

/* Botón genérico del dashboard */
.dash-btn[b-uo8f1pm374] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: 8px;
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s ease;
}

/* Botón primario (cerrar modal) */
.dash-btn-primary[b-uo8f1pm374] {
    background: #6366F1;
    color: white;
}

.dash-btn-primary:hover[b-uo8f1pm374] {
    background: #4F46E5;
    box-shadow: var(--shadow-md);
    transform: translateY(-1px);
}

/* Botón "Cerrar" del dashboard (gris sólido) */
.dash-btn-cerrar[b-uo8f1pm374] {
    background: var(--color-secondary);
    color: #fff;
    border: none;
}

.dash-btn-cerrar:hover[b-uo8f1pm374] {
    background: var(--color-secondary-dark);
    box-shadow: var(--shadow-md);
    transform: translateY(-1px);
}

/* ===== ANIMACIONES ===== */
@keyframes dashFadeIn-b-uo8f1pm374 {
    from { opacity: 0; transform: translateY(-8px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes dashSlideUp-b-uo8f1pm374 {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes dashOverlayIn-b-uo8f1pm374 {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes dashModalIn-b-uo8f1pm374 {
    from { opacity: 0; transform: scale(0.92) translateY(10px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}

/* ===== RESPONSIVE: TABLET ===== */
@media (max-width: 1200px) {
    .dash-metrics-row[b-uo8f1pm374] {
        grid-template-columns: repeat(3, 1fr);
    }

    .dash-main[b-uo8f1pm374] {
        grid-template-columns: 1fr;
        overflow-y: auto;
    }

    .dash-charts-panel[b-uo8f1pm374] {
        min-height: 350px;
    }

    .dash-timeline-panel[b-uo8f1pm374] {
        min-height: 300px;
    }
}

@media (max-width: 768px) {
    .dashboard[b-uo8f1pm374] {
        padding: 8px;
        gap: 8px;
        overflow-y: auto;
    }

    .dash-metrics-row[b-uo8f1pm374] {
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
    }

    .dash-metric-body[b-uo8f1pm374] {
        padding: 8px 10px;
    }

    .dash-metric-value[b-uo8f1pm374] {
        font-size: 1.1rem;
    }

    .dash-metric-status[b-uo8f1pm374] {
        display: none;
    }

    .dash-cert-dates[b-uo8f1pm374] {
        display: none;
    }

    .dash-main[b-uo8f1pm374] {
        grid-template-columns: 1fr;
        overflow-y: auto;
    }

    .dash-nav-btn span:last-child[b-uo8f1pm374] {
        display: none;
    }
}

/* ===== RESPONSIVE: MÓVIL ===== */
@media (max-width: 480px) {
    .dash-metrics-row[b-uo8f1pm374] {
        grid-template-columns: 1fr 1fr;
    }

    .dash-cert[b-uo8f1pm374] {
        grid-column: 1 / -1;
    }
}
/* /Pages/Login/Login.razor.rz.scp.css */
/* Login excluido del estilo "FORMULARIOS COMPACTOS GLOBALES" de wwwroot/css/app.css.
   Restaura la altura/tipografia default de Radzen para los campos del formulario
   de login porque por convencion UX los campos de login se muestran mas grandes
   (mejor target para el click, mejor accesibilidad).

   Mecanismo: la regla global apunta a `.rz-textbox` (1 elemento). Aqui usamos
   `.login-form-stack ::deep .rz-textbox` (1 clase + 1 elemento) que tiene mayor
   especificidad y ademas con `!important` sobrescribe el `!important` global.
   El wrapper `.login-form-stack` se agrega al `<RadzenStack>` raiz en Login.razor. */
.login-form-stack[b-n6diz5bc1p]  .rz-textbox,
.login-form-stack[b-n6diz5bc1p]  .rz-inputtext,
.login-form-stack[b-n6diz5bc1p]  .rz-dropdown,
.login-form-stack[b-n6diz5bc1p]  .rz-numeric,
.login-form-stack[b-n6diz5bc1p]  .rz-datepicker,
.login-form-stack[b-n6diz5bc1p]  .rz-calendar {
    height: auto !important;
    min-height: 0 !important;
    font-size: inherit !important;
}

.login-form-stack[b-n6diz5bc1p]  .rz-textbox,
.login-form-stack[b-n6diz5bc1p]  .rz-inputtext,
.login-form-stack[b-n6diz5bc1p]  .rz-numeric input,
.login-form-stack[b-n6diz5bc1p]  .rz-datepicker input,
.login-form-stack[b-n6diz5bc1p]  .rz-calendar input {
    padding: revert !important;
    font-size: inherit !important;
}

.login-form-stack[b-n6diz5bc1p]  .rz-dropdown {
    justify-content: revert !important;
}

.login-form-stack[b-n6diz5bc1p]  .rz-dropdown .rz-dropdown-label {
    font-size: inherit !important;
    padding: revert !important;
    line-height: revert !important;
    height: auto !important;
}

/* ===== Botón "Iniciar sesión" + spinner de carga visible ===== */
.login-submit-btn[b-n6diz5bc1p] {
    width: 100%;
    margin-top: 1em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 16px;
    border: none;
    border-radius: var(--radius-sm);
    background: var(--color-accent);          /* naranja de marca */
    color: #fff;
    font-family: var(--font-family);
    font-size: 0.95rem;
    font-weight: var(--fw-bold);
    cursor: pointer;
    transition: var(--transition);
}

    .login-submit-btn:hover:not(:disabled)[b-n6diz5bc1p] {
        background: var(--color-accent-dark);
    }

    .login-submit-btn:disabled[b-n6diz5bc1p] {
        cursor: not-allowed;
        opacity: 0.95;
    }

    .login-submit-btn .rzi[b-n6diz5bc1p] {
        font-size: 1.1rem;
    }

/* Spinner blanco, grueso y de buen tamaño: claramente visible sobre el naranja */
.login-spinner[b-n6diz5bc1p] {
    width: 20px;
    height: 20px;
    border: 3px solid rgba(255, 255, 255, 0.4);
    border-top-color: #fff;
    border-radius: 50%;
    animation: login-spin-b-n6diz5bc1p 0.7s linear infinite;
    flex-shrink: 0;
}

@keyframes login-spin-b-n6diz5bc1p {
    to {
        transform: rotate(360deg);
    }
}
/* /Pages/Mantenedores/AdminListPrecio/AdminListPrecioIndex.razor.rz.scp.css */
/* ===== MANTENEDOR LISTA DE PRECIOS - DESIGN SYSTEM =====
   Barra de control + filtros colapsables + grilla a ancho
   completo. El alta/edición se hace en un modal
   (Componentes/ListaPrecioFormulario), por lo que esta página
   ya NO tiene formulario lateral. Estilos scoped al componente.
   ============================================= */

.ms-container[b-5j8c9qm3zq] {
    --ms-primary: var(--color-primary);
    --ms-primary-dark: var(--color-primary-dark);
    --ms-primary-light: var(--color-primary-light);
    --ms-accent: var(--color-warning);
    --ms-success: var(--color-success);
    --ms-success-light: var(--color-success-light);
    --ms-danger: var(--color-danger);
    --ms-danger-light: var(--color-danger-light);
    --ms-info: var(--color-info);
    --ms-info-light: var(--color-info-light);
    --ms-orange: var(--color-accent);
    --ms-bg: var(--bg);
    --ms-card: var(--surface);
    --ms-text: var(--text);
    --ms-text-secondary: var(--text-secondary);
    --ms-text-muted: var(--text-muted);
    --ms-border: var(--border);
    --ms-shadow-sm: var(--shadow-xs);
    --ms-shadow: var(--shadow-sm);
    --ms-shadow-md: var(--shadow-md);
    --ms-radius: var(--radius-lg);
    --ms-radius-sm: var(--radius-md);
    --ms-radius-xs: var(--radius-sm);
    --ms-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--ms-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.ms-control-bar[b-5j8c9qm3zq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--ms-card);
    border-radius: var(--ms-radius);
    box-shadow: var(--ms-shadow);
    padding: 10px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 56px;
}

.ms-control-left[b-5j8c9qm3zq] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.ms-header-icon[b-5j8c9qm3zq] {
    width: 38px;
    height: 38px;
    border-radius: var(--ms-radius-sm);
    background: linear-gradient(135deg, var(--ms-primary) 0%, var(--ms-primary-dark) 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--ms-shadow-sm);
}

.ms-header-icon .rzi[b-5j8c9qm3zq] { font-size: 1.25rem; }

.ms-title[b-5j8c9qm3zq] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--ms-text);
    margin: 0;
    line-height: 1.2;
}

.ms-subtitle[b-5j8c9qm3zq] {
    font-size: 0.72rem;
    color: var(--ms-text-secondary);
    margin: 2px 0 0;
}

.ms-control-center[b-5j8c9qm3zq] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ms-loading-indicator[b-5j8c9qm3zq] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: msFadeIn-b-5j8c9qm3zq 0.3s ease;
}

.ms-loading-spinner[b-5j8c9qm3zq] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--ms-border);
    border-top-color: var(--ms-primary);
    border-radius: 50%;
    animation: msSpin-b-5j8c9qm3zq 0.8s linear infinite;
}

.ms-loading-text[b-5j8c9qm3zq] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--ms-primary);
    animation: msPulse-b-5j8c9qm3zq 1.5s ease-in-out infinite;
}

.ms-control-right[b-5j8c9qm3zq] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES ===== */
.ms-btn[b-5j8c9qm3zq] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--ms-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--ms-transition);
    white-space: nowrap;
    color: white;
}

.ms-btn:hover:not(:disabled)[b-5j8c9qm3zq] {
    transform: translateY(-1px);
    box-shadow: var(--ms-shadow-md);
}

.ms-btn:active:not(:disabled)[b-5j8c9qm3zq] { transform: translateY(0); }
.ms-btn:disabled[b-5j8c9qm3zq] { opacity: 0.6; cursor: not-allowed; }
.ms-btn .rzi[b-5j8c9qm3zq] { font-size: 1rem; }

.ms-btn-filtros[b-5j8c9qm3zq] { background: var(--ms-info); }
.ms-btn-filtros.active[b-5j8c9qm3zq] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

.ms-btn-buscar[b-5j8c9qm3zq] { background: var(--ms-orange); }
.ms-btn-nuevo[b-5j8c9qm3zq]  { background: var(--color-primary); }

/* Botones específicos de este mantenedor */
.ms-btn-carga[b-5j8c9qm3zq]   { background: var(--color-upload); }
.ms-btn-carga:hover:not(:disabled)[b-5j8c9qm3zq] { background: var(--color-upload-dark); }
.ms-btn-plantilla[b-5j8c9qm3zq] { background: var(--color-template); }
.ms-btn-plantilla:hover:not(:disabled)[b-5j8c9qm3zq] { background: var(--color-template-dark); }

/* ===== PANEL DE ERRORES DE CARGA MASIVA ===== */
.ms-errores-panel[b-5j8c9qm3zq] {
    flex-shrink: 0;
    background: var(--ms-card);
    border: 1px solid var(--ms-danger);
    border-radius: var(--ms-radius);
    box-shadow: var(--ms-shadow-md);
    overflow: hidden;
    max-height: 220px;
    display: flex;
    flex-direction: column;
}

.ms-errores-header[b-5j8c9qm3zq] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    border-bottom: 1px solid var(--ms-border);
    background: var(--ms-danger-light);
}
.ms-errores-header h3[b-5j8c9qm3zq] {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--ms-danger);
    margin: 0;
}
.ms-errores-header .rzi[b-5j8c9qm3zq] { color: var(--ms-danger); }
.ms-errores-header .ms-filtros-close-btn[b-5j8c9qm3zq] { margin-left: auto; }

.ms-errores-body[b-5j8c9qm3zq] { overflow: auto; }

.ms-errores-table[b-5j8c9qm3zq] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.75rem;
}
.ms-errores-table th[b-5j8c9qm3zq] {
    text-align: left;
    background: var(--ms-bg);
    color: var(--ms-text-secondary);
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.66rem;
    letter-spacing: 0.03em;
    padding: 6px 10px;
    position: sticky;
    top: 0;
}
.ms-errores-table td[b-5j8c9qm3zq] {
    padding: 5px 10px;
    border-bottom: 1px solid #F1F5F9;
    color: var(--ms-text);
}
.ms-errores-table td:last-child[b-5j8c9qm3zq] { color: var(--ms-danger); font-weight: 600; }

/* ===== FILTROS ===== */
.ms-filtros-wrapper[b-5j8c9qm3zq] { position: relative; flex-shrink: 0; }

.ms-filtros-panel[b-5j8c9qm3zq] {
    background: var(--ms-card);
    border-radius: var(--ms-radius);
    box-shadow: var(--ms-shadow-md);
    overflow: hidden;
    animation: msSlideDown-b-5j8c9qm3zq 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.ms-filtros-header[b-5j8c9qm3zq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--ms-border);
    background: linear-gradient(135deg, var(--ms-info-light) 0%, var(--ms-card) 100%);
}

.ms-filtros-header h3[b-5j8c9qm3zq] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--ms-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.ms-filtros-header h3 .rzi[b-5j8c9qm3zq] { color: var(--ms-info); font-size: 1.1rem; }

.ms-filtros-close-btn[b-5j8c9qm3zq] {
    background: none;
    border: none;
    color: var(--ms-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--ms-radius-xs);
    transition: var(--ms-transition);
    display: flex;
    align-items: center;
}
.ms-filtros-close-btn:hover[b-5j8c9qm3zq] { background: var(--ms-danger-light); color: var(--ms-danger); }

.ms-filtros-body[b-5j8c9qm3zq] { padding: 12px 16px; }

.ms-filtros-grid[b-5j8c9qm3zq] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.ms-filtro-ancho[b-5j8c9qm3zq] { grid-column: span 2; min-width: 280px; }

.ms-filtro-field[b-5j8c9qm3zq] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.ms-filtro-label[b-5j8c9qm3zq] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--ms-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.ms-filtro-field[b-5j8c9qm3zq]  .rz-textbox,
.ms-filtro-field[b-5j8c9qm3zq]  .rz-inputtext,
.ms-filtro-field[b-5j8c9qm3zq]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--ms-radius-xs) !important;
    font-size: 0.78rem !important;
    height: 32px !important;
    transition: var(--ms-transition);
    background: white !important;
}

.ms-filtro-field[b-5j8c9qm3zq]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--ms-radius-xs) !important;
    font-size: 0.78rem !important;
    height: 32px !important;
    transition: var(--ms-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.ms-filtro-field[b-5j8c9qm3zq]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

/* Texto del dropdown: llena el wrapper de 32px (evita el "recuadro dentro del recuadro") */
.ms-filtro-field[b-5j8c9qm3zq]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.78rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ms-filtro-field[b-5j8c9qm3zq]  .rz-textbox:focus,
.ms-filtro-field[b-5j8c9qm3zq]  .rz-state-focused,
.ms-filtro-field[b-5j8c9qm3zq]  input:focus {
    border-color: var(--ms-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

/* ===== ENCABEZADO DE SECCIÓN (grilla) ===== */
.ms-section-header[b-5j8c9qm3zq] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--ms-border);
    background: linear-gradient(135deg, var(--ms-primary-light) 0%, var(--ms-card) 100%);
}

.ms-section-header h3[b-5j8c9qm3zq] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--ms-text);
    margin: 0;
}

.ms-section-header .rzi[b-5j8c9qm3zq] {
    color: var(--ms-primary);
    font-size: 1.1rem;
}

.ms-section-count[b-5j8c9qm3zq] {
    margin-left: auto;
    font-size: 0.7rem;
    color: var(--ms-text-secondary);
    background: var(--ms-bg);
    border-radius: 999px;
    padding: 2px 10px;
    font-weight: 600;
}

/* ===== GRILLA (ancho completo) ===== */
.ms-grid-wrapper[b-5j8c9qm3zq] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--ms-card);
    border-radius: var(--ms-radius);
    box-shadow: var(--ms-shadow);
    overflow: hidden;
    min-height: 0;
}

[b-5j8c9qm3zq] .ms-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

[b-5j8c9qm3zq] .ms-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--ms-bg) !important;
    color: var(--ms-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--ms-border) !important;
}

[b-5j8c9qm3zq] .ms-grid-wrapper .rz-datatable-tbody > tr { transition: background-color 0.15s ease; }
[b-5j8c9qm3zq] .ms-grid-wrapper .rz-datatable-tbody > tr:hover { background-color: var(--ms-primary-light) !important; }
[b-5j8c9qm3zq] .ms-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* Botones de accion en filas */
.ms-action-group[b-5j8c9qm3zq] { display: flex; gap: 6px; justify-content: center; }

.ms-action-btn[b-5j8c9qm3zq] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--ms-radius-xs);
    cursor: pointer;
    transition: var(--ms-transition);
    padding: 0;
    color: white;
}
.ms-action-btn .rzi[b-5j8c9qm3zq] { font-size: 0.9rem; }
.ms-action-btn:hover[b-5j8c9qm3zq]  { transform: scale(1.12); box-shadow: var(--ms-shadow-md); }
.ms-action-btn:active[b-5j8c9qm3zq] { transform: scale(0.95); }
.ms-action-btn.edit[b-5j8c9qm3zq]   { background: var(--ms-info); }
.ms-action-btn.edit:hover[b-5j8c9qm3zq]   { background: #0284C7; }
.ms-action-btn.delete[b-5j8c9qm3zq] { background: var(--ms-danger); }
.ms-action-btn.delete:hover[b-5j8c9qm3zq] { background: #DC2626; }

/* ===== ANIMACIONES ===== */
@keyframes msSpin-b-5j8c9qm3zq { to { transform: rotate(360deg); } }

@keyframes msPulse-b-5j8c9qm3zq {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.5; }
}

@keyframes msFadeIn-b-5j8c9qm3zq {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes msSlideDown-b-5j8c9qm3zq {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to   { opacity: 1; transform: translateY(0); max-height: 500px; }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .ms-container[b-5j8c9qm3zq] { padding: 8px 10px; gap: 8px; }
    .ms-control-bar[b-5j8c9qm3zq] { flex-wrap: wrap; padding: 8px 12px; }
    .ms-control-center[b-5j8c9qm3zq] { order: 3; width: 100%; }
    .ms-filtro-ancho[b-5j8c9qm3zq] { grid-column: span 1; min-width: 0; }
    .ms-filtros-grid[b-5j8c9qm3zq] { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
}

@media (max-width: 640px) {
    .ms-container[b-5j8c9qm3zq] { padding: 6px 8px; gap: 6px; }
    .ms-control-bar[b-5j8c9qm3zq] { flex-direction: column; gap: 8px; }
    .ms-control-left[b-5j8c9qm3zq], .ms-control-right[b-5j8c9qm3zq] { width: 100%; justify-content: center; }
    .ms-control-right[b-5j8c9qm3zq] { flex-wrap: wrap; }
    .ms-btn[b-5j8c9qm3zq] { flex: 1; justify-content: center; min-width: 0; }
    .ms-btn span:not(.material-icons):not(.rzi)[b-5j8c9qm3zq] { display: none; }
    .ms-filtros-grid[b-5j8c9qm3zq] { grid-template-columns: 1fr; }
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-5j8c9qm3zq] .ms-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}
/* /Pages/Mantenedores/AdminListPrecio/Componentes/ListaPrecioFormulario.razor.rz.scp.css */
/* ===== MODAL CREAR/EDITAR LISTA DE PRECIO =====
   Mismo patron visual que TiposPago/Componentes/TipoPagoFormulario.
   ============================================= */

.lpf-modal[b-mpr9n6gjd0] {
    --lpf-primary: var(--color-primary);
    --lpf-primary-light: var(--color-primary-light);
    --lpf-success: var(--color-success);
    --lpf-border: var(--border);
    --lpf-bg: #F8FAFC;
    --lpf-card: var(--surface);
    --lpf-text: var(--text);
    --lpf-text-secondary: var(--text-secondary);
    --lpf-radius-xs: var(--radius-sm);
    --lpf-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    background: var(--lpf-bg);
    font-family: var(--font-family);
    position: relative;
}

.lpf-loading-overlay[b-mpr9n6gjd0] {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    z-index: 10;
    color: var(--lpf-text-secondary);
    font-weight: 600;
    font-size: 0.85rem;
}

.lpf-loading-spinner[b-mpr9n6gjd0] {
    width: 42px;
    height: 42px;
    border: 4px solid var(--lpf-border);
    border-top-color: var(--lpf-primary);
    border-radius: 50%;
    animation: lpfSpin-b-mpr9n6gjd0 0.8s linear infinite;
}

@keyframes lpfSpin-b-mpr9n6gjd0 {
    to { transform: rotate(360deg); }
}

.lpf-body[b-mpr9n6gjd0] {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
}

.lpf-grid[b-mpr9n6gjd0] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 16px;
}

.lpf-field[b-mpr9n6gjd0] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.lpf-full[b-mpr9n6gjd0] {
    grid-column: 1 / -1;
}

.lpf-label[b-mpr9n6gjd0] {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--lpf-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.lpf-required[b-mpr9n6gjd0] { color: var(--color-danger); font-weight: 700; }

/* Grupo input + boton/selector (producto, descuento) */
.lpf-input-group[b-mpr9n6gjd0] {
    display: flex;
    align-items: center;
    gap: 6px;
}
.lpf-input-group > :first-child[b-mpr9n6gjd0] { flex: 1; min-width: 0; }

.lpf-search-btn[b-mpr9n6gjd0] {
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--lpf-radius-xs);
    background: var(--lpf-primary);
    color: white;
    cursor: pointer;
    transition: var(--lpf-transition);
}
.lpf-search-btn:hover:not(:disabled)[b-mpr9n6gjd0] { background: var(--color-primary-dark); }
.lpf-search-btn:disabled[b-mpr9n6gjd0] { opacity: 0.6; cursor: not-allowed; }
.lpf-search-btn .rzi[b-mpr9n6gjd0] { font-size: 1rem; }

.lpf-field[b-mpr9n6gjd0]  .rz-textbox,
.lpf-field[b-mpr9n6gjd0]  .rz-inputtext,
.lpf-field[b-mpr9n6gjd0]  input,
.lpf-field[b-mpr9n6gjd0]  .rz-spinner,
.lpf-field[b-mpr9n6gjd0]  .rz-numeric {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--lpf-radius-xs) !important;
    font-size: 0.85rem !important;
    height: 36px !important;
    background: white !important;
    transition: var(--lpf-transition);
}

.lpf-field[b-mpr9n6gjd0]  .rz-dropdown,
.lpf-field[b-mpr9n6gjd0]  .rz-datepicker {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--lpf-radius-xs) !important;
    font-size: 0.85rem !important;
    height: 36px !important;
    background: white !important;
    transition: var(--lpf-transition);
    box-sizing: border-box !important;
}

.lpf-field[b-mpr9n6gjd0]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.lpf-field[b-mpr9n6gjd0]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.85rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lpf-field[b-mpr9n6gjd0]  .rz-textbox:focus,
.lpf-field[b-mpr9n6gjd0]  .rz-state-focused,
.lpf-field[b-mpr9n6gjd0]  input:focus,
.lpf-field[b-mpr9n6gjd0]  .rz-numeric:focus-within {
    border-color: var(--lpf-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
    outline: none;
}

.lpf-field[b-mpr9n6gjd0]  input[disabled],
.lpf-field[b-mpr9n6gjd0]  .rz-state-disabled {
    background: #F8FAFC !important;
    color: var(--lpf-text-secondary) !important;
    cursor: not-allowed;
}

.lpf-footer[b-mpr9n6gjd0] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 10px 16px;
    border-top: 1px solid var(--lpf-border);
    background: var(--lpf-card);
    flex-shrink: 0;
}

.lpf-btn[b-mpr9n6gjd0] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--lpf-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    color: white;
    transition: var(--lpf-transition);
}

.lpf-btn:hover:not(:disabled)[b-mpr9n6gjd0] {
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.lpf-btn:disabled[b-mpr9n6gjd0] {
    opacity: 0.6;
    cursor: not-allowed;
}

.lpf-btn-secondary[b-mpr9n6gjd0] { background: var(--color-secondary); }
.lpf-btn-secondary:hover:not(:disabled)[b-mpr9n6gjd0] { background: var(--color-secondary-dark); }

.lpf-btn-primary[b-mpr9n6gjd0] { background: var(--color-success); }

.lpf-btn .rzi[b-mpr9n6gjd0] { font-size: 1rem; }

@media (max-width: 640px) {
    .lpf-grid[b-mpr9n6gjd0] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Mantenedores/AdminPagos/AdminPagosIndex.razor.rz.scp.css */
/* ===== ADMINISTRACIÓN DE PAGOS - DESIGN SYSTEM =====
   Reusa la paleta y patrones de MantenedorSucursal.razor:
   barra de control, filtros colapsables y grilla. A diferencia
   del mantenedor de sucursales, aquí la grilla ocupa todo el
   ancho (sin formulario lateral). Estilos scoped al componente.
   ============================================= */

.ms-container[b-dexklwbdrv] {
    --ms-primary: var(--color-primary);
    --ms-primary-dark: var(--color-primary-dark);
    --ms-primary-light: var(--color-primary-light);
    --ms-accent: var(--color-warning);
    --ms-success: var(--color-success);
    --ms-success-light: var(--color-success-light);
    --ms-danger: var(--color-danger);
    --ms-danger-light: var(--color-danger-light);
    --ms-info: var(--color-info);
    --ms-info-light: var(--color-info-light);
    --ms-orange: var(--color-accent);
    --ms-bg: var(--bg);
    --ms-card: var(--surface);
    --ms-text: var(--text);
    --ms-text-secondary: var(--text-secondary);
    --ms-text-muted: var(--text-muted);
    --ms-border: var(--border);
    --ms-shadow-sm: var(--shadow-xs);
    --ms-shadow: var(--shadow-sm);
    --ms-shadow-md: var(--shadow-md);
    --ms-radius: var(--radius-lg);
    --ms-radius-sm: var(--radius-md);
    --ms-radius-xs: var(--radius-sm);
    --ms-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--ms-bg);
    font-family: var(--font-family);
    gap: 16px;
    padding: 14px 18px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.ms-control-bar[b-dexklwbdrv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--ms-card);
    border-radius: var(--ms-radius);
    box-shadow: var(--ms-shadow);
    padding: 10px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 56px;
}

.ms-control-left[b-dexklwbdrv] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.ms-header-icon[b-dexklwbdrv] {
    width: 38px;
    height: 38px;
    border-radius: var(--ms-radius-sm);
    background: linear-gradient(135deg, var(--ms-primary) 0%, var(--ms-primary-dark) 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--ms-shadow-sm);
}

.ms-header-icon .rzi[b-dexklwbdrv] { font-size: 1.25rem; }

.ms-title[b-dexklwbdrv] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--ms-text);
    margin: 0;
    line-height: 1.2;
}

.ms-subtitle[b-dexklwbdrv] {
    font-size: 0.72rem;
    color: var(--ms-text-secondary);
    margin: 2px 0 0;
}

.ms-control-center[b-dexklwbdrv] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ms-loading-indicator[b-dexklwbdrv] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: msFadeIn-b-dexklwbdrv 0.3s ease;
}

.ms-loading-spinner[b-dexklwbdrv] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--ms-border);
    border-top-color: var(--ms-primary);
    border-radius: 50%;
    animation: msSpin-b-dexklwbdrv 0.8s linear infinite;
}

.ms-loading-text[b-dexklwbdrv] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--ms-primary);
    animation: msPulse-b-dexklwbdrv 1.5s ease-in-out infinite;
}

.ms-control-right[b-dexklwbdrv] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES ===== */
.ms-btn[b-dexklwbdrv] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--ms-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--ms-transition);
    white-space: nowrap;
    color: white;
}

.ms-btn:hover:not(:disabled)[b-dexklwbdrv] {
    transform: translateY(-1px);
    box-shadow: var(--ms-shadow-md);
}

.ms-btn:active:not(:disabled)[b-dexklwbdrv] { transform: translateY(0); }
.ms-btn:disabled[b-dexklwbdrv] { opacity: 0.6; cursor: not-allowed; }
.ms-btn .rzi[b-dexklwbdrv] { font-size: 1rem; }

.ms-btn-filtros[b-dexklwbdrv] { background: var(--ms-info); }
.ms-btn-filtros.active[b-dexklwbdrv] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

.ms-btn-buscar[b-dexklwbdrv] { background: var(--ms-orange); }
.ms-btn-desmarcar[b-dexklwbdrv] { background: var(--ms-primary); }

/* ===== FILTROS ===== */
.ms-filtros-wrapper[b-dexklwbdrv] { position: relative; flex-shrink: 0; }

.ms-filtros-panel[b-dexklwbdrv] {
    background: var(--ms-card);
    border-radius: var(--ms-radius);
    box-shadow: var(--ms-shadow-md);
    overflow: hidden;
    animation: msSlideDown-b-dexklwbdrv 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.ms-filtros-header[b-dexklwbdrv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--ms-border);
    background: linear-gradient(135deg, var(--ms-info-light) 0%, var(--ms-card) 100%);
}

.ms-filtros-header h3[b-dexklwbdrv] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--ms-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.ms-filtros-header h3 .rzi[b-dexklwbdrv] { color: var(--ms-info); font-size: 1.1rem; }

.ms-filtros-close-btn[b-dexklwbdrv] {
    background: none;
    border: none;
    color: var(--ms-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--ms-radius-xs);
    transition: var(--ms-transition);
    display: flex;
    align-items: center;
}
.ms-filtros-close-btn:hover[b-dexklwbdrv] { background: var(--ms-danger-light); color: var(--ms-danger); }

.ms-filtros-body[b-dexklwbdrv] { padding: 12px 16px; }

.ms-filtros-grid[b-dexklwbdrv] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.ms-filtro-field[b-dexklwbdrv] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.ms-filtro-label[b-dexklwbdrv] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--ms-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.ms-filtro-field[b-dexklwbdrv]  .rz-textbox,
.ms-filtro-field[b-dexklwbdrv]  .rz-inputtext,
.ms-filtro-field[b-dexklwbdrv]  .rz-calendar,
.ms-filtro-field[b-dexklwbdrv]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--ms-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--ms-transition);
    background: white !important;
}

.ms-filtro-field[b-dexklwbdrv]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--ms-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--ms-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.ms-filtro-field[b-dexklwbdrv]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.ms-filtro-field[b-dexklwbdrv]  .rz-textbox:focus,
.ms-filtro-field[b-dexklwbdrv]  .rz-state-focused,
.ms-filtro-field[b-dexklwbdrv]  input:focus,
.ms-filtro-field[b-dexklwbdrv]  .rz-calendar:focus-within {
    border-color: var(--ms-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

.ms-filtro-field[b-dexklwbdrv]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== SECTION HEADER ===== */
.ms-section-header[b-dexklwbdrv] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    border-bottom: 2px solid var(--ms-primary);
    background: linear-gradient(135deg, var(--ms-primary-light) 0%, var(--ms-card) 100%);
}

.ms-section-header h3[b-dexklwbdrv] {
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--ms-primary-dark);
    margin: 0;
    letter-spacing: 0.01em;
}

.ms-section-header .rzi[b-dexklwbdrv] {
    color: var(--ms-primary);
    font-size: 1.35rem;
}

.ms-section-count[b-dexklwbdrv] {
    margin-left: auto;
    font-size: 0.7rem;
    color: var(--ms-text-secondary);
    background: var(--ms-bg);
    border-radius: 999px;
    padding: 2px 10px;
    font-weight: 600;
}

/* ===== GRILLA ===== */
.ms-grid-wrapper[b-dexklwbdrv] {
    display: flex;
    flex-direction: column;
    background: var(--ms-card);
    border-radius: var(--ms-radius);
    box-shadow: var(--ms-shadow);
    overflow: hidden;
    min-height: 0;
}

/* La grilla ocupa todo el alto disponible (sin formulario lateral). */
.ms-grid-full[b-dexklwbdrv] { flex: 1; }

[b-dexklwbdrv] .ms-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

[b-dexklwbdrv] .ms-grid-wrapper .rz-datatable-thead > tr > th {
    background: #E8ECF6 !important;
    color: var(--ms-text) !important;
    font-weight: 800 !important;
    font-size: 0.76rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 12px 14px !important;
    border-bottom: 2px solid var(--ms-primary) !important;
}

[b-dexklwbdrv] .ms-grid-wrapper .rz-datatable-tbody > tr { transition: background-color 0.15s ease; }
[b-dexklwbdrv] .ms-grid-wrapper .rz-datatable-tbody > tr:hover { background-color: var(--ms-primary-light) !important; }
[b-dexklwbdrv] .ms-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 10px 14px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.82rem;
}

/* ===== BADGE INTEGRADO ===== */
.ms-badge[b-dexklwbdrv] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 999px;
    font-weight: 700;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.ms-badge-ok[b-dexklwbdrv] { background: var(--ms-success-light); color: #047857; }
.ms-badge-no[b-dexklwbdrv] { background: var(--ms-danger-light); color: var(--ms-danger); }

/* ===== ANIMACIONES ===== */
@keyframes msSpin-b-dexklwbdrv { to { transform: rotate(360deg); } }

@keyframes msPulse-b-dexklwbdrv {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.5; }
}

@keyframes msFadeIn-b-dexklwbdrv {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes msSlideDown-b-dexklwbdrv {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to   { opacity: 1; transform: translateY(0); max-height: 500px; }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .ms-container[b-dexklwbdrv] { padding: 8px 10px; gap: 8px; }
    .ms-control-bar[b-dexklwbdrv] { flex-wrap: wrap; padding: 8px 12px; }
    .ms-control-center[b-dexklwbdrv] { order: 3; width: 100%; }
    .ms-filtros-grid[b-dexklwbdrv] { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
}

@media (max-width: 640px) {
    .ms-container[b-dexklwbdrv] { padding: 6px 8px; gap: 6px; }
    .ms-control-bar[b-dexklwbdrv] { flex-direction: column; gap: 8px; }
    .ms-control-left[b-dexklwbdrv], .ms-control-right[b-dexklwbdrv] { width: 100%; justify-content: center; }
    .ms-control-right[b-dexklwbdrv] { flex-wrap: wrap; }
    .ms-btn[b-dexklwbdrv] { flex: 1; justify-content: center; min-width: 0; }
    .ms-btn span:not(.material-icons):not(.rzi)[b-dexklwbdrv] { display: none; }
    .ms-filtros-grid[b-dexklwbdrv] { grid-template-columns: 1fr; }
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-dexklwbdrv] .ms-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}
/* /Pages/Mantenedores/Clientes/ClientesIndex.razor.rz.scp.css */
/* ===== CLIENTES - DESIGN SYSTEM ===== */
/* Paleta de colores basada en PosIndex.razor */

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-ohy194kj9m] .cli-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

/* ===== CONTENEDOR PRINCIPAL ===== */
.cli-container[b-ohy194kj9m] {
    --cli-primary: var(--color-primary);
    --cli-primary-dark: var(--color-primary-dark);
    --cli-primary-light: var(--color-primary-light);
    --cli-accent: var(--color-warning);
    --cli-accent-dark: var(--color-warning-dark);
    --cli-accent-light: #FFFBEB;
    --cli-success: var(--color-success);
    --cli-success-light: var(--color-success-light);
    --cli-danger: var(--color-danger);
    --cli-danger-light: var(--color-danger-light);
    --cli-info: var(--color-info);
    --cli-info-light: var(--color-info-light);
    --cli-bg: var(--bg);
    --cli-card: var(--surface);
    --cli-text: var(--text);
    --cli-text-secondary: var(--text-secondary);
    --cli-text-muted: var(--text-muted);
    --cli-border: var(--border);
    --cli-shadow-sm: var(--shadow-xs);
    --cli-shadow: var(--shadow-sm);
    --cli-shadow-md: var(--shadow-md);
    --cli-shadow-lg: var(--shadow-lg);
    --cli-radius: var(--radius-lg);
    --cli-radius-sm: var(--radius-md);
    --cli-radius-xs: var(--radius-sm);
    --cli-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--cli-bg);
    overflow: hidden;
    box-sizing: border-box;
    font-family: var(--font-family);
    padding: 16px;
    gap: 12px;
    animation: cliFadeIn-b-ohy194kj9m 0.35s ease;
}

/* ===== BARRA SUPERIOR / HEADER ===== */
.cli-header[b-ohy194kj9m] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--cli-card);
    border-radius: var(--cli-radius);
    box-shadow: var(--cli-shadow);
    padding: 12px 20px;
    flex-shrink: 0;
    border: 1px solid var(--cli-border);
}

.cli-header-left[b-ohy194kj9m] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.cli-header-icon[b-ohy194kj9m] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    background: var(--cli-primary-light);
    border-radius: var(--cli-radius-sm);
    color: var(--cli-primary);
    font-size: 1.25rem;
}

.cli-header h2[b-ohy194kj9m] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--cli-text);
    margin: 0;
    letter-spacing: -0.01em;
}

.cli-header-subtitle[b-ohy194kj9m] {
    font-size: 0.75rem;
    color: var(--cli-text-secondary);
    margin: 0;
    font-weight: 500;
}

.cli-header-actions[b-ohy194kj9m] {
    display: flex;
    gap: 8px;
    align-items: center;
}

.cli-search-input[b-ohy194kj9m] {
    padding: 7px 14px;
    border: 1px solid var(--cli-border);
    border-radius: var(--cli-radius-sm);
    font-size: 0.82rem;
    font-family: inherit;
    color: var(--cli-text);
    background: var(--cli-bg);
    outline: none;
    width: 260px;
    transition: var(--cli-transition);
}

.cli-search-input:focus[b-ohy194kj9m] {
    border-color: var(--cli-primary);
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

.cli-search-input[b-ohy194kj9m]::placeholder {
    color: var(--cli-text-muted);
    font-weight: 400;
}

/* ===== BOTONES ===== */
.cli-btn[b-ohy194kj9m] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cli-radius-sm);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cli-transition);
    letter-spacing: 0.01em;
}

.cli-btn-primary[b-ohy194kj9m] {
    background: var(--cli-primary);
    color: white;
}

.cli-btn-primary:hover[b-ohy194kj9m] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.cli-btn-primary:active[b-ohy194kj9m] {
    transform: translateY(0);
}

.cli-btn-carga[b-ohy194kj9m] {
    background: var(--color-upload);
    color: white;
}

.cli-btn-carga:hover[b-ohy194kj9m] {
    background: var(--color-upload-dark);
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.cli-btn-carga:active[b-ohy194kj9m] {
    transform: translateY(0);
}

.cli-btn-accent[b-ohy194kj9m] {
    background: var(--color-template);
    color: white;
}

.cli-btn-accent:hover[b-ohy194kj9m] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.cli-btn-accent:active[b-ohy194kj9m] {
    transform: translateY(0);
}

.cli-btn-filtros[b-ohy194kj9m] {
    background: var(--cli-info);
    color: white;
}

.cli-btn-filtros.active[b-ohy194kj9m] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
}

.cli-btn-buscar[b-ohy194kj9m] {
    background: var(--cli-accent);
    color: white;
}

.cli-btn-buscar:hover[b-ohy194kj9m] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.cli-btn-ghost[b-ohy194kj9m] {
    background: var(--color-limpiar);
    color: #fff;
    border: 1px solid transparent;
}

.cli-btn-ghost:hover[b-ohy194kj9m] {
    background: var(--color-limpiar-dark);
    color: #fff;
}

/* ===== PANEL DE FILTROS ===== */
.cli-filtros-wrapper[b-ohy194kj9m] {
    position: relative;
    flex-shrink: 0;
}

.cli-filtros-panel[b-ohy194kj9m] {
    background: var(--cli-card);
    border-radius: var(--cli-radius);
    box-shadow: var(--cli-shadow-md);
    border: 1px solid var(--cli-border);
    overflow: hidden;
    animation: cliSlideDown-b-ohy194kj9m 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.cli-filtros-header[b-ohy194kj9m] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--cli-border);
    background: linear-gradient(135deg, var(--cli-info-light) 0%, var(--cli-card) 100%);
}

.cli-filtros-header h3[b-ohy194kj9m] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--cli-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.cli-filtros-header h3 .rzi[b-ohy194kj9m] {
    color: var(--cli-info);
    font-size: 1.1rem;
}

.cli-filtros-close-btn[b-ohy194kj9m] {
    background: none;
    border: none;
    color: var(--cli-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--cli-radius-xs);
    transition: var(--cli-transition);
    display: flex;
    align-items: center;
}

.cli-filtros-close-btn:hover[b-ohy194kj9m] {
    background: var(--cli-danger-light);
    color: var(--cli-danger);
}

.cli-filtros-body[b-ohy194kj9m] {
    padding: 12px 16px;
}

.cli-filtros-grid[b-ohy194kj9m] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
}

.cli-filtro-field[b-ohy194kj9m] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.cli-filtro-label[b-ohy194kj9m] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--cli-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Input nativo del buscador en tiempo real (mismo aspecto que los inputs Radzen del panel) */
.cli-filtro-input[b-ohy194kj9m] {
    border: 1.5px solid #CBD5E1;
    border-radius: var(--cli-radius-xs);
    font-size: 0.8rem;
    height: 32px;
    padding: 0 10px;
    font-family: inherit;
    color: var(--cli-text);
    background: white;
    outline: none;
    transition: var(--cli-transition);
    box-sizing: border-box;
    width: 100%;
}

.cli-filtro-input:focus[b-ohy194kj9m] {
    border-color: var(--cli-primary);
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

.cli-filtro-field[b-ohy194kj9m]  .rz-textbox,
.cli-filtro-field[b-ohy194kj9m]  .rz-numeric,
.cli-filtro-field[b-ohy194kj9m]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cli-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cli-transition);
    background: white !important;
}

.cli-filtro-field[b-ohy194kj9m]  .rz-textbox:focus,
.cli-filtro-field[b-ohy194kj9m]  .rz-state-focused,
.cli-filtro-field[b-ohy194kj9m]  input:focus,
.cli-filtro-field[b-ohy194kj9m]  .rz-numeric:focus-within {
    border-color: var(--cli-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

.cli-filtros-actions[b-ohy194kj9m] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 12px;
}

/* ===== CONTENEDOR DE LA GRILLA ===== */
.cli-grid-wrapper[b-ohy194kj9m] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--cli-card);
    border-radius: var(--cli-radius);
    box-shadow: var(--cli-shadow);
    overflow: hidden;
    min-height: 0;
    border: 1px solid var(--cli-border);
    animation: cliSlideUp-b-ohy194kj9m 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ===== BOTONES DE ACCIÓN EN LA GRILLA ===== */
.cli-action-group[b-ohy194kj9m] {
    display: flex;
    gap: 4px;
    justify-content: center;
    align-items: center;
}

.cli-action-btn[b-ohy194kj9m] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--cli-radius-xs);
    cursor: pointer;
    transition: var(--cli-transition);
    padding: 0;
    color: white;
    font-size: 0.85rem;
}

.cli-action-btn .rzi[b-ohy194kj9m] {
    font-size: 0.9rem;
}

.cli-action-btn:hover[b-ohy194kj9m] {
    transform: scale(1.12);
    box-shadow: var(--cli-shadow-md);
}

.cli-action-btn:active[b-ohy194kj9m] {
    transform: scale(0.95);
}

.cli-action-btn.detail[b-ohy194kj9m] {
    background: var(--color-detail);
}

.cli-action-btn.detail:hover[b-ohy194kj9m] {
    background: var(--color-detail-dark);
}

.cli-action-btn.edit[b-ohy194kj9m] {
    background: var(--cli-info);
}

.cli-action-btn.edit:hover[b-ohy194kj9m] {
    background: #0284C7;
}

.cli-action-btn.delete[b-ohy194kj9m] {
    background: var(--cli-danger);
}

.cli-action-btn.delete:hover[b-ohy194kj9m] {
    background: #DC2626;
}

/* ===== ESTADO DE CARGA (SKELETON) ===== */
.cli-loading[b-ohy194kj9m] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    gap: 16px;
    background: var(--cli-bg);
    animation: cliFadeIn-b-ohy194kj9m 0.3s ease;
}

.cli-spinner[b-ohy194kj9m] {
    width: 40px;
    height: 40px;
    border: 3px solid var(--cli-border);
    border-top-color: var(--cli-primary);
    border-radius: 50%;
    animation: cliSpin-b-ohy194kj9m 0.8s linear infinite;
}

.cli-loading-text[b-ohy194kj9m] {
    font-size: 0.85rem;
    color: var(--cli-text-secondary);
    font-weight: 500;
}

/* ===== ESTILOS DE LA GRILLA RADZEN ===== */
[b-ohy194kj9m] .rz-datatable {
    border: none !important;
}

[b-ohy194kj9m] .rz-datatable-thead > tr > th {
    background: var(--cli-bg) !important;
    color: var(--cli-text-secondary) !important;
    font-size: 0.7rem !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    border-bottom: 1px solid var(--cli-border) !important;
    padding: 10px 12px !important;
}

[b-ohy194kj9m] .rz-datatable-tbody > tr {
    transition: var(--cli-transition);
}

[b-ohy194kj9m] .rz-datatable-tbody > tr:hover {
    background: var(--cli-primary-light) !important;
}

[b-ohy194kj9m] .rz-datatable-tbody > tr > td {
    border-bottom: 1px dashed #F1F5F9 !important;
    font-size: 0.78rem !important;
    color: var(--cli-text) !important;
    padding: 8px 12px !important;
}

[b-ohy194kj9m] .rz-pager {
    border-top: 1px solid var(--cli-border) !important;
    padding: 6px 12px !important;
}

/* ===== BADGE CONTADOR ===== */
.cli-badge[b-ohy194kj9m] {
    background: var(--cli-primary);
    color: white;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 2px 10px;
    border-radius: 20px;
    min-width: 24px;
    text-align: center;
    animation: cliBadgePop-b-ohy194kj9m 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* ===== ANIMACIONES ===== */
@keyframes cliFadeIn-b-ohy194kj9m {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes cliSlideUp-b-ohy194kj9m {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes cliSpin-b-ohy194kj9m {
    to { transform: rotate(360deg); }
}

@keyframes cliSlideDown-b-ohy194kj9m {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

@keyframes cliBadgePop-b-ohy194kj9m {
    0% { transform: scale(0.5); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .cli-container[b-ohy194kj9m] {
        padding: 10px;
        gap: 8px;
    }

    .cli-header[b-ohy194kj9m] {
        padding: 10px 14px;
    }

    .cli-header h2[b-ohy194kj9m] {
        font-size: 0.95rem;
    }
}

@media (max-width: 640px) {
    .cli-container[b-ohy194kj9m] {
        padding: 8px;
    }

    .cli-header-subtitle[b-ohy194kj9m] {
        display: none;
    }

    .cli-btn[b-ohy194kj9m] {
        padding: 7px 14px;
        font-size: 0.78rem;
    }
}

.cli-btn .rzi[b-ohy194kj9m] {
    font-size: 1rem;
}

/* Chips de Tipo(s) en la grilla (un cliente puede tener varios tipos) */
.cli-tipos[b-ohy194kj9m] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
}

.cli-tipo-chip[b-ohy194kj9m] {
    display: inline-flex;
    align-items: center;
    padding: 1px 8px;
    border-radius: var(--radius-full);
    background: var(--color-primary-light);
    color: var(--color-primary-dark);
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    line-height: 1.6;
    white-space: nowrap;
}
/* /Pages/Mantenedores/Clientes/Componentes/CargaMasivaClientesModal.razor.rz.scp.css */
/* ===== MODAL CARGA MASIVA DE CLIENTES ===== */

.cmc-modal[b-z7yhwy4xts] {
    --cmc-primary: var(--color-primary);
    --cmc-primary-light: var(--color-primary-light);
    --cmc-success: var(--color-success);
    --cmc-success-light: var(--color-success-light);
    --cmc-danger: var(--color-danger);
    --cmc-danger-light: var(--color-danger-light);
    --cmc-info: var(--color-info);
    --cmc-info-light: var(--color-info-light);
    --cmc-border: var(--border);
    --cmc-bg: #F8FAFC;
    --cmc-card: var(--surface);
    --cmc-text: var(--text);
    --cmc-text-secondary: var(--text-secondary);
    --cmc-radius-xs: var(--radius-sm);
    --cmc-radius-sm: var(--radius-md);
    --cmc-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    background: var(--cmc-bg);
    font-family: var(--font-family);
    position: relative;
}

.cmc-loading-overlay[b-z7yhwy4xts] {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    z-index: 20;
    color: var(--cmc-text-secondary);
    font-weight: 600;
    font-size: 0.9rem;
}

.cmc-loading-spinner[b-z7yhwy4xts] {
    width: 42px;
    height: 42px;
    border: 4px solid var(--cmc-border);
    border-top-color: var(--cmc-primary);
    border-radius: 50%;
    animation: cmcSpin-b-z7yhwy4xts 0.8s linear infinite;
}

@keyframes cmcSpin-b-z7yhwy4xts {
    to { transform: rotate(360deg); }
}

.cmc-body[b-z7yhwy4xts] {
    flex: 1;
    overflow-y: auto;
    padding: 16px 20px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.cmc-info[b-z7yhwy4xts] {
    display: flex;
    gap: 10px;
    padding: 10px 14px;
    background: var(--cmc-info-light);
    border-left: 3px solid var(--cmc-info);
    border-radius: var(--cmc-radius-xs);
    font-size: 0.82rem;
    color: var(--cmc-text);
}

.cmc-info code[b-z7yhwy4xts] {
    background: rgba(0,0,0,0.06);
    padding: 1px 5px;
    border-radius: 4px;
    font-family: 'Consolas', monospace;
    font-size: 0.78rem;
}

.cmc-info .rzi[b-z7yhwy4xts] {
    color: var(--cmc-info);
    font-size: 1.2rem;
    flex-shrink: 0;
}

/* ===== SELECTOR DE ARCHIVO ===== */
.cmc-file-picker[b-z7yhwy4xts] {
    display: flex;
}

.cmc-file-label[b-z7yhwy4xts] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border: 2px dashed var(--cmc-border);
    border-radius: var(--cmc-radius-sm);
    background: var(--cmc-card);
    cursor: pointer;
    transition: var(--cmc-transition);
    color: var(--cmc-text-secondary);
    font-size: 0.85rem;
    font-weight: 600;
}

.cmc-file-label:hover[b-z7yhwy4xts] {
    border-color: var(--cmc-primary);
    background: rgba(99, 102, 241, 0.05);
    color: var(--cmc-primary);
}

.cmc-file-label .rzi[b-z7yhwy4xts] {
    font-size: 1.3rem;
}

.cmc-input-hidden[b-z7yhwy4xts] {
    display: none;
}

/* ===== STATS ===== */
.cmc-stats[b-z7yhwy4xts] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

.cmc-stat[b-z7yhwy4xts] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-radius: var(--cmc-radius-sm);
    background: var(--cmc-card);
    border: 1px solid var(--cmc-border);
}

.cmc-stat .rzi[b-z7yhwy4xts] {
    font-size: 1.6rem;
}

.cmc-stat-value[b-z7yhwy4xts] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--cmc-text);
}

.cmc-stat-label[b-z7yhwy4xts] {
    font-size: 0.7rem;
    color: var(--cmc-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.cmc-stat-ok[b-z7yhwy4xts] { border-left: 3px solid var(--cmc-success); }
.cmc-stat-ok .rzi[b-z7yhwy4xts] { color: var(--cmc-success); }
.cmc-stat-err[b-z7yhwy4xts] { border-left: 3px solid var(--cmc-danger); }
.cmc-stat-err .rzi[b-z7yhwy4xts] { color: var(--cmc-danger); }
.cmc-stat-total[b-z7yhwy4xts] { border-left: 3px solid var(--cmc-primary); }
.cmc-stat-total .rzi[b-z7yhwy4xts] { color: var(--cmc-primary); }

/* ===== PREVIEW TABLE ===== */
.cmc-preview[b-z7yhwy4xts] {
    max-height: 280px;
    overflow: auto;
    background: var(--cmc-card);
    border: 1px solid var(--cmc-border);
    border-radius: var(--cmc-radius-sm);
}

.cmc-preview-table[b-z7yhwy4xts] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.78rem;
}

.cmc-preview-table thead th[b-z7yhwy4xts] {
    position: sticky;
    top: 0;
    background: var(--cmc-bg);
    color: var(--cmc-text-secondary);
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 8px 10px;
    text-align: left;
    border-bottom: 1px solid var(--cmc-border);
}

.cmc-preview-table tbody td[b-z7yhwy4xts] {
    padding: 6px 10px;
    border-bottom: 1px dashed #F1F5F9;
    color: var(--cmc-text);
}

.cmc-row-err[b-z7yhwy4xts] {
    background: var(--cmc-danger-light);
}

.cmc-icon-ok[b-z7yhwy4xts] {
    color: var(--cmc-success);
    font-size: 1rem;
}

.cmc-icon-err[b-z7yhwy4xts] {
    color: var(--cmc-danger);
    font-size: 1rem;
}

.cmc-errores-cell[b-z7yhwy4xts] {
    color: var(--cmc-danger);
    font-size: 0.75rem;
    max-width: 220px;
}

/* ===== RESUMEN ===== */
.cmc-resumen[b-z7yhwy4xts] {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 10px 14px;
    background: var(--cmc-card);
    border: 1px solid var(--cmc-border);
    border-radius: var(--cmc-radius-sm);
    font-size: 0.85rem;
}

.cmc-txt-ok[b-z7yhwy4xts] { color: var(--cmc-success); font-weight: 700; }
.cmc-txt-err[b-z7yhwy4xts] { color: var(--cmc-danger); font-weight: 700; }

/* ===== FOOTER ===== */
.cmc-footer[b-z7yhwy4xts] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 10px 16px;
    border-top: 1px solid var(--cmc-border);
    background: var(--cmc-card);
    flex-shrink: 0;
}

.cmc-btn[b-z7yhwy4xts] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cmc-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    color: white;
    transition: var(--cmc-transition);
}

.cmc-btn:hover:not(:disabled)[b-z7yhwy4xts] {
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.cmc-btn:disabled[b-z7yhwy4xts] {
    opacity: 0.55;
    cursor: not-allowed;
}

.cmc-btn-secondary[b-z7yhwy4xts] {
    background: var(--color-secondary);
}

.cmc-btn-secondary:hover:not(:disabled)[b-z7yhwy4xts] {
    background: var(--color-secondary-dark);
}

.cmc-btn-primary[b-z7yhwy4xts] {
    background: var(--cmc-success);
}

.cmc-btn .rzi[b-z7yhwy4xts] {
    font-size: 1rem;
}
/* /Pages/Mantenedores/Clientes/Componentes/ClienteDetalle.razor.rz.scp.css */
/* ===== CLIENTE DETALLE - ESTILOS DEL DIÁLOGO ===== */

/* Contenedor principal del detalle */
.detalle-container[b-flir30xx3v] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    font-family: var(--font-family);
    animation: detalleIn-b-flir30xx3v 0.3s ease;
}

/* ===== TARJETA DE INFORMACIÓN BÁSICA ===== */
.detalle-info-card[b-flir30xx3v] {
    background: linear-gradient(135deg, #EEF2FF 0%, #FFFFFF 100%);
    border-radius: 10px;
    padding: 16px 20px;
    border: 1px solid #E2E8F0;
}

.detalle-info-grid[b-flir30xx3v] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.detalle-field[b-flir30xx3v] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.detalle-field-label[b-flir30xx3v] {
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.detalle-field-value[b-flir30xx3v] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1E293B;
    word-break: break-word;
}

/* ===== TARJETA CON TABS ===== */
.detalle-tabs-card[b-flir30xx3v] {
    background: #FFFFFF;
    border-radius: 10px;
    border: 1px solid #E2E8F0;
    overflow: hidden;
}

/* Navegación de tabs */
.detalle-tabs-nav[b-flir30xx3v] {
    display: flex;
    gap: 4px;
    padding: 10px 16px;
    border-bottom: 1px solid #E2E8F0;
    background: #F8FAFC;
}

.detalle-tab-btn[b-flir30xx3v] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    background: transparent;
    color: var(--text-secondary);
    font-size: 0.78rem;
    font-weight: 600;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.detalle-tab-btn:hover[b-flir30xx3v] {
    background: #EEF2FF;
    color: #6366F1;
}

.detalle-tab-btn.active[b-flir30xx3v] {
    background: #6366F1;
    color: white;
}

.detalle-tab-btn .rzi[b-flir30xx3v],
.detalle-close-btn .rzi[b-flir30xx3v] {
    font-size: 1rem;
}

/* Contenido de los tabs */
.detalle-tab-content[b-flir30xx3v] {
    padding: 16px 20px;
    min-height: 130px;
    animation: detalleTabFade-b-flir30xx3v 0.25s ease;
}

.detalle-tab-grid[b-flir30xx3v] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

/* ===== BOTÓN DE CERRAR ===== */
.detalle-footer[b-flir30xx3v] {
    display: flex;
    justify-content: flex-end;
    padding-top: 4px;
}

.detalle-close-btn[b-flir30xx3v] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 20px;
    border: none;
    background: var(--color-secondary);
    color: #fff;
    font-size: 0.82rem;
    font-weight: 600;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.detalle-close-btn:hover[b-flir30xx3v] {
    background: var(--color-secondary-dark);
    color: #fff;
}

.detalle-close-btn .rzi[b-flir30xx3v] {
    font-size: 1.1rem;
}

/* ===== ANIMACIONES ===== */
@keyframes detalleIn-b-flir30xx3v {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes detalleTabFade-b-flir30xx3v {
    from { opacity: 0; transform: translateY(4px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 640px) {
    .detalle-info-grid[b-flir30xx3v],
    .detalle-tab-grid[b-flir30xx3v] {
        grid-template-columns: 1fr;
    }

    .detalle-tabs-nav[b-flir30xx3v] {
        overflow-x: auto;
    }
}
/* /Pages/Mantenedores/Clientes/Componentes/ClienteFormulario.razor.rz.scp.css */
/* ===== CLIENTE FORMULARIO - ESTILOS DEL DIÁLOGO (CREAR / EDITAR) ===== */

/* Contenedor principal del formulario */
.form-container[b-ytfqnxbzvz] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    font-family: var(--font-family);
    animation: formIn-b-ytfqnxbzvz 0.3s ease;
}

/* ===== TARJETA DE CAMPOS PRINCIPALES ===== */
.form-main-card[b-ytfqnxbzvz] {
    background: linear-gradient(135deg, #EEF2FF 0%, #FFFFFF 100%);
    border-radius: 10px;
    padding: 16px 20px;
    border: 1px solid #E2E8F0;
}

.form-fields-grid[b-ytfqnxbzvz] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 16px;
}

.form-field[b-ytfqnxbzvz] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.form-field.full-width[b-ytfqnxbzvz] {
    grid-column: 1 / -1;
}

.form-field-label[b-ytfqnxbzvz] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* Inputs personalizados dentro del formulario - bordes visibles sutiles */
.form-field[b-ytfqnxbzvz]  .rz-textbox,
.form-field[b-ytfqnxbzvz]  .rz-dropdown,
.form-field[b-ytfqnxbzvz]  .rz-spinner,
.form-field[b-ytfqnxbzvz]  .rz-inputtext,
.form-field[b-ytfqnxbzvz]  .rz-dropdown-trigger,
.form-field[b-ytfqnxbzvz]  input,
.form-field[b-ytfqnxbzvz]  .rz-numeric {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: 8px !important;
    font-size: 0.78rem !important;
    height: 30px !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    background: white !important;
}

.form-field[b-ytfqnxbzvz]  .rz-textbox:focus,
.form-field[b-ytfqnxbzvz]  .rz-state-focused,
.form-field[b-ytfqnxbzvz]  input:focus,
.form-field[b-ytfqnxbzvz]  .rz-numeric:focus-within {
    border-color: #6366F1 !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

/* Asegurar que dropdowns cerrados muestren borde */
.form-field[b-ytfqnxbzvz]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
}

/* ===== TARJETA CON TABS ===== */
.form-tabs-card[b-ytfqnxbzvz] {
    background: #FFFFFF;
    border-radius: 10px;
    border: 1px solid #E2E8F0;
    overflow: hidden;
}

/* Navegación de tabs */
.form-tabs-nav[b-ytfqnxbzvz] {
    display: flex;
    gap: 4px;
    padding: 10px 16px;
    border-bottom: 1px solid #E2E8F0;
    background: #F8FAFC;
}

.form-tab-btn[b-ytfqnxbzvz] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    background: transparent;
    color: var(--text-secondary);
    font-size: 0.78rem;
    font-weight: 600;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.form-tab-btn:hover[b-ytfqnxbzvz] {
    background: #EEF2FF;
    color: #6366F1;
}

.form-tab-btn.active[b-ytfqnxbzvz] {
    background: #6366F1;
    color: white;
}

.form-tab-btn .rzi[b-ytfqnxbzvz],
.form-btn .rzi[b-ytfqnxbzvz] {
    font-size: 1rem;
}

/* Contenido de los tabs */
.form-tab-content[b-ytfqnxbzvz] {
    padding: 16px 20px;
    min-height: 140px;
    animation: formTabFade-b-ytfqnxbzvz 0.25s ease;
}

.form-tab-grid[b-ytfqnxbzvz] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 16px;
}

/* ===== FOOTER CON BOTONES ===== */
.form-footer[b-ytfqnxbzvz] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding-top: 4px;
}

.form-btn[b-ytfqnxbzvz] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: 8px;
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.form-btn .rzi[b-ytfqnxbzvz] {
    font-size: 1.1rem;
}

.form-btn-save[b-ytfqnxbzvz] {
    background: var(--color-success);
    color: white;
}

.form-btn-save:hover[b-ytfqnxbzvz] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.form-btn-cancel[b-ytfqnxbzvz] {
    background: var(--color-secondary);
    color: #fff;
    border: none;
}

.form-btn-cancel:hover[b-ytfqnxbzvz] {
    background: var(--color-secondary-dark);
    color: #fff;
}

/* ===== ANIMACIONES ===== */
@keyframes formIn-b-ytfqnxbzvz {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes formTabFade-b-ytfqnxbzvz {
    from { opacity: 0; transform: translateY(4px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 640px) {
    .form-fields-grid[b-ytfqnxbzvz],
    .form-tab-grid[b-ytfqnxbzvz] {
        grid-template-columns: 1fr;
    }

    .form-tabs-nav[b-ytfqnxbzvz] {
        overflow-x: auto;
    }

    .form-field.full-width[b-ytfqnxbzvz] {
        grid-column: auto;
    }
}
/* /Pages/Mantenedores/MantenedorGrupo/Componentes/EliminarRolConfirm.razor.rz.scp.css */
/* ===== MODAL ADVERTENCIA ELIMINAR ROL =====
   Usa los tokens globales (design-tokens.css).
   ============================================= */

.erc-modal[b-axhn7mshhh] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    background: var(--bg);
    font-family: var(--font-family);
}

.erc-body[b-axhn7mshhh] {
    flex: 1;
    overflow-y: auto;
    padding: var(--space-5);
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.erc-warning[b-axhn7mshhh] {
    display: flex;
    gap: var(--space-3);
    align-items: flex-start;
}

.erc-warning-icon[b-axhn7mshhh] {
    color: var(--color-danger);
    font-size: 1.6rem;
    flex-shrink: 0;
}

.erc-warning-title[b-axhn7mshhh] {
    margin: 0 0 var(--space-1) 0;
    font-size: var(--text-base);
    color: var(--text);
    font-weight: var(--fw-medium);
}

.erc-warning-text[b-axhn7mshhh] {
    margin: 0;
    font-size: var(--text-sm);
    color: var(--text-secondary);
    line-height: 1.4;
}

.erc-afectados[b-axhn7mshhh] {
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--surface);
    overflow: hidden;
}

.erc-afectados-header[b-axhn7mshhh] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    background: var(--bg);
    border-bottom: 1px solid var(--border);
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    color: var(--text);
}

.erc-afectados-header .rzi[b-axhn7mshhh] {
    color: var(--color-warning);
    font-size: 1.1rem;
}

.erc-afectados-list[b-axhn7mshhh] {
    list-style: none;
    margin: 0;
    padding: var(--space-2);
    max-height: 220px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.erc-afectado-item[b-axhn7mshhh] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    color: var(--text);
}

.erc-afectado-item:nth-child(odd)[b-axhn7mshhh] {
    background: var(--bg);
}

.erc-afectado-item .rzi[b-axhn7mshhh] {
    color: var(--text-muted);
    font-size: 1rem;
    flex-shrink: 0;
}

.erc-afectado-nombre[b-axhn7mshhh] {
    font-weight: var(--fw-medium);
}

.erc-afectado-login[b-axhn7mshhh] {
    margin-left: auto;
    font-size: var(--text-xs);
    color: var(--text-secondary);
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: var(--radius-full);
    padding: 1px var(--space-2);
}

.erc-sin-afectados[b-axhn7mshhh] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3);
    border-radius: var(--radius-md);
    background: var(--surface);
    border: 1px dashed var(--border);
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.erc-sin-afectados .rzi[b-axhn7mshhh] {
    color: var(--color-info);
    font-size: 1.1rem;
}

.erc-footer[b-axhn7mshhh] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    border-top: 1px solid var(--border);
    background: var(--surface);
    flex-shrink: 0;
}

.erc-btn[b-axhn7mshhh] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    cursor: pointer;
    color: white;
    transition: var(--transition);
}

.erc-btn:hover[b-axhn7mshhh] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
}

.erc-btn .rzi[b-axhn7mshhh] { font-size: 1rem; }

.erc-btn-secondary[b-axhn7mshhh] { background: var(--color-secondary); }
.erc-btn-secondary:hover[b-axhn7mshhh] { background: var(--color-secondary-dark); }

.erc-btn-danger[b-axhn7mshhh] { background: var(--color-danger); }
.erc-btn-danger:hover[b-axhn7mshhh] { background: var(--color-danger-dark); }
/* /Pages/Mantenedores/MantenedorGrupo/Componentes/GrupoFormulario.razor.rz.scp.css */
/* ===== MODAL CREAR/EDITAR GRUPO =====
   Mismo patron visual que
   AdminListPrecio/Componentes/ListaPrecioFormulario.
   ============================================= */

.gpf-modal[b-9b55ex2tln] {
    --gpf-primary: var(--color-primary);
    --gpf-border: var(--border);
    --gpf-bg: #F8FAFC;
    --gpf-card: var(--surface);
    --gpf-text: var(--text);
    --gpf-text-secondary: var(--text-secondary);
    --gpf-text-muted: var(--text-muted);
    --gpf-radius-xs: var(--radius-sm);
    --gpf-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    background: var(--gpf-bg);
    font-family: var(--font-family);
    position: relative;
}

.gpf-loading-overlay[b-9b55ex2tln] {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    z-index: 10;
    color: var(--gpf-text-secondary);
    font-weight: 600;
    font-size: 0.85rem;
}

.gpf-loading-spinner[b-9b55ex2tln] {
    width: 42px;
    height: 42px;
    border: 4px solid var(--gpf-border);
    border-top-color: var(--gpf-primary);
    border-radius: 50%;
    animation: gpfSpin-b-9b55ex2tln 0.8s linear infinite;
}

@keyframes gpfSpin-b-9b55ex2tln {
    to { transform: rotate(360deg); }
}

.gpf-body[b-9b55ex2tln] {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
}

.gpf-grid[b-9b55ex2tln] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px 16px;
}

.gpf-field[b-9b55ex2tln] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.gpf-label[b-9b55ex2tln] {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--gpf-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.gpf-required[b-9b55ex2tln] { color: var(--color-danger); font-weight: 700; }

.gpf-hint[b-9b55ex2tln] {
    font-size: 0.7rem;
    color: var(--gpf-text-muted);
    font-style: italic;
}

.gpf-field[b-9b55ex2tln]  .rz-textbox,
.gpf-field[b-9b55ex2tln]  .rz-inputtext,
.gpf-field[b-9b55ex2tln]  input,
.gpf-field[b-9b55ex2tln]  .rz-spinner,
.gpf-field[b-9b55ex2tln]  .rz-numeric {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--gpf-radius-xs) !important;
    font-size: 0.85rem !important;
    height: 36px !important;
    background: white !important;
    transition: var(--gpf-transition);
}

.gpf-field[b-9b55ex2tln]  .rz-textbox:focus,
.gpf-field[b-9b55ex2tln]  .rz-state-focused,
.gpf-field[b-9b55ex2tln]  input:focus,
.gpf-field[b-9b55ex2tln]  .rz-numeric:focus-within {
    border-color: var(--gpf-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
    outline: none;
}

.gpf-field[b-9b55ex2tln]  input[disabled],
.gpf-field[b-9b55ex2tln]  .rz-state-disabled {
    background: #F8FAFC !important;
    color: var(--gpf-text-secondary) !important;
    cursor: not-allowed;
}

.gpf-footer[b-9b55ex2tln] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding: 10px 16px;
    border-top: 1px solid var(--gpf-border);
    background: var(--gpf-card);
    flex-shrink: 0;
}

.gpf-readonly-note[b-9b55ex2tln] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-right: auto;
    font-size: 0.72rem;
    color: var(--gpf-text-secondary);
    font-style: italic;
}

.gpf-readonly-note .rzi[b-9b55ex2tln] {
    color: var(--color-danger);
    font-size: 0.95rem;
}

.gpf-btn[b-9b55ex2tln] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--gpf-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    color: white;
    transition: var(--gpf-transition);
}

.gpf-btn:hover:not(:disabled)[b-9b55ex2tln] {
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.gpf-btn:disabled[b-9b55ex2tln] {
    opacity: 0.6;
    cursor: not-allowed;
}

.gpf-btn-secondary[b-9b55ex2tln] { background: var(--color-secondary); }
.gpf-btn-secondary:hover:not(:disabled)[b-9b55ex2tln] { background: var(--color-secondary-dark); }

.gpf-btn-primary[b-9b55ex2tln] { background: var(--color-success); }

.gpf-btn .rzi[b-9b55ex2tln] { font-size: 1rem; }
/* /Pages/Mantenedores/MantenedorGrupo/MantenedorGrupoIndex.razor.rz.scp.css */
/* ===== MANTENEDOR DE GRUPOS - DESIGN SYSTEM =====
   Estructura canonica: barra de control + filtros
   colapsables + grilla a ancho completo. El alta/edicion
   vive en el modal Componentes/GrupoFormulario. Misma
   paleta y patrones que AdminListPrecio. Estilos scoped.
   ============================================= */

.ms-container[b-sfif6sz7gq] {
    --ms-primary: var(--color-primary);
    --ms-primary-dark: var(--color-primary-dark);
    --ms-primary-light: var(--color-primary-light);
    --ms-accent: var(--color-warning);
    --ms-success: var(--color-success);
    --ms-success-light: var(--color-success-light);
    --ms-danger: var(--color-danger);
    --ms-danger-light: var(--color-danger-light);
    --ms-info: var(--color-info);
    --ms-info-light: var(--color-info-light);
    --ms-orange: var(--color-accent);
    --ms-bg: var(--bg);
    --ms-card: var(--surface);
    --ms-text: var(--text);
    --ms-text-secondary: var(--text-secondary);
    --ms-text-muted: var(--text-muted);
    --ms-border: var(--border);
    --ms-shadow-sm: var(--shadow-xs);
    --ms-shadow: var(--shadow-sm);
    --ms-shadow-md: var(--shadow-md);
    --ms-radius: var(--radius-lg);
    --ms-radius-sm: var(--radius-md);
    --ms-radius-xs: var(--radius-sm);
    --ms-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--ms-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.ms-control-bar[b-sfif6sz7gq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--ms-card);
    border-radius: var(--ms-radius);
    box-shadow: var(--ms-shadow);
    padding: 10px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 56px;
}

.ms-control-left[b-sfif6sz7gq] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.ms-header-icon[b-sfif6sz7gq] {
    width: 38px;
    height: 38px;
    border-radius: var(--ms-radius-sm);
    background: linear-gradient(135deg, var(--ms-primary) 0%, var(--ms-primary-dark) 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--ms-shadow-sm);
}

.ms-header-icon .rzi[b-sfif6sz7gq] { font-size: 1.25rem; }

.ms-title[b-sfif6sz7gq] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--ms-text);
    margin: 0;
    line-height: 1.2;
}

.ms-subtitle[b-sfif6sz7gq] {
    font-size: 0.72rem;
    color: var(--ms-text-secondary);
    margin: 2px 0 0;
}

.ms-master-hint[b-sfif6sz7gq] {
    color: var(--ms-danger);
    font-style: italic;
    font-weight: 600;
}

.ms-control-center[b-sfif6sz7gq] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ms-loading-indicator[b-sfif6sz7gq] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: msFadeIn-b-sfif6sz7gq 0.3s ease;
}

.ms-loading-spinner[b-sfif6sz7gq] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--ms-border);
    border-top-color: var(--ms-primary);
    border-radius: 50%;
    animation: msSpin-b-sfif6sz7gq 0.8s linear infinite;
}

.ms-loading-text[b-sfif6sz7gq] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--ms-primary);
    animation: msPulse-b-sfif6sz7gq 1.5s ease-in-out infinite;
}

.ms-control-right[b-sfif6sz7gq] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES ===== */
.ms-btn[b-sfif6sz7gq] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--ms-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--ms-transition);
    white-space: nowrap;
    color: white;
}

.ms-btn:hover:not(:disabled)[b-sfif6sz7gq] {
    transform: translateY(-1px);
    box-shadow: var(--ms-shadow-md);
}

.ms-btn:active:not(:disabled)[b-sfif6sz7gq] { transform: translateY(0); }
.ms-btn:disabled[b-sfif6sz7gq] { opacity: 0.6; cursor: not-allowed; }
.ms-btn .rzi[b-sfif6sz7gq] { font-size: 1rem; }

.ms-btn-filtros[b-sfif6sz7gq] { background: var(--ms-info); }
.ms-btn-filtros.active[b-sfif6sz7gq] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

.ms-btn-buscar[b-sfif6sz7gq] { background: var(--ms-orange); }
.ms-btn-nuevo[b-sfif6sz7gq]  { background: var(--color-primary); }

/* ===== FILTROS ===== */
.ms-filtros-wrapper[b-sfif6sz7gq] { position: relative; flex-shrink: 0; }

.ms-filtros-panel[b-sfif6sz7gq] {
    background: var(--ms-card);
    border-radius: var(--ms-radius);
    box-shadow: var(--ms-shadow-md);
    overflow: hidden;
    animation: msSlideDown-b-sfif6sz7gq 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.ms-filtros-header[b-sfif6sz7gq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--ms-border);
    background: linear-gradient(135deg, var(--ms-info-light) 0%, var(--ms-card) 100%);
}

.ms-filtros-header h3[b-sfif6sz7gq] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--ms-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.ms-filtros-header h3 .rzi[b-sfif6sz7gq] { color: var(--ms-info); font-size: 1.1rem; }

.ms-filtros-close-btn[b-sfif6sz7gq] {
    background: none;
    border: none;
    color: var(--ms-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--ms-radius-xs);
    transition: var(--ms-transition);
    display: flex;
    align-items: center;
}
.ms-filtros-close-btn:hover[b-sfif6sz7gq] { background: var(--ms-danger-light); color: var(--ms-danger); }

.ms-filtros-body[b-sfif6sz7gq] { padding: 12px 16px; }

.ms-filtros-grid[b-sfif6sz7gq] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.ms-filtro-ancho[b-sfif6sz7gq] { grid-column: span 2; min-width: 280px; }

.ms-filtro-field[b-sfif6sz7gq] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.ms-filtro-label[b-sfif6sz7gq] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--ms-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.ms-filtro-field[b-sfif6sz7gq]  .rz-textbox,
.ms-filtro-field[b-sfif6sz7gq]  .rz-inputtext,
.ms-filtro-field[b-sfif6sz7gq]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--ms-radius-xs) !important;
    font-size: 0.78rem !important;
    height: 32px !important;
    transition: var(--ms-transition);
    background: white !important;
}

.ms-filtro-field[b-sfif6sz7gq]  .rz-textbox:focus,
.ms-filtro-field[b-sfif6sz7gq]  .rz-state-focused,
.ms-filtro-field[b-sfif6sz7gq]  input:focus {
    border-color: var(--ms-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

/* ===== SECTION HEADER ===== */
.ms-section-header[b-sfif6sz7gq] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--ms-border);
    background: linear-gradient(135deg, var(--ms-primary-light) 0%, var(--ms-card) 100%);
}

.ms-section-header h3[b-sfif6sz7gq] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--ms-text);
    margin: 0;
}

.ms-section-header .rzi[b-sfif6sz7gq] {
    color: var(--ms-primary);
    font-size: 1.1rem;
}

.ms-section-count[b-sfif6sz7gq] {
    margin-left: auto;
    font-size: 0.7rem;
    color: var(--ms-text-secondary);
    background: var(--ms-bg);
    border-radius: 999px;
    padding: 2px 10px;
    font-weight: 600;
}

/* ===== GRILLA (ancho completo) ===== */
.ms-grid-wrapper[b-sfif6sz7gq] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--ms-card);
    border-radius: var(--ms-radius);
    box-shadow: var(--ms-shadow);
    overflow: hidden;
    min-height: 0;
}

[b-sfif6sz7gq] .ms-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

[b-sfif6sz7gq] .ms-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--ms-bg) !important;
    color: var(--ms-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--ms-border) !important;
}

[b-sfif6sz7gq] .ms-grid-wrapper .rz-datatable-tbody > tr { transition: background-color 0.15s ease; }
[b-sfif6sz7gq] .ms-grid-wrapper .rz-datatable-tbody > tr:hover { background-color: var(--ms-primary-light) !important; }
[b-sfif6sz7gq] .ms-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* Botones de accion en filas */
.ms-action-group[b-sfif6sz7gq] { display: flex; gap: 6px; justify-content: center; }

.ms-action-btn[b-sfif6sz7gq] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--ms-radius-xs);
    cursor: pointer;
    transition: var(--ms-transition);
    padding: 0;
    color: white;
}
.ms-action-btn .rzi[b-sfif6sz7gq] { font-size: 0.9rem; }
.ms-action-btn:hover[b-sfif6sz7gq]  { transform: scale(1.12); box-shadow: var(--ms-shadow-md); }
.ms-action-btn:active[b-sfif6sz7gq] { transform: scale(0.95); }
.ms-action-btn.edit[b-sfif6sz7gq]   { background: var(--ms-info); }
.ms-action-btn.edit:hover[b-sfif6sz7gq]   { background: #0284C7; }
.ms-action-btn.delete[b-sfif6sz7gq] { background: var(--ms-danger); }
.ms-action-btn.delete:hover[b-sfif6sz7gq] { background: #DC2626; }

/* ===== ANIMACIONES ===== */
@keyframes msSpin-b-sfif6sz7gq { to { transform: rotate(360deg); } }

@keyframes msPulse-b-sfif6sz7gq {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.5; }
}

@keyframes msFadeIn-b-sfif6sz7gq {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes msSlideDown-b-sfif6sz7gq {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to   { opacity: 1; transform: translateY(0); max-height: 500px; }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .ms-container[b-sfif6sz7gq] { padding: 8px 10px; gap: 8px; }
    .ms-control-bar[b-sfif6sz7gq] { flex-wrap: wrap; padding: 8px 12px; }
    .ms-control-center[b-sfif6sz7gq] { order: 3; width: 100%; }
    .ms-filtro-ancho[b-sfif6sz7gq] { grid-column: span 1; min-width: 0; }
    .ms-filtros-grid[b-sfif6sz7gq] { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
}

@media (max-width: 640px) {
    .ms-container[b-sfif6sz7gq] { padding: 6px 8px; gap: 6px; }
    .ms-control-bar[b-sfif6sz7gq] { flex-direction: column; gap: 8px; }
    .ms-control-left[b-sfif6sz7gq], .ms-control-right[b-sfif6sz7gq] { width: 100%; justify-content: center; }
    .ms-control-right[b-sfif6sz7gq] { flex-wrap: wrap; }
    .ms-btn[b-sfif6sz7gq] { flex: 1; justify-content: center; min-width: 0; }
    .ms-btn span:not(.material-icons):not(.rzi)[b-sfif6sz7gq] { display: none; }
    .ms-filtros-grid[b-sfif6sz7gq] { grid-template-columns: 1fr; }
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-sfif6sz7gq] .ms-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}
/* /Pages/Mantenedores/MantenedorStock/Componentes/MotivoEliminacionStockDialog.razor.rz.scp.css */
/* MotivoEliminacionStockDialog — estilos aislados (antes <style> embebido).
   Tokens en wwwroot/css/design-tokens.css. */

.mes-dialog[b-9nec9uw82d] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 4px 2px;
    font-family: var(--font-family);
}

.mes-summary[b-9nec9uw82d] {
    display: flex;
    gap: 12px;
    align-items: center;
    background: var(--color-primary-light);
    border-radius: var(--radius-md);
    padding: 10px 12px;
}

.mes-summary-icon[b-9nec9uw82d] {
    width: 36px;
    height: 36px;
    border-radius: var(--radius-md);
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.mes-summary-body[b-9nec9uw82d] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.mes-summary-title[b-9nec9uw82d] {
    font-size: 0.9rem;
    font-weight: var(--fw-bold);
    color: var(--text);
    overflow: hidden;
    text-overflow: ellipsis;
}

.mes-summary-meta[b-9nec9uw82d] {
    font-size: var(--text-xs);
    color: var(--text-secondary);
}

.mes-field[b-9nec9uw82d] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.mes-label[b-9nec9uw82d] {
    font-size: var(--text-xs);
    font-weight: var(--fw-bold);
    color: var(--color-secondary-dark);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.mes-required[b-9nec9uw82d] {
    color: var(--color-danger);
}

.mes-hint[b-9nec9uw82d] {
    font-size: 0.68rem;
    color: var(--text-muted);
    align-self: flex-end;
}

.mes-footer[b-9nec9uw82d] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-2);
    padding-top: 6px;
    border-top: 1px solid var(--border);
}

.mes-btn[b-9nec9uw82d] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--radius-sm);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}

    .mes-btn:disabled[b-9nec9uw82d] {
        opacity: 0.55;
        cursor: not-allowed;
    }

    .mes-btn:hover:not(:disabled)[b-9nec9uw82d] {
        transform: translateY(-1px);
        box-shadow: var(--shadow-md);
    }

    .mes-btn .rzi[b-9nec9uw82d] {
        font-size: 1rem;
    }

.mes-btn-secondary[b-9nec9uw82d] {
    background: var(--color-secondary);
    color: #fff;
    border: none;
}

    .mes-btn-secondary:hover:not(:disabled)[b-9nec9uw82d] {
        background: var(--color-secondary-dark);
    }

.mes-btn-danger[b-9nec9uw82d] {
    background: var(--color-danger);
    color: white;
}

    .mes-btn-danger:hover:not(:disabled)[b-9nec9uw82d] {
        background: var(--color-danger-dark);
    }
/* /Pages/Mantenedores/MantenedorStock/Componentes/StockFormulario.razor.rz.scp.css */
/* ===== MODAL CREAR/EDITAR STOCK =====
   Mismo patron visual que
   MantenedorSucursal/Componentes/SucursalFormulario.
   ============================================= */

.stf-modal[b-l1y6htsmq4] {
    --stf-primary: var(--color-primary);
    --stf-border: var(--border);
    --stf-bg: #F8FAFC;
    --stf-card: var(--surface);
    --stf-text: var(--text);
    --stf-text-secondary: var(--text-secondary);
    --stf-text-muted: var(--text-muted);
    --stf-radius-xs: var(--radius-sm);
    --stf-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    background: var(--stf-bg);
    font-family: var(--font-family);
    position: relative;
}

.stf-loading-overlay[b-l1y6htsmq4] {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    z-index: 10;
    color: var(--stf-text-secondary);
    font-weight: 600;
    font-size: 0.85rem;
}

.stf-loading-spinner[b-l1y6htsmq4] {
    width: 42px;
    height: 42px;
    border: 4px solid var(--stf-border);
    border-top-color: var(--stf-primary);
    border-radius: 50%;
    animation: stfSpin-b-l1y6htsmq4 0.8s linear infinite;
}

@keyframes stfSpin-b-l1y6htsmq4 {
    to { transform: rotate(360deg); }
}

.stf-body[b-l1y6htsmq4] {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
}

.stf-grid[b-l1y6htsmq4] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 16px;
}

.stf-field[b-l1y6htsmq4] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.stf-full[b-l1y6htsmq4] {
    grid-column: 1 / -1;
}

.stf-label[b-l1y6htsmq4] {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--stf-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.stf-required[b-l1y6htsmq4] { color: var(--color-danger); font-weight: 700; }

.stf-hint[b-l1y6htsmq4] {
    font-size: 0.7rem;
    color: var(--stf-text-muted);
    font-style: italic;
}

.stf-field[b-l1y6htsmq4]  .rz-textbox,
.stf-field[b-l1y6htsmq4]  .rz-inputtext,
.stf-field[b-l1y6htsmq4]  input,
.stf-field[b-l1y6htsmq4]  .rz-spinner,
.stf-field[b-l1y6htsmq4]  .rz-numeric {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--stf-radius-xs) !important;
    font-size: 0.85rem !important;
    height: 36px !important;
    background: white !important;
    transition: var(--stf-transition);
}

.stf-field[b-l1y6htsmq4]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--stf-radius-xs) !important;
    font-size: 0.85rem !important;
    height: 36px !important;
    background: white !important;
    transition: var(--stf-transition);
    box-sizing: border-box !important;
}

.stf-field[b-l1y6htsmq4]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.stf-field[b-l1y6htsmq4]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.85rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.stf-field[b-l1y6htsmq4]  .rz-textbox:focus,
.stf-field[b-l1y6htsmq4]  .rz-state-focused,
.stf-field[b-l1y6htsmq4]  input:focus,
.stf-field[b-l1y6htsmq4]  .rz-numeric:focus-within {
    border-color: var(--stf-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
    outline: none;
}

.stf-footer[b-l1y6htsmq4] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding: 10px 16px;
    border-top: 1px solid var(--stf-border);
    background: var(--stf-card);
    flex-shrink: 0;
}

.stf-btn[b-l1y6htsmq4] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--stf-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    color: white;
    transition: var(--stf-transition);
}

.stf-btn:hover:not(:disabled)[b-l1y6htsmq4] {
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.stf-btn:disabled[b-l1y6htsmq4] {
    opacity: 0.6;
    cursor: not-allowed;
}

.stf-btn-secondary[b-l1y6htsmq4] { background: var(--color-secondary); }
.stf-btn-secondary:hover:not(:disabled)[b-l1y6htsmq4] { background: var(--color-secondary-dark); }

.stf-btn-primary[b-l1y6htsmq4] { background: var(--color-success); }

.stf-btn .rzi[b-l1y6htsmq4] { font-size: 1rem; }

@media (max-width: 640px) {
    .stf-grid[b-l1y6htsmq4] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Mantenedores/MantenedorStock/MantenedorStockIndex.razor.rz.scp.css */
/* ===== MANTENEDOR DE STOCK - DESIGN SYSTEM =====
   Estructura canonica: barra de control + filtros
   colapsables + grilla a ancho completo. El alta/edicion
   vive en el modal Componentes/StockFormulario. Misma
   paleta y patrones que el resto de mantenedores. Scoped.
   ============================================= */

.ms-container[b-9ggd92xwdh] {
    --ms-primary: var(--color-primary);
    --ms-primary-dark: var(--color-primary-dark);
    --ms-primary-light: var(--color-primary-light);
    --ms-accent: var(--color-warning);
    --ms-success: var(--color-success);
    --ms-success-light: var(--color-success-light);
    --ms-danger: var(--color-danger);
    --ms-danger-light: var(--color-danger-light);
    --ms-info: var(--color-info);
    --ms-info-light: var(--color-info-light);
    --ms-orange: var(--color-accent);
    --ms-bg: var(--bg);
    --ms-card: var(--surface);
    --ms-text: var(--text);
    --ms-text-secondary: var(--text-secondary);
    --ms-text-muted: var(--text-muted);
    --ms-border: var(--border);
    --ms-shadow-sm: var(--shadow-xs);
    --ms-shadow: var(--shadow-sm);
    --ms-shadow-md: var(--shadow-md);
    --ms-radius: var(--radius-lg);
    --ms-radius-sm: var(--radius-md);
    --ms-radius-xs: var(--radius-sm);
    --ms-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--ms-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.ms-control-bar[b-9ggd92xwdh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--ms-card);
    border-radius: var(--ms-radius);
    box-shadow: var(--ms-shadow);
    padding: 10px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 56px;
}

.ms-control-left[b-9ggd92xwdh] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.ms-header-icon[b-9ggd92xwdh] {
    width: 38px;
    height: 38px;
    border-radius: var(--ms-radius-sm);
    background: linear-gradient(135deg, var(--ms-primary) 0%, var(--ms-primary-dark) 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--ms-shadow-sm);
}

.ms-header-icon .rzi[b-9ggd92xwdh] { font-size: 1.25rem; }

.ms-title[b-9ggd92xwdh] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--ms-text);
    margin: 0;
    line-height: 1.2;
}

.ms-subtitle[b-9ggd92xwdh] {
    font-size: 0.72rem;
    color: var(--ms-text-secondary);
    margin: 2px 0 0;
}

.ms-control-center[b-9ggd92xwdh] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ms-loading-indicator[b-9ggd92xwdh] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: msFadeIn-b-9ggd92xwdh 0.3s ease;
}

.ms-loading-spinner[b-9ggd92xwdh] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--ms-border);
    border-top-color: var(--ms-primary);
    border-radius: 50%;
    animation: msSpin-b-9ggd92xwdh 0.8s linear infinite;
}

.ms-loading-text[b-9ggd92xwdh] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--ms-primary);
    animation: msPulse-b-9ggd92xwdh 1.5s ease-in-out infinite;
}

.ms-control-right[b-9ggd92xwdh] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES ===== */
.ms-btn[b-9ggd92xwdh] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--ms-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--ms-transition);
    white-space: nowrap;
    color: white;
}

.ms-btn:hover:not(:disabled)[b-9ggd92xwdh] {
    transform: translateY(-1px);
    box-shadow: var(--ms-shadow-md);
}

.ms-btn:active:not(:disabled)[b-9ggd92xwdh] { transform: translateY(0); }
.ms-btn:disabled[b-9ggd92xwdh] { opacity: 0.6; cursor: not-allowed; }
.ms-btn .rzi[b-9ggd92xwdh] { font-size: 1rem; }

.ms-btn-filtros[b-9ggd92xwdh] { background: var(--ms-info); }
.ms-btn-filtros.active[b-9ggd92xwdh] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

.ms-btn-buscar[b-9ggd92xwdh] { background: var(--ms-orange); }
.ms-btn-nuevo[b-9ggd92xwdh]  { background: var(--color-primary); }

/* ===== FILTROS ===== */
.ms-filtros-wrapper[b-9ggd92xwdh] { position: relative; flex-shrink: 0; }

.ms-filtros-panel[b-9ggd92xwdh] {
    background: var(--ms-card);
    border-radius: var(--ms-radius);
    box-shadow: var(--ms-shadow-md);
    overflow: hidden;
    animation: msSlideDown-b-9ggd92xwdh 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.ms-filtros-header[b-9ggd92xwdh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--ms-border);
    background: linear-gradient(135deg, var(--ms-info-light) 0%, var(--ms-card) 100%);
}

.ms-filtros-header h3[b-9ggd92xwdh] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--ms-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.ms-filtros-header h3 .rzi[b-9ggd92xwdh] { color: var(--ms-info); font-size: 1.1rem; }

.ms-filtros-close-btn[b-9ggd92xwdh] {
    background: none;
    border: none;
    color: var(--ms-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--ms-radius-xs);
    transition: var(--ms-transition);
    display: flex;
    align-items: center;
}
.ms-filtros-close-btn:hover[b-9ggd92xwdh] { background: var(--ms-danger-light); color: var(--ms-danger); }

.ms-filtros-body[b-9ggd92xwdh] { padding: 12px 16px; }

.ms-filtros-grid[b-9ggd92xwdh] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.ms-filtro-producto[b-9ggd92xwdh] { grid-column: span 2; min-width: 280px; }

.ms-filtro-field[b-9ggd92xwdh] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.ms-filtro-label[b-9ggd92xwdh] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--ms-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.ms-filtro-field[b-9ggd92xwdh]  .rz-textbox,
.ms-filtro-field[b-9ggd92xwdh]  .rz-inputtext,
.ms-filtro-field[b-9ggd92xwdh]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--ms-radius-xs) !important;
    font-size: 0.78rem !important;
    height: 32px !important;
    transition: var(--ms-transition);
    background: white !important;
}

.ms-filtro-field[b-9ggd92xwdh]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--ms-radius-xs) !important;
    font-size: 0.78rem !important;
    height: 32px !important;
    transition: var(--ms-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.ms-filtro-field[b-9ggd92xwdh]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.ms-filtro-field[b-9ggd92xwdh]  .rz-textbox:focus,
.ms-filtro-field[b-9ggd92xwdh]  .rz-state-focused,
.ms-filtro-field[b-9ggd92xwdh]  input:focus {
    border-color: var(--ms-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

.ms-filtro-field[b-9ggd92xwdh]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== SECTION HEADER ===== */
.ms-section-header[b-9ggd92xwdh] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--ms-border);
    background: linear-gradient(135deg, var(--ms-primary-light) 0%, var(--ms-card) 100%);
}

.ms-section-header h3[b-9ggd92xwdh] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--ms-text);
    margin: 0;
}

.ms-section-header .rzi[b-9ggd92xwdh] {
    color: var(--ms-primary);
    font-size: 1.1rem;
}

.ms-section-count[b-9ggd92xwdh] {
    margin-left: auto;
    font-size: 0.7rem;
    color: var(--ms-text-secondary);
    background: var(--ms-bg);
    border-radius: 999px;
    padding: 2px 10px;
    font-weight: 600;
}

/* ===== GRILLA (ancho completo) ===== */
.ms-grid-wrapper[b-9ggd92xwdh] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--ms-card);
    border-radius: var(--ms-radius);
    box-shadow: var(--ms-shadow);
    overflow: hidden;
    min-height: 0;
}

[b-9ggd92xwdh] .ms-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

[b-9ggd92xwdh] .ms-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--ms-bg) !important;
    color: var(--ms-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--ms-border) !important;
}

[b-9ggd92xwdh] .ms-grid-wrapper .rz-datatable-tbody > tr { transition: background-color 0.15s ease; }
[b-9ggd92xwdh] .ms-grid-wrapper .rz-datatable-tbody > tr:hover { background-color: var(--ms-primary-light) !important; }
[b-9ggd92xwdh] .ms-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* Badge de stock (ok / critico) */
.ms-stock-badge[b-9ggd92xwdh] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 999px;
    font-weight: 700;
    font-size: 0.75rem;
}
.ms-stock-badge.ms-ok[b-9ggd92xwdh]      { background: var(--ms-success-light); color: #047857; }
.ms-stock-badge.ms-critico[b-9ggd92xwdh] { background: var(--ms-danger-light);  color: #B91C1C; }

/* Botones de accion en filas */
.ms-action-group[b-9ggd92xwdh] { display: flex; gap: 6px; justify-content: center; }

.ms-action-btn[b-9ggd92xwdh] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--ms-radius-xs);
    cursor: pointer;
    transition: var(--ms-transition);
    padding: 0;
    color: white;
}
.ms-action-btn .rzi[b-9ggd92xwdh] { font-size: 0.9rem; }
.ms-action-btn:hover[b-9ggd92xwdh]  { transform: scale(1.12); box-shadow: var(--ms-shadow-md); }
.ms-action-btn:active[b-9ggd92xwdh] { transform: scale(0.95); }
.ms-action-btn.edit[b-9ggd92xwdh]   { background: var(--ms-info); }
.ms-action-btn.edit:hover[b-9ggd92xwdh]   { background: #0284C7; }
.ms-action-btn.delete[b-9ggd92xwdh] { background: var(--ms-danger); }
.ms-action-btn.delete:hover[b-9ggd92xwdh] { background: #DC2626; }

/* ===== ANIMACIONES ===== */
@keyframes msSpin-b-9ggd92xwdh { to { transform: rotate(360deg); } }

@keyframes msPulse-b-9ggd92xwdh {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.5; }
}

@keyframes msFadeIn-b-9ggd92xwdh {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes msSlideDown-b-9ggd92xwdh {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to   { opacity: 1; transform: translateY(0); max-height: 500px; }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .ms-container[b-9ggd92xwdh] { padding: 8px 10px; gap: 8px; }
    .ms-control-bar[b-9ggd92xwdh] { flex-wrap: wrap; padding: 8px 12px; }
    .ms-control-center[b-9ggd92xwdh] { order: 3; width: 100%; }
    .ms-filtro-producto[b-9ggd92xwdh] { grid-column: span 1; min-width: 0; }
    .ms-filtros-grid[b-9ggd92xwdh] { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
}

@media (max-width: 640px) {
    .ms-container[b-9ggd92xwdh] { padding: 6px 8px; gap: 6px; }
    .ms-control-bar[b-9ggd92xwdh] { flex-direction: column; gap: 8px; }
    .ms-control-left[b-9ggd92xwdh], .ms-control-right[b-9ggd92xwdh] { width: 100%; justify-content: center; }
    .ms-control-right[b-9ggd92xwdh] { flex-wrap: wrap; }
    .ms-btn[b-9ggd92xwdh] { flex: 1; justify-content: center; min-width: 0; }
    .ms-btn span:not(.material-icons):not(.rzi)[b-9ggd92xwdh] { display: none; }
    .ms-filtros-grid[b-9ggd92xwdh] { grid-template-columns: 1fr; }
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-9ggd92xwdh] .ms-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}
/* /Pages/Mantenedores/MantenedorSucursal/Componentes/SucursalFormulario.razor.rz.scp.css */
/* ===== MODAL CREAR/EDITAR SUCURSAL =====
   Mismo patron visual que
   MantenedorGrupo/Componentes/GrupoFormulario.
   ============================================= */

.sfm-modal[b-znp1i015af] {
    --sfm-primary: var(--color-primary);
    --sfm-border: var(--border);
    --sfm-bg: #F8FAFC;
    --sfm-card: var(--surface);
    --sfm-text: var(--text);
    --sfm-text-secondary: var(--text-secondary);
    --sfm-text-muted: var(--text-muted);
    --sfm-radius-xs: var(--radius-sm);
    --sfm-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    background: var(--sfm-bg);
    font-family: var(--font-family);
    position: relative;
}

.sfm-loading-overlay[b-znp1i015af] {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    z-index: 10;
    color: var(--sfm-text-secondary);
    font-weight: 600;
    font-size: 0.85rem;
}

.sfm-loading-spinner[b-znp1i015af] {
    width: 42px;
    height: 42px;
    border: 4px solid var(--sfm-border);
    border-top-color: var(--sfm-primary);
    border-radius: 50%;
    animation: sfmSpin-b-znp1i015af 0.8s linear infinite;
}

@keyframes sfmSpin-b-znp1i015af {
    to { transform: rotate(360deg); }
}

.sfm-body[b-znp1i015af] {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
}

.sfm-grid[b-znp1i015af] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 16px;
}

.sfm-field[b-znp1i015af] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.sfm-full[b-znp1i015af] {
    grid-column: 1 / -1;
}

.sfm-label[b-znp1i015af] {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--sfm-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.sfm-required[b-znp1i015af] { color: var(--color-danger); font-weight: 700; }

.sfm-field[b-znp1i015af]  .rz-textbox,
.sfm-field[b-znp1i015af]  .rz-inputtext,
.sfm-field[b-znp1i015af]  input,
.sfm-field[b-znp1i015af]  .rz-spinner,
.sfm-field[b-znp1i015af]  .rz-numeric {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--sfm-radius-xs) !important;
    font-size: 0.85rem !important;
    height: 36px !important;
    background: white !important;
    transition: var(--sfm-transition);
}

.sfm-field[b-znp1i015af]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--sfm-radius-xs) !important;
    font-size: 0.85rem !important;
    height: 36px !important;
    background: white !important;
    transition: var(--sfm-transition);
    box-sizing: border-box !important;
}

.sfm-field[b-znp1i015af]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.sfm-field[b-znp1i015af]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.85rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sfm-field[b-znp1i015af]  .rz-textbox:focus,
.sfm-field[b-znp1i015af]  .rz-state-focused,
.sfm-field[b-znp1i015af]  input:focus,
.sfm-field[b-znp1i015af]  .rz-numeric:focus-within {
    border-color: var(--sfm-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
    outline: none;
}

.sfm-field[b-znp1i015af]  input[disabled],
.sfm-field[b-znp1i015af]  .rz-state-disabled {
    background: #F8FAFC !important;
    color: var(--sfm-text-secondary) !important;
    cursor: not-allowed;
}

.sfm-footer[b-znp1i015af] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding: 10px 16px;
    border-top: 1px solid var(--sfm-border);
    background: var(--sfm-card);
    flex-shrink: 0;
}

.sfm-readonly-note[b-znp1i015af] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-right: auto;
    font-size: 0.72rem;
    color: var(--sfm-text-secondary);
    font-style: italic;
}

.sfm-readonly-note .rzi[b-znp1i015af] {
    color: var(--color-danger);
    font-size: 0.95rem;
}

.sfm-btn[b-znp1i015af] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--sfm-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    color: white;
    transition: var(--sfm-transition);
}

.sfm-btn:hover:not(:disabled)[b-znp1i015af] {
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.sfm-btn:disabled[b-znp1i015af] {
    opacity: 0.6;
    cursor: not-allowed;
}

.sfm-btn-secondary[b-znp1i015af] { background: var(--color-secondary); }
.sfm-btn-secondary:hover:not(:disabled)[b-znp1i015af] { background: var(--color-secondary-dark); }

.sfm-btn-primary[b-znp1i015af] { background: var(--color-success); }

.sfm-btn .rzi[b-znp1i015af] { font-size: 1rem; }

@media (max-width: 640px) {
    .sfm-grid[b-znp1i015af] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Mantenedores/MantenedorSucursal/MantenedorSucursalIndex.razor.rz.scp.css */
/* ===== MANTENEDOR DE SUCURSALES - DESIGN SYSTEM =====
   Estructura canonica: barra de control + filtros
   colapsables + grilla a ancho completo. El alta/edicion
   vive en el modal Componentes/SucursalFormulario. Misma
   paleta y patrones que MantenedorGrupo. Estilos scoped.
   ============================================= */

.ms-container[b-75zxpc1thk] {
    --ms-primary: var(--color-primary);
    --ms-primary-dark: var(--color-primary-dark);
    --ms-primary-light: var(--color-primary-light);
    --ms-accent: var(--color-warning);
    --ms-success: var(--color-success);
    --ms-success-light: var(--color-success-light);
    --ms-danger: var(--color-danger);
    --ms-danger-light: var(--color-danger-light);
    --ms-info: var(--color-info);
    --ms-info-light: var(--color-info-light);
    --ms-orange: var(--color-accent);
    --ms-bg: var(--bg);
    --ms-card: var(--surface);
    --ms-text: var(--text);
    --ms-text-secondary: var(--text-secondary);
    --ms-text-muted: var(--text-muted);
    --ms-border: var(--border);
    --ms-shadow-sm: var(--shadow-xs);
    --ms-shadow: var(--shadow-sm);
    --ms-shadow-md: var(--shadow-md);
    --ms-radius: var(--radius-lg);
    --ms-radius-sm: var(--radius-md);
    --ms-radius-xs: var(--radius-sm);
    --ms-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--ms-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.ms-control-bar[b-75zxpc1thk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--ms-card);
    border-radius: var(--ms-radius);
    box-shadow: var(--ms-shadow);
    padding: 10px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 56px;
}

.ms-control-left[b-75zxpc1thk] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.ms-header-icon[b-75zxpc1thk] {
    width: 38px;
    height: 38px;
    border-radius: var(--ms-radius-sm);
    background: linear-gradient(135deg, var(--ms-primary) 0%, var(--ms-primary-dark) 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--ms-shadow-sm);
}

.ms-header-icon .rzi[b-75zxpc1thk] { font-size: 1.25rem; }

.ms-title[b-75zxpc1thk] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--ms-text);
    margin: 0;
    line-height: 1.2;
}

.ms-subtitle[b-75zxpc1thk] {
    font-size: 0.72rem;
    color: var(--ms-text-secondary);
    margin: 2px 0 0;
}

.ms-master-hint[b-75zxpc1thk] {
    color: var(--ms-danger);
    font-style: italic;
    font-weight: 600;
}

.ms-control-center[b-75zxpc1thk] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ms-loading-indicator[b-75zxpc1thk] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: msFadeIn-b-75zxpc1thk 0.3s ease;
}

.ms-loading-spinner[b-75zxpc1thk] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--ms-border);
    border-top-color: var(--ms-primary);
    border-radius: 50%;
    animation: msSpin-b-75zxpc1thk 0.8s linear infinite;
}

.ms-loading-text[b-75zxpc1thk] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--ms-primary);
    animation: msPulse-b-75zxpc1thk 1.5s ease-in-out infinite;
}

.ms-control-right[b-75zxpc1thk] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES ===== */
.ms-btn[b-75zxpc1thk] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--ms-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--ms-transition);
    white-space: nowrap;
    color: white;
}

.ms-btn:hover:not(:disabled)[b-75zxpc1thk] {
    transform: translateY(-1px);
    box-shadow: var(--ms-shadow-md);
}

.ms-btn:active:not(:disabled)[b-75zxpc1thk] { transform: translateY(0); }
.ms-btn:disabled[b-75zxpc1thk] { opacity: 0.6; cursor: not-allowed; }
.ms-btn .rzi[b-75zxpc1thk] { font-size: 1rem; }

.ms-btn-filtros[b-75zxpc1thk] { background: var(--ms-info); }
.ms-btn-filtros.active[b-75zxpc1thk] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

.ms-btn-buscar[b-75zxpc1thk] { background: var(--ms-orange); }
.ms-btn-nuevo[b-75zxpc1thk]  { background: var(--color-primary); }

/* ===== FILTROS ===== */
.ms-filtros-wrapper[b-75zxpc1thk] { position: relative; flex-shrink: 0; }

.ms-filtros-panel[b-75zxpc1thk] {
    background: var(--ms-card);
    border-radius: var(--ms-radius);
    box-shadow: var(--ms-shadow-md);
    overflow: hidden;
    animation: msSlideDown-b-75zxpc1thk 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.ms-filtros-header[b-75zxpc1thk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--ms-border);
    background: linear-gradient(135deg, var(--ms-info-light) 0%, var(--ms-card) 100%);
}

.ms-filtros-header h3[b-75zxpc1thk] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--ms-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.ms-filtros-header h3 .rzi[b-75zxpc1thk] { color: var(--ms-info); font-size: 1.1rem; }

.ms-filtros-close-btn[b-75zxpc1thk] {
    background: none;
    border: none;
    color: var(--ms-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--ms-radius-xs);
    transition: var(--ms-transition);
    display: flex;
    align-items: center;
}
.ms-filtros-close-btn:hover[b-75zxpc1thk] { background: var(--ms-danger-light); color: var(--ms-danger); }

.ms-filtros-body[b-75zxpc1thk] { padding: 12px 16px; }

.ms-filtros-grid[b-75zxpc1thk] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.ms-filtro-ancho[b-75zxpc1thk] { grid-column: span 2; min-width: 280px; }

.ms-filtro-field[b-75zxpc1thk] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.ms-filtro-label[b-75zxpc1thk] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--ms-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.ms-filtro-field[b-75zxpc1thk]  .rz-textbox,
.ms-filtro-field[b-75zxpc1thk]  .rz-inputtext,
.ms-filtro-field[b-75zxpc1thk]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--ms-radius-xs) !important;
    font-size: 0.78rem !important;
    height: 32px !important;
    transition: var(--ms-transition);
    background: white !important;
}

.ms-filtro-field[b-75zxpc1thk]  .rz-textbox:focus,
.ms-filtro-field[b-75zxpc1thk]  .rz-state-focused,
.ms-filtro-field[b-75zxpc1thk]  input:focus {
    border-color: var(--ms-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

/* ===== SECTION HEADER ===== */
.ms-section-header[b-75zxpc1thk] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--ms-border);
    background: linear-gradient(135deg, var(--ms-primary-light) 0%, var(--ms-card) 100%);
}

.ms-section-header h3[b-75zxpc1thk] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--ms-text);
    margin: 0;
}

.ms-section-header .rzi[b-75zxpc1thk] {
    color: var(--ms-primary);
    font-size: 1.1rem;
}

.ms-section-count[b-75zxpc1thk] {
    margin-left: auto;
    font-size: 0.7rem;
    color: var(--ms-text-secondary);
    background: var(--ms-bg);
    border-radius: 999px;
    padding: 2px 10px;
    font-weight: 600;
}

/* ===== GRILLA (ancho completo) ===== */
.ms-grid-wrapper[b-75zxpc1thk] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--ms-card);
    border-radius: var(--ms-radius);
    box-shadow: var(--ms-shadow);
    overflow: hidden;
    min-height: 0;
}

[b-75zxpc1thk] .ms-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

[b-75zxpc1thk] .ms-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--ms-bg) !important;
    color: var(--ms-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--ms-border) !important;
}

[b-75zxpc1thk] .ms-grid-wrapper .rz-datatable-tbody > tr { transition: background-color 0.15s ease; }
[b-75zxpc1thk] .ms-grid-wrapper .rz-datatable-tbody > tr:hover { background-color: var(--ms-primary-light) !important; }
[b-75zxpc1thk] .ms-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* Botones de accion en filas */
.ms-action-group[b-75zxpc1thk] { display: flex; gap: 6px; justify-content: center; }

.ms-action-btn[b-75zxpc1thk] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--ms-radius-xs);
    cursor: pointer;
    transition: var(--ms-transition);
    padding: 0;
    color: white;
}
.ms-action-btn .rzi[b-75zxpc1thk] { font-size: 0.9rem; }
.ms-action-btn:hover[b-75zxpc1thk]  { transform: scale(1.12); box-shadow: var(--ms-shadow-md); }
.ms-action-btn:active[b-75zxpc1thk] { transform: scale(0.95); }
.ms-action-btn.edit[b-75zxpc1thk]   { background: var(--ms-info); }
.ms-action-btn.edit:hover[b-75zxpc1thk]   { background: #0284C7; }
.ms-action-btn.delete[b-75zxpc1thk] { background: var(--ms-danger); }
.ms-action-btn.delete:hover[b-75zxpc1thk] { background: #DC2626; }

/* ===== ANIMACIONES ===== */
@keyframes msSpin-b-75zxpc1thk { to { transform: rotate(360deg); } }

@keyframes msPulse-b-75zxpc1thk {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.5; }
}

@keyframes msFadeIn-b-75zxpc1thk {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes msSlideDown-b-75zxpc1thk {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to   { opacity: 1; transform: translateY(0); max-height: 500px; }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .ms-container[b-75zxpc1thk] { padding: 8px 10px; gap: 8px; }
    .ms-control-bar[b-75zxpc1thk] { flex-wrap: wrap; padding: 8px 12px; }
    .ms-control-center[b-75zxpc1thk] { order: 3; width: 100%; }
    .ms-filtro-ancho[b-75zxpc1thk] { grid-column: span 1; min-width: 0; }
    .ms-filtros-grid[b-75zxpc1thk] { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
}

@media (max-width: 640px) {
    .ms-container[b-75zxpc1thk] { padding: 6px 8px; gap: 6px; }
    .ms-control-bar[b-75zxpc1thk] { flex-direction: column; gap: 8px; }
    .ms-control-left[b-75zxpc1thk], .ms-control-right[b-75zxpc1thk] { width: 100%; justify-content: center; }
    .ms-control-right[b-75zxpc1thk] { flex-wrap: wrap; }
    .ms-btn[b-75zxpc1thk] { flex: 1; justify-content: center; min-width: 0; }
    .ms-btn span:not(.material-icons):not(.rzi)[b-75zxpc1thk] { display: none; }
    .ms-filtros-grid[b-75zxpc1thk] { grid-template-columns: 1fr; }
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-75zxpc1thk] .ms-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}
/* /Pages/Mantenedores/MantenedorUsuarios/Componentes/UsuarioFormulario.razor.rz.scp.css */
/* ===== MODAL CREAR/EDITAR USUARIO =====
   Mismo patron visual que
   MantenedorSucursal/Componentes/SucursalFormulario.
   ============================================= */

.ufm-modal[b-q35ihh6tbw] {
    --ufm-primary: var(--color-primary);
    --ufm-border: var(--border);
    --ufm-bg: #F8FAFC;
    --ufm-card: var(--surface);
    --ufm-text: var(--text);
    --ufm-text-secondary: var(--text-secondary);
    --ufm-text-muted: var(--text-muted);
    --ufm-radius-xs: var(--radius-sm);
    --ufm-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    background: var(--ufm-bg);
    font-family: var(--font-family);
    position: relative;
}

.ufm-loading-overlay[b-q35ihh6tbw] {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    z-index: 10;
    color: var(--ufm-text-secondary);
    font-weight: 600;
    font-size: 0.85rem;
}

.ufm-loading-spinner[b-q35ihh6tbw] {
    width: 42px;
    height: 42px;
    border: 4px solid var(--ufm-border);
    border-top-color: var(--ufm-primary);
    border-radius: 50%;
    animation: ufmSpin-b-q35ihh6tbw 0.8s linear infinite;
}

@keyframes ufmSpin-b-q35ihh6tbw {
    to { transform: rotate(360deg); }
}

.ufm-body[b-q35ihh6tbw] {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
}

.ufm-grid[b-q35ihh6tbw] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px 16px;
}

.ufm-field[b-q35ihh6tbw] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ufm-full[b-q35ihh6tbw] {
    grid-column: 1 / -1;
}

.ufm-label[b-q35ihh6tbw] {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--ufm-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.ufm-required[b-q35ihh6tbw] { color: var(--color-danger); font-weight: 700; }

.ufm-hint[b-q35ihh6tbw] {
    font-size: 0.7rem;
    color: var(--ufm-text-muted);
    font-style: italic;
}

.ufm-field[b-q35ihh6tbw]  .rz-textbox,
.ufm-field[b-q35ihh6tbw]  .rz-inputtext,
.ufm-field[b-q35ihh6tbw]  input,
.ufm-field[b-q35ihh6tbw]  .rz-password {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--ufm-radius-xs) !important;
    font-size: 0.85rem !important;
    height: 36px !important;
    background: white !important;
    transition: var(--ufm-transition);
}

.ufm-field[b-q35ihh6tbw]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--ufm-radius-xs) !important;
    font-size: 0.85rem !important;
    height: 36px !important;
    background: white !important;
    transition: var(--ufm-transition);
    box-sizing: border-box !important;
}

.ufm-field[b-q35ihh6tbw]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.ufm-field[b-q35ihh6tbw]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.85rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ufm-field[b-q35ihh6tbw]  .rz-textbox:focus,
.ufm-field[b-q35ihh6tbw]  .rz-state-focused,
.ufm-field[b-q35ihh6tbw]  input:focus {
    border-color: var(--ufm-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
    outline: none;
}

.ufm-field[b-q35ihh6tbw]  input[disabled],
.ufm-field[b-q35ihh6tbw]  .rz-state-disabled,
.ufm-field[b-q35ihh6tbw]  .rz-dropdown.rz-state-disabled {
    background: #F8FAFC !important;
    color: var(--ufm-text-secondary) !important;
    cursor: not-allowed;
}

.ufm-footer[b-q35ihh6tbw] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding: 10px 16px;
    border-top: 1px solid var(--ufm-border);
    background: var(--ufm-card);
    flex-shrink: 0;
}

.ufm-readonly-note[b-q35ihh6tbw] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-right: auto;
    font-size: 0.72rem;
    color: var(--ufm-text-secondary);
    font-style: italic;
}

.ufm-readonly-note .rzi[b-q35ihh6tbw] {
    color: var(--color-danger);
    font-size: 0.95rem;
}

.ufm-btn[b-q35ihh6tbw] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--ufm-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    color: white;
    transition: var(--ufm-transition);
}

.ufm-btn:hover:not(:disabled)[b-q35ihh6tbw] {
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.ufm-btn:disabled[b-q35ihh6tbw] {
    opacity: 0.6;
    cursor: not-allowed;
}

.ufm-btn-secondary[b-q35ihh6tbw] { background: var(--color-secondary); }
.ufm-btn-secondary:hover:not(:disabled)[b-q35ihh6tbw] { background: var(--color-secondary-dark); }

.ufm-btn-primary[b-q35ihh6tbw] { background: var(--color-success); }

.ufm-btn .rzi[b-q35ihh6tbw] { font-size: 1rem; }

@media (max-width: 768px) {
    .ufm-grid[b-q35ihh6tbw] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 480px) {
    .ufm-grid[b-q35ihh6tbw] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Mantenedores/MantenedorUsuarios/MantenedorUsuariosIndex.razor.rz.scp.css */
/* ===== MANTENEDOR DE USUARIOS - DESIGN SYSTEM =====
   Estructura canonica: barra de control + filtros
   colapsables + grilla a ancho completo. El alta/edicion
   vive en el modal Componentes/UsuarioFormulario. Misma
   paleta y patrones que MantenedorSucursal. Estilos scoped.
   ============================================= */

.ms-container[b-xt6xiuvoo8] {
    --ms-primary: var(--color-primary);
    --ms-primary-dark: var(--color-primary-dark);
    --ms-primary-light: var(--color-primary-light);
    --ms-accent: var(--color-warning);
    --ms-success: var(--color-success);
    --ms-success-light: var(--color-success-light);
    --ms-danger: var(--color-danger);
    --ms-danger-light: var(--color-danger-light);
    --ms-info: var(--color-info);
    --ms-info-light: var(--color-info-light);
    --ms-orange: var(--color-accent);
    --ms-bg: var(--bg);
    --ms-card: var(--surface);
    --ms-text: var(--text);
    --ms-text-secondary: var(--text-secondary);
    --ms-text-muted: var(--text-muted);
    --ms-border: var(--border);
    --ms-shadow-sm: var(--shadow-xs);
    --ms-shadow: var(--shadow-sm);
    --ms-shadow-md: var(--shadow-md);
    --ms-radius: var(--radius-lg);
    --ms-radius-sm: var(--radius-md);
    --ms-radius-xs: var(--radius-sm);
    --ms-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--ms-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.ms-control-bar[b-xt6xiuvoo8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--ms-card);
    border-radius: var(--ms-radius);
    box-shadow: var(--ms-shadow);
    padding: 10px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 56px;
}

.ms-control-left[b-xt6xiuvoo8] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.ms-header-icon[b-xt6xiuvoo8] {
    width: 38px;
    height: 38px;
    border-radius: var(--ms-radius-sm);
    background: linear-gradient(135deg, var(--ms-primary) 0%, var(--ms-primary-dark) 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--ms-shadow-sm);
}

.ms-header-icon .rzi[b-xt6xiuvoo8] { font-size: 1.25rem; }

.ms-title[b-xt6xiuvoo8] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--ms-text);
    margin: 0;
    line-height: 1.2;
}

.ms-subtitle[b-xt6xiuvoo8] {
    font-size: 0.72rem;
    color: var(--ms-text-secondary);
    margin: 2px 0 0;
}

.ms-master-hint[b-xt6xiuvoo8] {
    color: var(--ms-danger);
    font-style: italic;
    font-weight: 600;
}

.ms-control-center[b-xt6xiuvoo8] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ms-loading-indicator[b-xt6xiuvoo8] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: msFadeIn-b-xt6xiuvoo8 0.3s ease;
}

.ms-loading-spinner[b-xt6xiuvoo8] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--ms-border);
    border-top-color: var(--ms-primary);
    border-radius: 50%;
    animation: msSpin-b-xt6xiuvoo8 0.8s linear infinite;
}

.ms-loading-text[b-xt6xiuvoo8] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--ms-primary);
    animation: msPulse-b-xt6xiuvoo8 1.5s ease-in-out infinite;
}

.ms-control-right[b-xt6xiuvoo8] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES ===== */
.ms-btn[b-xt6xiuvoo8] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--ms-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--ms-transition);
    white-space: nowrap;
    color: white;
}

.ms-btn:hover:not(:disabled)[b-xt6xiuvoo8] {
    transform: translateY(-1px);
    box-shadow: var(--ms-shadow-md);
}

.ms-btn:active:not(:disabled)[b-xt6xiuvoo8] { transform: translateY(0); }
.ms-btn:disabled[b-xt6xiuvoo8] { opacity: 0.6; cursor: not-allowed; }
.ms-btn .rzi[b-xt6xiuvoo8] { font-size: 1rem; }

.ms-btn-filtros[b-xt6xiuvoo8] { background: var(--ms-info); }
.ms-btn-filtros.active[b-xt6xiuvoo8] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

.ms-btn-buscar[b-xt6xiuvoo8] { background: var(--ms-orange); }
.ms-btn-nuevo[b-xt6xiuvoo8]  { background: var(--color-primary); }

/* ===== FILTROS ===== */
.ms-filtros-wrapper[b-xt6xiuvoo8] { position: relative; flex-shrink: 0; }

.ms-filtros-panel[b-xt6xiuvoo8] {
    background: var(--ms-card);
    border-radius: var(--ms-radius);
    box-shadow: var(--ms-shadow-md);
    overflow: hidden;
    animation: msSlideDown-b-xt6xiuvoo8 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.ms-filtros-header[b-xt6xiuvoo8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--ms-border);
    background: linear-gradient(135deg, var(--ms-info-light) 0%, var(--ms-card) 100%);
}

.ms-filtros-header h3[b-xt6xiuvoo8] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--ms-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.ms-filtros-header h3 .rzi[b-xt6xiuvoo8] { color: var(--ms-info); font-size: 1.1rem; }

.ms-filtros-close-btn[b-xt6xiuvoo8] {
    background: none;
    border: none;
    color: var(--ms-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--ms-radius-xs);
    transition: var(--ms-transition);
    display: flex;
    align-items: center;
}
.ms-filtros-close-btn:hover[b-xt6xiuvoo8] { background: var(--ms-danger-light); color: var(--ms-danger); }

.ms-filtros-body[b-xt6xiuvoo8] { padding: 12px 16px; }

.ms-filtros-grid[b-xt6xiuvoo8] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
}

.ms-filtro-field[b-xt6xiuvoo8] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.ms-filtro-label[b-xt6xiuvoo8] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--ms-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.ms-filtro-field[b-xt6xiuvoo8]  .rz-textbox,
.ms-filtro-field[b-xt6xiuvoo8]  .rz-inputtext,
.ms-filtro-field[b-xt6xiuvoo8]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--ms-radius-xs) !important;
    font-size: 0.78rem !important;
    height: 32px !important;
    transition: var(--ms-transition);
    background: white !important;
}

.ms-filtro-field[b-xt6xiuvoo8]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--ms-radius-xs) !important;
    font-size: 0.78rem !important;
    height: 32px !important;
    transition: var(--ms-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.ms-filtro-field[b-xt6xiuvoo8]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

/* Texto del dropdown: llena el wrapper de 32px (evita el "recuadro dentro del recuadro") */
.ms-filtro-field[b-xt6xiuvoo8]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.78rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ms-filtro-field[b-xt6xiuvoo8]  .rz-textbox:focus,
.ms-filtro-field[b-xt6xiuvoo8]  .rz-state-focused,
.ms-filtro-field[b-xt6xiuvoo8]  input:focus {
    border-color: var(--ms-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

/* ===== SECTION HEADER ===== */
.ms-section-header[b-xt6xiuvoo8] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--ms-border);
    background: linear-gradient(135deg, var(--ms-primary-light) 0%, var(--ms-card) 100%);
}

.ms-section-header h3[b-xt6xiuvoo8] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--ms-text);
    margin: 0;
}

.ms-section-header .rzi[b-xt6xiuvoo8] {
    color: var(--ms-primary);
    font-size: 1.1rem;
}

.ms-section-count[b-xt6xiuvoo8] {
    margin-left: auto;
    font-size: 0.7rem;
    color: var(--ms-text-secondary);
    background: var(--ms-bg);
    border-radius: 999px;
    padding: 2px 10px;
    font-weight: 600;
}

/* ===== GRILLA (ancho completo) ===== */
.ms-grid-wrapper[b-xt6xiuvoo8] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--ms-card);
    border-radius: var(--ms-radius);
    box-shadow: var(--ms-shadow);
    overflow: hidden;
    min-height: 0;
}

[b-xt6xiuvoo8] .ms-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

[b-xt6xiuvoo8] .ms-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--ms-bg) !important;
    color: var(--ms-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--ms-border) !important;
}

[b-xt6xiuvoo8] .ms-grid-wrapper .rz-datatable-tbody > tr { transition: background-color 0.15s ease; }
[b-xt6xiuvoo8] .ms-grid-wrapper .rz-datatable-tbody > tr:hover { background-color: var(--ms-primary-light) !important; }
[b-xt6xiuvoo8] .ms-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* Badge Habilitado / Deshabilitado */
.ms-estado-badge[b-xt6xiuvoo8] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 999px;
    font-weight: 700;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.ms-estado-badge.ms-habilitado[b-xt6xiuvoo8] { background: var(--ms-success-light); color: #047857; }
.ms-estado-badge.ms-bloqueado[b-xt6xiuvoo8]  { background: var(--ms-danger-light);  color: #B91C1C; }

/* Botones de accion en filas */
.ms-action-group[b-xt6xiuvoo8] { display: flex; gap: 6px; justify-content: center; }

.ms-action-btn[b-xt6xiuvoo8] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--ms-radius-xs);
    cursor: pointer;
    transition: var(--ms-transition);
    padding: 0;
    color: white;
}
.ms-action-btn .rzi[b-xt6xiuvoo8] { font-size: 0.9rem; }
.ms-action-btn:hover[b-xt6xiuvoo8]  { transform: scale(1.12); box-shadow: var(--ms-shadow-md); }
.ms-action-btn:active[b-xt6xiuvoo8] { transform: scale(0.95); }
.ms-action-btn.ver[b-xt6xiuvoo8]    { background: var(--color-detail); }
.ms-action-btn.ver:hover[b-xt6xiuvoo8]    { background: var(--color-detail-dark); }
.ms-action-btn.edit[b-xt6xiuvoo8]   { background: var(--ms-info); }
.ms-action-btn.edit:hover[b-xt6xiuvoo8]   { background: #0284C7; }
.ms-action-btn.delete[b-xt6xiuvoo8] { background: var(--ms-danger); }
.ms-action-btn.delete:hover[b-xt6xiuvoo8] { background: #DC2626; }

/* ===== ANIMACIONES ===== */
@keyframes msSpin-b-xt6xiuvoo8 { to { transform: rotate(360deg); } }

@keyframes msPulse-b-xt6xiuvoo8 {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.5; }
}

@keyframes msFadeIn-b-xt6xiuvoo8 {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes msSlideDown-b-xt6xiuvoo8 {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to   { opacity: 1; transform: translateY(0); max-height: 500px; }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .ms-container[b-xt6xiuvoo8] { padding: 8px 10px; gap: 8px; }
    .ms-control-bar[b-xt6xiuvoo8] { flex-wrap: wrap; padding: 8px 12px; }
    .ms-control-center[b-xt6xiuvoo8] { order: 3; width: 100%; }
    .ms-filtros-grid[b-xt6xiuvoo8] { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
}

@media (max-width: 640px) {
    .ms-container[b-xt6xiuvoo8] { padding: 6px 8px; gap: 6px; }
    .ms-control-bar[b-xt6xiuvoo8] { flex-direction: column; gap: 8px; }
    .ms-control-left[b-xt6xiuvoo8], .ms-control-right[b-xt6xiuvoo8] { width: 100%; justify-content: center; }
    .ms-control-right[b-xt6xiuvoo8] { flex-wrap: wrap; }
    .ms-btn[b-xt6xiuvoo8] { flex: 1; justify-content: center; min-width: 0; }
    .ms-btn span:not(.material-icons):not(.rzi)[b-xt6xiuvoo8] { display: none; }
    .ms-filtros-grid[b-xt6xiuvoo8] { grid-template-columns: 1fr; }
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-xt6xiuvoo8] .ms-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}
/* /Pages/Mantenedores/MovimientoProductos/MovimientoProductosIndex.razor.rz.scp.css */
/* ===== MOVIMIENTO PRODUCTOS - DESIGN SYSTEM =====
   Estilos del modulo "Movimiento de Productos" (Mantenedores).
   Inspirado visualmente en ConsultaDocumentos/DocumentosEmitidos para
   mantener una experiencia consistente: barra de control, filtros
   colapsables y grilla de datos.
   ============================================= */

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-ohat1g3ict] .mp-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

.mp-container[b-ohat1g3ict] {
    --mp-primary: var(--color-primary);
    --mp-primary-dark: var(--color-primary-dark);
    --mp-primary-light: var(--color-primary-light);
    --mp-accent: var(--color-warning);
    --mp-success: var(--color-success);
    --mp-success-light: var(--color-success-light);
    --mp-danger: var(--color-danger);
    --mp-danger-light: var(--color-danger-light);
    --mp-info: var(--color-info);
    --mp-info-light: var(--color-info-light);
    --mp-orange: var(--color-accent);
    --mp-orange-dark: var(--color-accent-dark);
    --mp-bg: var(--bg);
    --mp-card: var(--surface);
    --mp-text: var(--text);
    --mp-text-secondary: var(--text-secondary);
    --mp-text-muted: var(--text-muted);
    --mp-border: var(--border);
    --mp-shadow-sm: var(--shadow-xs);
    --mp-shadow: var(--shadow-sm);
    --mp-shadow-md: var(--shadow-md);
    --mp-radius: var(--radius-lg);
    --mp-radius-sm: var(--radius-md);
    --mp-radius-xs: var(--radius-sm);
    --mp-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--mp-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.mp-control-bar[b-ohat1g3ict] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--mp-card);
    border-radius: var(--mp-radius);
    box-shadow: var(--mp-shadow);
    padding: 10px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 56px;
}

.mp-control-left[b-ohat1g3ict] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.mp-header-icon[b-ohat1g3ict] {
    width: 38px;
    height: 38px;
    border-radius: var(--mp-radius-sm);
    background: linear-gradient(135deg, var(--mp-primary) 0%, var(--mp-primary-dark) 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--mp-shadow-sm);
}

.mp-header-icon .rzi[b-ohat1g3ict] {
    font-size: 1.25rem;
}

.mp-title[b-ohat1g3ict] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--mp-text);
    margin: 0;
    line-height: 1.2;
}

.mp-subtitle[b-ohat1g3ict] {
    font-size: 0.72rem;
    color: var(--mp-text-secondary);
    margin: 2px 0 0;
}

.mp-control-center[b-ohat1g3ict] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.mp-loading-indicator[b-ohat1g3ict] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: mpFadeIn-b-ohat1g3ict 0.3s ease;
}

.mp-loading-spinner[b-ohat1g3ict] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--mp-border);
    border-top-color: var(--mp-primary);
    border-radius: 50%;
    animation: mpSpin-b-ohat1g3ict 0.8s linear infinite;
}

.mp-loading-text[b-ohat1g3ict] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--mp-primary);
    animation: mpPulse-b-ohat1g3ict 1.5s ease-in-out infinite;
}

.mp-control-right[b-ohat1g3ict] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES ===== */
.mp-btn[b-ohat1g3ict] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--mp-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--mp-transition);
    white-space: nowrap;
    color: white;
}

.mp-btn:hover[b-ohat1g3ict] {
    transform: translateY(-1px);
    box-shadow: var(--mp-shadow-md);
}

.mp-btn:active[b-ohat1g3ict] {
    transform: translateY(0);
}

.mp-btn .rzi[b-ohat1g3ict] {
    font-size: 1rem;
}

.mp-btn-buscar[b-ohat1g3ict] {
    background: var(--mp-orange);
}

.mp-btn-exportar[b-ohat1g3ict] {
    background: var(--mp-success);
}

.mp-btn-filtros[b-ohat1g3ict] {
    background: var(--mp-info);
}

.mp-btn-filtros.active[b-ohat1g3ict] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* ===== FILTROS ===== */
.mp-filtros-wrapper[b-ohat1g3ict] {
    position: relative;
    flex-shrink: 0;
}

.mp-filtros-panel[b-ohat1g3ict] {
    background: var(--mp-card);
    border-radius: var(--mp-radius);
    box-shadow: var(--mp-shadow-md);
    overflow: hidden;
    animation: mpSlideDown-b-ohat1g3ict 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.mp-filtros-header[b-ohat1g3ict] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--mp-border);
    background: linear-gradient(135deg, var(--mp-info-light) 0%, var(--mp-card) 100%);
}

.mp-filtros-header h3[b-ohat1g3ict] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--mp-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.mp-filtros-header h3 .rzi[b-ohat1g3ict] {
    color: var(--mp-info);
    font-size: 1.1rem;
}

.mp-filtros-close-btn[b-ohat1g3ict] {
    background: none;
    border: none;
    color: var(--mp-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--mp-radius-xs);
    transition: var(--mp-transition);
    display: flex;
    align-items: center;
}

.mp-filtros-close-btn:hover[b-ohat1g3ict] {
    background: var(--mp-danger-light);
    color: var(--mp-danger);
}

.mp-filtros-body[b-ohat1g3ict] {
    padding: 12px 16px;
}

.mp-filtros-grid[b-ohat1g3ict] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

/* El campo Producto suele ser el mas largo: que ocupe el doble */
.mp-filtro-producto[b-ohat1g3ict] {
    grid-column: span 2;
    min-width: 280px;
}

.mp-filtro-field[b-ohat1g3ict] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.mp-filtro-label[b-ohat1g3ict] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--mp-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Inputs dentro de filtros: bordes sutiles */
.mp-filtro-field[b-ohat1g3ict]  .rz-textbox,
.mp-filtro-field[b-ohat1g3ict]  .rz-spinner,
.mp-filtro-field[b-ohat1g3ict]  .rz-inputtext,
.mp-filtro-field[b-ohat1g3ict]  .rz-calendar,
.mp-filtro-field[b-ohat1g3ict]  .rz-numeric,
.mp-filtro-field[b-ohat1g3ict]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--mp-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--mp-transition);
    background: white !important;
}

.mp-filtro-field[b-ohat1g3ict]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--mp-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--mp-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.mp-filtro-field[b-ohat1g3ict]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.mp-filtro-field[b-ohat1g3ict]  .rz-textbox:focus,
.mp-filtro-field[b-ohat1g3ict]  .rz-state-focused,
.mp-filtro-field[b-ohat1g3ict]  input:focus,
.mp-filtro-field[b-ohat1g3ict]  .rz-calendar:focus-within,
.mp-filtro-field[b-ohat1g3ict]  .rz-numeric:focus-within {
    border-color: var(--mp-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

.mp-filtro-field[b-ohat1g3ict]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== GRILLA ===== */
.mp-grid-wrapper[b-ohat1g3ict] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--mp-card);
    border-radius: var(--mp-radius);
    box-shadow: var(--mp-shadow);
    overflow: hidden;
    min-height: 0;
}

[b-ohat1g3ict] .mp-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

[b-ohat1g3ict] .mp-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--mp-bg) !important;
    color: var(--mp-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--mp-border) !important;
}

[b-ohat1g3ict] .mp-grid-wrapper .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
}

[b-ohat1g3ict] .mp-grid-wrapper .rz-datatable-tbody > tr:hover {
    background-color: var(--mp-primary-light) !important;
}

[b-ohat1g3ict] .mp-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* Badge de tipo de movimiento (Entrada / Salida) */
.mp-mov-badge[b-ohat1g3ict] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.mp-mov-badge .rzi[b-ohat1g3ict] {
    font-size: 0.85rem;
}

.mp-mov-badge.mp-entrada[b-ohat1g3ict] {
    background: var(--mp-success-light);
    color: #047857;
}

.mp-mov-badge.mp-salida[b-ohat1g3ict] {
    background: var(--mp-danger-light);
    color: #B91C1C;
}

/* ===== ANIMACIONES ===== */
@keyframes mpSpin-b-ohat1g3ict {
    to { transform: rotate(360deg); }
}

@keyframes mpPulse-b-ohat1g3ict {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

@keyframes mpFadeIn-b-ohat1g3ict {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes mpSlideDown-b-ohat1g3ict {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .mp-container[b-ohat1g3ict] {
        padding: 8px 10px;
        gap: 8px;
    }

    .mp-control-bar[b-ohat1g3ict] {
        flex-wrap: wrap;
        padding: 8px 12px;
    }

    .mp-control-center[b-ohat1g3ict] {
        order: 3;
        width: 100%;
    }

    .mp-filtro-producto[b-ohat1g3ict] {
        grid-column: span 1;
        min-width: 0;
    }

    .mp-filtros-grid[b-ohat1g3ict] {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
}

@media (max-width: 640px) {
    .mp-container[b-ohat1g3ict] {
        padding: 6px 8px;
        gap: 6px;
    }

    .mp-control-bar[b-ohat1g3ict] {
        flex-direction: column;
        gap: 8px;
    }

    .mp-control-left[b-ohat1g3ict],
    .mp-control-right[b-ohat1g3ict] {
        width: 100%;
        justify-content: center;
    }

    .mp-control-right[b-ohat1g3ict] {
        flex-wrap: wrap;
    }

    .mp-btn[b-ohat1g3ict] {
        flex: 1;
        justify-content: center;
        min-width: 0;
    }

    .mp-btn span:not(.material-icons):not(.rzi)[b-ohat1g3ict] {
        display: none;
    }

    .mp-filtros-grid[b-ohat1g3ict] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Mantenedores/Productos/Componentes/CargaMasivaProductosModal.razor.rz.scp.css */
/* ===== MODAL CARGA MASIVA DE PRODUCTOS ===== */

.cmp-modal[b-s5rv7jajqo] {
    --cmp-primary: var(--color-primary);
    --cmp-primary-light: var(--color-primary-light);
    --cmp-success: var(--color-success);
    --cmp-success-light: var(--color-success-light);
    --cmp-danger: var(--color-danger);
    --cmp-danger-light: var(--color-danger-light);
    --cmp-info: var(--color-info);
    --cmp-info-light: var(--color-info-light);
    --cmp-border: var(--border);
    --cmp-bg: #F8FAFC;
    --cmp-card: var(--surface);
    --cmp-text: var(--text);
    --cmp-text-secondary: var(--text-secondary);
    --cmp-radius-xs: var(--radius-sm);
    --cmp-radius-sm: var(--radius-md);
    --cmp-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    background: var(--cmp-bg);
    font-family: var(--font-family);
    position: relative;
}

.cmp-loading-overlay[b-s5rv7jajqo] {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    z-index: 20;
    color: var(--cmp-text-secondary);
    font-weight: 600;
    font-size: 0.9rem;
}

.cmp-loading-spinner[b-s5rv7jajqo] {
    width: 42px;
    height: 42px;
    border: 4px solid var(--cmp-border);
    border-top-color: var(--cmp-primary);
    border-radius: 50%;
    animation: cmpSpin-b-s5rv7jajqo 0.8s linear infinite;
}

@keyframes cmpSpin-b-s5rv7jajqo {
    to { transform: rotate(360deg); }
}

.cmp-body[b-s5rv7jajqo] {
    flex: 1;
    overflow-y: auto;
    padding: 16px 20px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.cmp-info[b-s5rv7jajqo] {
    display: flex;
    gap: 10px;
    padding: 10px 14px;
    background: var(--cmp-info-light);
    border-left: 3px solid var(--cmp-info);
    border-radius: var(--cmp-radius-xs);
    font-size: 0.82rem;
    color: var(--cmp-text);
}

.cmp-info code[b-s5rv7jajqo] {
    background: rgba(0,0,0,0.06);
    padding: 1px 5px;
    border-radius: 4px;
    font-family: 'Consolas', monospace;
    font-size: 0.78rem;
}

.cmp-info .rzi[b-s5rv7jajqo] {
    color: var(--cmp-info);
    font-size: 1.2rem;
    flex-shrink: 0;
}

/* ===== SELECTOR DE ARCHIVO ===== */
.cmp-file-picker[b-s5rv7jajqo] {
    display: flex;
}

.cmp-file-label[b-s5rv7jajqo] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border: 2px dashed var(--cmp-border);
    border-radius: var(--cmp-radius-sm);
    background: var(--cmp-card);
    cursor: pointer;
    transition: var(--cmp-transition);
    color: var(--cmp-text-secondary);
    font-size: 0.85rem;
    font-weight: 600;
}

.cmp-file-label:hover[b-s5rv7jajqo] {
    border-color: var(--cmp-primary);
    background: var(--cmp-primary-light);
    color: var(--cmp-primary);
}

.cmp-file-label .rzi[b-s5rv7jajqo] {
    font-size: 1.3rem;
}

.cmp-input-hidden[b-s5rv7jajqo] {
    display: none;
}

/* ===== STATS ===== */
.cmp-stats[b-s5rv7jajqo] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

.cmp-stat[b-s5rv7jajqo] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-radius: var(--cmp-radius-sm);
    background: var(--cmp-card);
    border: 1px solid var(--cmp-border);
}

.cmp-stat .rzi[b-s5rv7jajqo] {
    font-size: 1.6rem;
}

.cmp-stat-value[b-s5rv7jajqo] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--cmp-text);
}

.cmp-stat-label[b-s5rv7jajqo] {
    font-size: 0.7rem;
    color: var(--cmp-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.cmp-stat-ok[b-s5rv7jajqo] { border-left: 3px solid var(--cmp-success); }
.cmp-stat-ok .rzi[b-s5rv7jajqo] { color: var(--cmp-success); }
.cmp-stat-err[b-s5rv7jajqo] { border-left: 3px solid var(--cmp-danger); }
.cmp-stat-err .rzi[b-s5rv7jajqo] { color: var(--cmp-danger); }
.cmp-stat-total[b-s5rv7jajqo] { border-left: 3px solid var(--cmp-primary); }
.cmp-stat-total .rzi[b-s5rv7jajqo] { color: var(--cmp-primary); }

/* ===== PREVIEW TABLE ===== */
.cmp-preview[b-s5rv7jajqo] {
    max-height: 280px;
    overflow: auto;
    background: var(--cmp-card);
    border: 1px solid var(--cmp-border);
    border-radius: var(--cmp-radius-sm);
}

.cmp-preview-table[b-s5rv7jajqo] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.78rem;
}

.cmp-preview-table thead th[b-s5rv7jajqo] {
    position: sticky;
    top: 0;
    background: var(--cmp-bg);
    color: var(--cmp-text-secondary);
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 8px 10px;
    text-align: left;
    border-bottom: 1px solid var(--cmp-border);
}

.cmp-preview-table tbody td[b-s5rv7jajqo] {
    padding: 6px 10px;
    border-bottom: 1px dashed #F1F5F9;
    color: var(--cmp-text);
}

.cmp-row-err[b-s5rv7jajqo] {
    background: var(--cmp-danger-light);
}

.cmp-icon-ok[b-s5rv7jajqo] {
    color: var(--cmp-success);
    font-size: 1rem;
}

.cmp-icon-err[b-s5rv7jajqo] {
    color: var(--cmp-danger);
    font-size: 1rem;
}

.cmp-errores-cell[b-s5rv7jajqo] {
    color: var(--cmp-danger);
    font-size: 0.75rem;
    max-width: 220px;
}

/* ===== RESUMEN ===== */
.cmp-resumen[b-s5rv7jajqo] {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 10px 14px;
    background: var(--cmp-card);
    border: 1px solid var(--cmp-border);
    border-radius: var(--cmp-radius-sm);
    font-size: 0.85rem;
}

.cmp-txt-ok[b-s5rv7jajqo] { color: var(--cmp-success); font-weight: 700; }
.cmp-txt-err[b-s5rv7jajqo] { color: var(--cmp-danger); font-weight: 700; }

/* ===== FOOTER ===== */
.cmp-footer[b-s5rv7jajqo] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 10px 16px;
    border-top: 1px solid var(--cmp-border);
    background: var(--cmp-card);
    flex-shrink: 0;
}

.cmp-btn[b-s5rv7jajqo] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cmp-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    color: white;
    transition: var(--cmp-transition);
}

.cmp-btn:hover:not(:disabled)[b-s5rv7jajqo] {
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.cmp-btn:disabled[b-s5rv7jajqo] {
    opacity: 0.55;
    cursor: not-allowed;
}

.cmp-btn-secondary[b-s5rv7jajqo] {
    background: var(--cmp-text-secondary);
}

.cmp-btn-primary[b-s5rv7jajqo] {
    background: var(--cmp-success);
}

.cmp-btn .rzi[b-s5rv7jajqo] {
    font-size: 1rem;
}
/* /Pages/Mantenedores/Productos/Componentes/ProductoDetalle.razor.rz.scp.css */
/* ===== PRODUCTO DETALLE - ESTILOS DEL DIÁLOGO ===== */

/* Contenedor principal del detalle */
.detalle-container[b-d74hp9l9c1] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    font-family: var(--font-family);
    animation: detalleIn-b-d74hp9l9c1 0.3s ease;
}

/* ===== TARJETA DE INFORMACIÓN BÁSICA ===== */
.detalle-info-card[b-d74hp9l9c1] {
    background: linear-gradient(135deg, #EEF2FF 0%, #FFFFFF 100%);
    border-radius: 10px;
    padding: 16px 20px;
    border: 1px solid #E2E8F0;
}

/* Layout horizontal: imagen + campos */
.detalle-info-row[b-d74hp9l9c1] {
    display: flex;
    align-items: flex-start;
    gap: 20px;
}

/* Imagen siempre visible en la cabecera */
.detalle-header-image[b-d74hp9l9c1] {
    width: 7rem;
    height: 7rem;
    object-fit: contain;
    border-radius: 10px;
    background-color: #F8FAFC;
    padding: 6px;
    border: 1px solid #E2E8F0;
    flex-shrink: 0;
}

.detalle-info-grid[b-d74hp9l9c1] {
    flex: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.detalle-field[b-d74hp9l9c1] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.detalle-field-label[b-d74hp9l9c1] {
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.detalle-field-value[b-d74hp9l9c1] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1E293B;
    word-break: break-word;
}

/* ===== TARJETA CON TABS ===== */
.detalle-tabs-card[b-d74hp9l9c1] {
    background: #FFFFFF;
    border-radius: 10px;
    border: 1px solid #E2E8F0;
    overflow: hidden;
}

/* Navegación de tabs */
.detalle-tabs-nav[b-d74hp9l9c1] {
    display: flex;
    gap: 4px;
    padding: 10px 16px;
    border-bottom: 1px solid #E2E8F0;
    background: #F8FAFC;
    overflow-x: auto;
}

.detalle-tab-btn[b-d74hp9l9c1] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    background: transparent;
    color: var(--text-secondary);
    font-size: 0.78rem;
    font-weight: 600;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    white-space: nowrap;
}

.detalle-tab-btn:hover[b-d74hp9l9c1] {
    background: #EEF2FF;
    color: #6366F1;
}

.detalle-tab-btn.active[b-d74hp9l9c1] {
    background: #6366F1;
    color: white;
}

.detalle-tab-btn .rzi[b-d74hp9l9c1] {
    font-size: 1rem;
}

/* Contenido de los tabs */
.detalle-tab-content[b-d74hp9l9c1] {
    padding: 16px 20px;
    min-height: 160px;
    animation: detalleTabFade-b-d74hp9l9c1 0.25s ease;
}

.detalle-tab-grid[b-d74hp9l9c1] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.detalle-tab-grid.single-col[b-d74hp9l9c1] {
    grid-template-columns: 1fr;
}

/* ===== SECCIÓN DE IMAGEN Y EXTRAS ===== */
.detalle-extras-row[b-d74hp9l9c1] {
    display: flex;
    align-items: flex-start;
    gap: 20px;
}

.detalle-image[b-d74hp9l9c1] {
    width: 10rem;
    height: 10rem;
    object-fit: contain;
    border-radius: 10px;
    background-color: #F8FAFC;
    padding: 6px;
    border: 1px solid #E2E8F0;
    flex-shrink: 0;
}

.detalle-extras-fields[b-d74hp9l9c1] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* ===== TEXTAREA READONLY ===== */
.detalle-textarea[b-d74hp9l9c1] {
    width: 100%;
    font-size: 0.82rem;
    background-color: #F8FAFC;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    padding: 8px 10px;
    resize: none;
    color: #1E293B;
    font-family: inherit;
}

/* ===== BOTÓN DE CERRAR ===== */
.detalle-footer[b-d74hp9l9c1] {
    display: flex;
    justify-content: flex-end;
    padding-top: 4px;
}

.detalle-close-btn[b-d74hp9l9c1] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 20px;
    border: none;
    background: var(--color-secondary);
    color: #fff;
    font-size: 0.82rem;
    font-weight: 600;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.detalle-close-btn:hover[b-d74hp9l9c1] {
    background: var(--color-secondary-dark);
    color: #fff;
}

.detalle-close-btn .rzi[b-d74hp9l9c1] {
    font-size: 1rem;
}

/* ===== ANIMACIONES ===== */
@keyframes detalleIn-b-d74hp9l9c1 {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes detalleTabFade-b-d74hp9l9c1 {
    from { opacity: 0; transform: translateY(4px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 640px) {
    .detalle-info-row[b-d74hp9l9c1] {
        flex-direction: column;
        align-items: center;
    }

    .detalle-info-grid[b-d74hp9l9c1],
    .detalle-tab-grid[b-d74hp9l9c1] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Mantenedores/Productos/Componentes/ProductoFormulario.razor.rz.scp.css */
/* ===== PRODUCTO FORMULARIO - ESTILOS DEL DIÁLOGO (CREAR / EDITAR) ===== */

/* Contenedor principal del formulario */
.form-container[b-1kx0fa8sya] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    font-family: var(--font-family);
    animation: formIn-b-1kx0fa8sya 0.3s ease;
}

/* ===== TARJETA DE CAMPOS PRINCIPALES ===== */
.form-main-card[b-1kx0fa8sya] {
    background: linear-gradient(135deg, #EEF2FF 0%, #FFFFFF 100%);
    border-radius: 10px;
    padding: 16px 20px;
    border: 1px solid #E2E8F0;
}

.form-fields-grid[b-1kx0fa8sya] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 16px;
}

.form-field[b-1kx0fa8sya] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.form-field.full-width[b-1kx0fa8sya] {
    grid-column: 1 / -1;
}

.form-field-label[b-1kx0fa8sya] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* Texto informativo sutil bajo un campo (ej: explicacion de Inventariable). */
.form-field-hint[b-1kx0fa8sya] {
    font-size: 0.68rem;
    color: var(--text-muted);
    line-height: 1.3;
    margin-top: 2px;
}

/* Inputs personalizados dentro del formulario - bordes visibles sutiles */
.form-field[b-1kx0fa8sya]  .rz-textbox,
.form-field[b-1kx0fa8sya]  .rz-dropdown,
.form-field[b-1kx0fa8sya]  .rz-spinner,
.form-field[b-1kx0fa8sya]  .rz-textarea,
.form-field[b-1kx0fa8sya]  .rz-inputtext,
.form-field[b-1kx0fa8sya]  .rz-dropdown-trigger,
.form-field[b-1kx0fa8sya]  input,
.form-field[b-1kx0fa8sya]  .rz-numeric,
.form-field[b-1kx0fa8sya]  .rz-fileupload {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: 8px !important;
    font-size: 0.78rem !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    background: white !important;
}

.form-field[b-1kx0fa8sya]  .rz-textbox,
.form-field[b-1kx0fa8sya]  .rz-dropdown,
.form-field[b-1kx0fa8sya]  .rz-spinner,
.form-field[b-1kx0fa8sya]  .rz-numeric {
    height: 30px !important;
}

.form-field[b-1kx0fa8sya]  .rz-textbox:focus,
.form-field[b-1kx0fa8sya]  .rz-state-focused,
.form-field[b-1kx0fa8sya]  input:focus,
.form-field[b-1kx0fa8sya]  .rz-numeric:focus-within {
    border-color: #6366F1 !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

/* Asegurar que dropdowns cerrados muestren borde */
.form-field[b-1kx0fa8sya]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
}

/* ===== TARJETA CON TABS ===== */
.form-tabs-card[b-1kx0fa8sya] {
    background: #FFFFFF;
    border-radius: 10px;
    border: 1px solid #E2E8F0;
    overflow: hidden;
}

/* Navegación de tabs */
.form-tabs-nav[b-1kx0fa8sya] {
    display: flex;
    gap: 4px;
    padding: 10px 16px;
    border-bottom: 1px solid #E2E8F0;
    background: #F8FAFC;
    overflow-x: auto;
}

.form-tab-btn[b-1kx0fa8sya] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 7px 12px;
    border: none;
    background: transparent;
    color: var(--text-secondary);
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    white-space: nowrap;
}

.form-tab-btn:hover[b-1kx0fa8sya] {
    background: #EEF2FF;
    color: #6366F1;
}

.form-tab-btn.active[b-1kx0fa8sya] {
    background: #6366F1;
    color: white;
}

.form-tab-btn .rzi[b-1kx0fa8sya] {
    font-size: 1rem;
}

/* Contenido de los tabs */
.form-tab-content[b-1kx0fa8sya] {
    padding: 16px 20px;
    min-height: 180px;
    animation: formTabFade-b-1kx0fa8sya 0.25s ease;
}

.form-tab-grid[b-1kx0fa8sya] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 16px;
}

/* ===== SECCIÓN DE IMAGEN ===== */

/* Contenedor principal de la seccion imagen: preview a la izquierda, upload a la derecha */
.form-image-section[b-1kx0fa8sya] {
    display: flex;
    align-items: flex-start;
    gap: 24px;
}

/* Contenedor del preview con etiqueta debajo */
.form-image-preview-wrapper[b-1kx0fa8sya] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

/* Imagen de vista previa del producto */
.form-image-preview[b-1kx0fa8sya] {
    width: 130px;
    height: 130px;
    object-fit: cover;
    display: block;
    border-radius: 12px;
    border: 1.5px solid #E2E8F0;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.1);
    background: #F8FAFC;
}

/* Texto "Vista previa" debajo de la imagen */
.form-image-hint[b-1kx0fa8sya] {
    font-size: 0.65rem;
    color: #94A3B8;
    font-weight: 500;
    letter-spacing: 0.03em;
}

/* Contenedor del input de subida de archivo */
.form-image-upload[b-1kx0fa8sya] {
    flex: 1;
}

/* Ocultar la preview interna que genera el RadzenFileInput */
[b-1kx0fa8sya] .form-image-upload .rz-fileupload-preview,
[b-1kx0fa8sya] .form-image-upload .rz-fileupload-image,
[b-1kx0fa8sya] .form-image-upload img {
    display: none !important;
}

/* ===== FOOTER CON BOTONES ===== */
.form-footer[b-1kx0fa8sya] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding-top: 4px;
}

.form-btn[b-1kx0fa8sya] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: 8px;
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.form-btn .rzi[b-1kx0fa8sya] {
    font-size: 1rem;
}

.form-btn-save[b-1kx0fa8sya] {
    background: var(--color-success);
    color: white;
}

.form-btn-save:hover[b-1kx0fa8sya] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.form-btn-cancel[b-1kx0fa8sya] {
    background: var(--color-secondary);
    color: #fff;
    border: none;
}

.form-btn-cancel:hover[b-1kx0fa8sya] {
    background: var(--color-secondary-dark);
    color: #fff;
}

/* ===== ANIMACIONES ===== */
@keyframes formIn-b-1kx0fa8sya {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes formTabFade-b-1kx0fa8sya {
    from { opacity: 0; transform: translateY(4px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 640px) {
    .form-fields-grid[b-1kx0fa8sya],
    .form-tab-grid[b-1kx0fa8sya] {
        grid-template-columns: 1fr;
    }

    .form-tabs-nav[b-1kx0fa8sya] {
        overflow-x: auto;
    }

    .form-field.full-width[b-1kx0fa8sya] {
        grid-column: auto;
    }

    .form-image-section[b-1kx0fa8sya] {
        flex-direction: column;
        align-items: center;
    }
}
/* /Pages/Mantenedores/Productos/ProductosIndex.razor.rz.scp.css */
/* ===== PRODUCTOS - DESIGN SYSTEM ===== */
/* Paleta de colores consistente con Clientes y POS */

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-zmimu9ok4r] .prod-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

/* ===== CONTENEDOR PRINCIPAL ===== */
.prod-container[b-zmimu9ok4r] {
    --prod-primary: var(--color-primary);
    --prod-primary-dark: var(--color-primary-dark);
    --prod-primary-light: var(--color-primary-light);
    --prod-accent: var(--color-warning);
    --prod-accent-dark: var(--color-warning-dark);
    --prod-accent-light: #FFFBEB;
    --prod-success: var(--color-success);
    --prod-success-light: var(--color-success-light);
    --prod-danger: var(--color-danger);
    --prod-danger-light: var(--color-danger-light);
    --prod-info: var(--color-info);
    --prod-info-light: var(--color-info-light);
    --prod-bg: var(--bg);
    --prod-card: var(--surface);
    --prod-text: var(--text);
    --prod-text-secondary: var(--text-secondary);
    --prod-text-muted: var(--text-muted);
    --prod-border: var(--border);
    --prod-shadow-sm: var(--shadow-xs);
    --prod-shadow: var(--shadow-sm);
    --prod-shadow-md: var(--shadow-md);
    --prod-radius: var(--radius-lg);
    --prod-radius-sm: var(--radius-md);
    --prod-radius-xs: var(--radius-sm);
    --prod-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--prod-bg);
    overflow: hidden;
    box-sizing: border-box;
    font-family: var(--font-family);
    padding: 16px;
    gap: 12px;
    animation: prodFadeIn-b-zmimu9ok4r 0.35s ease;
}

/* ===== BARRA SUPERIOR / HEADER ===== */
.prod-header[b-zmimu9ok4r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--prod-card);
    border-radius: var(--prod-radius);
    box-shadow: var(--prod-shadow);
    padding: 12px 20px;
    flex-shrink: 0;
    border: 1px solid var(--prod-border);
}

.prod-header-left[b-zmimu9ok4r] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.prod-header-icon[b-zmimu9ok4r] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    background: var(--prod-primary-light);
    border-radius: var(--prod-radius-sm);
    color: var(--prod-primary);
    font-size: 1.25rem;
}

.prod-header h2[b-zmimu9ok4r] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--prod-text);
    margin: 0;
    letter-spacing: -0.01em;
}

.prod-header-subtitle[b-zmimu9ok4r] {
    font-size: 0.75rem;
    color: var(--prod-text-secondary);
    margin: 0;
    font-weight: 500;
}

.prod-header-actions[b-zmimu9ok4r] {
    display: flex;
    gap: 8px;
    align-items: center;
}

.prod-search-input[b-zmimu9ok4r] {
    padding: 7px 14px;
    border: 1px solid var(--prod-border);
    border-radius: var(--prod-radius-sm);
    font-size: 0.82rem;
    font-family: inherit;
    color: var(--prod-text);
    background: var(--prod-bg);
    outline: none;
    width: 260px;
    transition: var(--prod-transition);
}

.prod-search-input:focus[b-zmimu9ok4r] {
    border-color: var(--prod-primary);
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

.prod-search-input[b-zmimu9ok4r]::placeholder {
    color: var(--prod-text-muted);
    font-weight: 400;
}

/* ===== BOTONES ===== */
.prod-btn[b-zmimu9ok4r] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--prod-radius-sm);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--prod-transition);
    letter-spacing: 0.01em;
}

.prod-btn-primary[b-zmimu9ok4r] {
    background: var(--prod-primary);
    color: white;
}

.prod-btn-primary:hover[b-zmimu9ok4r] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.prod-btn-primary:active[b-zmimu9ok4r] {
    transform: translateY(0);
}

.prod-btn-carga[b-zmimu9ok4r] {
    background: var(--color-upload);
    color: white;
}

.prod-btn-carga:hover[b-zmimu9ok4r] {
    background: var(--color-upload-dark);
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.prod-btn-carga:active[b-zmimu9ok4r] {
    transform: translateY(0);
}

.prod-btn-accent[b-zmimu9ok4r] {
    background: var(--color-template);
    color: white;
}

.prod-btn-accent:hover[b-zmimu9ok4r] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.prod-btn-accent:active[b-zmimu9ok4r] {
    transform: translateY(0);
}

.prod-btn-filtros[b-zmimu9ok4r] {
    background: var(--prod-info);
    color: white;
}

.prod-btn-filtros.active[b-zmimu9ok4r] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
}

.prod-btn-buscar[b-zmimu9ok4r] {
    background: var(--prod-accent);
    color: white;
}

.prod-btn-buscar:hover[b-zmimu9ok4r] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.prod-btn-ghost[b-zmimu9ok4r] {
    background: var(--color-limpiar);
    color: #fff;
    border: 1px solid transparent;
}

.prod-btn-ghost:hover[b-zmimu9ok4r] {
    background: var(--color-limpiar-dark);
    color: #fff;
}

/* ===== PANEL DE FILTROS ===== */
.prod-filtros-wrapper[b-zmimu9ok4r] {
    position: relative;
    flex-shrink: 0;
}

.prod-filtros-panel[b-zmimu9ok4r] {
    background: var(--prod-card);
    border-radius: var(--prod-radius);
    box-shadow: var(--prod-shadow-md);
    border: 1px solid var(--prod-border);
    overflow: hidden;
    animation: prodSlideDown-b-zmimu9ok4r 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.prod-filtros-header[b-zmimu9ok4r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--prod-border);
    background: linear-gradient(135deg, var(--prod-info-light) 0%, var(--prod-card) 100%);
}

.prod-filtros-header h3[b-zmimu9ok4r] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--prod-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.prod-filtros-header h3 .rzi[b-zmimu9ok4r] {
    color: var(--prod-info);
    font-size: 1.1rem;
}

.prod-filtros-close-btn[b-zmimu9ok4r] {
    background: none;
    border: none;
    color: var(--prod-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--prod-radius-xs);
    transition: var(--prod-transition);
    display: flex;
    align-items: center;
}

.prod-filtros-close-btn:hover[b-zmimu9ok4r] {
    background: var(--prod-danger-light);
    color: var(--prod-danger);
}

.prod-filtros-body[b-zmimu9ok4r] {
    padding: 12px 16px;
}

.prod-filtros-grid[b-zmimu9ok4r] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
}

.prod-filtro-field[b-zmimu9ok4r] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.prod-filtro-label[b-zmimu9ok4r] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--prod-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Dos numéricos lado a lado para el rango de precio */
.prod-filtro-rango[b-zmimu9ok4r] {
    display: flex;
    gap: 8px;
}

/* Input nativo del buscador en tiempo real (mismo aspecto que los inputs Radzen del panel) */
.prod-filtro-input[b-zmimu9ok4r] {
    border: 1.5px solid #CBD5E1;
    border-radius: var(--prod-radius-xs);
    font-size: 0.8rem;
    height: 32px;
    padding: 0 10px;
    font-family: inherit;
    color: var(--prod-text);
    background: white;
    outline: none;
    transition: var(--prod-transition);
    box-sizing: border-box;
    width: 100%;
}

.prod-filtro-input:focus[b-zmimu9ok4r] {
    border-color: var(--prod-primary);
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

.prod-filtro-field[b-zmimu9ok4r]  .rz-textbox,
.prod-filtro-field[b-zmimu9ok4r]  .rz-numeric,
.prod-filtro-field[b-zmimu9ok4r]  .rz-dropdown,
.prod-filtro-field[b-zmimu9ok4r]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--prod-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--prod-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.prod-filtro-field[b-zmimu9ok4r]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.prod-filtro-field[b-zmimu9ok4r]  .rz-textbox:focus,
.prod-filtro-field[b-zmimu9ok4r]  .rz-state-focused,
.prod-filtro-field[b-zmimu9ok4r]  input:focus,
.prod-filtro-field[b-zmimu9ok4r]  .rz-numeric:focus-within {
    border-color: var(--prod-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

/* Texto del dropdown visible sin recorte */
.prod-filtro-field[b-zmimu9ok4r]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.prod-filtros-actions[b-zmimu9ok4r] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 12px;
}

/* ===== CONTENEDOR DE LA GRILLA ===== */
.prod-grid-wrapper[b-zmimu9ok4r] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--prod-card);
    border-radius: var(--prod-radius);
    box-shadow: var(--prod-shadow);
    overflow: hidden;
    min-height: 0;
    border: 1px solid var(--prod-border);
    animation: prodSlideUp-b-zmimu9ok4r 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ===== BOTONES DE ACCIÓN EN LA GRILLA ===== */
.prod-action-group[b-zmimu9ok4r] {
    display: flex;
    gap: 4px;
    justify-content: center;
    align-items: center;
}

.prod-action-btn[b-zmimu9ok4r] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--prod-radius-xs);
    cursor: pointer;
    transition: var(--prod-transition);
    padding: 0;
    color: white;
    font-size: 0.85rem;
}

.prod-action-btn .rzi[b-zmimu9ok4r] {
    font-size: 0.9rem;
}

.prod-action-btn:hover[b-zmimu9ok4r] {
    transform: scale(1.12);
    box-shadow: var(--prod-shadow-md);
}

.prod-action-btn:active[b-zmimu9ok4r] {
    transform: scale(0.95);
}

.prod-action-btn.detail[b-zmimu9ok4r] {
    background: var(--color-detail);
}

.prod-action-btn.detail:hover[b-zmimu9ok4r] {
    background: var(--color-detail-dark);
}

.prod-action-btn.edit[b-zmimu9ok4r] {
    background: var(--prod-info);
}

.prod-action-btn.edit:hover[b-zmimu9ok4r] {
    background: #0284C7;
}

.prod-action-btn.delete[b-zmimu9ok4r] {
    background: var(--prod-danger);
}

.prod-action-btn.delete:hover[b-zmimu9ok4r] {
    background: #DC2626;
}

/* ===== ESTADO DE CARGA ===== */
.prod-loading[b-zmimu9ok4r] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    gap: 16px;
    background: var(--prod-bg);
    animation: prodFadeIn-b-zmimu9ok4r 0.3s ease;
}

.prod-spinner[b-zmimu9ok4r] {
    width: 40px;
    height: 40px;
    border: 3px solid var(--prod-border);
    border-top-color: var(--prod-primary);
    border-radius: 50%;
    animation: prodSpin-b-zmimu9ok4r 0.8s linear infinite;
}

.prod-loading-text[b-zmimu9ok4r] {
    font-size: 0.85rem;
    color: var(--prod-text-secondary);
    font-weight: 500;
}

/* ===== BADGE CONTADOR ===== */
.prod-badge[b-zmimu9ok4r] {
    background: var(--prod-primary);
    color: white;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 2px 10px;
    border-radius: 20px;
    min-width: 24px;
    text-align: center;
    animation: prodBadgePop-b-zmimu9ok4r 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* ===== ESTILOS DE LA GRILLA RADZEN ===== */
[b-zmimu9ok4r] .rz-datatable {
    border: none !important;
}

[b-zmimu9ok4r] .rz-datatable-thead > tr > th {
    background: var(--prod-bg) !important;
    color: var(--prod-text-secondary) !important;
    font-size: 0.7rem !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    border-bottom: 1px solid var(--prod-border) !important;
    padding: 10px 12px !important;
}

[b-zmimu9ok4r] .rz-datatable-tbody > tr {
    transition: var(--prod-transition);
}

[b-zmimu9ok4r] .rz-datatable-tbody > tr:hover {
    background: var(--prod-primary-light) !important;
}

[b-zmimu9ok4r] .rz-datatable-tbody > tr > td {
    border-bottom: 1px dashed #F1F5F9 !important;
    font-size: 0.78rem !important;
    color: var(--prod-text) !important;
    padding: 8px 12px !important;
}

[b-zmimu9ok4r] .rz-pager {
    border-top: 1px solid var(--prod-border) !important;
    padding: 6px 12px !important;
}

/* ===== ANIMACIONES ===== */
@keyframes prodFadeIn-b-zmimu9ok4r {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes prodSlideUp-b-zmimu9ok4r {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes prodSlideDown-b-zmimu9ok4r {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 600px; }
}

@keyframes prodSpin-b-zmimu9ok4r {
    to { transform: rotate(360deg); }
}

@keyframes prodBadgePop-b-zmimu9ok4r {
    0% { transform: scale(0.5); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .prod-container[b-zmimu9ok4r] {
        padding: 10px;
        gap: 8px;
    }

    .prod-header[b-zmimu9ok4r] {
        padding: 10px 14px;
    }

    .prod-header h2[b-zmimu9ok4r] {
        font-size: 0.95rem;
    }
}

@media (max-width: 640px) {
    .prod-container[b-zmimu9ok4r] {
        padding: 8px;
    }

    .prod-header-subtitle[b-zmimu9ok4r] {
        display: none;
    }

    .prod-btn[b-zmimu9ok4r] {
        padding: 7px 14px;
        font-size: 0.78rem;
    }
}

.prod-btn .rzi[b-zmimu9ok4r] {
    font-size: 1rem;
}
/* /Pages/Mantenedores/TiposPago/Componentes/TipoPagoFormulario.razor.rz.scp.css */
/* ===== MODAL EDITAR TIPO DE PAGO ===== */

.tpf-modal[b-tf52yfl5fx] {
    --tpf-primary: var(--color-primary);
    --tpf-primary-light: var(--color-primary-light);
    --tpf-success: var(--color-success);
    --tpf-border: var(--border);
    --tpf-bg: #F8FAFC;
    --tpf-card: var(--surface);
    --tpf-text: var(--text);
    --tpf-text-secondary: var(--text-secondary);
    --tpf-radius-xs: var(--radius-sm);
    --tpf-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    background: var(--tpf-bg);
    font-family: var(--font-family);
    position: relative;
}

.tpf-loading-overlay[b-tf52yfl5fx] {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    z-index: 10;
    color: var(--tpf-text-secondary);
    font-weight: 600;
    font-size: 0.85rem;
}

.tpf-loading-spinner[b-tf52yfl5fx] {
    width: 42px;
    height: 42px;
    border: 4px solid var(--tpf-border);
    border-top-color: var(--tpf-primary);
    border-radius: 50%;
    animation: tpfSpin-b-tf52yfl5fx 0.8s linear infinite;
}

@keyframes tpfSpin-b-tf52yfl5fx {
    to { transform: rotate(360deg); }
}

.tpf-body[b-tf52yfl5fx] {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
}

.tpf-grid[b-tf52yfl5fx] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 16px;
}

.tpf-field[b-tf52yfl5fx] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.tpf-full[b-tf52yfl5fx] {
    grid-column: 1 / -1;
}

.tpf-label[b-tf52yfl5fx] {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--tpf-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.tpf-field[b-tf52yfl5fx]  .rz-textbox,
.tpf-field[b-tf52yfl5fx]  .rz-inputtext,
.tpf-field[b-tf52yfl5fx]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--tpf-radius-xs) !important;
    font-size: 0.85rem !important;
    height: 36px !important;
    background: white !important;
    transition: var(--tpf-transition);
}

.tpf-field[b-tf52yfl5fx]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--tpf-radius-xs) !important;
    font-size: 0.85rem !important;
    height: 36px !important;
    background: white !important;
    transition: var(--tpf-transition);
    box-sizing: border-box !important;
}

.tpf-field[b-tf52yfl5fx]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.tpf-field[b-tf52yfl5fx]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.85rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tpf-field[b-tf52yfl5fx]  .rz-textbox:focus,
.tpf-field[b-tf52yfl5fx]  .rz-state-focused,
.tpf-field[b-tf52yfl5fx]  input:focus {
    border-color: var(--tpf-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
    outline: none;
}

.tpf-footer[b-tf52yfl5fx] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 10px 16px;
    border-top: 1px solid var(--tpf-border);
    background: var(--tpf-card);
    flex-shrink: 0;
}

.tpf-btn[b-tf52yfl5fx] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--tpf-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    color: white;
    transition: var(--tpf-transition);
}

.tpf-btn:hover:not(:disabled)[b-tf52yfl5fx] {
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.tpf-btn:disabled[b-tf52yfl5fx] {
    opacity: 0.6;
    cursor: not-allowed;
}

.tpf-btn-secondary[b-tf52yfl5fx] {
    background: var(--color-secondary);
}

.tpf-btn-secondary:hover:not(:disabled)[b-tf52yfl5fx] {
    background: var(--color-secondary-dark);
}

.tpf-btn-primary[b-tf52yfl5fx] {
    background: var(--color-success);
}

.tpf-btn .rzi[b-tf52yfl5fx] {
    font-size: 1rem;
}

@media (max-width: 640px) {
    .tpf-grid[b-tf52yfl5fx] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Mantenedores/TiposPago/TiposPagoIndex.razor.rz.scp.css */
/* ===== TIPOS DE PAGO - DESIGN SYSTEM ===== */

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-o3xr3fayje] .tpago-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

.tpago-container[b-o3xr3fayje] {
    --tp-primary: var(--color-primary);
    --tp-primary-dark: var(--color-primary-dark);
    --tp-primary-light: var(--color-primary-light);
    --tp-accent: var(--color-warning);
    --tp-success: var(--color-success);
    --tp-danger: var(--color-danger);
    --tp-danger-light: var(--color-danger-light);
    --tp-info: var(--color-info);
    --tp-info-light: var(--color-info-light);
    --tp-orange: var(--color-accent);
    --tp-orange-dark: var(--color-accent-dark);
    --tp-bg: var(--bg);
    --tp-card: var(--surface);
    --tp-text: var(--text);
    --tp-text-secondary: var(--text-secondary);
    --tp-text-muted: var(--text-muted);
    --tp-border: var(--border);
    --tp-shadow-sm: var(--shadow-xs);
    --tp-shadow: var(--shadow-sm);
    --tp-shadow-md: var(--shadow-md);
    --tp-radius: var(--radius-lg);
    --tp-radius-xs: var(--radius-sm);
    --tp-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--tp-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.tpago-control-bar[b-o3xr3fayje] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--tp-card);
    border-radius: var(--tp-radius);
    box-shadow: var(--tp-shadow);
    padding: 10px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 56px;
}

.control-left[b-o3xr3fayje] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.tpago-header-icon[b-o3xr3fayje] {
    width: 40px;
    height: 40px;
    border-radius: var(--tp-radius-xs);
    background: linear-gradient(135deg, var(--tp-primary) 0%, var(--tp-primary-dark) 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
}

.control-left h2[b-o3xr3fayje] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--tp-text);
}

.tpago-header-subtitle[b-o3xr3fayje] {
    margin: 0;
    font-size: 0.72rem;
    color: var(--tp-text-secondary);
}

.control-right[b-o3xr3fayje] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES ===== */
.tpago-btn[b-o3xr3fayje] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--tp-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--tp-transition);
    white-space: nowrap;
    color: white;
}

.tpago-btn:hover[b-o3xr3fayje] {
    transform: translateY(-1px);
    box-shadow: var(--tp-shadow-md);
}

.tpago-btn:active[b-o3xr3fayje] {
    transform: translateY(0);
}

.tpago-btn .rzi[b-o3xr3fayje] {
    font-size: 1rem;
}

.btn-buscar[b-o3xr3fayje] {
    background: var(--tp-orange);
}

.btn-nuevo[b-o3xr3fayje] {
    background: var(--color-primary);
}

.btn-filtros[b-o3xr3fayje] {
    background: var(--tp-info);
}

.btn-filtros.active[b-o3xr3fayje] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* ===== PANEL DE FILTROS ===== */
.filtros-wrapper[b-o3xr3fayje] {
    position: relative;
    flex-shrink: 0;
}

.filtros-panel[b-o3xr3fayje] {
    background: var(--tp-card);
    border-radius: var(--tp-radius);
    box-shadow: var(--tp-shadow-md);
    overflow: hidden;
    animation: tpSlideDown-b-o3xr3fayje 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.filtros-header[b-o3xr3fayje] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--tp-border);
    background: linear-gradient(135deg, var(--tp-info-light) 0%, var(--tp-card) 100%);
}

.filtros-header h3[b-o3xr3fayje] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--tp-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.filtros-header h3 .rzi[b-o3xr3fayje] {
    color: var(--tp-info);
    font-size: 1.1rem;
}

.filtros-close-btn[b-o3xr3fayje] {
    background: none;
    border: none;
    color: var(--tp-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--tp-radius-xs);
    transition: var(--tp-transition);
    display: flex;
    align-items: center;
}

.filtros-close-btn:hover[b-o3xr3fayje] {
    background: var(--tp-danger-light);
    color: var(--tp-danger);
}

.filtros-body[b-o3xr3fayje] {
    padding: 12px 16px;
}

.filtros-grid[b-o3xr3fayje] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.filtro-field[b-o3xr3fayje] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.filtro-label[b-o3xr3fayje] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--tp-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.filtro-field[b-o3xr3fayje]  .rz-textbox,
.filtro-field[b-o3xr3fayje]  .rz-inputtext,
.filtro-field[b-o3xr3fayje]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--tp-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--tp-transition);
    background: white !important;
}

.filtro-field[b-o3xr3fayje]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--tp-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--tp-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.filtro-field[b-o3xr3fayje]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.filtro-field[b-o3xr3fayje]  .rz-textbox:focus,
.filtro-field[b-o3xr3fayje]  .rz-state-focused,
.filtro-field[b-o3xr3fayje]  input:focus {
    border-color: var(--tp-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

.filtro-field[b-o3xr3fayje]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== GRILLA DE DATOS ===== */
.tpago-grid-wrapper[b-o3xr3fayje] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--tp-card);
    border-radius: var(--tp-radius);
    box-shadow: var(--tp-shadow);
    overflow: hidden;
    min-height: 0;
}

[b-o3xr3fayje] .tpago-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

[b-o3xr3fayje] .tpago-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--tp-bg) !important;
    color: var(--tp-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--tp-border) !important;
}

[b-o3xr3fayje] .tpago-grid-wrapper .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
}

[b-o3xr3fayje] .tpago-grid-wrapper .rz-datatable-tbody > tr:hover {
    background-color: var(--tp-primary-light) !important;
}

[b-o3xr3fayje] .tpago-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* ===== BOTONES DE ACCION EN FILAS ===== */
.tpago-action-group[b-o3xr3fayje] {
    display: flex;
    gap: 6px;
    justify-content: center;
}

.tpago-action-btn[b-o3xr3fayje] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--tp-radius-xs);
    cursor: pointer;
    transition: var(--tp-transition);
    padding: 0;
    color: white;
    font-size: 0.85rem;
}

.tpago-action-btn .rzi[b-o3xr3fayje] {
    font-size: 0.9rem;
}

.tpago-action-btn:hover[b-o3xr3fayje] {
    transform: scale(1.12);
    box-shadow: var(--tp-shadow-md);
}

.tpago-action-btn:active[b-o3xr3fayje] {
    transform: scale(0.95);
}

.tpago-action-btn.edit[b-o3xr3fayje] {
    background: var(--tp-info);
}

.tpago-action-btn.edit:hover[b-o3xr3fayje] {
    background: #0284C7;
}

.tpago-action-btn.delete[b-o3xr3fayje] {
    background: var(--tp-danger);
}

.tpago-action-btn.delete:hover[b-o3xr3fayje] {
    background: #DC2626;
}

/* ===== ANIMACIONES ===== */
@keyframes tpSlideDown-b-o3xr3fayje {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .tpago-container[b-o3xr3fayje] {
        padding: 8px 10px;
        gap: 8px;
    }

    .tpago-control-bar[b-o3xr3fayje] {
        flex-wrap: wrap;
    }

    .filtros-grid[b-o3xr3fayje] {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
}

@media (max-width: 640px) {
    .tpago-container[b-o3xr3fayje] {
        padding: 6px 8px;
        gap: 6px;
    }

    .tpago-control-bar[b-o3xr3fayje] {
        flex-direction: column;
        gap: 8px;
    }

    .control-left[b-o3xr3fayje],
    .control-right[b-o3xr3fayje] {
        width: 100%;
        justify-content: center;
    }

    .control-right[b-o3xr3fayje] {
        flex-wrap: wrap;
    }

    .tpago-btn[b-o3xr3fayje] {
        flex: 1;
        justify-content: center;
        min-width: 0;
    }

    .filtros-grid[b-o3xr3fayje] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Mantenedores/TiposProducto/Componentes/AgregarCategoriaModal.razor.rz.scp.css */
/* ===== MODAL AGREGAR CATEGORIA ===== */

.agc-modal[b-k3dmz6j2ht] {
    --agc-primary: var(--color-primary);
    --agc-primary-light: var(--color-primary-light);
    --agc-success: var(--color-success);
    --agc-border: var(--border);
    --agc-bg: #F8FAFC;
    --agc-card: var(--surface);
    --agc-text: var(--text);
    --agc-text-secondary: var(--text-secondary);
    --agc-radius-xs: var(--radius-sm);
    --agc-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    background: var(--agc-bg);
    font-family: var(--font-family);
    position: relative;
}

.agc-loading-overlay[b-k3dmz6j2ht] {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    z-index: 10;
    color: var(--agc-text-secondary);
    font-weight: 600;
    font-size: 0.85rem;
}

.agc-loading-spinner[b-k3dmz6j2ht] {
    width: 42px;
    height: 42px;
    border: 4px solid var(--agc-border);
    border-top-color: var(--agc-primary);
    border-radius: 50%;
    animation: agcSpin-b-k3dmz6j2ht 0.8s linear infinite;
}

@keyframes agcSpin-b-k3dmz6j2ht {
    to { transform: rotate(360deg); }
}

.agc-body[b-k3dmz6j2ht] {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.agc-field[b-k3dmz6j2ht] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.agc-label[b-k3dmz6j2ht] {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--agc-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.agc-field[b-k3dmz6j2ht]  .rz-textbox,
.agc-field[b-k3dmz6j2ht]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--agc-radius-xs) !important;
    font-size: 0.85rem !important;
    height: 36px !important;
    background: white !important;
    transition: var(--agc-transition);
}

.agc-field[b-k3dmz6j2ht]  .rz-textbox:focus,
.agc-field[b-k3dmz6j2ht]  input:focus {
    border-color: var(--agc-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
    outline: none;
}

.agc-footer[b-k3dmz6j2ht] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 10px 16px;
    border-top: 1px solid var(--agc-border);
    background: var(--agc-card);
    flex-shrink: 0;
}

.agc-btn[b-k3dmz6j2ht] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--agc-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    color: white;
    transition: var(--agc-transition);
}

.agc-btn:hover:not(:disabled)[b-k3dmz6j2ht] {
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.agc-btn:disabled[b-k3dmz6j2ht] {
    opacity: 0.6;
    cursor: not-allowed;
}

.agc-btn-secondary[b-k3dmz6j2ht] {
    background: var(--color-secondary);
}

.agc-btn-secondary:hover:not(:disabled)[b-k3dmz6j2ht] {
    background: var(--color-secondary-dark);
}

/* Guardar = índigo (DESIGN_SYSTEM §4.3) */
.agc-btn-primary[b-k3dmz6j2ht] {
    background: var(--agc-primary);
}

.agc-btn .rzi[b-k3dmz6j2ht] {
    font-size: 1rem;
}
/* /Pages/Mantenedores/TiposProducto/Componentes/TiposProductoJerarquia.razor.rz.scp.css */
/* ===== MODAL JERARQUIA TIPOS DE PRODUCTO ===== */

.tpj-modal[b-djhjr1egz0] {
    --tpj-primary: var(--color-primary);
    --tpj-primary-light: var(--color-primary-light);
    --tpj-success: var(--color-success);
    --tpj-success-light: var(--color-success-light);
    --tpj-info: var(--color-info);
    --tpj-info-light: var(--color-info-light);
    --tpj-warning: var(--color-warning);
    --tpj-warning-light: var(--color-warning-light);
    --tpj-danger: var(--color-danger);
    --tpj-danger-light: var(--color-danger-light);
    --tpj-bg: #F8FAFC;
    --tpj-card: var(--surface);
    --tpj-text: var(--text);
    --tpj-text-secondary: var(--text-secondary);
    --tpj-text-muted: var(--text-muted);
    --tpj-border: var(--border);
    --tpj-radius: 10px;
    --tpj-radius-xs: var(--radius-sm);
    --tpj-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    background: var(--tpj-bg);
    font-family: var(--font-family);
    position: relative;
}

/* ===== LOADING OVERLAY ===== */
.tpj-loading-overlay[b-djhjr1egz0] {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    z-index: 10;
    color: var(--tpj-text-secondary);
    font-weight: 600;
    font-size: 0.85rem;
}

.tpj-loading-spinner[b-djhjr1egz0] {
    width: 42px;
    height: 42px;
    border: 4px solid var(--tpj-border);
    border-top-color: var(--tpj-primary);
    border-radius: 50%;
    animation: tpjSpin-b-djhjr1egz0 0.8s linear infinite;
}

@keyframes tpjSpin-b-djhjr1egz0 {
    to { transform: rotate(360deg); }
}

/* ===== BODY ===== */
.tpj-body[b-djhjr1egz0] {
    flex: 1;
    overflow-y: auto;
    padding: 16px 18px;
}

.tpj-empty[b-djhjr1egz0] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: var(--tpj-text-secondary);
    padding: 40px 20px;
    font-size: 0.9rem;
}

/* ===== FOOTER ===== */
.tpj-footer[b-djhjr1egz0] {
    display: flex;
    justify-content: flex-end;
    padding: 10px 16px;
    border-top: 1px solid var(--tpj-border);
    background: var(--tpj-card);
    flex-shrink: 0;
    position: sticky;
    bottom: 0;
    z-index: 5;
}

.tpj-btn[b-djhjr1egz0] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--tpj-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--tpj-transition);
}

.tpj-btn-secondary[b-djhjr1egz0] {
    background: var(--color-secondary);
    color: #fff;
    border: none;
}

.tpj-btn-secondary:hover[b-djhjr1egz0] {
    background: var(--color-secondary-dark);
    transform: translateY(-1px);
}

/* ===== NODOS (arbol) ===== */
[b-djhjr1egz0] .tpj-nodo {
    margin-bottom: 4px;
}

[b-djhjr1egz0] .tpj-nodo-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    background: var(--tpj-card);
    border: 1px solid var(--tpj-border);
    border-radius: var(--tpj-radius-xs);
    transition: var(--tpj-transition);
    min-height: 40px;
}

[b-djhjr1egz0] .tpj-nodo-row:hover {
    box-shadow: 0 2px 6px rgba(0,0,0,0.06);
    border-color: var(--tpj-primary-light);
}

[b-djhjr1egz0] .tpj-nivel-1 > .tpj-nodo-row {
    background: linear-gradient(135deg, var(--tpj-primary-light) 0%, #F5F3FF 100%);
    border-color: var(--tpj-primary);
    border-width: 1.5px;
}

[b-djhjr1egz0] .tpj-nivel-2 > .tpj-nodo-row {
    border-left: 3px solid var(--tpj-info);
}

[b-djhjr1egz0] .tpj-nivel-3 > .tpj-nodo-row {
    border-left: 3px solid var(--tpj-warning);
}

[b-djhjr1egz0] .tpj-nivel-4 > .tpj-nodo-row {
    border-left: 3px solid var(--tpj-success);
}

[b-djhjr1egz0] .tpj-caret {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--tpj-text-muted);
    padding: 2px;
    display: flex;
    align-items: center;
    border-radius: 4px;
    transition: var(--tpj-transition);
    flex-shrink: 0;
}

[b-djhjr1egz0] .tpj-caret:hover {
    background: var(--tpj-border);
    color: var(--tpj-text);
}

[b-djhjr1egz0] .tpj-caret-hidden {
    visibility: hidden;
    pointer-events: none;
}

[b-djhjr1egz0] .tpj-caret .rzi {
    font-size: 1.1rem;
}

[b-djhjr1egz0] .tpj-nodo-badge {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 3px 8px;
    border-radius: 999px;
    flex-shrink: 0;
    min-width: 72px;
    text-align: center;
}

[b-djhjr1egz0] .tpj-badge-1 {
    background: var(--tpj-primary);
    color: white;
}

[b-djhjr1egz0] .tpj-badge-2 {
    background: var(--tpj-info-light);
    color: var(--tpj-info);
}

[b-djhjr1egz0] .tpj-badge-3 {
    background: var(--tpj-warning-light);
    color: #B45309;
}

[b-djhjr1egz0] .tpj-badge-4 {
    background: var(--tpj-success-light);
    color: #047857;
}

[b-djhjr1egz0] .tpj-nodo-codigo {
    font-family: 'Consolas', 'Monaco', monospace;
    font-size: 0.78rem;
    color: var(--tpj-text-secondary);
    background: var(--tpj-bg);
    padding: 2px 8px;
    border-radius: 4px;
    flex-shrink: 0;
    min-width: 70px;
    text-align: center;
}

[b-djhjr1egz0] .tpj-nodo-nombre {
    flex: 1;
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--tpj-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

[b-djhjr1egz0] .tpj-nivel-1 .tpj-nodo-nombre {
    font-size: 0.95rem;
    color: var(--tpj-primary);
}

[b-djhjr1egz0] .tpj-input-inline {
    width: 100%;
    padding: 5px 8px;
    border: 1.5px solid var(--tpj-primary);
    border-radius: 4px;
    font-size: 0.85rem;
    outline: none;
    background: white;
    box-shadow: 0 0 0 3px rgba(99,102,241,0.12);
}

[b-djhjr1egz0] .tpj-input-codigo {
    max-width: 130px;
    font-family: 'Consolas', monospace;
}

[b-djhjr1egz0] .tpj-nodo-acciones {
    display: flex;
    gap: 4px;
    flex-shrink: 0;
}

[b-djhjr1egz0] .tpj-icon-btn {
    background: transparent;
    border: 1px solid transparent;
    border-radius: 4px;
    cursor: pointer;
    padding: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--tpj-transition);
    color: var(--tpj-text-muted);
    width: 28px;
    height: 28px;
}

[b-djhjr1egz0] .tpj-icon-btn .rzi {
    font-size: 1rem;
}

[b-djhjr1egz0] .tpj-icon-btn:hover {
    transform: translateY(-1px);
}

[b-djhjr1egz0] .tpj-icon-edit:hover {
    background: var(--tpj-info-light);
    color: var(--tpj-info);
    border-color: var(--tpj-info);
}

[b-djhjr1egz0] .tpj-icon-add:hover {
    background: var(--tpj-success-light);
    color: var(--tpj-success);
    border-color: var(--tpj-success);
}

[b-djhjr1egz0] .tpj-icon-delete:hover {
    background: var(--tpj-danger-light);
    color: var(--tpj-danger);
    border-color: var(--tpj-danger);
}

[b-djhjr1egz0] .tpj-icon-success {
    background: var(--tpj-success);
    color: white;
}

[b-djhjr1egz0] .tpj-icon-success:hover {
    background: #059669;
}

[b-djhjr1egz0] .tpj-icon-danger {
    background: var(--tpj-danger);
    color: white;
}

[b-djhjr1egz0] .tpj-icon-danger:hover {
    background: #DC2626;
}

/* ===== HIJOS ===== */
[b-djhjr1egz0] .tpj-nodo-hijos {
    margin-left: 28px;
    margin-top: 4px;
    padding-left: 10px;
    border-left: 2px dashed var(--tpj-border);
    animation: tpjFadeIn-b-djhjr1egz0 0.2s ease;
}

@keyframes tpjFadeIn-b-djhjr1egz0 {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

[b-djhjr1egz0] .tpj-row-nuevo {
    background: linear-gradient(135deg, #ECFDF5 0%, #F0FDF4 100%) !important;
    border: 1.5px dashed var(--tpj-success) !important;
}

[b-djhjr1egz0] .tpj-sin-hijos {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    color: var(--tpj-text-muted);
    font-size: 0.78rem;
    font-style: italic;
}

[b-djhjr1egz0] .tpj-sin-hijos .rzi {
    font-size: 0.95rem;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
    .tpj-body[b-djhjr1egz0] {
        padding: 10px 8px;
    }

    [b-djhjr1egz0] .tpj-nodo-row {
        flex-wrap: wrap;
        gap: 6px;
    }

    [b-djhjr1egz0] .tpj-nodo-codigo {
        min-width: auto;
    }

    [b-djhjr1egz0] .tpj-nodo-hijos {
        margin-left: 14px;
        padding-left: 6px;
    }
}

.tpj-btn .rzi[b-djhjr1egz0] {
    font-size: 1rem;
}
/* /Pages/Mantenedores/TiposProducto/TiposProductoIndex.razor.rz.scp.css */
/* ===== TIPOS DE PRODUCTO - DESIGN SYSTEM ===== */

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-5p8s88hh81] .tp-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

.tp-container[b-5p8s88hh81] {
    --tp-primary: var(--color-primary);
    --tp-primary-light: var(--color-primary-light);
    --tp-info: var(--color-info);
    --tp-info-light: var(--color-info-light);
    --tp-orange: var(--color-accent);
    --tp-danger: var(--color-danger);
    --tp-danger-light: var(--color-danger-light);
    --tp-bg: var(--bg);
    --tp-card: var(--surface);
    --tp-text: var(--text);
    --tp-text-secondary: var(--text-secondary);
    --tp-text-muted: var(--text-muted);
    --tp-border: var(--border);
    --tp-shadow: var(--shadow-sm);
    --tp-shadow-md: var(--shadow-md);
    --tp-radius: var(--radius-lg);
    --tp-radius-xs: var(--radius-sm);
    --tp-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--tp-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.tp-control-bar[b-5p8s88hh81] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--tp-card);
    border-radius: var(--tp-radius);
    box-shadow: var(--tp-shadow);
    padding: 10px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 56px;
}

.tp-control-left[b-5p8s88hh81] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.tp-header-icon[b-5p8s88hh81] {
    width: 38px;
    height: 38px;
    border-radius: var(--tp-radius-xs);
    background: linear-gradient(135deg, #F59E0B, #F97316);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    flex-shrink: 0;
}

.tp-header-icon .rzi[b-5p8s88hh81] {
    font-size: 1.2rem;
}

.tp-control-left h2[b-5p8s88hh81] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--tp-text);
    line-height: 1.1;
}

.tp-header-subtitle[b-5p8s88hh81] {
    margin: 2px 0 0;
    font-size: 0.72rem;
    color: var(--tp-text-secondary);
    font-weight: 500;
}

.tp-control-right[b-5p8s88hh81] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES ===== */
.tp-btn[b-5p8s88hh81] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--tp-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--tp-transition);
    white-space: nowrap;
    color: white;
}

.tp-btn:hover[b-5p8s88hh81] {
    transform: translateY(-1px);
    box-shadow: var(--tp-shadow-md);
}

.tp-btn:active[b-5p8s88hh81] {
    transform: translateY(0);
}

.tp-btn .rzi[b-5p8s88hh81] {
    font-size: 1rem;
}

.tp-btn-filtros[b-5p8s88hh81] {
    background: var(--tp-info);
}

.tp-btn-filtros.active[b-5p8s88hh81] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

.tp-btn-buscar[b-5p8s88hh81] {
    background: var(--tp-orange);
}

.tp-btn-nueva[b-5p8s88hh81] {
    background: var(--color-primary);
}

/* ===== PANEL DE FILTROS ===== */
.tp-filtros-wrapper[b-5p8s88hh81] {
    position: relative;
    flex-shrink: 0;
}

.tp-filtros-panel[b-5p8s88hh81] {
    background: var(--tp-card);
    border-radius: var(--tp-radius);
    box-shadow: var(--tp-shadow-md);
    overflow: hidden;
    animation: tpSlideDown-b-5p8s88hh81 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.tp-filtros-header[b-5p8s88hh81] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--tp-border);
    background: linear-gradient(135deg, var(--tp-info-light) 0%, var(--tp-card) 100%);
}

.tp-filtros-header h3[b-5p8s88hh81] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--tp-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.tp-filtros-header h3 .rzi[b-5p8s88hh81] {
    color: var(--tp-info);
    font-size: 1.1rem;
}

.tp-filtros-close-btn[b-5p8s88hh81] {
    background: none;
    border: none;
    color: var(--tp-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--tp-radius-xs);
    transition: var(--tp-transition);
    display: flex;
    align-items: center;
}

.tp-filtros-close-btn:hover[b-5p8s88hh81] {
    background: var(--tp-danger-light);
    color: var(--tp-danger);
}

.tp-filtros-body[b-5p8s88hh81] {
    padding: 12px 16px;
}

.tp-filtros-grid[b-5p8s88hh81] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
}

.tp-filtro-field[b-5p8s88hh81] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.tp-filtro-label[b-5p8s88hh81] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--tp-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.tp-filtro-field[b-5p8s88hh81]  .rz-textbox,
.tp-filtro-field[b-5p8s88hh81]  .rz-spinner,
.tp-filtro-field[b-5p8s88hh81]  .rz-inputtext,
.tp-filtro-field[b-5p8s88hh81]  .rz-calendar,
.tp-filtro-field[b-5p8s88hh81]  .rz-numeric,
.tp-filtro-field[b-5p8s88hh81]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--tp-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--tp-transition);
    background: white !important;
}

.tp-filtro-field[b-5p8s88hh81]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--tp-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--tp-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.tp-filtro-field[b-5p8s88hh81]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.tp-filtro-field[b-5p8s88hh81]  .rz-textbox:focus,
.tp-filtro-field[b-5p8s88hh81]  .rz-state-focused,
.tp-filtro-field[b-5p8s88hh81]  input:focus,
.tp-filtro-field[b-5p8s88hh81]  .rz-calendar:focus-within,
.tp-filtro-field[b-5p8s88hh81]  .rz-numeric:focus-within {
    border-color: var(--tp-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

/* Texto del dropdown visible sin recorte */
.tp-filtro-field[b-5p8s88hh81]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== BOTON DE FILA (jerarquia) ===== */
.tp-grid-action-btn[b-5p8s88hh81] {
    background: transparent;
    border: 1px solid var(--tp-border);
    border-radius: 6px;
    cursor: pointer;
    padding: 5px 7px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: var(--tp-transition);
    color: var(--tp-primary);
}

.tp-grid-action-btn:hover[b-5p8s88hh81] {
    background: var(--tp-primary-light);
    border-color: var(--tp-primary);
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.tp-grid-action-btn .rzi[b-5p8s88hh81] {
    font-size: 1rem;
}

/* ===== GRILLA ===== */
.tp-grid-wrapper[b-5p8s88hh81] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--tp-card);
    border-radius: var(--tp-radius);
    box-shadow: var(--tp-shadow);
    overflow: hidden;
    min-height: 0;
}

[b-5p8s88hh81] .tp-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

[b-5p8s88hh81] .tp-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--tp-bg) !important;
    color: var(--tp-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--tp-border) !important;
}

[b-5p8s88hh81] .tp-grid-wrapper .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
}

[b-5p8s88hh81] .tp-grid-wrapper .rz-datatable-tbody > tr:hover {
    background-color: var(--tp-primary-light) !important;
}

[b-5p8s88hh81] .tp-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* ===== ANIMACIONES ===== */
@keyframes tpSlideDown-b-5p8s88hh81 {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .tp-container[b-5p8s88hh81] {
        padding: 8px 10px;
        gap: 8px;
    }

    .tp-control-bar[b-5p8s88hh81] {
        flex-wrap: wrap;
        padding: 8px 12px;
    }
}

@media (max-width: 640px) {
    .tp-container[b-5p8s88hh81] {
        padding: 6px 8px;
        gap: 6px;
    }

    .tp-control-bar[b-5p8s88hh81] {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

    .tp-control-right[b-5p8s88hh81] {
        width: 100%;
        flex-wrap: wrap;
    }

    .tp-btn[b-5p8s88hh81] {
        flex: 1;
        justify-content: center;
    }

    .tp-filtros-grid[b-5p8s88hh81] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Pos/BuscarPrecuenta/BuscarPrecuentaIndex.razor.rz.scp.css */
/* ===== BUSCAR PRECUENTA - DESIGN SYSTEM (mismos lineamientos que BuscarBorrador/ConsultaDocumentos) ===== */

/* Variables CSS del módulo */
.precuenta-container[b-3ityk1gb5z] {
    --cd-primary: var(--color-primary);
    --cd-primary-dark: var(--color-primary-dark);
    --cd-primary-light: var(--color-primary-light);
    --cd-accent: var(--color-warning);
    --cd-accent-dark: var(--color-warning-dark);
    --cd-accent-light: #FFFBEB;
    --cd-success: var(--color-success);
    --cd-success-light: var(--color-success-light);
    --cd-danger: var(--color-danger);
    --cd-danger-light: var(--color-danger-light);
    --cd-info: var(--color-info);
    --cd-info-light: var(--color-info-light);
    --cd-orange: var(--color-accent);
    --cd-orange-dark: var(--color-accent-dark);
    --cd-preview: var(--color-preview);
    --cd-preview-dark: var(--color-preview-dark);
    --cd-bg: var(--bg);
    --cd-card: var(--surface);
    --cd-text: var(--text);
    --cd-text-secondary: var(--text-secondary);
    --cd-text-muted: var(--text-muted);
    --cd-border: var(--border);
    --cd-shadow-sm: var(--shadow-xs);
    --cd-shadow: var(--shadow-sm);
    --cd-shadow-md: var(--shadow-md);
    --cd-shadow-lg: var(--shadow-lg);
    --cd-radius: var(--radius-lg);
    --cd-radius-sm: var(--radius-md);
    --cd-radius-xs: var(--radius-sm);
    --cd-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--cd-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.precuenta-control-bar[b-3ityk1gb5z] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    padding: 8px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 48px;
}

/* Sección izquierda */
.control-left[b-3ityk1gb5z] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* Sección central: indicador de carga */
.control-center[b-3ityk1gb5z] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loading-indicator[b-3ityk1gb5z] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: bbFadeIn-b-3ityk1gb5z 0.3s ease;
}

.loading-spinner[b-3ityk1gb5z] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--cd-border);
    border-top-color: var(--cd-primary);
    border-radius: 50%;
    animation: bbSpin-b-3ityk1gb5z 0.8s linear infinite;
}

.loading-text[b-3ityk1gb5z] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--cd-primary);
    animation: bbPulse-b-3ityk1gb5z 1.5s ease-in-out infinite;
}

/* Sección derecha: botones de acción */
.control-right[b-3ityk1gb5z] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES DE ACCIÓN ===== */
.bb-btn[b-3ityk1gb5z] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cd-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cd-transition);
    white-space: nowrap;
    color: white;
}

.bb-btn:hover[b-3ityk1gb5z] {
    transform: translateY(-1px);
    box-shadow: var(--cd-shadow-md);
}

.bb-btn:active[b-3ityk1gb5z] {
    transform: translateY(0);
}

.bb-btn .rzi[b-3ityk1gb5z] {
    font-size: 1rem;
}

.btn-buscar[b-3ityk1gb5z] {
    background: var(--cd-orange);
}

.btn-filtros[b-3ityk1gb5z] {
    background: var(--cd-info);
}

.btn-filtros.active[b-3ityk1gb5z] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* ===== PANEL DE FILTROS ===== */
.filtros-wrapper[b-3ityk1gb5z] {
    position: relative;
    flex-shrink: 0;
}

.filtros-panel[b-3ityk1gb5z] {
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow-md);
    overflow: hidden;
    animation: bbSlideDown-b-3ityk1gb5z 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.filtros-header[b-3ityk1gb5z] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--cd-border);
    background: linear-gradient(135deg, var(--cd-info-light) 0%, var(--cd-card) 100%);
}

.filtros-header h3[b-3ityk1gb5z] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--cd-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.filtros-header h3 .rzi[b-3ityk1gb5z] {
    color: var(--cd-info);
    font-size: 1.1rem;
}

.filtros-close-btn[b-3ityk1gb5z] {
    background: none;
    border: none;
    color: var(--cd-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--cd-radius-xs);
    transition: var(--cd-transition);
    display: flex;
    align-items: center;
}

.filtros-close-btn:hover[b-3ityk1gb5z] {
    background: var(--cd-danger-light);
    color: var(--cd-danger);
}

.filtros-body[b-3ityk1gb5z] {
    padding: 12px 16px;
}

.filtros-grid[b-3ityk1gb5z] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.filtro-field[b-3ityk1gb5z] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.filtro-label[b-3ityk1gb5z] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Inputs personalizados dentro de filtros - bordes visibles sutiles */
.filtro-field[b-3ityk1gb5z]  .rz-textbox,
.filtro-field[b-3ityk1gb5z]  .rz-spinner,
.filtro-field[b-3ityk1gb5z]  .rz-inputtext,
.filtro-field[b-3ityk1gb5z]  .rz-calendar,
.filtro-field[b-3ityk1gb5z]  .rz-numeric,
.filtro-field[b-3ityk1gb5z]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
}

.filtro-field[b-3ityk1gb5z]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.filtro-field[b-3ityk1gb5z]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.filtro-field[b-3ityk1gb5z]  .rz-textbox:focus,
.filtro-field[b-3ityk1gb5z]  .rz-state-focused,
.filtro-field[b-3ityk1gb5z]  input:focus,
.filtro-field[b-3ityk1gb5z]  .rz-calendar:focus-within,
.filtro-field[b-3ityk1gb5z]  .rz-numeric:focus-within {
    border-color: var(--cd-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

/* Texto del dropdown visible sin recorte */
.filtro-field[b-3ityk1gb5z]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== GRILLA DE DATOS ===== */
.precuenta-grid-wrapper[b-3ityk1gb5z] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    overflow: hidden;
    min-height: 0;
}

[b-3ityk1gb5z] .precuenta-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

[b-3ityk1gb5z] .precuenta-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--cd-bg) !important;
    color: var(--cd-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--cd-border) !important;
}

[b-3ityk1gb5z] .precuenta-grid-wrapper .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
}

[b-3ityk1gb5z] .precuenta-grid-wrapper .rz-datatable-tbody > tr:hover {
    background-color: var(--cd-primary-light) !important;
}

[b-3ityk1gb5z] .precuenta-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* Botones de acción en la grilla */
.grid-actions[b-3ityk1gb5z] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.grid-action-btn[b-3ityk1gb5z] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--cd-radius-xs);
    cursor: pointer;
    transition: var(--cd-transition);
    padding: 0;
    color: white;
    font-size: 0.85rem;
}

.grid-action-btn:hover[b-3ityk1gb5z] {
    transform: scale(1.12);
    box-shadow: var(--cd-shadow-md);
}

.grid-action-btn:active[b-3ityk1gb5z] {
    transform: scale(0.95);
}

/* Botón de previsualización de la precuenta (Previsualizar/Vista previa PDF = teal, DESIGN_SYSTEM §4.3) */
.grid-btn-preview[b-3ityk1gb5z] {
    background: var(--cd-preview);
}

.grid-btn-preview:hover[b-3ityk1gb5z] {
    background: var(--cd-preview-dark);
}

.grid-btn-edit[b-3ityk1gb5z] {
    background: var(--cd-info);
}

.grid-btn-edit:hover[b-3ityk1gb5z] {
    background: #0284C7;
}

.grid-btn-delete[b-3ityk1gb5z] {
    background: var(--cd-danger);
}

.grid-btn-delete:hover[b-3ityk1gb5z] {
    background: #DC2626;
}

/* ===== ANIMACIONES ===== */
@keyframes bbSpin-b-3ityk1gb5z {
    to { transform: rotate(360deg); }
}

@keyframes bbPulse-b-3ityk1gb5z {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

@keyframes bbFadeIn-b-3ityk1gb5z {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes bbSlideDown-b-3ityk1gb5z {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

/* ===== RESPONSIVE: TABLET ===== */
@media (max-width: 1024px) {
    .precuenta-container[b-3ityk1gb5z] {
        padding: 8px 10px;
        gap: 8px;
    }

    .precuenta-control-bar[b-3ityk1gb5z] {
        flex-wrap: wrap;
        padding: 8px 12px;
    }

    .control-center[b-3ityk1gb5z] {
        order: 3;
        width: 100%;
    }

    .filtros-grid[b-3ityk1gb5z] {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
}

/* ===== RESPONSIVE: MOBILE ===== */
@media (max-width: 640px) {
    .precuenta-container[b-3ityk1gb5z] {
        padding: 6px 8px;
        gap: 6px;
    }

    .precuenta-control-bar[b-3ityk1gb5z] {
        flex-direction: column;
        gap: 8px;
    }

    .control-left[b-3ityk1gb5z],
    .control-right[b-3ityk1gb5z] {
        width: 100%;
        justify-content: center;
    }

    .control-right[b-3ityk1gb5z] {
        flex-wrap: wrap;
    }

    .bb-btn[b-3ityk1gb5z] {
        flex: 1;
        justify-content: center;
        min-width: 0;
    }

    .bb-btn span:not(.material-icons):not(.rzi)[b-3ityk1gb5z] {
        display: none;
    }

    .filtros-grid[b-3ityk1gb5z] {
        grid-template-columns: 1fr;
    }
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-3ityk1gb5z] .precuenta-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}
/* /Pages/Pos/CargaMasivaBoletas/CargaMasivaBoletasIndex.razor.rz.scp.css */
/* ===== PUNTO DE VENTA EXCEL - DESIGN SYSTEM =====
   Reusa la paleta del proyecto (Mantenedores / MovimientoProductos)
   y adapta el patron al flujo upload + preview + procesar.
   Estilos scoped al componente.
   ============================================= */

.upe-container[b-ux6vntmewl] {
    --upe-primary: var(--color-primary);
    --upe-primary-dark: var(--color-primary-dark);
    --upe-primary-light: var(--color-primary-light);
    --upe-success: var(--color-success);
    --upe-success-light: var(--color-success-light);
    --upe-danger: var(--color-danger);
    --upe-danger-light: var(--color-danger-light);
    --upe-info: var(--color-info);
    --upe-info-light: var(--color-info-light);
    --upe-warning: var(--color-warning);
    --upe-warning-light: var(--color-warning-light);
    --upe-orange: var(--color-accent);
    --upe-bg: var(--bg);
    --upe-card: var(--surface);
    --upe-text: var(--text);
    --upe-text-secondary: var(--text-secondary);
    --upe-text-muted: var(--text-muted);
    --upe-border: var(--border);
    --upe-shadow-sm: var(--shadow-xs);
    --upe-shadow: var(--shadow-sm);
    --upe-shadow-md: var(--shadow-md);
    --upe-radius: var(--radius-lg);
    --upe-radius-sm: var(--radius-md);
    --upe-radius-xs: var(--radius-sm);
    --upe-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--upe-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.upe-control-bar[b-ux6vntmewl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--upe-card);
    border-radius: var(--upe-radius);
    box-shadow: var(--upe-shadow);
    padding: 10px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 56px;
}

.upe-control-left[b-ux6vntmewl] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.upe-header-icon[b-ux6vntmewl] {
    width: 38px;
    height: 38px;
    border-radius: var(--upe-radius-sm);
    background: linear-gradient(135deg, var(--upe-primary) 0%, var(--upe-primary-dark) 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--upe-shadow-sm);
}

.upe-header-icon .rzi[b-ux6vntmewl] { font-size: 1.25rem; }

.upe-title[b-ux6vntmewl] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--upe-text);
    margin: 0;
    line-height: 1.2;
}

.upe-subtitle[b-ux6vntmewl] {
    font-size: 0.72rem;
    color: var(--upe-text-secondary);
    margin: 2px 0 0;
}

.upe-control-center[b-ux6vntmewl] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.upe-loading-indicator[b-ux6vntmewl] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: upeFadeIn-b-ux6vntmewl 0.3s ease;
}

.upe-loading-spinner[b-ux6vntmewl] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--upe-border);
    border-top-color: var(--upe-primary);
    border-radius: 50%;
    animation: upeSpin-b-ux6vntmewl 0.8s linear infinite;
}

.upe-loading-text[b-ux6vntmewl] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--upe-primary);
    animation: upePulse-b-ux6vntmewl 1.5s ease-in-out infinite;
}

.upe-control-right[b-ux6vntmewl] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES ===== */
.upe-btn[b-ux6vntmewl] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--upe-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--upe-transition);
    white-space: nowrap;
    color: white;
}

.upe-btn:hover:not(:disabled)[b-ux6vntmewl] {
    transform: translateY(-1px);
    box-shadow: var(--upe-shadow-md);
}

.upe-btn:active:not(:disabled)[b-ux6vntmewl] { transform: translateY(0); }
.upe-btn:disabled[b-ux6vntmewl] { opacity: 0.5; cursor: not-allowed; }
.upe-btn .rzi[b-ux6vntmewl] { font-size: 1rem; }

.upe-btn-plantilla[b-ux6vntmewl] { background: var(--color-template); }
.upe-btn-plantilla:hover:not(:disabled)[b-ux6vntmewl] { background: var(--color-template-dark); }
.upe-btn-procesar[b-ux6vntmewl] {
    background: var(--upe-success);
}

/* Botón "Limpiar" sólido y visible (patrón de la app, ícono restart_alt).
   align-self evita que el flex column (.upe-file-picker) lo estire a todo el ancho;
   así queda del ancho de su contenido, como los demás botones "Limpiar". */
.upe-btn-clear[b-ux6vntmewl] {
    align-self: flex-start;
    background: var(--color-limpiar);
    color: #fff;
}
.upe-btn-clear:hover:not(:disabled)[b-ux6vntmewl] { background: var(--color-limpiar-dark); }

/* ===== PANEL DE CARGA ===== */
.upe-upload-wrapper[b-ux6vntmewl] { flex-shrink: 0; }

.upe-upload-panel[b-ux6vntmewl] {
    background: var(--upe-card);
    border-radius: var(--upe-radius);
    box-shadow: var(--upe-shadow);
    overflow: hidden;
}

.upe-section-header[b-ux6vntmewl] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--upe-border);
    background: linear-gradient(135deg, var(--upe-primary-light) 0%, var(--upe-card) 100%);
}

.upe-section-header h3[b-ux6vntmewl] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--upe-text);
    margin: 0;
}

.upe-section-header .rzi[b-ux6vntmewl] {
    color: var(--upe-primary);
    font-size: 1.1rem;
}

.upe-section-count[b-ux6vntmewl] {
    margin-left: auto;
    font-size: 0.7rem;
    color: var(--upe-text-secondary);
    background: var(--upe-bg);
    border-radius: 999px;
    padding: 2px 10px;
    font-weight: 600;
}

.upe-upload-body[b-ux6vntmewl] {
    padding: 14px 16px;
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(260px, 1fr);
    gap: 16px;
    align-items: start;
}

.upe-file-picker[b-ux6vntmewl] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.upe-file-label[b-ux6vntmewl] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 14px;
    border: 2px dashed #CBD5E1;
    border-radius: var(--upe-radius-sm);
    background: #F8FAFC;
    color: var(--upe-text);
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    transition: var(--upe-transition);
}

.upe-file-label:hover[b-ux6vntmewl] { border-color: var(--upe-primary); background: var(--upe-primary-light); }
.upe-file-label .rzi[b-ux6vntmewl] { color: var(--upe-primary); font-size: 1.2rem; }
.upe-input-hidden[b-ux6vntmewl] { display: none; }

.upe-leyenda[b-ux6vntmewl] {
    background: var(--upe-info-light);
    border-left: 3px solid var(--upe-info);
    border-radius: var(--upe-radius-sm);
    padding: 10px 12px;
    font-size: 0.78rem;
    color: #0C4A6E;
    line-height: 1.4;
}
.upe-leyenda-title[b-ux6vntmewl] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 4px;
}
.upe-leyenda-title .rzi[b-ux6vntmewl] { color: var(--upe-info); font-size: 1rem; }
.upe-leyenda-list[b-ux6vntmewl] {
    list-style: none;
    margin: 4px 0 0;
    padding-left: 4px;
}
.upe-leyenda-list li[b-ux6vntmewl] { padding: 2px 0; }
.upe-codigo[b-ux6vntmewl] {
    display: inline-block;
    background: var(--upe-card);
    border: 1px solid #BAE6FD;
    border-radius: 4px;
    padding: 1px 6px;
    font-family: 'Consolas', 'Monaco', monospace;
    font-weight: 700;
    color: var(--upe-primary-dark);
    margin-right: 4px;
}

/* ===== STATS ===== */
.upe-stats[b-ux6vntmewl] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 10px;
    flex-shrink: 0;
}

.upe-stat[b-ux6vntmewl] {
    background: var(--upe-card);
    border-radius: var(--upe-radius);
    box-shadow: var(--upe-shadow);
    padding: 12px 14px;
    display: flex;
    align-items: center;
    gap: 10px;
    border-left: 4px solid var(--upe-border);
}

.upe-stat .rzi[b-ux6vntmewl] { font-size: 1.6rem; }
.upe-stat-value[b-ux6vntmewl] { font-size: 1.15rem; font-weight: 700; color: var(--upe-text); line-height: 1; }
.upe-stat-label[b-ux6vntmewl] { font-size: 0.7rem; color: var(--upe-text-secondary); text-transform: uppercase; letter-spacing: 0.04em; margin-top: 2px; }

.upe-stat-total[b-ux6vntmewl]     { border-left-color: var(--upe-text-muted); }
.upe-stat-total .rzi[b-ux6vntmewl] { color: var(--upe-text-muted); }
.upe-stat-ok[b-ux6vntmewl]        { border-left-color: var(--upe-success); }
.upe-stat-ok .rzi[b-ux6vntmewl]   { color: var(--upe-success); }
.upe-stat-integrada[b-ux6vntmewl] { border-left-color: var(--upe-primary); }
.upe-stat-integrada .rzi[b-ux6vntmewl] { color: var(--upe-primary); }
.upe-stat-err[b-ux6vntmewl]       { border-left-color: var(--upe-danger); }
.upe-stat-err .rzi[b-ux6vntmewl]  { color: var(--upe-danger); }

/* Tarjeta clickeable para reabrir el cuadro de errores */
.upe-stat-clickable[b-ux6vntmewl] { cursor: pointer; transition: var(--upe-transition); }
.upe-stat-clickable:hover[b-ux6vntmewl] { transform: translateY(-1px); box-shadow: var(--upe-shadow-md); }

/* ===== GRILLA ===== */
.upe-grid-wrapper[b-ux6vntmewl] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--upe-card);
    border-radius: var(--upe-radius);
    box-shadow: var(--upe-shadow);
    overflow: hidden;
    min-height: 0;
}

/* La grilla ocupa el alto disponible para que el scroll viva dentro de ella */
[b-ux6vntmewl] .upe-grid-wrapper .rz-data-grid {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

[b-ux6vntmewl] .upe-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

/* Scroll vertical interno en el cuerpo de la grilla cuando hay muchas filas */
[b-ux6vntmewl] .upe-grid-wrapper .rz-data-grid .rz-datatable-scrollable-wrapper {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

[b-ux6vntmewl] .upe-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--upe-bg) !important;
    color: var(--upe-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--upe-border) !important;
}

[b-ux6vntmewl] .upe-grid-wrapper .rz-datatable-tbody > tr { transition: background-color 0.15s ease; }
[b-ux6vntmewl] .upe-grid-wrapper .rz-datatable-tbody > tr:hover { background-color: var(--upe-primary-light) !important; }
[b-ux6vntmewl] .upe-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* Badge de estado */
.upe-estado-badge[b-ux6vntmewl] {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 999px;
    font-weight: 700;
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.upe-estado-badge.upe-pendiente[b-ux6vntmewl] { background: var(--upe-bg); color: var(--upe-text-secondary); }
.upe-estado-badge.upe-validada[b-ux6vntmewl]  { background: var(--upe-info-light); color: #0369A1; }
.upe-estado-badge.upe-integrada[b-ux6vntmewl] { background: var(--upe-success-light); color: #047857; }
.upe-estado-badge.upe-error[b-ux6vntmewl]     { background: var(--upe-danger-light);  color: #B91C1C; }

/* Folio asignado tras crear la boleta: resaltado para que se note en la grilla. */
.upe-folio-badge[b-ux6vntmewl] {
    display: inline-block;
    padding: 3px 10px;
    border-radius: var(--upe-radius-xs);
    background: var(--upe-success-light);
    color: #047857;
    font-weight: 700;
    font-size: 0.78rem;
}

.upe-info-btn[b-ux6vntmewl] {
    width: 26px;
    height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--upe-radius-xs);
    background: var(--upe-warning-light);
    color: var(--upe-warning);
    cursor: pointer;
    transition: var(--upe-transition);
}
.upe-info-btn:hover[b-ux6vntmewl] { background: var(--upe-warning); color: white; transform: scale(1.1); }
.upe-info-btn .rzi[b-ux6vntmewl] { font-size: 0.95rem; }

/* ===== MODAL DE ERRORES ===== */
.upe-modal-overlay[b-ux6vntmewl] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    padding: 16px;
    animation: upeFadeIn-b-ux6vntmewl 0.2s ease;
    backdrop-filter: blur(2px);
}

.upe-modal[b-ux6vntmewl] {
    background: var(--upe-card);
    border-radius: var(--upe-radius);
    box-shadow: 0 20px 50px -10px rgba(0, 0, 0, 0.35), 0 8px 20px -6px rgba(0, 0, 0, 0.2);
    width: 100%;
    max-width: 900px;
    max-height: 88vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    animation: upeModalIn-b-ux6vntmewl 0.22s cubic-bezier(0.4, 0, 0.2, 1);
}

.upe-modal-header[b-ux6vntmewl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 18px;
    border-bottom: 1px solid var(--upe-border);
    background: linear-gradient(135deg, var(--upe-danger-light) 0%, var(--upe-card) 100%);
}

.upe-modal-header-left[b-ux6vntmewl] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.upe-modal-header-left > .rzi[b-ux6vntmewl] {
    width: 38px;
    height: 38px;
    border-radius: var(--upe-radius-sm);
    background: var(--upe-danger);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    flex-shrink: 0;
}

.upe-modal-title[b-ux6vntmewl] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--upe-text);
    margin: 0;
    line-height: 1.2;
}

.upe-modal-subtitle[b-ux6vntmewl] {
    font-size: 0.75rem;
    color: var(--upe-text-secondary);
    margin: 2px 0 0;
}

.upe-modal-close[b-ux6vntmewl] {
    width: 32px;
    height: 32px;
    border: none;
    border-radius: var(--upe-radius-xs);
    background: transparent;
    color: var(--upe-text-secondary);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: var(--upe-transition);
    flex-shrink: 0;
}
.upe-modal-close:hover[b-ux6vntmewl] { background: var(--upe-danger-light); color: var(--upe-danger); }
.upe-modal-close .rzi[b-ux6vntmewl] { font-size: 1.1rem; }

.upe-modal-body[b-ux6vntmewl] {
    flex: 1;
    overflow: hidden;
    padding: 14px 18px;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.upe-modal-table-wrapper[b-ux6vntmewl] {
    flex: 1;
    overflow: auto;
    border: 1px solid var(--upe-border);
    border-radius: var(--upe-radius-sm);
    background: #FAFBFC;
}

.upe-modal-table[b-ux6vntmewl] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.78rem;
}

.upe-modal-table thead th[b-ux6vntmewl] {
    background: var(--upe-bg);
    color: var(--upe-text-secondary);
    font-weight: 700;
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    text-align: left;
    padding: 8px 10px;
    border-bottom: 2px solid var(--upe-border);
    position: sticky;
    top: 0;
    z-index: 1;
}

.upe-modal-table tbody td[b-ux6vntmewl] {
    padding: 7px 10px;
    border-bottom: 1px solid #F1F5F9;
    color: var(--upe-text);
    vertical-align: top;
}

.upe-modal-table tbody tr:hover[b-ux6vntmewl] { background: var(--upe-danger-light); }
.upe-modal-table tbody tr:last-child td[b-ux6vntmewl] { border-bottom: none; }

.upe-modal-num[b-ux6vntmewl] {
    color: var(--upe-text-secondary);
    font-weight: 700;
    text-align: center;
}

.upe-modal-msg[b-ux6vntmewl] {
    color: #B91C1C;
    font-weight: 600;
    word-break: break-word;
}

.upe-modal-msg-list[b-ux6vntmewl] {
    margin: 0;
    padding-left: 18px;
    list-style: disc;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.upe-modal-msg-list li[b-ux6vntmewl] {
    color: #B91C1C;
    font-weight: 600;
    line-height: 1.35;
}

.upe-modal-footer[b-ux6vntmewl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 18px;
    border-top: 1px solid var(--upe-border);
    background: #F8FAFC;
}

.upe-modal-footer-info[b-ux6vntmewl] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.75rem;
    color: var(--upe-text-secondary);
}
.upe-modal-footer-info .rzi[b-ux6vntmewl] { color: var(--upe-info); font-size: 1rem; }

.upe-btn-cerrar[b-ux6vntmewl] {
    background: var(--upe-primary);
}

@keyframes upeModalIn-b-ux6vntmewl {
    from { opacity: 0; transform: scale(0.96) translateY(-8px); }
    to   { opacity: 1; transform: scale(1) translateY(0); }
}

/* ===== ANIMACIONES ===== */
@keyframes upeSpin-b-ux6vntmewl { to { transform: rotate(360deg); } }

@keyframes upePulse-b-ux6vntmewl {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.5; }
}

@keyframes upeFadeIn-b-ux6vntmewl {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .upe-container[b-ux6vntmewl] { padding: 8px 10px; gap: 8px; }
    .upe-control-bar[b-ux6vntmewl] { flex-wrap: wrap; padding: 8px 12px; }
    .upe-control-center[b-ux6vntmewl] { order: 3; width: 100%; }
    .upe-upload-body[b-ux6vntmewl] { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
    .upe-container[b-ux6vntmewl] { padding: 6px 8px; gap: 6px; }
    .upe-control-bar[b-ux6vntmewl] { flex-direction: column; gap: 8px; }
    .upe-control-left[b-ux6vntmewl], .upe-control-right[b-ux6vntmewl] { width: 100%; justify-content: center; }
    .upe-control-right[b-ux6vntmewl] { flex-wrap: wrap; }
    .upe-btn[b-ux6vntmewl] { flex: 1; justify-content: center; min-width: 0; }
    .upe-btn span:not(.material-icons):not(.rzi)[b-ux6vntmewl] { display: none; }
    .upe-stats[b-ux6vntmewl] { grid-template-columns: repeat(2, 1fr); }

    .upe-modal[b-ux6vntmewl] { max-height: 94vh; }
    .upe-modal-footer[b-ux6vntmewl] { flex-direction: column; align-items: stretch; }
    .upe-modal-table thead th[b-ux6vntmewl], .upe-modal-table tbody td[b-ux6vntmewl] { padding: 6px 8px; }
}
/* /Pages/Pos/GeneraNotaCredito/Componentes/BuscadorDocumentos.razor.rz.scp.css */
/* ===== Buscador de documentos ===== */
/* Las variables --gnc-* se heredan del .gnc-container del Index. */

/* ===== Fila de búsqueda ===== */
.gnc-search-row[b-muvhzbb6x9] {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(140px, 200px) 140px;
    gap: 12px;
    align-items: end;
}

/* Layout extendido cuando se incluyen las dos fechas */
.gnc-search-row.gnc-search-row-wide[b-muvhzbb6x9] {
    grid-template-columns: minmax(220px, 1fr) minmax(110px, 140px) minmax(140px, 1fr) minmax(140px, 1fr) 130px;
}

.gnc-search-field[b-muvhzbb6x9] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.gnc-search-actions[b-muvhzbb6x9] {
    align-self: stretch;
}

.gnc-search-actions .gnc-btn[b-muvhzbb6x9] {
    width: 100%;
    justify-content: center;
    height: 32px;
}

.gnc-label[b-muvhzbb6x9] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--gnc-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Segmented control: Boleta/Factura */
.gnc-segmented[b-muvhzbb6x9] {
    display: inline-flex;
    background: var(--gnc-bg);
    border-radius: var(--gnc-radius-xs);
    padding: 3px;
    gap: 3px;
    width: fit-content;
}

.gnc-seg-btn[b-muvhzbb6x9] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 14px;
    border: none;
    background: transparent;
    border-radius: var(--gnc-radius-xs);
    cursor: pointer;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--gnc-text-secondary);
    transition: var(--gnc-transition);
}

.gnc-seg-btn:disabled[b-muvhzbb6x9] {
    opacity: 0.5;
    cursor: not-allowed;
}

.gnc-seg-btn .rzi[b-muvhzbb6x9] {
    font-size: 0.95rem;
}

.gnc-seg-btn:hover:not(:disabled):not(.active)[b-muvhzbb6x9] {
    color: var(--gnc-primary);
}

.gnc-seg-btn.active[b-muvhzbb6x9] {
    background: var(--gnc-card);
    color: var(--gnc-primary);
    box-shadow: var(--gnc-shadow-sm);
}

/* ===== Botón Buscar ===== */
.gnc-btn[b-muvhzbb6x9] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--gnc-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--gnc-transition);
    white-space: nowrap;
    color: white;
}

.gnc-btn:hover:not(:disabled)[b-muvhzbb6x9] {
    transform: translateY(-1px);
    box-shadow: var(--gnc-shadow-md);
}

.gnc-btn:active:not(:disabled)[b-muvhzbb6x9] {
    transform: translateY(0);
}

.gnc-btn:disabled[b-muvhzbb6x9] {
    opacity: 0.5;
    cursor: not-allowed;
}

.gnc-btn .rzi[b-muvhzbb6x9] {
    font-size: 1rem;
}

.btn-buscar[b-muvhzbb6x9] {
    background: var(--gnc-orange);
}

.btn-buscar:hover:not(:disabled)[b-muvhzbb6x9] {
    background: var(--gnc-orange-dark);
}

/* Grilla de documentos encontrados (debajo de los filtros) */
.gnc-results-wrap[b-muvhzbb6x9] {
    margin-top: 14px;
    border-top: 1px dashed var(--gnc-border);
    padding-top: 14px;
}

/* La tabla permite scroll horizontal si el ancho disponible se reduce. */
.gnc-results-table[b-muvhzbb6x9] {
    overflow-x: auto;
}

/* Las tarjetas solo se muestran en pantallas chicas (ver media query). */
.gnc-results-cards[b-muvhzbb6x9] {
    display: none;
}

/* ===== Tarjetas de resultado (pantallas chicas) ===== */
.gnc-doc-card[b-muvhzbb6x9] {
    border: 1px solid var(--gnc-border);
    border-radius: var(--gnc-radius-sm);
    background: var(--gnc-card);
    box-shadow: var(--gnc-shadow-sm);
    overflow: hidden;
}

.gnc-doc-card + .gnc-doc-card[b-muvhzbb6x9] {
    margin-top: 10px;
}

.gnc-doc-card-head[b-muvhzbb6x9] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: var(--gnc-bg);
    border-bottom: 1px solid var(--gnc-border);
}

.gnc-doc-folio[b-muvhzbb6x9] {
    font-weight: 700;
    color: var(--gnc-primary-dark);
    font-size: 0.85rem;
}

.gnc-doc-fecha[b-muvhzbb6x9] {
    font-size: 0.75rem;
    color: var(--gnc-text-muted);
}

.gnc-doc-card-head .gnc-row-action[b-muvhzbb6x9] {
    margin-left: auto;
}

.gnc-doc-card-body[b-muvhzbb6x9] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px 12px;
    padding: 10px 12px;
}

.gnc-doc-row[b-muvhzbb6x9] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.gnc-doc-row-full[b-muvhzbb6x9] {
    grid-column: span 2;
}

.gnc-doc-k[b-muvhzbb6x9] {
    font-size: 0.65rem;
    font-weight: 700;
    color: var(--gnc-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.gnc-doc-v[b-muvhzbb6x9] {
    font-size: 0.85rem;
    color: var(--gnc-text);
    word-break: break-word;
}

.gnc-doc-row-total .gnc-doc-v[b-muvhzbb6x9] {
    font-weight: 700;
    color: var(--gnc-primary-dark);
}

/* Botón redondo de "seleccionar fila" en la grilla de resultados */
.gnc-row-action[b-muvhzbb6x9] {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 50%;
    background: var(--gnc-success);
    color: white;
    cursor: pointer;
    transition: var(--gnc-transition);
}

.gnc-row-action:hover:not(:disabled)[b-muvhzbb6x9] {
    transform: scale(1.1);
    box-shadow: var(--gnc-shadow-md);
    background: #059669;
}

.gnc-row-action:disabled[b-muvhzbb6x9] {
    opacity: 0.4;
    cursor: not-allowed;
}

.gnc-row-action .rzi[b-muvhzbb6x9] {
    font-size: 1rem;
}

/* Pills (Boleta / Factura) */
.gnc-pill[b-muvhzbb6x9] {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 700;
    color: white;
    background: var(--gnc-text-secondary);
    line-height: 1.25;
    white-space: nowrap;
}

.gnc-pill-33[b-muvhzbb6x9] { background: var(--gnc-primary); }
.gnc-pill-39[b-muvhzbb6x9] { background: var(--gnc-info); }

/* ===== Responsive ===== */
@media (max-width: 1024px) {
    .gnc-search-row[b-muvhzbb6x9] {
        grid-template-columns: 1fr;
    }
}

/* En pantallas chicas ocultamos la tabla y mostramos las tarjetas apiladas. */
@media (max-width: 768px) {
    .gnc-results-table[b-muvhzbb6x9] {
        display: none;
    }

    .gnc-results-cards[b-muvhzbb6x9] {
        display: block;
    }
}
/* /Pages/Pos/GeneraNotaCredito/Componentes/DatosReceptor.razor.rz.scp.css */
/* ===== Datos del receptor ===== */
/* Las variables --gnc-* se heredan del .gnc-container del Index. */

/* ===== Grid de campos ===== */
.gnc-grid[b-88ieysx948] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.gnc-field[b-88ieysx948] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.gnc-field-wide[b-88ieysx948] {
    grid-column: span 2;
}

.gnc-label[b-88ieysx948] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--gnc-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Fila para Razón Social + botón lupa */
.gnc-cliente-row[b-88ieysx948] {
    display: flex;
    gap: 6px;
    align-items: stretch;
}

.gnc-icon-btn[b-88ieysx948] {
    width: 32px;
    height: 32px;
    border: 1.5px solid #CBD5E1;
    border-radius: var(--gnc-radius-xs);
    background: white;
    color: var(--gnc-primary);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: var(--gnc-transition);
    flex-shrink: 0;
}

.gnc-icon-btn:hover:not(:disabled)[b-88ieysx948] {
    background: var(--gnc-primary-light);
    border-color: var(--gnc-primary);
}

.gnc-icon-btn:disabled[b-88ieysx948] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ===== Totales ===== */
.gnc-totales[b-88ieysx948] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px dashed var(--gnc-border);
}

.gnc-total-item[b-88ieysx948] {
    flex: 1 1 140px;
    background: var(--gnc-bg);
    border-radius: var(--gnc-radius-sm);
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.gnc-total-label[b-88ieysx948] {
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--gnc-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.gnc-total-value[b-88ieysx948] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--gnc-text);
}

.gnc-total-final[b-88ieysx948] {
    background: var(--gnc-primary-light);
    border: 1.5px solid var(--gnc-primary);
}

.gnc-total-final .gnc-total-value[b-88ieysx948] {
    color: var(--gnc-primary-dark);
    font-size: 1.1rem;
}

/* ===== Responsive ===== */
@media (max-width: 640px) {
    .gnc-field-wide[b-88ieysx948] {
        grid-column: span 1;
    }
}
/* /Pages/Pos/GeneraNotaCredito/Componentes/DetalleNotaCredito.razor.rz.scp.css */
/* ===== Detalle Nota de Crédito ===== */
/* Las variables --gnc-* se heredan del .gnc-container del Index. */

/* La tabla permite scroll horizontal si el ancho disponible se reduce. */
.gnc-results-table[b-7mmmvinctl] {
    overflow-x: auto;
}

/* Las tarjetas solo se muestran en pantallas chicas (ver media query). */
.gnc-results-cards[b-7mmmvinctl] {
    display: none;
}

/* ===== Tarjetas de línea (pantallas chicas) ===== */
.gnc-doc-card[b-7mmmvinctl] {
    border: 1px solid var(--gnc-border);
    border-radius: var(--gnc-radius-sm);
    background: var(--gnc-card);
    box-shadow: var(--gnc-shadow-sm);
    overflow: hidden;
}

.gnc-doc-card + .gnc-doc-card[b-7mmmvinctl] {
    margin-top: 10px;
}

.gnc-doc-card-head[b-7mmmvinctl] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: var(--gnc-bg);
    border-bottom: 1px solid var(--gnc-border);
}

.gnc-doc-folio[b-7mmmvinctl] {
    font-weight: 700;
    color: var(--gnc-primary-dark);
    font-size: 0.85rem;
}

.gnc-doc-card-body[b-7mmmvinctl] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px 12px;
    padding: 10px 12px;
}

.gnc-doc-row[b-7mmmvinctl] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.gnc-doc-row-full[b-7mmmvinctl] {
    grid-column: span 2;
}

.gnc-doc-k[b-7mmmvinctl] {
    font-size: 0.65rem;
    font-weight: 700;
    color: var(--gnc-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.gnc-doc-v[b-7mmmvinctl] {
    font-size: 0.85rem;
    color: var(--gnc-text);
    word-break: break-word;
}

.gnc-doc-row-total .gnc-doc-v[b-7mmmvinctl] {
    font-weight: 700;
    color: var(--gnc-primary-dark);
}

/* Pills Afecto / Exento */
.gnc-pill[b-7mmmvinctl] {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 700;
    color: white;
    background: var(--gnc-text-secondary);
    line-height: 1.25;
    white-space: nowrap;
}

.gnc-pill-afecto[b-7mmmvinctl] { background: var(--gnc-success); }
.gnc-pill-exento[b-7mmmvinctl] { background: var(--gnc-text-secondary); }

/* En pantallas chicas ocultamos la tabla y mostramos las tarjetas apiladas. */
@media (max-width: 768px) {
    .gnc-results-table[b-7mmmvinctl] {
        display: none;
    }

    .gnc-results-cards[b-7mmmvinctl] {
        display: block;
    }
}
/* /Pages/Pos/GeneraNotaCredito/GeneraNotaCreditoIndex.razor.rz.scp.css */
/* ===== GENERA NOTA DE CREDITO ===== */

.gnc-container[b-nsnp5vxxyx] {
    --gnc-primary: var(--color-primary);
    --gnc-primary-dark: var(--color-primary-dark);
    --gnc-primary-light: var(--color-primary-light);
    --gnc-accent: var(--color-warning);
    --gnc-accent-dark: var(--color-warning-dark);
    --gnc-success: var(--color-success);
    --gnc-success-light: var(--color-success-light);
    --gnc-danger: var(--color-danger);
    --gnc-danger-light: var(--color-danger-light);
    --gnc-info: var(--color-info);
    --gnc-info-light: var(--color-info-light);
    --gnc-orange: var(--color-accent);
    --gnc-orange-dark: var(--color-accent-dark);
    --gnc-bg: var(--bg);
    --gnc-card: var(--surface);
    --gnc-text: var(--text);
    --gnc-text-secondary: var(--text-secondary);
    --gnc-text-muted: var(--text-muted);
    --gnc-border: var(--border);
    --gnc-shadow-sm: var(--shadow-xs);
    --gnc-shadow: var(--shadow-sm);
    --gnc-shadow-md: var(--shadow-md);
    --gnc-radius: var(--radius-lg);
    --gnc-radius-sm: var(--radius-md);
    --gnc-radius-xs: var(--radius-sm);
    --gnc-transition: var(--transition);
    display: flex;
    flex-direction: column;
    height: 100%;
    /* Full-height sin scroll de PÁGINA: el contenedor nunca scrollea. El scroll vive
       internamente en el workspace (ver .gnc-workspace). */
    overflow: hidden;
    background: var(--gnc-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== Barra superior ===== */
.gnc-control-bar[b-nsnp5vxxyx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--gnc-card);
    border-radius: var(--gnc-radius);
    box-shadow: var(--gnc-shadow);
    padding: 8px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 48px;
}

.gnc-control-left[b-nsnp5vxxyx] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.gnc-control-right[b-nsnp5vxxyx] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* ===== Topbar (estilo OrdenCompra) ===== */
.gnc-topbar[b-nsnp5vxxyx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding: 10px 14px;
    background: var(--gnc-card);
    border: 1px solid var(--gnc-border);
    border-radius: var(--gnc-radius);
    box-shadow: var(--gnc-shadow-sm);
    flex-shrink: 0;
}

.gnc-topbar-left[b-nsnp5vxxyx],
.gnc-topbar-right[b-nsnp5vxxyx] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.gnc-title-chip[b-nsnp5vxxyx] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 4px 14px 4px 8px;
    border: 2px solid var(--gnc-orange);
    border-radius: var(--gnc-radius);
    background: linear-gradient(135deg, #FFF7ED 0%, var(--gnc-card) 70%);
    box-shadow: 0 2px 10px rgba(255, 165, 0, 0.22);
}

.gnc-title-icon[b-nsnp5vxxyx] {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--gnc-orange);
    color: #fff;
    font-size: 1.05rem;
    box-shadow: 0 1px 3px rgba(255, 140, 0, 0.4);
}

.gnc-title-texts[b-nsnp5vxxyx] {
    display: flex;
    flex-direction: column;
    line-height: 1.1;
}

.gnc-title-sub[b-nsnp5vxxyx] {
    font-size: 0.66rem;
    color: var(--gnc-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.gnc-topbar-field[b-nsnp5vxxyx] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

    .gnc-topbar-field > label[b-nsnp5vxxyx] {
        font-size: var(--text-xs);
        font-weight: var(--fw-medium);
        color: var(--gnc-text-secondary);
    }

.gnc-numero[b-nsnp5vxxyx] {
    height: 30px;
    min-width: 140px;
    border: 1.5px solid var(--gnc-border);
    border-radius: var(--gnc-radius-sm);
    background: var(--gnc-bg);
    padding: 0 10px;
    font-weight: 700;
    color: var(--gnc-primary-dark);
    font-family: inherit;
    text-align: center;
}

.gnc-title[b-nsnp5vxxyx] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--gnc-text);
}

    .gnc-title .rzi[b-nsnp5vxxyx] {
        color: var(--gnc-primary);
        font-size: 1.25rem;
    }

.gnc-status-pill[b-nsnp5vxxyx] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--gnc-bg);
    color: var(--gnc-text-secondary);
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

    .gnc-status-pill .rzi[b-nsnp5vxxyx] {
        font-size: 0.9rem;
    }

    .gnc-status-pill.ready[b-nsnp5vxxyx] {
        background: var(--gnc-success-light);
        color: var(--gnc-success);
    }

/* ===== Botones ===== */
.gnc-btn[b-nsnp5vxxyx] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--gnc-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--gnc-transition);
    white-space: nowrap;
    color: white;
}

    .gnc-btn:hover:not(:disabled)[b-nsnp5vxxyx] {
        transform: translateY(-1px);
        box-shadow: var(--gnc-shadow-md);
    }

    .gnc-btn:active:not(:disabled)[b-nsnp5vxxyx] {
        transform: translateY(0);
    }

    .gnc-btn:disabled[b-nsnp5vxxyx] {
        opacity: 0.5;
        cursor: not-allowed;
    }

    .gnc-btn .rzi[b-nsnp5vxxyx] {
        font-size: 1rem;
    }

.btn-buscar[b-nsnp5vxxyx] {
    background: var(--gnc-orange);
}

    .btn-buscar:hover:not(:disabled)[b-nsnp5vxxyx] {
        background: var(--gnc-orange-dark);
    }

.btn-limpiar[b-nsnp5vxxyx] {
    background: var(--color-limpiar);
}

    .btn-limpiar:hover:not(:disabled)[b-nsnp5vxxyx] {
        background: var(--color-limpiar-dark);
    }

.gnc-btn-cerrar[b-nsnp5vxxyx] {
    background: var(--color-secondary);
    color: #fff;
    border: none;
}

    .gnc-btn-cerrar:hover:not(:disabled)[b-nsnp5vxxyx] {
        background: var(--color-secondary-dark);
    }

.btn-grabar[b-nsnp5vxxyx] {
    background: var(--color-success);
}

.btn-nuevo[b-nsnp5vxxyx] {
    background: var(--gnc-primary);
}

/* ===== Card ===== */
.gnc-card[b-nsnp5vxxyx] {
    background: var(--gnc-card);
    border-radius: var(--gnc-radius);
    box-shadow: var(--gnc-shadow);
    overflow: hidden;
    animation: gncFadeIn-b-nsnp5vxxyx 0.25s ease;
    /* Las cards fijas (topbar/búsqueda/"Datos del documento") NO deben encogerse: al tener
       overflow:hidden su min-height auto colapsa a 0 y el flex column del contenedor las
       encogería, recortando sus campos. flex-shrink:0 conserva su alto real y se ven completas;
       el scroll necesario ocurre dentro del workspace (.gnc-workspace), no en la página. */
    flex-shrink: 0;
}

.gnc-card-header[b-nsnp5vxxyx] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-bottom: 1px solid var(--gnc-border);
    background: linear-gradient(135deg, var(--gnc-primary-light) 0%, var(--gnc-card) 100%);
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--gnc-text);
}

    .gnc-card-header .rzi[b-nsnp5vxxyx] {
        color: var(--gnc-primary);
        font-size: 0.95rem;
    }

.gnc-card-body[b-nsnp5vxxyx] {
    padding: 10px 12px;
}

/* ===== Workspace de 2 paneles (estilo OrdenCompra) ===== */
.gnc-workspace[b-nsnp5vxxyx] {
    display: grid;
    grid-template-columns: 40fr 60fr;
    gap: 10px;
    /* Workspace full-height: ocupa el alto restante bajo el topbar y NO scrollea la página.
       Cada columna/card gestiona su propio scroll interno (el form de Datos y la grilla del
       Detalle). min-height:0 permite que las columnas encojan por debajo de su contenido. */
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

.gnc-panel-left[b-nsnp5vxxyx],
.gnc-panel-right[b-nsnp5vxxyx] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
    min-height: 0;
}

/* ===== Cards con alto gestionado dentro del workspace =====
   Datos, Detalle e Información "llenan" el alto de su columna y scrollean por dentro;
   Totales queda con alto natural (sin crecer de más). */
.gnc-card-datos[b-nsnp5vxxyx],
.gnc-card-detalle[b-nsnp5vxxyx],
.gnc-card-info[b-nsnp5vxxyx] {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.gnc-card-datos[b-nsnp5vxxyx] {
    flex: 1 1 0;
}

/* Reparto de alto en la columna derecha: el Detalle es más bajo (con scroll interno en la
   grilla) para que "Información del documento" disponga de más espacio (≈44% / 56%). */
.gnc-card-detalle[b-nsnp5vxxyx] {
    flex: 4 1 0;
}

.gnc-card-info[b-nsnp5vxxyx] {
    flex: 5 1 0;
}

.gnc-card-totales[b-nsnp5vxxyx] {
    flex: 0 0 auto;
}

.gnc-card-header[b-nsnp5vxxyx] {
    flex-shrink: 0;
}

/* Cuerpo de Datos: absorbe el alto y scrollea si el contenido excede. */
.gnc-card-datos > .gnc-card-body[b-nsnp5vxxyx] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

/* Cuerpo de Información: columna flex con la barra de tabs FIJA arriba y el panel del tab
   activo scrolleando debajo (así los tabs no se pierden al hacer scroll vertical). */
.gnc-card-info > .gnc-card-body[b-nsnp5vxxyx] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.gnc-card-info .gnc-tabs-nav[b-nsnp5vxxyx] {
    flex-shrink: 0;
}

.gnc-card-info .gnc-tab-panel[b-nsnp5vxxyx] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

/* Cuerpo del Detalle: contenedor flex sin padding; la grilla interna es la que scrollea. */
.gnc-card-detalle > .gnc-card-body[b-nsnp5vxxyx] {
    flex: 1 1 auto;
    min-height: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* La grilla del Detalle (componente hijo DetalleNotaCredito) absorbe el alto y
   scrollea en vertical/horizontal dentro del panel. */
[b-nsnp5vxxyx] .gnc-card-detalle .gnc-results-table {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

/* Encabezado de la grilla del Detalle fijo mientras se hace scroll vertical. */
[b-nsnp5vxxyx] .gnc-card-detalle .rz-datatable-thead > tr > th {
    position: sticky;
    top: 0;
    z-index: 1;
}

/* ===== Totales compacto (zócalo de la columna izquierda) =====
   Neto / Exento / IVA en una fila; Total destacado ocupando el ancho completo debajo. */
.gnc-totales-compact[b-nsnp5vxxyx] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-top: 0;
    padding-top: 0;
    border-top: none;
}

.gnc-totales-compact .gnc-total-item[b-nsnp5vxxyx] {
    padding: 7px 10px;
    gap: 2px;
}

.gnc-totales-compact .gnc-total-value[b-nsnp5vxxyx] {
    font-size: 0.9rem;
}

.gnc-totales-compact .gnc-total-final[b-nsnp5vxxyx] {
    grid-column: 1 / -1;
    flex-direction: row;
    align-items: baseline;
    justify-content: space-between;
}

.gnc-totales-compact .gnc-total-final .gnc-total-value[b-nsnp5vxxyx] {
    font-size: 1.15rem;
}

/* ===== Fila de búsqueda ===== */
.gnc-search-row[b-nsnp5vxxyx] {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(140px, 200px) 140px;
    gap: 12px;
    align-items: end;
}

    /* Layout extendido cuando se incluyen las dos fechas */
    .gnc-search-row.gnc-search-row-wide[b-nsnp5vxxyx] {
        grid-template-columns: minmax(220px, 1fr) minmax(110px, 140px) minmax(140px, 1fr) minmax(140px, 1fr) 130px;
    }

/* Grilla de documentos encontrados (debajo de los filtros) */
.gnc-results-wrap[b-nsnp5vxxyx] {
    margin-top: 14px;
    border-top: 1px dashed var(--gnc-border);
    padding-top: 14px;
}

/* La tabla permite scroll horizontal si el ancho disponible se reduce,
   evitando que las columnas se aplasten hasta quedar ilegibles. */
.gnc-results-table[b-nsnp5vxxyx] {
    overflow-x: auto;
}

/* Las tarjetas solo se muestran en pantallas chicas (ver media query). */
.gnc-results-cards[b-nsnp5vxxyx] {
    display: none;
}

/* ===== Tarjetas de resultado (pantallas chicas) ===== */
.gnc-doc-card[b-nsnp5vxxyx] {
    border: 1px solid var(--gnc-border);
    border-radius: var(--gnc-radius-sm);
    background: var(--gnc-card);
    box-shadow: var(--gnc-shadow-sm);
    overflow: hidden;
}

    .gnc-doc-card + .gnc-doc-card[b-nsnp5vxxyx] {
        margin-top: 10px;
    }

.gnc-doc-card-head[b-nsnp5vxxyx] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: var(--gnc-bg);
    border-bottom: 1px solid var(--gnc-border);
}

.gnc-doc-folio[b-nsnp5vxxyx] {
    font-weight: 700;
    color: var(--gnc-primary-dark);
    font-size: 0.85rem;
}

.gnc-doc-fecha[b-nsnp5vxxyx] {
    font-size: 0.75rem;
    color: var(--gnc-text-muted);
}

.gnc-doc-card-head .gnc-row-action[b-nsnp5vxxyx] {
    margin-left: auto;
}

.gnc-doc-card-body[b-nsnp5vxxyx] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px 12px;
    padding: 10px 12px;
}

.gnc-doc-row[b-nsnp5vxxyx] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.gnc-doc-row-full[b-nsnp5vxxyx] {
    grid-column: span 2;
}

.gnc-doc-k[b-nsnp5vxxyx] {
    font-size: 0.65rem;
    font-weight: 700;
    color: var(--gnc-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.gnc-doc-v[b-nsnp5vxxyx] {
    font-size: 0.85rem;
    color: var(--gnc-text);
    word-break: break-word;
}

.gnc-doc-row-total .gnc-doc-v[b-nsnp5vxxyx] {
    font-weight: 700;
    color: var(--gnc-primary-dark);
}

/* Botón redondo de "seleccionar fila" en la grilla de resultados */
.gnc-row-action[b-nsnp5vxxyx] {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 50%;
    background: var(--gnc-success);
    color: white;
    cursor: pointer;
    transition: var(--gnc-transition);
}

    .gnc-row-action:hover:not(:disabled)[b-nsnp5vxxyx] {
        transform: scale(1.1);
        box-shadow: var(--gnc-shadow-md);
        background: #059669;
    }

    .gnc-row-action:disabled[b-nsnp5vxxyx] {
        opacity: 0.4;
        cursor: not-allowed;
    }

    .gnc-row-action .rzi[b-nsnp5vxxyx] {
        font-size: 1rem;
    }

/* Pills (Boleta / Factura / Afecto / Exento) */
.gnc-pill[b-nsnp5vxxyx] {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 700;
    color: white;
    background: var(--gnc-text-secondary);
    line-height: 1.25;
    white-space: nowrap;
}

.gnc-pill-33[b-nsnp5vxxyx] {
    background: var(--gnc-primary);
}

.gnc-pill-39[b-nsnp5vxxyx] {
    background: var(--gnc-info);
}

.gnc-pill-afecto[b-nsnp5vxxyx] {
    background: var(--gnc-success);
}

.gnc-pill-exento[b-nsnp5vxxyx] {
    background: var(--gnc-text-secondary);
}

/* Fila para Razón Social + botón lupa */
.gnc-cliente-row[b-nsnp5vxxyx] {
    display: flex;
    gap: 6px;
    align-items: stretch;
}

.gnc-icon-btn[b-nsnp5vxxyx] {
    width: 32px;
    height: 32px;
    border: 1.5px solid #CBD5E1;
    border-radius: var(--gnc-radius-xs);
    background: white;
    color: var(--gnc-primary);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: var(--gnc-transition);
    flex-shrink: 0;
}

    .gnc-icon-btn:hover:not(:disabled)[b-nsnp5vxxyx] {
        background: var(--gnc-primary-light);
        border-color: var(--gnc-primary);
    }

    .gnc-icon-btn:disabled[b-nsnp5vxxyx] {
        opacity: 0.5;
        cursor: not-allowed;
    }

/* Badge para el header del card de detalle */
.gnc-badge[b-nsnp5vxxyx] {
    font-size: 0.7rem;
    font-weight: 700;
    background: var(--gnc-primary-light);
    color: var(--gnc-primary-dark);
    padding: 2px 8px;
    border-radius: 999px;
    margin-left: auto;
}

.gnc-search-field[b-nsnp5vxxyx] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.gnc-search-actions[b-nsnp5vxxyx] {
    align-self: stretch;
}

    .gnc-search-actions .gnc-btn[b-nsnp5vxxyx] {
        width: 100%;
        justify-content: center;
        height: 32px;
    }

/* Segmented control: Boleta/Factura */
.gnc-segmented[b-nsnp5vxxyx] {
    display: inline-flex;
    background: var(--gnc-bg);
    border-radius: var(--gnc-radius-xs);
    padding: 3px;
    gap: 3px;
    width: fit-content;
}

.gnc-seg-btn[b-nsnp5vxxyx] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 14px;
    border: none;
    background: transparent;
    border-radius: var(--gnc-radius-xs);
    cursor: pointer;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--gnc-text-secondary);
    transition: var(--gnc-transition);
}

    .gnc-seg-btn:disabled[b-nsnp5vxxyx] {
        opacity: 0.5;
        cursor: not-allowed;
    }

    .gnc-seg-btn .rzi[b-nsnp5vxxyx] {
        font-size: 0.95rem;
    }

    .gnc-seg-btn:hover:not(:disabled):not(.active)[b-nsnp5vxxyx] {
        color: var(--gnc-primary);
    }

    .gnc-seg-btn.active[b-nsnp5vxxyx] {
        background: var(--gnc-card);
        color: var(--gnc-primary);
        box-shadow: var(--gnc-shadow-sm);
    }

/* ===== Grid de campos ===== */
/* Distribución responsive explícita (4 -> 3 -> 2 -> 1 columnas) para que la sección
   "Datos del documento" ocupe el menor alto posible y no deje campos cortados en
   pantallas chicas. Los breakpoints por columnas están en la sección Responsive. */
/* Form compacto a 3 columnas: los campos anchos (Razón Social / Dirección / Razón de la
   referencia) ocupan 2 columnas, de modo que el form se empaqueta en ~4 filas y ocupa
   menos alto. Reduce columnas de forma progresiva en pantallas chicas (ver Responsive). */
.gnc-grid[b-nsnp5vxxyx] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px 10px;
}

.gnc-field[b-nsnp5vxxyx] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.gnc-field-wide[b-nsnp5vxxyx] {
    grid-column: span 2;
}

.gnc-label[b-nsnp5vxxyx] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--gnc-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.gnc-value-box[b-nsnp5vxxyx] {
    background: var(--gnc-bg);
    border: 1.5px solid var(--gnc-border);
    border-radius: var(--gnc-radius-xs);
    padding: 7px 10px;
    font-size: 0.85rem;
    color: var(--gnc-text);
    min-height: 32px;
    display: flex;
    align-items: center;
    box-sizing: border-box;
}

/* Inputs Radzen dentro del card */
[b-nsnp5vxxyx] .gnc-card .rz-textbox,
[b-nsnp5vxxyx] .gnc-card .rz-spinner,
[b-nsnp5vxxyx] .gnc-card .rz-numeric,
[b-nsnp5vxxyx] .gnc-card .rz-dropdown,
[b-nsnp5vxxyx] .gnc-card .rz-textarea {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--gnc-radius-xs) !important;
    font-size: 0.85rem !important;
    background: white !important;
    transition: var(--gnc-transition);
}

[b-nsnp5vxxyx] .gnc-card .rz-textbox,
[b-nsnp5vxxyx] .gnc-card .rz-spinner,
[b-nsnp5vxxyx] .gnc-card .rz-numeric,
[b-nsnp5vxxyx] .gnc-card .rz-dropdown {
    height: 32px !important;
}

[b-nsnp5vxxyx] .gnc-card .rz-textarea {
    min-height: 70px !important;
    padding: 8px 10px !important;
    box-sizing: border-box !important;
    width: 100% !important;
}

[b-nsnp5vxxyx] .gnc-card .rz-state-focused,
[b-nsnp5vxxyx] .gnc-card .rz-textbox:focus,
[b-nsnp5vxxyx] .gnc-card .rz-numeric:focus-within,
[b-nsnp5vxxyx] .gnc-card input:focus {
    border-color: var(--gnc-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

[b-nsnp5vxxyx] .gnc-card .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.85rem !important;
    display: flex !important;
    align-items: center !important;
}

/* ===== Totales ===== */
.gnc-totales[b-nsnp5vxxyx] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px dashed var(--gnc-border);
}

.gnc-total-item[b-nsnp5vxxyx] {
    flex: 1 1 140px;
    background: var(--gnc-bg);
    border-radius: var(--gnc-radius-sm);
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.gnc-total-label[b-nsnp5vxxyx] {
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--gnc-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.gnc-total-value[b-nsnp5vxxyx] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--gnc-text);
}

.gnc-total-final[b-nsnp5vxxyx] {
    background: var(--gnc-primary-light);
    border: 1.5px solid var(--gnc-primary);
}

    .gnc-total-final .gnc-total-value[b-nsnp5vxxyx] {
        color: var(--gnc-primary-dark);
        font-size: 1.1rem;
    }

/* ===== Grilla detalle NC ===== */
[b-nsnp5vxxyx] .gnc-card .rz-datatable {
    border: none !important;
    border-radius: var(--gnc-radius-sm) !important;
    overflow: hidden;
    font-size: 0.8rem;
}

[b-nsnp5vxxyx] .gnc-card .rz-datatable-thead > tr > th {
    background: var(--gnc-bg) !important;
    color: var(--gnc-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--gnc-border) !important;
}

[b-nsnp5vxxyx] .gnc-card .rz-datatable-tbody > tr > td {
    padding: 6px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.8rem;
}

/* ===== Loading overlay ===== */
.gnc-loading-overlay[b-nsnp5vxxyx] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1500;
    backdrop-filter: blur(2px);
}

.gnc-loading-content[b-nsnp5vxxyx] {
    background: var(--gnc-card);
    padding: 24px 32px;
    border-radius: var(--gnc-radius);
    box-shadow: 0 20px 25px -5px rgba(0,0,0,0.2);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

.gnc-loading-text[b-nsnp5vxxyx] {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--gnc-text);
}

/* ===== Modal PDF ===== */
.gnc-modal-overlay[b-nsnp5vxxyx] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1400;
    padding: 20px;
    backdrop-filter: blur(2px);
}

.gnc-modal-card[b-nsnp5vxxyx] {
    background: var(--gnc-card);
    width: min(960px, 100%);
    max-height: 90vh;
    border-radius: var(--gnc-radius);
    box-shadow: 0 25px 50px -12px rgba(0,0,0,0.4);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.gnc-modal-header[b-nsnp5vxxyx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 18px;
    border-bottom: 1px solid var(--gnc-border);
    background: linear-gradient(135deg, var(--gnc-primary-light) 0%, var(--gnc-card) 100%);
}

    .gnc-modal-header h3[b-nsnp5vxxyx] {
        margin: 0;
        font-size: 0.95rem;
        font-weight: 700;
        color: var(--gnc-text);
    }

.gnc-modal-close[b-nsnp5vxxyx] {
    background: none;
    border: none;
    color: var(--gnc-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--gnc-radius-xs);
    transition: var(--gnc-transition);
    display: flex;
    align-items: center;
}

    .gnc-modal-close:hover[b-nsnp5vxxyx] {
        background: var(--gnc-danger-light);
        color: var(--gnc-danger);
    }

.gnc-modal-body[b-nsnp5vxxyx] {
    padding: 14px 18px;
    overflow: auto;
}

.gnc-modal-footer[b-nsnp5vxxyx] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 10px 18px;
    border-top: 1px solid var(--gnc-border);
    background: var(--gnc-bg);
}

/* ===== Tabs del panel de información del documento ===== */
.gnc-tabs-nav[b-nsnp5vxxyx] {
    display: flex;
    gap: 4px;
    border-bottom: 1px solid var(--gnc-border);
    margin-bottom: 8px;
    flex-wrap: wrap;
}

.gnc-tab-btn[b-nsnp5vxxyx] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border: none;
    background: transparent;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    cursor: pointer;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--gnc-text-secondary);
    transition: var(--gnc-transition);
}

    .gnc-tab-btn .rzi[b-nsnp5vxxyx] {
        font-size: 0.95rem;
    }

    .gnc-tab-btn:hover:not(.active)[b-nsnp5vxxyx] {
        color: var(--gnc-primary);
    }

    .gnc-tab-btn.active[b-nsnp5vxxyx] {
        color: var(--gnc-primary-dark);
        border-bottom-color: var(--gnc-orange);
    }

.gnc-tab-panel[b-nsnp5vxxyx] {
    animation: gncFadeIn-b-nsnp5vxxyx 0.2s ease;
}

/* Razón Social + Fecha Referencia en la misma fila dentro de la ficha. */
.gnc-rs-fecha-row[b-nsnp5vxxyx] {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    flex-wrap: wrap;
}

.gnc-rs-col[b-nsnp5vxxyx] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    flex: 1 1 0;
}

.gnc-rs-col-fecha[b-nsnp5vxxyx] {
    flex: 0 0 auto;
    min-width: 110px;
}

/* ===== Animaciones ===== */
@keyframes gncFadeIn-b-nsnp5vxxyx {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ===== Responsive ===== */
/* La sección "Datos del documento" reduce columnas progresivamente para no crecer
   demasiado en alto. Los campos anchos (Razón Social / Dirección / Razón de la
   referencia) dejan de ocupar 2 columnas cuando ya solo hay 2, evitando huecos. */
@media (max-width: 1024px) {
    .gnc-container[b-nsnp5vxxyx] {
        padding: 8px 10px;
    }

    .gnc-search-row[b-nsnp5vxxyx] {
        grid-template-columns: 1fr;
    }

    /* En pantallas medianas las columnas se apilan y se permite el scroll del workspace:
       las cards recuperan su alto natural y ya no compiten por el alto disponible. */
    .gnc-workspace[b-nsnp5vxxyx] {
        grid-template-columns: 1fr;
        overflow-y: auto;
    }

    .gnc-card-datos[b-nsnp5vxxyx],
    .gnc-card-detalle[b-nsnp5vxxyx],
    .gnc-card-info[b-nsnp5vxxyx] {
        flex: 0 0 auto;
        max-height: none;
    }

    .gnc-card-datos > .gnc-card-body[b-nsnp5vxxyx],
    .gnc-card-info > .gnc-card-body[b-nsnp5vxxyx],
    .gnc-card-detalle > .gnc-card-body[b-nsnp5vxxyx] {
        overflow: visible;
    }

    /* Información vuelve a flujo normal: tabs y contenido con alto natural (scrollea el workspace). */
    .gnc-card-info > .gnc-card-body[b-nsnp5vxxyx] {
        display: block;
    }

    .gnc-card-info .gnc-tab-panel[b-nsnp5vxxyx] {
        flex: 0 0 auto;
        overflow: visible;
    }

    [b-nsnp5vxxyx] .gnc-card-detalle .gnc-results-table {
        flex: 0 0 auto;
        overflow-x: auto;
    }

    [b-nsnp5vxxyx] .gnc-card-detalle .rz-datatable-thead > tr > th {
        position: static;
    }

    /* Al apilarse, Datos vuelve a ancho completo y aprovecha 3 columnas. */
    .gnc-grid[b-nsnp5vxxyx] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 860px) {
    .gnc-grid[b-nsnp5vxxyx] {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* En pantallas chicas ocultamos la tabla y mostramos las tarjetas apiladas,
   donde cada dato del documento queda con su etiqueta y se lee claro. */
@media (max-width: 768px) {
    .gnc-results-table[b-nsnp5vxxyx] {
        display: none;
    }

    .gnc-results-cards[b-nsnp5vxxyx] {
        display: block;
    }
}

@media (max-width: 640px) {
    .gnc-control-bar[b-nsnp5vxxyx] {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .gnc-control-right[b-nsnp5vxxyx] {
        flex-wrap: wrap;
    }

    .gnc-btn[b-nsnp5vxxyx] {
        flex: 1;
        justify-content: center;
    }

    .gnc-grid[b-nsnp5vxxyx] {
        grid-template-columns: 1fr;
    }

    .gnc-field-wide[b-nsnp5vxxyx] {
        grid-column: span 1;
    }
}
/* /Pages/Pos/GestionTurno/Componentes/DocumentosTab.razor.rz.scp.css */
.docs-container[b-k4ztov5ri5] {
    display: flex;
    flex-direction: column;
    height: 100%;
    gap: 8px;
}

.docs-toolbar[b-k4ztov5ri5] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 8px;
    background: #f8fafc;
    border-radius: 6px;
    border: 1px solid #e2e8f0;
    flex-shrink: 0;
}

.docs-count[b-k4ztov5ri5] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--text-secondary);
}

.docs-grid[b-k4ztov5ri5] {
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

/* ===== Botón Informe Z ===== */
.docs-btn-informez[b-k4ztov5ri5] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border: none;
    border-radius: 6px;
    background: #6366f1;
    color: white;
    font-size: 0.75rem;
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.docs-btn-informez:hover[b-k4ztov5ri5] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.docs-btn-informez:active[b-k4ztov5ri5] {
    transform: translateY(0);
}

/* ===== Modal Informe Z ===== */
.iz-modal-overlay[b-k4ztov5ri5] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2000;
    backdrop-filter: blur(2px);
}

.iz-modal-card[b-k4ztov5ri5] {
    background: white;
    width: min(1000px, 95vw);
    max-height: 90vh;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
}

.iz-modal-header[b-k4ztov5ri5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 18px;
    background: linear-gradient(135deg, #1e293b, #334155);
    color: white;
    flex-shrink: 0;
}

.iz-modal-header h3[b-k4ztov5ri5] {
    margin: 0;
    font-size: 1rem;
    display: flex;
    align-items: center;
}

.iz-modal-header-actions[b-k4ztov5ri5] {
    display: flex;
    gap: 6px;
}

.iz-modal-btn[b-k4ztov5ri5],
.iz-modal-close[b-k4ztov5ri5] {
    background: rgba(255, 255, 255, 0.1);
    border: none;
    color: white;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s;
}

.iz-modal-btn:hover[b-k4ztov5ri5],
.iz-modal-close:hover[b-k4ztov5ri5] {
    background: rgba(255, 255, 255, 0.25);
}

.iz-modal-body[b-k4ztov5ri5] {
    padding: 18px 22px;
    overflow-y: auto;
    flex: 1;
    color: #1f2937;
}

.iz-header-row[b-k4ztov5ri5] {
    display: flex;
    gap: 16px;
    margin-bottom: 12px;
    font-size: 0.85rem;
    align-items: center;
    flex-wrap: wrap;
}

.iz-label[b-k4ztov5ri5] {
    font-weight: 600;
    color: #475569;
}

.iz-value[b-k4ztov5ri5] {
    color: #0f172a;
    margin-right: 16px;
}

.iz-totales-grid[b-k4ztov5ri5] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin: 10px 0 16px 0;
}

.iz-total-item[b-k4ztov5ri5] {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 10px 12px;
    background: #f8fafc;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.iz-total-label[b-k4ztov5ri5] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.iz-total-value[b-k4ztov5ri5] {
    font-size: 1.15rem;
    font-weight: 700;
    color: #0f172a;
}

.iz-total-count[b-k4ztov5ri5] {
    font-size: 0.7rem;
    color: var(--text-secondary);
}

.iz-section-title[b-k4ztov5ri5] {
    font-size: 0.85rem;
    font-weight: 700;
    color: #0f172a;
    margin: 18px 0 8px 0;
    padding-bottom: 4px;
    border-bottom: 2px solid #334155;
}

.iz-vendedor-block[b-k4ztov5ri5] {
    margin-bottom: 14px;
}

.iz-vendedor-header[b-k4ztov5ri5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #e2e8f0;
    padding: 6px 12px;
    border-radius: 6px 6px 0 0;
    font-size: 0.8rem;
}

.iz-vendedor-nombre[b-k4ztov5ri5] {
    font-weight: 700;
    color: #1e293b;
}

.iz-vendedor-stats[b-k4ztov5ri5] {
    display: flex;
    gap: 14px;
    color: #475569;
}

.iz-folios-table[b-k4ztov5ri5] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.78rem;
}

.iz-folios-table th[b-k4ztov5ri5],
.iz-folios-table td[b-k4ztov5ri5] {
    border: 1px solid #e2e8f0;
    padding: 5px 8px;
    text-align: left;
}

.iz-folios-table th[b-k4ztov5ri5] {
    background: #f1f5f9;
    font-weight: 600;
    color: #334155;
}

.iz-folios-table tbody tr:nth-child(even)[b-k4ztov5ri5] {
    background: #f8fafc;
}

.iz-empty[b-k4ztov5ri5] {
    text-align: center;
    padding: 20px;
    color: #94a3b8;
    font-style: italic;
}

.iz-empty-small[b-k4ztov5ri5] {
    padding: 6px 10px;
    color: #94a3b8;
    font-style: italic;
    font-size: 0.78rem;
    border: 1px solid #e2e8f0;
    border-top: none;
    border-radius: 0 0 6px 6px;
}
/* /Pages/Pos/GestionTurno/Componentes/MovimientoCajaModal.razor.rz.scp.css */
/* ===== MODAL MOVIMIENTO DE CAJA ===== */

/* Overlay por debajo de los popups de Radzen (1050 !important) para que los
   dropdowns / calendario del formulario se rendericen por encima del modal. */
.mc-modal-overlay[b-c81g8j3adb] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(6px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1040;
    padding: 1rem;
    animation: mcOverlayIn-b-c81g8j3adb 0.2s ease;
}

.mc-modal-card[b-c81g8j3adb] {
    background: var(--surface);
    border-radius: var(--radius-lg);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(0, 0, 0, 0.05);
    width: 100%;
    max-width: 440px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    animation: mcModalIn-b-c81g8j3adb 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.mc-modal-header[b-c81g8j3adb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px;
    background: linear-gradient(135deg, #8B5CF6, #7C3AED);
    color: #fff;
}

.mc-modal-header h3[b-c81g8j3adb] {
    font-size: 0.92rem;
    font-weight: 700;
    margin: 0;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 8px;
}

.mc-modal-close[b-c81g8j3adb] {
    background: rgba(255, 255, 255, 0.25);
    border: none;
    color: #fff;
    cursor: pointer;
    padding: 5px;
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    transition: all 0.2s ease;
}

.mc-modal-close:hover[b-c81g8j3adb] {
    background: rgba(255, 255, 255, 0.45);
    transform: scale(1.05);
}

.mc-modal-body[b-c81g8j3adb] {
    padding: 18px 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-height: 70vh;
    overflow-y: auto;
}

.mc-field[b-c81g8j3adb] {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.mc-label[b-c81g8j3adb] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.mc-modal-footer[b-c81g8j3adb] {
    padding: 12px 20px;
    border-top: 1px solid var(--border);
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    background: var(--bg);
}

.mc-btn[b-c81g8j3adb] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 7px 16px;
    border: none;
    border-radius: var(--radius-sm);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.mc-btn:hover[b-c81g8j3adb] { transform: translateY(-1px); }
.mc-btn:disabled[b-c81g8j3adb] { opacity: 0.6; cursor: not-allowed; transform: none; }

.mc-btn-cancelar[b-c81g8j3adb] { background: var(--color-secondary); color: #fff; }
.mc-btn-cancelar:hover[b-c81g8j3adb] { background: var(--color-secondary-dark); }

.mc-btn-grabar[b-c81g8j3adb] { background: #8B5CF6; color: #fff; }
.mc-btn-grabar:hover[b-c81g8j3adb] { background: #7C3AED; box-shadow: var(--shadow-md); }

.mc-btn .rzi[b-c81g8j3adb] { font-size: 1rem; }

@keyframes mcOverlayIn-b-c81g8j3adb {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes mcModalIn-b-c81g8j3adb {
    from { opacity: 0; transform: scale(0.92) translateY(10px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}
/* /Pages/Pos/GestionTurno/GestionTurnoIndex.razor.rz.scp.css */
/* ===== CIERRE DE CAJA - SISTEMA DE DISENO ===== */

.cc-container[b-v2j6pk197w] {
    --cc-primary: var(--color-primary);
    --cc-primary-dark: var(--color-primary-dark);
    --cc-primary-light: var(--color-primary-light);
    --cc-accent: var(--color-warning);
    --cc-accent-light: #FFFBEB;
    --cc-success: var(--color-success);
    --cc-success-light: var(--color-success-light);
    --cc-danger: var(--color-danger);
    --cc-danger-light: var(--color-danger-light);
    --cc-info: var(--color-info);
    --cc-info-light: var(--color-info-light);
    --cc-warning: var(--color-warning);
    --cc-warning-light: var(--color-warning-light);
    --cc-purple: #8B5CF6;
    --cc-purple-light: #EDE9FE;
    --cc-bg: var(--bg);
    --cc-card: var(--surface);
    --cc-text: var(--text);
    --cc-text-secondary: var(--text-secondary);
    --cc-text-muted: var(--text-muted);
    --cc-border: var(--border);
    --cc-radius: var(--radius-lg);
    --cc-radius-sm: var(--radius-md);
    --cc-radius-xs: var(--radius-sm);
    --cc-shadow: var(--shadow-sm);
    --cc-shadow-md: var(--shadow-md);
    --cc-shadow-lg: var(--shadow-lg);
    --cc-transition: var(--transition);

    height: 100%;
    display: grid;
    grid-template-columns: 340px 1fr;
    gap: 10px;
    padding: 12px 16px;
    background: var(--cc-bg);
    overflow: hidden;
    box-sizing: border-box;
    font-family: var(--font-family);
}

/* ===== COLUMNAS PRINCIPALES ===== */
.cc-left-col[b-v2j6pk197w] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-height: 0;
    min-width: 0;
    animation: ccSlideLeft-b-v2j6pk197w 0.5s ease;
}

.cc-right-col[b-v2j6pk197w] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-height: 0;
    min-width: 0;
    animation: ccFadeIn-b-v2j6pk197w 0.4s ease;
}

/* --- Barra de control: botón Filtros + botón Buscar lado a lado (alineados a la derecha) --- */
.cc-control-bar[b-v2j6pk197w] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-shrink: 0;
}

.cc-docs-panel[b-v2j6pk197w] {
    flex: 1;
    min-height: 0;
    min-width: 0;
}

/* --- Panel de filtros desplegable (debajo de la barra de control) --- */
.cc-filters-panel[b-v2j6pk197w] {
    background: var(--cc-card);
    border-radius: var(--cc-radius);
    box-shadow: var(--cc-shadow);
    padding: 12px 14px;
    flex-shrink: 0;
    animation: ccFadeIn-b-v2j6pk197w 0.25s ease;
}

.cc-filters-grid[b-v2j6pk197w] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 12px;
    align-items: flex-end;
}

.cc-filter-group[b-v2j6pk197w] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    flex: 1;
    min-width: 0;
}

.cc-filter-label[b-v2j6pk197w] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--cc-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* --- Tarjeta estado turno --- */
.cc-turno-card[b-v2j6pk197w] {
    background: var(--cc-card);
    border-radius: var(--cc-radius);
    box-shadow: var(--cc-shadow);
    overflow: hidden;
    flex-shrink: 0;
    transition: var(--cc-transition);
}

.cc-turno-card:hover[b-v2j6pk197w] {
    box-shadow: var(--cc-shadow-md);
    transform: translateY(-2px);
}

.cc-turno-accent[b-v2j6pk197w] {
    height: 4px;
    transition: var(--cc-transition);
}

.cc-turno--abierto .cc-turno-accent[b-v2j6pk197w] { background: linear-gradient(90deg, var(--cc-success), #34D399); }
.cc-turno--cerrado .cc-turno-accent[b-v2j6pk197w] { background: linear-gradient(90deg, var(--cc-danger), #F87171); }

.cc-turno-body[b-v2j6pk197w] {
    padding: 12px 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.cc-turno-icon-wrap[b-v2j6pk197w] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--cc-transition);
    animation: ccPulse-b-v2j6pk197w 2s ease-in-out infinite;
}

.cc-turno--abierto .cc-turno-icon-wrap[b-v2j6pk197w] {
    background: var(--cc-success-light);
    color: var(--cc-success);
}

.cc-turno--cerrado .cc-turno-icon-wrap[b-v2j6pk197w] {
    background: var(--cc-danger-light);
    color: var(--cc-danger);
}

.cc-turno-info[b-v2j6pk197w] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

.cc-turno-status[b-v2j6pk197w] {
    font-size: 0.9rem;
    font-weight: 800;
    color: var(--cc-text);
}

.cc-turno-detail[b-v2j6pk197w] {
    font-size: 0.7rem;
    color: var(--cc-text-secondary);
    text-align: center;
}

.cc-turno-actions[b-v2j6pk197w] {
    display: flex;
    gap: 6px;
    width: 100%;
}

.cc-turno-actions .cc-btn[b-v2j6pk197w] {
    flex: 1;
    justify-content: center;
}

/* ===== ICONOS GENERICOS ===== */
.cc-icon-wrap[b-v2j6pk197w] {
    width: 28px;
    height: 28px;
    border-radius: var(--cc-radius-xs);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.cc-icon-primary[b-v2j6pk197w] { background: var(--cc-primary-light); color: var(--cc-primary); }
.cc-icon-indigo[b-v2j6pk197w] { background: var(--cc-primary-light); color: var(--cc-primary); }
.cc-icon-amber[b-v2j6pk197w] { background: var(--cc-accent-light); color: var(--cc-accent); }
.cc-icon-blue[b-v2j6pk197w] { background: var(--cc-info-light); color: var(--cc-info); }
.cc-icon-purple[b-v2j6pk197w] { background: var(--cc-purple-light); color: var(--cc-purple); }

/* ===== BOTONES ===== */
.cc-btn[b-v2j6pk197w] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cc-radius-sm);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cc-transition);
    white-space: nowrap;
}

.cc-btn:hover[b-v2j6pk197w] { transform: translateY(-1px); }
.cc-btn:active[b-v2j6pk197w] { transform: translateY(0); }
.cc-btn:disabled[b-v2j6pk197w] { opacity: 0.5; cursor: not-allowed; transform: none; }

/* Filtros = azul info (activo = más oscuro), consistente con el resto de la app */
.cc-btn-filtros[b-v2j6pk197w] {
    background: var(--cc-info);
    color: white;
}
.cc-btn-filtros:hover[b-v2j6pk197w] { background: #0284C7; box-shadow: var(--shadow-md); }
.cc-btn-filtros.active[b-v2j6pk197w] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* Buscar = naranjo de marca (DESIGN_SYSTEM §4.3) */
.cc-btn-search[b-v2j6pk197w] {
    background: var(--color-accent);
    color: white;
}
.cc-btn-search:hover[b-v2j6pk197w] { background: var(--color-accent-dark); box-shadow: var(--shadow-md); }

/* Movimiento de caja = morado (distingue de Filtros/Buscar) */
.cc-btn-mov[b-v2j6pk197w] {
    background: var(--cc-purple);
    color: white;
}
.cc-btn-mov:hover[b-v2j6pk197w] { background: #7C3AED; box-shadow: var(--shadow-md); }

.cc-btn-success[b-v2j6pk197w] {
    background: var(--cc-success);
    color: white;
}
.cc-btn-success:hover[b-v2j6pk197w] { background: #059669; box-shadow: var(--shadow-md); }

.cc-btn-danger[b-v2j6pk197w] {
    background: var(--cc-danger);
    color: white;
}
.cc-btn-danger:hover[b-v2j6pk197w] { background: #DC2626; box-shadow: var(--shadow-md); }

.cc-btn-outline[b-v2j6pk197w] {
    background: transparent;
    color: var(--cc-text-secondary);
    border: 1.5px solid var(--cc-border);
}
.cc-btn-outline:hover[b-v2j6pk197w] { border-color: var(--cc-primary); color: var(--cc-primary); background: var(--cc-primary-light); }

.cc-btn-cancelar[b-v2j6pk197w] { background: var(--color-secondary); color: #fff; border: none; }
.cc-btn-cancelar:hover[b-v2j6pk197w] { background: var(--color-secondary-dark); color: #fff; }

/* --- Panel generico --- */
.cc-panel[b-v2j6pk197w] {
    background: var(--cc-card);
    border-radius: var(--cc-radius);
    box-shadow: var(--cc-shadow);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0;
    animation: ccSlideUp-b-v2j6pk197w 0.5s ease;
}

.cc-panel-header[b-v2j6pk197w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 14px;
    border-bottom: 1px solid var(--cc-border);
    flex-shrink: 0;
}

.cc-panel-title-wrap[b-v2j6pk197w] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.cc-panel-title[b-v2j6pk197w] {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--cc-text);
}

/* ===== BADGES ===== */
.cc-badge[b-v2j6pk197w] {
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    white-space: nowrap;
}

.cc-badge-info[b-v2j6pk197w] { background: rgba(59, 130, 246, 0.12); color: var(--cc-info); }
.cc-badge-success[b-v2j6pk197w] { background: rgba(16, 185, 129, 0.12); color: var(--cc-success); }
.cc-badge-danger[b-v2j6pk197w] { background: rgba(239, 68, 68, 0.12); color: var(--cc-danger); }
.cc-badge-warning[b-v2j6pk197w] { background: rgba(245, 158, 11, 0.12); color: var(--cc-warning); }

/* ===== PANEL RESUMEN ===== */
.cc-resumen-panel[b-v2j6pk197w] {
    flex: 1;
    min-height: 0;
    min-width: 0;
}

.cc-resumen-body[b-v2j6pk197w] {
    flex: 1;
    overflow-y: auto;
    scrollbar-gutter: stable;
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* Totales principales */
.cc-totales-grid[b-v2j6pk197w] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cc-total-card[b-v2j6pk197w] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: var(--cc-radius-sm);
    transition: var(--cc-transition);
    position: relative;
    overflow: hidden;
}

.cc-total-card[b-v2j6pk197w]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    border-radius: 4px 0 0 4px;
}

.cc-total-card:hover[b-v2j6pk197w] { transform: translateX(3px); }

.cc-total--primary[b-v2j6pk197w] { background: var(--cc-primary-light); }
.cc-total--primary[b-v2j6pk197w]::before { background: var(--cc-primary); }
.cc-total--primary .cc-total-icon[b-v2j6pk197w] { color: var(--cc-primary); }

.cc-total--accent[b-v2j6pk197w] { background: var(--cc-accent-light); }
.cc-total--accent[b-v2j6pk197w]::before { background: var(--cc-accent); }
.cc-total--accent .cc-total-icon[b-v2j6pk197w] { color: var(--cc-accent); }

.cc-total--info[b-v2j6pk197w] { background: var(--cc-info-light); }
.cc-total--info[b-v2j6pk197w]::before { background: var(--cc-info); }
.cc-total--info .cc-total-icon[b-v2j6pk197w] { color: var(--cc-info); }

.cc-total-icon[b-v2j6pk197w] {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.cc-total-info[b-v2j6pk197w] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

.cc-total-value[b-v2j6pk197w] {
    font-size: 1rem;
    font-weight: 800;
    color: var(--cc-text);
    letter-spacing: -0.02em;
}

.cc-total-label[b-v2j6pk197w] {
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--cc-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.cc-total-count[b-v2j6pk197w] {
    font-size: 0.65rem;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 12px;
    background: rgba(255,255,255,0.7);
    color: var(--cc-text-secondary);
    white-space: nowrap;
    flex-shrink: 0;
}

/* Medios de pago */
.cc-medios-section[b-v2j6pk197w],
.cc-movimientos-section[b-v2j6pk197w] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cc-section-title[b-v2j6pk197w] {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--cc-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    display: flex;
    align-items: center;
    padding-bottom: 4px;
    border-bottom: 1px solid var(--cc-border);
}

/* ===== ACORDEON ===== */
.cc-accordion-header[b-v2j6pk197w] {
    width: 100%;
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--cc-border);
    cursor: pointer;
    padding: 6px 4px;
    justify-content: space-between;
    transition: var(--cc-transition);
}

.cc-accordion-header:hover[b-v2j6pk197w] {
    color: var(--cc-primary);
    border-bottom-color: var(--cc-primary);
}

.cc-accordion.open .cc-accordion-header[b-v2j6pk197w] {
    color: var(--cc-primary);
    border-bottom-color: var(--cc-primary);
}

.cc-accordion-title-text[b-v2j6pk197w] {
    display: flex;
    align-items: center;
}

.cc-accordion .cc-medios-grid[b-v2j6pk197w],
.cc-accordion .cc-movimientos-grid[b-v2j6pk197w] {
    animation: ccAccordionIn-b-v2j6pk197w 0.25s ease;
}

.cc-medios-grid[b-v2j6pk197w] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.cc-medio-item[b-v2j6pk197w] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 8px;
    border-radius: var(--cc-radius-xs);
    transition: var(--cc-transition);
}

.cc-medio-item:hover[b-v2j6pk197w] {
    background: var(--cc-bg);
}

.cc-medio-dot[b-v2j6pk197w] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.cc-medio-name[b-v2j6pk197w] {
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--cc-text-secondary);
    flex: 1;
}

.cc-medio-value[b-v2j6pk197w] {
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--cc-text);
}

/* Movimientos de caja */
.cc-movimientos-grid[b-v2j6pk197w] {
    display: flex;
    gap: 6px;
}

.cc-movimiento-item[b-v2j6pk197w] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    padding: 8px 6px;
    border-radius: var(--cc-radius-sm);
    transition: var(--cc-transition);
}

.cc-movimiento-item:hover[b-v2j6pk197w] { transform: translateY(-2px); }

.cc-mov--apertura[b-v2j6pk197w] { background: var(--cc-info-light); color: var(--cc-info); }
.cc-mov--ingreso[b-v2j6pk197w] { background: var(--cc-success-light); color: var(--cc-success); }
.cc-mov--retiro[b-v2j6pk197w] { background: var(--cc-danger-light); color: var(--cc-danger); }

.cc-mov-label[b-v2j6pk197w] {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.cc-mov-value[b-v2j6pk197w] {
    font-size: 0.85rem;
    font-weight: 800;
    color: var(--cc-text);
}

/* ===== PANEL DOCUMENTOS ===== */
.cc-docs-panel[b-v2j6pk197w] {
    padding: 8px;
}

/* ===== TRANSBANK ===== */

/* ===== MODAL APERTURA ===== */
.cc-modal-overlay[b-v2j6pk197w] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(6px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1100;
    animation: ccOverlayIn-b-v2j6pk197w 0.2s ease;
    padding: 1rem;
}

.cc-modal-card[b-v2j6pk197w] {
    background: var(--cc-card);
    border-radius: var(--cc-radius);
    box-shadow: 0 20px 40px rgba(0,0,0,0.25), 0 0 0 1px rgba(0,0,0,0.05);
    width: 100%;
    max-width: 420px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    animation: ccModalIn-b-v2j6pk197w 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.cc-modal-header[b-v2j6pk197w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px;
    background: linear-gradient(135deg, var(--cc-success), #059669);
    color: white;
}

.cc-modal-header h3[b-v2j6pk197w] {
    font-size: 0.92rem;
    font-weight: 700;
    margin: 0;
    color: white;
    display: flex;
    align-items: center;
}

.cc-modal-close[b-v2j6pk197w] {
    background: rgba(255,255,255,0.25);
    border: none;
    color: white;
    cursor: pointer;
    padding: 5px;
    border-radius: var(--cc-radius-xs);
    display: flex;
    align-items: center;
    transition: var(--cc-transition);
}

.cc-modal-close:hover[b-v2j6pk197w] { background: rgba(255,255,255,0.45); transform: scale(1.05); }

.cc-modal-body[b-v2j6pk197w] {
    padding: 20px;
}

.cc-modal-field[b-v2j6pk197w] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cc-modal-footer[b-v2j6pk197w] {
    padding: 12px 20px;
    border-top: 1px solid var(--cc-border);
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    background: #F8FAFC;
}

/* ===== ANIMACIONES ===== */
@keyframes ccFadeIn-b-v2j6pk197w {
    from { opacity: 0; transform: translateY(-8px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes ccSlideUp-b-v2j6pk197w {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes ccSlideRight-b-v2j6pk197w {
    from { opacity: 0; transform: translateX(20px); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes ccSlideLeft-b-v2j6pk197w {
    from { opacity: 0; transform: translateX(-20px); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes ccAccordionIn-b-v2j6pk197w {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes ccPulse-b-v2j6pk197w {
    0%, 100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.3); }
    50% { box-shadow: 0 0 0 8px rgba(16, 185, 129, 0); }
}

@keyframes ccOverlayIn-b-v2j6pk197w {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes ccModalIn-b-v2j6pk197w {
    from { opacity: 0; transform: scale(0.92) translateY(10px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1200px) {
    .cc-container[b-v2j6pk197w] {
        grid-template-columns: 300px 1fr;
    }
}

@media (max-width: 992px) {
    .cc-container[b-v2j6pk197w] {
        grid-template-columns: 1fr;
        grid-template-rows: auto 1fr;
        overflow-y: auto;
    }

    .cc-left-col[b-v2j6pk197w] {
        min-height: 0;
    }

    .cc-resumen-panel[b-v2j6pk197w] {
        max-height: 300px;
        flex: none;
    }
}

@media (max-width: 768px) {
    .cc-container[b-v2j6pk197w] {
        padding: 8px;
        gap: 8px;
    }

    .cc-filter-group[b-v2j6pk197w] {
        min-width: 120px;
    }

}

.cc-btn .rzi[b-v2j6pk197w] {
    font-size: 1rem;
}
/* /Pages/Pos/Ticket/Componentes/ClientesTab.razor.rz.scp.css */
/* ===== CLIENTES TAB - SCOPED STYLES ===== */

.clientes-wrapper[b-sdbcbyblda] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

/* ===== BUSCADOR DE CLIENTE ===== */
.clientes-search[b-sdbcbyblda] {
    position: relative;
    margin-bottom: 10px;
    flex: 0 0 auto;
}

.clientes-search-icon[b-sdbcbyblda] {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.1rem;
    color: var(--pos-text-secondary);
    pointer-events: none;
}

.clientes-search-input[b-sdbcbyblda] {
    width: 100%;
    height: 38px;
    padding: 0 12px 0 36px;
    background: var(--pos-bg);
    border: 1px solid var(--pos-border);
    border-radius: var(--pos-radius-sm);
    font-size: 0.85rem;
    color: var(--pos-text);
    outline: none;
    transition: var(--pos-transition);
    box-sizing: border-box;
}

.clientes-search-input[b-sdbcbyblda]::placeholder {
    color: var(--pos-text-secondary);
}

.clientes-search-input:focus[b-sdbcbyblda] {
    border-color: var(--pos-primary);
    box-shadow: 0 0 0 3px var(--pos-primary-light);
}

.clientes-grid-container[b-sdbcbyblda] {
    flex: 1;
    overflow: hidden;
    min-height: 0;
}

/* DataGrid overrides */
[b-sdbcbyblda] .clientes-grid-container .rz-datatable {
    border: none !important;
    border-radius: var(--pos-radius-sm) !important;
    overflow: hidden;
    font-size: 0.8rem;
}

[b-sdbcbyblda] .clientes-grid-container .rz-datatable-thead > tr > th {
    background: var(--pos-bg) !important;
    color: var(--pos-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    padding: 8px 10px !important;
}

[b-sdbcbyblda] .clientes-grid-container .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
}

[b-sdbcbyblda] .clientes-grid-container .rz-datatable-tbody > tr:hover {
    background-color: var(--pos-primary-light) !important;
}

[b-sdbcbyblda] .clientes-grid-container .rz-datatable-tbody > tr > td {
    padding: 6px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
}

.cliente-text[b-sdbcbyblda] {
    font-size: 0.78rem;
    color: var(--pos-text);
    font-weight: 500;
}

.cliente-select-btn[b-sdbcbyblda] {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--pos-primary);
    color: white;
    border: none;
    border-radius: var(--pos-radius-xs);
    cursor: pointer;
    transition: var(--pos-transition);
    padding: 0;
}

.cliente-select-btn:hover[b-sdbcbyblda] {
    background: var(--pos-primary-dark);
    transform: scale(1.1);
    box-shadow: var(--shadow-md);
}

/* ===== CLIENT DETAIL CARD ===== */
.cliente-detail[b-sdbcbyblda] {
    background: var(--pos-card);
    border: 1px solid var(--pos-border);
    border-radius: var(--pos-radius);
    padding: 20px;
    animation: posClienteDetailIn-b-sdbcbyblda 0.3s ease;
}

.cliente-detail-header[b-sdbcbyblda] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 2px solid var(--pos-primary-light);
}

.cliente-detail-header .rzi[b-sdbcbyblda] {
    font-size: 1.5rem;
    color: var(--pos-primary);
    background: var(--pos-primary-light);
    padding: 8px;
    border-radius: var(--pos-radius-sm);
}

.cliente-detail-header h3[b-sdbcbyblda] {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--pos-text);
    margin: 0;
}

.cliente-fields[b-sdbcbyblda] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.cliente-field[b-sdbcbyblda] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.cliente-field-label[b-sdbcbyblda] {
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--pos-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

[b-sdbcbyblda] .cliente-field .rz-textbox {
    background: var(--pos-bg) !important;
    border: 1px solid var(--pos-border) !important;
    border-radius: var(--pos-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    padding: 0 10px !important;
    color: var(--pos-text) !important;
}

.cliente-detail-footer[b-sdbcbyblda] {
    display: flex;
    justify-content: flex-end;
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid var(--pos-border);
}

.cliente-back-btn[b-sdbcbyblda] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: var(--pos-accent);
    color: white;
    border: none;
    border-radius: var(--pos-radius-sm);
    font-size: 0.8rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--pos-transition);
}

.cliente-back-btn:hover[b-sdbcbyblda] {
    background: var(--pos-accent-dark);
    box-shadow: var(--shadow-md);
}

.cliente-back-btn .rzi[b-sdbcbyblda] {
    font-size: 1rem;
}

@keyframes posClienteDetailIn-b-sdbcbyblda {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 640px) {
    .cliente-fields[b-sdbcbyblda] {
        grid-template-columns: 1fr;
    }

    .cliente-detail[b-sdbcbyblda] {
        padding: 14px;
    }
}
/* /Pages/Pos/Ticket/Componentes/DetalleCarrito.razor.rz.scp.css */
/* ===== DETALLE CARRITO - SCOPED STYLES ===== */

.cart-wrapper[b-4h5df2qjgk] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

/* Table container with internal scroll */
.cart-table-container[b-4h5df2qjgk] {
    flex: 1;
    overflow: hidden;
    min-height: 0;
    border-bottom: 1px solid var(--pos-border);
}

/* Override Radzen DataGrid styles */
[b-4h5df2qjgk] .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

[b-4h5df2qjgk] .rz-datatable-thead > tr > th {
    background: var(--pos-bg) !important;
    color: var(--pos-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    border-bottom: 2px solid var(--pos-border) !important;
    padding: 8px 10px !important;
}

[b-4h5df2qjgk] .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
}

[b-4h5df2qjgk] .rz-datatable-tbody > tr:hover {
    background-color: var(--pos-primary-light) !important;
}

[b-4h5df2qjgk] .rz-datatable-tbody > tr > td {
    padding: 6px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    vertical-align: middle !important;
}

[b-4h5df2qjgk] .rz-pager {
    border-top: 1px solid var(--pos-border) !important;
    padding: 4px 8px !important;
    font-size: 0.75rem !important;
}

/* Qty input */
.cart-qty-input[b-4h5df2qjgk] {
    width: 100%;
    height: 30px;
    background: var(--pos-primary-light);
    border: 1.5px solid transparent;
    border-radius: var(--pos-radius-xs);
    font-size: 0.8rem;
    font-weight: 600;
    text-align: center;
    transition: var(--pos-transition);
}

.cart-qty-input:focus-within[b-4h5df2qjgk] {
    border-color: var(--pos-primary);
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

/* Product name */
.cart-product-name[b-4h5df2qjgk] {
    font-size: 0.78rem;
    color: var(--pos-text);
    font-weight: 500;
    line-height: 1.3;
}

/* Price chip */
.cart-price-chip[b-4h5df2qjgk] {
    display: inline-block;
    font-size: 0.78rem;
    color: var(--pos-text);
    font-weight: 600;
    background: #F0FDFA;
    padding: 3px 8px;
    border-radius: var(--pos-radius-xs);
}

/* Discount input */
.cart-discount-input[b-4h5df2qjgk] {
    width: 80%;
    height: 30px;
    background: var(--pos-accent-light);
    border: 1.5px solid transparent;
    border-radius: var(--pos-radius-xs);
    font-size: 0.8rem;
    font-weight: 600;
    text-align: center;
    transition: var(--pos-transition);
}

.cart-discount-input:focus-within[b-4h5df2qjgk] {
    border-color: var(--pos-accent);
    box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.15);
}

/* Total chip */
.cart-total-chip[b-4h5df2qjgk] {
    display: inline-block;
    font-size: 0.8rem;
    color: var(--pos-primary-dark);
    font-weight: 700;
    background: var(--pos-primary-light);
    padding: 3px 10px;
    border-radius: var(--pos-radius-xs);
}

/* Delete button */
.cart-delete-btn[b-4h5df2qjgk] {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--pos-danger-light);
    color: var(--pos-danger);
    border: none;
    border-radius: var(--pos-radius-xs);
    cursor: pointer;
    transition: var(--pos-transition);
    padding: 0;
}

.cart-delete-btn:hover[b-4h5df2qjgk] {
    background: var(--pos-danger);
    color: white;
    transform: scale(1.1);
}

/* ===== CART FOOTER ===== */
.cart-footer[b-4h5df2qjgk] {
    flex-shrink: 0;
    padding: 12px 16px;
    background: var(--pos-card);
}

.cart-footer-top[b-4h5df2qjgk] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.cart-doc-dropdown[b-4h5df2qjgk] {
    flex: 1;
    min-width: 140px;
}

[b-4h5df2qjgk] .cart-doc-dropdown .rz-dropdown {
    border: 2px solid var(--pos-primary) !important;
    border-radius: var(--pos-radius-sm) !important;
    font-size: 0.8rem !important;
    transition: var(--pos-transition);
}

[b-4h5df2qjgk] .cart-doc-dropdown .rz-dropdown:hover {
    border-color: var(--pos-primary-dark) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
}

/* Botón guardar borrador */
.cart-draft-btn[b-4h5df2qjgk] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 24px;
    background: var(--pos-primary);
    color: white;
    border: none;
    border-radius: var(--pos-radius-sm);
    font-size: 0.85rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--pos-transition);
    white-space: nowrap;
}

.cart-draft-btn:hover:not(:disabled)[b-4h5df2qjgk] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.cart-draft-btn:active:not(:disabled)[b-4h5df2qjgk] {
    transform: translateY(0);
}

.cart-draft-btn:disabled[b-4h5df2qjgk] {
    opacity: 0.4;
    cursor: not-allowed;
    box-shadow: none;
}

.cart-draft-btn .rzi[b-4h5df2qjgk] {
    font-size: 1.2rem;
}

/* Botón pagar */
.cart-pay-btn[b-4h5df2qjgk] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 24px;
    background: var(--pos-accent);
    color: white;
    border: none;
    border-radius: var(--pos-radius-sm);
    font-size: 0.85rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--pos-transition);
    white-space: nowrap;
}

.cart-pay-btn:hover:not(:disabled)[b-4h5df2qjgk] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.cart-pay-btn:active:not(:disabled)[b-4h5df2qjgk] {
    transform: translateY(0);
}

.cart-pay-btn:disabled[b-4h5df2qjgk] {
    opacity: 0.4;
    cursor: not-allowed;
    box-shadow: none;
}

.cart-pay-btn .rzi[b-4h5df2qjgk] {
    font-size: 1.2rem;
}

/* Totals breakdown */
.cart-totals[b-4h5df2qjgk] {
    background: var(--pos-bg);
    border-radius: var(--pos-radius-sm);
    padding: 10px 14px;
}

.cart-total-row[b-4h5df2qjgk] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 3px 0;
    font-size: 0.8rem;
}

.cart-total-label[b-4h5df2qjgk] {
    color: var(--pos-text-secondary);
    font-weight: 500;
}

.cart-total-value[b-4h5df2qjgk] {
    color: var(--pos-text);
    font-weight: 600;
}

.cart-total-discount[b-4h5df2qjgk] {
    color: var(--pos-danger);
    font-weight: 600;
}

.cart-total-divider[b-4h5df2qjgk] {
    border-top: 1.5px solid var(--pos-border);
    margin: 4px 0;
    padding-top: 4px;
}

.cart-total-final .cart-total-label[b-4h5df2qjgk],
.cart-total-final .cart-total-value[b-4h5df2qjgk] {
    font-size: 0.95rem;
    font-weight: 800;
    color: var(--pos-text);
}

/* Vuelto (change) */
/* ===== COBRO RAPIDO EN EL PIE (solo empresa 861005003) =====
   Sin la clase .con-cobro el pie es un bloque normal (.cart-footer-main solo envuelve;
   todo queda a lo ancho, igual que antes para el resto de empresas). */
/* El pie completo pasa a ser una grilla de 3 columnas: [documento | Precuenta | Pagar].
   Los wrappers .cart-footer-top / .cart-footer-bottom se "aplanan" (display: contents) para
   que sus hijos participen de esta misma grilla; asi la botonera 2x2 (fila 2) queda alineada
   EXACTAMENTE bajo Precuenta->Pagar (fila 1), sin numeros magicos. */
.cart-footer.con-cobro[b-4h5df2qjgk] {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 10px;
    align-items: center;
}

.cart-footer.con-cobro .cart-footer-top[b-4h5df2qjgk],
.cart-footer.con-cobro .cart-footer-bottom[b-4h5df2qjgk] {
    display: contents;
}

/* Fila 1: documento | Precuenta | Pagar */
.cart-footer.con-cobro .cart-doc-dropdown[b-4h5df2qjgk] { grid-column: 1; grid-row: 1; }
.cart-footer.con-cobro .cart-draft-btn[b-4h5df2qjgk]    { grid-column: 2; grid-row: 1; }
.cart-footer.con-cobro .cart-pay-btn[b-4h5df2qjgk]      { grid-column: 3; grid-row: 1; }

/* Fila 2: totales (bajo documento, comprimidos) | botonera 2x2 (bajo Precuenta+Pagar) */
.cart-footer.con-cobro .cart-totals[b-4h5df2qjgk] { grid-column: 1; grid-row: 2; }

.cart-footer.con-cobro .cart-cobro-grid[b-4h5df2qjgk] {
    grid-column: 2 / 4;
    grid-row: 2;
    align-self: stretch;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: 1fr;
    gap: 8px;
}

/* Fila 3: vuelto a todo el ancho */
.cart-footer.con-cobro .cart-change[b-4h5df2qjgk] { grid-column: 1 / 4; grid-row: 3; }

.cart-cobro-btn[b-4h5df2qjgk] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 40px;
    border: none;
    border-radius: var(--pos-radius-sm);
    color: #fff;
    font-size: 0.8rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--pos-transition);
}

.cart-cobro-btn .rzi[b-4h5df2qjgk] {
    font-size: 1.1rem;
}

.cart-cobro-btn:hover:not(:disabled)[b-4h5df2qjgk] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.cart-cobro-btn:disabled[b-4h5df2qjgk] {
    opacity: 0.4;
    cursor: not-allowed;
    box-shadow: none;
}

/* Color por medio: Efectivo verde, Clientes azul, Transbank indigo, Otros ambar. */
.cobro-efectivo[b-4h5df2qjgk] { background: var(--pos-success); }
.cobro-efectivo:hover:not(:disabled)[b-4h5df2qjgk] { background: var(--color-success-dark); }
.cobro-clientes[b-4h5df2qjgk] { background: var(--color-info); }
.cobro-transbank[b-4h5df2qjgk] { background: var(--pos-primary); }
.cobro-transbank:hover:not(:disabled)[b-4h5df2qjgk] { background: var(--pos-primary-dark); }
.cobro-otros[b-4h5df2qjgk] { background: var(--pos-accent); }
.cobro-otros:hover:not(:disabled)[b-4h5df2qjgk] { background: var(--pos-accent-dark); }

/* Movil: todo el pie se apila en una sola columna. */
@media (max-width: 640px) {
    .cart-footer.con-cobro[b-4h5df2qjgk] {
        grid-template-columns: 1fr;
    }

    .cart-footer.con-cobro .cart-doc-dropdown[b-4h5df2qjgk],
    .cart-footer.con-cobro .cart-draft-btn[b-4h5df2qjgk],
    .cart-footer.con-cobro .cart-pay-btn[b-4h5df2qjgk],
    .cart-footer.con-cobro .cart-totals[b-4h5df2qjgk],
    .cart-footer.con-cobro .cart-cobro-grid[b-4h5df2qjgk],
    .cart-footer.con-cobro .cart-change[b-4h5df2qjgk] {
        grid-column: 1;
        grid-row: auto;
    }
}

.cart-change[b-4h5df2qjgk] {
    text-align: center;
    margin-top: 8px;
    padding: 6px 12px;
    background: var(--pos-success-light);
    border-radius: var(--pos-radius-sm);
    animation: posBadgePop 0.3s ease;
}

.cart-change span[b-4h5df2qjgk] {
    color: var(--pos-success);
    font-weight: 700;
    font-size: 0.9rem;
}

/* ===== GLOBAL ADJUSTMENTS TOGGLE BAR ===== */
.cart-global-toggle-bar[b-4h5df2qjgk] {
    flex-shrink: 0;
    border-bottom: 1px solid var(--pos-border);
}

.cart-global-toggle-btn[b-4h5df2qjgk] {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    padding: 7px 16px;
    background: var(--pos-bg);
    border: none;
    cursor: pointer;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--pos-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    transition: var(--pos-transition);
}

.cart-global-toggle-btn:hover[b-4h5df2qjgk] {
    background: var(--pos-primary-light);
    color: var(--pos-primary);
}

.cart-global-badge[b-4h5df2qjgk] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    background: var(--pos-primary);
    color: white;
    border-radius: 9px;
    font-size: 0.65rem;
    font-weight: 700;
    line-height: 1;
}

.cart-global-chevron[b-4h5df2qjgk] {
    transition: transform 0.2s ease;
}

.cart-global-chevron-open[b-4h5df2qjgk] {
    transform: rotate(180deg);
}

/* ===== GLOBAL ADJUSTMENTS SECTION ===== */
.cart-global-adjust[b-4h5df2qjgk] {
    flex-shrink: 0;
    padding: 8px 16px;
    border-bottom: 1px solid var(--pos-border);
    background: var(--pos-card);
}

.cart-global-adjust-header[b-4h5df2qjgk] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--pos-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 6px;
}

.cart-global-adjust-form[b-4h5df2qjgk] {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

[b-4h5df2qjgk] .cart-global-adjust-form .rz-dropdown {
    border: 1.5px solid var(--pos-border) !important;
    border-radius: var(--pos-radius-xs) !important;
    font-size: 0.75rem !important;
    height: 32px;
}

.cart-global-input[b-4h5df2qjgk] {
    width: 80px;
    height: 32px;
    background: var(--pos-bg);
    border: 1.5px solid var(--pos-border);
    border-radius: var(--pos-radius-xs);
    font-size: 0.8rem;
    font-weight: 600;
    text-align: center;
    transition: var(--pos-transition);
}

.cart-global-input:focus-within[b-4h5df2qjgk] {
    border-color: var(--pos-primary);
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

.cart-global-add-btn[b-4h5df2qjgk] {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--pos-success);
    color: white;
    border: none;
    border-radius: var(--pos-radius-xs);
    cursor: pointer;
    transition: var(--pos-transition);
    padding: 0;
    flex-shrink: 0;
}

.cart-global-add-btn:hover:not(:disabled)[b-4h5df2qjgk] {
    transform: scale(1.1);
    box-shadow: var(--shadow-md);
}

.cart-global-add-btn:disabled[b-4h5df2qjgk] {
    opacity: 0.4;
    cursor: not-allowed;
}

.cart-global-adjust-list[b-4h5df2qjgk] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 6px;
}

.cart-global-adjust-item[b-4h5df2qjgk] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 8px;
    border-radius: var(--pos-radius-xs);
    font-size: 0.75rem;
    font-weight: 500;
    animation: posBadgePop 0.2s ease;
}

.cart-global-descuento[b-4h5df2qjgk] {
    background: #FEF2F2;
    color: #DC2626;
}

.cart-global-recargo[b-4h5df2qjgk] {
    background: #F0FDF4;
    color: #16A34A;
}

.cart-global-adjust-desc[b-4h5df2qjgk] {
    flex: 1;
}

.cart-global-remove-btn[b-4h5df2qjgk] {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    color: inherit;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    opacity: 0.6;
    transition: var(--pos-transition);
    padding: 0;
}

.cart-global-remove-btn:hover[b-4h5df2qjgk] {
    opacity: 1;
    background: rgba(0, 0, 0, 0.1);
}

/* Recargos row in totals */
.cart-total-surcharge[b-4h5df2qjgk] {
    color: var(--pos-success);
    font-weight: 600;
}

/* ===== BOTÓN AGREGAR AJUSTE (dentro de sección colapsable) ===== */
.cart-global-open-modal-btn[b-4h5df2qjgk] {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    padding: 6px 10px;
    margin-bottom: 6px;
    background: var(--pos-primary-light);
    color: var(--pos-primary);
    border: 1.5px dashed var(--pos-primary);
    border-radius: var(--pos-radius-xs);
    cursor: pointer;
    font-size: 0.75rem;
    font-weight: 600;
    transition: var(--pos-transition);
}

.cart-global-open-modal-btn:hover[b-4h5df2qjgk] {
    background: var(--pos-primary);
    color: white;
}

/* Glosa dentro de la lista de ajustes */
.cart-global-adjust-glosa[b-4h5df2qjgk] {
    font-style: italic;
    opacity: 0.75;
    font-size: 0.7rem;
}

/* ===== MODAL AJUSTE GLOBAL ===== */
.cart-modal-overlay[b-4h5df2qjgk] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    animation: cartModalFadeIn-b-4h5df2qjgk 0.2s ease;
}

@keyframes cartModalFadeIn-b-4h5df2qjgk {
    from { opacity: 0; }
    to { opacity: 1; }
}

.cart-modal[b-4h5df2qjgk] {
    background: var(--pos-card, #fff);
    border-radius: var(--pos-radius-md, 12px);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
    width: 380px;
    max-width: 90vw;
    overflow: hidden;
    animation: cartModalSlideUp-b-4h5df2qjgk 0.25s ease;
}

@keyframes cartModalSlideUp-b-4h5df2qjgk {
    from { transform: translateY(20px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

.cart-modal-header[b-4h5df2qjgk] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 18px;
    background: var(--pos-bg, #f8fafc);
    border-bottom: 1px solid var(--pos-border, #e2e8f0);
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--pos-text, #1e293b);
}

.cart-modal-close-btn[b-4h5df2qjgk] {
    margin-left: auto;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    border-radius: var(--pos-radius-xs);
    cursor: pointer;
    color: var(--pos-text-secondary);
    transition: var(--pos-transition);
    padding: 0;
}

.cart-modal-close-btn:hover[b-4h5df2qjgk] {
    background: var(--pos-danger-light);
    color: var(--pos-danger);
}

.cart-modal-body[b-4h5df2qjgk] {
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.cart-modal-field[b-4h5df2qjgk] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.cart-modal-label[b-4h5df2qjgk] {
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--pos-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.cart-modal-row[b-4h5df2qjgk] {
    display: flex;
    gap: 10px;
    align-items: flex-end;
}

[b-4h5df2qjgk] .cart-modal-body .rz-dropdown {
    border: 1.5px solid var(--pos-border) !important;
    border-radius: var(--pos-radius-xs) !important;
    height: 36px;
}

[b-4h5df2qjgk] .cart-modal-body .rz-spinner {
    border: 1.5px solid var(--pos-border) !important;
    border-radius: var(--pos-radius-xs) !important;
    height: 36px;
}

[b-4h5df2qjgk] .cart-modal-body .rz-textbox {
    border: 1.5px solid var(--pos-border) !important;
    border-radius: var(--pos-radius-xs) !important;
    height: 36px;
    padding: 0 10px;
}

.cart-modal-footer[b-4h5df2qjgk] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 12px 18px;
    border-top: 1px solid var(--pos-border, #e2e8f0);
    background: var(--pos-bg, #f8fafc);
}

.cart-modal-cancel-btn[b-4h5df2qjgk] {
    padding: 8px 16px;
    background: var(--color-secondary);
    border: none;
    border-radius: var(--pos-radius-sm);
    font-size: 0.8rem;
    font-weight: 600;
    color: #fff;
    cursor: pointer;
    transition: var(--pos-transition);
}

.cart-modal-cancel-btn:hover[b-4h5df2qjgk] {
    background: var(--color-secondary-dark);
    color: #fff;
}

.cart-modal-confirm-btn[b-4h5df2qjgk] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 18px;
    background: var(--pos-success);
    color: white;
    border: none;
    border-radius: var(--pos-radius-sm);
    font-size: 0.8rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--pos-transition);
}

.cart-modal-confirm-btn:hover:not(:disabled)[b-4h5df2qjgk] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.cart-modal-confirm-btn:disabled[b-4h5df2qjgk] {
    opacity: 0.4;
    cursor: not-allowed;
    box-shadow: none;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .cart-footer-top[b-4h5df2qjgk] {
        flex-wrap: wrap;
    }
}

@media (max-width: 640px) {
    .cart-footer[b-4h5df2qjgk] {
        padding: 10px 12px;
    }

    .cart-pay-btn[b-4h5df2qjgk] {
        width: 100%;
        justify-content: center;
        padding: 10px;
    }
}
/* /Pages/Pos/Ticket/Componentes/ModalBalanza.razor.rz.scp.css */
/* ===== MODAL BALANZA - SCOPED STYLES ===== */

.bal-overlay[b-zl24pvh8vd] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(6px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1100;
    padding: 1rem;
}

.bal-modal[b-zl24pvh8vd] {
    background: var(--pos-card, #FFFFFF);
    border-radius: 16px;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    width: 100%;
    max-width: 360px;
    overflow: hidden;
}

.bal-header[b-zl24pvh8vd] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px 20px;
    background: linear-gradient(135deg, #EEF2FF 0%, #FFFFFF 100%);
    border-bottom: 1px solid #E2E8F0;
}

.bal-header .rzi[b-zl24pvh8vd] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: #6366F1;
    color: white;
    border-radius: 10px;
    font-size: 1.2rem;
}

.bal-header h3[b-zl24pvh8vd] {
    font-size: 1rem;
    font-weight: 700;
    color: #1E293B;
    margin: 0;
}

.bal-body[b-zl24pvh8vd] {
    padding: 24px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

.bal-producto[b-zl24pvh8vd] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #475569;
    text-align: center;
}

.bal-peso[b-zl24pvh8vd] {
    font-size: 3.25rem;
    font-weight: 800;
    color: #2563EB;
    line-height: 1;
    letter-spacing: 1px;
}

/* Input wedge: presente y enfocable, pero practicamente invisible
   (el operador lee el peso en .bal-peso, igual que en el POS viejo). */
.bal-input[b-zl24pvh8vd] {
    width: 1px;
    height: 1px;
    opacity: 0;
    border: 0;
    padding: 0;
    margin: 0;
    position: absolute;
}

.bal-footer[b-zl24pvh8vd] {
    display: flex;
    gap: 10px;
    padding: 14px 20px;
    border-top: 1px solid #E2E8F0;
    justify-content: flex-end;
}

.bal-btn[b-zl24pvh8vd] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: none;
    border-radius: 10px;
    padding: 10px 16px;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: filter 0.15s ease;
}

.bal-btn:hover[b-zl24pvh8vd] { filter: brightness(0.95); }

.bal-btn-add[b-zl24pvh8vd] {
    background: #6366F1;
    color: white;
}

.bal-btn-add:disabled[b-zl24pvh8vd] {
    opacity: 0.5;
    cursor: not-allowed;
}

.bal-btn-cancel[b-zl24pvh8vd] {
    background: var(--color-secondary);
    color: #fff;
}
/* /Pages/Pos/Ticket/Componentes/ModalEscanear.razor.rz.scp.css */
/* ===== MODAL ESCANEAR - SCOPED STYLES ===== */

.scan-overlay[b-xk9x5u2ejj] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(6px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1100;
    padding: 1rem;
    animation: posScanOverlayIn-b-xk9x5u2ejj 0.2s ease;
}

.scan-modal[b-xk9x5u2ejj] {
    background: var(--pos-card, #FFFFFF);
    border-radius: 16px;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    width: 100%;
    max-width: 520px;
    overflow: hidden;
    animation: posScanModalIn-b-xk9x5u2ejj 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.scan-header[b-xk9x5u2ejj] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px 20px;
    background: linear-gradient(135deg, #EEF2FF 0%, #FFFFFF 100%);
    border-bottom: 1px solid #E2E8F0;
}

.scan-header-icon[b-xk9x5u2ejj] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: #6366F1;
    color: white;
    border-radius: 10px;
    font-size: 1.2rem;
}

.scan-header h3[b-xk9x5u2ejj] {
    font-size: 1rem;
    font-weight: 700;
    color: #1E293B;
    margin: 0;
}

.scan-body[b-xk9x5u2ejj] {
    padding: 20px;
}

/* Scanner input */
.scan-input-wrapper[b-xk9x5u2ejj] {
    position: relative;
    margin-bottom: 16px;
}

.scan-input-icon[b-xk9x5u2ejj] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #94A3B8;
    font-size: 1.2rem;
    z-index: 1;
}

[b-xk9x5u2ejj] .scan-input-wrapper .rz-textbox {
    width: 100% !important;
    padding-left: 40px !important;
    height: 44px !important;
    border: 2px solid #E2E8F0 !important;
    border-radius: 10px !important;
    font-size: 0.95rem !important;
    transition: all 0.2s ease;
}

[b-xk9x5u2ejj] .scan-input-wrapper .rz-textbox:focus {
    border-color: #6366F1 !important;
    box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.15) !important;
}

/* Product found card */
.scan-product-card[b-xk9x5u2ejj] {
    display: flex;
    gap: 16px;
    padding: 16px;
    background: #F8FAFC;
    border: 1px solid #E2E8F0;
    border-radius: 12px;
    animation: posScanProductIn-b-xk9x5u2ejj 0.3s ease;
}

.scan-product-info[b-xk9x5u2ejj] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.scan-product-row[b-xk9x5u2ejj] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.scan-product-label[b-xk9x5u2ejj] {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    min-width: 60px;
}

.scan-product-value[b-xk9x5u2ejj] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1E293B;
}

.scan-product-image[b-xk9x5u2ejj] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.scan-product-img[b-xk9x5u2ejj] {
    width: 100px;
    height: 100px;
    object-fit: cover;
    border-radius: 10px;
    border: 2px solid #E2E8F0;
}

/* Not found message */
.scan-not-found[b-xk9x5u2ejj] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    background: #FEE2E2;
    border-radius: 10px;
    color: #EF4444;
    font-size: 0.85rem;
    font-weight: 600;
    animation: posScanProductIn-b-xk9x5u2ejj 0.3s ease;
}

.scan-not-found .rzi[b-xk9x5u2ejj] {
    font-size: 1.2rem;
}

/* Footer buttons */
.scan-footer[b-xk9x5u2ejj] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 14px 20px;
    border-top: 1px solid #E2E8F0;
    background: #F8FAFC;
}

.scan-btn[b-xk9x5u2ejj] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: 8px;
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s ease;
}

.scan-btn-add[b-xk9x5u2ejj] {
    background: #F59E0B;
    color: white;
}

.scan-btn-add:hover:not(:disabled)[b-xk9x5u2ejj] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.scan-btn-add:disabled[b-xk9x5u2ejj] {
    opacity: 0.4;
    cursor: not-allowed;
    box-shadow: none;
}

.scan-btn-close[b-xk9x5u2ejj] {
    background: var(--color-secondary);
    color: #fff;
    border: none;
}

.scan-btn-close:hover[b-xk9x5u2ejj] {
    background: var(--color-secondary-dark);
    color: #fff;
}

.scan-btn .rzi[b-xk9x5u2ejj] {
    font-size: 1rem;
}

/* ===== ANIMATIONS ===== */
@keyframes posScanOverlayIn-b-xk9x5u2ejj {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes posScanModalIn-b-xk9x5u2ejj {
    from { opacity: 0; transform: scale(0.9) translateY(16px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}

@keyframes posScanProductIn-b-xk9x5u2ejj {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 640px) {
    .scan-modal[b-xk9x5u2ejj] {
        max-width: 100%;
    }

    .scan-product-card[b-xk9x5u2ejj] {
        flex-direction: column;
        align-items: center;
    }

    .scan-product-img[b-xk9x5u2ejj] {
        width: 80px;
        height: 80px;
    }
}
/* /Pages/Pos/Ticket/Componentes/PagoOtrosModal.razor.rz.scp.css */
.otros-overlay[b-gmunyj8v3b] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1100;
}

.otros-modal[b-gmunyj8v3b] {
    background: #fff;
    width: 420px;
    max-width: 92vw;
    max-height: 88vh;
    border-radius: 12px;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.35);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.otros-header[b-gmunyj8v3b] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 18px;
    background: #2c3e50;
    color: #fff;
}

.otros-header h3[b-gmunyj8v3b] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
}

.otros-body[b-gmunyj8v3b] {
    padding: 16px 18px;
    overflow-y: auto;
}

.otros-empty[b-gmunyj8v3b] {
    color: #7f8c8d;
    font-size: 0.9rem;
    text-align: center;
    padding: 20px 0;
}

.otros-list[b-gmunyj8v3b] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 14px;
}

.otros-item[b-gmunyj8v3b] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border: 1px solid #d8e2ea;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.9rem;
}

.otros-item:hover[b-gmunyj8v3b] {
    background: #f2f7fb;
}

.otros-item-sel[b-gmunyj8v3b] {
    border-color: #66CC66;
    background: #eafaea;
}

.otros-field[b-gmunyj8v3b] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.otros-label[b-gmunyj8v3b] {
    font-size: 0.8rem;
    color: #555;
}

.otros-credito[b-gmunyj8v3b] {
    margin-top: 14px;
    padding: 10px 12px;
    background: #f6fbf6;
    border: 1px solid #cdeccd;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.otros-credito-row[b-gmunyj8v3b] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.otros-credito-val[b-gmunyj8v3b] {
    font-weight: 700;
    color: #2e7d32;
    font-size: 0.95rem;
}

.otros-check[b-gmunyj8v3b] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
    font-size: 0.9rem;
    cursor: pointer;
}

.otros-error[b-gmunyj8v3b] {
    margin-top: 12px;
    padding: 8px 10px;
    background: #fdecea;
    border: 1px solid #f5b7b1;
    border-radius: 6px;
    color: #c0392b;
    font-size: 0.85rem;
}

.otros-footer[b-gmunyj8v3b] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 12px 18px;
    border-top: 1px solid #eee;
}

.otros-btn[b-gmunyj8v3b] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.88rem;
    color: #fff;
}

.otros-btn:disabled[b-gmunyj8v3b] {
    opacity: 0.5;
    cursor: not-allowed;
}

.otros-btn-pagar[b-gmunyj8v3b] {
    background: #66CC66;
}

.otros-btn-cerrar[b-gmunyj8v3b] {
    background: #e74c3c;
}
/* /Pages/Pos/Ticket/Componentes/PagosTab.razor.rz.scp.css */
/* ===== PAGOS TAB - SCOPED STYLES ===== */

.pagos-wrapper[b-lltsttno6s] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

/* ===== PAYMENT FORM ===== */
.pagos-form[b-lltsttno6s] {
    flex-shrink: 0;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--pos-border);
    margin-bottom: 12px;
}

.pagos-form-row[b-lltsttno6s] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 12px;
}

.pagos-field[b-lltsttno6s] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.pagos-field-label[b-lltsttno6s] {
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--pos-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

[b-lltsttno6s] .pagos-field .rz-dropdown {
    width: 100% !important;
    border: 1.5px solid var(--pos-border) !important;
    border-radius: var(--pos-radius-xs) !important;
    font-size: 0.85rem !important;
    transition: var(--pos-transition);
}

[b-lltsttno6s] .pagos-field .rz-dropdown:hover,
[b-lltsttno6s] .pagos-field .rz-dropdown:focus-within {
    border-color: var(--pos-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.12) !important;
}

[b-lltsttno6s] .pagos-field .rz-spinner {
    width: 100% !important;
    border: 1.5px solid var(--pos-border) !important;
    border-radius: var(--pos-radius-xs) !important;
    height: 36px !important;
    transition: var(--pos-transition);
}

[b-lltsttno6s] .pagos-field .rz-spinner:focus-within {
    border-color: var(--pos-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.12) !important;
}

.pagos-confirm-row[b-lltsttno6s] {
    display: flex;
    justify-content: flex-end;
}

.pagos-confirm-btn[b-lltsttno6s] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: var(--pos-accent);
    color: white;
    border: none;
    border-radius: var(--pos-radius-sm);
    font-size: 0.85rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--pos-transition);
}

.pagos-confirm-btn:hover:not(:disabled)[b-lltsttno6s] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.pagos-confirm-btn:disabled[b-lltsttno6s] {
    opacity: 0.4;
    cursor: not-allowed;
    box-shadow: none;
}

.pagos-confirm-btn .rzi[b-lltsttno6s] {
    font-size: 1.1rem;
}

/* ===== PAYMENT LIST ===== */
.pagos-list-header[b-lltsttno6s] {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--pos-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 8px;
}

.pagos-list[b-lltsttno6s] {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.pago-item[b-lltsttno6s] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    background: var(--pos-bg);
    border-radius: var(--pos-radius-sm);
    border-left: 3px solid var(--pos-primary);
    transition: var(--pos-transition);
    animation: posPagoItemIn-b-lltsttno6s 0.3s ease;
}

.pago-item:hover[b-lltsttno6s] {
    background: var(--pos-primary-light);
}

.pago-item-method[b-lltsttno6s] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--pos-text);
}

.pago-item-method .rzi[b-lltsttno6s] {
    font-size: 1rem;
    color: var(--pos-primary);
    vertical-align: middle;
    margin-right: 4px;
}

.pago-item-total[b-lltsttno6s] {
    font-size: 0.9rem;
    font-weight: 800;
    color: var(--pos-primary-dark);
}

/* ===== TOTAL PAID ===== */
.pagos-total[b-lltsttno6s] {
    flex-shrink: 0;
    padding: 10px 14px;
    margin-top: 10px;
    background: var(--pos-primary-light);
    border-radius: var(--pos-radius-sm);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.pagos-total-label[b-lltsttno6s] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--pos-text);
}

.pagos-total-value[b-lltsttno6s] {
    font-size: 1rem;
    font-weight: 800;
    color: var(--pos-primary-dark);
}

@keyframes posPagoItemIn-b-lltsttno6s {
    from { opacity: 0; transform: translateX(-10px); }
    to { opacity: 1; transform: translateX(0); }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 640px) {
    .pagos-form-row[b-lltsttno6s] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Pos/Ticket/Componentes/ProductosTab.razor.rz.scp.css */
/* ===== ESTILOS DE PRODUCTOSTAB (scoped) ===== */

/* Contenedor principal - usa flexbox vertical para distribuir toolbar, header y contenido */
.productos-wrapper[b-76m315k1lc] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

/* ===== BARRA DE HERRAMIENTAS SUPERIOR ===== */

/* Contenedor de los botones de la barra de herramientas */
.productos-toolbar[b-76m315k1lc] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 12px;
    flex-shrink: 0;
}

/* Estilo base para todos los botones de la barra de herramientas */
.productos-toolbar-btn[b-76m315k1lc] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 12px;
    border: none;
    border-radius: var(--pos-radius-xs);
    font-size: 0.75rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--pos-transition);
    white-space: nowrap;
}

/* Tamano del icono dentro de los botones */
.productos-toolbar-btn .rzi[b-76m315k1lc] {
    font-size: 1rem;
}

/* Efecto hover: elevacion sutil */
.productos-toolbar-btn:hover[b-76m315k1lc] {
    transform: translateY(-1px);
    box-shadow: var(--pos-shadow-md);
}

/* Efecto al presionar: vuelve a su posicion */
.productos-toolbar-btn:active[b-76m315k1lc] {
    transform: translateY(0);
}

/* --- Colores especificos de cada boton --- */

/* Boton "Nuevo producto" */
.btn-add-product[b-76m315k1lc] {
    background: var(--pos-primary);
    color: white;
}

/* Boton "Vista tabla" y "Volver" */
.btn-view-table[b-76m315k1lc] {
    background: var(--pos-success);
    color: white;
}

/* Boton "Vista imagenes" y "Limpiar" */
.btn-view-images[b-76m315k1lc] {
    background: #0EA5E9;
    color: white;
}

/* Boton "Vista categorias" y "Agregar" */
.btn-view-categories[b-76m315k1lc] {
    background: var(--pos-accent);
    color: white;
}

/* Boton "Escanear" (teal, distinto del naranja de "Categorias") */
.btn-scan[b-76m315k1lc] {
    background: #14B8A6;
    color: white;
}

.btn-scan:hover[b-76m315k1lc] {
    background: #0D9488;
}

/* Boton "Borrador" (reservado para uso futuro) */
.btn-draft[b-76m315k1lc] {
    background: #06B6D4;
    color: white;
}

/* ===== AREA DE CONTENIDO DE PRODUCTOS ===== */

/* Contenedor flexible que ocupa el espacio restante con scroll vertical */
.productos-content[b-76m315k1lc] {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

/* ===== SOBREESCRITURAS DE ESTILOS DEL DATAGRID DE RADZEN ===== */

/* Hace que la grilla ocupe todo el espacio disponible */
[b-76m315k1lc] .productos-content .rz-data-grid {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

/* Elimina bordes y aplica bordes redondeados a la tabla */
[b-76m315k1lc] .productos-content .rz-datatable {
    border: none !important;
    border-radius: var(--pos-radius-sm) !important;
    overflow: hidden;
    font-size: 0.8rem;
}

/* Permite scroll interno en el cuerpo de la tabla */
[b-76m315k1lc] .productos-content .rz-data-grid .rz-datatable-scrollable-wrapper {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

/* Estilo de los encabezados de columna */
[b-76m315k1lc] .productos-content .rz-datatable-thead > tr > th {
    background: var(--pos-bg) !important;
    color: var(--pos-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    padding: 8px 10px !important;
}

/* Transicion suave al hacer hover en las filas */
[b-76m315k1lc] .productos-content .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
}

/* Color de fondo al pasar el mouse sobre una fila */
[b-76m315k1lc] .productos-content .rz-datatable-tbody > tr:hover {
    background-color: var(--pos-primary-light) !important;
}

/* Espaciado y borde inferior de las celdas */
[b-76m315k1lc] .productos-content .rz-datatable-tbody > tr > td {
    padding: 6px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
}

/* Estilo del texto de nombre/ID en la tabla */
.prod-name-text[b-76m315k1lc] {
    font-size: 0.78rem;
    color: var(--pos-text);
    font-weight: 500;
}

/* Estilo del texto de precio en la tabla (con fondo destacado) */
.prod-price-text[b-76m315k1lc] {
    font-size: 0.78rem;
    font-weight: 600;
    background: #F0FDFA;
    padding: 3px 8px;
    border-radius: var(--pos-radius-xs);
    text-align: right;
}

/* Boton circular para agregar producto desde la tabla */
.prod-add-btn[b-76m315k1lc] {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--pos-primary);
    color: white;
    border: none;
    border-radius: var(--pos-radius-xs);
    cursor: pointer;
    transition: var(--pos-transition);
    padding: 0;
}

/* Efecto hover del boton agregar: escala y sombra */
.prod-add-btn:hover[b-76m315k1lc] {
    background: var(--pos-primary-dark);
    transform: scale(1.15);
    box-shadow: var(--shadow-md);
}

/* ===== VISTA DE IMAGENES (TARJETAS) ===== */

/* Grilla responsive de tarjetas de producto */
.productos-image-grid[b-76m315k1lc] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
    gap: 10px;
    padding: 4px;
}

/* Tarjeta individual de producto */
.producto-card[b-76m315k1lc] {
    background: var(--pos-card);
    border: 1px solid var(--pos-border);
    border-radius: var(--pos-radius-sm);
    padding: 12px 10px;
    text-align: center;
    cursor: pointer;
    transition: var(--pos-transition);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

/* Efecto hover: elevacion y borde resaltado */
.producto-card:hover[b-76m315k1lc] {
    transform: translateY(-3px);
    box-shadow: var(--pos-shadow-md);
    border-color: var(--pos-primary);
}

/* Efecto al presionar */
.producto-card:active[b-76m315k1lc] {
    transform: translateY(-1px);
}

/* Imagen del producto en la tarjeta */
.producto-card-img[b-76m315k1lc] {
    width: 60px;
    height: 60px;
    object-fit: cover;
    border-radius: var(--pos-radius-xs);
}

/* Nombre del producto en la tarjeta (maximo 2 lineas con truncamiento) */
.producto-card-name[b-76m315k1lc] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--pos-text);
    background: var(--pos-bg);
    padding: 3px 6px;
    border-radius: 4px;
    width: 100%;
    line-height: 1.3;
    /* Reserva siempre el alto de 2 lineas (1.3em x 2) aunque el texto ocupe 1 sola,
       para que el precio quede a la misma altura en todas las tarjetas */
    min-height: 2.6em;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* Precio del producto en la tarjeta (badge con gradiente) */
.producto-card-price[b-76m315k1lc] {
    font-size: 0.75rem;
    font-weight: 700;
    color: white;
    background: linear-gradient(135deg, var(--pos-accent) 0%, var(--pos-accent-dark) 100%);
    padding: 3px 10px;
    border-radius: 20px;
    width: 100%;
}

/* ===== ENCABEZADO DE SECCION (vistas tabla e imagenes) ===== */

/* Barra con contador de productos y boton limpiar filtros */
.section-header[b-76m315k1lc] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 2px 4px 6px;
    flex-shrink: 0;
}

/* Campo de busqueda por nombre de producto */
.search-producto-input[b-76m315k1lc] {
    flex: 1;
    min-width: 0;
    padding: 4px 8px;
    font-size: 0.75rem;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: var(--pos-radius-xs);
    background: var(--pos-card-bg, #fff);
    color: var(--pos-text);
    outline: none;
    transition: var(--pos-transition);
}

.search-producto-input[b-76m315k1lc]::placeholder {
    color: var(--pos-text-muted);
}

.search-producto-input:focus[b-76m315k1lc] {
    border-color: var(--pos-primary);
    box-shadow: 0 0 0 2px var(--pos-primary-light, rgba(59,130,246,0.15));
}

/* Boton de limpiar filtros (estilo texto, sin fondo) */
.btn-clear-filters[b-76m315k1lc] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--color-limpiar);
    border: none;
    color: #fff;
    font-size: 0.7rem;
    font-weight: 600;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: var(--pos-radius-xs);
    transition: var(--pos-transition);
}

/* Tamano del icono en el boton limpiar filtros */
.btn-clear-filters .rzi[b-76m315k1lc] {
    font-size: 0.85rem;
}

/* Efecto hover del boton limpiar filtros */
.btn-clear-filters:hover[b-76m315k1lc] {
    color: #fff;
    background: var(--color-limpiar-dark);
}

/* Boton "Limpiar" del pie de la vista de categorias: solido plomo unificado */
.btn-limpiar-cat[b-76m315k1lc] {
    background: var(--color-limpiar);
    color: #fff;
}

.btn-limpiar-cat:hover:not(:disabled)[b-76m315k1lc] {
    background: var(--color-limpiar-dark);
}

/* ===== VISTA DE CATEGORIAS ===== */

/* Grilla de categorias (no se usa actualmente, reservado) */
.categorias-grid[b-76m315k1lc] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 8px;
    margin-top: 8px;
}

/* Columna individual de la jerarquia (Categorias, Familias, Clases o Subclases) */
.categorias-column[b-76m315k1lc] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* Titulo de cada columna de la jerarquia */
.categorias-column-title[b-76m315k1lc] {
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--pos-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding-bottom: 4px;
    border-bottom: 2px solid var(--pos-border);
    margin-bottom: 2px;
}

/* Boton de categoria/familia/clase/subclase */
.cat-btn[b-76m315k1lc] {
    display: block;
    width: 100%;
    padding: 7px 14px;
    border: none;
    border-radius: var(--pos-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--pos-transition);
    text-align: left;
    color: white;
}

/* Efecto hover: desplazamiento horizontal sutil */
.cat-btn:hover[b-76m315k1lc] {
    transform: translateX(3px);
    box-shadow: var(--pos-shadow);
}

/* Estado activo/seleccionado: borde doble (blanco + verde) */
.cat-btn-active[b-76m315k1lc] {
    box-shadow: 0 0 0 2px white, 0 0 0 4px var(--pos-success);
}

/* Contenedor flex de la vista de categorias (scroll arriba, footer fijo abajo) */
.categorias-view[b-76m315k1lc] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

/* Zona scrollable donde se muestran las columnas de categorias */
.categorias-scroll[b-76m315k1lc] {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
}

/* Pie fijo de la vista de categorias (contador + botones Limpiar y Volver) */
.categorias-footer[b-76m315k1lc] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--pos-border);
    flex-shrink: 0;
}

/* Texto del contador de productos encontrados */
.categorias-count[b-76m315k1lc] {
    font-size: 0.75rem;
    color: var(--pos-text-secondary);
    font-weight: 500;
}

/* ===== FORMULARIO DE NUEVO PRODUCTO ===== */

/* Contenedor del formulario centrado con sombra */
.nuevo-producto-form[b-76m315k1lc] {
    max-width: 380px;
    margin: 20px auto;
    background: var(--pos-card);
    border: 1px solid var(--pos-border);
    border-radius: var(--pos-radius);
    padding: 24px;
    box-shadow: var(--pos-shadow-md);
}

/* Titulo del formulario */
.nuevo-producto-form h3[b-76m315k1lc] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--pos-text);
    margin: 0 0 16px 0;
    text-align: center;
}

/* Grupo de campo del formulario (label + input) */
.form-field[b-76m315k1lc] {
    margin-bottom: 12px;
}

/* Etiqueta del campo del formulario */
.form-label[b-76m315k1lc] {
    display: block;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--pos-text-secondary);
    margin-bottom: 4px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Sobreescritura de estilos de inputs de Radzen dentro del formulario */
[b-76m315k1lc] .nuevo-producto-form .rz-textbox,
[b-76m315k1lc] .nuevo-producto-form .rz-spinner,
[b-76m315k1lc] .nuevo-producto-form .rz-dropdown {
    width: 100% !important;
    border-radius: var(--pos-radius-xs) !important;
    border: 1.5px solid var(--pos-border) !important;
    transition: var(--pos-transition);
}

/* Estado de foco en los inputs del formulario (borde y sombra azul) */
[b-76m315k1lc] .nuevo-producto-form .rz-textbox:focus,
[b-76m315k1lc] .nuevo-producto-form .rz-spinner:focus-within,
[b-76m315k1lc] .nuevo-producto-form .rz-dropdown:focus-within {
    border-color: var(--pos-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

/* Contenedor de los botones de accion del formulario (Volver y Agregar) */
.form-actions[b-76m315k1lc] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 16px;
}

/* ===== RESPONSIVO (pantallas menores a 640px) ===== */
@media (max-width: 640px) {
    /* Reduce espaciado en la barra de herramientas */
    .productos-toolbar[b-76m315k1lc] {
        gap: 4px;
    }

    /* Reduce tamano de los botones */
    .productos-toolbar-btn[b-76m315k1lc] {
        padding: 5px 8px;
        font-size: 0.7rem;
    }

    /* Oculta el texto de los botones, dejando solo el icono */
    .productos-toolbar-btn span:not(.rzi)[b-76m315k1lc] {
        display: none;
    }

    /* Reduce tamano minimo de las tarjetas en la grilla de imagenes */
    .productos-image-grid[b-76m315k1lc] {
        grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
        gap: 6px;
    }
}

/* ===== ESTADO DESHABILITADO PARA TARJETAS DE PRODUCTO ===== */
.producto-card-disabled[b-76m315k1lc] {
    opacity: 0.5;
    pointer-events: none;
    cursor: not-allowed;
}

.cat-btn .rzi[b-76m315k1lc] {
    font-size: 1rem;
}
/* /Pages/Pos/Ticket/Componentes/ResumenTab.razor.rz.scp.css */
/* ===== RESUMEN TAB - SCOPED STYLES ===== */

.resumen-wrapper[b-ru2h00bsxr] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

.resumen-card[b-ru2h00bsxr] {
    background: var(--pos-card);
    border: 1px solid var(--pos-border);
    border-radius: var(--pos-radius);
    padding: 20px;
    animation: posResumenIn-b-ru2h00bsxr 0.35s ease;
}

.resumen-header[b-ru2h00bsxr] {
    text-align: center;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 2px solid var(--pos-primary-light);
}

.resumen-header h2[b-ru2h00bsxr] {
    font-size: 1rem;
    font-weight: 800;
    color: var(--pos-text);
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.resumen-header .rzi[b-ru2h00bsxr] {
    color: var(--pos-primary);
    font-size: 1.3rem;
}

/* ===== INFO ROWS ===== */
.resumen-info-row[b-ru2h00bsxr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px dashed var(--pos-border);
}

.resumen-info-row:last-child[b-ru2h00bsxr] {
    border-bottom: none;
}

.resumen-info-label[b-ru2h00bsxr] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--pos-text-secondary);
}

.resumen-info-value[b-ru2h00bsxr] {
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--pos-text);
}

/* ===== TOTALS BREAKDOWN ===== */
.resumen-totals[b-ru2h00bsxr] {
    background: var(--pos-bg);
    border-radius: var(--pos-radius-sm);
    padding: 14px;
    margin-top: 12px;
}

.resumen-totals-title[b-ru2h00bsxr] {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--pos-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 8px;
}

.resumen-total-row[b-ru2h00bsxr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 3px 0;
    font-size: 0.78rem;
}

.resumen-total-label[b-ru2h00bsxr] {
    color: var(--pos-text-secondary);
    font-weight: 500;
}

.resumen-total-value[b-ru2h00bsxr] {
    color: var(--pos-text);
    font-weight: 700;
}

.resumen-total-discount[b-ru2h00bsxr] {
    color: var(--pos-danger);
    font-weight: 700;
}

.resumen-total-divider[b-ru2h00bsxr] {
    border-top: 1.5px solid var(--pos-border);
    margin: 6px 0;
    padding-top: 6px;
}

.resumen-total-final[b-ru2h00bsxr] {
    font-size: 0.9rem;
}

.resumen-total-final .resumen-total-label[b-ru2h00bsxr],
.resumen-total-final .resumen-total-value[b-ru2h00bsxr] {
    font-weight: 800;
    color: var(--pos-text);
    font-size: 0.95rem;
}

/* ===== ACTION FOOTER ===== */
.resumen-footer[b-ru2h00bsxr] {
    display: flex;
    justify-content: flex-end;
    margin-top: 20px;
    padding-top: 14px;
    border-top: 1px solid var(--pos-border);
}

.resumen-grabar-btn[b-ru2h00bsxr] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 28px;
    background: var(--pos-success);
    color: white;
    border: none;
    border-radius: var(--pos-radius-sm);
    font-size: 0.9rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--pos-transition);
}

.resumen-grabar-btn:hover:not(:disabled)[b-ru2h00bsxr] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.resumen-grabar-btn:disabled[b-ru2h00bsxr] {
    opacity: 0.4;
    cursor: not-allowed;
    box-shadow: none;
}

.resumen-grabar-btn .rzi[b-ru2h00bsxr] {
    font-size: 1.2rem;
}

/* ===== LOADING SPINNER ===== */
.resumen-loading[b-ru2h00bsxr] {
    display: flex;
    justify-content: center;
    padding: 16px;
}

[b-ru2h00bsxr] .resumen-loading .rz-progressbar-circular {
    width: 32px !important;
    height: 32px !important;
}

@keyframes posResumenIn-b-ru2h00bsxr {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}
/* /Pages/Pos/Ticket/PosIndex.razor.rz.scp.css */
/* ===== POS DESIGN SYSTEM - MAIN LAYOUT ===== */

/* CSS Custom Properties (cascade to all children) */
.pos-container[b-44s0r2omic] {
    --pos-primary: var(--color-primary);
    --pos-primary-dark: var(--color-primary-dark);
    --pos-primary-light: var(--color-primary-light);
    --pos-accent: var(--color-warning);
    --pos-accent-dark: var(--color-warning-dark);
    --pos-accent-light: #FFFBEB;
    --pos-success: var(--color-success);
    --pos-success-light: var(--color-success-light);
    --pos-danger: var(--color-danger);
    --pos-danger-light: var(--color-danger-light);
    --pos-bg: var(--bg);
    --pos-card: var(--surface);
    --pos-text: var(--text);
    --pos-text-secondary: var(--text-secondary);
    --pos-text-muted: var(--text-muted);
    --pos-border: var(--border);
    --pos-shadow-sm: var(--shadow-xs);
    --pos-shadow: var(--shadow-sm);
    --pos-shadow-md: var(--shadow-md);
    --pos-shadow-lg: var(--shadow-lg);
    --pos-radius: var(--radius-lg);
    --pos-radius-sm: var(--radius-md);
    --pos-radius-xs: var(--radius-sm);
    --pos-transition: var(--transition);
    display: grid;
    grid-template-columns: 55fr 45fr;
    gap: 16px;
    /* Ocupar todo el espacio disponible del contenedor padre (.tab-pane) */
    height: 100%;
    padding: 0 16px;
    background: var(--pos-bg);
    overflow: hidden;
    box-sizing: border-box;
    font-family: var(--font-family);
}

/* ===== PANEL CARDS ===== */
.pos-panel[b-44s0r2omic] {
    background: var(--pos-card);
    border-radius: var(--pos-radius);
    box-shadow: var(--pos-shadow);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0;
}

.pos-panel-header[b-44s0r2omic] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    border-bottom: 1px solid var(--pos-border);
    flex-shrink: 0;
    background: linear-gradient(135deg, var(--pos-primary-light) 0%, var(--pos-card) 100%);
}

.pos-panel-header h2[b-44s0r2omic] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--pos-text);
    margin: 0;
    letter-spacing: -0.01em;
}

.pos-header-icon[b-44s0r2omic] {
    font-size: 1.25rem;
    color: var(--pos-primary);
}

.pos-badge[b-44s0r2omic] {
    background: var(--pos-primary);
    color: white;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 20px;
    min-width: 22px;
    text-align: center;
    animation: posBadgePop-b-44s0r2omic 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.pos-panel-body[b-44s0r2omic] {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0;
}

/* ===== TABS NAVIGATION ===== */
.pos-tabs-panel[b-44s0r2omic] {
    display: flex;
    flex-direction: column;
}

.pos-tabs-nav[b-44s0r2omic] {
    display: flex;
    gap: 4px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--pos-border);
    flex-shrink: 0;
    background: var(--pos-card);
}

.pos-tab-btn[b-44s0r2omic] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border: none;
    background: transparent;
    color: var(--pos-text-secondary);
    font-size: 0.8rem;
    font-weight: 600;
    border-radius: var(--pos-radius-sm);
    cursor: pointer;
    transition: var(--pos-transition);
    position: relative;
    white-space: nowrap;
}

.pos-tab-btn .rzi[b-44s0r2omic] {
    font-size: 1.1rem;
}

.pos-tab-btn:hover:not(:disabled)[b-44s0r2omic] {
    background: var(--pos-primary-light);
    color: var(--pos-primary);
}

.pos-tab-btn.active[b-44s0r2omic] {
    background: var(--pos-primary);
    color: white;
}

.pos-tab-btn:disabled[b-44s0r2omic] {
    opacity: 0.35;
    cursor: not-allowed;
}

/* Boton "Limpiar": empujado al borde derecho de la barra de tabs y en gris. */
.pos-tab-limpiar[b-44s0r2omic] {
    margin-left: auto;
    background: var(--color-limpiar);
    color: #fff;
}

.pos-tab-limpiar:hover:not(:disabled)[b-44s0r2omic] {
    background: var(--color-limpiar-dark);
    color: #fff;
}

/* ===== TAB CONTENT ===== */
.pos-tab-content[b-44s0r2omic] {
    flex: 1;
    overflow: hidden;
    min-height: 0;
}

.pos-tab-pane[b-44s0r2omic] {
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 14px;
    animation: posTabFadeIn-b-44s0r2omic 0.25s ease;
}

/* El modal de vista previa de PDF se unificó en el componente compartido
   Shared/PdfPreviewModal.razor (diseño único para toda la app). */

/* ===== SHARED BUTTON STYLES ===== */
.pos-btn[b-44s0r2omic] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--pos-radius-sm);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--pos-transition);
}

.pos-btn .rzi[b-44s0r2omic] {
    font-size: 1.1rem;
}

.pos-btn-primary[b-44s0r2omic] {
    background: var(--pos-primary);
    color: white;
}

.pos-btn-primary:hover[b-44s0r2omic] {
    background: var(--pos-primary-dark);
    box-shadow: var(--shadow-md);
}

.pos-btn-accent[b-44s0r2omic] {
    background: var(--pos-accent);
    color: white;
}

.pos-btn-accent:hover[b-44s0r2omic] {
    background: var(--pos-accent-dark);
    box-shadow: var(--shadow-md);
}

.pos-btn-secondary[b-44s0r2omic] {
    background: var(--color-secondary);
    color: #fff;
    border: none;
}

.pos-btn-secondary:hover[b-44s0r2omic] {
    background: var(--color-secondary-dark);
    color: #fff;
}

.pos-btn-danger[b-44s0r2omic] {
    background: var(--pos-danger-light);
    color: var(--pos-danger);
}

.pos-btn-danger:hover[b-44s0r2omic] {
    background: var(--pos-danger);
    color: white;
}

/* ===== ANIMATIONS ===== */
@keyframes posBadgePop-b-44s0r2omic {
    0% { transform: scale(0.5); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
}

@keyframes posTabFadeIn-b-44s0r2omic {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes posOverlayIn-b-44s0r2omic {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes posModalIn-b-44s0r2omic {
    from { opacity: 0; transform: scale(0.92) translateY(10px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}

/* ===== RESPONSIVE: TABLET ===== */
@media (max-width: 1024px) {
    .pos-container[b-44s0r2omic] {
        grid-template-columns: 1fr;
        height: auto;
        min-height: 100vh;
        overflow-y: auto;
        gap: 12px;
        padding: 10px;
    }

    .pos-panel[b-44s0r2omic] {
        min-height: 400px;
    }

    .pos-tabs-nav[b-44s0r2omic] {
        overflow-x: auto;
    }
}

/* ===== RESPONSIVE: MOBILE ===== */
@media (max-width: 640px) {
    .pos-container[b-44s0r2omic] {
        padding: 8px;
        gap: 8px;
    }

    .pos-panel-header[b-44s0r2omic] {
        padding: 10px 14px;
    }

    .pos-tabs-nav[b-44s0r2omic] {
        gap: 2px;
        padding: 8px 10px;
    }

    .pos-tab-btn[b-44s0r2omic] {
        padding: 6px 10px;
        font-size: 0.75rem;
    }

    .pos-tab-btn .rzi[b-44s0r2omic] {
        font-size: 1rem;
    }

    .pos-tab-btn span:last-child[b-44s0r2omic] {
        display: none;
    }

    .pos-tab-pane[b-44s0r2omic] {
        padding: 10px;
    }
}

/* ===== LOADING OVERLAY - BLOQUEO DE PANTALLA ===== */
.pos-loading-overlay[b-44s0r2omic] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    cursor: not-allowed;
}

.pos-loading-content[b-44s0r2omic] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    background: var(--pos-card, #fff);
    padding: 32px 48px;
    border-radius: var(--pos-radius, 12px);
    box-shadow: var(--pos-shadow-lg);
}

.pos-loading-text[b-44s0r2omic] {
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--pos-text, #1E293B);
    letter-spacing: 0.01em;
}
/* /Pages/Pos/Transbank/DetalleTransbankDialog.razor.rz.scp.css */
.dt-dialog[b-sg0fdvn5dv] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 900px;
}

.dt-filters[b-sg0fdvn5dv] {
    display: grid;
    grid-template-columns: 2fr 1.5fr 1fr 1fr auto;
    gap: 0.75rem;
    align-items: end;
    padding: 0.75rem 1rem;
    background: #f8fafc;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
}

.dt-field[b-sg0fdvn5dv] { display: flex; flex-direction: column; gap: 0.25rem; }

.dt-field label[b-sg0fdvn5dv] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #4b5563;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.dt-actions[b-sg0fdvn5dv] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

@media (max-width: 1100px) {
    .dt-filters[b-sg0fdvn5dv] { grid-template-columns: repeat(2, 1fr); }
    .dt-actions[b-sg0fdvn5dv] { grid-column: span 2; justify-content: flex-end; }
}
/* /Pages/Pos/Transbank/TransbankIndex.razor.rz.scp.css */
.tb-container[b-vibp9o0d4a] {
    --cc-primary: var(--color-primary);
    --cc-primary-dark: var(--color-primary-dark);
    --cc-success: var(--color-success);
    --cc-danger: var(--color-danger);
    --cc-danger-light: var(--color-danger-light);
    --cc-card: var(--surface);
    --cc-text: var(--text);
    --cc-border: var(--border);
    --cc-radius-sm: var(--radius-md);
    --cc-radius-xs: var(--radius-sm);
    --cc-shadow-md: var(--shadow-md);
    --cc-transition: var(--transition);

    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 12px 16px;
    background: #F1F5F9;
    overflow: hidden;
    box-sizing: border-box;
}

.tb-actions[b-vibp9o0d4a] {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    flex-shrink: 0;
    padding: 4px 0;
}

.tb-btn[b-vibp9o0d4a] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 14px;
    background: var(--cc-card);
    border: 1.5px solid var(--cc-border);
    border-radius: var(--cc-radius-sm);
    cursor: pointer;
    transition: var(--cc-transition);
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--cc-text);
    white-space: nowrap;
}

.tb-btn:hover[b-vibp9o0d4a] {
    border-color: var(--cc-primary);
    box-shadow: var(--cc-shadow-md);
    transform: translateY(-2px);
}

.tb-btn:active[b-vibp9o0d4a] { transform: translateY(0); }

.tb-btn-icon[b-vibp9o0d4a] {
    width: 32px;
    height: 32px;
    border-radius: var(--cc-radius-xs);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.tb-btn--cierre[b-vibp9o0d4a] {
    border-color: rgba(239, 68, 68, 0.3);
}

.tb-btn--cierre:hover[b-vibp9o0d4a] {
    border-color: var(--cc-danger);
    background: var(--cc-danger-light);
}

.tb-grid[b-vibp9o0d4a] {
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

.tb-badge[b-vibp9o0d4a] {
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 0.7rem;
    font-weight: 600;
}

.tb-badge-success[b-vibp9o0d4a] {
    background: #D1FAE5;
    color: #065F46;
}

.tb-badge-danger[b-vibp9o0d4a] {
    background: #FEE2E2;
    color: #991B1B;
}

@media (max-width: 768px) {
    .tb-container[b-vibp9o0d4a] {
        padding: 8px;
        gap: 8px;
    }

    .tb-actions[b-vibp9o0d4a] {
        gap: 4px;
    }

    .tb-btn span:last-child[b-vibp9o0d4a] {
        display: none;
    }
}

.tb-btn .rzi[b-vibp9o0d4a] {
    font-size: 1rem;
}
/* /Pages/Procesos/CafFolios/AsignacionFolioSucursal/AsignacionFolioSucursalIndex.razor.rz.scp.css */
/* ===== ASIGNACIÓN FOLIOS-SUCURSAL - DESIGN SYSTEM ===== */

.afs-container[b-f8128dnusb] {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    box-sizing: border-box;
    background: var(--bg);
    font-family: var(--font-family);
    padding: var(--space-4);
    gap: var(--space-3);
}

/* ===== ENCABEZADO ===== */
.afs-header[b-f8128dnusb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: 12px 20px;
    flex-shrink: 0;
}

.afs-header-left[b-f8128dnusb] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.afs-header-icon[b-f8128dnusb] {
    width: 38px;
    height: 38px;
    border-radius: var(--radius-md);
    background: linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    flex-shrink: 0;
}

.afs-header-icon .rzi[b-f8128dnusb] {
    font-size: 1.2rem;
}

.afs-header h2[b-f8128dnusb] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: var(--fw-bold);
    color: var(--text);
    letter-spacing: -0.01em;
}

.afs-header-subtitle[b-f8128dnusb] {
    margin: 2px 0 0;
    font-size: var(--text-xs);
    color: var(--text-secondary);
    font-weight: var(--fw-medium);
}

.afs-loading[b-f8128dnusb] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: var(--text-sm);
    color: var(--color-primary);
    font-weight: var(--fw-semibold);
}

.afs-spinner[b-f8128dnusb] {
    width: 18px;
    height: 18px;
    border: 2.5px solid var(--border);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: afsSpin-b-f8128dnusb 0.8s linear infinite;
}

/* ===== ÁREA DE TRABAJO ===== */
.afs-workspace[b-f8128dnusb] {
    flex: 1;
    min-height: 0;
    display: grid;
    grid-template-columns: 360px 1fr;
    gap: var(--space-3);
}

/* ===== TARJETAS ===== */
.afs-form-card[b-f8128dnusb],
.afs-grid-card[b-f8128dnusb] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
}

.afs-card-head[b-f8128dnusb] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border-bottom: 1px solid var(--border);
    background: linear-gradient(135deg, var(--color-primary-light) 0%, var(--surface) 100%);
    font-size: var(--text-base);
    font-weight: var(--fw-bold);
    color: var(--text);
    flex-shrink: 0;
}

.afs-card-head .rzi[b-f8128dnusb] {
    color: var(--color-primary);
    font-size: 1.1rem;
}

.afs-count[b-f8128dnusb] {
    margin-left: auto;
    background: var(--color-primary);
    color: #fff;
    font-size: var(--text-xs);
    font-weight: var(--fw-bold);
    padding: 2px 10px;
    border-radius: var(--radius-full);
    min-width: 24px;
    text-align: center;
}

/* ===== FORMULARIO ===== */
.afs-form-body[b-f8128dnusb] {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    overflow-y: auto;
}

.afs-field[b-f8128dnusb] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
}

.afs-field-row[b-f8128dnusb] {
    display: flex;
    gap: 10px;
}

.afs-label[b-f8128dnusb] {
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.afs-field[b-f8128dnusb]  .rz-textbox,
.afs-field[b-f8128dnusb]  .rz-numeric,
.afs-field[b-f8128dnusb]  .rz-dropdown,
.afs-field[b-f8128dnusb]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--radius-sm) !important;
    font-size: var(--text-sm) !important;
    height: 32px !important;
    background: #fff !important;
    box-sizing: border-box !important;
    transition: var(--transition);
}

.afs-field[b-f8128dnusb]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.afs-field[b-f8128dnusb]  .rz-textbox:focus,
.afs-field[b-f8128dnusb]  .rz-state-focused,
.afs-field[b-f8128dnusb]  input:focus,
.afs-field[b-f8128dnusb]  .rz-numeric:focus-within {
    border-color: var(--color-primary) !important;
    box-shadow: var(--shadow-focus) !important;
}

.afs-field[b-f8128dnusb]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: var(--text-sm) !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Pistas / chips informativos */
.afs-caf-hint[b-f8128dnusb],
.afs-cantidad[b-f8128dnusb] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: var(--text-sm);
    color: var(--text-secondary);
    background: var(--bg);
    border: 1px dashed var(--border);
    border-radius: var(--radius-sm);
    padding: 7px 10px;
}

.afs-caf-hint .rzi[b-f8128dnusb],
.afs-cantidad .rzi[b-f8128dnusb] {
    font-size: 1rem;
    color: var(--color-primary);
}

.afs-caf-hint strong[b-f8128dnusb],
.afs-cantidad strong[b-f8128dnusb] {
    color: var(--text);
}

/* ===== FOOTER FORMULARIO ===== */
.afs-form-footer[b-f8128dnusb] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 12px 16px;
    border-top: 1px solid var(--border);
    flex-shrink: 0;
}

.afs-btn[b-f8128dnusb] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border: none;
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    font-weight: var(--fw-bold);
    cursor: pointer;
    transition: var(--transition);
    color: #fff;
}

.afs-btn .rzi[b-f8128dnusb] {
    font-size: 1rem;
}

.afs-btn:hover:not(:disabled)[b-f8128dnusb] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.afs-btn:disabled[b-f8128dnusb] {
    opacity: 0.6;
    cursor: not-allowed;
}

.afs-btn-save[b-f8128dnusb] {
    background: var(--color-success);
}

.afs-btn-save:hover:not(:disabled)[b-f8128dnusb] {
    background: var(--color-success-dark);
}

.afs-btn-ghost[b-f8128dnusb] {
    background: var(--color-limpiar);
    color: #fff;
    border: 1.5px solid transparent;
}

.afs-btn-ghost:hover:not(:disabled)[b-f8128dnusb] {
    background: var(--color-limpiar-dark);
    color: #fff;
}

/* ===== GRILLA ===== */
.afs-grid-wrapper[b-f8128dnusb] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

[b-f8128dnusb] .afs-grid-wrapper .rz-datatable {
    border: none !important;
    font-size: var(--text-sm);
}

[b-f8128dnusb] .afs-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--bg) !important;
    color: var(--text-secondary) !important;
    font-weight: var(--fw-bold) !important;
    font-size: var(--text-xs) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--border) !important;
}

[b-f8128dnusb] .afs-grid-wrapper .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
}

[b-f8128dnusb] .afs-grid-wrapper .rz-datatable-tbody > tr:hover {
    background-color: var(--color-primary-light) !important;
}

[b-f8128dnusb] .afs-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: var(--text-sm);
}

.afs-grid-del[b-f8128dnusb] {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    background: var(--color-danger);
    color: #fff;
    transition: var(--transition);
}

.afs-grid-del .rzi[b-f8128dnusb] {
    font-size: 0.9rem;
}

.afs-grid-del:hover[b-f8128dnusb] {
    transform: scale(1.12);
    box-shadow: var(--shadow-md);
}

/* ===== ANIMACIONES ===== */
@keyframes afsSpin-b-f8128dnusb {
    to { transform: rotate(360deg); }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .afs-workspace[b-f8128dnusb] {
        grid-template-columns: 1fr;
        overflow-y: auto;
    }

    .afs-form-card[b-f8128dnusb] {
        min-height: auto;
    }

    .afs-grid-card[b-f8128dnusb] {
        min-height: 360px;
    }
}

@media (max-width: 640px) {
    .afs-container[b-f8128dnusb] {
        padding: var(--space-2);
        gap: var(--space-2);
    }
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-f8128dnusb] .afs-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}
/* /Pages/Procesos/CafFolios/CargaFolios/CargaFoliosIndex.razor.rz.scp.css */
/* ===== CARGA DE FOLIOS - DESIGN SYSTEM ===== */

.cf-container[b-nju15fedkw] {
    --cf-primary: var(--color-primary);
    --cf-primary-dark: var(--color-primary-dark);
    --cf-primary-light: var(--color-primary-light);
    --cf-accent: var(--color-warning);
    --cf-success: var(--color-success);
    --cf-danger: var(--color-danger);
    --cf-info: var(--color-info);
    --cf-info-dark: #0284C7;
    --cf-info-light: var(--color-info-light);
    --cf-bg: var(--bg);
    --cf-card: var(--surface);
    --cf-text: var(--text);
    --cf-text-secondary: var(--text-secondary);
    --cf-text-muted: var(--text-muted);
    --cf-border: var(--border);
    --cf-shadow-sm: var(--shadow-xs);
    --cf-shadow: var(--shadow-sm);
    --cf-shadow-md: var(--shadow-md);
    --cf-radius: var(--radius-lg);
    --cf-radius-xs: var(--radius-sm);
    --cf-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--cf-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL (header con tabs) ===== */
.cf-control-bar[b-nju15fedkw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--cf-card);
    border-radius: var(--cf-radius);
    box-shadow: var(--cf-shadow);
    padding: 10px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 56px;
}

.control-left[b-nju15fedkw] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.cf-header-icon[b-nju15fedkw] {
    width: 40px;
    height: 40px;
    border-radius: var(--cf-radius-xs);
    background: linear-gradient(135deg, var(--cf-primary) 0%, var(--cf-primary-dark) 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
}

.control-left h2[b-nju15fedkw] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--cf-text);
}

.cf-header-subtitle[b-nju15fedkw] {
    margin: 0;
    font-size: 0.72rem;
    color: var(--cf-text-secondary);
}

.control-right[b-nju15fedkw] {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

/* ===== BOTONES TAB ===== */
.cf-tab-btn[b-nju15fedkw] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: 1.5px solid var(--cf-border);
    border-radius: var(--cf-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cf-transition);
    white-space: nowrap;
    background: var(--cf-card);
    color: var(--cf-text-secondary);
}

.cf-tab-btn:hover[b-nju15fedkw] {
    border-color: var(--cf-primary);
    color: var(--cf-primary);
}

.cf-tab-btn.active[b-nju15fedkw] {
    background: var(--cf-primary);
    border-color: var(--cf-primary-dark);
    color: white;
    box-shadow: var(--cf-shadow-md);
}

.cf-tab-btn .rzi[b-nju15fedkw] {
    font-size: 1rem;
}

/* ===== PANEL ===== */
.cf-panel[b-nju15fedkw] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--cf-card);
    border-radius: var(--cf-radius);
    box-shadow: var(--cf-shadow);
    overflow: hidden;
    min-height: 0;
    position: relative;
    animation: cfSlideUp-b-nju15fedkw 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

.cf-panel-header[b-nju15fedkw] {
    padding: 12px 18px;
    border-bottom: 1px solid var(--cf-border);
    background: linear-gradient(135deg, var(--cf-primary-light) 0%, var(--cf-card) 100%);
    flex-shrink: 0;
}

.cf-panel-header h3[b-nju15fedkw] {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--cf-text);
    display: flex;
    align-items: center;
    gap: 8px;
}

.cf-panel-header h3 .rzi[b-nju15fedkw] {
    color: var(--cf-primary);
    font-size: 1.2rem;
}

.cf-panel-body[b-nju15fedkw] {
    flex: 1;
    overflow-y: auto;
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.cf-panel-footer[b-nju15fedkw] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 10px 16px;
    border-top: 1px solid var(--cf-border);
    background: var(--cf-card);
    flex-shrink: 0;
}

/* ===== INFO BOX ===== */
.cf-info[b-nju15fedkw] {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    background: var(--cf-info-light);
    border-left: 4px solid var(--cf-info);
    padding: 12px 14px;
    border-radius: var(--cf-radius-xs);
    font-size: 0.82rem;
    color: var(--cf-text);
    line-height: 1.45;
}

.cf-info .rzi[b-nju15fedkw] {
    color: var(--cf-info);
    font-size: 1.2rem;
    flex-shrink: 0;
    margin-top: 1px;
}

/* ===== FILE PICKER ===== */
.cf-file-picker[b-nju15fedkw] {
    display: flex;
    width: 100%;
}

.cf-file-label[b-nju15fedkw] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    border: 2px dashed var(--cf-border);
    border-radius: var(--cf-radius-xs);
    background: #FAFBFC;
    cursor: pointer;
    transition: var(--cf-transition);
    font-size: 0.85rem;
    color: var(--cf-text-secondary);
    width: 100%;
    box-sizing: border-box;
}

.cf-file-label:hover[b-nju15fedkw] {
    border-color: var(--cf-primary);
    background: var(--cf-primary-light);
    color: var(--cf-primary-dark);
}

.cf-file-label .rzi[b-nju15fedkw] {
    font-size: 1.4rem;
    color: var(--cf-primary);
}

.cf-input-hidden[b-nju15fedkw] {
    display: none;
}

/* ===== PREVIEW DEL CAF PARSEADO ===== */
.cf-preview[b-nju15fedkw] {
    background: var(--cf-bg);
    border-radius: var(--cf-radius-xs);
    padding: 14px;
    border: 1px solid var(--cf-border);
}

.cf-preview-row[b-nju15fedkw] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 12px;
}

.cf-preview-cell[b-nju15fedkw] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.cf-preview-label[b-nju15fedkw] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--cf-text-secondary);
}

.cf-preview-value[b-nju15fedkw] {
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--cf-text);
}

/* ===== FORM GRID (TAB 2) ===== */
.cf-form-grid[b-nju15fedkw] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 14px 16px;
}

.cf-form-field[b-nju15fedkw] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.cf-full[b-nju15fedkw] {
    grid-column: 1 / -1;
}

.cf-actions-inline[b-nju15fedkw] {
    justify-content: flex-end;
    align-self: end;
}

.cf-label[b-nju15fedkw] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--cf-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.02em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cf-form-field[b-nju15fedkw]  .rz-textbox,
.cf-form-field[b-nju15fedkw]  .rz-inputtext,
.cf-form-field[b-nju15fedkw]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cf-radius-xs) !important;
    font-size: 0.85rem !important;
    height: 36px !important;
    background: white !important;
    transition: var(--cf-transition);
}

.cf-form-field[b-nju15fedkw]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cf-radius-xs) !important;
    font-size: 0.85rem !important;
    height: 36px !important;
    background: white !important;
    transition: var(--cf-transition);
    box-sizing: border-box !important;
}

.cf-form-field[b-nju15fedkw]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.cf-form-field[b-nju15fedkw]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.85rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cf-form-field[b-nju15fedkw]  .rz-textbox:focus,
.cf-form-field[b-nju15fedkw]  .rz-state-focused,
.cf-form-field[b-nju15fedkw]  input:focus {
    border-color: var(--cf-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
    outline: none;
}

/* ===== BOTONES ===== */
.cf-btn[b-nju15fedkw] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cf-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cf-transition);
    color: white;
    white-space: nowrap;
}

.cf-btn:hover:not(:disabled)[b-nju15fedkw] {
    transform: translateY(-1px);
    box-shadow: var(--cf-shadow-md);
}

.cf-btn:disabled[b-nju15fedkw] {
    opacity: 0.55;
    cursor: not-allowed;
}

.cf-btn .rzi[b-nju15fedkw] {
    font-size: 1rem;
}

.cf-btn-primary[b-nju15fedkw] {
    background: var(--cf-success);
}

.cf-btn-secondary[b-nju15fedkw] {
    background: var(--color-limpiar);
}

.cf-btn-secondary:hover:not(:disabled)[b-nju15fedkw] {
    background: var(--color-limpiar-dark);
}

.cf-btn-info[b-nju15fedkw] {
    background: var(--cf-info);
}

.cf-btn-info:hover:not(:disabled)[b-nju15fedkw] {
    background: var(--cf-info-dark);
}

/* ===== LOADING OVERLAY ===== */
.cf-loading-overlay[b-nju15fedkw] {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    z-index: 10;
    color: var(--cf-text-secondary);
    font-weight: 600;
    font-size: 0.85rem;
}

.cf-loading-spinner[b-nju15fedkw] {
    width: 42px;
    height: 42px;
    border: 4px solid var(--cf-border);
    border-top-color: var(--cf-primary);
    border-radius: 50%;
    animation: cfSpin-b-nju15fedkw 0.8s linear infinite;
}

@keyframes cfSpin-b-nju15fedkw {
    to { transform: rotate(360deg); }
}

@keyframes cfSlideUp-b-nju15fedkw {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .cf-container[b-nju15fedkw] {
        padding: 8px 10px;
        gap: 8px;
    }

    .cf-control-bar[b-nju15fedkw] {
        flex-wrap: wrap;
    }

    .cf-form-grid[b-nju15fedkw] {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
}

@media (max-width: 640px) {
    .cf-container[b-nju15fedkw] {
        padding: 6px 8px;
        gap: 6px;
    }

    .cf-control-bar[b-nju15fedkw] {
        flex-direction: column;
        gap: 8px;
    }

    .control-left[b-nju15fedkw],
    .control-right[b-nju15fedkw] {
        width: 100%;
        justify-content: center;
    }

    .control-right[b-nju15fedkw] {
        flex-wrap: wrap;
    }

    .cf-tab-btn[b-nju15fedkw] {
        flex: 1;
        justify-content: center;
        min-width: 0;
    }

    .cf-form-grid[b-nju15fedkw],
    .cf-preview-row[b-nju15fedkw] {
        grid-template-columns: 1fr;
    }

    .cf-actions-inline[b-nju15fedkw] {
        align-self: stretch;
        justify-content: stretch;
    }

    .cf-actions-inline .cf-btn[b-nju15fedkw] {
        flex: 1;
        justify-content: center;
    }
}
/* /Pages/Procesos/CafFolios/ConsultaFolios/Componentes/CafFolioFormulario.razor.rz.scp.css */
/* ===== MODAL EDITAR CAF (OBSERVACIONES / ESTADO) ===== */

.cff-modal[b-udrj90lto7] {
    --cff-primary: var(--color-primary);
    --cff-success: var(--color-success);
    --cff-border: var(--border);
    --cff-bg: #F8FAFC;
    --cff-card: var(--surface);
    --cff-text: var(--text);
    --cff-text-secondary: var(--text-secondary);
    --cff-radius-xs: var(--radius-sm);
    --cff-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    background: var(--cff-bg);
    font-family: var(--font-family);
    position: relative;
}

.cff-loading-overlay[b-udrj90lto7] {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    z-index: 10;
    color: var(--cff-text-secondary);
    font-weight: 600;
    font-size: 0.85rem;
}

.cff-loading-spinner[b-udrj90lto7] {
    width: 42px;
    height: 42px;
    border: 4px solid var(--cff-border);
    border-top-color: var(--cff-primary);
    border-radius: 50%;
    animation: cffSpin-b-udrj90lto7 0.8s linear infinite;
}

@keyframes cffSpin-b-udrj90lto7 {
    to { transform: rotate(360deg); }
}

.cff-body[b-udrj90lto7] {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.cff-grid[b-udrj90lto7] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 16px;
}

/* Bloque de campos editables, separado de los datos de solo lectura */
.cff-edit[b-udrj90lto7] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 16px;
    padding-top: 14px;
    border-top: 1px dashed var(--cff-border);
}

.cff-field[b-udrj90lto7] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.cff-full[b-udrj90lto7] {
    grid-column: 1 / -1;
}

.cff-label[b-udrj90lto7] {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--cff-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* Valor de solo lectura (datos no editables del CAF) */
.cff-static[b-udrj90lto7] {
    padding: 7px 10px;
    border: 1px solid var(--cff-border);
    border-radius: var(--cff-radius-xs);
    font-size: 0.85rem;
    color: var(--cff-text);
    background: var(--cff-bg);
    min-height: 36px;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cff-field[b-udrj90lto7]  .rz-textarea,
.cff-field[b-udrj90lto7]  textarea {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cff-radius-xs) !important;
    font-size: 0.85rem !important;
    background: white !important;
    transition: var(--cff-transition);
    padding: 8px 10px !important;
}

.cff-field[b-udrj90lto7]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cff-radius-xs) !important;
    font-size: 0.85rem !important;
    height: 36px !important;
    background: white !important;
    transition: var(--cff-transition);
    box-sizing: border-box !important;
}

.cff-field[b-udrj90lto7]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.cff-field[b-udrj90lto7]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.85rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cff-field[b-udrj90lto7]  .rz-textarea:focus,
.cff-field[b-udrj90lto7]  .rz-state-focused,
.cff-field[b-udrj90lto7]  textarea:focus {
    border-color: var(--cff-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
    outline: none;
}

.cff-footer[b-udrj90lto7] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 10px 16px;
    border-top: 1px solid var(--cff-border);
    background: var(--cff-card);
    flex-shrink: 0;
}

.cff-btn[b-udrj90lto7] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cff-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    color: white;
    transition: var(--cff-transition);
}

.cff-btn:hover:not(:disabled)[b-udrj90lto7] {
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.cff-btn:disabled[b-udrj90lto7] {
    opacity: 0.6;
    cursor: not-allowed;
}

.cff-btn-secondary[b-udrj90lto7] {
    background: var(--color-secondary);
}

.cff-btn-secondary:hover:not(:disabled)[b-udrj90lto7] {
    background: var(--color-secondary-dark);
}

.cff-btn-primary[b-udrj90lto7] {
    background: var(--color-success);
}

.cff-btn .rzi[b-udrj90lto7] {
    font-size: 1rem;
}

@media (max-width: 640px) {
    .cff-grid[b-udrj90lto7],
    .cff-edit[b-udrj90lto7] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Procesos/CafFolios/ConsultaFolios/ConsultaFolios.razor.rz.scp.css */
/* ===== CONSULTA DE FOLIOS - DESIGN SYSTEM ===== */
/* Misma paleta de Productos / Clientes / POS */

.cfol-container[b-j9uv5dzx54] {
    --cfol-primary: var(--color-primary);
    --cfol-primary-dark: var(--color-primary-dark);
    --cfol-primary-light: var(--color-primary-light);
    --cfol-accent: var(--color-warning);
    --cfol-accent-dark: var(--color-warning-dark);
    --cfol-success: var(--color-success);
    --cfol-success-dark: var(--color-success-dark);
    --cfol-success-light: var(--color-success-light);
    --cfol-danger: var(--color-danger);
    --cfol-danger-dark: var(--color-danger-dark);
    --cfol-danger-light: var(--color-danger-light);
    --cfol-info: var(--color-info);
    --cfol-info-dark: #0284C7;
    --cfol-bg: var(--bg);
    --cfol-card: var(--surface);
    --cfol-text: var(--text);
    --cfol-text-secondary: var(--text-secondary);
    --cfol-text-muted: var(--text-muted);
    --cfol-border: var(--border);
    --cfol-shadow: var(--shadow-sm);
    --cfol-shadow-md: var(--shadow-md);
    --cfol-radius: var(--radius-lg);
    --cfol-radius-sm: var(--radius-md);
    --cfol-radius-xs: var(--radius-sm);
    --cfol-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--cfol-bg);
    overflow: hidden;
    box-sizing: border-box;
    font-family: var(--font-family);
    padding: 16px;
    gap: 12px;
    animation: cfolFadeIn 0.35s ease;
}

/* ===== HEADER ===== */
.cfol-header[b-j9uv5dzx54] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--cfol-card);
    border-radius: var(--cfol-radius);
    box-shadow: var(--cfol-shadow);
    padding: 12px 20px;
    flex-shrink: 0;
    border: 1px solid var(--cfol-border);
}

.cfol-header-left[b-j9uv5dzx54] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.cfol-header-icon[b-j9uv5dzx54] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    background: var(--cfol-primary-light);
    border-radius: var(--cfol-radius-sm);
    color: var(--cfol-primary);
    font-size: 1.25rem;
}

.cfol-header h2[b-j9uv5dzx54] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--cfol-text);
    margin: 0;
    letter-spacing: -0.01em;
}

.cfol-header-subtitle[b-j9uv5dzx54] {
    font-size: 0.75rem;
    color: var(--cfol-text-secondary);
    margin: 0;
    font-weight: 500;
}

.cfol-header-actions[b-j9uv5dzx54] {
    display: flex;
    gap: 8px;
    align-items: center;
}

/* ===== FILTROS ===== */
.cfol-filters[b-j9uv5dzx54] {
    background: var(--cfol-card);
    border-radius: var(--cfol-radius);
    box-shadow: var(--cfol-shadow);
    border: 1px solid var(--cfol-border);
    padding: 12px 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex-shrink: 0;
    animation: cfolSlideUp 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.cfol-filters-header[b-j9uv5dzx54] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--cfol-text-secondary);
    font-weight: 600;
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.cfol-filters-grid[b-j9uv5dzx54] {
    display: grid;
    grid-template-columns: 1.2fr 1.2fr 1.4fr auto;
    gap: 12px;
    align-items: end;
}

.cfol-field[b-j9uv5dzx54] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.cfol-field label[b-j9uv5dzx54] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--cfol-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.cfol-field-next .cfol-next-folio[b-j9uv5dzx54] {
    display: flex;
    gap: 6px;
    align-items: center;
}

.cfol-field-actions[b-j9uv5dzx54] {
    flex-direction: row;
    align-items: center;
    justify-content: end;
    gap: 8px;
}

/* ===== BLOQUE COLAPSABLE: MÍNIMO FOLIO ===== */
.cfol-min-folio[b-j9uv5dzx54] {
    border: 1px dashed var(--cfol-border);
    border-radius: var(--cfol-radius-sm);
    background: var(--cfol-bg);
    overflow: hidden;
}

.cfol-min-folio-header[b-j9uv5dzx54] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.82rem;
    color: var(--cfol-text);
    transition: var(--cfol-transition);
}

    .cfol-min-folio-header:hover[b-j9uv5dzx54] {
        background: var(--cfol-primary-light);
    }

.cfol-min-folio-toggle[b-j9uv5dzx54] {
    margin-left: auto;
    font-size: 0.72rem;
    color: var(--cfol-primary);
    font-weight: 700;
    text-transform: uppercase;
}

.cfol-min-folio-body[b-j9uv5dzx54] {
    padding: 12px;
    background: var(--cfol-card);
    border-top: 1px solid var(--cfol-border);
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.cfol-min-folio-grid[b-j9uv5dzx54] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 10px;
}

.cfol-min-folio-item[b-j9uv5dzx54] {
    display: flex;
    flex-direction: column;
    justify-content: flex-end; /* el input queda pegado abajo => todos alineados */
    gap: 4px;
}

/* Altura fija de 2 lineas (recorte con ellipsis) para que TODAS las etiquetas
   midan igual y los inputs queden alineados horizontalmente, sin importar el
   largo del texto del tipo de documento. */
.cfol-min-folio-item label[b-j9uv5dzx54] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--cfol-text-secondary);
    line-height: 1.25;
    min-height: 1.75rem; /* 2 lineas * 1.25 * 0.7rem */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.cfol-min-folio-footer[b-j9uv5dzx54] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

/* ===== CONTENIDO PRINCIPAL: GRILLA (ancho completo) ===== */
.cfol-content[b-j9uv5dzx54] {
    flex: 1;
    display: flex;
    min-height: 0;
}

.cfol-grid-wrapper[b-j9uv5dzx54] {
    flex: 1;
    background: var(--cfol-card);
    border-radius: var(--cfol-radius);
    box-shadow: var(--cfol-shadow);
    border: 1px solid var(--cfol-border);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    position: relative;
    min-height: 0;
}

/* ===== INPUTS READONLY ===== */
.cfol-readonly-input[b-j9uv5dzx54] {
    padding: 7px 10px;
    border: 1px solid var(--cfol-border);
    border-radius: var(--cfol-radius-sm);
    font-size: 0.82rem;
    color: var(--cfol-text);
    background: var(--cfol-bg);
    font-family: inherit;
    outline: none;
    width: 100%;
    box-sizing: border-box;
}

/* ===== BOTONES ===== */
.cfol-btn[b-j9uv5dzx54] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cfol-radius-sm);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cfol-transition);
    letter-spacing: 0.01em;
    color: white;
}

    .cfol-btn:disabled[b-j9uv5dzx54] {
        opacity: 0.55;
        cursor: not-allowed;
    }

.cfol-btn-sm[b-j9uv5dzx54] {
    padding: 6px 10px;
    font-size: 0.74rem;
}

/* "Filtrar" ejecuta la búsqueda de la grilla = función Buscar → naranjo (DESIGN_SYSTEM §4.3) */
.cfol-btn-primary[b-j9uv5dzx54] {
    background: var(--color-accent);
}

    .cfol-btn-primary:hover:not(:disabled)[b-j9uv5dzx54] {
        transform: translateY(-1px);
        box-shadow: var(--shadow-md);
    }

.cfol-btn-info[b-j9uv5dzx54] {
    background: var(--cfol-info);
}

    .cfol-btn-info:hover:not(:disabled)[b-j9uv5dzx54] {
        transform: translateY(-1px);
        box-shadow: var(--shadow-md);
    }

.cfol-btn-accent[b-j9uv5dzx54] {
    background: var(--cfol-accent);
}

    .cfol-btn-accent:hover:not(:disabled)[b-j9uv5dzx54] {
        transform: translateY(-1px);
        box-shadow: var(--shadow-md);
    }

/* Grabar = verde success (unificado con todos los botones "Grabar" de la app) */
.cfol-btn-success[b-j9uv5dzx54] {
    background: var(--color-success);
}

    .cfol-btn-success:hover:not(:disabled)[b-j9uv5dzx54] {
        transform: translateY(-1px);
        box-shadow: var(--shadow-md);
    }

.cfol-btn-secondary[b-j9uv5dzx54] {
    background: var(--color-secondary);
    border: none;
    color: #fff;
}

    .cfol-btn-secondary:hover:not(:disabled)[b-j9uv5dzx54] {
        background: var(--color-secondary-dark);
        color: #fff;
    }

/* ===== ACCIONES EN GRILLA ===== */
.cfol-action-btn[b-j9uv5dzx54] {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--cfol-radius-xs);
    cursor: pointer;
    transition: var(--cfol-transition);
    padding: 0;
    color: white;
    font-size: 0.85rem;
}

    .cfol-action-btn .rzi[b-j9uv5dzx54] {
        font-size: 0.9rem;
    }

    .cfol-action-btn:hover[b-j9uv5dzx54] {
        transform: scale(1.12);
        box-shadow: var(--cfol-shadow-md);
    }

    .cfol-action-btn:active[b-j9uv5dzx54] {
        transform: scale(0.95);
    }

    .cfol-action-btn.edit[b-j9uv5dzx54] {
        background: var(--cfol-info);
    }

        .cfol-action-btn.edit:hover[b-j9uv5dzx54] {
            background: var(--cfol-info-dark);
        }

/* ===== PILLS / BADGES ===== */
.cfol-pill[b-j9uv5dzx54] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 20px;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.cfol-pill-ok[b-j9uv5dzx54] {
    background: var(--cfol-success-light);
    color: var(--cfol-success-dark);
}

.cfol-pill-danger[b-j9uv5dzx54] {
    background: var(--cfol-danger-light);
    color: var(--cfol-danger-dark);
}

/* ===== LOADING ===== */
.cfol-loading[b-j9uv5dzx54] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    gap: 16px;
    background: var(--cfol-bg);
    animation: cfolFadeIn 0.3s ease;
}

.cfol-loading-text[b-j9uv5dzx54] {
    font-size: 0.85rem;
    color: var(--cfol-text-secondary);
    font-weight: 500;
}

.cfol-spinner[b-j9uv5dzx54] {
    width: 40px;
    height: 40px;
    border: 3px solid var(--cfol-border);
    border-top-color: var(--cfol-primary);
    border-radius: 50%;
    animation: cfolSpin 0.8s linear infinite;
}

.cfol-loading-overlay[b-j9uv5dzx54] {
    position: absolute;
    inset: 0;
    background: rgba(255,255,255,0.7);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    z-index: 5;
    font-size: 0.85rem;
    color: var(--cfol-text-secondary);
}

/* ===== ESTILOS GRILLA RADZEN ===== */
[b-j9uv5dzx54] .rz-datatable {
    border: none !important;
}

[b-j9uv5dzx54] .rz-datatable-thead > tr > th {
    background: var(--cfol-bg) !important;
    color: var(--cfol-text-secondary) !important;
    font-size: 0.7rem !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    border-bottom: 1px solid var(--cfol-border) !important;
    padding: 10px 12px !important;
}

[b-j9uv5dzx54] .rz-datatable-tbody > tr {
    transition: var(--cfol-transition);
}

    [b-j9uv5dzx54] .rz-datatable-tbody > tr:hover {
        background: var(--cfol-primary-light) !important;
    }

    [b-j9uv5dzx54] .rz-datatable-tbody > tr > td {
        border-bottom: 1px dashed #F1F5F9 !important;
        font-size: 0.78rem !important;
        color: var(--cfol-text) !important;
        padding: 8px 12px !important;
    }

[b-j9uv5dzx54] .rz-pager {
    border-top: 1px solid var(--cfol-border) !important;
    padding: 6px 12px !important;
}

/* ===== ANIMACIONES ===== */
@@keyframes cfolFadeIn {
    from[b-j9uv5dzx54] { opacity: 0; }
    to[b-j9uv5dzx54] { opacity: 1; }
}

@@keyframes cfolSlideUp {
    from[b-j9uv5dzx54] { opacity: 0; transform: translateY(8px); }
    to[b-j9uv5dzx54] { opacity: 1; transform: translateY(0); }
}

@@keyframes cfolSpin {
    to[b-j9uv5dzx54] { transform: rotate(360deg); }
}

/* ===== RESPONSIVE ===== */
@@media (max-width: 900px) {
    .cfol-filters-grid[b-j9uv5dzx54] {
        grid-template-columns: 1fr 1fr;
    }
}

@@media (max-width: 640px) {
    .cfol-container[b-j9uv5dzx54] {
        padding: 8px;
    }

    .cfol-filters-grid[b-j9uv5dzx54] {
        grid-template-columns: 1fr;
    }

    .cfol-header-subtitle[b-j9uv5dzx54] {
        display: none;
    }
}

.cfol-btn .rzi[b-j9uv5dzx54] {
    font-size: 1rem;
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-j9uv5dzx54] .cfol-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}
/* /Pages/Procesos/Cesion/CesionElectronica/CesionElectronicaIndex.razor.rz.scp.css */
/* ===== CESION ELECTRONICA - DESIGN SYSTEM (reutiliza variables de ConsultaDocumentos) ===== */

.consulta-container[b-2ucd44r4cn] {
    --cd-primary: var(--color-primary);
    --cd-primary-dark: var(--color-primary-dark);
    --cd-primary-light: var(--color-primary-light);
    --cd-accent: var(--color-warning);
    --cd-accent-dark: var(--color-warning-dark);
    --cd-accent-light: #FFFBEB;
    --cd-success: var(--color-success);
    --cd-success-light: var(--color-success-light);
    --cd-danger: var(--color-danger);
    --cd-danger-light: var(--color-danger-light);
    --cd-info: var(--color-info);
    --cd-info-light: var(--color-info-light);
    --cd-orange: var(--color-accent);
    --cd-orange-dark: var(--color-accent-dark);
    --cd-bg: var(--bg);
    --cd-card: var(--surface);
    --cd-text: var(--text);
    --cd-text-secondary: var(--text-secondary);
    --cd-text-muted: var(--text-muted);
    --cd-border: var(--border);
    --cd-shadow-sm: var(--shadow-xs);
    --cd-shadow: var(--shadow-sm);
    --cd-shadow-md: var(--shadow-md);
    --cd-shadow-lg: var(--shadow-lg);
    --cd-radius: var(--radius-lg);
    --cd-radius-sm: var(--radius-md);
    --cd-radius-xs: var(--radius-sm);
    --cd-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--cd-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.consulta-control-bar[b-2ucd44r4cn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    padding: 8px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 48px;
}

.control-left[b-2ucd44r4cn] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.control-left label[b-2ucd44r4cn] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    white-space: nowrap;
}

[b-2ucd44r4cn] .control-left .rz-dropdown {
    width: 90px !important;
    height: 32px !important;
    border-radius: var(--cd-radius-xs) !important;
}

.control-center[b-2ucd44r4cn] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loading-indicator[b-2ucd44r4cn] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: cdFadeIn-b-2ucd44r4cn 0.3s ease;
}

.loading-spinner[b-2ucd44r4cn] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--cd-border);
    border-top-color: var(--cd-primary);
    border-radius: 50%;
    animation: cdSpin-b-2ucd44r4cn 0.8s linear infinite;
}

.loading-text[b-2ucd44r4cn] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--cd-primary);
    animation: cdPulse-b-2ucd44r4cn 1.5s ease-in-out infinite;
}

.control-right[b-2ucd44r4cn] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES ===== */
.cd-btn[b-2ucd44r4cn] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cd-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cd-transition);
    white-space: nowrap;
    color: white;
}

.cd-btn:hover[b-2ucd44r4cn] {
    transform: translateY(-1px);
    box-shadow: var(--cd-shadow-md);
}

.cd-btn:active[b-2ucd44r4cn] {
    transform: translateY(0);
}

.cd-btn .rzi[b-2ucd44r4cn] {
    font-size: 1rem;
}

.btn-buscar[b-2ucd44r4cn] {
    background: var(--cd-orange);
}

.btn-exportar[b-2ucd44r4cn] {
    background: var(--cd-success);
}

.btn-masiva[b-2ucd44r4cn] {
    background: var(--cd-primary);
}

.btn-masiva:disabled[b-2ucd44r4cn] {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.btn-masiva:disabled:hover[b-2ucd44r4cn] {
    transform: none;
    box-shadow: none;
}

.btn-filtros[b-2ucd44r4cn] {
    background: var(--cd-info);
}

.btn-filtros.active[b-2ucd44r4cn] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* ===== PANEL DE FILTROS ===== */
.filtros-wrapper[b-2ucd44r4cn] {
    position: relative;
    flex-shrink: 0;
}

.filtros-panel[b-2ucd44r4cn] {
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow-md);
    overflow: hidden;
    animation: cdSlideDown-b-2ucd44r4cn 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.filtros-header[b-2ucd44r4cn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--cd-border);
    background: linear-gradient(135deg, var(--cd-info-light) 0%, var(--cd-card) 100%);
}

.filtros-header h3[b-2ucd44r4cn] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--cd-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.filtros-header h3 .rzi[b-2ucd44r4cn] {
    color: var(--cd-info);
    font-size: 1.1rem;
}

.filtros-close-btn[b-2ucd44r4cn] {
    background: none;
    border: none;
    color: var(--cd-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--cd-radius-xs);
    transition: var(--cd-transition);
    display: flex;
    align-items: center;
}

.filtros-close-btn:hover[b-2ucd44r4cn] {
    background: var(--cd-danger-light);
    color: var(--cd-danger);
}

.filtros-body[b-2ucd44r4cn] {
    padding: 12px 16px;
}

.filtros-grid[b-2ucd44r4cn] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.filtro-field[b-2ucd44r4cn] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.filtro-label[b-2ucd44r4cn] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.filtro-field[b-2ucd44r4cn]  .rz-textbox,
.filtro-field[b-2ucd44r4cn]  .rz-spinner,
.filtro-field[b-2ucd44r4cn]  .rz-inputtext,
.filtro-field[b-2ucd44r4cn]  .rz-calendar,
.filtro-field[b-2ucd44r4cn]  .rz-numeric,
.filtro-field[b-2ucd44r4cn]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
}

.filtro-field[b-2ucd44r4cn]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.filtro-field[b-2ucd44r4cn]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.filtro-field[b-2ucd44r4cn]  .rz-textbox:focus,
.filtro-field[b-2ucd44r4cn]  .rz-state-focused,
.filtro-field[b-2ucd44r4cn]  input:focus,
.filtro-field[b-2ucd44r4cn]  .rz-calendar:focus-within,
.filtro-field[b-2ucd44r4cn]  .rz-numeric:focus-within {
    border-color: var(--cd-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

.filtro-field[b-2ucd44r4cn]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== GRILLA ===== */
.consulta-grid-wrapper[b-2ucd44r4cn] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    overflow: hidden;
    min-height: 0;
}

[b-2ucd44r4cn] .consulta-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-2ucd44r4cn] .consulta-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

[b-2ucd44r4cn] .consulta-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--cd-bg) !important;
    color: var(--cd-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--cd-border) !important;
}

[b-2ucd44r4cn] .consulta-grid-wrapper .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
}

[b-2ucd44r4cn] .consulta-grid-wrapper .rz-datatable-tbody > tr:hover {
    background-color: var(--cd-primary-light) !important;
}

[b-2ucd44r4cn] .consulta-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

.grid-actions[b-2ucd44r4cn] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.grid-action-btn[b-2ucd44r4cn] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--cd-radius-xs);
    cursor: pointer;
    transition: var(--cd-transition);
    padding: 0;
    color: white;
    font-size: 0.85rem;
}

.grid-action-btn:hover[b-2ucd44r4cn] {
    transform: scale(1.12);
    box-shadow: var(--cd-shadow-md);
}

.grid-action-btn:active[b-2ucd44r4cn] {
    transform: scale(0.95);
}

.grid-action-btn:disabled[b-2ucd44r4cn] {
    opacity: 0.45;
    cursor: not-allowed;
    filter: grayscale(0.5);
}

.grid-btn-ceder[b-2ucd44r4cn] {
    background: var(--cd-primary);
}

.grid-btn-ceder:hover[b-2ucd44r4cn] {
    background: var(--cd-primary-dark);
}

/* ===== ANIMACIONES ===== */
@keyframes cdSpin-b-2ucd44r4cn {
    to { transform: rotate(360deg); }
}

@keyframes cdPulse-b-2ucd44r4cn {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

@keyframes cdFadeIn-b-2ucd44r4cn {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes cdSlideDown-b-2ucd44r4cn {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .consulta-container[b-2ucd44r4cn] {
        padding: 8px 10px;
        gap: 8px;
    }

    .consulta-control-bar[b-2ucd44r4cn] {
        flex-wrap: wrap;
        padding: 8px 12px;
    }

    .control-center[b-2ucd44r4cn] {
        order: 3;
        width: 100%;
    }

    .filtros-grid[b-2ucd44r4cn] {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
}

@media (max-width: 640px) {
    .consulta-container[b-2ucd44r4cn] {
        padding: 6px 8px;
        gap: 6px;
    }

    .consulta-control-bar[b-2ucd44r4cn] {
        flex-direction: column;
        gap: 8px;
    }

    .control-left[b-2ucd44r4cn],
    .control-right[b-2ucd44r4cn] {
        width: 100%;
        justify-content: center;
    }

    .control-right[b-2ucd44r4cn] {
        flex-wrap: wrap;
    }

    .cd-btn[b-2ucd44r4cn] {
        flex: 1;
        justify-content: center;
        min-width: 0;
    }

    .cd-btn span:not(.material-icons):not(.rzi)[b-2ucd44r4cn] {
        display: none;
    }

    .filtros-grid[b-2ucd44r4cn] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Procesos/Cesion/CesionElectronica/Componentes/CederDocumentoDialog.razor.rz.scp.css */
/* CederDocumentoDialog — estilos aislados (antes <style> embebido).
   Tokens en wwwroot/css/design-tokens.css. Inputs compactados a 30px/0.78rem. */

.ceder-modal[b-ydi9xgdst2] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 4px 4px 0 4px;
    font-family: var(--font-family);
}

.ceder-section[b-ydi9xgdst2] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 12px 14px;
    box-shadow: var(--shadow-xs);
}

    .ceder-section h4[b-ydi9xgdst2] {
        margin: 0 0 10px 0;
        font-size: 0.85rem;
        font-weight: var(--fw-bold);
        color: var(--text);
        display: flex;
        align-items: center;
        gap: 6px;
        text-transform: uppercase;
        letter-spacing: 0.04em;
    }

        .ceder-section h4 .rzi[b-ydi9xgdst2] {
            color: var(--color-primary);
            font-size: 1.05rem;
        }

.ceder-grid-2[b-ydi9xgdst2] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px 14px;
}

.ceder-field[b-ydi9xgdst2] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

    .ceder-field.full-width[b-ydi9xgdst2] {
        grid-column: 1 / -1;
    }

    .ceder-field label[b-ydi9xgdst2] {
        font-size: var(--text-xs);
        font-weight: var(--fw-semibold);
        color: var(--text-secondary);
        text-transform: uppercase;
        letter-spacing: 0.03em;
    }

.ceder-readonly[b-ydi9xgdst2] {
    font-size: 0.85rem;
    color: var(--text);
    background: #F8FAFC;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    padding: 6px 10px;
    font-weight: var(--fw-medium);
}

.ceder-field[b-ydi9xgdst2]  .rz-textbox,
.ceder-field[b-ydi9xgdst2]  .rz-numeric,
.ceder-field[b-ydi9xgdst2]  .rz-calendar,
.ceder-field[b-ydi9xgdst2]  .rz-dropdown,
.ceder-field[b-ydi9xgdst2]  input {
    border: 1.5px solid var(--border) !important;
    border-radius: var(--radius-sm) !important;
    font-size: 0.78rem !important;
    height: 30px !important;
    background: white !important;
}

.ceder-loading[b-ydi9xgdst2],
.ceder-empty[b-ydi9xgdst2] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    padding: 8px 4px;
}

.ceder-empty[b-ydi9xgdst2] {
    color: #B45309;
    background: #FFFBEB;
    border-left: 3px solid var(--color-warning);
    border-radius: var(--radius-xs);
    padding: 8px 10px;
}

.ceder-switch-section[b-ydi9xgdst2] {
    background: var(--color-primary-light);
    border-color: #C7D2FE;
}

.ceder-switch-row[b-ydi9xgdst2] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.ceder-switch-label[b-ydi9xgdst2] {
    display: flex;
    flex-direction: column;
}

    .ceder-switch-label strong[b-ydi9xgdst2] {
        font-size: 0.85rem;
        color: var(--text);
    }

    .ceder-switch-label small[b-ydi9xgdst2] {
        font-size: var(--text-xs);
        color: var(--text-secondary);
    }

.ceder-actions[b-ydi9xgdst2] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding-top: 4px;
}

.cd-btn-modal[b-ydi9xgdst2] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 9px 18px;
    border: none;
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    font-weight: var(--fw-bold);
    cursor: pointer;
    transition: var(--transition);
    color: white;
}

.cd-btn-cancelar[b-ydi9xgdst2] {
    background: var(--color-secondary);
}

    .cd-btn-cancelar:hover:not(:disabled)[b-ydi9xgdst2] {
        background: var(--color-secondary-dark);
    }

.cd-btn-confirmar[b-ydi9xgdst2] {
    background: var(--color-primary);
}

    .cd-btn-confirmar:hover:not(:disabled)[b-ydi9xgdst2] {
        background: var(--color-primary-dark);
    }

.cd-btn-modal:disabled[b-ydi9xgdst2] {
    opacity: 0.55;
    cursor: not-allowed;
}

.spinning[b-ydi9xgdst2] {
    animation: cdSpinModal-b-ydi9xgdst2 0.8s linear infinite;
}

@keyframes cdSpinModal-b-ydi9xgdst2 {
    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 1024px) {
    .ceder-grid-2[b-ydi9xgdst2] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Procesos/Cesion/CesionElectronica/Componentes/CesionMasivaDialog.razor.rz.scp.css */
/* CesionMasivaDialog — estilos aislados. Tokens en wwwroot/css/design-tokens.css.
   Reutiliza el lenguaje visual de CederDocumentoDialog (secciones, inputs 30px). */

.masiva-modal[b-yabztnsd2m] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 4px 4px 0 4px;
    font-family: var(--font-family);
}

.masiva-section[b-yabztnsd2m] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 12px 14px;
    box-shadow: var(--shadow-xs);
}

    .masiva-section h4[b-yabztnsd2m] {
        margin: 0 0 10px 0;
        font-size: 0.85rem;
        font-weight: var(--fw-bold);
        color: var(--text);
        display: flex;
        align-items: center;
        gap: 6px;
        text-transform: uppercase;
        letter-spacing: 0.04em;
    }

        .masiva-section h4 .rzi[b-yabztnsd2m] {
            color: var(--color-primary);
            font-size: 1.05rem;
        }

/* ===== Resumen del lote ===== */
.masiva-resumen[b-yabztnsd2m] {
    display: flex;
    flex-wrap: wrap;
    gap: 22px;
    align-items: center;
}

.masiva-resumen-item[b-yabztnsd2m] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.masiva-resumen-label[b-yabztnsd2m] {
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.masiva-resumen-valor[b-yabztnsd2m] {
    font-size: 1.05rem;
    font-weight: var(--fw-bold);
    color: var(--text);
}

.masiva-resumen-ok .masiva-resumen-valor[b-yabztnsd2m] {
    color: var(--color-success);
}

.masiva-resumen-err .masiva-resumen-valor[b-yabztnsd2m] {
    color: var(--color-danger);
}

.masiva-resumen-ref[b-yabztnsd2m] {
    margin-left: auto;
    text-align: right;
}

    .masiva-resumen-ref .masiva-resumen-valor[b-yabztnsd2m] {
        font-family: var(--font-mono, monospace);
        font-size: 0.85rem;
        color: var(--text-secondary);
        letter-spacing: 0.06em;
    }

/* ===== Campos / inputs ===== */
.masiva-grid-2[b-yabztnsd2m] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px 14px;
}

.masiva-field[b-yabztnsd2m] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

    .masiva-field.full-width[b-yabztnsd2m] {
        grid-column: 1 / -1;
    }

    .masiva-field label[b-yabztnsd2m] {
        font-size: var(--text-xs);
        font-weight: var(--fw-semibold);
        color: var(--text-secondary);
        text-transform: uppercase;
        letter-spacing: 0.03em;
    }

.masiva-hint[b-yabztnsd2m] {
    font-size: var(--text-xs);
    color: var(--text-muted);
}

.masiva-field[b-yabztnsd2m]  .rz-textbox,
.masiva-field[b-yabztnsd2m]  .rz-calendar,
.masiva-field[b-yabztnsd2m]  .rz-dropdown,
.masiva-field[b-yabztnsd2m]  input {
    border: 1.5px solid var(--border) !important;
    border-radius: var(--radius-sm) !important;
    font-size: 0.78rem !important;
    height: 30px !important;
    background: white !important;
}

.masiva-loading[b-yabztnsd2m],
.masiva-empty[b-yabztnsd2m] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    padding: 8px 4px;
}

.masiva-empty[b-yabztnsd2m] {
    color: #B45309;
    background: #FFFBEB;
    border-left: 3px solid var(--color-warning);
    border-radius: var(--radius-xs);
    padding: 8px 10px;
}

.masiva-switch-row[b-yabztnsd2m] {
    flex-direction: row;
    align-items: center;
    gap: 12px;
}

.masiva-switch-label[b-yabztnsd2m] {
    display: flex;
    flex-direction: column;
}

    .masiva-switch-label strong[b-yabztnsd2m] {
        font-size: 0.85rem;
        color: var(--text);
    }

    .masiva-switch-label small[b-yabztnsd2m] {
        font-size: var(--text-xs);
        color: var(--text-secondary);
    }

/* ===== Grilla de resultados ===== */
.masiva-resultados[b-yabztnsd2m]  .rz-datatable {
    font-size: 0.78rem;
}

.masiva-resultados[b-yabztnsd2m]  .rz-datatable-thead > tr > th {
    background: var(--bg) !important;
    color: var(--text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.68rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 7px 10px !important;
}

.masiva-resultados[b-yabztnsd2m]  .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
}

.masiva-estado[b-yabztnsd2m] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-weight: var(--fw-bold);
    font-size: 0.74rem;
    padding: 2px 8px;
    border-radius: 999px;
}

    .masiva-estado .rzi[b-yabztnsd2m] {
        font-size: 0.95rem;
    }

.masiva-estado-pendiente[b-yabztnsd2m] {
    color: var(--text-secondary);
    background: #F1F5F9;
}

.masiva-estado-procesando[b-yabztnsd2m] {
    color: var(--color-info);
    background: var(--color-info-light);
}

.masiva-estado-exito[b-yabztnsd2m] {
    color: var(--color-success);
    background: var(--color-success-light);
}

.masiva-estado-error[b-yabztnsd2m] {
    color: var(--color-danger);
    background: var(--color-danger-light);
}

.masiva-detalle[b-yabztnsd2m] {
    font-size: 0.74rem;
    color: var(--text-secondary);
}

.masiva-retry-btn[b-yabztnsd2m] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border: 1px solid var(--color-warning);
    background: #FFFBEB;
    color: var(--color-warning-dark, #B45309);
    border-radius: var(--radius-xs);
    font-size: 0.72rem;
    font-weight: var(--fw-bold);
    padding: 3px 8px;
    cursor: pointer;
    transition: var(--transition);
}

    .masiva-retry-btn:hover:not(:disabled)[b-yabztnsd2m] {
        background: var(--color-warning);
        color: white;
    }

    .masiva-retry-btn:disabled[b-yabztnsd2m] {
        opacity: 0.5;
        cursor: not-allowed;
    }

    .masiva-retry-btn .rzi[b-yabztnsd2m] {
        font-size: 0.85rem;
    }

/* ===== Acciones ===== */
.masiva-actions[b-yabztnsd2m] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding-top: 4px;
}

.cd-btn-modal[b-yabztnsd2m] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 9px 18px;
    border: none;
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    font-weight: var(--fw-bold);
    cursor: pointer;
    transition: var(--transition);
    color: white;
}

.cd-btn-cancelar[b-yabztnsd2m] {
    background: var(--color-secondary);
}

    .cd-btn-cancelar:hover:not(:disabled)[b-yabztnsd2m] {
        background: var(--color-secondary-dark);
    }

.cd-btn-confirmar[b-yabztnsd2m] {
    background: var(--color-primary);
}

    .cd-btn-confirmar:hover:not(:disabled)[b-yabztnsd2m] {
        background: var(--color-primary-dark);
    }

.cd-btn-retry[b-yabztnsd2m] {
    background: var(--color-warning);
}

    .cd-btn-retry:hover:not(:disabled)[b-yabztnsd2m] {
        background: var(--color-warning-dark, #B45309);
    }

.cd-btn-modal:disabled[b-yabztnsd2m] {
    opacity: 0.55;
    cursor: not-allowed;
}

.spinning[b-yabztnsd2m] {
    animation: cdSpinMasiva-b-yabztnsd2m 0.8s linear infinite;
}

@keyframes cdSpinMasiva-b-yabztnsd2m {
    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 1024px) {
    .masiva-grid-2[b-yabztnsd2m] {
        grid-template-columns: 1fr;
    }

    .masiva-resumen-ref[b-yabztnsd2m] {
        margin-left: 0;
    }
}
/* /Pages/Procesos/Cesion/ConsultaCesiones/ConsultaCesionesIndex.razor.rz.scp.css */
/* ===== CONSULTA DOCUMENTOS CEDIDOS - DESIGN SYSTEM ===== */
/* Reutiliza el design system de Pages/ConsultaDocumentos/DocumentosEmitidos/ConsultaDocumentos.razor.css */

/* Variables CSS del módulo */
.consulta-container[b-k3m6sf6iid] {
    --cd-primary: var(--color-primary);
    --cd-primary-dark: var(--color-primary-dark);
    --cd-primary-light: var(--color-primary-light);
    --cd-accent: var(--color-warning);
    --cd-accent-dark: var(--color-warning-dark);
    --cd-accent-light: #FFFBEB;
    --cd-success: var(--color-success);
    --cd-success-light: var(--color-success-light);
    --cd-danger: var(--color-danger);
    --cd-danger-light: var(--color-danger-light);
    --cd-info: var(--color-info);
    --cd-info-light: var(--color-info-light);
    --cd-orange: var(--color-accent);
    --cd-orange-dark: var(--color-accent-dark);
    --cd-preview: var(--color-preview);
    --cd-preview-dark: var(--color-preview-dark);
    --cd-bg: var(--bg);
    --cd-card: var(--surface);
    --cd-text: var(--text);
    --cd-text-secondary: var(--text-secondary);
    --cd-text-muted: var(--text-muted);
    --cd-border: var(--border);
    --cd-shadow-sm: var(--shadow-xs);
    --cd-shadow: var(--shadow-sm);
    --cd-shadow-md: var(--shadow-md);
    --cd-shadow-lg: var(--shadow-lg);
    --cd-radius: var(--radius-lg);
    --cd-radius-sm: var(--radius-md);
    --cd-radius-xs: var(--radius-sm);
    --cd-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--cd-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.consulta-control-bar[b-k3m6sf6iid] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    padding: 8px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 48px;
}

/* Sección izquierda: cantidad de registros */
.control-left[b-k3m6sf6iid] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.control-left label[b-k3m6sf6iid] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    white-space: nowrap;
}

[b-k3m6sf6iid] .control-left .rz-spinner {
    width: 75px !important;
    border-radius: var(--cd-radius-xs) !important;
}

[b-k3m6sf6iid] .control-left .rz-spinner input {
    height: 32px !important;
    font-size: 0.8rem !important;
}

/* Sección central: indicador de carga */
.control-center[b-k3m6sf6iid] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loading-indicator[b-k3m6sf6iid] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: cdFadeIn-b-k3m6sf6iid 0.3s ease;
}

.loading-spinner[b-k3m6sf6iid] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--cd-border);
    border-top-color: var(--cd-primary);
    border-radius: 50%;
    animation: cdSpin-b-k3m6sf6iid 0.8s linear infinite;
}

.loading-text[b-k3m6sf6iid] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--cd-primary);
    animation: cdPulse-b-k3m6sf6iid 1.5s ease-in-out infinite;
}

/* Sección derecha: botones de acción */
.control-right[b-k3m6sf6iid] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES DE ACCIÓN ===== */
.cd-btn[b-k3m6sf6iid] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cd-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cd-transition);
    white-space: nowrap;
    color: white;
}

.cd-btn:hover[b-k3m6sf6iid] {
    transform: translateY(-1px);
    box-shadow: var(--cd-shadow-md);
}

.cd-btn:active[b-k3m6sf6iid] {
    transform: translateY(0);
}

.cd-btn .rzi[b-k3m6sf6iid] {
    font-size: 1rem;
}

.btn-buscar[b-k3m6sf6iid] {
    background: var(--cd-orange);
}

.btn-exportar[b-k3m6sf6iid] {
    background: var(--cd-success);
}

.btn-actualizar[b-k3m6sf6iid] {
    background: var(--cd-primary);
}

.btn-actualizar:disabled[b-k3m6sf6iid] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.btn-actualizar:disabled:hover[b-k3m6sf6iid] {
    transform: none;
    box-shadow: none;
}

/* Ícono girando mientras se actualizan los estados. */
.spin-rzi[b-k3m6sf6iid] {
    display: inline-block;
    animation: cdSpin-b-k3m6sf6iid 0.8s linear infinite;
}

.btn-filtros[b-k3m6sf6iid] {
    background: var(--cd-info);
}

.btn-filtros.active[b-k3m6sf6iid] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* ===== PANEL DE FILTROS ===== */
.filtros-wrapper[b-k3m6sf6iid] {
    position: relative;
    flex-shrink: 0;
}

.filtros-panel[b-k3m6sf6iid] {
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow-md);
    overflow: hidden;
    animation: cdSlideDown-b-k3m6sf6iid 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.filtros-header[b-k3m6sf6iid] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--cd-border);
    background: linear-gradient(135deg, var(--cd-info-light) 0%, var(--cd-card) 100%);
}

.filtros-header h3[b-k3m6sf6iid] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--cd-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.filtros-header h3 .rzi[b-k3m6sf6iid] {
    color: var(--cd-info);
    font-size: 1.1rem;
}

.filtros-close-btn[b-k3m6sf6iid] {
    background: none;
    border: none;
    color: var(--cd-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--cd-radius-xs);
    transition: var(--cd-transition);
    display: flex;
    align-items: center;
}

.filtros-close-btn:hover[b-k3m6sf6iid] {
    background: var(--cd-danger-light);
    color: var(--cd-danger);
}

.filtros-body[b-k3m6sf6iid] {
    padding: 12px 16px;
}

.filtros-grid[b-k3m6sf6iid] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.filtro-field[b-k3m6sf6iid] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.filtro-label[b-k3m6sf6iid] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Inputs personalizados dentro de filtros - bordes visibles sutiles */
.filtro-field[b-k3m6sf6iid]  .rz-textbox,
.filtro-field[b-k3m6sf6iid]  .rz-spinner,
.filtro-field[b-k3m6sf6iid]  .rz-inputtext,
.filtro-field[b-k3m6sf6iid]  .rz-calendar,
.filtro-field[b-k3m6sf6iid]  .rz-numeric,
.filtro-field[b-k3m6sf6iid]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
}

.filtro-field[b-k3m6sf6iid]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.filtro-field[b-k3m6sf6iid]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.filtro-field[b-k3m6sf6iid]  .rz-textbox:focus,
.filtro-field[b-k3m6sf6iid]  .rz-state-focused,
.filtro-field[b-k3m6sf6iid]  input:focus,
.filtro-field[b-k3m6sf6iid]  .rz-calendar:focus-within,
.filtro-field[b-k3m6sf6iid]  .rz-numeric:focus-within {
    border-color: var(--cd-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

/* Texto del dropdown visible sin recorte */
.filtro-field[b-k3m6sf6iid]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== GRILLA DE DATOS ===== */
.consulta-grid-wrapper[b-k3m6sf6iid] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    overflow: hidden;
    min-height: 0;
}

[b-k3m6sf6iid] .consulta-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-k3m6sf6iid] .consulta-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

[b-k3m6sf6iid] .consulta-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--cd-bg) !important;
    color: var(--cd-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--cd-border) !important;
}

[b-k3m6sf6iid] .consulta-grid-wrapper .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
}

[b-k3m6sf6iid] .consulta-grid-wrapper .rz-datatable-tbody > tr:hover {
    background-color: var(--cd-primary-light) !important;
}

[b-k3m6sf6iid] .consulta-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* Botones de acción en la grilla */
.grid-actions[b-k3m6sf6iid] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.grid-action-btn[b-k3m6sf6iid] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--cd-radius-xs);
    cursor: pointer;
    transition: var(--cd-transition);
    padding: 0;
    color: white;
    font-size: 0.85rem;
}

.grid-action-btn:hover[b-k3m6sf6iid] {
    transform: scale(1.12);
    box-shadow: var(--cd-shadow-md);
}

.grid-action-btn:active[b-k3m6sf6iid] {
    transform: scale(0.95);
}

/* Estado disabled comun a todos los grid-action-btn. */
.grid-action-btn:disabled[b-k3m6sf6iid] {
    opacity: 0.45;
    cursor: not-allowed;
    filter: grayscale(0.5);
}

.grid-action-btn:disabled:hover[b-k3m6sf6iid] {
    transform: none;
    box-shadow: none;
}

/* Botón "Verificar estado de la cesión en el SII" (info/teal). */
.grid-btn-verificar[b-k3m6sf6iid] {
    background: var(--cd-info);
}

.grid-btn-verificar:hover[b-k3m6sf6iid] {
    background: #0284C7;
}

/* Botón "Descargar archivo AEC" (success/verde). */
.grid-btn-descargar[b-k3m6sf6iid] {
    background: var(--cd-success, #16A34A);
}

.grid-btn-descargar:hover[b-k3m6sf6iid] {
    background: #15803D;
}

/* ===== ANIMACIONES ===== */
@keyframes cdSpin-b-k3m6sf6iid {
    to { transform: rotate(360deg); }
}

@keyframes cdPulse-b-k3m6sf6iid {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

@keyframes cdFadeIn-b-k3m6sf6iid {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes cdSlideDown-b-k3m6sf6iid {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

@keyframes cdOverlayIn-b-k3m6sf6iid {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes cdModalIn-b-k3m6sf6iid {
    from { opacity: 0; transform: scale(0.92) translateY(10px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}

/* ===== RESPONSIVE: TABLET ===== */
@media (max-width: 1024px) {
    .consulta-container[b-k3m6sf6iid] {
        padding: 8px 10px;
        gap: 8px;
    }

    .consulta-control-bar[b-k3m6sf6iid] {
        flex-wrap: wrap;
        padding: 8px 12px;
    }

    .control-center[b-k3m6sf6iid] {
        order: 3;
        width: 100%;
    }

    .filtros-grid[b-k3m6sf6iid] {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
}

/* ===== RESPONSIVE: MOBILE ===== */
@media (max-width: 640px) {
    .consulta-container[b-k3m6sf6iid] {
        padding: 6px 8px;
        gap: 6px;
    }

    .consulta-control-bar[b-k3m6sf6iid] {
        flex-direction: column;
        gap: 8px;
    }

    .control-left[b-k3m6sf6iid],
    .control-right[b-k3m6sf6iid] {
        width: 100%;
        justify-content: center;
    }

    .control-right[b-k3m6sf6iid] {
        flex-wrap: wrap;
    }

    .cd-btn[b-k3m6sf6iid] {
        flex: 1;
        justify-content: center;
        min-width: 0;
    }

    .cd-btn span:not(.material-icons):not(.rzi)[b-k3m6sf6iid] {
        display: none;
    }

    .filtros-grid[b-k3m6sf6iid] {
        grid-template-columns: 1fr;
    }
}

/* ===== BADGE DE ESTADO ===== */
.cd-estado-badge[b-k3m6sf6iid] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

/* Rechazado => rojo */
.cd-estado-badge.cd-estado-rechazado[b-k3m6sf6iid] {
    background: #FEE2E2;
    color: #B91C1C;
}

/* Aceptado => verde */
.cd-estado-badge.cd-estado-aceptado[b-k3m6sf6iid] {
    background: #D1FAE5;
    color: #047857;
}

/* En proceso / pendiente => gris de fondo, texto azul */
.cd-estado-badge.cd-estado-pendiente[b-k3m6sf6iid] {
    background: #E5E7EB;
    color: #0369A1;
}

/* Cualquier otro estado => gris */
.cd-estado-badge.cd-estado-otro[b-k3m6sf6iid] {
    background: #E5E7EB;
    color: #4B5563;
}
/* /Pages/Procesos/DetalleRespuestaSII/DetalleRespuestaSII.razor.rz.scp.css */
/* ===== DETALLE RESPUESTA SII - DESIGN SYSTEM ===== */

.consulta-container[b-3zgxlbzt1g] {
    --cd-primary: var(--color-primary);
    --cd-primary-dark: var(--color-primary-dark);
    --cd-primary-light: var(--color-primary-light);
    --cd-accent: var(--color-warning);
    --cd-accent-dark: var(--color-warning-dark);
    --cd-accent-light: #FFFBEB;
    --cd-success: var(--color-success);
    --cd-success-light: var(--color-success-light);
    --cd-danger: var(--color-danger);
    --cd-danger-light: var(--color-danger-light);
    --cd-info: var(--color-info);
    --cd-info-light: var(--color-info-light);
    --cd-orange: var(--color-accent);
    --cd-orange-dark: var(--color-accent-dark);
    --cd-preview: var(--color-preview);
    --cd-preview-dark: var(--color-preview-dark);
    --cd-detail: var(--color-detail);
    --cd-detail-dark: var(--color-detail-dark);
    --cd-bg: var(--bg);
    --cd-card: var(--surface);
    --cd-text: var(--text);
    --cd-text-secondary: var(--text-secondary);
    --cd-text-muted: var(--text-muted);
    --cd-border: var(--border);
    --cd-shadow-sm: var(--shadow-xs);
    --cd-shadow: var(--shadow-sm);
    --cd-shadow-md: var(--shadow-md);
    --cd-shadow-lg: var(--shadow-lg);
    --cd-radius: var(--radius-lg);
    --cd-radius-sm: var(--radius-md);
    --cd-radius-xs: var(--radius-sm);
    --cd-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--cd-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.consulta-control-bar[b-3zgxlbzt1g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    padding: 8px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 48px;
}

.control-left[b-3zgxlbzt1g] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.control-left label[b-3zgxlbzt1g] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    white-space: nowrap;
}

[b-3zgxlbzt1g] .control-left .rz-spinner {
    width: 75px !important;
    border-radius: var(--cd-radius-xs) !important;
}

[b-3zgxlbzt1g] .control-left .rz-spinner input {
    height: 32px !important;
    font-size: 0.8rem !important;
}

.control-center[b-3zgxlbzt1g] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loading-indicator[b-3zgxlbzt1g] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: cdFadeIn-b-3zgxlbzt1g 0.3s ease;
}

.loading-spinner[b-3zgxlbzt1g] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--cd-border);
    border-top-color: var(--cd-primary);
    border-radius: 50%;
    animation: cdSpin-b-3zgxlbzt1g 0.8s linear infinite;
}

.loading-text[b-3zgxlbzt1g] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--cd-primary);
    animation: cdPulse-b-3zgxlbzt1g 1.5s ease-in-out infinite;
}

.control-right[b-3zgxlbzt1g] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES DE ACCIÓN ===== */
.cd-btn[b-3zgxlbzt1g] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cd-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cd-transition);
    white-space: nowrap;
    color: white;
}

.cd-btn:hover[b-3zgxlbzt1g] {
    transform: translateY(-1px);
    box-shadow: var(--cd-shadow-md);
}

.cd-btn:active[b-3zgxlbzt1g] {
    transform: translateY(0);
}

.cd-btn .rzi[b-3zgxlbzt1g] {
    font-size: 1rem;
}

.btn-buscar[b-3zgxlbzt1g] {
    background: var(--cd-orange);
}

.btn-exportar[b-3zgxlbzt1g] {
    background: var(--cd-success);
}

.btn-filtros[b-3zgxlbzt1g] {
    background: var(--cd-info);
}

.btn-filtros.active[b-3zgxlbzt1g] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* ===== PANEL DE FILTROS ===== */
.filtros-wrapper[b-3zgxlbzt1g] {
    position: relative;
    flex-shrink: 0;
}

.filtros-panel[b-3zgxlbzt1g] {
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow-md);
    overflow: hidden;
    animation: cdSlideDown-b-3zgxlbzt1g 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.filtros-header[b-3zgxlbzt1g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--cd-border);
    background: linear-gradient(135deg, var(--cd-info-light) 0%, var(--cd-card) 100%);
}

.filtros-header h3[b-3zgxlbzt1g] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--cd-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.filtros-header h3 .rzi[b-3zgxlbzt1g] {
    color: var(--cd-info);
    font-size: 1.1rem;
}

.filtros-close-btn[b-3zgxlbzt1g] {
    background: none;
    border: none;
    color: var(--cd-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--cd-radius-xs);
    transition: var(--cd-transition);
    display: flex;
    align-items: center;
}

.filtros-close-btn:hover[b-3zgxlbzt1g] {
    background: var(--cd-danger-light);
    color: var(--cd-danger);
}

.filtros-body[b-3zgxlbzt1g] {
    padding: 12px 16px;
}

.filtros-grid[b-3zgxlbzt1g] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.filtro-field[b-3zgxlbzt1g] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.filtro-label[b-3zgxlbzt1g] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.filtro-field[b-3zgxlbzt1g]  .rz-textbox,
.filtro-field[b-3zgxlbzt1g]  .rz-spinner,
.filtro-field[b-3zgxlbzt1g]  .rz-inputtext,
.filtro-field[b-3zgxlbzt1g]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
}

.filtro-field[b-3zgxlbzt1g]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.filtro-field[b-3zgxlbzt1g]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.filtro-field[b-3zgxlbzt1g]  .rz-textbox:focus,
.filtro-field[b-3zgxlbzt1g]  .rz-state-focused,
.filtro-field[b-3zgxlbzt1g]  input:focus {
    border-color: var(--cd-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

.filtro-field[b-3zgxlbzt1g]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.filtros-actions-bar[b-3zgxlbzt1g] {
    display: flex;
    justify-content: flex-end;
    margin-top: 10px;
}

/* El boton "Limpiar" usa la clase global .btn-limpiar (app.css): solido plomo con icono
   cleaning_services. No se redefine aqui para no romper la unificacion. */

/* ===== GRILLA DE DATOS ===== */
.consulta-grid-wrapper[b-3zgxlbzt1g] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    overflow: hidden;
    min-height: 0;
}

[b-3zgxlbzt1g] .consulta-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

[b-3zgxlbzt1g] .consulta-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--cd-text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

[b-3zgxlbzt1g] .consulta-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--cd-bg) !important;
    color: var(--cd-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--cd-border) !important;
}

[b-3zgxlbzt1g] .consulta-grid-wrapper .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
}

[b-3zgxlbzt1g] .consulta-grid-wrapper .rz-datatable-tbody > tr:hover {
    background-color: var(--cd-primary-light) !important;
}

[b-3zgxlbzt1g] .consulta-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* Botones de acción en la grilla */
.grid-actions[b-3zgxlbzt1g] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.grid-action-btn[b-3zgxlbzt1g] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--cd-radius-xs);
    cursor: pointer;
    transition: var(--cd-transition);
    padding: 0;
    color: white;
    font-size: 0.85rem;
}

.grid-action-btn:hover[b-3zgxlbzt1g] {
    transform: scale(1.12);
    box-shadow: var(--cd-shadow-md);
}

.grid-action-btn:active[b-3zgxlbzt1g] {
    transform: scale(0.95);
}

/* Botón Ver Detalle — periwinkle (color dedicado "Ver detalle") */
.grid-btn-detalle[b-3zgxlbzt1g] {
    background: var(--cd-detail);
}

.grid-btn-detalle:hover[b-3zgxlbzt1g] {
    background: var(--cd-detail-dark);
}

/* Botón Enviar Correo SII — teal */
.grid-btn-envio-correo[b-3zgxlbzt1g] {
    background: var(--cd-preview);
}

.grid-btn-envio-correo:hover[b-3zgxlbzt1g] {
    background: var(--cd-preview-dark);
}

/* ===== Contenido del modal "Detalle Respuesta SII" ===== */
.detalle-modal[b-3zgxlbzt1g] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    font-family: var(--font-family);
}

.detalle-row[b-3zgxlbzt1g] {
    display: flex;
    align-items: baseline;
    gap: var(--space-2);
}

.detalle-label[b-3zgxlbzt1g] {
    flex: 0 0 90px;
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    color: var(--cd-text-secondary);
}

.detalle-value[b-3zgxlbzt1g] {
    font-size: var(--text-base);
    color: var(--cd-text);
    word-break: break-word;
}

.detalle-respuesta[b-3zgxlbzt1g] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.detalle-respuesta-box[b-3zgxlbzt1g] {
    margin-top: var(--space-1);
    max-height: 320px;
    overflow: auto;
    padding: var(--space-3);
    background: var(--cd-bg);
    border: 1px solid var(--cd-border);
    border-radius: var(--cd-radius-xs);
    font-size: var(--text-sm);
    color: var(--cd-text);
    white-space: pre-wrap;
    word-break: break-word;
    line-height: 1.5;
}

[b-3zgxlbzt1g] .consulta-grid-wrapper .rz-frozen-cell-right {
    box-shadow: -3px 0 5px -2px rgba(0,0,0,0.08);
}

[b-3zgxlbzt1g] .consulta-grid-wrapper .rz-frozen-cell-right.rz-data-cell {
    background: var(--cd-card) !important;
}

[b-3zgxlbzt1g] .consulta-grid-wrapper tr:hover .rz-frozen-cell-right.rz-data-cell {
    background: var(--cd-primary-light) !important;
}

/* ===== ANIMACIONES ===== */
@keyframes cdSpin-b-3zgxlbzt1g {
    to { transform: rotate(360deg); }
}

@keyframes cdPulse-b-3zgxlbzt1g {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

@keyframes cdFadeIn-b-3zgxlbzt1g {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes cdSlideDown-b-3zgxlbzt1g {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

/* ===== RESPONSIVE: TABLET ===== */
@media (max-width: 1024px) {
    .consulta-container[b-3zgxlbzt1g] {
        padding: 8px 10px;
        gap: 8px;
    }

    .consulta-control-bar[b-3zgxlbzt1g] {
        flex-wrap: wrap;
        padding: 8px 12px;
    }

    .control-center[b-3zgxlbzt1g] {
        order: 3;
        width: 100%;
    }

    .filtros-grid[b-3zgxlbzt1g] {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
}

/* ===== RESPONSIVE: MOBILE ===== */
@media (max-width: 640px) {
    .consulta-container[b-3zgxlbzt1g] {
        padding: 6px 8px;
        gap: 6px;
    }

    .consulta-control-bar[b-3zgxlbzt1g] {
        flex-direction: column;
        gap: 8px;
    }

    .control-left[b-3zgxlbzt1g],
    .control-right[b-3zgxlbzt1g] {
        width: 100%;
        justify-content: center;
    }

    .control-right[b-3zgxlbzt1g] {
        flex-wrap: wrap;
    }

    .cd-btn[b-3zgxlbzt1g] {
        flex: 1;
        justify-content: center;
        min-width: 0;
    }

    .cd-btn span:not(.material-icons):not(.rzi)[b-3zgxlbzt1g] {
        display: none;
    }

    .filtros-grid[b-3zgxlbzt1g] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Procesos/GestionDteProblemas/GestionDteProblemas.razor.rz.scp.css */
/* ===== GESTIÓN DTE CON PROBLEMAS - REUTILIZA DESIGN SYSTEM DE CONSULTA DOCUMENTOS ===== */

.consulta-container[b-i6zkgvh47n] {
    --cd-primary: var(--color-primary);
    --cd-primary-dark: var(--color-primary-dark);
    --cd-primary-light: var(--color-primary-light);
    --cd-accent: var(--color-warning);
    --cd-accent-dark: var(--color-warning-dark);
    --cd-accent-light: #FFFBEB;
    --cd-success: var(--color-success);
    --cd-success-light: var(--color-success-light);
    --cd-danger: var(--color-danger);
    --cd-danger-light: var(--color-danger-light);
    --cd-info: var(--color-info);
    --cd-info-light: var(--color-info-light);
    --cd-orange: var(--color-accent);
    --cd-orange-dark: var(--color-accent-dark);
    --cd-warning: var(--color-warning);
    --cd-warning-dark: var(--color-warning-dark);
    --cd-bg: var(--bg);
    --cd-card: var(--surface);
    --cd-text: var(--text);
    --cd-text-secondary: var(--text-secondary);
    --cd-text-muted: var(--text-muted);
    --cd-border: var(--border);
    --cd-shadow-sm: var(--shadow-xs);
    --cd-shadow: var(--shadow-sm);
    --cd-shadow-md: var(--shadow-md);
    --cd-shadow-lg: var(--shadow-lg);
    --cd-radius: var(--radius-lg);
    --cd-radius-sm: var(--radius-md);
    --cd-radius-xs: var(--radius-sm);
    --cd-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--cd-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.consulta-control-bar[b-i6zkgvh47n] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    padding: 8px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 48px;
}

.control-left[b-i6zkgvh47n] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.gdp-title-icon[b-i6zkgvh47n] {
    color: var(--cd-danger);
    font-size: 1.4rem;
}

.gdp-title[b-i6zkgvh47n] {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--cd-text);
}

.control-center[b-i6zkgvh47n] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loading-indicator[b-i6zkgvh47n] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: cdFadeIn-b-i6zkgvh47n 0.3s ease;
}

.loading-spinner[b-i6zkgvh47n] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--cd-border);
    border-top-color: var(--cd-primary);
    border-radius: 50%;
    animation: cdSpin-b-i6zkgvh47n 0.8s linear infinite;
}

.loading-text[b-i6zkgvh47n] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--cd-primary);
    animation: cdPulse-b-i6zkgvh47n 1.5s ease-in-out infinite;
}

.control-right[b-i6zkgvh47n] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES ===== */
.cd-btn[b-i6zkgvh47n] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--cd-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cd-transition);
    white-space: nowrap;
    color: white;
}

.cd-btn:hover[b-i6zkgvh47n] {
    transform: translateY(-1px);
    box-shadow: var(--cd-shadow-md);
}

.cd-btn:active[b-i6zkgvh47n] {
    transform: translateY(0);
}

.cd-btn .rzi[b-i6zkgvh47n] {
    font-size: 1rem;
}

.btn-buscar[b-i6zkgvh47n] {
    background: var(--cd-orange);
}

.btn-exportar[b-i6zkgvh47n] {
    background: var(--cd-success);
}

.btn-filtros[b-i6zkgvh47n] {
    background: var(--cd-info);
}

.btn-filtros.active[b-i6zkgvh47n] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* ===== PANEL DE FILTROS ===== */
.filtros-wrapper[b-i6zkgvh47n] {
    position: relative;
    flex-shrink: 0;
}

.filtros-panel[b-i6zkgvh47n] {
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow-md);
    overflow: hidden;
    animation: cdSlideDown-b-i6zkgvh47n 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.filtros-header[b-i6zkgvh47n] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--cd-border);
    background: linear-gradient(135deg, var(--cd-info-light) 0%, var(--cd-card) 100%);
}

.filtros-header h3[b-i6zkgvh47n] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--cd-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.filtros-header h3 .rzi[b-i6zkgvh47n] {
    color: var(--cd-info);
    font-size: 1.1rem;
}

.filtros-close-btn[b-i6zkgvh47n] {
    background: none;
    border: none;
    color: var(--cd-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--cd-radius-xs);
    transition: var(--cd-transition);
    display: flex;
    align-items: center;
}

.filtros-close-btn:hover[b-i6zkgvh47n] {
    background: var(--cd-danger-light);
    color: var(--cd-danger);
}

.filtros-body[b-i6zkgvh47n] {
    padding: 12px 16px;
}

.filtros-grid[b-i6zkgvh47n] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.filtro-field[b-i6zkgvh47n] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.filtro-label[b-i6zkgvh47n] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--cd-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.filtro-field[b-i6zkgvh47n]  .rz-textbox,
.filtro-field[b-i6zkgvh47n]  .rz-spinner,
.filtro-field[b-i6zkgvh47n]  .rz-inputtext,
.filtro-field[b-i6zkgvh47n]  .rz-calendar,
.filtro-field[b-i6zkgvh47n]  .rz-numeric,
.filtro-field[b-i6zkgvh47n]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
}

.filtro-field[b-i6zkgvh47n]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--cd-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--cd-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.filtro-field[b-i6zkgvh47n]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.filtro-field[b-i6zkgvh47n]  .rz-textbox:focus,
.filtro-field[b-i6zkgvh47n]  .rz-state-focused,
.filtro-field[b-i6zkgvh47n]  input:focus,
.filtro-field[b-i6zkgvh47n]  .rz-calendar:focus-within,
.filtro-field[b-i6zkgvh47n]  .rz-numeric:focus-within {
    border-color: var(--cd-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

.filtro-field[b-i6zkgvh47n]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== GRILLA ===== */
.consulta-grid-wrapper[b-i6zkgvh47n] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--cd-card);
    border-radius: var(--cd-radius);
    box-shadow: var(--cd-shadow);
    overflow: hidden;
    min-height: 0;
}

[b-i6zkgvh47n] .consulta-grid-wrapper .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-i6zkgvh47n] .consulta-grid-wrapper .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

[b-i6zkgvh47n] .consulta-grid-wrapper .rz-datatable-thead > tr > th {
    background: var(--cd-bg) !important;
    color: var(--cd-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--cd-border) !important;
}

[b-i6zkgvh47n] .consulta-grid-wrapper .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
    cursor: pointer;
}

[b-i6zkgvh47n] .consulta-grid-wrapper .rz-datatable-tbody > tr:hover {
    background-color: var(--cd-primary-light) !important;
}

[b-i6zkgvh47n] .consulta-grid-wrapper .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* Botones de acción en la grilla */
.grid-actions[b-i6zkgvh47n] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.grid-action-btn[b-i6zkgvh47n] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--cd-radius-xs);
    cursor: pointer;
    transition: var(--cd-transition);
    padding: 0;
    color: white;
    font-size: 0.85rem;
}

.grid-action-btn:hover[b-i6zkgvh47n] {
    transform: scale(1.12);
    box-shadow: var(--cd-shadow-md);
}

.grid-action-btn:active[b-i6zkgvh47n] {
    transform: scale(0.95);
}

.grid-btn-reprocesar[b-i6zkgvh47n] {
    background: var(--cd-warning);
}

.grid-btn-reprocesar:hover[b-i6zkgvh47n] {
    background: var(--cd-warning-dark);
}

/* ===== PANEL DE DETALLE (FILA EXPANDIDA) ===== */
.gdp-detail-panel[b-i6zkgvh47n] {
    background: #FAFBFC;
    border-left: 3px solid var(--cd-danger);
    padding: 12px 16px;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    animation: cdFadeIn-b-i6zkgvh47n 0.25s ease;
}

.gdp-detail-header[b-i6zkgvh47n] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    color: var(--cd-text);
}

.gdp-detail-header .rzi[b-i6zkgvh47n] {
    color: var(--cd-danger);
    font-size: 1.1rem;
}

.gdp-detail-sub[b-i6zkgvh47n] {
    color: var(--cd-text-secondary);
    font-size: 0.78rem;
    font-weight: 500;
    margin-left: 4px;
}

.gdp-detail-loading[b-i6zkgvh47n] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 0;
    color: var(--cd-text-secondary);
    font-size: 0.82rem;
}

.gdp-detail-empty[b-i6zkgvh47n] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: var(--cd-info-light);
    border-radius: var(--cd-radius-xs);
    color: var(--cd-text-secondary);
    font-size: 0.82rem;
}

.gdp-detail-empty .rzi[b-i6zkgvh47n] {
    color: var(--cd-info);
}

[b-i6zkgvh47n] .gdp-detail-panel .rz-datatable {
    border: 1px solid var(--cd-border) !important;
    border-radius: var(--cd-radius-xs) !important;
    background: white !important;
}

[b-i6zkgvh47n] .gdp-detail-panel .rz-datatable-thead > tr > th {
    background: var(--cd-bg) !important;
    font-size: 0.68rem !important;
    padding: 6px 10px !important;
}

[b-i6zkgvh47n] .gdp-detail-panel .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    font-size: 0.78rem;
}

/* ===== ANIMACIONES ===== */
@keyframes cdSpin-b-i6zkgvh47n {
    to { transform: rotate(360deg); }
}

@keyframes cdPulse-b-i6zkgvh47n {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

@keyframes cdFadeIn-b-i6zkgvh47n {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes cdSlideDown-b-i6zkgvh47n {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .consulta-container[b-i6zkgvh47n] {
        padding: 8px 10px;
        gap: 8px;
    }

    .consulta-control-bar[b-i6zkgvh47n] {
        flex-wrap: wrap;
        padding: 8px 12px;
    }

    .control-center[b-i6zkgvh47n] {
        order: 3;
        width: 100%;
    }

    .filtros-grid[b-i6zkgvh47n] {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
}

@media (max-width: 640px) {
    .consulta-container[b-i6zkgvh47n] {
        padding: 6px 8px;
        gap: 6px;
    }

    .consulta-control-bar[b-i6zkgvh47n] {
        flex-direction: column;
        gap: 8px;
    }

    .control-left[b-i6zkgvh47n],
    .control-right[b-i6zkgvh47n] {
        width: 100%;
        justify-content: center;
    }

    .control-right[b-i6zkgvh47n] {
        flex-wrap: wrap;
    }

    .cd-btn[b-i6zkgvh47n] {
        flex: 1;
        justify-content: center;
        min-width: 0;
    }

    .cd-btn span:not(.material-icons):not(.rzi)[b-i6zkgvh47n] {
        display: none;
    }

    .filtros-grid[b-i6zkgvh47n] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Procesos/RevisionEmails/Componentes/AdjuntosEmailModal.razor.rz.scp.css */
.ae-modal[b-g2uflzy3pu] {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    font-family: var(--font-family);
}

.ae-loading-overlay[b-g2uflzy3pu] {
    position: absolute;
    inset: 0;
    z-index: 5;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    background: rgba(255, 255, 255, .7);
    color: var(--text-secondary);
    font-size: var(--text-sm);
}

.ae-spinner[b-g2uflzy3pu] {
    width: 32px;
    height: 32px;
    border: 3px solid var(--border);
    border-top-color: var(--color-primary);
    border-radius: var(--radius-full);
    animation: ae-spin-b-g2uflzy3pu .8s linear infinite;
}

@keyframes ae-spin-b-g2uflzy3pu {
    to { transform: rotate(360deg); }
}

.ae-body[b-g2uflzy3pu] {
    flex: 1;
    overflow: auto;
    padding: var(--space-2);
}

.ae-grid[b-g2uflzy3pu] {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--text-sm);
}

.ae-grid thead th[b-g2uflzy3pu] {
    position: sticky;
    top: 0;
    background: var(--bg);
    color: var(--text-secondary);
    font-weight: var(--fw-semibold);
    text-align: left;
    padding: 8px 10px;
    border-bottom: 1px solid var(--border);
}

.ae-grid tbody td[b-g2uflzy3pu] {
    padding: 7px 10px;
    border-bottom: 1px solid var(--border);
    color: var(--text);
}

.ae-grid tbody tr:hover[b-g2uflzy3pu] {
    background: var(--color-primary-light);
}

.ae-center[b-g2uflzy3pu] {
    text-align: center;
}

.ae-estado-chip[b-g2uflzy3pu] {
    display: inline-flex;
    align-items: center;
    padding: 1px 8px;
    border-radius: var(--radius-full);
    background: var(--color-primary-light);
    color: var(--color-primary-dark);
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    line-height: 1.6;
}

.ae-empty[b-g2uflzy3pu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    padding: var(--space-6);
    color: var(--text-secondary);
    font-size: var(--text-sm);
}

.ae-empty .rzi[b-g2uflzy3pu] {
    font-size: 2.2rem;
    color: var(--text-muted);
}

/* Descargar (genérico) = verde success (estándar §4.3) */
.ae-download-btn[b-g2uflzy3pu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: var(--radius-sm);
    background: var(--color-success);
    color: #fff;
    cursor: pointer;
    transition: background .15s ease;
}

.ae-download-btn:hover:not(:disabled)[b-g2uflzy3pu] {
    background: var(--color-success-dark);
}

.ae-download-btn:disabled[b-g2uflzy3pu] {
    opacity: .5;
    cursor: not-allowed;
}

.ae-download-btn .rzi[b-g2uflzy3pu] {
    font-size: 1rem;
}

.ae-footer[b-g2uflzy3pu] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    border-top: 1px solid var(--border);
}

.ae-btn[b-g2uflzy3pu] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 16px;
    border: none;
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    font-family: var(--font-family);
    cursor: pointer;
}

.ae-btn-secondary[b-g2uflzy3pu] {
    background: var(--color-secondary);
    color: #fff;
}

.ae-btn .rzi[b-g2uflzy3pu] {
    font-size: 1rem;
}
/* /Pages/Procesos/RevisionEmails/RevisionEmailsIndex.razor.rz.scp.css */
.re-container[b-yhmphd2gt5] {
    height: 100%;
    display: grid;
    grid-template-rows: auto auto 1fr;
    overflow: hidden;
    box-sizing: border-box;
    padding: var(--space-3);
    gap: var(--space-3);
    background: var(--bg);
}

/* Header */
.re-header[b-yhmphd2gt5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    flex-wrap: wrap;
}

.re-header-left[b-yhmphd2gt5] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

.re-header-icon[b-yhmphd2gt5] {
    width: 42px;
    height: 42px;
    border-radius: var(--radius-md);
    background: var(--color-primary);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.re-header-icon .rzi[b-yhmphd2gt5] {
    font-size: 1.4rem;
}

.re-header h2[b-yhmphd2gt5] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: var(--fw-semibold);
    color: var(--text);
}

.re-header-subtitle[b-yhmphd2gt5] {
    margin: 0;
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.re-header-actions[b-yhmphd2gt5] {
    display: flex;
    gap: var(--space-2);
    flex-wrap: wrap;
}

/* Botones */
.re-btn[b-yhmphd2gt5] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    font-family: var(--font-family);
    cursor: pointer;
    transition: filter .15s ease, background .15s ease;
}

.re-btn:disabled[b-yhmphd2gt5] {
    opacity: .55;
    cursor: not-allowed;
}

.re-btn .rzi[b-yhmphd2gt5] {
    font-size: 1rem;
}

/* Filtros = azul info (estándar §4.3) */
.re-btn-filtros[b-yhmphd2gt5] {
    background: var(--color-info);
    color: #fff;
}

.re-btn-filtros.active[b-yhmphd2gt5] {
    filter: brightness(.9);
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, .15);
}

/* Buscar = naranja acento (estándar §4.3) */
.re-btn-buscar[b-yhmphd2gt5] {
    background: var(--color-accent);
    color: #fff;
}

.re-btn-buscar:hover:not(:disabled)[b-yhmphd2gt5] {
    background: var(--color-accent-dark);
}

/* Exportar Excel = verde success (estándar §4.3) */
.re-btn-excel[b-yhmphd2gt5] {
    background: var(--color-success);
    color: #fff;
}

.re-btn-excel:hover:not(:disabled)[b-yhmphd2gt5] {
    filter: brightness(.95);
}

/* Integrar XMLs = cyan (--color-preview): misma identidad visual que el botón homónimo
   de Documentos Recepcionados, para que la acción se reconozca igual en ambas pantallas. */
.re-btn-integrar[b-yhmphd2gt5] {
    background: var(--color-preview);
    color: #fff;
}

.re-btn-integrar:hover:not(:disabled)[b-yhmphd2gt5] {
    background: var(--color-preview-dark);
}

.re-btn-ghost[b-yhmphd2gt5] {
    background: var(--color-limpiar);
    border-color: transparent;
    color: #fff;
}

.re-btn-ghost:hover[b-yhmphd2gt5] {
    background: var(--color-limpiar-dark);
    border-color: transparent;
    color: #fff;
}

/* Panel de filtros */
.re-filtros-wrapper[b-yhmphd2gt5] {
    overflow: hidden;
}

.re-filtros-panel[b-yhmphd2gt5] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    padding: var(--space-3);
    box-shadow: var(--shadow-xs);
}

.re-filtros-grid[b-yhmphd2gt5] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--space-3);
}

.re-filtro-field[b-yhmphd2gt5] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.re-filtro-label[b-yhmphd2gt5] {
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    color: var(--text-secondary);
}

.re-filtros-sub[b-yhmphd2gt5] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: var(--space-3) 0 var(--space-2);
    padding-top: var(--space-2);
    border-top: 1px dashed var(--border);
    font-size: var(--text-xs);
    color: var(--text-muted);
}

.re-filtros-sub .rzi[b-yhmphd2gt5] {
    font-size: 1rem;
    color: var(--color-primary);
}

.re-filtros-actions[b-yhmphd2gt5] {
    display: flex;
    justify-content: flex-end;
    margin-top: var(--space-3);
}

/* Grilla */
.re-grid-wrapper[b-yhmphd2gt5] {
    display: flex;
    flex-direction: column;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    overflow: hidden;
    min-height: 0;
}

.re-state[b-yhmphd2gt5] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--space-3);
    color: var(--text-secondary);
    font-size: var(--text-sm);
    padding: var(--space-5);
    text-align: center;
}

.re-state-empty .rzi[b-yhmphd2gt5] {
    font-size: 2.4rem;
    color: var(--text-muted);
}

.re-spinner[b-yhmphd2gt5] {
    width: 34px;
    height: 34px;
    border: 3px solid var(--border);
    border-top-color: var(--color-primary);
    border-radius: var(--radius-full);
    animation: re-spin-b-yhmphd2gt5 .8s linear infinite;
}

@keyframes re-spin-b-yhmphd2gt5 {
    to { transform: rotate(360deg); }
}

.re-estado-chip[b-yhmphd2gt5] {
    display: inline-flex;
    align-items: center;
    padding: 1px 8px;
    border-radius: var(--radius-full);
    background: var(--color-primary-light);
    color: var(--color-primary-dark);
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    line-height: 1.6;
    white-space: nowrap;
}

/* Ver detalle / Ficha de registro = color dedicado --color-detail (relleno, como el resto de grillas) */
.re-action-btn[b-yhmphd2gt5] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: var(--radius-sm);
    background: var(--color-detail);
    color: #fff;
    cursor: pointer;
    transition: background .15s ease;
}

.re-action-btn:hover[b-yhmphd2gt5] {
    background: var(--color-detail-dark);
}

.re-action-btn .rzi[b-yhmphd2gt5] {
    font-size: 1rem;
}
/* /Pages/Procesos/SeguimientoEnvioCorreo/Componentes/DetalleEventoCorreoModal.razor.rz.scp.css */
.dev-modal[b-mieqs9t4b7] {
    display: flex;
    flex-direction: column;
    height: 100%;
    font-family: var(--font-family);
}

.dev-body[b-mieqs9t4b7] {
    flex: 1;
    overflow: auto;
    padding: var(--space-2) var(--space-1);
}

.dev-grid[b-mieqs9t4b7] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-3);
}

.dev-field[b-mieqs9t4b7] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.dev-field-full[b-mieqs9t4b7] {
    grid-column: 1 / -1;
}

.dev-label[b-mieqs9t4b7] {
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    text-transform: uppercase;
    letter-spacing: .02em;
    color: var(--text-muted);
}

.dev-value[b-mieqs9t4b7] {
    font-size: var(--text-sm);
    color: var(--text);
    word-break: break-word;
}

.dev-value-mono[b-mieqs9t4b7] {
    font-family: ui-monospace, "Cascadia Code", Consolas, monospace;
    font-size: var(--text-xs);
    color: var(--text-secondary);
}

.dev-result[b-mieqs9t4b7] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: var(--space-3);
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-sm);
    background: var(--color-warning-light);
    border: 1px solid var(--color-warning);
    color: var(--color-warning-dark);
    font-size: var(--text-sm);
}

.dev-result .rzi[b-mieqs9t4b7] {
    font-size: 1.1rem;
    flex-shrink: 0;
}

.dev-footer[b-mieqs9t4b7] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    border-top: 1px solid var(--border);
}

.dev-btn[b-mieqs9t4b7] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 16px;
    border: none;
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    font-family: var(--font-family);
    color: #fff;
    cursor: pointer;
    transition: background .15s ease;
}

.dev-btn:disabled[b-mieqs9t4b7] {
    opacity: .55;
    cursor: not-allowed;
}

.dev-btn .rzi[b-mieqs9t4b7] {
    font-size: 1rem;
}

/* Cerrar = gris secondary (estándar §4.3) */
.dev-btn-secondary[b-mieqs9t4b7] {
    background: var(--color-secondary);
}

.dev-btn-secondary:hover:not(:disabled)[b-mieqs9t4b7] {
    background: var(--color-secondary-dark);
}

/* Revisar / Diagnosticar estado SendGrid = ámbar warning (estándar §4.3) */
.dev-btn-revisar[b-mieqs9t4b7] {
    background: var(--color-warning);
}

.dev-btn-revisar:hover:not(:disabled)[b-mieqs9t4b7] {
    background: var(--color-warning-dark);
}

/* Desbloquear email = azul primary (acción positiva §4.3) */
.dev-btn-desbloquear[b-mieqs9t4b7] {
    background: var(--color-primary);
}

.dev-btn-desbloquear:hover:not(:disabled)[b-mieqs9t4b7] {
    background: var(--color-primary-dark);
}

/* Resultado exitoso del desbloqueo */
.dev-result-ok[b-mieqs9t4b7] {
    background: var(--color-success-light);
    border-color: var(--color-success);
    color: var(--color-success-dark);
}

.dev-spinner[b-mieqs9t4b7] {
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255, 255, 255, .5);
    border-top-color: #fff;
    border-radius: var(--radius-full);
    animation: dev-spin-b-mieqs9t4b7 .8s linear infinite;
}

@keyframes dev-spin-b-mieqs9t4b7 {
    to { transform: rotate(360deg); }
}
/* /Pages/Procesos/SeguimientoEnvioCorreo/SeguimientoEnvioCorreoIndex.razor.rz.scp.css */
.sec-container[b-5lo7ie835g] {
    height: 100%;
    display: grid;
    grid-template-rows: auto auto 1fr;
    overflow: hidden;
    box-sizing: border-box;
    padding: var(--space-3);
    gap: var(--space-3);
    background: var(--bg);
}

/* Header */
.sec-header[b-5lo7ie835g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    flex-wrap: wrap;
}

.sec-header-left[b-5lo7ie835g] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

.sec-header-icon[b-5lo7ie835g] {
    width: 42px;
    height: 42px;
    border-radius: var(--radius-md);
    background: var(--color-primary);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sec-header-icon .rzi[b-5lo7ie835g] {
    font-size: 1.4rem;
}

.sec-header h2[b-5lo7ie835g] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: var(--fw-semibold);
    color: var(--text);
}

.sec-header-subtitle[b-5lo7ie835g] {
    margin: 0;
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.sec-header-actions[b-5lo7ie835g] {
    display: flex;
    gap: var(--space-2);
    flex-wrap: wrap;
}

/* Botones */
.sec-btn[b-5lo7ie835g] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    font-family: var(--font-family);
    cursor: pointer;
    transition: filter .15s ease, background .15s ease;
}

.sec-btn:disabled[b-5lo7ie835g] {
    opacity: .55;
    cursor: not-allowed;
}

.sec-btn .rzi[b-5lo7ie835g] {
    font-size: 1rem;
}

/* Filtros = azul info (estándar §4.3) */
.sec-btn-filtros[b-5lo7ie835g] {
    background: var(--color-info);
    color: #fff;
}

.sec-btn-filtros.active[b-5lo7ie835g] {
    filter: brightness(.9);
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, .15);
}

/* Buscar = naranja acento (estándar §4.3) */
.sec-btn-buscar[b-5lo7ie835g] {
    background: var(--color-accent);
    color: #fff;
}

.sec-btn-buscar:hover:not(:disabled)[b-5lo7ie835g] {
    background: var(--color-accent-dark);
}

.sec-btn-ghost[b-5lo7ie835g] {
    background: var(--surface);
    border-color: var(--border);
    color: var(--text-secondary);
}

.sec-btn-ghost:hover[b-5lo7ie835g] {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

/* Panel de filtros */
.sec-filtros-wrapper[b-5lo7ie835g] {
    overflow: hidden;
}

.sec-filtros-panel[b-5lo7ie835g] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    padding: var(--space-3);
    box-shadow: var(--shadow-xs);
}

.sec-filtros-grid[b-5lo7ie835g] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--space-3);
}

.sec-filtro-field[b-5lo7ie835g] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.sec-filtro-label[b-5lo7ie835g] {
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    color: var(--text-secondary);
}

.sec-filtros-sub[b-5lo7ie835g] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: var(--space-3) 0 var(--space-2);
    padding-top: var(--space-2);
    border-top: 1px dashed var(--border);
    font-size: var(--text-xs);
    color: var(--text-muted);
}

.sec-filtros-sub .rzi[b-5lo7ie835g] {
    font-size: 1rem;
    color: var(--color-primary);
}

.sec-filtros-actions[b-5lo7ie835g] {
    display: flex;
    justify-content: flex-end;
    margin-top: var(--space-3);
}

/* Grilla */
.sec-grid-wrapper[b-5lo7ie835g] {
    display: flex;
    flex-direction: column;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    overflow: hidden;
    min-height: 0;
}

.sec-state[b-5lo7ie835g] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--space-3);
    color: var(--text-secondary);
    font-size: var(--text-sm);
    padding: var(--space-5);
    text-align: center;
}

.sec-state-empty .rzi[b-5lo7ie835g] {
    font-size: 2.4rem;
    color: var(--text-muted);
}

.sec-spinner[b-5lo7ie835g] {
    width: 34px;
    height: 34px;
    border: 3px solid var(--border);
    border-top-color: var(--color-primary);
    border-radius: var(--radius-full);
    animation: sec-spin-b-5lo7ie835g .8s linear infinite;
}

.sec-spinner-sm[b-5lo7ie835g] {
    width: 22px;
    height: 22px;
    border-width: 2px;
}

@keyframes sec-spin-b-5lo7ie835g {
    to { transform: rotate(360deg); }
}

/* Chips de estado */
.sec-estado-chip[b-5lo7ie835g] {
    display: inline-flex;
    align-items: center;
    padding: 1px 8px;
    border-radius: var(--radius-full);
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    line-height: 1.6;
    white-space: nowrap;
}

.sec-estado-ok[b-5lo7ie835g] {
    background: var(--color-success-light);
    color: var(--color-success-dark);
}

.sec-estado-info[b-5lo7ie835g] {
    background: var(--color-info-light);
    color: var(--color-info);
}

.sec-estado-warn[b-5lo7ie835g] {
    background: var(--color-warning-light);
    color: var(--color-warning-dark);
}

.sec-estado-danger[b-5lo7ie835g] {
    background: var(--color-danger-light);
    color: var(--color-danger-dark);
}

.sec-estado-default[b-5lo7ie835g] {
    background: var(--color-primary-light);
    color: var(--color-primary-dark);
}

/* Subgrilla de detalle (row expander) */
.sec-detalle[b-5lo7ie835g] {
    padding: var(--space-3);
    background: var(--bg);
}

.sec-detalle-state[b-5lo7ie835g] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    padding: var(--space-4);
    color: var(--text-secondary);
    font-size: var(--text-sm);
}

.sec-detalle-state .rzi[b-5lo7ie835g] {
    font-size: 1.4rem;
    color: var(--text-muted);
}

.sec-detalle-title[b-5lo7ie835g] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: var(--space-2);
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    color: var(--text);
}

.sec-detalle-title .rzi[b-5lo7ie835g] {
    font-size: 1.1rem;
    color: var(--color-primary);
}

.sec-badge[b-5lo7ie835g] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: var(--radius-full);
    background: var(--color-primary);
    color: #fff;
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
}

/* Ver detalle / Ficha de registro = verde success (estándar §4.3) */
.sec-action-btn[b-5lo7ie835g] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: var(--radius-sm);
    background: var(--color-success);
    color: #fff;
    cursor: pointer;
    transition: transform .15s ease, background .15s ease;
}

.sec-action-btn:hover[b-5lo7ie835g] {
    background: var(--color-success-dark);
    transform: scale(1.12);
}

.sec-action-btn .rzi[b-5lo7ie835g] {
    font-size: 1rem;
}
/* /Pages/ReportesDeVenta/VentasxCliente/VentasxClienteIndex.razor.rz.scp.css */
/* ===== REPORTES VENTA - VENTAS X CLIENTE ===== */

/* Variables CSS del módulo (mismo design system que DocumentosxCobrar) */
.rv-container[b-wcxn5osc7b] {
    --rv-primary: var(--color-primary);
    --rv-primary-dark: var(--color-primary-dark);
    --rv-primary-light: var(--color-primary-light);
    --rv-accent: var(--color-warning);
    --rv-accent-dark: var(--color-warning-dark);
    --rv-accent-light: #FFFBEB;
    --rv-success: var(--color-success);
    --rv-success-light: var(--color-success-light);
    --rv-danger: var(--color-danger);
    --rv-danger-light: var(--color-danger-light);
    --rv-info: var(--color-info);
    --rv-info-light: var(--color-info-light);
    --rv-orange: var(--color-accent);
    --rv-orange-dark: var(--color-accent-dark);
    --rv-purple: #8B5CF6;
    --rv-purple-dark: #7C3AED;
    --rv-bg: var(--bg);
    --rv-card: var(--surface);
    --rv-text: var(--text);
    --rv-text-secondary: var(--text-secondary);
    --rv-text-muted: var(--text-muted);
    --rv-border: var(--border);
    --rv-shadow-sm: var(--shadow-xs);
    --rv-shadow: var(--shadow-sm);
    --rv-shadow-md: var(--shadow-md);
    --rv-shadow-lg: var(--shadow-lg);
    --rv-radius: var(--radius-lg);
    --rv-radius-sm: var(--radius-md);
    --rv-radius-xs: var(--radius-sm);
    --rv-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--rv-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.rv-control-bar[b-wcxn5osc7b] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--rv-card);
    border-radius: var(--rv-radius);
    box-shadow: var(--rv-shadow);
    padding: 8px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 48px;
}

.control-left[b-wcxn5osc7b] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.control-left label[b-wcxn5osc7b] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--rv-text-secondary);
    white-space: nowrap;
}

[b-wcxn5osc7b] .control-left .rz-spinner {
    width: 75px !important;
    border-radius: var(--rv-radius-xs) !important;
}

[b-wcxn5osc7b] .control-left .rz-spinner input {
    height: 32px !important;
    font-size: 0.8rem !important;
}

.control-center[b-wcxn5osc7b] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loading-indicator[b-wcxn5osc7b] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: rvFadeIn-b-wcxn5osc7b 0.3s ease;
}

.loading-spinner[b-wcxn5osc7b] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--rv-border);
    border-top-color: var(--rv-primary);
    border-radius: 50%;
    animation: rvSpin-b-wcxn5osc7b 0.8s linear infinite;
}

.loading-text[b-wcxn5osc7b] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--rv-primary);
    animation: rvPulse-b-wcxn5osc7b 1.5s ease-in-out infinite;
}

.control-right[b-wcxn5osc7b] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES DE ACCIÓN ===== */
.rv-btn[b-wcxn5osc7b] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--rv-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--rv-transition);
    white-space: nowrap;
    color: white;
}

.rv-btn:hover[b-wcxn5osc7b] {
    transform: translateY(-1px);
    box-shadow: var(--rv-shadow-md);
}

.rv-btn:active[b-wcxn5osc7b] {
    transform: translateY(0);
}

.rv-btn .rzi[b-wcxn5osc7b] {
    font-size: 1rem;
}

.btn-buscar[b-wcxn5osc7b] {
    background: var(--rv-orange);
}

.btn-exportar[b-wcxn5osc7b] {
    background: var(--rv-success);
}

.btn-filtros[b-wcxn5osc7b] {
    background: var(--rv-info);
}

.btn-filtros.active[b-wcxn5osc7b] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* ===== PANEL DE FILTROS ===== */
.filtros-wrapper[b-wcxn5osc7b] {
    position: relative;
    flex-shrink: 0;
}

.filtros-panel[b-wcxn5osc7b] {
    background: var(--rv-card);
    border-radius: var(--rv-radius);
    box-shadow: var(--rv-shadow-md);
    overflow: hidden;
    animation: rvSlideDown-b-wcxn5osc7b 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.filtros-header[b-wcxn5osc7b] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--rv-border);
    background: linear-gradient(135deg, var(--rv-info-light) 0%, var(--rv-card) 100%);
}

.filtros-header h3[b-wcxn5osc7b] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--rv-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.filtros-header h3 .rzi[b-wcxn5osc7b] {
    color: var(--rv-info);
    font-size: 1.1rem;
}

.filtros-close-btn[b-wcxn5osc7b] {
    background: none;
    border: none;
    color: var(--rv-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--rv-radius-xs);
    transition: var(--rv-transition);
    display: flex;
    align-items: center;
}

.filtros-close-btn:hover[b-wcxn5osc7b] {
    background: var(--rv-danger-light);
    color: var(--rv-danger);
}

.filtros-body[b-wcxn5osc7b] {
    padding: 12px 16px;
}

.filtros-grid[b-wcxn5osc7b] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.filtro-field[b-wcxn5osc7b] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.filtro-label[b-wcxn5osc7b] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--rv-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.filtro-field[b-wcxn5osc7b]  .rz-textbox,
.filtro-field[b-wcxn5osc7b]  .rz-spinner,
.filtro-field[b-wcxn5osc7b]  .rz-inputtext,
.filtro-field[b-wcxn5osc7b]  .rz-calendar,
.filtro-field[b-wcxn5osc7b]  .rz-numeric,
.filtro-field[b-wcxn5osc7b]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--rv-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--rv-transition);
    background: white !important;
}

.filtro-field[b-wcxn5osc7b]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--rv-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--rv-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.filtro-field[b-wcxn5osc7b]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.filtro-field[b-wcxn5osc7b]  .rz-textbox:focus,
.filtro-field[b-wcxn5osc7b]  .rz-state-focused,
.filtro-field[b-wcxn5osc7b]  input:focus,
.filtro-field[b-wcxn5osc7b]  .rz-calendar:focus-within,
.filtro-field[b-wcxn5osc7b]  .rz-numeric:focus-within {
    border-color: var(--rv-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

.filtro-field[b-wcxn5osc7b]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== SECCIÓN GRÁFICO + LEYENDA ===== */
.rv-chart-wrapper[b-wcxn5osc7b] {
    flex: 0 0 40%;
    min-height: 280px;
    max-height: 42%;
    background: var(--rv-card);
    border-radius: var(--rv-radius);
    box-shadow: var(--rv-shadow);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.rv-chart-header[b-wcxn5osc7b] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 14px;
    border-bottom: 1px solid var(--rv-border);
    background: linear-gradient(135deg, var(--rv-primary-light) 0%, var(--rv-card) 100%);
    flex-shrink: 0;
}

.rv-chart-title[b-wcxn5osc7b] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--rv-text);
}

.rv-chart-title .rzi[b-wcxn5osc7b] {
    color: var(--rv-primary);
    font-size: 1.1rem;
}

.rv-chart-tabs[b-wcxn5osc7b] {
    display: inline-flex;
    background: var(--rv-bg);
    border-radius: var(--rv-radius-xs);
    padding: 2px;
    gap: 2px;
}

.rv-chart-tab[b-wcxn5osc7b] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 10px;
    border: none;
    background: transparent;
    border-radius: var(--rv-radius-xs);
    cursor: pointer;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--rv-text-secondary);
    transition: var(--rv-transition);
}

.rv-chart-tab .rzi[b-wcxn5osc7b] {
    font-size: 0.95rem;
}

.rv-chart-tab:hover[b-wcxn5osc7b] {
    color: var(--rv-primary);
}

.rv-chart-tab.active[b-wcxn5osc7b] {
    background: var(--rv-card);
    color: var(--rv-primary);
    box-shadow: var(--rv-shadow-sm);
}

.rv-chart-body[b-wcxn5osc7b] {
    flex: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 12px;
    padding: 10px 14px;
    min-height: 0;
}

.rv-chart-area[b-wcxn5osc7b] {
    background: var(--rv-card);
    border-radius: var(--rv-radius-sm);
    min-height: 0;
    min-width: 0;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

[b-wcxn5osc7b] .rv-chart-area .rz-chart {
    width: 100% !important;
    height: 100% !important;
}

.rv-empty[b-wcxn5osc7b] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: var(--rv-text-muted);
    font-size: 0.85rem;
    text-align: center;
    padding: 12px;
}

.rv-empty .rzi[b-wcxn5osc7b] {
    font-size: 2.4rem;
    color: var(--rv-text-muted);
    opacity: 0.6;
}

/* Leyenda lateral */
.rv-chart-legend[b-wcxn5osc7b] {
    display: flex;
    flex-direction: column;
    background: var(--rv-bg);
    border-radius: var(--rv-radius-sm);
    overflow: hidden;
    min-height: 0;
}

.rv-legend-header[b-wcxn5osc7b] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    background: var(--rv-card);
    border-bottom: 1px solid var(--rv-border);
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--rv-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    flex-shrink: 0;
}

.rv-legend-header .rzi[b-wcxn5osc7b] {
    font-size: 0.95rem;
    color: var(--rv-primary);
}

.rv-legend-list[b-wcxn5osc7b] {
    flex: 1;
    overflow-y: auto;
    padding: 4px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.rv-legend-item[b-wcxn5osc7b] {
    display: grid;
    grid-template-columns: 12px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 7px 8px;
    border-radius: var(--rv-radius-xs);
    cursor: pointer;
    transition: var(--rv-transition);
    background: transparent;
}

.rv-legend-item:hover[b-wcxn5osc7b] {
    background: var(--rv-card);
    transform: translateX(2px);
}

.rv-legend-item.active[b-wcxn5osc7b] {
    background: var(--rv-primary-light);
    box-shadow: inset 0 0 0 1.5px var(--rv-primary);
}

.rv-legend-dot[b-wcxn5osc7b] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    flex-shrink: 0;
    box-shadow: 0 0 0 2px rgba(255,255,255,0.8);
}

.rv-legend-info[b-wcxn5osc7b] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.rv-legend-name[b-wcxn5osc7b] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--rv-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rv-legend-meta[b-wcxn5osc7b] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.68rem;
    color: var(--rv-text-secondary);
}

.rv-legend-rut[b-wcxn5osc7b] {
    color: var(--rv-text-secondary);
}

.rv-legend-amount[b-wcxn5osc7b] {
    font-weight: 700;
    color: var(--rv-success);
}

.rv-legend-count[b-wcxn5osc7b] {
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--rv-text-secondary);
    background: var(--rv-card);
    padding: 2px 7px;
    border-radius: 999px;
    min-width: 24px;
    text-align: center;
    box-shadow: var(--rv-shadow-sm);
}

.rv-legend-empty[b-wcxn5osc7b] {
    color: var(--rv-text-muted);
    font-size: 0.8rem;
    text-align: center;
    padding: 20px 12px;
}

/* Tooltip personalizado del chart */
.rv-tooltip[b-wcxn5osc7b] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: 0.75rem;
    line-height: 1.3;
}

.rv-tooltip strong[b-wcxn5osc7b] {
    font-size: 0.82rem;
    margin-bottom: 2px;
}

/* ===== SECCIÓN GRILLAS (PRINCIPAL + DETALLE LATERAL) ===== */
.rv-grids-wrapper[b-wcxn5osc7b] {
    flex: 1;
    display: flex;
    gap: 10px;
    min-height: 0;
}

.rv-grid-main[b-wcxn5osc7b] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--rv-card);
    border-radius: var(--rv-radius);
    box-shadow: var(--rv-shadow);
    overflow: hidden;
    min-height: 0;
    min-width: 0;
    transition: flex 0.25s ease;
}

.rv-grid-main.with-detail[b-wcxn5osc7b] {
    flex: 0.4;
    min-width: 320px;
}

.rv-grid-detail[b-wcxn5osc7b] {
    flex: 0.6;
    min-width: 0;
    display: flex;
    flex-direction: column;
    background: var(--rv-card);
    border-radius: var(--rv-radius);
    box-shadow: var(--rv-shadow-md);
    overflow: hidden;
    min-height: 0;
    animation: rvSlideLeft-b-wcxn5osc7b 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border-left: 3px solid var(--rv-primary);
}

.rv-grid-header[b-wcxn5osc7b] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 14px;
    border-bottom: 1px solid var(--rv-border);
    background: linear-gradient(135deg, var(--rv-bg) 0%, var(--rv-card) 100%);
    flex-shrink: 0;
}

.rv-grid-title[b-wcxn5osc7b] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--rv-text);
    min-width: 0;
}

.rv-grid-title > span:nth-child(2)[b-wcxn5osc7b] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rv-grid-title .rzi[b-wcxn5osc7b] {
    color: var(--rv-primary);
    font-size: 1.1rem;
    flex-shrink: 0;
}

.rv-grid-badge[b-wcxn5osc7b] {
    font-size: 0.7rem;
    font-weight: 700;
    background: var(--rv-primary-light);
    color: var(--rv-primary-dark);
    padding: 2px 8px;
    border-radius: 999px;
    min-width: 22px;
    text-align: center;
    flex-shrink: 0;
}

.rv-detail-loading[b-wcxn5osc7b] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

/* ===== ESTILOS GRILLA RADZEN ===== */
[b-wcxn5osc7b] .rv-grid-main .rz-datatable,
[b-wcxn5osc7b] .rv-grid-detail .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

[b-wcxn5osc7b] .rv-grid-main .rz-datatable-thead > tr > th,
[b-wcxn5osc7b] .rv-grid-detail .rz-datatable-thead > tr > th {
    background: var(--rv-bg) !important;
    color: var(--rv-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--rv-border) !important;
}

[b-wcxn5osc7b] .rv-grid-main .rz-datatable-tbody > tr,
[b-wcxn5osc7b] .rv-grid-detail .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
    cursor: pointer;
}

[b-wcxn5osc7b] .rv-grid-main .rz-datatable-tbody > tr:hover,
[b-wcxn5osc7b] .rv-grid-detail .rz-datatable-tbody > tr:hover {
    background-color: var(--rv-primary-light) !important;
}

[b-wcxn5osc7b] .rv-grid-main .rz-datatable-tbody > tr.rz-state-highlight,
[b-wcxn5osc7b] .rv-grid-main .rz-datatable-tbody > tr.rz-selected {
    background-color: var(--rv-primary-light) !important;
    box-shadow: inset 3px 0 0 var(--rv-primary);
}

[b-wcxn5osc7b] .rv-grid-main .rz-datatable-tbody > tr > td,
[b-wcxn5osc7b] .rv-grid-detail .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-wcxn5osc7b] .rv-grid-main .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

/* La grilla de detalle vive en un espacio más compacto: reducimos paddings y cabecera */
[b-wcxn5osc7b] .rv-grid-detail .rz-datatable-thead > tr > th {
    padding: 6px 6px !important;
    font-size: 0.65rem !important;
    letter-spacing: 0.02em !important;
}

[b-wcxn5osc7b] .rv-grid-detail .rz-datatable-tbody > tr > td {
    padding: 4px 6px !important;
    font-size: 0.75rem;
}

/* Píldora del tipo de DTE (cabe sin desbordar la celda de 95px) */
.rv-pill[b-wcxn5osc7b] {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 700;
    color: white;
    background: var(--rv-text-secondary);
    line-height: 1.25;
    white-space: nowrap;
}

.rv-pill-33[b-wcxn5osc7b] { background: var(--rv-primary); }
.rv-pill-39[b-wcxn5osc7b] { background: var(--rv-info); }
.rv-pill-61[b-wcxn5osc7b] { background: var(--rv-danger); }
.rv-pill-34[b-wcxn5osc7b] { background: var(--rv-success); }
.rv-pill-56[b-wcxn5osc7b] { background: var(--rv-orange); }

/* Botones de acción dentro de la grilla */
.grid-action-btn[b-wcxn5osc7b] {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--rv-radius-xs);
    cursor: pointer;
    transition: var(--rv-transition);
    padding: 0;
    color: white;
    font-size: 0.85rem;
}

.grid-action-btn:hover[b-wcxn5osc7b] {
    transform: scale(1.12);
    box-shadow: var(--rv-shadow-md);
}

.grid-action-btn:active[b-wcxn5osc7b] {
    transform: scale(0.95);
}

.grid-btn-detalle[b-wcxn5osc7b] {
    background: var(--rv-primary);
}

.grid-btn-detalle:hover[b-wcxn5osc7b] {
    background: var(--rv-primary-dark);
}

/* ===== ANIMACIONES ===== */
@keyframes rvSpin-b-wcxn5osc7b {
    to { transform: rotate(360deg); }
}

@keyframes rvPulse-b-wcxn5osc7b {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

@keyframes rvFadeIn-b-wcxn5osc7b {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes rvSlideDown-b-wcxn5osc7b {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

@keyframes rvSlideLeft-b-wcxn5osc7b {
    from { opacity: 0; transform: translateX(20px); }
    to { opacity: 1; transform: translateX(0); }
}

/* ===== RESPONSIVE: TABLET ===== */
@media (max-width: 1280px) {
    .rv-chart-body[b-wcxn5osc7b] {
        grid-template-columns: minmax(0, 1fr) 240px;
    }
}

@media (max-width: 1024px) {
    .rv-container[b-wcxn5osc7b] {
        padding: 8px 10px;
        gap: 8px;
    }

    .rv-control-bar[b-wcxn5osc7b] {
        flex-wrap: wrap;
        padding: 8px 12px;
    }

    .control-center[b-wcxn5osc7b] {
        order: 3;
        width: 100%;
    }

    .filtros-grid[b-wcxn5osc7b] {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }

    .rv-chart-wrapper[b-wcxn5osc7b] {
        flex: 0 0 auto;
        max-height: none;
    }

    .rv-chart-body[b-wcxn5osc7b] {
        grid-template-columns: 1fr;
        grid-template-rows: 220px auto;
    }

    .rv-chart-legend[b-wcxn5osc7b] {
        max-height: 180px;
    }

    .rv-grids-wrapper[b-wcxn5osc7b] {
        flex-direction: column;
    }

    .rv-grid-main.with-detail[b-wcxn5osc7b] {
        flex: 1;
    }

    .rv-grid-detail[b-wcxn5osc7b] {
        flex: 1;
        border-left: none;
        border-top: 3px solid var(--rv-primary);
    }
}

/* ===== RESPONSIVE: MOBILE ===== */
@media (max-width: 640px) {
    .rv-container[b-wcxn5osc7b] {
        padding: 6px 8px;
        gap: 6px;
    }

    .rv-control-bar[b-wcxn5osc7b] {
        flex-direction: column;
        gap: 8px;
    }

    .control-left[b-wcxn5osc7b],
    .control-right[b-wcxn5osc7b] {
        width: 100%;
        justify-content: center;
    }

    .control-right[b-wcxn5osc7b] {
        flex-wrap: wrap;
    }

    .rv-btn[b-wcxn5osc7b] {
        flex: 1;
        justify-content: center;
        min-width: 0;
    }

    .rv-btn span:not(.material-icons):not(.rzi)[b-wcxn5osc7b] {
        display: none;
    }

    .filtros-grid[b-wcxn5osc7b] {
        grid-template-columns: 1fr;
    }

    .rv-chart-tab span:not(.rzi)[b-wcxn5osc7b] {
        display: none;
    }
}
/* /Pages/ReportesDeVenta/VentasxPeriodo/VentasxPeriodoIndex.razor.rz.scp.css */
/* ===== REPORTES VENTA - VENTAS X PERIODO ===== */

/* Variables CSS del módulo (mismo design system que VentasxCliente) */
.rv-container[b-w35r4ri44w] {
    --rv-primary: var(--color-primary);
    --rv-primary-dark: var(--color-primary-dark);
    --rv-primary-light: var(--color-primary-light);
    --rv-accent: var(--color-warning);
    --rv-accent-dark: var(--color-warning-dark);
    --rv-accent-light: #FFFBEB;
    --rv-success: var(--color-success);
    --rv-success-light: var(--color-success-light);
    --rv-danger: var(--color-danger);
    --rv-danger-light: var(--color-danger-light);
    --rv-info: var(--color-info);
    --rv-info-light: var(--color-info-light);
    --rv-orange: var(--color-accent);
    --rv-orange-dark: var(--color-accent-dark);
    --rv-purple: #8B5CF6;
    --rv-purple-dark: #7C3AED;
    --rv-bg: var(--bg);
    --rv-card: var(--surface);
    --rv-text: var(--text);
    --rv-text-secondary: var(--text-secondary);
    --rv-text-muted: var(--text-muted);
    --rv-border: var(--border);
    --rv-shadow-sm: var(--shadow-xs);
    --rv-shadow: var(--shadow-sm);
    --rv-shadow-md: var(--shadow-md);
    --rv-shadow-lg: var(--shadow-lg);
    --rv-radius: var(--radius-lg);
    --rv-radius-sm: var(--radius-md);
    --rv-radius-xs: var(--radius-sm);
    --rv-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--rv-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.rv-control-bar[b-w35r4ri44w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--rv-card);
    border-radius: var(--rv-radius);
    box-shadow: var(--rv-shadow);
    padding: 8px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 48px;
}

.control-left[b-w35r4ri44w] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.control-left label[b-w35r4ri44w] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--rv-text-secondary);
    white-space: nowrap;
}

[b-w35r4ri44w] .control-left .rz-spinner {
    width: 75px !important;
    border-radius: var(--rv-radius-xs) !important;
}

[b-w35r4ri44w] .control-left .rz-spinner input {
    height: 32px !important;
    font-size: 0.8rem !important;
}

.control-center[b-w35r4ri44w] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loading-indicator[b-w35r4ri44w] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: rvFadeIn-b-w35r4ri44w 0.3s ease;
}

.loading-spinner[b-w35r4ri44w] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--rv-border);
    border-top-color: var(--rv-primary);
    border-radius: 50%;
    animation: rvSpin-b-w35r4ri44w 0.8s linear infinite;
}

.loading-text[b-w35r4ri44w] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--rv-primary);
    animation: rvPulse-b-w35r4ri44w 1.5s ease-in-out infinite;
}

.control-right[b-w35r4ri44w] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES DE ACCIÓN ===== */
.rv-btn[b-w35r4ri44w] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--rv-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--rv-transition);
    white-space: nowrap;
    color: white;
}

.rv-btn:hover[b-w35r4ri44w] {
    transform: translateY(-1px);
    box-shadow: var(--rv-shadow-md);
}

.rv-btn:active[b-w35r4ri44w] {
    transform: translateY(0);
}

.rv-btn .rzi[b-w35r4ri44w] {
    font-size: 1rem;
}

.btn-buscar[b-w35r4ri44w] {
    background: var(--rv-orange);
}

.btn-exportar[b-w35r4ri44w] {
    background: var(--rv-success);
}

.btn-filtros[b-w35r4ri44w] {
    background: var(--rv-info);
}

.btn-filtros.active[b-w35r4ri44w] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* ===== PANEL DE FILTROS ===== */
.filtros-wrapper[b-w35r4ri44w] {
    position: relative;
    flex-shrink: 0;
}

.filtros-panel[b-w35r4ri44w] {
    background: var(--rv-card);
    border-radius: var(--rv-radius);
    box-shadow: var(--rv-shadow-md);
    overflow: hidden;
    animation: rvSlideDown-b-w35r4ri44w 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.filtros-header[b-w35r4ri44w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--rv-border);
    background: linear-gradient(135deg, var(--rv-info-light) 0%, var(--rv-card) 100%);
}

.filtros-header h3[b-w35r4ri44w] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--rv-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.filtros-header h3 .rzi[b-w35r4ri44w] {
    color: var(--rv-info);
    font-size: 1.1rem;
}

.filtros-close-btn[b-w35r4ri44w] {
    background: none;
    border: none;
    color: var(--rv-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--rv-radius-xs);
    transition: var(--rv-transition);
    display: flex;
    align-items: center;
}

.filtros-close-btn:hover[b-w35r4ri44w] {
    background: var(--rv-danger-light);
    color: var(--rv-danger);
}

.filtros-body[b-w35r4ri44w] {
    padding: 12px 16px;
}

.filtros-grid[b-w35r4ri44w] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.filtro-field[b-w35r4ri44w] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.filtro-label[b-w35r4ri44w] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--rv-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.filtro-field[b-w35r4ri44w]  .rz-textbox,
.filtro-field[b-w35r4ri44w]  .rz-spinner,
.filtro-field[b-w35r4ri44w]  .rz-inputtext,
.filtro-field[b-w35r4ri44w]  .rz-calendar,
.filtro-field[b-w35r4ri44w]  .rz-numeric,
.filtro-field[b-w35r4ri44w]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--rv-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--rv-transition);
    background: white !important;
}

.filtro-field[b-w35r4ri44w]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--rv-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--rv-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.filtro-field[b-w35r4ri44w]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.filtro-field[b-w35r4ri44w]  .rz-textbox:focus,
.filtro-field[b-w35r4ri44w]  .rz-state-focused,
.filtro-field[b-w35r4ri44w]  input:focus,
.filtro-field[b-w35r4ri44w]  .rz-calendar:focus-within,
.filtro-field[b-w35r4ri44w]  .rz-numeric:focus-within {
    border-color: var(--rv-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

.filtro-field[b-w35r4ri44w]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== SECCIÓN GRÁFICO + LEYENDA ===== */
.rv-chart-wrapper[b-w35r4ri44w] {
    flex: 0 0 40%;
    min-height: 280px;
    max-height: 42%;
    background: var(--rv-card);
    border-radius: var(--rv-radius);
    box-shadow: var(--rv-shadow);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.rv-chart-header[b-w35r4ri44w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 14px;
    border-bottom: 1px solid var(--rv-border);
    background: linear-gradient(135deg, var(--rv-primary-light) 0%, var(--rv-card) 100%);
    flex-shrink: 0;
}

.rv-chart-title[b-w35r4ri44w] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--rv-text);
}

.rv-chart-title .rzi[b-w35r4ri44w] {
    color: var(--rv-primary);
    font-size: 1.1rem;
}

.rv-chart-tabs[b-w35r4ri44w] {
    display: inline-flex;
    background: var(--rv-bg);
    border-radius: var(--rv-radius-xs);
    padding: 2px;
    gap: 2px;
}

.rv-chart-tab[b-w35r4ri44w] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 10px;
    border: none;
    background: transparent;
    border-radius: var(--rv-radius-xs);
    cursor: pointer;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--rv-text-secondary);
    transition: var(--rv-transition);
}

.rv-chart-tab .rzi[b-w35r4ri44w] {
    font-size: 0.95rem;
}

.rv-chart-tab:hover[b-w35r4ri44w] {
    color: var(--rv-primary);
}

.rv-chart-tab.active[b-w35r4ri44w] {
    background: var(--rv-card);
    color: var(--rv-primary);
    box-shadow: var(--rv-shadow-sm);
}

.rv-chart-body[b-w35r4ri44w] {
    flex: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 12px;
    padding: 10px 14px;
    min-height: 0;
}

.rv-chart-area[b-w35r4ri44w] {
    background: var(--rv-card);
    border-radius: var(--rv-radius-sm);
    min-height: 0;
    min-width: 0;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

[b-w35r4ri44w] .rv-chart-area .rz-chart {
    width: 100% !important;
    height: 100% !important;
}

.rv-empty[b-w35r4ri44w] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: var(--rv-text-muted);
    font-size: 0.85rem;
    text-align: center;
    padding: 12px;
}

.rv-empty .rzi[b-w35r4ri44w] {
    font-size: 2.4rem;
    color: var(--rv-text-muted);
    opacity: 0.6;
}

/* Leyenda lateral */
.rv-chart-legend[b-w35r4ri44w] {
    display: flex;
    flex-direction: column;
    background: var(--rv-bg);
    border-radius: var(--rv-radius-sm);
    overflow: hidden;
    min-height: 0;
}

.rv-legend-header[b-w35r4ri44w] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    background: var(--rv-card);
    border-bottom: 1px solid var(--rv-border);
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--rv-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    flex-shrink: 0;
}

.rv-legend-header .rzi[b-w35r4ri44w] {
    font-size: 0.95rem;
    color: var(--rv-primary);
}

.rv-legend-list[b-w35r4ri44w] {
    flex: 1;
    overflow-y: auto;
    padding: 4px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.rv-legend-item[b-w35r4ri44w] {
    display: grid;
    grid-template-columns: 12px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 7px 8px;
    border-radius: var(--rv-radius-xs);
    cursor: pointer;
    transition: var(--rv-transition);
    background: transparent;
}

.rv-legend-item:hover[b-w35r4ri44w] {
    background: var(--rv-card);
    transform: translateX(2px);
}

.rv-legend-item.active[b-w35r4ri44w] {
    background: var(--rv-primary-light);
    box-shadow: inset 0 0 0 1.5px var(--rv-primary);
}

.rv-legend-dot[b-w35r4ri44w] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    flex-shrink: 0;
    box-shadow: 0 0 0 2px rgba(255,255,255,0.8);
}

.rv-legend-info[b-w35r4ri44w] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.rv-legend-name[b-w35r4ri44w] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--rv-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rv-legend-meta[b-w35r4ri44w] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.68rem;
    color: var(--rv-text-secondary);
}

.rv-legend-rut[b-w35r4ri44w] {
    color: var(--rv-text-secondary);
}

.rv-legend-amount[b-w35r4ri44w] {
    font-weight: 700;
    color: var(--rv-success);
}

.rv-legend-count[b-w35r4ri44w] {
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--rv-text-secondary);
    background: var(--rv-card);
    padding: 2px 7px;
    border-radius: 999px;
    min-width: 24px;
    text-align: center;
    box-shadow: var(--rv-shadow-sm);
}

.rv-legend-empty[b-w35r4ri44w] {
    color: var(--rv-text-muted);
    font-size: 0.8rem;
    text-align: center;
    padding: 20px 12px;
}

/* Tooltip personalizado del chart */
.rv-tooltip[b-w35r4ri44w] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: 0.75rem;
    line-height: 1.3;
}

.rv-tooltip strong[b-w35r4ri44w] {
    font-size: 0.82rem;
    margin-bottom: 2px;
}

/* ===== SECCIÓN GRILLAS (PRINCIPAL + DETALLE LATERAL) ===== */
.rv-grids-wrapper[b-w35r4ri44w] {
    flex: 1;
    display: flex;
    gap: 10px;
    min-height: 0;
}

.rv-grid-main[b-w35r4ri44w] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--rv-card);
    border-radius: var(--rv-radius);
    box-shadow: var(--rv-shadow);
    overflow: hidden;
    min-height: 0;
    min-width: 0;
    transition: flex 0.25s ease;
}

.rv-grid-main.with-detail[b-w35r4ri44w] {
    flex: 0.4;
    min-width: 320px;
}

.rv-grid-detail[b-w35r4ri44w] {
    flex: 0.6;
    min-width: 0;
    display: flex;
    flex-direction: column;
    background: var(--rv-card);
    border-radius: var(--rv-radius);
    box-shadow: var(--rv-shadow-md);
    overflow: hidden;
    min-height: 0;
    animation: rvSlideLeft-b-w35r4ri44w 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border-left: 3px solid var(--rv-primary);
}

.rv-grid-header[b-w35r4ri44w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 14px;
    border-bottom: 1px solid var(--rv-border);
    background: linear-gradient(135deg, var(--rv-bg) 0%, var(--rv-card) 100%);
    flex-shrink: 0;
}

.rv-grid-title[b-w35r4ri44w] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--rv-text);
    min-width: 0;
}

.rv-grid-title > span:nth-child(2)[b-w35r4ri44w] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rv-grid-title .rzi[b-w35r4ri44w] {
    color: var(--rv-primary);
    font-size: 1.1rem;
    flex-shrink: 0;
}

.rv-grid-badge[b-w35r4ri44w] {
    font-size: 0.7rem;
    font-weight: 700;
    background: var(--rv-primary-light);
    color: var(--rv-primary-dark);
    padding: 2px 8px;
    border-radius: 999px;
    min-width: 22px;
    text-align: center;
    flex-shrink: 0;
}

.rv-detail-loading[b-w35r4ri44w] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

/* ===== ESTILOS GRILLA RADZEN ===== */
[b-w35r4ri44w] .rv-grid-main .rz-datatable,
[b-w35r4ri44w] .rv-grid-detail .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

[b-w35r4ri44w] .rv-grid-main .rz-datatable-thead > tr > th,
[b-w35r4ri44w] .rv-grid-detail .rz-datatable-thead > tr > th {
    background: var(--rv-bg) !important;
    color: var(--rv-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--rv-border) !important;
}

[b-w35r4ri44w] .rv-grid-main .rz-datatable-tbody > tr,
[b-w35r4ri44w] .rv-grid-detail .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
    cursor: pointer;
}

[b-w35r4ri44w] .rv-grid-main .rz-datatable-tbody > tr:hover,
[b-w35r4ri44w] .rv-grid-detail .rz-datatable-tbody > tr:hover {
    background-color: var(--rv-primary-light) !important;
}

[b-w35r4ri44w] .rv-grid-main .rz-datatable-tbody > tr.rz-state-highlight,
[b-w35r4ri44w] .rv-grid-main .rz-datatable-tbody > tr.rz-selected {
    background-color: var(--rv-primary-light) !important;
    box-shadow: inset 3px 0 0 var(--rv-primary);
}

[b-w35r4ri44w] .rv-grid-main .rz-datatable-tbody > tr > td,
[b-w35r4ri44w] .rv-grid-detail .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-w35r4ri44w] .rv-grid-main .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

/* La grilla de detalle vive en un espacio más compacto: reducimos paddings y cabecera */
[b-w35r4ri44w] .rv-grid-detail .rz-datatable-thead > tr > th {
    padding: 6px 6px !important;
    font-size: 0.65rem !important;
    letter-spacing: 0.02em !important;
}

[b-w35r4ri44w] .rv-grid-detail .rz-datatable-tbody > tr > td {
    padding: 4px 6px !important;
    font-size: 0.75rem;
}

/* Píldora del tipo de DTE (cabe sin desbordar la celda de 95px) */
.rv-pill[b-w35r4ri44w] {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 700;
    color: white;
    background: var(--rv-text-secondary);
    line-height: 1.25;
    white-space: nowrap;
}

.rv-pill-33[b-w35r4ri44w] { background: var(--rv-primary); }
.rv-pill-39[b-w35r4ri44w] { background: var(--rv-info); }
.rv-pill-61[b-w35r4ri44w] { background: var(--rv-danger); }
.rv-pill-34[b-w35r4ri44w] { background: var(--rv-success); }
.rv-pill-56[b-w35r4ri44w] { background: var(--rv-orange); }

/* Botones de acción dentro de la grilla */
.grid-action-btn[b-w35r4ri44w] {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--rv-radius-xs);
    cursor: pointer;
    transition: var(--rv-transition);
    padding: 0;
    color: white;
    font-size: 0.85rem;
}

.grid-action-btn:hover[b-w35r4ri44w] {
    transform: scale(1.12);
    box-shadow: var(--rv-shadow-md);
}

.grid-action-btn:active[b-w35r4ri44w] {
    transform: scale(0.95);
}

.grid-btn-detalle[b-w35r4ri44w] {
    background: var(--rv-primary);
}

.grid-btn-detalle:hover[b-w35r4ri44w] {
    background: var(--rv-primary-dark);
}

/* ===== ANIMACIONES ===== */
@keyframes rvSpin-b-w35r4ri44w {
    to { transform: rotate(360deg); }
}

@keyframes rvPulse-b-w35r4ri44w {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

@keyframes rvFadeIn-b-w35r4ri44w {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes rvSlideDown-b-w35r4ri44w {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

@keyframes rvSlideLeft-b-w35r4ri44w {
    from { opacity: 0; transform: translateX(20px); }
    to { opacity: 1; transform: translateX(0); }
}

/* ===== RESPONSIVE: TABLET ===== */
@media (max-width: 1280px) {
    .rv-chart-body[b-w35r4ri44w] {
        grid-template-columns: minmax(0, 1fr) 240px;
    }
}

@media (max-width: 1024px) {
    .rv-container[b-w35r4ri44w] {
        padding: 8px 10px;
        gap: 8px;
    }

    .rv-control-bar[b-w35r4ri44w] {
        flex-wrap: wrap;
        padding: 8px 12px;
    }

    .control-center[b-w35r4ri44w] {
        order: 3;
        width: 100%;
    }

    .filtros-grid[b-w35r4ri44w] {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }

    .rv-chart-wrapper[b-w35r4ri44w] {
        flex: 0 0 auto;
        max-height: none;
    }

    .rv-chart-body[b-w35r4ri44w] {
        grid-template-columns: 1fr;
        grid-template-rows: 220px auto;
    }

    .rv-chart-legend[b-w35r4ri44w] {
        max-height: 180px;
    }

    .rv-grids-wrapper[b-w35r4ri44w] {
        flex-direction: column;
    }

    .rv-grid-main.with-detail[b-w35r4ri44w] {
        flex: 1;
    }

    .rv-grid-detail[b-w35r4ri44w] {
        flex: 1;
        border-left: none;
        border-top: 3px solid var(--rv-primary);
    }
}

/* ===== RESPONSIVE: MOBILE ===== */
@media (max-width: 640px) {
    .rv-container[b-w35r4ri44w] {
        padding: 6px 8px;
        gap: 6px;
    }

    .rv-control-bar[b-w35r4ri44w] {
        flex-direction: column;
        gap: 8px;
    }

    .control-left[b-w35r4ri44w],
    .control-right[b-w35r4ri44w] {
        width: 100%;
        justify-content: center;
    }

    .control-right[b-w35r4ri44w] {
        flex-wrap: wrap;
    }

    .rv-btn[b-w35r4ri44w] {
        flex: 1;
        justify-content: center;
        min-width: 0;
    }

    .rv-btn span:not(.material-icons):not(.rzi)[b-w35r4ri44w] {
        display: none;
    }

    .filtros-grid[b-w35r4ri44w] {
        grid-template-columns: 1fr;
    }

    .rv-chart-tab span:not(.rzi)[b-w35r4ri44w] {
        display: none;
    }
}
/* /Pages/ReportesDeVenta/VentasxSucursalxProducto/VentasxSucursalxProducto.razor.rz.scp.css */
/* ===== REPORTES VENTA - VENTAS X SUCURSAL X PRODUCTO ===== */

/* Variables CSS del modulo (mismo design system que VentasxCliente) */
.rv-container[b-d5iplsexxs] {
    --rv-primary: var(--color-primary);
    --rv-primary-dark: var(--color-primary-dark);
    --rv-primary-light: var(--color-primary-light);
    --rv-accent: var(--color-warning);
    --rv-accent-dark: var(--color-warning-dark);
    --rv-accent-light: #FFFBEB;
    --rv-success: var(--color-success);
    --rv-success-light: var(--color-success-light);
    --rv-danger: var(--color-danger);
    --rv-danger-light: var(--color-danger-light);
    --rv-info: var(--color-info);
    --rv-info-light: var(--color-info-light);
    --rv-orange: var(--color-accent);
    --rv-orange-dark: var(--color-accent-dark);
    --rv-purple: #8B5CF6;
    --rv-purple-dark: #7C3AED;
    --rv-bg: var(--bg);
    --rv-card: var(--surface);
    --rv-text: var(--text);
    --rv-text-secondary: var(--text-secondary);
    --rv-text-muted: var(--text-muted);
    --rv-border: var(--border);
    --rv-shadow-sm: var(--shadow-xs);
    --rv-shadow: var(--shadow-sm);
    --rv-shadow-md: var(--shadow-md);
    --rv-shadow-lg: var(--shadow-lg);
    --rv-radius: var(--radius-lg);
    --rv-radius-sm: var(--radius-md);
    --rv-radius-xs: var(--radius-sm);
    --rv-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--rv-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.rv-control-bar[b-d5iplsexxs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--rv-card);
    border-radius: var(--rv-radius);
    box-shadow: var(--rv-shadow);
    padding: 8px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 48px;
}

.control-left[b-d5iplsexxs] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.control-left label[b-d5iplsexxs] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--rv-text-secondary);
    white-space: nowrap;
}

[b-d5iplsexxs] .control-left .rz-spinner {
    width: 75px !important;
    border-radius: var(--rv-radius-xs) !important;
}

[b-d5iplsexxs] .control-left .rz-spinner input {
    height: 32px !important;
    font-size: 0.8rem !important;
}

.control-center[b-d5iplsexxs] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loading-indicator[b-d5iplsexxs] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: rvFadeIn-b-d5iplsexxs 0.3s ease;
}

.loading-spinner[b-d5iplsexxs] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--rv-border);
    border-top-color: var(--rv-primary);
    border-radius: 50%;
    animation: rvSpin-b-d5iplsexxs 0.8s linear infinite;
}

.loading-text[b-d5iplsexxs] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--rv-primary);
    animation: rvPulse-b-d5iplsexxs 1.5s ease-in-out infinite;
}

.control-right[b-d5iplsexxs] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES DE ACCION ===== */
.rv-btn[b-d5iplsexxs] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--rv-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--rv-transition);
    white-space: nowrap;
    color: white;
}

.rv-btn:hover[b-d5iplsexxs] {
    transform: translateY(-1px);
    box-shadow: var(--rv-shadow-md);
}

.rv-btn:active[b-d5iplsexxs] {
    transform: translateY(0);
}

.rv-btn .rzi[b-d5iplsexxs] {
    font-size: 1rem;
}

.btn-buscar[b-d5iplsexxs] {
    background: var(--rv-orange);
}

.btn-exportar[b-d5iplsexxs] {
    background: var(--rv-success);
}

.btn-filtros[b-d5iplsexxs] {
    background: var(--rv-info);
}

.btn-filtros.active[b-d5iplsexxs] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* ===== PANEL DE FILTROS ===== */
.filtros-wrapper[b-d5iplsexxs] {
    position: relative;
    flex-shrink: 0;
}

.filtros-panel[b-d5iplsexxs] {
    background: var(--rv-card);
    border-radius: var(--rv-radius);
    box-shadow: var(--rv-shadow-md);
    overflow: hidden;
    animation: rvSlideDown-b-d5iplsexxs 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.filtros-header[b-d5iplsexxs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--rv-border);
    background: linear-gradient(135deg, var(--rv-info-light) 0%, var(--rv-card) 100%);
}

.filtros-header h3[b-d5iplsexxs] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--rv-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.filtros-header h3 .rzi[b-d5iplsexxs] {
    color: var(--rv-info);
    font-size: 1.1rem;
}

.filtros-close-btn[b-d5iplsexxs] {
    background: none;
    border: none;
    color: var(--rv-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--rv-radius-xs);
    transition: var(--rv-transition);
    display: flex;
    align-items: center;
}

.filtros-close-btn:hover[b-d5iplsexxs] {
    background: var(--rv-danger-light);
    color: var(--rv-danger);
}

.filtros-body[b-d5iplsexxs] {
    padding: 12px 16px;
}

.filtros-grid[b-d5iplsexxs] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.filtro-field[b-d5iplsexxs] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.filtro-label[b-d5iplsexxs] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--rv-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.filtro-field[b-d5iplsexxs]  .rz-textbox,
.filtro-field[b-d5iplsexxs]  .rz-spinner,
.filtro-field[b-d5iplsexxs]  .rz-inputtext,
.filtro-field[b-d5iplsexxs]  .rz-calendar,
.filtro-field[b-d5iplsexxs]  .rz-numeric,
.filtro-field[b-d5iplsexxs]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--rv-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--rv-transition);
    background: white !important;
}

.filtro-field[b-d5iplsexxs]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--rv-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--rv-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.filtro-field[b-d5iplsexxs]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.filtro-field[b-d5iplsexxs]  .rz-textbox:focus,
.filtro-field[b-d5iplsexxs]  .rz-state-focused,
.filtro-field[b-d5iplsexxs]  input:focus,
.filtro-field[b-d5iplsexxs]  .rz-calendar:focus-within,
.filtro-field[b-d5iplsexxs]  .rz-numeric:focus-within {
    border-color: var(--rv-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

.filtro-field[b-d5iplsexxs]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== SECCION GRAFICO + LEYENDA ===== */
.rv-chart-wrapper[b-d5iplsexxs] {
    flex: 0 0 40%;
    min-height: 280px;
    max-height: 42%;
    background: var(--rv-card);
    border-radius: var(--rv-radius);
    box-shadow: var(--rv-shadow);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.rv-chart-header[b-d5iplsexxs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 14px;
    border-bottom: 1px solid var(--rv-border);
    background: linear-gradient(135deg, var(--rv-primary-light) 0%, var(--rv-card) 100%);
    flex-shrink: 0;
}

.rv-chart-title[b-d5iplsexxs] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--rv-text);
}

.rv-chart-title .rzi[b-d5iplsexxs] {
    color: var(--rv-primary);
    font-size: 1.1rem;
}

.rv-chart-tabs[b-d5iplsexxs] {
    display: inline-flex;
    background: var(--rv-bg);
    border-radius: var(--rv-radius-xs);
    padding: 2px;
    gap: 2px;
}

.rv-chart-tab[b-d5iplsexxs] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 10px;
    border: none;
    background: transparent;
    border-radius: var(--rv-radius-xs);
    cursor: pointer;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--rv-text-secondary);
    transition: var(--rv-transition);
}

.rv-chart-tab .rzi[b-d5iplsexxs] {
    font-size: 0.95rem;
}

.rv-chart-tab:hover[b-d5iplsexxs] {
    color: var(--rv-primary);
}

.rv-chart-tab.active[b-d5iplsexxs] {
    background: var(--rv-card);
    color: var(--rv-primary);
    box-shadow: var(--rv-shadow-sm);
}

.rv-chart-body[b-d5iplsexxs] {
    flex: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 12px;
    padding: 10px 14px;
    min-height: 0;
}

.rv-chart-area[b-d5iplsexxs] {
    background: var(--rv-card);
    border-radius: var(--rv-radius-sm);
    min-height: 0;
    min-width: 0;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

[b-d5iplsexxs] .rv-chart-area .rz-chart {
    width: 100% !important;
    height: 100% !important;
}

.rv-empty[b-d5iplsexxs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: var(--rv-text-muted);
    font-size: 0.85rem;
    text-align: center;
    padding: 12px;
}

.rv-empty .rzi[b-d5iplsexxs] {
    font-size: 2.4rem;
    color: var(--rv-text-muted);
    opacity: 0.6;
}

/* Leyenda lateral */
.rv-chart-legend[b-d5iplsexxs] {
    display: flex;
    flex-direction: column;
    background: var(--rv-bg);
    border-radius: var(--rv-radius-sm);
    overflow: hidden;
    min-height: 0;
}

.rv-legend-header[b-d5iplsexxs] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    background: var(--rv-card);
    border-bottom: 1px solid var(--rv-border);
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--rv-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    flex-shrink: 0;
}

.rv-legend-header .rzi[b-d5iplsexxs] {
    font-size: 0.95rem;
    color: var(--rv-primary);
}

.rv-legend-list[b-d5iplsexxs] {
    flex: 1;
    overflow-y: auto;
    padding: 4px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.rv-legend-item[b-d5iplsexxs] {
    display: grid;
    grid-template-columns: 12px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 7px 8px;
    border-radius: var(--rv-radius-xs);
    cursor: pointer;
    transition: var(--rv-transition);
    background: transparent;
}

.rv-legend-item:hover[b-d5iplsexxs] {
    background: var(--rv-card);
    transform: translateX(2px);
}

.rv-legend-item.active[b-d5iplsexxs] {
    background: var(--rv-primary-light);
    box-shadow: inset 0 0 0 1.5px var(--rv-primary);
}

.rv-legend-dot[b-d5iplsexxs] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    flex-shrink: 0;
    box-shadow: 0 0 0 2px rgba(255,255,255,0.8);
}

.rv-legend-info[b-d5iplsexxs] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.rv-legend-name[b-d5iplsexxs] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--rv-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rv-legend-meta[b-d5iplsexxs] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.68rem;
    color: var(--rv-text-secondary);
}

.rv-legend-rut[b-d5iplsexxs] {
    color: var(--rv-text-secondary);
}

.rv-legend-amount[b-d5iplsexxs] {
    font-weight: 700;
    color: var(--rv-success);
}

.rv-legend-count[b-d5iplsexxs] {
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--rv-text-secondary);
    background: var(--rv-card);
    padding: 2px 7px;
    border-radius: 999px;
    min-width: 24px;
    text-align: center;
    box-shadow: var(--rv-shadow-sm);
}

.rv-legend-empty[b-d5iplsexxs] {
    color: var(--rv-text-muted);
    font-size: 0.8rem;
    text-align: center;
    padding: 20px 12px;
}

/* Tooltip personalizado del chart */
.rv-tooltip[b-d5iplsexxs] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: 0.75rem;
    line-height: 1.3;
}

.rv-tooltip strong[b-d5iplsexxs] {
    font-size: 0.82rem;
    margin-bottom: 2px;
}

/* ===== SECCION GRILLAS (PRINCIPAL + DETALLE LATERAL) ===== */
.rv-grids-wrapper[b-d5iplsexxs] {
    flex: 1;
    display: flex;
    gap: 10px;
    min-height: 0;
}

.rv-grid-main[b-d5iplsexxs] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--rv-card);
    border-radius: var(--rv-radius);
    box-shadow: var(--rv-shadow);
    overflow: hidden;
    min-height: 0;
    min-width: 0;
    transition: flex 0.25s ease;
}

.rv-grid-main.with-detail[b-d5iplsexxs] {
    flex: 0.4;
    min-width: 320px;
}

.rv-grid-detail[b-d5iplsexxs] {
    flex: 0.6;
    min-width: 0;
    display: flex;
    flex-direction: column;
    background: var(--rv-card);
    border-radius: var(--rv-radius);
    box-shadow: var(--rv-shadow-md);
    overflow: hidden;
    min-height: 0;
    animation: rvSlideLeft-b-d5iplsexxs 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border-left: 3px solid var(--rv-primary);
}

.rv-grid-header[b-d5iplsexxs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 14px;
    border-bottom: 1px solid var(--rv-border);
    background: linear-gradient(135deg, var(--rv-bg) 0%, var(--rv-card) 100%);
    flex-shrink: 0;
}

.rv-grid-title[b-d5iplsexxs] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--rv-text);
    min-width: 0;
}

.rv-grid-title > span:nth-child(2)[b-d5iplsexxs] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rv-grid-title .rzi[b-d5iplsexxs] {
    color: var(--rv-primary);
    font-size: 1.1rem;
    flex-shrink: 0;
}

.rv-grid-badge[b-d5iplsexxs] {
    font-size: 0.7rem;
    font-weight: 700;
    background: var(--rv-primary-light);
    color: var(--rv-primary-dark);
    padding: 2px 8px;
    border-radius: 999px;
    min-width: 22px;
    text-align: center;
    flex-shrink: 0;
}

.rv-detail-loading[b-d5iplsexxs] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

/* ===== ESTILOS GRILLA RADZEN ===== */
[b-d5iplsexxs] .rv-grid-main .rz-datatable,
[b-d5iplsexxs] .rv-grid-detail .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

[b-d5iplsexxs] .rv-grid-main .rz-datatable-thead > tr > th,
[b-d5iplsexxs] .rv-grid-detail .rz-datatable-thead > tr > th {
    background: var(--rv-bg) !important;
    color: var(--rv-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--rv-border) !important;
}

[b-d5iplsexxs] .rv-grid-main .rz-datatable-tbody > tr,
[b-d5iplsexxs] .rv-grid-detail .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
    cursor: pointer;
}

[b-d5iplsexxs] .rv-grid-main .rz-datatable-tbody > tr:hover,
[b-d5iplsexxs] .rv-grid-detail .rz-datatable-tbody > tr:hover {
    background-color: var(--rv-primary-light) !important;
}

[b-d5iplsexxs] .rv-grid-main .rz-datatable-tbody > tr.rz-state-highlight,
[b-d5iplsexxs] .rv-grid-main .rz-datatable-tbody > tr.rz-selected {
    background-color: var(--rv-primary-light) !important;
    box-shadow: inset 3px 0 0 var(--rv-primary);
}

[b-d5iplsexxs] .rv-grid-main .rz-datatable-tbody > tr > td,
[b-d5iplsexxs] .rv-grid-detail .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-d5iplsexxs] .rv-grid-main .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

/* La grilla de detalle vive en un espacio mas compacto: reducimos paddings y cabecera */
[b-d5iplsexxs] .rv-grid-detail .rz-datatable-thead > tr > th {
    padding: 6px 6px !important;
    font-size: 0.65rem !important;
    letter-spacing: 0.02em !important;
}

[b-d5iplsexxs] .rv-grid-detail .rz-datatable-tbody > tr > td {
    padding: 4px 6px !important;
    font-size: 0.75rem;
}

/* Pildora del tipo de DTE */
.rv-pill[b-d5iplsexxs] {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 700;
    color: white;
    background: var(--rv-text-secondary);
    line-height: 1.25;
    white-space: nowrap;
}

.rv-pill-33[b-d5iplsexxs] { background: var(--rv-primary); }
.rv-pill-39[b-d5iplsexxs] { background: var(--rv-info); }
.rv-pill-61[b-d5iplsexxs] { background: var(--rv-danger); }
.rv-pill-34[b-d5iplsexxs] { background: var(--rv-success); }
.rv-pill-56[b-d5iplsexxs] { background: var(--rv-orange); }

/* Botones de accion dentro de la grilla */
.grid-action-btn[b-d5iplsexxs] {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--rv-radius-xs);
    cursor: pointer;
    transition: var(--rv-transition);
    padding: 0;
    color: white;
    font-size: 0.85rem;
}

.grid-action-btn:hover[b-d5iplsexxs] {
    transform: scale(1.12);
    box-shadow: var(--rv-shadow-md);
}

.grid-action-btn:active[b-d5iplsexxs] {
    transform: scale(0.95);
}

.grid-btn-detalle[b-d5iplsexxs] {
    background: var(--rv-primary);
}

.grid-btn-detalle:hover[b-d5iplsexxs] {
    background: var(--rv-primary-dark);
}

/* ===== ANIMACIONES ===== */
@keyframes rvSpin-b-d5iplsexxs {
    to { transform: rotate(360deg); }
}

@keyframes rvPulse-b-d5iplsexxs {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

@keyframes rvFadeIn-b-d5iplsexxs {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes rvSlideDown-b-d5iplsexxs {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

@keyframes rvSlideLeft-b-d5iplsexxs {
    from { opacity: 0; transform: translateX(20px); }
    to { opacity: 1; transform: translateX(0); }
}

/* ===== RESPONSIVE: TABLET ===== */
@media (max-width: 1280px) {
    .rv-chart-body[b-d5iplsexxs] {
        grid-template-columns: minmax(0, 1fr) 240px;
    }
}

@media (max-width: 1024px) {
    .rv-container[b-d5iplsexxs] {
        padding: 8px 10px;
        gap: 8px;
    }

    .rv-control-bar[b-d5iplsexxs] {
        flex-wrap: wrap;
        padding: 8px 12px;
    }

    .control-center[b-d5iplsexxs] {
        order: 3;
        width: 100%;
    }

    .filtros-grid[b-d5iplsexxs] {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }

    .rv-chart-wrapper[b-d5iplsexxs] {
        flex: 0 0 auto;
        max-height: none;
    }

    .rv-chart-body[b-d5iplsexxs] {
        grid-template-columns: 1fr;
        grid-template-rows: 220px auto;
    }

    .rv-chart-legend[b-d5iplsexxs] {
        max-height: 180px;
    }

    .rv-grids-wrapper[b-d5iplsexxs] {
        flex-direction: column;
    }

    .rv-grid-main.with-detail[b-d5iplsexxs] {
        flex: 1;
    }

    .rv-grid-detail[b-d5iplsexxs] {
        flex: 1;
        border-left: none;
        border-top: 3px solid var(--rv-primary);
    }
}

/* ===== RESPONSIVE: MOBILE ===== */
@media (max-width: 640px) {
    .rv-container[b-d5iplsexxs] {
        padding: 6px 8px;
        gap: 6px;
    }

    .rv-control-bar[b-d5iplsexxs] {
        flex-direction: column;
        gap: 8px;
    }

    .control-left[b-d5iplsexxs],
    .control-right[b-d5iplsexxs] {
        width: 100%;
        justify-content: center;
    }

    .control-right[b-d5iplsexxs] {
        flex-wrap: wrap;
    }

    .rv-btn[b-d5iplsexxs] {
        flex: 1;
        justify-content: center;
        min-width: 0;
    }

    .rv-btn span:not(.material-icons):not(.rzi)[b-d5iplsexxs] {
        display: none;
    }

    .filtros-grid[b-d5iplsexxs] {
        grid-template-columns: 1fr;
    }

    .rv-chart-tab span:not(.rzi)[b-d5iplsexxs] {
        display: none;
    }
}
/* /Pages/ReportesDeVenta/VentasxVendedor/VentasxVendedor.razor.rz.scp.css */
/* ===== REPORTES VENTA - VENTAS X VENDEDOR ===== */

/* Variables CSS del módulo (mismo design system que VentasxCliente / DocumentosxCobrar) */
.rv-container[b-1io91h5qmo] {
    --rv-primary: var(--color-primary);
    --rv-primary-dark: var(--color-primary-dark);
    --rv-primary-light: var(--color-primary-light);
    --rv-accent: var(--color-warning);
    --rv-accent-dark: var(--color-warning-dark);
    --rv-accent-light: #FFFBEB;
    --rv-success: var(--color-success);
    --rv-success-light: var(--color-success-light);
    --rv-danger: var(--color-danger);
    --rv-danger-light: var(--color-danger-light);
    --rv-info: var(--color-info);
    --rv-info-light: var(--color-info-light);
    --rv-orange: var(--color-accent);
    --rv-orange-dark: var(--color-accent-dark);
    --rv-purple: #8B5CF6;
    --rv-purple-dark: #7C3AED;
    --rv-bg: var(--bg);
    --rv-card: var(--surface);
    --rv-text: var(--text);
    --rv-text-secondary: var(--text-secondary);
    --rv-text-muted: var(--text-muted);
    --rv-border: var(--border);
    --rv-shadow-sm: var(--shadow-xs);
    --rv-shadow: var(--shadow-sm);
    --rv-shadow-md: var(--shadow-md);
    --rv-shadow-lg: var(--shadow-lg);
    --rv-radius: var(--radius-lg);
    --rv-radius-sm: var(--radius-md);
    --rv-radius-xs: var(--radius-sm);
    --rv-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--rv-bg);
    font-family: var(--font-family);
    gap: 10px;
    padding: 10px 16px;
    box-sizing: border-box;
}

/* ===== BARRA DE CONTROL ===== */
.rv-control-bar[b-1io91h5qmo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--rv-card);
    border-radius: var(--rv-radius);
    box-shadow: var(--rv-shadow);
    padding: 8px 16px;
    flex-shrink: 0;
    gap: 12px;
    min-height: 48px;
}

.control-left[b-1io91h5qmo] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.control-left label[b-1io91h5qmo] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--rv-text-secondary);
    white-space: nowrap;
}

[b-1io91h5qmo] .control-left .rz-spinner {
    width: 75px !important;
    border-radius: var(--rv-radius-xs) !important;
}

[b-1io91h5qmo] .control-left .rz-spinner input {
    height: 32px !important;
    font-size: 0.8rem !important;
}

.control-center[b-1io91h5qmo] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loading-indicator[b-1io91h5qmo] {
    display: flex;
    align-items: center;
    gap: 10px;
    animation: rvFadeIn-b-1io91h5qmo 0.3s ease;
}

.loading-spinner[b-1io91h5qmo] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--rv-border);
    border-top-color: var(--rv-primary);
    border-radius: 50%;
    animation: rvSpin-b-1io91h5qmo 0.8s linear infinite;
}

.loading-text[b-1io91h5qmo] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--rv-primary);
    animation: rvPulse-b-1io91h5qmo 1.5s ease-in-out infinite;
}

.control-right[b-1io91h5qmo] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* ===== BOTONES DE ACCIÓN ===== */
.rv-btn[b-1io91h5qmo] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--rv-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--rv-transition);
    white-space: nowrap;
    color: white;
}

.rv-btn:hover[b-1io91h5qmo] {
    transform: translateY(-1px);
    box-shadow: var(--rv-shadow-md);
}

.rv-btn:active[b-1io91h5qmo] {
    transform: translateY(0);
}

.rv-btn .rzi[b-1io91h5qmo] {
    font-size: 1rem;
}

.btn-buscar[b-1io91h5qmo] {
    background: var(--rv-orange);
}

.btn-exportar[b-1io91h5qmo] {
    background: var(--rv-success);
}

.btn-filtros[b-1io91h5qmo] {
    background: var(--rv-info);
}

.btn-filtros.active[b-1io91h5qmo] {
    background: #0284C7;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
    transform: none;
}

/* ===== PANEL DE FILTROS ===== */
.filtros-wrapper[b-1io91h5qmo] {
    position: relative;
    flex-shrink: 0;
}

.filtros-panel[b-1io91h5qmo] {
    background: var(--rv-card);
    border-radius: var(--rv-radius);
    box-shadow: var(--rv-shadow-md);
    overflow: hidden;
    animation: rvSlideDown-b-1io91h5qmo 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.filtros-header[b-1io91h5qmo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid var(--rv-border);
    background: linear-gradient(135deg, var(--rv-info-light) 0%, var(--rv-card) 100%);
}

.filtros-header h3[b-1io91h5qmo] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--rv-text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.filtros-header h3 .rzi[b-1io91h5qmo] {
    color: var(--rv-info);
    font-size: 1.1rem;
}

.filtros-close-btn[b-1io91h5qmo] {
    background: none;
    border: none;
    color: var(--rv-text-muted);
    cursor: pointer;
    padding: 4px;
    border-radius: var(--rv-radius-xs);
    transition: var(--rv-transition);
    display: flex;
    align-items: center;
}

.filtros-close-btn:hover[b-1io91h5qmo] {
    background: var(--rv-danger-light);
    color: var(--rv-danger);
}

.filtros-body[b-1io91h5qmo] {
    padding: 12px 16px;
}

.filtros-grid[b-1io91h5qmo] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}

.filtro-field[b-1io91h5qmo] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.filtro-label[b-1io91h5qmo] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--rv-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.filtro-field[b-1io91h5qmo]  .rz-textbox,
.filtro-field[b-1io91h5qmo]  .rz-spinner,
.filtro-field[b-1io91h5qmo]  .rz-inputtext,
.filtro-field[b-1io91h5qmo]  .rz-calendar,
.filtro-field[b-1io91h5qmo]  .rz-numeric,
.filtro-field[b-1io91h5qmo]  input {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--rv-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--rv-transition);
    background: white !important;
}

.filtro-field[b-1io91h5qmo]  .rz-dropdown {
    border: 1.5px solid #CBD5E1 !important;
    border-radius: var(--rv-radius-xs) !important;
    font-size: 0.8rem !important;
    height: 32px !important;
    transition: var(--rv-transition);
    background: white !important;
    box-sizing: border-box !important;
}

.filtro-field[b-1io91h5qmo]  .rz-dropdown-trigger {
    border: none !important;
    background: transparent !important;
}

.filtro-field[b-1io91h5qmo]  .rz-textbox:focus,
.filtro-field[b-1io91h5qmo]  .rz-state-focused,
.filtro-field[b-1io91h5qmo]  input:focus,
.filtro-field[b-1io91h5qmo]  .rz-calendar:focus-within,
.filtro-field[b-1io91h5qmo]  .rz-numeric:focus-within {
    border-color: var(--rv-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

.filtro-field[b-1io91h5qmo]  .rz-dropdown .rz-dropdown-label {
    border: none !important;
    height: 100% !important;
    line-height: 1 !important;
    padding: 0 8px !important;
    font-size: 0.8rem !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== SECCIÓN GRÁFICO + LEYENDA ===== */
.rv-chart-wrapper[b-1io91h5qmo] {
    flex: 0 0 40%;
    min-height: 280px;
    max-height: 42%;
    background: var(--rv-card);
    border-radius: var(--rv-radius);
    box-shadow: var(--rv-shadow);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.rv-chart-header[b-1io91h5qmo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 14px;
    border-bottom: 1px solid var(--rv-border);
    background: linear-gradient(135deg, var(--rv-primary-light) 0%, var(--rv-card) 100%);
    flex-shrink: 0;
}

.rv-chart-title[b-1io91h5qmo] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--rv-text);
}

.rv-chart-title .rzi[b-1io91h5qmo] {
    color: var(--rv-primary);
    font-size: 1.1rem;
}

.rv-chart-tabs[b-1io91h5qmo] {
    display: inline-flex;
    background: var(--rv-bg);
    border-radius: var(--rv-radius-xs);
    padding: 2px;
    gap: 2px;
}

.rv-chart-tab[b-1io91h5qmo] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 10px;
    border: none;
    background: transparent;
    border-radius: var(--rv-radius-xs);
    cursor: pointer;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--rv-text-secondary);
    transition: var(--rv-transition);
}

.rv-chart-tab .rzi[b-1io91h5qmo] {
    font-size: 0.95rem;
}

.rv-chart-tab:hover[b-1io91h5qmo] {
    color: var(--rv-primary);
}

.rv-chart-tab.active[b-1io91h5qmo] {
    background: var(--rv-card);
    color: var(--rv-primary);
    box-shadow: var(--rv-shadow-sm);
}

.rv-chart-body[b-1io91h5qmo] {
    flex: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 12px;
    padding: 10px 14px;
    min-height: 0;
}

.rv-chart-area[b-1io91h5qmo] {
    background: var(--rv-card);
    border-radius: var(--rv-radius-sm);
    min-height: 0;
    min-width: 0;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

[b-1io91h5qmo] .rv-chart-area .rz-chart {
    width: 100% !important;
    height: 100% !important;
}

.rv-empty[b-1io91h5qmo] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: var(--rv-text-muted);
    font-size: 0.85rem;
    text-align: center;
    padding: 12px;
}

.rv-empty .rzi[b-1io91h5qmo] {
    font-size: 2.4rem;
    color: var(--rv-text-muted);
    opacity: 0.6;
}

/* Leyenda lateral */
.rv-chart-legend[b-1io91h5qmo] {
    display: flex;
    flex-direction: column;
    background: var(--rv-bg);
    border-radius: var(--rv-radius-sm);
    overflow: hidden;
    min-height: 0;
}

.rv-legend-header[b-1io91h5qmo] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    background: var(--rv-card);
    border-bottom: 1px solid var(--rv-border);
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--rv-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    flex-shrink: 0;
}

.rv-legend-header .rzi[b-1io91h5qmo] {
    font-size: 0.95rem;
    color: var(--rv-primary);
}

.rv-legend-list[b-1io91h5qmo] {
    flex: 1;
    overflow-y: auto;
    padding: 4px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.rv-legend-item[b-1io91h5qmo] {
    display: grid;
    grid-template-columns: 12px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 7px 8px;
    border-radius: var(--rv-radius-xs);
    cursor: pointer;
    transition: var(--rv-transition);
    background: transparent;
}

.rv-legend-item:hover[b-1io91h5qmo] {
    background: var(--rv-card);
    transform: translateX(2px);
}

.rv-legend-item.active[b-1io91h5qmo] {
    background: var(--rv-primary-light);
    box-shadow: inset 0 0 0 1.5px var(--rv-primary);
}

.rv-legend-dot[b-1io91h5qmo] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    flex-shrink: 0;
    box-shadow: 0 0 0 2px rgba(255,255,255,0.8);
}

.rv-legend-info[b-1io91h5qmo] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.rv-legend-name[b-1io91h5qmo] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--rv-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rv-legend-meta[b-1io91h5qmo] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.68rem;
    color: var(--rv-text-secondary);
}

.rv-legend-rut[b-1io91h5qmo] {
    color: var(--rv-text-secondary);
}

.rv-legend-amount[b-1io91h5qmo] {
    font-weight: 700;
    color: var(--rv-success);
}

.rv-legend-count[b-1io91h5qmo] {
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--rv-text-secondary);
    background: var(--rv-card);
    padding: 2px 7px;
    border-radius: 999px;
    min-width: 24px;
    text-align: center;
    box-shadow: var(--rv-shadow-sm);
}

.rv-legend-empty[b-1io91h5qmo] {
    color: var(--rv-text-muted);
    font-size: 0.8rem;
    text-align: center;
    padding: 20px 12px;
}

/* Tooltip personalizado del chart */
.rv-tooltip[b-1io91h5qmo] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: 0.75rem;
    line-height: 1.3;
}

.rv-tooltip strong[b-1io91h5qmo] {
    font-size: 0.82rem;
    margin-bottom: 2px;
}

/* ===== SECCIÓN GRILLAS (PRINCIPAL + DETALLE LATERAL) ===== */
.rv-grids-wrapper[b-1io91h5qmo] {
    flex: 1;
    display: flex;
    gap: 10px;
    min-height: 0;
}

.rv-grid-main[b-1io91h5qmo] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--rv-card);
    border-radius: var(--rv-radius);
    box-shadow: var(--rv-shadow);
    overflow: hidden;
    min-height: 0;
    min-width: 0;
    transition: flex 0.25s ease;
}

.rv-grid-main.with-detail[b-1io91h5qmo] {
    flex: 0.4;
    min-width: 320px;
}

.rv-grid-detail[b-1io91h5qmo] {
    flex: 0.6;
    min-width: 0;
    display: flex;
    flex-direction: column;
    background: var(--rv-card);
    border-radius: var(--rv-radius);
    box-shadow: var(--rv-shadow-md);
    overflow: hidden;
    min-height: 0;
    animation: rvSlideLeft-b-1io91h5qmo 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border-left: 3px solid var(--rv-primary);
}

.rv-grid-header[b-1io91h5qmo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 14px;
    border-bottom: 1px solid var(--rv-border);
    background: linear-gradient(135deg, var(--rv-bg) 0%, var(--rv-card) 100%);
    flex-shrink: 0;
}

.rv-grid-title[b-1io91h5qmo] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--rv-text);
    min-width: 0;
}

.rv-grid-title > span:nth-child(2)[b-1io91h5qmo] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rv-grid-title .rzi[b-1io91h5qmo] {
    color: var(--rv-primary);
    font-size: 1.1rem;
    flex-shrink: 0;
}

.rv-grid-badge[b-1io91h5qmo] {
    font-size: 0.7rem;
    font-weight: 700;
    background: var(--rv-primary-light);
    color: var(--rv-primary-dark);
    padding: 2px 8px;
    border-radius: 999px;
    min-width: 22px;
    text-align: center;
    flex-shrink: 0;
}

.rv-detail-loading[b-1io91h5qmo] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

/* ===== ESTILOS GRILLA RADZEN ===== */
[b-1io91h5qmo] .rv-grid-main .rz-datatable,
[b-1io91h5qmo] .rv-grid-detail .rz-datatable {
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.8rem;
}

[b-1io91h5qmo] .rv-grid-main .rz-datatable-thead > tr > th,
[b-1io91h5qmo] .rv-grid-detail .rz-datatable-thead > tr > th {
    background: var(--rv-bg) !important;
    color: var(--rv-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 8px 10px !important;
    border-bottom: 2px solid var(--rv-border) !important;
}

[b-1io91h5qmo] .rv-grid-main .rz-datatable-tbody > tr,
[b-1io91h5qmo] .rv-grid-detail .rz-datatable-tbody > tr {
    transition: background-color 0.15s ease;
    cursor: pointer;
}

[b-1io91h5qmo] .rv-grid-main .rz-datatable-tbody > tr:hover,
[b-1io91h5qmo] .rv-grid-detail .rz-datatable-tbody > tr:hover {
    background-color: var(--rv-primary-light) !important;
}

[b-1io91h5qmo] .rv-grid-main .rz-datatable-tbody > tr.rz-state-highlight,
[b-1io91h5qmo] .rv-grid-main .rz-datatable-tbody > tr.rz-selected {
    background-color: var(--rv-primary-light) !important;
    box-shadow: inset 3px 0 0 var(--rv-primary);
}

[b-1io91h5qmo] .rv-grid-main .rz-datatable-tbody > tr > td,
[b-1io91h5qmo] .rv-grid-detail .rz-datatable-tbody > tr > td {
    padding: 5px 10px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    font-size: 0.78rem;
}

/* Resumen de registros en el paginador (tono de los registros de la grilla) */
[b-1io91h5qmo] .rv-grid-main .rz-pager .rz-pager-summary {
    color: var(--text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

/* La grilla de detalle vive en un espacio más compacto: reducimos paddings y cabecera */
[b-1io91h5qmo] .rv-grid-detail .rz-datatable-thead > tr > th {
    padding: 6px 6px !important;
    font-size: 0.65rem !important;
    letter-spacing: 0.02em !important;
}

[b-1io91h5qmo] .rv-grid-detail .rz-datatable-tbody > tr > td {
    padding: 4px 6px !important;
    font-size: 0.75rem;
}

/* Píldora del tipo de DTE (cabe sin desbordar la celda de 95px) */
.rv-pill[b-1io91h5qmo] {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 700;
    color: white;
    background: var(--rv-text-secondary);
    line-height: 1.25;
    white-space: nowrap;
}

.rv-pill-33[b-1io91h5qmo] { background: var(--rv-primary); }
.rv-pill-39[b-1io91h5qmo] { background: var(--rv-info); }
.rv-pill-61[b-1io91h5qmo] { background: var(--rv-danger); }
.rv-pill-34[b-1io91h5qmo] { background: var(--rv-success); }
.rv-pill-56[b-1io91h5qmo] { background: var(--rv-orange); }

/* Botones de acción dentro de la grilla */
.grid-action-btn[b-1io91h5qmo] {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--rv-radius-xs);
    cursor: pointer;
    transition: var(--rv-transition);
    padding: 0;
    color: white;
    font-size: 0.85rem;
}

.grid-action-btn:hover[b-1io91h5qmo] {
    transform: scale(1.12);
    box-shadow: var(--rv-shadow-md);
}

.grid-action-btn:active[b-1io91h5qmo] {
    transform: scale(0.95);
}

.grid-btn-detalle[b-1io91h5qmo] {
    background: var(--rv-primary);
}

.grid-btn-detalle:hover[b-1io91h5qmo] {
    background: var(--rv-primary-dark);
}

/* ===== ANIMACIONES ===== */
@keyframes rvSpin-b-1io91h5qmo {
    to { transform: rotate(360deg); }
}

@keyframes rvPulse-b-1io91h5qmo {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

@keyframes rvFadeIn-b-1io91h5qmo {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes rvSlideDown-b-1io91h5qmo {
    from { opacity: 0; transform: translateY(-8px); max-height: 0; }
    to { opacity: 1; transform: translateY(0); max-height: 500px; }
}

@keyframes rvSlideLeft-b-1io91h5qmo {
    from { opacity: 0; transform: translateX(20px); }
    to { opacity: 1; transform: translateX(0); }
}

/* ===== RESPONSIVE: TABLET ===== */
@media (max-width: 1280px) {
    .rv-chart-body[b-1io91h5qmo] {
        grid-template-columns: minmax(0, 1fr) 240px;
    }
}

@media (max-width: 1024px) {
    .rv-container[b-1io91h5qmo] {
        padding: 8px 10px;
        gap: 8px;
    }

    .rv-control-bar[b-1io91h5qmo] {
        flex-wrap: wrap;
        padding: 8px 12px;
    }

    .control-center[b-1io91h5qmo] {
        order: 3;
        width: 100%;
    }

    .filtros-grid[b-1io91h5qmo] {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }

    .rv-chart-wrapper[b-1io91h5qmo] {
        flex: 0 0 auto;
        max-height: none;
    }

    .rv-chart-body[b-1io91h5qmo] {
        grid-template-columns: 1fr;
        grid-template-rows: 220px auto;
    }

    .rv-chart-legend[b-1io91h5qmo] {
        max-height: 180px;
    }

    .rv-grids-wrapper[b-1io91h5qmo] {
        flex-direction: column;
    }

    .rv-grid-main.with-detail[b-1io91h5qmo] {
        flex: 1;
    }

    .rv-grid-detail[b-1io91h5qmo] {
        flex: 1;
        border-left: none;
        border-top: 3px solid var(--rv-primary);
    }
}

/* ===== RESPONSIVE: MOBILE ===== */
@media (max-width: 640px) {
    .rv-container[b-1io91h5qmo] {
        padding: 6px 8px;
        gap: 6px;
    }

    .rv-control-bar[b-1io91h5qmo] {
        flex-direction: column;
        gap: 8px;
    }

    .control-left[b-1io91h5qmo],
    .control-right[b-1io91h5qmo] {
        width: 100%;
        justify-content: center;
    }

    .control-right[b-1io91h5qmo] {
        flex-wrap: wrap;
    }

    .rv-btn[b-1io91h5qmo] {
        flex: 1;
        justify-content: center;
        min-width: 0;
    }

    .rv-btn span:not(.material-icons):not(.rzi)[b-1io91h5qmo] {
        display: none;
    }

    .filtros-grid[b-1io91h5qmo] {
        grid-template-columns: 1fr;
    }

    .rv-chart-tab span:not(.rzi)[b-1io91h5qmo] {
        display: none;
    }
}
/* /Pages/Ventas/NuevoDocumento/Componentes/DescuentosGlobalesTab.razor.rz.scp.css */
/* Estilos propios del tab "Desc/Rec global" (CSS isolation de Blazor).
   Las clases de seccion (.dte-tab-section, .dte-field-label, .dte-tab-section-title,
   .dte-tab-actions) vienen de Facturador.razor.css via ::deep, igual que en los
   demas tabs hijos. */

/* "Agregar ajuste" = accion de confirmar → mismo estilo compacto que el boton
   "Aplicar" del tab "Otros": indigo plano con tokens (DESIGN_SYSTEM §4.1/§4.3) */
.dscrcg-agregar-btn[b-wef5q7k6bk] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    background: var(--color-primary);
    color: #fff;
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    font-weight: var(--fw-bold);
    cursor: pointer;
    transition: var(--transition);
}

.dscrcg-agregar-btn:hover:not(:disabled)[b-wef5q7k6bk] {
    background: var(--color-primary-dark);
}

.dscrcg-agregar-btn:disabled[b-wef5q7k6bk] {
    opacity: 0.5;
    cursor: not-allowed;
}

.dscrcg-agregar-btn .rzi[b-wef5q7k6bk] {
    font-size: 1rem;
}
/* /Pages/Ventas/NuevoDocumento/Componentes/OtrosTab.razor.rz.scp.css */
/* Estilos propios del tab "Otros" (CSS isolation de Blazor).
   Las clases de seccion (.dte-tab-section, .dte-field-label, .dte-tab-section-title)
   vienen de Facturador.razor.css via ::deep, igual que en los demas tabs hijos. */

.otros-check-row[b-csufdyz7w6] {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}

.otros-aplicar-wrap[b-csufdyz7w6] {
    display: flex;
    justify-content: flex-end;
    margin-top: 4px;
}

/* "Aplicar" = acción de confirmar → índigo plano con tokens (DESIGN_SYSTEM §4.1/§4.3) */
.otros-aplicar-btn[b-csufdyz7w6] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    background: var(--color-primary);
    color: #fff;
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    font-weight: var(--fw-bold);
    cursor: pointer;
    transition: var(--transition);
}

.otros-aplicar-btn:hover[b-csufdyz7w6] {
    background: var(--color-primary-dark);
}

.otros-aplicar-btn .rzi[b-csufdyz7w6] {
    font-size: 1rem;
}
/* /Pages/Ventas/NuevoDocumento/Componentes/Referencias.razor.rz.scp.css */
/* ===== BOTONES DE ACCIÓN DEL TAB REFERENCIAS =====
   Estilo compacto alineado con ClientesIndex (.cli-btn): botón nativo, padding
   chico, font-size 0.78rem, peso 700, ícono rzi. Color por función:
   Nuevo = índigo (primary), Grabar/Actualizar = verde (success). */
.ref-btn[b-kihirh0sob] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--fw-bold);
    letter-spacing: 0.01em;
    cursor: pointer;
    transition: var(--transition);
    color: white;
}

.ref-btn .rzi[b-kihirh0sob] {
    font-size: 1rem;
}

.ref-btn:hover[b-kihirh0sob] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.ref-btn:active[b-kihirh0sob] {
    transform: translateY(0);
}

.ref-btn-primary[b-kihirh0sob] {
    background: var(--color-primary);
}

.ref-btn-primary:hover[b-kihirh0sob] {
    background: var(--color-primary-dark);
}

.ref-btn-success[b-kihirh0sob] {
    background: var(--color-success);
}

.ref-btn-success:hover[b-kihirh0sob] {
    background: var(--color-success-dark);
}

/* Botón "Buscar DTE existente" = naranjo de marca, igual que todos los
   botones "Buscar" de la app (--color-accent). Icon-only, alto 30px para
   alinear con los inputs compactos de la fila. */
.ref-btn-search[b-kihirh0sob] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 30px;
    border: none;
    border-radius: var(--radius-md);
    background: var(--color-accent);
    color: white;
    cursor: pointer;
    transition: var(--transition);
}

.ref-btn-search .rzi[b-kihirh0sob] {
    font-size: 1.1rem;
}

.ref-btn-search:hover:not(:disabled)[b-kihirh0sob] {
    background: var(--color-accent-dark);
    box-shadow: var(--shadow-md);
}

.ref-btn-search:disabled[b-kihirh0sob] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Spinner del botón Buscar mientras consulta la API. */
.ref-spin[b-kihirh0sob] {
    animation: ref-spin-b-kihirh0sob 0.8s linear infinite;
}

@keyframes ref-spin-b-kihirh0sob {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
/* /Pages/Ventas/NuevoDocumento/Componentes/SelectorClientesModal.razor.rz.scp.css */
/* ===== MODAL SELECTOR DE CLIENTES (FACTURADOR) ===== */

.scm-modal[b-twnewp1y8f] {
    --scm-primary: var(--color-primary);
    --scm-primary-dark: var(--color-primary-dark);
    --scm-primary-light: var(--color-primary-light);
    --scm-success: var(--color-success);
    --scm-border: var(--border);
    --scm-bg: #F8FAFC;
    --scm-card: var(--surface);
    --scm-text: var(--text);
    --scm-text-secondary: var(--text-secondary);
    --scm-text-muted: var(--text-muted);
    --scm-info: var(--color-info);
    --scm-radius-xs: var(--radius-sm);
    --scm-radius-sm: var(--radius-md);
    --scm-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    background: var(--scm-bg);
    font-family: var(--font-family);
    position: relative;
}

/* ===== LOADING ===== */
.scm-loading-overlay[b-twnewp1y8f] {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    z-index: 20;
    color: var(--scm-text-secondary);
    font-weight: 600;
    font-size: 0.9rem;
}

.scm-loading-spinner[b-twnewp1y8f] {
    width: 42px;
    height: 42px;
    border: 4px solid var(--scm-border);
    border-top-color: var(--scm-primary);
    border-radius: 50%;
    animation: scmSpin-b-twnewp1y8f 0.8s linear infinite;
}

@keyframes scmSpin-b-twnewp1y8f { to { transform: rotate(360deg); } }

/* ===== TOOLBAR / BUSQUEDA ===== */
.scm-toolbar[b-twnewp1y8f] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: var(--scm-card);
    border-bottom: 1px solid var(--scm-border);
    flex-shrink: 0;
}

.scm-search[b-twnewp1y8f] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 10px;
    background: var(--scm-bg);
    border: 1.5px solid var(--scm-border);
    border-radius: var(--scm-radius-sm);
    transition: var(--scm-transition);
    height: 36px;
    max-width: 520px;
}

.scm-search:focus-within[b-twnewp1y8f] {
    border-color: var(--scm-primary);
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
    background: white;
}

.scm-search .rzi[b-twnewp1y8f] {
    color: var(--scm-text-muted);
    font-size: 1.1rem;
}

.scm-search-input[b-twnewp1y8f] {
    flex: 1;
    border: none;
    background: transparent;
    outline: none;
    font-size: 0.85rem;
    color: var(--scm-text);
    font-family: inherit;
}

.scm-search-input[b-twnewp1y8f]::placeholder {
    color: var(--scm-text-muted);
}

.scm-search-clear[b-twnewp1y8f] {
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--scm-text-muted);
    padding: 2px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--scm-transition);
}

.scm-search-clear:hover[b-twnewp1y8f] {
    background: var(--scm-border);
    color: var(--scm-text);
}

.scm-toolbar-right[b-twnewp1y8f] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.scm-count[b-twnewp1y8f] {
    font-size: 0.78rem;
    color: var(--scm-text-secondary);
    font-weight: 600;
}

/* ===== GRILLA ===== */
.scm-grid-wrap[b-twnewp1y8f] {
    flex: 1;
    overflow: auto;
    min-height: 0;
    background: var(--scm-card);
}

.scm-grid[b-twnewp1y8f] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
}

.scm-grid thead th[b-twnewp1y8f] {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--scm-bg);
    color: var(--scm-text-secondary);
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 9px 10px;
    text-align: left;
    border-bottom: 1.5px solid var(--scm-border);
}

.scm-grid tbody tr[b-twnewp1y8f] {
    transition: background-color 0.15s ease;
}

.scm-grid tbody tr:hover[b-twnewp1y8f] {
    background: var(--scm-primary-light);
}

.scm-grid tbody td[b-twnewp1y8f] {
    padding: 8px 10px;
    border-bottom: 1px dashed #F1F5F9;
    color: var(--scm-text);
    vertical-align: middle;
}

.scm-cell-rut[b-twnewp1y8f] {
    font-family: 'Consolas', 'Monaco', monospace;
    font-size: 0.78rem;
    color: var(--scm-text-secondary);
    font-weight: 600;
    white-space: nowrap;
}

.scm-grid thead th:first-child[b-twnewp1y8f],
.scm-grid tbody td:first-child[b-twnewp1y8f] {
    width: 150px;
    min-width: 150px;
}

.scm-cell-name[b-twnewp1y8f] {
    font-weight: 600;
    color: var(--scm-text);
}

.scm-cell-sub[b-twnewp1y8f] {
    color: var(--scm-text-secondary);
    font-size: 0.78rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 260px;
}

.scm-empty[b-twnewp1y8f] {
    padding: 40px 14px;
    text-align: center;
    color: var(--scm-text-muted);
    font-size: 0.9rem;
}

/* ===== SELECT BUTTON ===== */
/* Seleccionar = teal (DESIGN_SYSTEM §4.3) */
.scm-select-btn[b-twnewp1y8f] {
    width: 32px;
    height: 32px;
    border: none;
    border-radius: var(--scm-radius-xs);
    background: var(--color-select);
    color: white;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: var(--scm-transition);
}

.scm-select-btn:hover[b-twnewp1y8f] {
    transform: translateY(-1px) scale(1.05);
    box-shadow: var(--shadow-md);
}

.scm-select-btn:active[b-twnewp1y8f] {
    transform: translateY(0) scale(0.95);
}

.scm-select-btn .rzi[b-twnewp1y8f] { font-size: 1.2rem; }

/* ===== FOOTER ===== */
.scm-footer[b-twnewp1y8f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 16px;
    border-top: 1px solid var(--scm-border);
    background: var(--scm-card);
    flex-shrink: 0;
}

.scm-footer-hint[b-twnewp1y8f] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.78rem;
    color: var(--scm-text-secondary);
}

.scm-footer-hint .rzi[b-twnewp1y8f] {
    color: var(--scm-info);
    font-size: 1.1rem;
}

.scm-btn[b-twnewp1y8f] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--scm-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    color: white;
    transition: var(--scm-transition);
}

.scm-btn:hover[b-twnewp1y8f] {
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.scm-btn .rzi[b-twnewp1y8f] { font-size: 1rem; }

.scm-btn-secondary[b-twnewp1y8f] {
    background: var(--color-secondary);
    color: #fff;
    border: none;
}

.scm-btn-secondary:hover[b-twnewp1y8f] {
    background: var(--color-secondary-dark);
}
/* /Pages/Ventas/NuevoDocumento/Componentes/SelectorProductosModal.razor.rz.scp.css */
/* ===== MODAL SELECTOR DE PRODUCTOS (FACTURADOR) ===== */

.spm-modal[b-pn2pu4wq1w] {
    --spm-primary: var(--color-primary);
    --spm-primary-dark: var(--color-primary-dark);
    --spm-primary-light: var(--color-primary-light);
    --spm-success: var(--color-success);
    --spm-success-light: var(--color-success-light);
    --spm-danger: var(--color-danger);
    --spm-accent: var(--color-warning);
    --spm-info: var(--color-info);
    --spm-info-light: var(--color-info-light);
    --spm-border: var(--border);
    --spm-bg: #F8FAFC;
    --spm-card: var(--surface);
    --spm-text: var(--text);
    --spm-text-secondary: var(--text-secondary);
    --spm-text-muted: var(--text-muted);
    --spm-radius-xs: var(--radius-sm);
    --spm-radius-sm: var(--radius-md);
    --spm-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    background: var(--spm-bg);
    font-family: var(--font-family);
    position: relative;
}

/* ===== LOADING ===== */
.spm-loading-overlay[b-pn2pu4wq1w] {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    z-index: 20;
    color: var(--spm-text-secondary);
    font-weight: 600;
    font-size: 0.9rem;
}

.spm-loading-spinner[b-pn2pu4wq1w] {
    width: 42px;
    height: 42px;
    border: 4px solid var(--spm-border);
    border-top-color: var(--spm-primary);
    border-radius: 50%;
    animation: spmSpin-b-pn2pu4wq1w 0.8s linear infinite;
}

@keyframes spmSpin-b-pn2pu4wq1w { to { transform: rotate(360deg); } }

/* ===== QUICK-ADD: agregar producto manual ===== */
.spm-quickadd[b-pn2pu4wq1w] {
    padding: 10px 14px;
    background: linear-gradient(135deg, var(--spm-primary-light) 0%, var(--spm-card) 100%);
    border-bottom: 2px solid var(--spm-primary);
    flex-shrink: 0;
}

/* Titulo clickeable que despliega/oculta el formulario manual */
.spm-quickadd-toggle[b-pn2pu4wq1w] {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    padding: 0;
    background: none;
    border: none;
    cursor: pointer;
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--spm-primary-dark);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.spm-quickadd-toggle .rzi[b-pn2pu4wq1w] {
    font-size: 0.95rem;
}

.spm-quickadd-chevron[b-pn2pu4wq1w] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: var(--radius-full);
    background: var(--spm-primary);
    color: #fff;
    box-shadow: var(--shadow-sm);
    transition: background 0.15s ease, transform 0.15s ease;
}

/* Gana en especificidad al ".spm-quickadd-toggle .rzi { font-size: 0.95rem }" */
.spm-quickadd-toggle .spm-quickadd-chevron[b-pn2pu4wq1w] {
    font-size: 1.2rem;
}

.spm-quickadd-toggle:hover .spm-quickadd-chevron[b-pn2pu4wq1w] {
    background: var(--spm-primary-dark);
    transform: scale(1.08);
}

/* Cuerpo del formulario: 2 filas (identificacion / datos comerciales) */
.spm-quickadd-body[b-pn2pu4wq1w] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 8px;
}

.spm-quickadd-row[b-pn2pu4wq1w] {
    display: flex;
    align-items: flex-end;
    gap: 8px;
}

/* Cada campo es columna: label arriba + input abajo */
.spm-qa-field[b-pn2pu4wq1w] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.spm-qa-label[b-pn2pu4wq1w] {
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    color: var(--text-secondary);
    margin-bottom: 2px;
    line-height: 1.2;
    white-space: nowrap;
}

/* Fila 1: identificacion */
.spm-qa-codigo[b-pn2pu4wq1w] { width: 140px; flex-shrink: 0; }
.spm-qa-nombre[b-pn2pu4wq1w] { flex: 1; }

/* Fila 2: datos comerciales */
.spm-qa-cant[b-pn2pu4wq1w]   { width: 90px;  flex-shrink: 0; }
.spm-qa-um[b-pn2pu4wq1w]     { flex: 1; min-width: 110px; }
.spm-qa-precio[b-pn2pu4wq1w] { width: 110px; flex-shrink: 0; }
.spm-qa-tipo[b-pn2pu4wq1w]   { width: 110px; flex-shrink: 0; }
.spm-qa-action[b-pn2pu4wq1w] { flex-shrink: 0; }

.spm-quickadd-btn[b-pn2pu4wq1w] {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
}

.spm-quickadd-btn .rzi[b-pn2pu4wq1w] { font-size: 1rem; }

/* Radzen inputs compactos dentro del quickadd */
.spm-quickadd[b-pn2pu4wq1w]  .rz-textbox,
.spm-quickadd[b-pn2pu4wq1w]  .rz-numeric,
.spm-quickadd[b-pn2pu4wq1w]  .rz-dropdown {
    height: 30px !important;
    min-height: 30px !important;
    width: 100% !important;
}

.spm-quickadd[b-pn2pu4wq1w]  .rz-textbox,
.spm-quickadd[b-pn2pu4wq1w]  .rz-numeric input {
    font-size: 0.78rem !important;
    padding: 0 8px !important;
}

.spm-quickadd[b-pn2pu4wq1w]  .rz-dropdown {
    font-size: 0.78rem !important;
}

.spm-quickadd[b-pn2pu4wq1w]  .rz-numeric-up,
.spm-quickadd[b-pn2pu4wq1w]  .rz-numeric-down {
    display: none !important;
}

/* ===== TOOLBAR / BUSQUEDA ===== */
.spm-toolbar[b-pn2pu4wq1w] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: var(--spm-card);
    border-bottom: 1px solid var(--spm-border);
    flex-shrink: 0;
}

.spm-search[b-pn2pu4wq1w] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 10px;
    background: var(--spm-bg);
    border: 1.5px solid var(--spm-border);
    border-radius: var(--spm-radius-sm);
    transition: var(--spm-transition);
    height: 36px;
    max-width: 520px;
}

.spm-search:focus-within[b-pn2pu4wq1w] {
    border-color: var(--spm-primary);
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
    background: white;
}

.spm-search .rzi[b-pn2pu4wq1w] {
    color: var(--spm-text-muted);
    font-size: 1.1rem;
}

.spm-search-input[b-pn2pu4wq1w] {
    flex: 1;
    border: none;
    background: transparent;
    outline: none;
    font-size: 0.85rem;
    color: var(--spm-text);
    font-family: inherit;
}

.spm-search-input[b-pn2pu4wq1w]::placeholder {
    color: var(--spm-text-muted);
}

.spm-search-clear[b-pn2pu4wq1w] {
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--spm-text-muted);
    padding: 2px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--spm-transition);
}

.spm-search-clear:hover[b-pn2pu4wq1w] {
    background: var(--spm-border);
    color: var(--spm-text);
}

.spm-toolbar-right[b-pn2pu4wq1w] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.spm-count[b-pn2pu4wq1w] {
    font-size: 0.78rem;
    color: var(--spm-text-secondary);
    font-weight: 600;
}

.spm-badge[b-pn2pu4wq1w] {
    background: var(--spm-primary-light);
    color: var(--spm-primary-dark);
    font-size: 0.72rem;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 999px;
    letter-spacing: 0.03em;
}

.spm-added-pill[b-pn2pu4wq1w] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--spm-success-light);
    color: #065F46;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 999px;
}

.spm-added-pill .rzi[b-pn2pu4wq1w] { font-size: 1rem; }

/* ===== GRILLA ===== */
.spm-grid-wrap[b-pn2pu4wq1w] {
    flex: 1;
    overflow: auto;
    min-height: 0;
    background: var(--spm-card);
}

.spm-grid[b-pn2pu4wq1w] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.78rem;
    table-layout: fixed;
}

.spm-grid thead th[b-pn2pu4wq1w] {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--spm-bg);
    color: var(--spm-text-secondary);
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 8px 6px;
    text-align: left;
    border-bottom: 1.5px solid var(--spm-border);
}

.spm-grid tbody tr[b-pn2pu4wq1w] {
    transition: background-color 0.15s ease;
}

.spm-grid tbody tr:hover[b-pn2pu4wq1w] {
    background: var(--spm-primary-light);
}

.spm-grid tbody td[b-pn2pu4wq1w] {
    padding: 5px 6px;
    border-bottom: 1px dashed #F1F5F9;
    color: var(--spm-text);
    vertical-align: middle;
}

.spm-cell-producto[b-pn2pu4wq1w] {
    min-width: 0;
}

.spm-cell-meta[b-pn2pu4wq1w] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 2px;
}

.spm-cell-code[b-pn2pu4wq1w] {
    font-family: 'Consolas', 'Monaco', monospace;
    font-size: 0.7rem;
    color: var(--spm-text-secondary);
    font-weight: 600;
}

.spm-cell-um[b-pn2pu4wq1w] {
    font-size: 0.66rem;
    font-weight: 700;
    color: var(--spm-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 1px 6px;
    background: #F1F5F9;
    border-radius: 4px;
}

.spm-cell-name[b-pn2pu4wq1w] {
    font-weight: 600;
    color: var(--spm-text);
    font-size: 0.82rem;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.spm-cell-desc[b-pn2pu4wq1w] {
    font-size: 0.7rem;
    color: var(--spm-text-secondary);
    margin-top: 1px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.spm-cell-subtotal[b-pn2pu4wq1w] {
    font-weight: 700;
    color: var(--spm-text);
    font-size: 0.8rem;
    text-align: right;
}

.spm-tax-badge[b-pn2pu4wq1w] {
    display: inline-block;
    padding: 1px 6px;
    border-radius: 999px;
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.03em;
}

.spm-tax-badge.afecto[b-pn2pu4wq1w] {
    background: var(--spm-info-light);
    color: #075985;
}

.spm-tax-badge.exento[b-pn2pu4wq1w] {
    background: #FEF3C7;
    color: #92400E;
}

.spm-empty[b-pn2pu4wq1w] {
    padding: 40px 14px;
    text-align: center;
    color: var(--spm-text-muted);
    font-size: 0.9rem;
}

/* ===== ADD BUTTON ===== */
.spm-add-btn[b-pn2pu4wq1w] {
    width: 28px;
    height: 28px;
    border: none;
    border-radius: var(--spm-radius-xs);
    background: var(--spm-primary);
    color: white;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: var(--spm-transition);
}

.spm-add-btn:hover[b-pn2pu4wq1w] {
    background: var(--spm-primary-dark);
    transform: translateY(-1px) scale(1.05);
    box-shadow: var(--shadow-md);
}

.spm-add-btn:active[b-pn2pu4wq1w] {
    transform: translateY(0) scale(0.95);
}

.spm-add-btn .rzi[b-pn2pu4wq1w] { font-size: 1rem; }

/* Variante del boton cuando la fila ya esta en el detalle (actualizar) */
.spm-add-btn-update[b-pn2pu4wq1w] {
    background: var(--spm-info);
}

.spm-add-btn-update:hover[b-pn2pu4wq1w] {
    box-shadow: var(--shadow-md);
}

/* Estado persistente: fila ya agregada al detalle */
.spm-row-added[b-pn2pu4wq1w] {
    background: #ECFDF5 !important;
    border-left: 3px solid var(--spm-success);
}

.spm-grid tbody tr.spm-row-added:hover[b-pn2pu4wq1w] {
    background: #D1FAE5 !important;
}

.spm-check[b-pn2pu4wq1w] {
    display: inline-flex;
    align-items: center;
    margin-left: 6px;
    color: var(--spm-success);
    vertical-align: middle;
}

.spm-check .rzi[b-pn2pu4wq1w] {
    font-size: 0.95rem;
}

/* Campos Radzen mas compactos dentro de la grilla */
.spm-grid[b-pn2pu4wq1w]  .rz-numeric {
    height: 26px !important;
    min-height: 26px !important;
    width: 100% !important;
}

.spm-grid[b-pn2pu4wq1w]  .rz-numeric input {
    height: 26px !important;
    font-size: 0.74rem !important;
    padding: 0 4px !important;
    text-align: right;
}

/* Ocultar flechas up/down de RadzenNumeric para ahorrar ancho */
.spm-grid[b-pn2pu4wq1w]  .rz-numeric-up,
.spm-grid[b-pn2pu4wq1w]  .rz-numeric-down {
    display: none !important;
}

/* Grupo selector $/% + monto de descuento (igual patron que la grilla inline) */
.spm-dscto-group[b-pn2pu4wq1w] {
    display: flex;
    gap: 4px;
    align-items: center;
}

.spm-dscto-group[b-pn2pu4wq1w]  .rz-dropdown {
    flex: 0 0 58px;
    min-width: 58px;
    height: 26px !important;
    min-height: 26px !important;
    font-size: 0.74rem !important;
}

.spm-dscto-group[b-pn2pu4wq1w]  .rz-numeric {
    flex: 1;
    min-width: 0;
}

/* ===== FOOTER ===== */
.spm-footer[b-pn2pu4wq1w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 16px;
    border-top: 1px solid var(--spm-border);
    background: var(--spm-card);
    flex-shrink: 0;
}

.spm-footer-hint[b-pn2pu4wq1w] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.78rem;
    color: var(--spm-text-secondary);
}

.spm-footer-hint .rzi[b-pn2pu4wq1w] {
    color: var(--spm-info);
    font-size: 1.1rem;
}

.spm-btn[b-pn2pu4wq1w] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--spm-radius-xs);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    color: white;
    transition: var(--spm-transition);
}

.spm-btn:hover[b-pn2pu4wq1w] {
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.spm-btn .rzi[b-pn2pu4wq1w] { font-size: 1rem; }

.spm-btn-secondary[b-pn2pu4wq1w] {
    background: var(--color-secondary);
    color: #fff;
    border: none;
}

.spm-btn-secondary:hover[b-pn2pu4wq1w] {
    background: var(--color-secondary-dark);
}
/* /Pages/Ventas/NuevoDocumento/NuevoDocumentoIndex.razor.rz.scp.css */
/* ===== DTE FACTURADOR - DESIGN SYSTEM ===== */

.dte-container[b-du9cr3h6mq] {
    --dte-primary: var(--color-primary);
    --dte-primary-dark: var(--color-primary-dark);
    --dte-primary-light: var(--color-primary-light);
    --dte-accent: var(--color-warning);
    --dte-accent-light: #FFFBEB;
    /* Naranjo "tipico" de la aplicacion (mismo tono que usan BuscarBorrador,
       DocumentosxCobrar, etc.) - se usa para destacar el chip de Tipo DTE
       en la topbar y mantener consistencia visual con el resto del sistema. */
    --dte-orange: var(--color-accent);
    --dte-orange-dark: var(--color-accent-dark);
    --dte-orange-light: #FFEDD5;
    --dte-success: var(--color-success);
    --dte-success-light: var(--color-success-light);
    --dte-danger: var(--color-danger);
    --dte-danger-light: var(--color-danger-light);
    --dte-bg: var(--bg);
    --dte-card: var(--surface);
    --dte-text: var(--text);
    --dte-text-secondary: var(--text-secondary);
    --dte-text-muted: var(--text-muted);
    --dte-border: var(--border);
    --dte-shadow-sm: var(--shadow-xs);
    --dte-shadow: var(--shadow-sm);
    --dte-shadow-lg: var(--shadow-lg);
    --dte-radius: var(--radius-lg);
    --dte-radius-sm: var(--radius-md);
    --dte-transition: var(--transition);

    display: flex;
    flex-direction: column;
    height: 100%;
    gap: 10px;
    padding: 10px 16px;
    background: var(--dte-bg);
    box-sizing: border-box;
    font-family: var(--font-family);
    overflow: hidden;
    position: relative;
}

/* ===== DRAWER LATERAL (Selector de productos) ===== */
.dte-drawer[b-du9cr3h6mq] {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(720px, 92%);
    background: var(--dte-card);
    box-shadow: -8px 0 24px rgba(15, 23, 42, 0.15);
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 50;
    border-left: 1px solid var(--dte-border);
}

.dte-drawer.open[b-du9cr3h6mq] {
    transform: translateX(0);
}

.dte-drawer-header[b-du9cr3h6mq] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--dte-border);
    background: linear-gradient(135deg, var(--dte-primary-light) 0%, var(--dte-card) 100%);
    flex-shrink: 0;
}

.dte-drawer-icon[b-du9cr3h6mq] {
    font-size: 1.2rem;
    color: var(--dte-primary);
}

.dte-drawer-title[b-du9cr3h6mq] {
    flex: 1;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--dte-text);
    letter-spacing: -0.01em;
}

.dte-drawer-close[b-du9cr3h6mq] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    background: transparent;
    color: var(--dte-text-secondary);
    border-radius: var(--dte-radius-sm);
    cursor: pointer;
    transition: var(--dte-transition);
}

.dte-drawer-close:hover[b-du9cr3h6mq] {
    background: var(--dte-danger-light);
    color: var(--dte-danger);
}

.dte-drawer-body[b-du9cr3h6mq] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* ===== TOP BAR ===== */
.dte-topbar[b-du9cr3h6mq] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    background: var(--dte-card);
    border-radius: var(--dte-radius);
    box-shadow: var(--dte-shadow);
    flex-shrink: 0;
}

.dte-topbar-group[b-du9cr3h6mq] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.dte-topbar-label[b-du9cr3h6mq] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--dte-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.dte-topbar-spacer[b-du9cr3h6mq] {
    flex: 1;
}

/* ===== TIPO DTE CHIP =====
   Destaca el dropdown del tipo de documento en la topbar para que el
   usuario siempre vea con claridad que esta a punto de emitir. Reemplaza
   al antiguo "dte-panel-header" (titulo grande encima del panel).
   Usa el naranjo "tipico" de la app (BuscarBorrador, DocumentosxCobrar)
   para alta visibilidad sin chocar con el primary index/violeta del resto
   de la pantalla. */
.dte-tipo-dte-chip[b-du9cr3h6mq] {
    padding: 4px 12px 4px 8px;
    border: 2px solid var(--dte-orange);
    border-radius: var(--dte-radius);
    background: linear-gradient(135deg, var(--dte-orange-light) 0%, var(--dte-card) 70%);
    box-shadow: 0 2px 10px rgba(249, 115, 22, 0.28);
    gap: 8px;
    transition: var(--dte-transition);
}

.dte-tipo-dte-chip:hover[b-du9cr3h6mq] {
    box-shadow: 0 4px 14px rgba(249, 115, 22, 0.4);
    transform: translateY(-1px);
}

/* Icono dentro de un "badge" circular naranjo solido para que sea el
   primer foco visual del usuario al entrar a la pantalla. */
.dte-tipo-dte-icon[b-du9cr3h6mq] {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--dte-orange);
    color: white;
    font-size: 1rem;
    flex-shrink: 0;
    box-shadow: 0 1px 3px rgba(234, 88, 12, 0.4);
}

.dte-tipo-dte-label[b-du9cr3h6mq] {
    font-size: 0.7rem;
    font-weight: 800;
    color: var(--dte-orange-dark);
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

/* Texto del nombre del DTE seleccionado en bold para que destaque
   dentro del chip. ::deep porque RadzenDropDown renderiza su propio
   markup interno. */
[b-du9cr3h6mq] .dte-tipo-dte-dropdown .rz-dropdown-label,
[b-du9cr3h6mq] .dte-tipo-dte-dropdown .rz-inputtext {
    font-weight: 700;
    color: var(--dte-text);
}

.dte-status-pill[b-du9cr3h6mq] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    background: var(--dte-accent-light);
    color: var(--dte-accent);
}

.dte-status-pill.ready[b-du9cr3h6mq] {
    background: var(--dte-success-light);
    color: var(--dte-success);
}

/* ===== MAIN CONTENT - 2 PANELS ===== */
.dte-workspace[b-du9cr3h6mq] {
    display: grid;
    grid-template-columns: 58fr 42fr;
    gap: 12px;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

.dte-panel[b-du9cr3h6mq] {
    background: var(--dte-card);
    border-radius: var(--dte-radius);
    box-shadow: var(--dte-shadow);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0;
}


.dte-panel-body[b-du9cr3h6mq] {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0;
}

/* ===== LEFT PANEL: RECEPTOR + GRILLA + TOTALES ===== */
.dte-left-sections[b-du9cr3h6mq] {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

/* Receptor */
.dte-receptor[b-du9cr3h6mq] {
    /* Padding horizontal de 12px para alinear el borde derecho de esta tarjeta
       (y del boton "Seleccionar Cliente") con la grilla de detalle y su boton
       "Buscar productos", que usan 12px. Asi ambos botones quedan verticalmente
       alineados a la derecha. */
    padding: 14px 12px;
    border-bottom: 1px solid var(--dte-border);
    background: linear-gradient(135deg, var(--dte-primary-light) 0%, var(--dte-card) 70%);
    flex-shrink: 0;
}

.dte-receptor-row[b-du9cr3h6mq] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.dte-receptor-head[b-du9cr3h6mq] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.dte-receptor-avatar-btn[b-du9cr3h6mq] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--dte-border);
    background: var(--dte-card);
    border-radius: 50%;
    padding: 0;
    width: 36px;
    height: 36px;
    cursor: pointer;
    box-shadow: var(--dte-shadow-sm);
    transition: var(--dte-transition);
}

.dte-receptor-avatar-btn:hover[b-du9cr3h6mq] {
    background: var(--dte-primary-light);
    border-color: var(--dte-primary);
}

.dte-receptor-avatar-btn.active[b-du9cr3h6mq] {
    background: var(--dte-primary);
    border-color: var(--dte-primary);
}

.dte-receptor-avatar-btn.active .dte-receptor-avatar[b-du9cr3h6mq] {
    color: white;
}

.dte-receptor-avatar[b-du9cr3h6mq] {
    font-size: 1.3rem;
    color: var(--dte-primary);
}

.dte-receptor-extra[b-du9cr3h6mq] {
    margin-top: 12px;
    padding: 10px 12px 12px;
    background: var(--dte-card);
    border: 1px solid var(--dte-border);
    border-radius: var(--dte-radius-sm);
    box-shadow: var(--dte-shadow-sm);
    animation: dteTabFadeIn-b-du9cr3h6mq 0.2s ease;
}

.dte-receptor-extra-head[b-du9cr3h6mq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
    padding-bottom: 6px;
    border-bottom: 1px dashed var(--dte-border);
}

.dte-receptor-extra-title[b-du9cr3h6mq] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--dte-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.dte-receptor-close[b-du9cr3h6mq] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border: none;
    background: transparent;
    color: var(--dte-text-muted);
    border-radius: 50%;
    cursor: pointer;
    transition: var(--dte-transition);
}

.dte-receptor-close:hover[b-du9cr3h6mq] {
    background: var(--dte-danger-light);
    color: var(--dte-danger);
}

.dte-receptor-title[b-du9cr3h6mq] {
    flex: 1;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--dte-text);
    letter-spacing: -0.01em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dte-receptor-grid[b-du9cr3h6mq] {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 18px;
    row-gap: 6px;
    padding: 4px 2px 2px;
}

.dte-receptor-grid .dte-receptor-field:nth-child(3)[b-du9cr3h6mq],
.dte-receptor-grid .dte-receptor-field:nth-child(4)[b-du9cr3h6mq] {
    grid-column: auto;
}

.dte-receptor-grid[b-du9cr3h6mq] {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.dte-receptor-field[b-du9cr3h6mq] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.dte-receptor-label[b-du9cr3h6mq] {
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--dte-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.dte-receptor-value[b-du9cr3h6mq] {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--dte-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dte-receptor-empty[b-du9cr3h6mq] {
    flex: 1;
    font-size: 0.9rem;
    color: var(--dte-text-muted);
    font-style: italic;
}

@media (max-width: 900px) {
    .dte-receptor-grid[b-du9cr3h6mq] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* ===== DETALLE: quick-add + grilla + panel edición ===== */
.dte-detalle-wrap[b-du9cr3h6mq] {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0;
}

/* Toolbar sobre la grilla de detalle (contador + boton buscar productos) */
[b-du9cr3h6mq] .dte-items-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: var(--dte-card);
    border-bottom: 1px solid var(--dte-border);
    flex-shrink: 0;
}

[b-du9cr3h6mq] .dte-items-toolbar-spacer {
    flex: 1;
}

[b-du9cr3h6mq] .dte-items-toolbar-count {
    font-size: 0.75rem;
    color: var(--dte-text);
    font-weight: 700;
}

[b-du9cr3h6mq] .dte-items-toolbar-count.dim {
    color: var(--dte-text-muted);
    font-weight: 500;
    font-style: italic;
}

[b-du9cr3h6mq] .dte-items-toolbar-btn {
    height: 30px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0 10px;
    border: none;
    border-radius: var(--dte-radius-sm);
    background: var(--color-accent);
    color: white;
    cursor: pointer;
    transition: var(--dte-transition);
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

[b-du9cr3h6mq] .dte-items-toolbar-btn .rzi {
    font-size: 1rem;
}

[b-du9cr3h6mq] .dte-items-toolbar-btn:hover {
    background: var(--color-accent-dark);
    box-shadow: var(--shadow-md);
}

/* Encabezado de columnas */
[b-du9cr3h6mq] .dte-item-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 12px;
    background: var(--dte-bg);
    border-bottom: 2px solid var(--dte-border);
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--dte-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    flex-shrink: 0;
}

[b-du9cr3h6mq] .dte-item-badge-ph {
    width: 32px;
    text-align: center;
    flex-shrink: 0;
}

[b-du9cr3h6mq] .dte-item-actions-ph {
    width: 24px;
    flex-shrink: 0;
}

[b-du9cr3h6mq] .dte-item-expand-ph {
    width: 78px;
    flex-shrink: 0;
}

[b-du9cr3h6mq] .dte-item-expand {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    min-width: 78px;
    flex-shrink: 0;
    padding: 3px 10px;
    border-radius: var(--radius-full);
    background: var(--dte-primary);
    color: white;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .03em;
    box-shadow: var(--shadow-sm);
}

[b-du9cr3h6mq] .dte-item-expand .rzi {
    font-size: 1rem;
}

[b-du9cr3h6mq] .dte-item-row:hover .dte-item-expand {
    background: var(--dte-primary-dark);
}

/* Abierta: vira a gris (acción = cerrar) y la flecha apunta arriba */
[b-du9cr3h6mq] .dte-item-expand.open {
    background: var(--color-secondary);
}

[b-du9cr3h6mq] .dte-item-expand.open .rzi {
    transform: rotate(180deg);
}

/* Capa 2: Lista de ítems */
[b-du9cr3h6mq] .dte-items-list {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    min-height: 0;
}

[b-du9cr3h6mq] .dte-items-empty {
    padding: 24px 16px;
    text-align: center;
    color: var(--dte-text-muted);
    font-size: 0.85rem;
    font-style: italic;
}

/* Fila resumen */
[b-du9cr3h6mq] .dte-item-row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    cursor: pointer;
    border-bottom: 1px solid var(--dte-border);
    transition: var(--dte-transition);
    font-size: 0.82rem;
}

[b-du9cr3h6mq] .dte-item-row:hover {
    background: var(--dte-bg);
}

[b-du9cr3h6mq] .dte-item-row.selected {
    background: var(--dte-primary-light);
    border-left: 3px solid var(--dte-primary);
    padding-left: 9px;
}

[b-du9cr3h6mq] .dte-item-num {
    width: 22px;
    text-align: center;
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--dte-text-secondary);
    flex-shrink: 0;
}

[b-du9cr3h6mq] .dte-item-code {
    width: 90px;
    font-weight: 600;
    color: var(--dte-primary);
    flex-shrink: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[b-du9cr3h6mq] .dte-item-desc {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--dte-text);
}

[b-du9cr3h6mq] .dte-item-qty,
[b-du9cr3h6mq] .dte-item-price,
[b-du9cr3h6mq] .dte-item-total {
    text-align: right;
    white-space: nowrap;
    flex-shrink: 0;
}

[b-du9cr3h6mq] .dte-item-qty {
    width: 55px;
    color: var(--dte-text-secondary);
}

[b-du9cr3h6mq] .dte-item-um {
    width: 48px;
    flex-shrink: 0;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 0.72rem;
    color: var(--dte-text-secondary);
}

[b-du9cr3h6mq] .dte-item-price {
    width: 80px;
    color: var(--dte-text-secondary);
}

[b-du9cr3h6mq] .dte-item-total {
    width: 90px;
    font-weight: 700;
    color: var(--dte-text);
}

[b-du9cr3h6mq] .dte-item-badge {
    font-size: 0.65rem;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 10px;
    flex-shrink: 0;
}

[b-du9cr3h6mq] .dte-item-badge.afecto {
    background: var(--dte-primary-light);
    color: var(--dte-primary);
}

[b-du9cr3h6mq] .dte-item-badge.exento {
    background: var(--dte-accent-light);
    color: #B45309;
}

/* Capa 3: Panel edición inline bajo la fila */
[b-du9cr3h6mq] .dte-item-detail {
    background: var(--dte-primary-light);
    border-bottom: 2px solid var(--dte-primary);
    animation: dteTabFadeIn-b-du9cr3h6mq 0.15s ease;
}

[b-du9cr3h6mq] .dte-item-detail-fields {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    padding: 8px 12px 10px;
}

[b-du9cr3h6mq] .dte-item-detail-fields .dte-field-cell {
    flex: 1;
    min-width: 0;
}

/* Cantidad y Precio acotados para que descuento/total/impuesto adicional
   tengan mas espacio. Cantidad muestra valores cortos (1,00); precio muestra
   importes en CLP que rara vez superan 7 caracteres. */
[b-du9cr3h6mq] .dte-item-detail-fields .dte-field-cell-cant {
    flex: 0 0 85px;
}

[b-du9cr3h6mq] .dte-item-detail-fields .dte-field-cell-precio {
    flex: 0 0 120px;
}

/* Grupo descuento: selector ($/%) + monto en una sola fila dentro del cell */
[b-du9cr3h6mq] .dte-descuento-group {
    display: flex;
    gap: 4px;
    align-items: center;
}

[b-du9cr3h6mq] .dte-descuento-group .rz-dropdown {
    flex: 0 0 72px;
    min-width: 72px;
}

[b-du9cr3h6mq] .dte-descuento-group .rz-numeric {
    flex: 1;
    min-width: 0;
}

/* Totales footer */
.dte-totales[b-du9cr3h6mq] {
    border-top: 1px solid var(--dte-border);
    padding: 10px 14px;
    background: var(--dte-bg);
    border-radius: var(--dte-radius-sm);
    margin: 8px 12px;
    flex-shrink: 0;
}

.dte-total-row[b-du9cr3h6mq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 3px 0;
    font-size: 0.85rem;
}

.dte-total-label[b-du9cr3h6mq] {
    color: var(--dte-text-secondary);
    font-weight: 500;
}

.dte-total-value[b-du9cr3h6mq] {
    color: var(--dte-text);
    font-weight: 600;
}

.dte-total-discount[b-du9cr3h6mq] {
    color: var(--dte-danger);
    font-weight: 600;
}

.dte-total-surcharge[b-du9cr3h6mq] {
    color: var(--dte-success);
    font-weight: 600;
}

.dte-total-divider[b-du9cr3h6mq] {
    border-top: 1.5px solid var(--dte-border);
    margin-top: 4px;
    padding-top: 6px;
}

.dte-total-final .dte-total-label[b-du9cr3h6mq],
.dte-total-final .dte-total-value[b-du9cr3h6mq] {
    font-size: 1rem;
    font-weight: 800;
    color: var(--dte-text);
}

/* ===== RIGHT PANEL: TABS ===== */
.dte-tabs-nav[b-du9cr3h6mq] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--dte-border);
    background: var(--dte-card);
    flex-shrink: 0;
}

.dte-tab-btn[b-du9cr3h6mq] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 12px;
    border: none;
    background: transparent;
    color: var(--dte-text-secondary);
    font-size: 0.78rem;
    font-weight: 600;
    border-radius: var(--dte-radius-sm);
    cursor: pointer;
    transition: var(--dte-transition);
    position: relative;
    white-space: nowrap;
}

.dte-tab-btn .rzi[b-du9cr3h6mq] {
    font-size: 1rem;
}

.dte-tab-btn:hover:not(:disabled)[b-du9cr3h6mq] {
    background: var(--dte-primary-light);
    color: var(--dte-primary);
}

.dte-tab-btn.active[b-du9cr3h6mq] {
    background: var(--dte-primary);
    color: white;
}

.dte-tab-btn:disabled[b-du9cr3h6mq] {
    opacity: 0.35;
    cursor: not-allowed;
}

.dte-tab-btn .dte-tab-dot[b-du9cr3h6mq] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--dte-accent);
    margin-left: 2px;
}

.dte-tab-btn.active .dte-tab-dot[b-du9cr3h6mq] {
    background: white;
}

/* Punto rojo: dato OBLIGATORIO faltante en el tab (ej. Guia de Despacho sin
   Indicador de traslado). Se apaga cuando el usuario completa el dato. */
.dte-tab-btn .dte-tab-dot--req[b-du9cr3h6mq] {
    background: var(--color-danger);
}

.dte-tab-btn.active .dte-tab-dot--req[b-du9cr3h6mq] {
    background: white;
}

.dte-tab-content[b-du9cr3h6mq] {
    flex: 1;
    overflow: hidden;
    min-height: 0;
}

.dte-tab-pane[b-du9cr3h6mq] {
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 14px;
    animation: dteTabFadeIn-b-du9cr3h6mq 0.25s ease;
}

[b-du9cr3h6mq] .dte-tab-section {
    margin-bottom: 14px;
}

[b-du9cr3h6mq] .dte-tab-section + .dte-tab-section {
    margin-top: 2px;
}

[b-du9cr3h6mq] .dte-tab-section-title {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--dte-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 12px;
    padding-bottom: 6px;
    border-bottom: 1px dashed var(--dte-border);
}

/* Asterisco de campo obligatorio (marca visual en las etiquetas de los tabs hijos). */
[b-du9cr3h6mq] .dte-req {
    color: var(--color-danger);
    font-weight: 700;
    margin-left: 1px;
}

[b-du9cr3h6mq] .dte-field-label {
    font-size: 0.7rem;
    color: var(--dte-text-secondary);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 4px;
    display: block;
    /* Altura fija de 1 línea: garantiza que TODOS los inputs de una misma fila
       arranquen exactamente a la misma altura, aunque un label sea más largo que
       su vecino (si no cabe, se recorta con … en vez de saltar a 2 líneas y desalinear). */
    line-height: 16px;
    height: 16px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ===== EXPORTACION TAB: acordeón y campos ===== */
[b-du9cr3h6mq] .dte-fields-row {
    display: grid;
    gap: 10px 14px;
}

[b-du9cr3h6mq] .dte-fields-row.dte-fields-2col {
    grid-template-columns: repeat(2, 1fr);
}

[b-du9cr3h6mq] .dte-fields-row.dte-fields-3col {
    grid-template-columns: repeat(3, 1fr);
}

[b-du9cr3h6mq] .dte-field-cell {
    min-width: 0;
    /* Celda como columna flex: el label y el input se apilan como BLOQUES, así el
       input no depende del baseline inline de Radzen (cada control tiene baseline
       distinto, lo que desalinea los campos de una misma fila). */
    display: flex;
    flex-direction: column;
}

/* Mismo arreglo para los tabs que usan RadzenRow/RadzenColumn (General, Adicional,
   Otros): forzar la columna que contiene un label de campo a columna flex. */
[b-du9cr3h6mq] .dte-tab-pane [class*="rz-col-"]:has(> .dte-field-label) {
    display: flex;
    flex-direction: column;
}

[b-du9cr3h6mq] .dte-export-hint {
    font-size: 0.75rem;
    color: var(--dte-text-secondary);
    padding: 6px 8px;
    background: var(--dte-primary-light);
    border-radius: var(--dte-radius-sm);
    border-left: 3px solid var(--dte-primary);
}

/* Acordeón compacto dentro del tab (header colapsado de baja altura).
   La altura real del header la da el <a> interno + su line-height + los íconos,
   por eso se ataca el header, el ancla y los íconos. */
[b-du9cr3h6mq] .rz-accordion .rz-accordion-header {
    padding: 0;
    font-size: 0.78rem;
}

[b-du9cr3h6mq] .rz-accordion .rz-accordion-header a {
    padding: 3px 10px;
    min-height: 0;
    line-height: 1.2;
}

/* Íconos del header (chevron + ícono de la sección) más pequeños */
[b-du9cr3h6mq] .rz-accordion .rz-accordion-header .rzi,
[b-du9cr3h6mq] .rz-accordion .rz-accordion-header .rz-accordion-toggler-icon {
    font-size: 1rem;
}

[b-du9cr3h6mq] .rz-accordion .rz-accordion-content {
    padding: 10px 10px 14px;
}

/* ===== BULTOS TAB: tarjetas verticales ===== */
[b-du9cr3h6mq] .dte-bulto-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

[b-du9cr3h6mq] .dte-bulto-card {
    border: 1px solid var(--dte-border);
    border-radius: var(--dte-radius-sm);
    padding: 10px 12px;
    background: var(--dte-bg);
    position: relative;
}

[b-du9cr3h6mq] .dte-bulto-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
    padding-bottom: 6px;
    border-bottom: 1px dashed var(--dte-border);
}

[b-du9cr3h6mq] .dte-bulto-card-title {
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--dte-text);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

[b-du9cr3h6mq] .dte-bulto-card-fields {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px 12px;
}

[b-du9cr3h6mq] .dte-tab-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 20px;
    padding-top: 14px;
    border-top: 1px dashed var(--dte-border);
}

/* Las reglas "CAMPOS COMPACTOS" que vivian aqui se centralizaron en
   wwwroot/css/app.css (bloque "FORMULARIOS COMPACTOS GLOBALES") para que el
   resto del proyecto comparta la misma escala. El Facturador hereda el estilo
   automaticamente desde la regla global, sin necesidad de duplicar selectores
   con scope `.dte-topbar`/`.dte-detalle-wrap`/`.dte-tab-content`. */

/* ===== ACTION BUTTONS ===== */
.dte-btn[b-du9cr3h6mq] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: var(--dte-radius-sm);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: var(--dte-transition);
    /* El texto nunca se parte en dos líneas (evita que el botón crezca en alto
       cuando el ancho disponible se reduce, p.ej. al desplegar el menú principal). */
    white-space: nowrap;
}

/* Botones de acción de la topbar (Guardar borrador / Emitir DTE / Nuevo Documento):
   ancho mínimo y sin encoger, para que al reducirse el ancho disponible no se
   deformen ni se vuelvan más altos. No afecta a los .dte-btn-sm del receptor. */
.dte-topbar > .dte-btn[b-du9cr3h6mq] {
    flex-shrink: 0;
    min-width: 140px;
    justify-content: center;
}

.dte-btn-primary[b-du9cr3h6mq] {
    background: var(--dte-primary);
    color: white;
}

.dte-btn-primary:hover[b-du9cr3h6mq] {
    background: var(--dte-primary-dark);
    box-shadow: var(--shadow-md);
}

.dte-btn-buscar[b-du9cr3h6mq] {
    background: var(--color-accent);
    color: white;
}

.dte-btn-buscar:hover[b-du9cr3h6mq] {
    background: var(--color-accent-dark);
    box-shadow: var(--shadow-md);
}

.dte-btn-success[b-du9cr3h6mq] {
    background: var(--dte-success);
    color: white;
}

/* Acción secundaria (Guardar borrador / Cambiar cliente) = gris sólido, NO transparente
   (DESIGN_SYSTEM §4.3: secundario = gris). */
.dte-btn-secondary[b-du9cr3h6mq] {
    background: var(--color-secondary);
    color: white;
}

.dte-btn-secondary:hover[b-du9cr3h6mq] {
    background: var(--color-secondary-dark);
    color: white;
    box-shadow: var(--shadow-md);
}

.dte-btn-sm[b-du9cr3h6mq] {
    height: 30px;
    padding: 0 10px;
    font-size: 0.75rem;
}

/* Boton "Nuevo Documento" (verde, mismo tono que los chips de exito) */
.dte-btn-success[b-du9cr3h6mq] {
    background: var(--dte-success);
    color: white;
}

.dte-btn-success:hover[b-du9cr3h6mq] {
    background: #059669;
    box-shadow: var(--shadow-md);
}

/* Boton "Quitar" del receptor: rojo suave en reposo, solido al hover.
   Esquema visual igual al de .dte-receptor-close:hover para mantener
   consistencia con otros controles destructivos del componente. */
.dte-btn-danger[b-du9cr3h6mq] {
    background: var(--dte-danger-light);
    color: var(--dte-danger);
}

.dte-btn-danger:hover[b-du9cr3h6mq] {
    background: var(--dte-danger);
    color: white;
    box-shadow: var(--shadow-md);
}

/* ===== MODO SOLO-LECTURA (post emision) =====
   Una vez emitido el documento y cerrado el PDF, todo el workspace
   (paneles izquierdo + derecho) y el drawer lateral quedan no
   interactuables. Se baja la opacidad para dar feedback visual de que
   los campos estan "congelados". Los campos de la topbar (Tipo DTE,
   Folio, Fecha) usan la propiedad nativa Disabled de Radzen porque
   deben verse claramente como deshabilitados (mas oscuros). */
.dte-container.dte-readonly .dte-workspace[b-du9cr3h6mq],
.dte-container.dte-readonly .dte-drawer[b-du9cr3h6mq] {
    pointer-events: none;
    opacity: 0.72;
    /* Bloquear tabulacion al teclado dentro del area de solo lectura */
    user-select: none;
}

/* Cursor de "no permitido" al pasar sobre el area bloqueada para
   reforzar el feedback visual. */
.dte-container.dte-readonly .dte-workspace[b-du9cr3h6mq] {
    cursor: not-allowed;
}

/* Excepcion: la navegacion entre tabs SI debe seguir funcionando en modo
   solo-lectura para que el usuario pueda revisar los datos que ingreso
   en cada pestaña (General, Adicional, Referencias, etc). El contenido
   de los tabs sigue bloqueado por el pointer-events:none heredado del
   workspace; solo se libera el header de navegacion. */
.dte-container.dte-readonly .dte-tabs-nav[b-du9cr3h6mq],
.dte-container.dte-readonly .dte-tabs-nav .dte-tab-btn[b-du9cr3h6mq] {
    pointer-events: auto;
    cursor: pointer;
    user-select: auto;
}

/* ===== ANIMATIONS ===== */
@keyframes dteTabFadeIn-b-du9cr3h6mq {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1100px) {
    .dte-workspace[b-du9cr3h6mq] {
        grid-template-columns: 1fr;
        overflow-y: auto;
    }

    .dte-panel[b-du9cr3h6mq] {
        min-height: 380px;
    }
}

@media (max-width: 640px) {
    .dte-container[b-du9cr3h6mq] {
        padding: 8px;
    }

    .dte-tabs-nav[b-du9cr3h6mq] {
        overflow-x: auto;
        flex-wrap: nowrap;
    }

    .dte-tab-btn span:not(.rzi):not(.dte-tab-dot)[b-du9cr3h6mq] {
        display: none;
    }
}

/* ===== LOADING OVERLAY (durante envío a la API) ===== */
.dte-loading-overlay[b-du9cr3h6mq] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(2px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1100;
}

.dte-loading-content[b-du9cr3h6mq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 24px 32px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.25);
}

.dte-loading-text[b-du9cr3h6mq] {
    font-weight: 600;
    color: #1E293B;
}

/* El modal de vista previa de PDF se unificó en el componente compartido
   Shared/PdfPreviewModal.razor (diseño único para toda la app). */

.dte-btn .rzi[b-du9cr3h6mq] {
    font-size: 1rem;
}
/* /Shared/AppButton.razor.rz.scp.css */
/* AppButton — design system (tokens en wwwroot/css/design-tokens.css) */

.app-btn[b-azgvj649ow] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    border: 1px solid transparent;
    border-radius: var(--radius-md);
    font-family: var(--font-family);
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    transition: var(--transition);
    user-select: none;
}

.app-btn:focus-visible[b-azgvj649ow] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.app-btn:disabled[b-azgvj649ow] {
    opacity: 0.55;
    cursor: not-allowed;
    box-shadow: none;
}

.app-btn-block[b-azgvj649ow] {
    display: flex;
    width: 100%;
}

/* ===== Tamaños ===== */
.app-btn-sm[b-azgvj649ow] {
    height: 28px;
    padding: 0 var(--space-3);
    font-size: var(--text-xs);
}

.app-btn-md[b-azgvj649ow] {
    height: 32px;
    padding: 0 var(--space-4);
    font-size: var(--text-sm);
}

.app-btn-lg[b-azgvj649ow] {
    height: 40px;
    padding: 0 var(--space-5);
    font-size: var(--text-base);
}

/* ===== Variantes ===== */
.app-btn-primary[b-azgvj649ow] {
    background: var(--color-primary);
    color: #fff;
}

    .app-btn-primary:hover:not(:disabled)[b-azgvj649ow] {
        background: var(--color-primary-dark);
    }

.app-btn-secondary[b-azgvj649ow] {
    background: var(--surface);
    color: var(--text-secondary);
    border-color: var(--border);
}

    .app-btn-secondary:hover:not(:disabled)[b-azgvj649ow] {
        background: var(--bg);
        color: var(--text);
    }

.app-btn-danger[b-azgvj649ow] {
    background: var(--color-danger);
    color: #fff;
}

    .app-btn-danger:hover:not(:disabled)[b-azgvj649ow] {
        background: var(--color-danger-dark);
    }

.app-btn-success[b-azgvj649ow] {
    background: var(--color-success);
    color: #fff;
}

    .app-btn-success:hover:not(:disabled)[b-azgvj649ow] {
        background: var(--color-success-dark);
    }

.app-btn-ghost[b-azgvj649ow] {
    background: transparent;
    color: var(--color-primary);
}

    .app-btn-ghost:hover:not(:disabled)[b-azgvj649ow] {
        background: var(--color-primary-light);
    }

.app-btn-label[b-azgvj649ow] {
    display: inline-flex;
    align-items: center;
}
/* /Shared/AppFieldLabel.razor.rz.scp.css */
/* AppFieldLabel — design system (tokens en wwwroot/css/design-tokens.css) */

.field-label[b-zmuzglxdhk] {
    display: block;
    font-family: var(--font-family);
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: var(--space-1);
}

.field-label-req[b-zmuzglxdhk] {
    color: var(--color-danger);
    margin-left: 2px;
}
/* /Shared/AppModal.razor.rz.scp.css */
/* AppModal — design system (tokens en wwwroot/css/design-tokens.css) */

.app-modal-overlay[b-jqyizxbmrx] {
    position: fixed;
    inset: 0;
    z-index: var(--z-modal);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-4);
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(4px);
}

.app-modal[b-jqyizxbmrx] {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-height: 90vh;
    background: var(--surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    overflow: hidden;
}

/* Tamaños */
.app-modal-sm[b-jqyizxbmrx] { max-width: 420px; }
.app-modal-md[b-jqyizxbmrx] { max-width: 560px; }
.app-modal-lg[b-jqyizxbmrx] { max-width: 720px; }
.app-modal-xl[b-jqyizxbmrx] { max-width: 960px; }

.app-modal-header[b-jqyizxbmrx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-4) var(--space-5);
    border-bottom: 1px solid var(--border);
}

.app-modal-title[b-jqyizxbmrx] {
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    color: var(--text);
}

.app-modal-close[b-jqyizxbmrx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    background: transparent;
    color: var(--text-muted);
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition);
}

    .app-modal-close:hover[b-jqyizxbmrx] {
        background: var(--bg);
        color: var(--text);
    }

.app-modal-body[b-jqyizxbmrx] {
    padding: var(--space-5);
    overflow: auto;
}

.app-modal-footer[b-jqyizxbmrx] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--space-2);
    padding: var(--space-4) var(--space-5);
    border-top: 1px solid var(--border);
}
/* /Shared/AppTabs.razor.rz.scp.css */
/* AppTabs — design system (tokens en wwwroot/css/design-tokens.css) */

.app-tabs[b-nrmpzlimkq] {
    display: flex;
    align-items: center;
}

.app-tab[b-nrmpzlimkq] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    border: none;
    background: transparent;
    font-family: var(--font-family);
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    color: var(--text-secondary);
    cursor: pointer;
    transition: var(--transition);
    white-space: nowrap;
}

    .app-tab:disabled[b-nrmpzlimkq] {
        opacity: 0.5;
        cursor: not-allowed;
    }

/* ===== Variante PILL (interna: activo indigo) ===== */
.app-tabs-pill[b-nrmpzlimkq] {
    gap: var(--space-2);
}

    .app-tabs-pill .app-tab[b-nrmpzlimkq] {
        padding: var(--space-2) var(--space-3);
        border-radius: var(--radius-md);
    }

        .app-tabs-pill .app-tab:hover:not(:disabled):not(.active)[b-nrmpzlimkq] {
            background: var(--color-primary-light);
            color: var(--color-primary);
        }

        .app-tabs-pill .app-tab.active[b-nrmpzlimkq] {
            background: var(--color-primary);
            color: #fff;
            box-shadow: 0 2px 8px rgba(99, 102, 241, 0.35);
        }

/* ===== Variante UNDERLINE (MainLayout: activo naranja de marca) ===== */
.app-tabs-underline[b-nrmpzlimkq] {
    gap: 0;
    border-bottom: 1px solid var(--border);
}

    .app-tabs-underline .app-tab[b-nrmpzlimkq] {
        padding: var(--space-3) var(--space-4);
        border-bottom: 3px solid transparent;
    }

        .app-tabs-underline .app-tab:hover:not(:disabled):not(.active)[b-nrmpzlimkq] {
            color: var(--text);
        }

        .app-tabs-underline .app-tab.active[b-nrmpzlimkq] {
            color: var(--color-accent);
            border-bottom-color: var(--color-accent);
            font-weight: var(--fw-bold);
        }
/* /Shared/MainLayout.razor.rz.scp.css */
.page[b-ulnkfyjdqh] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-ulnkfyjdqh] {
    flex: 1;
}

.sidebar[b-ulnkfyjdqh] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-ulnkfyjdqh] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-ulnkfyjdqh]  a, .top-row[b-ulnkfyjdqh]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-ulnkfyjdqh]  a:hover, .top-row[b-ulnkfyjdqh]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-ulnkfyjdqh]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row:not(.auth)[b-ulnkfyjdqh] {
        display: none;
    }

    .top-row.auth[b-ulnkfyjdqh] {
        justify-content: space-between;
    }

    .top-row[b-ulnkfyjdqh]  a, .top-row[b-ulnkfyjdqh]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-ulnkfyjdqh] {
        flex-direction: row;
    }

    .sidebar[b-ulnkfyjdqh] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-ulnkfyjdqh] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-ulnkfyjdqh]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-ulnkfyjdqh], article[b-ulnkfyjdqh] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

/* ============================================================
   MENU JERARQUICO (RadzenPanelMenu) — "solo las subopciones se tintan"
   ------------------------------------------------------------
   El NIVEL 1 (opciones principales, Inicio y Cerrar Sesion) va SIN fondo
   (blanco), igual que el render por defecto; la jerarquia de nivel 1 se lee
   por el PESO (bold) + icono indigo, no por un bloque de color. Solo las
   SUBOPCIONES desplegables conservan tinte de fondo:
     · Opcion principal (nivel 1) -> SIN fondo, texto oscuro BOLD, icono indigo
     · Contenedor (subopcion)     -> indigo MEDIO  (--color-primary-100),  SEMIBOLD
     · Pantalla (hoja, subopcion) -> indigo MUY CLARO (--color-primary-light), MEDIUM
   NARANJA (--color-accent) marca el item activo (igual que la pestana activa).
   Grupos = filas con chevron (:has(.rz-navigation-item-icon-children));
   hojas = sin chevron. Se perfora el DOM de Radzen con ::deep. Todo con tokens.
   ============================================================ */

/* ---- Lienzo del menu ---- */
.app-menu[b-ulnkfyjdqh]  .rz-panel-menu {
    background: var(--surface);
    padding: var(--space-2);
    font-family: var(--font-family);
}

/* ---- Fila base (todas) ---- */
.app-menu[b-ulnkfyjdqh]  .rz-navigation-item-wrapper {
    border-radius: var(--radius-md) !important;   /* mas redondeado: evita el look cuadrado */
    transition: var(--transition);
}
.app-menu[b-ulnkfyjdqh]  .rz-navigation-item-wrapper:hover {
    transform: translateX(2px);   /* el color de hover lo define cada nivel (abajo) */
}
.app-menu[b-ulnkfyjdqh]  .rz-navigation-item-link {
    padding-block: 8px !important;
    font-size: var(--text-sm);
}
.app-menu[b-ulnkfyjdqh]  .rz-navigation-item-icon-children {
    opacity: 1 !important;
}

/* ---- Item ACTIVO (pantalla abierta): barra NARANJA + texto bold ----
   Conserva el tinte de su nivel; lo distingue la barra naranja + el peso. */
.app-menu[b-ulnkfyjdqh]  .rz-navigation-item-wrapper-active:before,
.app-menu[b-ulnkfyjdqh]  .rz-navigation-item-active:before {
    background-color: var(--color-accent) !important;  /* naranja, como la pestana activa */
    width: 3px !important;
}
.app-menu[b-ulnkfyjdqh]  .rz-navigation-item-wrapper-active .rz-navigation-item-link {
    font-weight: var(--fw-bold) !important;
}

/* ============ NIVEL 1 — OPCION PRINCIPAL (SIN fondo / blanca) ============
   Reposo: SIN fondo (blanco), como el render por defecto. La jerarquia de nivel 1 la
   da el PESO (bold) + el icono indigo, no un bloque de color. Hover: tinte muy sutil
   (--color-primary-light) solo para el affordance. Pesa mas (bold) que contenedor/pantalla. */
.app-menu[b-ulnkfyjdqh]  .rz-panel-menu > .rz-navigation-item > .rz-navigation-item-wrapper {
    margin-block: 3px;
}
.app-menu[b-ulnkfyjdqh]  .rz-panel-menu > .rz-navigation-item > .rz-navigation-item-wrapper:has(.rz-navigation-item-icon-children) {
    background-color: transparent !important;
}
.app-menu[b-ulnkfyjdqh]  .rz-panel-menu > .rz-navigation-item > .rz-navigation-item-wrapper:has(.rz-navigation-item-icon-children) .rz-navigation-item-link {
    padding-inline-start: var(--space-3) !important;
    font-weight: var(--fw-bold) !important;
    color: var(--text) !important;
    font-size: var(--text-base);
}
.app-menu[b-ulnkfyjdqh]  .rz-panel-menu > .rz-navigation-item > .rz-navigation-item-wrapper:has(.rz-navigation-item-icon-children) .rz-navigation-item-icon,
.app-menu[b-ulnkfyjdqh]  .rz-panel-menu > .rz-navigation-item > .rz-navigation-item-wrapper:has(.rz-navigation-item-icon-children) .rz-navigation-item-icon-children {
    color: var(--color-primary-dark) !important;
}
/* Hover principal: tinte muy sutil (sin bloque de color), solo para el affordance. */
.app-menu[b-ulnkfyjdqh]  .rz-panel-menu > .rz-navigation-item > .rz-navigation-item-wrapper:has(.rz-navigation-item-icon-children):hover {
    background-color: var(--color-primary-light) !important;
}

/* ---- Hojas de nivel 1 (Inicio / Cerrar Sesion) ---- */
.app-menu[b-ulnkfyjdqh]  .rz-panel-menu > .rz-navigation-item > .rz-navigation-item-wrapper:not(:has(.rz-navigation-item-icon-children)) .rz-navigation-item-link {
    padding-inline-start: var(--space-3) !important;
    font-weight: var(--fw-semibold) !important;
    font-size: var(--text-base);
}
/* Inicio (primer item): SIN fondo (blanco), igual que las principales; conserva bold + icono indigo. */
.app-menu[b-ulnkfyjdqh]  .rz-panel-menu > .rz-navigation-item:first-child > .rz-navigation-item-wrapper {
    background-color: transparent !important;
}
.app-menu[b-ulnkfyjdqh]  .rz-panel-menu > .rz-navigation-item:first-child > .rz-navigation-item-wrapper .rz-navigation-item-link {
    font-weight: var(--fw-bold) !important;
    color: var(--text) !important;
}
.app-menu[b-ulnkfyjdqh]  .rz-panel-menu > .rz-navigation-item:first-child > .rz-navigation-item-wrapper .rz-navigation-item-icon {
    color: var(--color-primary-dark) !important;
}
.app-menu[b-ulnkfyjdqh]  .rz-panel-menu > .rz-navigation-item:first-child > .rz-navigation-item-wrapper:hover {
    background-color: var(--color-primary-light) !important;
}
/* Cerrar Sesion (ultimo item): SIN fondo (blanco). Conserva el texto/icono ROJO como
   affordance de logout; hover con tinte rojo muy sutil (sin bloque de color pleno). */
.app-menu[b-ulnkfyjdqh]  .rz-panel-menu > .rz-navigation-item:last-child > .rz-navigation-item-wrapper {
    background-color: transparent !important;
}
.app-menu[b-ulnkfyjdqh]  .rz-panel-menu > .rz-navigation-item:last-child > .rz-navigation-item-wrapper .rz-navigation-item-link,
.app-menu[b-ulnkfyjdqh]  .rz-panel-menu > .rz-navigation-item:last-child > .rz-navigation-item-wrapper .rz-navigation-item-icon {
    color: var(--color-danger-dark) !important;
}
.app-menu[b-ulnkfyjdqh]  .rz-panel-menu > .rz-navigation-item:last-child > .rz-navigation-item-wrapper:hover {
    background-color: var(--color-danger-light) !important;
}

/* ============ SUBMENUS — sangria por profundidad (sin guia: el fondo manda) ============
   Cada .rz-navigation-menu anidado agrega sangria; al anidarse (L3 dentro de L2)
   se acumula sola. La jerarquia la da el tinte de fondo, no una linea. */
.app-menu[b-ulnkfyjdqh]  .rz-panel-menu .rz-navigation-menu {
    margin-inline-start: var(--space-3);
}

/* ============ CONTENEDOR (grupo desplegable anidado) — indigo MEDIO ============
   Se reconoce por tener chevron de hijos. Pesa MAS que las pantallas que agrupa. */
.app-menu[b-ulnkfyjdqh]  .rz-navigation-menu .rz-navigation-item-wrapper:has(.rz-navigation-item-icon-children) {
    background-color: var(--color-primary-100) !important;
    margin-block: 2px;
}
.app-menu[b-ulnkfyjdqh]  .rz-navigation-menu .rz-navigation-item-wrapper:has(.rz-navigation-item-icon-children):hover {
    background-color: var(--color-primary-200) !important;
}
.app-menu[b-ulnkfyjdqh]  .rz-navigation-menu .rz-navigation-item-wrapper:has(.rz-navigation-item-icon-children) .rz-navigation-item-link {
    color: var(--text) !important;
    font-weight: var(--fw-semibold) !important;
    font-size: var(--text-base) !important;
}
.app-menu[b-ulnkfyjdqh]  .rz-navigation-menu .rz-navigation-item-wrapper:has(.rz-navigation-item-icon-children) .rz-navigation-item-icon,
.app-menu[b-ulnkfyjdqh]  .rz-navigation-menu .rz-navigation-item-wrapper:has(.rz-navigation-item-icon-children) .rz-navigation-item-icon-children {
    color: var(--color-primary-dark) !important;
}

/* ============ PANTALLAS (hojas) — indigo MUY CLARO, texto legible ============
   Pesan MENOS que el contenedor (medium vs semibold) pero con alto contraste:
   texto pleno --text sobre tinte muy claro. */
.app-menu[b-ulnkfyjdqh]  .rz-navigation-menu .rz-navigation-item-wrapper:not(:has(.rz-navigation-item-icon-children)) {
    background-color: var(--color-primary-light) !important;
    margin-block: 2px;
}
.app-menu[b-ulnkfyjdqh]  .rz-navigation-menu .rz-navigation-item-wrapper:not(:has(.rz-navigation-item-icon-children)):hover {
    background-color: var(--color-primary-100) !important;
}
.app-menu[b-ulnkfyjdqh]  .rz-navigation-menu .rz-navigation-item-wrapper:not(:has(.rz-navigation-item-icon-children)) .rz-navigation-item-link {
    color: var(--text) !important;
    font-weight: var(--fw-medium) !important;
    font-size: var(--text-base) !important;
}
.app-menu[b-ulnkfyjdqh]  .rz-navigation-menu .rz-navigation-item-wrapper:not(:has(.rz-navigation-item-icon-children)) .rz-navigation-item-icon {
    color: var(--text-secondary);
    font-size: 1rem !important;
}

/* ===== Sistema de pestanas (antes style embebido en MainLayout.razor) =====
   Estas clases son exclusivas de MainLayout (las paginas usan prefijos propios
   tipo pos-tab, dte-tab, form-tab), por eso es seguro aislarlas aqui. Las reglas
   GLOBALES de scrollbar se movieron a app.css. */
.tab-container[b-ulnkfyjdqh] {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.tab-headers[b-ulnkfyjdqh] {
    display: flex;
    border-bottom: 1px solid var(--border);
    background-color: #f8f9fa;
    padding-left: 10px;
    overflow-x: auto;
    white-space: nowrap;
}

.tab-button[b-ulnkfyjdqh] {
    padding: 10px 15px;
    cursor: pointer;
    border: none;
    background: none;
    border-bottom: 3px solid transparent;
    transition: var(--transition);
    position: relative;
    display: flex;
    align-items: center;
}

    .tab-button.active[b-ulnkfyjdqh] {
        color: var(--color-accent);
        border-bottom-color: var(--color-accent);
        font-weight: bold;
    }

    .tab-button .close-btn[b-ulnkfyjdqh] {
        margin-left: 8px;
        color: #999;
        font-size: 16px;
        line-height: 1;
    }

        .tab-button .close-btn:hover[b-ulnkfyjdqh] {
            color: var(--color-accent);
        }

.tab-content[b-ulnkfyjdqh] {
    flex: 1;
    overflow: hidden;
    padding: 15px;
}

/* Eliminar padding cuando el contenido necesita ocupar toda la altura disponible (ej: POS) */
.tab-content.no-padding[b-ulnkfyjdqh] {
    padding: 0;
}

.tab-content-container[b-ulnkfyjdqh] {
    height: 100%;
    position: relative;
}

.tab-pane[b-ulnkfyjdqh] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: auto;
}
/* /Shared/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-g0d3igfxh3] {
    background-color: rgba(255, 255, 255, 0.1);
}

.top-row[b-g0d3igfxh3] {
    height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-g0d3igfxh3] {
    font-size: 1.1rem;
}

.oi[b-g0d3igfxh3] {
    width: 2rem;
    font-size: 1.1rem;
    vertical-align: text-top;
    top: -2px;
}

.nav-item[b-g0d3igfxh3] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-g0d3igfxh3] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-g0d3igfxh3] {
        padding-bottom: 1rem;
    }

    .nav-item[b-g0d3igfxh3]  a {
        color: #d7d7d7;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
    }

.nav-item[b-g0d3igfxh3]  a.active {
    background-color: rgba(255,255,255,0.25);
    color: white;
}

.nav-item[b-g0d3igfxh3]  a:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

@media (min-width: 641px) {
    .navbar-toggler[b-g0d3igfxh3] {
        display: none;
    }

    .collapse[b-g0d3igfxh3] {
        /* Never collapse the sidebar for wide screens */
        display: block;
    }
    
    .nav-scrollable[b-g0d3igfxh3] {
        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}
/* /Shared/PdfPreviewModal.razor.rz.scp.css */
/* ===== MODAL VISTA PREVIA PDF — diseño unificado (design system) =====
   Fuente única de verdad para el modal de previsualización de PDF de toda la
   app. Replica el diseño de Documentos Recepcionados/Emitidos usando tokens
   globales para verse idéntico en cualquier pantalla. */

.pdf-modal-overlay[b-ho31ik1wna] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal);
    animation: pdfOverlayIn-b-ho31ik1wna 0.25s ease;
    padding: 1.5rem;
}

.pdf-modal-card[b-ho31ik1wna] {
    background: var(--surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    width: 100%;
    max-width: 900px;
    height: 90vh;
    display: flex;
    flex-direction: column;
    animation: pdfModalIn-b-ho31ik1wna 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    overflow: hidden;
}

.pdf-modal-header[b-ho31ik1wna] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px;
    border-bottom: 1px solid var(--border);
    background: linear-gradient(135deg, var(--color-primary-light) 0%, var(--surface) 100%);
    flex-shrink: 0;
}

.pdf-modal-header h3[b-ho31ik1wna] {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.pdf-modal-header h3 .rzi[b-ho31ik1wna] {
    color: var(--color-primary);
}

.pdf-modal-close[b-ho31ik1wna] {
    background: none;
    border: none;
    color: var(--text-muted);
    cursor: pointer;
    padding: 6px;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    display: flex;
    align-items: center;
    font-size: 1.2rem;
}

.pdf-modal-close:hover[b-ho31ik1wna] {
    background: var(--color-danger-light);
    color: var(--color-danger);
}

.pdf-modal-body[b-ho31ik1wna] {
    flex: 1;
    padding: 0;
    overflow: hidden;
    position: relative;
}

.pdf-modal-body iframe[b-ho31ik1wna] {
    width: 100%;
    height: 100%;
    border: none;
}

/* Spinner mientras se genera/descarga el PDF */
.preview-loading[b-ho31ik1wna] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: var(--surface);
}

.loading-spinner[b-ho31ik1wna] {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--border);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: pdfSpin-b-ho31ik1wna 0.8s linear infinite;
}

.loading-text[b-ho31ik1wna] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--color-primary);
    animation: pdfPulse-b-ho31ik1wna 1.5s ease-in-out infinite;
}

/* ===== ANIMACIONES ===== */
@keyframes pdfOverlayIn-b-ho31ik1wna {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes pdfModalIn-b-ho31ik1wna {
    from { opacity: 0; transform: scale(0.92) translateY(10px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}

@keyframes pdfSpin-b-ho31ik1wna {
    to { transform: rotate(360deg); }
}

@keyframes pdfPulse-b-ho31ik1wna {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* ===== RESPONSIVE: MÓVIL ===== */
@media (max-width: 640px) {
    .pdf-modal-card[b-ho31ik1wna] {
        max-width: 100%;
        height: 95vh;
    }
}