@import '_content/UI.Components/UI.Components.dau288fao8.bundle.scp.css';

/* /Pages/Catalogos/Tareas/CreateManualTaskDialog.razor.rz.scp.css */
/* ========================================
   CreateManualTaskDialog Component Styles
   ======================================== */

/* === Force dialog to adjust when loading === */
[b-le8vmy3cb2] .rz-dialog-content {
    transition: height 0.3s ease, min-height 0.3s ease;
}

/* === Modal Title Customization === */
[b-le8vmy3cb2] .rz-dialog-title {
    font-weight: 700 !important;
    font-size: 20px !important;
}

/* === Form Labels Customization === */
[b-le8vmy3cb2] .form-label {
    font-size: 16px !important;
    font-weight: 500 !important;
}

/* === Required Asterisk === */
.required-asterisk[b-le8vmy3cb2] {
    color: red;
}

/* === Progress Bar Full Width === */
[b-le8vmy3cb2] .rz-progressbar {
    width: 100% !important;
}

/* === Loading Indicator === */
.loading-container[b-le8vmy3cb2] {
    text-align: center;
    padding: 3rem 2rem;
}

/* Para forzar que el spinner de carga tenga un tamaño específico incluso dentro de Radzen */
.loading-message[b-le8vmy3cb2] {
    color: #6c757d;
    margin-top: 1rem;
}

/* === Error Alert Container === */
.error-container[b-le8vmy3cb2] {
    padding: 1.5rem;
}

/* === Error Buttons Container === */
.error-buttons[b-le8vmy3cb2] {
    text-align: center;
    margin-top: 1rem;
}

/* === Task Selection Container === */
.task-selection-container[b-le8vmy3cb2] {
    padding: 0;
}

/* Para forzar que el contenedor de selección de tareas tenga un estilo específico incluso dentro de Radzen */
.task-list[b-le8vmy3cb2] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* Para forzar que la lista de tareas tenga un estilo específico incluso dentro de Radzen */
.task-item[b-le8vmy3cb2] {
    display: flex;
    align-items: center;
    padding: 18px 24px;
    cursor: pointer;
    transition: all 0.2s ease;
    border: 2px solid transparent;
    background: white;
    border-bottom: 1px solid #e9ecef;
}

/* Para forzar que el contenedor de cada tarea tenga un estilo específico incluso dentro de Radzen */
.task-item:first-child[b-le8vmy3cb2] {
    border-top: 1px solid #e9ecef;
}

/* Para forzar que el primer contenedor de tarea tenga un borde superior incluso dentro de Radzen */
.task-item:hover[b-le8vmy3cb2] {
    background-color: #f8f9fa;
    border-color: var(--rz-primary);
    border-radius: 4px;
    border-bottom: 2px solid var(--rz-primary);
}

/* Para forzar que el contenedor de cada tarea tenga un estilo específico incluso dentro de Radzen */
.task-item-icon[b-le8vmy3cb2] {
    width: 40px;
    margin-right: 16px;
    flex-shrink: 0;
}

.task-item-icon i[b-le8vmy3cb2] {
    font-size: 20px;
    color: var(--rz-primary);
}

/* Para forzar que el icono de la tarea tenga un tamaño específico incluso dentro de Radzen */
.task-item-text[b-le8vmy3cb2] {
    font-size: 15px;
    font-weight: 500;
    color: #212529;
    flex-grow: 1;
}

/* === Empty State === */
.empty-state[b-le8vmy3cb2] {
    text-align: center;
    padding: 5rem 0;
}

/* Para forzar que el contenedor de estado vacío tenga un estilo específico incluso dentro de Radzen */
.empty-state-icon[b-le8vmy3cb2] {
    font-size: 48px;
    color: #ccc;
}

/* Para forzar que el icono del estado vacío tenga un tamaño específico incluso dentro de Radzen */
.empty-state-message[b-le8vmy3cb2] {
    color: #6c757d;
    margin-top: 1rem;
}

/* === File Input (Hidden) === */
.file-input-hidden[b-le8vmy3cb2] {
    display: none !important;
}

/* Para forzar ocultar el input file completo */
[b-le8vmy3cb2] .file-input-hidden,
[b-le8vmy3cb2] #manualTaskFileInput {
    display: none !important;
    position: absolute !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
}

/* === Analyzing State === */
.analyzing-container[b-le8vmy3cb2] {
    text-align: center;
    padding: 5rem 0;
}

/* Para forzar que el contenedor de análisis tenga un estilo específico incluso dentro de Radzen */
.analyzing-spinner[b-le8vmy3cb2] {
    width: 3rem;
    height: 3rem;
    margin-bottom: 1rem;
}

/* Para forzar que el spinner de análisis tenga un tamaño específico incluso dentro de Radzen */
.analyzing-title[b-le8vmy3cb2] {
    font-weight: bold;
    margin-bottom: 0;
}

/* Para forzar que el título de análisis tenga un estilo específico incluso dentro de Radzen */
.analyzing-filename[b-le8vmy3cb2] {
    color: #6c757d;
    margin-bottom: 0;
}

/* === Summary Labels === */
.summary-label[b-le8vmy3cb2] {
    font-size: 0.9rem;
    color: #6c757d;
}

/* Para forzar que el resumen tenga un estilo específico incluso dentro de Radzen */
.summary-value[b-le8vmy3cb2] {
    margin-bottom: 0.5rem;
    font-weight: 600;
}

/* === Drag & Drop Zone === */
.drag-drop-zone[b-le8vmy3cb2] {
    background-color: white;
    width: 100%;
    padding: 1.25rem;
    cursor: pointer;
    margin-bottom: 0;
    border: 2px dashed #D1D5DB;
    min-height: 120px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    transition: all 0.2s ease;
}

/* Para forzar que el contenedor de drag & drop tenga un estilo específico incluso dentro de Radzen */
.drag-drop-zone:hover[b-le8vmy3cb2] {
    background-color: #f8f9fa;
    border-color: #4967FD;
}

/* Para forzar que el contenedor de drag & drop tenga un estilo específico incluso dentro de Radzen */
.drag-drop-zone-large[b-le8vmy3cb2] {
    padding: 3rem 1.25rem;
    min-height: 200px;
}

/* Para forzar que el contenedor de drag & drop tenga un estilo específico incluso dentro de Radzen */
.drag-drop-icon[b-le8vmy3cb2] {
    margin-bottom: 0.75rem;
    opacity: 0.5;
}

/* Para forzar que el icono del drag & drop tenga un tamaño específico incluso dentro de Radzen */
.drag-drop-icon-large[b-le8vmy3cb2] {
    margin-bottom: 1rem;
}

/* Para forzar que el icono del drag & drop tenga un tamaño específico incluso dentro de Radzen */
.drag-drop-text[b-le8vmy3cb2] {
    margin: 0;
    padding: 0;
    font-size: 0.85rem;
    font-weight: 400;
    color: #6B7280;
}

/* Para forzar que el texto del drag & drop tenga un tamaño específico incluso dentro de Radzen */
.drag-drop-text-large[b-le8vmy3cb2] {
    font-size: 0.95rem;
}

/* === Document Upload Item === */
.document-upload-item[b-le8vmy3cb2] {
    margin-bottom: 1rem;
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.3s ease;
}

/* Para forzar que el contenedor del documento tenga un estilo específico incluso dentro de Radzen */
.document-upload-item:hover[b-le8vmy3cb2] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* Para forzar que el borde del documento tenga un color específico incluso dentro de Radzen */
.doc-item-success[b-le8vmy3cb2] {
    background-color: rgba(23, 209, 125, 0.05);
    border: 2px solid #17D17D;
}

/* Para forzar que el borde del documento tenga un color específico incluso dentro de Radzen */
.doc-item-error[b-le8vmy3cb2] {
    background-color: rgba(255, 18, 58, 0.08);
    border: 2px solid #FF123A;
}

/* Para forzar que el borde del documento tenga un color específico incluso dentro de Radzen */
.doc-item-editing[b-le8vmy3cb2] {
    background-color: #F6F8FB;
    border: 2px solid #E0E0E0;
}

/* Para forzar que el borde del documento tenga un color específico incluso dentro de Radzen */
.doc-item-header[b-le8vmy3cb2] {
    padding: 16px;
}

/* Para forzar que el encabezado del documento tenga un estilo específico incluso dentro de Radzen */
.doc-item-header-flex[b-le8vmy3cb2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* Para forzar que el encabezado del documento tenga un estilo específico incluso dentro de Radzen */
.doc-item-title[b-le8vmy3cb2] {
    display: flex;
    align-items: center;
}

/* Para forzar que el título del documento tenga un estilo específico incluso dentro de Radzen */
.doc-item-icon[b-le8vmy3cb2] {
    margin-right: 0.5rem;
}

/* Para forzar que el icono del documento tenga un estilo específico incluso dentro de Radzen */
.doc-item-filename[b-le8vmy3cb2] {
    font-weight: bold;
}

/* Para forzar que el nombre del archivo tenga un estilo específico incluso dentro de Radzen */
.doc-item-actions[b-le8vmy3cb2] {
    display: flex;
    gap: 0.5rem;
}

/* Para forzar que los botones de acción del documento tengan un estilo específico incluso dentro de Radzen */
.doc-btn[b-le8vmy3cb2] {
    padding: 0.25rem;
    border: none;
    background-color: transparent;
}

/* Para forzar que el botón de documento tenga un estilo específico incluso dentro de Radzen */
.doc-btn:hover[b-le8vmy3cb2] {
    background-color: rgba(0, 0, 0, 0.05);
    border-radius: 4px;
}

/* Icono de chevron para expandir/colapsar detalles del documento */
.chevron-icon[b-le8vmy3cb2] {
    transition: transform 0.3s;
}

/* Para forzar que el icono de chevron apunte hacia arriba cuando el contenido esté expandido incluso dentro de Radzen */
.chevron-expanded[b-le8vmy3cb2] {
    transform: rotate(180deg);
}

/* Para forzar que el icono de chevron apunte hacia abajo cuando el contenido esté colapsado incluso dentro de Radzen */
.chevron-collapsed[b-le8vmy3cb2] {
    transform: rotate(0deg);
}

/* === Document Item Content === */
.doc-item-content[b-le8vmy3cb2] {
    padding: 16px;
    border-top: 1px solid;
}

/* Para forzar que el área de contenido del documento tenga un estilo específico incluso dentro de Radzen */
.doc-content-success[b-le8vmy3cb2] {
    background-color: rgba(23, 209, 125, 0.05);
    border-top-color: #17D17D;
}

/* Para forzar que el área de contenido del documento tenga un estilo específico incluso dentro de Radzen */
.doc-content-error[b-le8vmy3cb2] {
    background-color: rgba(255, 18, 58, 0.08);
    border-top-color: #FF123A;
}

/* Para forzar que el área de contenido del documento tenga un estilo específico incluso dentro de Radzen */
.doc-content-editing[b-le8vmy3cb2] {
    background-color: #F9FAFB;
    border-top-color: #E0E0E0;
}

/* === Document Error Alert === */
.doc-error-alert[b-le8vmy3cb2] {
    background-color: rgba(255, 18, 58, 0.08);
    border: 1px solid #FF123A;
    margin-bottom: 1rem;
    color: #dc3545 !important;
}

/* Icono de error para documentos con problemas */
.doc-error-icon[b-le8vmy3cb2] {
    display: inline-block;
    vertical-align: middle;
    margin-right: 0.5rem;
}

/* === Document Field Labels === */
.doc-field-label[b-le8vmy3cb2] {
    font-weight: bold;
    font-size: 0.875rem;
}

/* === Document Field Values === */
.doc-field-value[b-le8vmy3cb2] {
    margin-bottom: 0;
}

.doc-value-card[b-le8vmy3cb2] {
    background-color: #fff;
    border: 1px solid #E6EAF5;
    border-radius: 8px;
    padding: 15px;
}

.doc-value-card-label[b-le8vmy3cb2] {
    font-weight: 600;
    font-size: 0.7rem;
    margin-bottom: 0.35rem;
    display: block;
    color: #6c757d;
    text-transform: uppercase;
}

.doc-value-card-inner[b-le8vmy3cb2] {
    border: 1px solid #E6EAF5;
    border-radius: 6px;
    background-color: #F6F8FB;
    padding: 6px 8px;
}

.doc-value-card-row[b-le8vmy3cb2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.doc-value-card-content[b-le8vmy3cb2] {
    min-width: 0;
    flex: 1;
}

.doc-value-card-content-money[b-le8vmy3cb2] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.doc-value-card-text[b-le8vmy3cb2] {
    display: block;
    color: #111827;
    font-weight: 500;
    font-size: 0.85rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.doc-value-card-prefix[b-le8vmy3cb2] {
    color: #6c757d;
    font-weight: 500;
    font-size: 0.85rem;
}

.doc-value-card-input[b-le8vmy3cb2] {
    border: none;
    padding: 0;
    min-height: auto;
    box-shadow: none !important;
    background: transparent;
    color: #111827;
    font-weight: 500;
    font-size: 0.85rem;
}

.doc-value-card-input:focus[b-le8vmy3cb2] {
    border: none;
    box-shadow: none;
}

.doc-value-card-input-money[b-le8vmy3cb2] {
    padding-left: 0;
}

.doc-copy-btn[b-le8vmy3cb2] {
    border: none;
    background: transparent;
    border-radius: 6px;
    padding: 2px 4px;
    line-height: 1;
}

.doc-copy-btn:hover[b-le8vmy3cb2] {
    background-color: rgba(73, 103, 253, 0.08);
}

/* === Document Location Box === */
.doc-location-box[b-le8vmy3cb2] {
    border-radius: 0.25rem;
    padding: 0.75rem;
    margin-top: 0.75rem;
    background-color: #F6F8FB;
}

/* Para forzar que el borde del cuadro de ubicación del documento tenga un color específico incluso dentro de Radzen */
.doc-location-label[b-le8vmy3cb2] {
    color: #4967FD;
    font-weight: 600;
}

/* Para forzar que el valor de la ubicación del documento tenga un estilo específico incluso dentro de Radzen */
.doc-location-value[b-le8vmy3cb2] {
    color: #000;
    margin-left: 0.25rem;
}

/* === File Size === */
.file-size-text[b-le8vmy3cb2] {
    font-size: 0.875rem;
    color: #6c757d;
}

/* === Warning Message === */
.incomplete-docs-warning[b-le8vmy3cb2] {
    font-size: 0.875rem;
    color: #dc3545;
}

/* Icono de advertencia para documentos incompletos */
.warning-icon[b-le8vmy3cb2] {
    display: inline-block;
    vertical-align: middle;
    margin-bottom: 2px;
}

/* === Action Buttons Container === */
.action-buttons-container[b-le8vmy3cb2] {
    display: flex;
    justify-content: space-between;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #dee2e6;
}

/* Para forzar que los botones estén alineados correctamente incluso dentro de Radzen */
.action-buttons-left[b-le8vmy3cb2] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

/* Para forzar que los botones de la izquierda estén alineados a la izquierda incluso dentro de Radzen */
.action-buttons-right[b-le8vmy3cb2] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.5rem;
}

/* Para forzar que los botones de la derecha estén alineados a la derecha incluso dentro de Radzen */
.action-buttons-row[b-le8vmy3cb2] {
    display: flex;
    gap: 0.5rem;
}

/* === Button Styles === */
.btn-back[b-le8vmy3cb2] {
    background-color: transparent;
    color: #7F869F;
    border: 1px solid #E0E0E0;
}

/* Para forzar que el botón de regresar tenga el estilo correcto incluso dentro de Radzen */
.btn-cancel[b-le8vmy3cb2] {
    background-color: #FF123A;
    color: white;
    border: none;
}

/* Para forzar que el botón de cancelar tenga el estilo correcto incluso dentro de Radzen */
.btn-primary-custom[b-le8vmy3cb2] {
    background-color: #4967FD;
    color: white;
    border: none;
}

/* === Form Container === */
.form-container[b-le8vmy3cb2] {
    padding: 1.5rem;
}

/* === Selected Task Banner === */
.selected-task-section[b-le8vmy3cb2] {
    margin-bottom: 1.5rem;
}

/* Línea divisoria debajo de la tarea seleccionada */
.selected-task-divider[b-le8vmy3cb2] {
    margin: 1rem 0;
    opacity: 0.25;
}

/* Contenedor para el texto "Tarea seleccionada" y el nombre de la tarea */
.selected-task-label-container[b-le8vmy3cb2] {
    display: flex;
    align-items: center;
}

/* Para el texto "Tarea seleccionada" */
.selected-task-label[b-le8vmy3cb2] {
    color: #6c757d;
    margin-right: 0.5rem;
    margin-bottom: 0;
    font-size: 0.9rem;
}

/* Para resaltar el nombre de la tarea seleccionada */
.selected-task-value[b-le8vmy3cb2] {
    font-weight: bold;
}

/* === Instructions Alert === */
.instructions-alert[b-le8vmy3cb2] {
    margin-bottom: 0;
}

/* === Instructions Text === */
.instructions-text[b-le8vmy3cb2] {
    font-size: 0.875rem;
}

/* === Form Labels === */
.form-label-required[b-le8vmy3cb2] {
    font-weight: 600;
}

/* === Error Text === */
.text-danger[b-le8vmy3cb2] {
    color: #dc3545;
}

/* === Info Text === */
.info-text[b-le8vmy3cb2] {
    font-size: 0.875rem;
    color: #17a2b8;
}

/* === Muted Text === */
.muted-text[b-le8vmy3cb2] {
    font-size: 0.875rem;
    color: #6c757d;
}

/* === Fiscal Obligation Warning === */
.fiscal-obligation-warning[b-le8vmy3cb2] {
    margin-top: 0.5rem;
    margin-bottom: 0;
}

/* === Period/Year Selectors === */
.period-selector-container[b-le8vmy3cb2] {
    flex: 0 0 30%;
}

/* Para forzar que el selector de periodo ocupe solo el 30% y el selector de año el resto del espacio disponible */
.year-selector-container[b-le8vmy3cb2] {
    flex: 1;
}

/* Para forzar que el selector de año ocupe toda la línea debajo del selector de periodo */
.year-selector-container-full[b-le8vmy3cb2] {
    flex: 0 0 100%;
}

/* === Custom Radzen Button Styles === */
[b-le8vmy3cb2] .rz-button-danger-custom {
    background-color: #FF123A !important;
    color: white !important;
    border: none !important;
}

[b-le8vmy3cb2] .rz-button-primary-custom {
    background-color: #4967FD !important;
    color: white !important;
    border: none !important;
}

/* === Document Modal Overlay === */
.modal-overlay[b-le8vmy3cb2] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
}

/* === Custom Confirmation Modal === */
.confirmation-modal-overlay[b-le8vmy3cb2] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10000;
    animation: fadeIn-b-le8vmy3cb2 0.2s ease-in-out;
}

/* Animación para el overlay del modal de confirmación */
@keyframes fadeIn-b-le8vmy3cb2 {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Contenedor principal del modal de confirmación */
.confirmation-modal-container[b-le8vmy3cb2] {
    background: white;
    border-radius: 12px;
    width: 90%;
    max-width: 500px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    animation: slideUp-b-le8vmy3cb2 0.3s ease-out;
}

/* Animación para el modal de confirmación */
@keyframes slideUp-b-le8vmy3cb2 {
    from {
        transform: translateY(30px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Header del modal de confirmación */
.confirmation-modal-header[b-le8vmy3cb2] {
    padding: 2rem 2rem 1rem 2rem;
}

/* Título del modal de confirmación */
.confirmation-modal-title[b-le8vmy3cb2] {
    font-family: 'R-Flex', sans-serif;
    font-weight: 700;
    font-size: 25px;
    line-height: 26px;
    letter-spacing: 0%;
    text-align: center;
    color: #000000;
    margin: 0;
}

/* Body del modal de confirmación */
.confirmation-modal-body[b-le8vmy3cb2] {
    padding: 1rem 2rem;
}

/* Mensaje del modal de confirmación */
.confirmation-modal-message[b-le8vmy3cb2] {
    font-family: 'R-Flex', sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: 0%;
    text-align: center;
    color: #959FC1;
    margin: 0;
}

/* Footer del modal de confirmación */
.confirmation-modal-footer[b-le8vmy3cb2] {
    display: flex;
    justify-content: center;
    padding: 1rem 2rem 2rem 2rem;
    gap: 0.5rem;
}

/* Estilos para los botones del modal de confirmación */
.confirmation-modal-footer button[b-le8vmy3cb2] {
    flex: 1;
    max-width: 170px;
    padding: 0.625rem 1.25rem;
    border-radius: 6px;
    font-family: 'R-Flex', sans-serif;
    font-weight: 600;
    font-size: 14px;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
}

/* Botón Cancelar (izquierda) - Rojo */
.btn-confirmation-cancel[b-le8vmy3cb2] {
    background-color: #FF123A;
    color: white;
}

.btn-confirmation-cancel:hover[b-le8vmy3cb2] {
    background-color: #E01034;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(255, 18, 58, 0.3);
}

.btn-confirmation-cancel:active[b-le8vmy3cb2] {
    transform: translateY(0);
}

/* Botón Enviar (derecha) - Azul */
.btn-confirmation-submit[b-le8vmy3cb2] {
    background-color: #4967FD;
    color: white;
}

.btn-confirmation-submit:hover[b-le8vmy3cb2] {
    background-color: #3651E0;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(73, 103, 253, 0.3);
}

.btn-confirmation-submit:active[b-le8vmy3cb2] {
    transform: translateY(0);
}
/* ============================================
   SUCCESS MODAL STYLES
   ============================================ */

/* Overlay del modal de éxito */
.success-modal-overlay[b-le8vmy3cb2] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10000;
}

/* Contenedor principal del modal de éxito */
.success-modal-container[b-le8vmy3cb2] {
    background: white;
    border-radius: 8px;
    padding: 2rem;
    width: 425px;
    height: 373.5px;
    opacity: 1;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
}

/* Icono SVG de éxito */
.success-modal-icon[b-le8vmy3cb2] {
    width: 135.5px;
    height: 135.5px;
    flex-shrink: 0;
    border-radius: 200px;
    opacity: 1;
}

/* Header del modal de éxito */
.success-modal-header[b-le8vmy3cb2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.5rem;
}

/* Título del modal de éxito */
.success-modal-title[b-le8vmy3cb2] {
    font-family: 'R-Flex', sans-serif;
    font-size: 25px;
    font-weight: 700;
    line-height: 30.26px;
    color: #000000;
    margin: 0;
    width: 425px;
    height: 66px;
    padding: 20px 30px;
    opacity: 1;
}

/* Footer del modal de éxito */
.success-modal-footer[b-le8vmy3cb2] {
    width: 100%;
    display: flex;
    justify-content: center;
}

/* Botón Cerrar */
.btn-success-close[b-le8vmy3cb2] {
    width: 100%;
    padding: 0.75rem 1.5rem;
    border: none;
    border-radius: 8px;
    font-family: 'R-Flex', sans-serif;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    background-color: #4967FD;
    color: white;
}

/* Hover y Active del botón Cerrar */
.btn-success-close:hover[b-le8vmy3cb2] {
    background-color: #3651E0;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(73, 103, 253, 0.3);
}

/* Eliminar el efecto hover al hacer clic */
.btn-success-close:active[b-le8vmy3cb2] {
    transform: translateY(0);
}

/* Estilo para el mensaje de error de coincidencia de RFC */
.doc-mismatch-inline[b-le8vmy3cb2] {
    margin-top: 2px;
    font-size: 0.75rem;
    font-weight: 600;
    color: #FF123A;
    line-height: 1.2;
}

/* Estilo para las tarjetas de RFC */
.rfc-cards-row[b-le8vmy3cb2] {
    display: flex;
    gap: 12px;
    width: 100%;
    justify-content: flex-start;
    flex-wrap: wrap;
    margin-top: 10px;
}

/* Estilo para las tarjetas de RFC */
.rfc-card[b-le8vmy3cb2] {
    background-color: #fff;
    border: 1px solid #f5c2c7;
    border-radius: 8px;
    padding: 10px 12px;
    flex: 1;
    min-width: 250px;
    max-width: 420px;
}

/* Estilo para las etiquetas de las tarjetas de RFC */
.rfc-card-label[b-le8vmy3cb2] {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: #6b7280;
    margin-bottom: 4px;
    line-height: 1.3;
}

/* Estilo para los valores de las tarjetas de RFC */
.rfc-card-value[b-le8vmy3cb2] {
    display: block;
    font-size: 16px;
    font-weight: 700;
    color: #111827;
    letter-spacing: 0.02em;
    line-height: 1.2;
}

/* Contenedor principal de la tarjeta */
.doc-document-card[b-le8vmy3cb2] {
    background-color: #f8fafe; /* Fondo con un tono muy ligero de azul/gris */
    border: 1px solid #e8eff5; /* Borde sutil */
    border-radius: 12px;
    padding: 12px 20px;
    width: 100%;
}

/* Título de la tarjeta */
.doc-card-title[b-le8vmy3cb2] {
    color: black;
    font-size: 16px;
    font-weight: 500;
    margin-top: 0;
}

/* Contenedor de cada fila (Obligatorios / Opcionales) */
.doc-document-row[b-le8vmy3cb2] {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    margin-bottom: 8px;
}

    /* Eliminar el margen inferior de la última fila */
    .doc-document-row:last-child[b-le8vmy3cb2] {
        margin-bottom: 0;
    }

/* Estilos de las etiquetas (Obligatorios: / Opcionales:) */
.doc-label[b-le8vmy3cb2] {
    font-weight: 500;
    font-size: 0.95rem;
    min-width: 100px; /* Asegura que el contenido de la derecha esté alineado */
}

/* Estilo para las etiquetas obligatorias */
.doc-label-required[b-le8vmy3cb2] {
    color: #3b5bfd;
}

/* Estilo para las etiquetas opcionales */
.doc-label-optional[b-le8vmy3cb2] {
    color: #7F869F;
}

/* Contenido de texto a la derecha */
.doc-content[b-le8vmy3cb2] {
    color: #384259; /* Gris oscuro ligeramente azulado */
    font-size: 0.95rem;
    font-weight: 400;
    line-height: 1.5;
}

/* Estilo para las barras separadoras "|" */
.doc-separator[b-le8vmy3cb2] {
    margin: 0 5px;
    color: #384259;
    font-weight: 400;
}
/* /Pages/Dashboard/BillingCard.razor.rz.scp.css */
/* Estilos para el ícono de flecha personalizada del dropdown */
[b-3bing6nglb] .rz-dropdown::after {
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.41 0L6 4.94467L10.59 0L12 1.52227L6 8L0 1.52227L1.41 0Z' fill='%234867FF'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 12px 8px;
    width: 12px;
    height: 8px;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
}

/* Oculta el ícono de flecha predeterminado del dropdown */
[b-3bing6nglb] .rz-dropdown .rz-dropdown-trigger-icon {
    display: none;
}

/* Estilos para el contenedor del filtro de rendimiento de tareas */
[b-3bing6nglb] .filter-dropdown {
    width: 180px;
    border: none;
}
/* /Pages/Dashboard/ComplianceChatCard.razor.rz.scp.css */
/* ComplianceChatCard.razor.css */
/* Estilos personalizados para la tarjeta */
.card-form[b-taiwt0nkvo] {
    height: auto !important;
    background-color: #FFFFFF !important;
    padding: 0px !important;
}

/* Estilos para el encabezado de la tarjeta */
.header-padding[b-taiwt0nkvo] {
    padding-bottom: 0.6rem;
}

/* Estilos para el total */    
.chart-total[b-taiwt0nkvo] {
    font-size: 28px;
    font-weight: 700;
}

/* Estilos card header custom */
.card-header-custom[b-taiwt0nkvo] {
    margin-bottom: 10px;
}

/* Estilos para el contenedor del ícono */
.icon-wrapper[b-taiwt0nkvo] {
    width: 36px;
    height: 36px;
    background: linear-gradient(135deg, #2563EB, #1D4ED8);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Estilos para el ícono */
.card-icon[b-taiwt0nkvo] {
    color: white;
    font-size: 20px;
}

/* Estilos para el título de la tarjeta */
.card-title[b-taiwt0nkvo] {
    margin-bottom: 0;
    font-weight: bold;
    font-size: 18px;
    color: #0A0A0A;
}

/* Estilos para el subtítulo de la tarjeta */
.card-subtitle[b-taiwt0nkvo] {
    font-size: 0.85rem;
    color: #64748B;
}

/* Estilos para el contenedor */
.chart-container[b-taiwt0nkvo] {
    width: 100%;
    margin-top: 50px;
    flex-grow: 1;
    position: relative;
}

/* Estilos para el contenedor del gráfico */
.custom-graphic-series-legend[b-taiwt0nkvo] {
    margin-top: 75px;
}

/* Custom legend item */
.custom-legend-item[b-taiwt0nkvo] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}

/* Estilos para el contenedor de la leyenda personalizada */
.legend-color[b-taiwt0nkvo] {
    width: 14px;
    height: 14px;
    border-radius: 50%;
}

/* Estilos para el texto de la leyenda personalizada */
.legend-value[b-taiwt0nkvo] {
    font-weight: 600;
    color: #2563EB;
}

/* Estilos para el contenedor de la leyenda personalizada */
.custom-legend-container[b-taiwt0nkvo] {
    width: 60%;
    display: flex;
    flex-direction: column;
    margin: auto;
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}

/* Estilos para la fila de la leyenda personalizada */
.legend-row[b-taiwt0nkvo] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 0;
}

/* Estilos para el contenedor de la leyenda personalizada */
.legend-left[b-taiwt0nkvo] {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Estilos para el contenedor de la leyenda personalizada */
.legend-dot[b-taiwt0nkvo] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
}

/* Estilos para el texto de la leyenda personalizada */
.legend-label[b-taiwt0nkvo] {
    font-size: 16px;
    color: #7F869F;
}

/* Estilos para el número de la leyenda personalizada */
.legend-number[b-taiwt0nkvo] {
    font-weight: bold;
    font-size: 16px;
    color: #000000;
}

/* Estilos para la línea horizontal */
.line-hr[b-taiwt0nkvo] {
    border-bottom: 1px solid #dae4e9;
}

/* Estilos rz */
.rz-chart[b-taiwt0nkvo] {
    padding-bottom: 0 !important;
    margin-bottom: -160px !important;
}

/* Estilos para el contenedor del loader */
.loader-container[b-taiwt0nkvo] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 521px;
}
/* /Pages/Dashboard/ExternalLinksCard.razor.rz.scp.css */
.links-container[b-h32zyrj5cz] {
    flex: 1;
    overflow-y: auto;
    min-height: 300px;
}

/* Scroll moderno */
.links-container[b-h32zyrj5cz]::-webkit-scrollbar {
    width: 6px;
}

.links-container[b-h32zyrj5cz]::-webkit-scrollbar-thumb {
    background-color: #d1d9e0;
    border-radius: 10px;
}

.links-container[b-h32zyrj5cz]::-webkit-scrollbar-track {
    background: transparent;
}

[b-h32zyrj5cz] .link-item {
    padding: 0.9rem 1rem;
    border-top: 1px dashed #dae4e9;
    display: flex;
    align-items: center;
    transition: background 0.15s ease;
}

    /* línea superior del primero */
    [b-h32zyrj5cz] .link-item:first-child {
        border-top: 1px solid #dae4e9;
    }

    /* hover elegante */
    [b-h32zyrj5cz] .link-item:hover {
        background-color: #f8fafc;
    }

.title-card[b-h32zyrj5cz] {
    padding-bottom: 0.6rem;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    border-bottom: 1px solid #dae4e9;
}

/* card flexible */
.full-height-card[b-h32zyrj5cz] {
    height: 100%;
    display: flex;
    flex-direction: column;
}

/* texto del link */
.link-item .rz-text[b-h32zyrj5cz] {
    transition: color 0.15s ease;
}

.link-item:hover .rz-text[b-h32zyrj5cz] {
    color: #3657f0;
}

.title-card .rz-text:last-child[b-h32zyrj5cz] {
    margin-bottom: 0;
}

.loader-container[b-h32zyrj5cz] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.no-links[b-h32zyrj5cz] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 300px;
    text-align: center;
    color: #9eb1b9;
}
/* /Pages/Index.razor.rz.scp.css */
/* Estilos para el ícono de flecha personalizada del dropdown */
[b-21wgj5jgdh] .rz-dropdown::after {
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.41 0L6 4.94467L10.59 0L12 1.52227L6 8L0 1.52227L1.41 0Z' fill='%234867FF'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 12px 8px;
    width: 12px;
    height: 8px;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
}

/* Oculta el ícono de flecha predeterminado del dropdown */
[b-21wgj5jgdh] .rz-dropdown .rz-dropdown-trigger-icon {
    display: none;
}

/* Estilos para el contenedor del filtro de rendimiento de tareas*/
[b-21wgj5jgdh] .filter-dropdown {
    width: 180px;
    border: none;
}

.dashboard-header[b-21wgj5jgdh] {
    position: sticky;
    top: 0;
    z-index: 1;
    padding-top: 10px;
    padding-bottom: 20px;
    background-color: #F4F5F9;
    box-shadow: 5px 0 0 rgb(244, 245, 249), -5px 0 0 rgb(244, 245, 249);
}

.dashboard-row[b-21wgj5jgdh] {
    align-items: stretch;
}

.card-wrapper[b-21wgj5jgdh] {
    width: 100%;
    display: flex;
    flex-direction: column;
}

.card-form[b-21wgj5jgdh] {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.left-column-wrapper[b-21wgj5jgdh] {
    display: flex;
    flex-direction: column;
    height: 100%;
    gap: 20px;
}

    .left-column-wrapper > :first-child[b-21wgj5jgdh] {
        flex: 0 0 auto;
    }

    .left-column-wrapper > :last-child[b-21wgj5jgdh] {
        flex: 1;
        display: flex;
    }

        .left-column-wrapper > :last-child > *[b-21wgj5jgdh] {
            width: 100%;
        }
/* /Pages/Modulos/CustomerFeeChargingConfiguration.razor.rz.scp.css */
/*Estilo para el label de información*/
.info-alert[b-vzxtnxpp5n] {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    padding: 10px 0px;
}

/*Estilo para el ícono*/
.info-alert-icon[b-vzxtnxpp5n] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/*Estilo para el texto*/
.info-alert-text[b-vzxtnxpp5n] {
    flex: 1;
    color: #4B5563;
    font-size: 14px;
    line-height: 1.45;
    font-weight: 500;
}
/* /Shared/Components/PerformanceIndicatorCard.razor.rz.scp.css */
/* Estilos para PerformanceIndicatorCard */

/* Título de la tarjeta */
.performance-card-title[b-rb00tgel1e] {
    font-family: 'R-Flex', sans-serif;
    font-weight: 700; /* Bold */
    font-size: 18px;
    line-height: 20px;
    vertical-align: middle;
}

/* Separador del header */
.card-header-separator[b-rb00tgel1e] {
    border-bottom: 1px solid #E0E0E0;
    padding-bottom: 1rem;
    margin-bottom: 0 !important;
    margin-left: -1.10rem;
    margin-right: -1.10rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

/* Dropdowns de filtros */
[b-rb00tgel1e] .filter-dropdown {
    min-width: 120px;
    font-size: 0.875rem;
}

/* Contenedor de tabla */
.performance-table-container[b-rb00tgel1e] {
    max-height: 500px;
    overflow-y: auto;
}

/* Tabla de desempeño */
.performance-table[b-rb00tgel1e] {
    font-size: 0.875rem;
    margin-bottom: 0;
    border-collapse: collapse;
}

/* Elimina bordes de la tabla */
.performance-table[b-rb00tgel1e],
.performance-table td[b-rb00tgel1e],
.performance-table th[b-rb00tgel1e],
.performance-table tr[b-rb00tgel1e] {
    border: none !important;
}

/* Estilos para el encabezado de la tabla */
.performance-table thead[b-rb00tgel1e] {
    position: sticky;
    top: 0;
    background-color: transparent;
    z-index: 1;
}

/* Estilos para las celdas del encabezado */
.performance-table thead th[b-rb00tgel1e] {
    border: none;
    background-color: transparent;
    color: #959FC1;
    font-family: 'R-Flex', sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
    text-transform: uppercase;
    padding: 1rem;
    white-space: nowrap;
}

/* Estilos para las celdas del cuerpo de la tabla */
.performance-table tbody td[b-rb00tgel1e] {
    padding: 0.75rem 0.5rem;
    vertical-align: middle;
    border: none !important;
}

/* Filas con colores alternados */
.performance-table tbody tr:nth-child(odd)[b-rb00tgel1e] {
    background-color: #F6F8FF;
}

/* Efecto hover para filas */
.performance-table tbody tr:hover[b-rb00tgel1e] {
    opacity: 0.9;
}

/* Badges de estado */
.badge[b-rb00tgel1e] {
    font-size: 0.7rem;
    font-weight: 500;
    padding: 0.3rem 0.6rem;
    border-radius: 15px;
    display: inline-flex;
    align-items: center;
}

/* Colores para cada estado de desempeño */
.status-requiere-atencion[b-rb00tgel1e] {
    background-color: rgba(255, 18, 58, 0.15);
    color: #FF123A;
    font-family: 'R-flex';
    font-size: 12px;
    font-weight: bold;
}

/* Colores para cada estado de desempeño */
.status-excelente[b-rb00tgel1e] {
    background-color: rgba(23, 209, 125, 0.08);
    color: #17D17D;
    font-family: 'R-flex';
    font-size: 12px;
    font-weight: bold;
}

/* Colores para cada estado de desempeño */
.status-bueno[b-rb00tgel1e] {
    background-color: rgba(23, 209, 125, 0.08);
    color: #17D17D;
    font-family: 'R-flex';
    font-size: 12px;
    font-weight: bold;
}

/* Colores para cada estado de desempeño */
.status-regular[b-rb00tgel1e] {
    background-color: rgba(255, 173, 0, 0.12);
    color: #FFAD00;
    font-family: 'R-flex';
    font-size: 12px;
    font-weight: bold;
}

/* Colores para cada estado de desempeño */
.status-malo[b-rb00tgel1e] {
    background-color: rgba(255, 18, 58, 0.15);
    color: #FF123A;
    font-family: 'R-flex';
    font-size: 12px;
    font-weight: bold;
}

/* Colores para cada estado de desempeño */
.status-sin-info[b-rb00tgel1e] {
    background-color: rgba(127, 134, 159, 0.15);
    color: #7F869F;
}

/* Estilos de celdas con colores específicos */
.cell-con-retraso[b-rb00tgel1e],
.cell-por-entregar-hoy[b-rb00tgel1e],
.cell-proximas-vencer[b-rb00tgel1e],
.cell-en-tiempo[b-rb00tgel1e],
.cell-finalizadas[b-rb00tgel1e] {
    font-family: 'R-Flex', sans-serif;
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    text-align: center;
    display: flex;
    padding: 8px 10px;
    border-radius: 8px;
    min-width: 80px;
    width: 100%;
    justify-content: center;
    align-items: center;
}

/* Estilos para cada estado de desempeño en celdas */
.cell-con-retraso[b-rb00tgel1e] {
    background-color: rgba(255, 18, 58, 0.08);
    color: #FF123A;
}

/* Estilos para cada estado de desempeño en celdas */
.cell-por-entregar-hoy[b-rb00tgel1e] {
    background-color: rgba(255, 173, 0, 0.08);
    color: #FFAD00;
}

/* Estilos para cada estado de desempeño en celdas */
.cell-proximas-vencer[b-rb00tgel1e] {
    background-color: rgba(255, 197, 66, 0.10);
    color: #FFC542;
}

/* Estilos para cada estado de desempeño en celdas */
.cell-en-tiempo[b-rb00tgel1e] {
    background-color: rgba(65, 173, 255, 0.15);
    color: #4967FD;
}

/* Estilos para cada estado de desempeño en celdas */
.cell-finalizadas[b-rb00tgel1e] {
    background-color: rgba(23, 209, 125, 0.08);
    color: #17D17D;
}

/*Estilo para el título del componente*/
.name-card-pf[b-rb00tgel1e] {
    font-family: 'R-flex';
    font-size: 18px;
    font-weight: bold;
    color: #0A0A0A;
}

/*Estilo para el nombre del cabecero de las columnas*/
.name-column-pf[b-rb00tgel1e] {
    font-family: 'R-flex';
    font-size: 14px;
    font-weight: 500;
    color: #959FC1;
}

/*Estilo para el nombre de cada fila de la tabla*/
.name-accountant[b-rb00tgel1e] {
    font-family: 'R-flex';
    font-size: 16px;
    font-weight: bold;
    color: #000000;
}

/*Estilo para el texto de desempeño*/
.text-performance[b-rb00tgel1e] {
    font-family: 'R-flex';
    font-size: 18px;
    font-weight: bold;
    color: #000000;
}

/*Estilo para el progress bar*/
.global-progress[b-rb00tgel1e]  .rz-progressbar-value {
    height: 8px !important;
    border-radius: 10px;
}

/*Estilo para el progress bar excelente*/
[b-rb00tgel1e] .color-progress-bar-excellente .rz-progressbar-value {
    background-color: #17D17D !important;
}

/*Estilo para el progress bar regular*/
[b-rb00tgel1e] .color-progress-bar-regular .rz-progressbar-value {
    background-color: #FFAD00 !important;
}

/*Estilo para el progress bar malo*/
[b-rb00tgel1e] .color-progress-bar-bad .rz-progressbar-value {
    background-color: #FF123A !important;
}

/*Estilo para el texto de desempeño*/
.global-indicator-banner .fw-bold[b-rb00tgel1e] {
    font-weight: 700 !important;
}

/*Estilo para el tooltip de finalizadas*/
.tooltip-finalizadas[b-rb00tgel1e]{
    display: flex !important;
    gap: 5px !important;
    align-items: center !important;
    justify-content: center !important;
}

/*Estilo del layout de la tabla*/
.table[b-rb00tgel1e] {
    table-layout: auto !important;
} 
/* /Shared/Components/TaskPerformanceCard.razor.rz.scp.css */
/* Estilos para el título de la tarjeta */
.task-performance-card-title[b-ixb5e8rp2k] {
    font-family: 'R-Flex', sans-serif;
    font-weight: 700; /* Bold */
    font-size: 18px;
    color: #0A0A0A;
}

/* Estilos para el ícono de flecha personalizada del dropdown */
[b-ixb5e8rp2k] .rz-dropdown::after {
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.41 0L6 4.94467L10.59 0L12 1.52227L6 8L0 1.52227L1.41 0Z' fill='%234867FF'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 12px 8px;
    width: 12px;
    height: 8px;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
}

/* Oculta el ícono de flecha predeterminado del dropdown */
[b-ixb5e8rp2k] .rz-dropdown .rz-dropdown-trigger-icon {
    display: none;
}

/* Estilos para el contenedor del filtro de rendimiento de tareas */
[b-ixb5e8rp2k] .filter-dropdown {
    width: 180px;
    border: none;
}

/* Estilos para el contenedor del gráfico de rendimiento de tareas */
[b-ixb5e8rp2k] .performance-chart {
    width: 100%;
    height: 450px;
}

/* Estilos para el contenedor del filtro de rendimiento de tareas */
[b-ixb5e8rp2k] .period-legend {
    color: #959FC1;
    font-size: 14px;
}

/* Estilos para las leyendas del gráfico */
[b-ixb5e8rp2k] .rz-legend {
    font-size: 12px;
}

[b-ixb5e8rp2k] .rz-legend-item {
    margin: 4px 8px;
}

[b-ixb5e8rp2k] .rz-legend-item-text {
    font-size: 12px !important;
    font-weight: 400;
}

[b-ixb5e8rp2k] .rz-legend-item-marker {
    width: 12px;
    height: 12px;
    margin-right: 6px;
}

/* Hace que el SVG de la leyenda sea circular */
[b-ixb5e8rp2k] .rz-legend-item svg {
    border-radius: 50%;
    overflow: hidden;
}

/* Convierte el path rectangular en circular usando clip-path */
[b-ixb5e8rp2k] .rz-legend-item .rz-marker path {
    clip-path: circle(50% at 50% 50%);
}

/* Leyenda personalizada debajo del gráfico */
.custom-legend[b-ixb5e8rp2k] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px 16px;
    padding: 12px 8px 4px;
    max-width: 100%;
}

/* Estilos para cada ítem de la leyenda personalizada */
.custom-legend-item[b-ixb5e8rp2k] {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    flex: 0 0 calc(10% - 16px);
    max-width: 150px;
    cursor: pointer;
    user-select: none;
    transition: opacity 0.2s;
}

/* Efecto de hover para resaltar la leyenda al pasar el mouse */
.custom-legend-item:hover[b-ixb5e8rp2k] {
    opacity: 0.7;
}

/* Estilos para las leyendas ocultas */
.custom-legend-item.legend-hidden[b-ixb5e8rp2k] {
    opacity: 0.35;
}

/* Estilos para el texto de las leyendas ocultas, con tachado */
.custom-legend-item.legend-hidden .custom-legend-text[b-ixb5e8rp2k] {
    text-decoration: line-through;
}

/* Estilos para el marcador de la leyenda personalizada, con forma circular */
.custom-legend-marker[b-ixb5e8rp2k] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

/* Oculta etiquetas del eje X en pantallas pequeñas para evitar solapamiento */
@media (max-width: 984px) {
    [b-ixb5e8rp2k] .performance-chart .rz-category-axis .rz-tick-text {
        display: none;
    }
}

/* Estilos para el texto de la leyenda personalizada, con manejo de texto largo */
.custom-legend-text[b-ixb5e8rp2k] {
    font-size: 16px;
    color: #7F869F;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
