@import '_content/Sail2025.Blazor/Sail2025.Blazor.icoesifx31.bundle.scp.css';

/* _content/CRMFoliatti/Components/Layout/AdminLayout.razor.rz.scp.css */
/* Shared/AdminLayout.razor.css */

.admin-layout[b-pycmcg8rgd] {
    display: flex;
    flex-direction: column;
    height: 100vh; /* Ocupa toda la altura de la ventana */
    overflow: hidden; /* Evita scroll en el layout general */
    font-family: Arial, sans-serif;
}

.top-nav[b-pycmcg8rgd] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: white;
    color: #333;
    padding: 0 20px;
    height: 50px;
    flex-shrink: 0; /* No se encoge */
    border-bottom: 1px solid #ddd;
    z-index: 100;
}

.top-nav-left[b-pycmcg8rgd] {
    display: flex;
    align-items: center;
}

.top-nav-logo[b-pycmcg8rgd] {
    height: 40px;
    margin-right: 20px;
}

.top-nav-right[b-pycmcg8rgd] {
    display: flex;
    align-items: center;
    gap: 20px;
}

.user-avatar[b-pycmcg8rgd] {
    background-color: #e09a3c;
    color: white;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: bold;
}

.main-container[b-pycmcg8rgd] {
    display: flex;
    flex-grow: 1; /* Ocupa el espacio restante en el layout */
    overflow: hidden; /* Controla el overflow de las columnas internas */
}

.side-nav[b-pycmcg8rgd] {
    width: 250px;
    background-color: #f3f3f3;
    padding-top: 20px;
    border-right: 1px solid #ddd;
    flex-shrink: 0; /* Evita que el sidebar se encoja */
    z-index: 90;
    /* --- CAMBIOS CLAVE PARA EL SCROLLBAR EN EL MENÚ --- */
    height: 100%; /* Asegura que ocupe toda la altura disponible de su padre .main-container */
    overflow-y: auto; /* Agrega scroll vertical si el contenido del menú se desborda */
    /* --- FIN CAMBIOS CLAVE --- */
}

.sidebar-brand[b-pycmcg8rgd] {
    padding: 0 20px 20px;
    text-align: center;
}

    .sidebar-brand img[b-pycmcg8rgd] {
        max-width: 150px;
        height: auto;
    }

.main-nav-menu[b-pycmcg8rgd] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.nav-item a[b-pycmcg8rgd] {
    display: flex;
    align-items: center;
    padding: 15px 25px;
    text-decoration: none;
    color: #333;
    font-size: 0.95rem;
    border-left: 3px solid transparent;
}

    .nav-item a:hover[b-pycmcg8rgd] {
        background-color: #e9e9e9;
    }

    .nav-item a.active[b-pycmcg8rgd] {
        background-color: #e9e9e9;
        font-weight: bold;
        color: #005fb2;
        border-left: 3px solid #005fb2;
    }

.nav-icon[b-pycmcg8rgd] {
    margin-right: 15px;
    font-size: 1.2rem;
    width: 20px;
    text-align: center;
}

.content[b-pycmcg8rgd] {
    flex-grow: 1;
    padding: 25px;
    overflow-y: auto; /* Este es el scrollbar para el contenido principal, que ya funciona */
    background-color: #fafafa;
}

/* --- Estilos para submenús (copiados de tu SideNavMenu si no están ya en este CSS) --- */
.has-submenu .submenu[b-pycmcg8rgd] {
    list-style: none;
    padding: 0;
    margin: 0;
    background-color: #e9e9e9;
}

    .has-submenu .submenu li a[b-pycmcg8rgd] {
        padding: 10px 25px 10px 45px;
        font-size: 0.9rem;
        color: #555;
    }

        .has-submenu .submenu li a:hover[b-pycmcg8rgd] {
            background-color: #dcdcdc;
        }

.submenu-arrow[b-pycmcg8rgd] {
    margin-left: auto;
    transition: transform 0.3s ease-in-out;
}

    .submenu-arrow.open[b-pycmcg8rgd] {
        transform: rotate(90deg);
    }

.has-nested-submenu .nested-submenu[b-pycmcg8rgd] {
    list-style: none; 
    padding: 0;
    margin: 0;
    background-color: #dcdcdc;
}

    .has-nested-submenu .nested-submenu li a[b-pycmcg8rgd] {
        padding: 8px 25px 8px 65px;
        font-size: 0.85rem;
        color: #666;
    }

        .has-nested-submenu .nested-submenu li a:hover[b-pycmcg8rgd] {
            background-color: #c0c0c0;
        }
/* _content/CRMFoliatti/Components/Layout/MainLayout.razor.rz.scp.css */
#blazor-error-ui[b-8k77rii0pt] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-8k77rii0pt] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* _content/CRMFoliatti/Components/Layout/UserActions.razor.rz.scp.css */
/* Shared/UserActions.razor.css */

.user-actions-container[b-5j4rcobuh4] {
    display: flex;
    align-items: center;
    gap: 15px; /* Espacio entre iconos y elementos de usuario */
    position: relative; /* Importante para el posicionamiento de los paneles desplegables */
    height: 100%; /* Para que los paneles puedan pegarse a la parte inferior de la top-nav */
}

.action-icon-btn[b-5j4rcobuh4] {
    background: none;
    border: none;
    font-size: 1.2rem;
    color: #6e707e; /* Gris oscuro */
    cursor: pointer;
    padding: 5px;
    position: relative; /* Para el badge de notificación */
    transition: color 0.2s;
}

    .action-icon-btn:hover[b-5j4rcobuh4] {
        color: #4e73df; /* Azul al pasar el mouse */
    }

.notification-badge[b-5j4rcobuh4] {
    position: absolute;
    top: -5px; /* Ajusta la posición vertical del badge */
    right: -5px; /* Ajusta la posición horizontal del badge */
    background-color: #e74a3b; /* Rojo */
    color: white;
    border-radius: 50%;
    padding: 2px 6px;
    font-size: 0.7rem;
    line-height: 1;
    font-weight: bold;
    min-width: 18px; /* Asegura un tamaño mínimo para el badge */
    text-align: center;
}

/* Estilos de tu botón user-avatar-button y user-avatar */
.user-avatar-button[b-5j4rcobuh4] {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    margin-left: 10px; /* Espacio entre el último icono y el botón de usuario */
    display: flex;
    align-items: center;
}

.user-avatar[b-5j4rcobuh4] {
    background-color: #e09a3c;
    color: white;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: bold;
    font-size: 0.8rem;
}

/* --- Paneles desplegables (Búsqueda y Notificaciones) --- */
/* NOTA: Estos paneles se posicionarán fijos a la ventana, lo cual es típico para overlays/modales.
         Si quieres que estén "pegados" a la barra superior, necesitarías un contenedor con position:relative
         en el AdminLayout y estos paneles con position:absolute, ajustando top/right.
         Pero por ahora, fixed es más simple para la funcionalidad de overlay. */

.search-overlay[b-5j4rcobuh4] {
    position: fixed; /* Ocupa toda la pantalla */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5); /* Fondo semitransparente */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1001; /* Sobre la top-nav */
}

.search-panel[b-5j4rcobuh4] {
    background-color: white;
    padding: 20px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    width: 80%; /* Ancho del panel de búsqueda */
    max-width: 600px;
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,.3) !important; /* Sombra más pronunciada */
}

.search-input-global[b-5j4rcobuh4] {
    flex-grow: 1;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 10px;
}

.notifications-panel[b-5j4rcobuh4] {
    position: absolute; /* Posicionado absolutamente dentro de user-actions-container */
    top: 50px; /* Debajo de la top-nav (ajusta si top-nav no es 50px) */
    right: 0; /* Alineado a la derecha del user-actions-container */
    width: 350px; /* Ancho del panel de notificaciones */
    background-color: white;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,.15) !important;
    z-index: 1002; /* Sobre la top-nav y overlay de búsqueda */
    display: flex;
    flex-direction: column;
}

.notification-header[b-5j4rcobuh4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 15px;
    border-bottom: 1px solid #eee;
}

    .notification-header h6[b-5j4rcobuh4] {
        margin: 0;
        font-size: 1rem;
        color: #333;
    }

.notification-list[b-5j4rcobuh4] {
    list-style: none;
    padding: 0;
    margin: 0;
    max-height: 300px; /* Altura máxima para scroll */
    overflow-y: auto;
}

.notification-item[b-5j4rcobuh4] {
    padding: 10px 15px;
    border-bottom: 1px solid #f8f9fa;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    transition: background-color 0.2s;
}

    .notification-item:hover[b-5j4rcobuh4] {
        background-color: #f0f8ff; /* Fondo al pasar el mouse */
    }

    .notification-item:last-child[b-5j4rcobuh4] {
        border-bottom: none;
    }

    .notification-item.read[b-5j4rcobuh4] {
        background-color: #f2f2f2; /* Notificaciones leídas con fondo gris */
        color: #888;
    }

.notification-text[b-5j4rcobuh4] {
    flex-grow: 1;
    margin-right: 10px;
    font-size: 0.9rem;
}

.notification-time[b-5j4rcobuh4] {
    font-size: 0.75rem;
    color: #999;
    flex-shrink: 0;
}

.no-notifications[b-5j4rcobuh4] {
    padding: 20px;
    text-align: center;
    font-size: 0.9rem;
}

.notification-footer[b-5j4rcobuh4] {
    padding: 10px;
    border-top: 1px solid #eee;
    text-align: center;
}

    .notification-footer .btn-link[b-5j4rcobuh4] {
        font-size: 0.85rem;
        color: #4e73df;
    }

/* Estilos de botones generales (Asegúrate de que estas clases estén disponibles globalmente, o cópialas aquí) */
.btn[b-5j4rcobuh4] {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    text-align: center;
    text-decoration: none;
    line-height: 1.5;
}

.btn-primary[b-5j4rcobuh4] {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
}

.btn-secondary[b-5j4rcobuh4] {
    background-color: #f8f9fa; 
    border-color: #ddd;
    color: #333;
}

.btn-link[b-5j4rcobuh4] {
    color: #007bff;
    text-decoration: none;
}

    .btn-link:hover[b-5j4rcobuh4] {
        text-decoration: underline;
    }
/* _content/CRMFoliatti/Components/Pages/Admin/ConfirmationModal.razor.rz.scp.css */
/* Estilos para el modal de confirmación */
.modal-backdrop[b-kwe285zm3p] {
    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: 1050;
    animation: fadeIn-b-kwe285zm3p 0.3s ease;
}

@keyframes fadeIn-b-kwe285zm3p {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.modal-container[b-kwe285zm3p] {
    background-color: white;
    border-radius: 8px;
    width: 450px;
    max-width: 90%;
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    display: flex;
    flex-direction: column;
}

.modal-header[b-kwe285zm3p] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 1rem;
    border-bottom: 1px solid #dee2e6;
    background-color: #f8f9fa;
}

.modal-icon[b-kwe285zm3p] {
    font-size: 1.5rem;
    color: #fd7e14; /* Naranja para advertencia */
}

.modal-header h3[b-kwe285zm3p] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
}

.modal-body[b-kwe285zm3p] {
    padding: 1.5rem;
    font-size: 1rem;
    line-height: 1.5;
}

    .modal-body strong[b-kwe285zm3p] {
        color: #dc3545; /* Rojo para el nombre a eliminar */
    }

.modal-footer[b-kwe285zm3p] {
    display: flex;
    justify-content: flex-end;
    padding: 1rem;
    border-top: 1px solid #dee2e6;
    background-color: #f8f9fa;
    gap: 10px;
}

/* Estilos para los botones del modal */
.btn[b-kwe285zm3p] {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    text-align: center;
}
 
.btn-secondary[b-kwe285zm3p] {
    background-color: white;
    border-color: #ccc;
    color: #333;
}

    .btn-secondary:hover[b-kwe285zm3p] {
        background-color: #e9ecef;
    }

.btn-danger[b-kwe285zm3p] {
    background-color: #dc3545;
    border-color: #dc3545;
    color: white;
}

    .btn-danger:hover[b-kwe285zm3p] {
        background-color: #c82333;
    }
/* _content/CRMFoliatti/Components/Pages/Admin/ProfileListView.razor.rz.scp.css */
/* Estilos para la vista de lista de perfiles */

.page-header[b-iunrb5une6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #ddd;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

h1[b-iunrb5une6] {
    font-size: 1.5rem;
    color: #333;
}

.btn-primary[b-iunrb5une6] {
    background-color: #007bff;
    color: white;
    border: none;
    padding: 8px 16px;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 500;
}

.table-container[b-iunrb5une6] {
    border: 1px solid #ddd;
    border-radius: 4px;
    overflow: hidden;
    background-color: white;
}

.data-table[b-iunrb5une6] {
    width: 100%;
    border-collapse: collapse;
}

    .data-table th[b-iunrb5une6], .data-table td[b-iunrb5une6] {
        padding: 12px 15px;
        text-align: left;
        border-bottom: 1px solid #ddd; 
        vertical-align: middle;
    }

    .data-table thead th[b-iunrb5une6] {
        background-color: #f9f9f9;
        font-weight: bold;
    }

.btn-action-delete[b-iunrb5une6] {
    background-color: transparent;
    border: 1px solid #dc3545;
    color: #dc3545;
    cursor: pointer;
    padding: 5px 12px;
    font-size: 0.85rem;
    border-radius: 15px;
    transition: all 0.2s;
    font-weight: 500;
}

    .btn-action-delete:hover[b-iunrb5une6] {
        background-color: #dc3545;
        color: white;
    }
/* _content/CRMFoliatti/Components/Pages/Admin/ProfileNewForm.razor.rz.scp.css */
/* Estilos compartidos para los formularios de la sección de Administración */

.form-container[b-ynlgomucre] {
    background-color: white;
    padding: 20px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.page-header[b-ynlgomucre] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #ddd;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

h1[b-ynlgomucre] {
    font-size: 1.5rem;
    color: #333;
}

.form-grid[b-ynlgomucre] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.form-field[b-ynlgomucre] {
    display: flex;
    flex-direction: column;
}

    .form-field label[b-ynlgomucre] {
        margin-bottom: 5px;
        font-size: 0.85rem;
        color: #555;
        font-weight: 500;
    }

    .form-field input[type="text"][b-ynlgomucre],
    .form-field input[type="email"][b-ynlgomucre],
    .form-field select[b-ynlgomucre] {
        width: 100%;
        padding: 8px;
        border: 1px solid #ccc;
        border-radius: 4px;
        box-sizing: border-box;
        font-family: inherit;
        font-size: 0.9rem;
    }

    .form-field input[type="checkbox"][b-ynlgomucre] {
        /* Estilo específico para que el checkbox no ocupe todo el ancho */
        width: auto;
        align-self: flex-start;
        margin-top: 8px;
    }


.form-actions[b-ynlgomucre] {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #eee;
    text-align: right;
}

    .form-actions .btn[b-ynlgomucre] {
        margin-left: 10px;
    } 

.btn[b-ynlgomucre] {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    text-align: center;
}

.btn-primary[b-ynlgomucre] {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
}

.btn-secondary[b-ynlgomucre] {
    background-color: #f8f9fa;
    border-color: #ddd;
    color: #333;
}
/* _content/CRMFoliatti/Components/Pages/Admin/UserDetailsModal.razor.rz.scp.css */
/* Estilos para el modal de Detalle de Usuario */
.modal-backdrop[b-6m4tu7mtb6] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1050;
    animation: fadeIn-b-6m4tu7mtb6 0.3s ease;
}

@keyframes fadeIn-b-6m4tu7mtb6 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.modal-container[b-6m4tu7mtb6] {
    background-color: white;
    border-radius: 8px;
    width: 500px;
    max-width: 90%;
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    display: flex;
    flex-direction: column;
}

.modal-header[b-6m4tu7mtb6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    border-bottom: 1px solid #dee2e6;
    background-color: #f8f9fa;
}

.modal-header-content[b-6m4tu7mtb6] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-6m4tu7mtb6] {
    font-size: 1.2rem;
    color: #007bff; /* Azul para información */
}

.modal-header h3[b-6m4tu7mtb6] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
}

.btn-close[b-6m4tu7mtb6] {
    border: none;
    background: none;
    font-size: 1.5rem;
    cursor: pointer;
    line-height: 1;
    color: #6c757d;
}

.modal-body[b-6m4tu7mtb6] {
    padding: 1.5rem;
}

/* Estilos para la lista de detalles del usuario */
.details-list[b-6m4tu7mtb6] {
    display: grid;
    grid-template-columns: 150px 1fr; /* Columna de etiquetas y columna de valores */
    gap: 12px 20px;
}

    .details-list dt[b-6m4tu7mtb6] { /* Etiqueta (ej. "Nombre Completo") */
        font-weight: bold;
        color: #555;
        text-align: right;
    }

    .details-list dd[b-6m4tu7mtb6] { /* Valor (ej. "Alejandro Torres") */
        margin: 0;
    }

.modal-footer[b-6m4tu7mtb6] {
    display: flex;
    justify-content: flex-end;
    padding: 1rem;
    border-top: 1px solid #dee2e6;
    background-color: #f8f9fa;
    gap: 10px;
}

/* Estilos para la insignia de estado dentro del modal */
.status-badge[b-6m4tu7mtb6] {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 15px;
    font-size: 0.8rem;
    font-weight: bold;
    color: white;
}

.status-activa[b-6m4tu7mtb6] {
    background-color: #28a745; /* Verde */
}

.status-inactiva[b-6m4tu7mtb6] {
    background-color: #6c757d; /* Gris */
}

/* Botón de Cerrar en el pie del modal */ 
.btn-secondary[b-6m4tu7mtb6] {
    background-color: white;
    border-color: #ccc;
    color: #333;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid #ccc;
}

    .btn-secondary:hover[b-6m4tu7mtb6] {
        background-color: #e9ecef;
    }
/* _content/CRMFoliatti/Components/Pages/Admin/UserListView.razor.rz.scp.css */
/* Estilos para la vista de lista de usuarios */

.page-header[b-xswym4mkp1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #ddd;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

h1[b-xswym4mkp1] {
    font-size: 1.5rem;
    color: #333;
}

.btn-primary[b-xswym4mkp1] {
    background-color: #007bff;
    color: white;
    border: none;
    padding: 8px 16px;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 500;
}

.table-container[b-xswym4mkp1] {
    border: 1px solid #ddd;
    border-radius: 4px;
    overflow: hidden;
    background-color: white;
}

.data-table[b-xswym4mkp1] {
    width: 100%;
    border-collapse: collapse;
}

    .data-table th[b-xswym4mkp1], .data-table td[b-xswym4mkp1] {
        padding: 12px 15px;
        text-align: left;
        border-bottom: 1px solid #ddd;
        vertical-align: middle;
    }

    .data-table thead th[b-xswym4mkp1] {
        background-color: #f9f9f9;
        font-weight: bold;
    }

.btn-action[b-xswym4mkp1] {
    background-color: transparent;
    border: 1px solid #6c757d;
    color: #6c757d;
    cursor: pointer;
    padding: 5px 12px;
    font-size: 0.85rem;
    margin-right: 10px;
    border-radius: 15px;
    transition: all 0.2s;
    font-weight: 500;
}

    .btn-action:hover[b-xswym4mkp1] {
        background-color: #6c757d;
        color: white;
    }

.btn-action-delete[b-xswym4mkp1] {
    border-color: #dc3545; 
    color: #dc3545;
}

    .btn-action-delete:hover[b-xswym4mkp1] {
        background-color: #dc3545;
        color: white;
    }

.status-badge[b-xswym4mkp1] {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 15px;
    font-size: 0.8rem;
    font-weight: bold;
    color: white;
}

.status-activa[b-xswym4mkp1] {
    background-color: #28a745;
}

.status-inactiva[b-xswym4mkp1] {
    background-color: #6c757d;
}
/* _content/CRMFoliatti/Components/Pages/Admin/UserNewForm.razor.rz.scp.css */
/* Estilos compartidos para los formularios de la sección de Administración */

.form-container[b-tlegilyhou] {
    background-color: white;
    padding: 20px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.page-header[b-tlegilyhou] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #ddd;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

h1[b-tlegilyhou] {
    font-size: 1.5rem;
    color: #333;
}

.form-grid[b-tlegilyhou] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.form-field[b-tlegilyhou] {
    display: flex;
    flex-direction: column;
}

    .form-field label[b-tlegilyhou] {
        margin-bottom: 5px;
        font-size: 0.85rem;
        color: #555;
        font-weight: 500;
    }

    .form-field input[type="text"][b-tlegilyhou],
    .form-field input[type="email"][b-tlegilyhou],
    .form-field select[b-tlegilyhou] {
        width: 100%;
        padding: 8px;
        border: 1px solid #ccc;
        border-radius: 4px;
        box-sizing: border-box;
        font-family: inherit;
        font-size: 0.9rem;
    }

    .form-field input[type="checkbox"][b-tlegilyhou] {
        /* Estilo específico para que el checkbox no ocupe todo el ancho */
        width: auto;
        align-self: flex-start;
        margin-top: 8px;
    }


.form-actions[b-tlegilyhou] {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #eee;
    text-align: right;
}

    .form-actions .btn[b-tlegilyhou] { 
        margin-left: 10px;
    }

.btn[b-tlegilyhou] {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    text-align: center;
}

.btn-primary[b-tlegilyhou] {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
}

.btn-secondary[b-tlegilyhou] {
    background-color: #f8f9fa;
    border-color: #ddd;
    color: #333;
}
/* _content/CRMFoliatti/Components/Pages/CheckDevice.razor.rz.scp.css */
/* Pages/CheckDevice.razor.css */

/*
    ARCHIVO CSS CORREGIDO Y MEJORADO
*/

/* Contenedor principal para centrar todo vertical y horizontalmente */
.verify-container[b-j7f7psk2qs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    background-color: white;
    font-family: Arial, sans-serif;
    padding: 2rem;
    box-sizing: border-box;
}

/* Caja para el contenido de arriba (textos e imagen) */
.verify-box[b-j7f7psk2qs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    max-width: 550px;
}

.title[b-j7f7psk2qs] {
    font-size: 2rem;
    color: #333;
    margin-bottom: 1rem;
    font-weight: 300;
}

.subtitle[b-j7f7psk2qs] {
    font-size: 1rem;
    color: #555;
    line-height: 1.6;
    margin-bottom: 1.5rem;
}

.username-display[b-j7f7psk2qs] {
    color: #555;
    font-size: 1rem;
    margin-bottom: 2rem;
}

.phone-image[b-j7f7psk2qs] {
    max-width: 350px;
    margin-bottom: 1rem;
}

/* Sección del formulario (caja gris) */
.form-section[b-j7f7psk2qs] {
    width: 100%;
    max-width: 450px; /* Aumentado para que el campo de texto sea más largo */
    background-color: #f9f9f9;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 2rem;
    margin-top: 2rem;
    box-sizing: border-box;
}

    .form-section label[b-j7f7psk2qs] {
        display: block;
        text-align: left;
        font-size: 0.9rem;
        color: #555;
        margin-bottom: 0.5rem;
    }

    /* ESTILOS PARA EL INPUT TEXT - AUMENTO DE ESPECIFICIDAD */
    /* Apuntamos directamente al ID del InputText dentro de la sección del formulario */
    .form-section #verification_code.form-control[b-j7f7psk2qs] {
        width: 100% !important;
        padding: 0.75rem !important; /* Altura del campo */
        font-size: 1rem !important;
        border: 2px solid #0070d2 !important; /* BORDE MÁS GRUESO Y AZUL */
        border-radius: 4px !important;
        box-sizing: border-box !important;
        outline: none !important; /* Quita el outline por defecto en focus */
    }

        .form-section #verification_code.form-control:focus[b-j7f7psk2qs] {
            border-color: #005fb2 !important; /* Color de borde en focus (azul más oscuro) */
            box-shadow: 0 0 0 0.15rem rgba(0, 112, 210, 0.25) !important; /* Sombra suave en focus */
        }


    /* Estilos para el form-group (para el margen del campo y el mensaje de validación) */
    .form-section .form-group[b-j7f7psk2qs] {
        margin-bottom: 1.5rem !important; /* Asegura el margen inferior */
    }

/* Estilo para los mensajes de validación */
.validation-message[b-j7f7psk2qs] {
    color: #dc3545; /* Rojo para el error */
    font-size: 0.8rem;
    margin-top: 5px; /* Espacio entre el campo y el mensaje */
    text-align: left;
    display: block; /* Para que ocupe su propia línea */
}

/* Estilo específico y robusto para el botón de verificar */ 
.form-section .btn-verify[b-j7f7psk2qs] {
    width: 100%;
    padding: 0.8rem;
    background-color: #0070d2;
    color: white;
    border: none;
    border-radius: 4px;
    font-size: 1rem;
    cursor: pointer;
    margin-top: 1.5rem; /* Margen superior para el botón */
    font-weight: bold;
}

    .form-section .btn-verify:hover[b-j7f7psk2qs] {
        background-color: #005fb2;
    }
/* _content/CRMFoliatti/Components/Pages/Clientes/Clientes.razor.rz.scp.css */
/* Pages/Clientes/Clientes.razor.css */

.client-management-page[b-21hjc6pc48] {
    padding: 20px;
    background-color: #f3f3f3;
    min-height: calc(100vh - 90px);
}

/* Estilos de botones generales */
.btn[b-21hjc6pc48] {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    text-align: center;
    text-decoration: none;
    line-height: 1.5;
}

.btn-primary[b-21hjc6pc48] {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
}

.btn-secondary[b-21hjc6pc48] {
    background-color: #f8f9fa;
    border-color: #ddd;
    color: #333;
}

.btn-success[b-21hjc6pc48] {
    background-color: #28a745;
    border-color: #28a745;
    color: white;
}

.btn-info[b-21hjc6pc48] {
    background-color: #17a2b8;
    border-color: #17a2b8;
    color: white;
}

.btn-link[b-21hjc6pc48] {
    color: #007bff;
    text-decoration: none;
}

    .btn-link:hover[b-21hjc6pc48] {
        text-decoration: underline;
    }

/* Estilos para cards */
.card[b-21hjc6pc48] {
    border: 1px solid #e3e6f0;
    border-radius: 0.35rem;
    background-color: #fff;
    box-shadow: 0 0.15rem 1.75rem 0 rgba(58,59,69,.15) !important;
}

.card-header[b-21hjc6pc48] {
    padding: 0.75rem 1.25rem;
    margin-bottom: 0;
    background-color: #f8f9fc;
    border-bottom: 1px solid #e3e6f0;
    border-top-left-radius: calc(0.35rem - 1px);
    border-top-right-radius: calc(0.35rem - 1px);
}

    .card-header h6[b-21hjc6pc48] {
        margin: 0;
        font-size: 1rem;
        color: #4e73df;
    }

.card-body[b-21hjc6pc48] {
    padding: 1.25rem;
}

/* Estilos de formulario (basado en tus estilos anteriores, ahora para la búsqueda) */
.form-label[b-21hjc6pc48] {
    font-size: 0.85rem;
    color: #555;
    font-weight: 500;
    margin-bottom: 0.5rem;
}

.form-control[b-21hjc6pc48] {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 0.9rem;
    font-weight: 400;
    line-height: 1.5;
    color: #6e707e;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #d1d3e2;
    border-radius: 0.35rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

    .form-control:focus[b-21hjc6pc48] {
        border-color: #a7c2ff;
        outline: 0;
        box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
    }

/* ELIMINADOS: Estilos para el grid del formulario de 2 columnas y form-field
   Si se usaran en otra parte del cliente, se pueden mantener pero ya no son para el formulario principal */
/* .form-grid-2-cols {} */
/* .form-field {} */


/* --- NUEVOS ESTILOS PARA LA VISTA DE PERFIL DE SOLO LECTURA (TIPO SALESFORCE) --- */
.client-details-card .card-body[b-21hjc6pc48] {
    padding: 0; /* Quitamos el padding del card-body, las secciones internas lo manejarán */
}

.profile-header-inline[b-21hjc6pc48] {
    padding: 1.25rem; /* Padding interno */
    display: flex;
    align-items: center;
    background-color: #fcfcfc;
    border-bottom: 1px solid #eee;
}

.profile-icon-inline[b-21hjc6pc48] {
    font-size: 2rem;
    color: #4e73df;
}

.profile-header-inline h4[b-21hjc6pc48] {
    font-size: 1.2rem;
    margin-bottom: 0;
    color: #333;
}

.profile-header-inline p[b-21hjc6pc48] {
    font-size: 0.85rem;
    color: #666;
    margin-bottom: 0;
}

.profile-meta-info-inline[b-21hjc6pc48] {
    padding: 1.25rem; /* Padding interno */
    background-color: #fcfcfc;
    border-bottom: 1px solid #eee;
    font-size: 0.85rem;
    color: #555;
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px; /* Espacio entre los elementos de meta-información */
}


.info-section-wrapper[b-21hjc6pc48] {
    /* Este contenedor puede ayudar si tienes margen alrededor de las secciones */
    padding: 1.25rem; /* Padding para todo el grupo de secciones */
}

.info-section-salesforce[b-21hjc6pc48] {
    margin-bottom: 0; /* Las líneas se encargarán de la separación */
}

.section-heading-salesforce[b-21hjc6pc48] {
    font-size: 1rem;
    color: #333;
    font-weight: bold;
    padding: 10px 0; /* Padding vertical para el encabezado */
    border-bottom: 1px solid #e0e0e0; /* Línea divisoria */
    margin-bottom: 10px; /* Espacio debajo de la línea */
}

.info-field-grid-salesforce[b-21hjc6pc48] {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* Dos columnas por defecto */
    gap: 10px 20px; /* Espacio entre campos */
    margin-bottom: 20px; /* Espacio después del grupo de campos */
}

.info-field-salesforce[b-21hjc6pc48] {
    display: flex;
    flex-direction: column; /* Label arriba, valor abajo */
    font-size: 0.9rem;
}

.info-label-salesforce[b-21hjc6pc48] {
    color: #888; /* Color gris para el label */
    font-weight: normal; /* No negrita */
    margin-bottom: 2px;
}

.info-value-salesforce[b-21hjc6pc48] {
    color: #333;
    font-weight: 500; /* Un poco más de peso para el valor */
}

.info-section-salesforce.last-section-salesforce .info-field-grid-salesforce[b-21hjc6pc48] {
    margin-bottom: 0; /* El último grid no necesita margen inferior */
}

/* Estilos para la tabla de resultados de búsqueda */
.data-table-scroll-container[b-21hjc6pc48] {
    overflow-y: auto;
    max-height: 500px;
}

.data-table[b-21hjc6pc48] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
    color: #555;
}

    .data-table thead[b-21hjc6pc48] {
        background-color: #f8f9fc;
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .data-table th[b-21hjc6pc48], .data-table td[b-21hjc6pc48] {
        padding: 12px 15px;
        border-bottom: 1px solid #eee;
        text-align: left;
    }

    .data-table th[b-21hjc6pc48] {
        font-weight: bold;
        color: #444;
        text-transform: uppercase;
        font-size: 0.8rem;
        white-space: nowrap;
    }

    .data-table tbody tr.clickable-row[b-21hjc6pc48] {
        cursor: pointer;
    }

        .data-table tbody tr.clickable-row:hover[b-21hjc6pc48] {
            background-color: #e9ecef;
        }

    .data-table tbody tr.table-row-selected[b-21hjc6pc48] {
        background-color: #e0f2ff;
        font-weight: bold;
    }

    .data-table .compact-table th[b-21hjc6pc48],
    .data-table .compact-table td[b-21hjc6pc48] {
        padding: 8px 12px;
    }

/* Estilos para las tarjetas de Jugadores y Relaciones de Campaña */
.player-item[b-21hjc6pc48], .campaign-item[b-21hjc6pc48] {
    border-bottom: 1px solid #f2f2f2;
    padding-bottom: 10px;
    margin-bottom: 10px !important;
}

    .player-item:last-child[b-21hjc6pc48], .campaign-item:last-child[b-21hjc6pc48] {
        border-bottom: none;
        padding-bottom: 0;
        margin-bottom: 0 !important;
    }

.player-info a.player-link[b-21hjc6pc48] {
    font-weight: bold;
    color: #007bff;
    text-decoration: none;
}

    .player-info a.player-link:hover[b-21hjc6pc48] {
        text-decoration: underline;
    }

.player-info .text-muted.small[b-21hjc6pc48] {
    font-size: 0.75rem;
}

/* Mensaje de alerta para formulario vacío */
.alert-info[b-21hjc6pc48] {
    color: #0c5460;
    background-color: #d1ecf1;
    border-color: #bee5eb;
    padding: 1rem;
    border-radius: 0.25rem;
}
/* _content/CRMFoliatti/Components/Pages/Clientes/JugadorDetalles.razor.rz.scp.css */
/* Pages/Clientes/JugadorDetalles.razor.css */

.main-content-area[b-8s21ge1z36] {
    padding: 20px;
    background-color: #f3f3f3;
    min-height: calc(100vh - 90px);
}

/* Estilos de la cabecera del perfil del jugador (similar al cliente) */
.client-profile-header[b-8s21ge1z36] {
    background-color: white;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,.075) !important;
    padding: 15px 20px;
    margin-bottom: 20px;
}

    .client-profile-header .card-body[b-8s21ge1z36] {
        padding: 0;
    }

.client-icon[b-8s21ge1z36] {
    font-size: 2.5rem;
    color: #1cc88a; /* Verde para jugador, por ejemplo */
}

.client-profile-header h4[b-8s21ge1z36] {
    font-size: 1.5rem;
    color: #333;
    margin-bottom: 0;
}

.client-profile-header p[b-8s21ge1z36] {
    font-size: 0.9rem;
    color: #666;
    margin-bottom: 0;
}

/* Estilos para pestañas (Detalles/Actividad) - Reutilizados */
.nav-tabs[b-8s21ge1z36] {
    border-bottom: 1px solid #dee2e6;
}

    .nav-tabs .nav-item .nav-link[b-8s21ge1z36] {
        color: #666;
        border: 1px solid transparent;
        border-top-left-radius: 0.25rem;
        border-top-right-radius: 0.25rem;
        padding: 0.75rem 1.25rem;
        margin-bottom: -1px;
        background-color: transparent;
        transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
    }

        .nav-tabs .nav-item .nav-link:hover[b-8s21ge1z36] {
            border-color: #e9ecef #e9ecef #dee2e6;
        }

        .nav-tabs .nav-item .nav-link.active[b-8s21ge1z36] {
            color: #495057;
            background-color: white;
            border-color: #dee2e6 #dee2e6 #fff;
            font-weight: bold;
        }

/* Estilos para las secciones de información - Reutilizados y para el colapsado */
.info-section[b-8s21ge1z36] { /* Contenedor general para grupos de info-label/info-value */
    /* Removido el borde y padding para que los estilos del form-section-group lo manejen */
    margin-bottom: 20px; /* Espacio entre secciones */
    background-color: #fcfcfc;
}

.info-section-title[b-8s21ge1z36] { /* Si se usa un título interno sin colapsar */
    font-size: 1rem;
    color: #4e73df;
    margin-bottom: 15px;
    padding-bottom: 5px;
    border-bottom: 1px dashed #eee;
}

.info-label[b-8s21ge1z36] {
    font-weight: 600;
    color: #555;
    margin-right: 5px;
}

.info-value[b-8s21ge1z36] {
    color: #333;
}

/* --- Estilos para Secciones Desplegables del Formulario (copiados de Clientes.razor.css) --- */
.form-section-group[b-8s21ge1z36] {
    border: 1px solid #eee;
    border-radius: 5px;
    margin-bottom: 15px; /* Espacio entre secciones */
    overflow: hidden; /* Asegura que el contenido colapsado no se desborde */
}

.form-section-header[b-8s21ge1z36] {
    background-color: #f8f9fc; /* Fondo del encabezado de la sección */
    padding: 10px 15px;
    border-bottom: 1px solid #eee;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: bold;
    color: #4e73df; /* Color del texto del encabezado */
    transition: background-color 0.2s;
}

    .form-section-header:hover[b-8s21ge1z36] {
        background-color: #e9ecef;
    }

    .form-section-header h6[b-8s21ge1z36] {
        margin: 0;
        font-size: 0.95rem;
    }

.section-toggle-icon[b-8s21ge1z36] {
    transition: transform 0.3s ease-in-out;
}

    .section-toggle-icon.rotated[b-8s21ge1z36] {
        transform: rotate(180deg);
    }

.form-section-content[b-8s21ge1z36] {
    padding: 15px;
    background-color: white;
    max-height: 0; /* Por defecto colapsado */
    overflow: hidden;
    transition: max-height 0.3s ease-in-out, padding 0.3s ease-in-out;
}

    .form-section-content.open[b-8s21ge1z36] {
        max-height: 1000px; /* Suficientemente grande para expandir */
        padding: 15px;
    }


/* Estilos para las tarjetas de resumen laterales (Historial, Tarjetas de Juego, Consumos) */
.card-header h6[b-8s21ge1z36] {
    font-size: 1rem;
    color: #4e73df;
    margin-bottom: 0;
}

.history-item[b-8s21ge1z36], .game-card-item[b-8s21ge1z36], .consumo-item[b-8s21ge1z36] {
    border-bottom: 1px solid #f2f2f2;
    padding-bottom: 10px;
    margin-bottom: 10px !important;
}

    .history-item:last-child[b-8s21ge1z36], .game-card-item:last-child[b-8s21ge1z36], .consumo-item:last-child[b-8s21ge1z36] {
        border-bottom: none;
        padding-bottom: 0;
        margin-bottom: 0 !important;
    }

    .history-item .small[b-8s21ge1z36], .consumo-item .small[b-8s21ge1z36] {
        font-size: 0.85rem;
        color: #666;
    }

/* --- ESTILOS ESPECÍFICOS PARA TARJETAS DE JUEGO Y CONSUMOS (PARA QUE SE VEAN COMO EN LA IMAGEN) --- */
.game-card-item[b-8s21ge1z36] {
    display: flex;
    align-items: center; /* Alinea los elementos verticalmente */
    font-size: 0.9rem;
    color: #333;
}

    .game-card-item .game-card-number[b-8s21ge1z36] {
        font-weight: bold;
        color: #007bff; /* Azul para el número de tarjeta */
        flex-grow: 1; /* Permite que el número ocupe el espacio */
    }

    .game-card-item input[type="checkbox"][b-8s21ge1z36] {
        transform: scale(1.1); /* Hace el checkbox un poco más grande */
        margin-right: 5px; /* Espacio al lado del checkbox */
        cursor: default; /* No es interactivo */
    }

.consumo-item[b-8s21ge1z36] {
    font-size: 0.9rem;
    color: #333;
    position: relative; /* Para el botón de dropdown */
    padding-right: 30px; /* Espacio para el botón de dropdown */
}

    .consumo-item .consumo-number[b-8s21ge1z36] {
        font-weight: bold;
        color: #007bff; /* Azul para el número de consumo */
        margin-bottom: 5px;
    }

    .consumo-item .btn-link[b-8s21ge1z36] {
        position: absolute;
        top: 5px; /* Ajusta la posición vertical del botón */
        right: 0; /* Lo coloca a la derecha */
    }

/* Estilos de botones generales - Reutilizados */
.btn[b-8s21ge1z36] {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    text-align: center;
    text-decoration: none;
}

.btn-primary[b-8s21ge1z36] {
    background-color: #007bff; 
    border-color: #007bff;
    color: white;
}

.btn-secondary[b-8s21ge1z36] {
    background-color: #f8f9fa;
    border-color: #ddd;
    color: #333;
}

.btn-link[b-8s21ge1z36] {
    color: #007bff;
    text-decoration: none;
}

    .btn-link:hover[b-8s21ge1z36] {
        text-decoration: underline;
    }
/* _content/CRMFoliatti/Components/Pages/CreacionPorProceso.razor.rz.scp.css */
/* Components/Pages/CreacionPorProceso.razor.css */

.form-container[b-g2hfrkkxve] {
    background-color: white;
    padding: 20px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.page-header[b-g2hfrkkxve] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #ddd;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

h3[b-g2hfrkkxve] {
    font-size: 1.5rem;
    color: #333;
    margin: 0;
}

.btn[b-g2hfrkkxve] {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    text-align: center;
    text-decoration: none;
}

.btn-primary[b-g2hfrkkxve] {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
}

.btn-secondary[b-g2hfrkkxve] { /* Agregado para el botón Configurar */
    background-color: #f8f9fa;
    border-color: #ddd;
    color: #333;
}

.process-list[b-g2hfrkkxve] {
    display: grid;
    gap: 15px;
}

.process-card[b-g2hfrkkxve] {
    display: flex;
    align-items: center;
    padding: 15px;
    border: 1px solid #eee;
    border-radius: 4px;
    background-color: #fff;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    transition: box-shadow 0.2s ease-in-out;
}

    .process-card:hover[b-g2hfrkkxve] {
        box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    }

.process-icon[b-g2hfrkkxve] {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 1.5rem;
    margin-right: 15px;
    flex-shrink: 0;
}

/* Clases de color para los iconos, directamente de Bootstrap bg-* */
.bg-primary[b-g2hfrkkxve] {
    background-color: #007bff !important;
}

.bg-secondary[b-g2hfrkkxve] {
    background-color: #6c757d !important;
}

.bg-success[b-g2hfrkkxve] {
    background-color: #28a745 !important;
}

.bg-danger[b-g2hfrkkxve] {
    background-color: #dc3545 !important;
}

.bg-warning[b-g2hfrkkxve] {
    background-color: #ffc107 !important;
}

.bg-info[b-g2hfrkkxve] {
    background-color: #17a2b8 !important;
}

.bg-dark[b-g2hfrkkxve] {
    background-color: #343a40 !important;
}


.process-details[b-g2hfrkkxve] {
    flex-grow: 1;
}

    .process-details h4[b-g2hfrkkxve] {
        margin: 0 0 5px 0;
        font-size: 1.1rem;
        color: #333;
    }

    .process-details p[b-g2hfrkkxve] {
        margin: 0;
        font-size: 0.85rem;
        color: #666;
    }

.process-actions[b-g2hfrkkxve] {
    display: flex;
    align-items: center;
    margin-left: auto;
}

    .process-actions .btn[b-g2hfrkkxve] {
        margin-left: 10px;
        padding: 6px 12px;
    }

.process-toggle[b-g2hfrkkxve] {
    margin-left: 15px;
    display: flex;
    align-items: center;
    cursor: pointer;
}

    .process-toggle input[type="checkbox"][b-g2hfrkkxve] { 
        width: 20px;
        height: 20px;
        margin: 0;
        cursor: pointer;
    }

    .process-toggle label[b-g2hfrkkxve] {
        margin-left: 8px;
        font-size: 0.9rem;
        color: #555;
        cursor: pointer;
    }

/* Iconos de Font Awesome dentro de la tarjeta */
.process-card .fas[b-g2hfrkkxve] {
    line-height: 1;
}
/* _content/CRMFoliatti/Components/Pages/Dashboard.razor.rz.scp.css */
.dashboard-grid[b-f1n0j58k85] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 20px;
}

.chart-card[b-f1n0j58k85] {
    background-color: white;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

    .chart-card h3[b-f1n0j58k85] {
        margin-top: 0;
        font-size: 1.1rem;
        border-bottom: 1px solid #eee;
        padding-bottom: 10px;
        margin-bottom: 15px;
    }

/* Estilos para las tarjetas de KPI */
.kpi-card[b-f1n0j58k85] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.kpi-value[b-f1n0j58k85] {
    font-size: 3rem;
    font-weight: bold;
    color: #0070d2;
}
/* Hacemos la tarjeta un contenedor flex para poder empujar el footer hacia abajo */
.chart-card[b-f1n0j58k85] {
    background-color: white;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    display: flex; /* <-- AÑADIR */
    flex-direction: column; /* <-- AÑADIR */
}

/* Estilos para el nuevo pie de página de la tarjeta */
.card-footer[b-f1n0j58k85] {
    margin-top: auto; /* <-- ESTA ES LA MAGIA que empuja el footer al fondo */
    padding-top: 15px;
    border-top: 1px solid #f0f0f0;
    text-align: right; /* Alinea el enlace a la derecha */
}

.export-link[b-f1n0j58k85] {
    text-decoration: none;
    color: #0070d2;
    font-size: 0.85rem;
    cursor: pointer;
    font-weight: 500;
}

    .export-link:hover[b-f1n0j58k85] {
        text-decoration: underline;
    }
.export-link-button[b-f1n0j58k85] {
    background: none;
    border: none;
    padding: 0;
    color: #0070d2;
    font-family: inherit;
    font-size: 0.85rem;
    font-weight: 500;
    cursor: pointer;
    text-decoration: none;
}

    .export-link-button:hover[b-f1n0j58k85] {
        text-decoration: underline;
    }
/* _content/CRMFoliatti/Components/Pages/EfectividadPromociones.razor.rz.scp.css */
/* Components/Pages/Promociones/Efectividad.razor.css */

/* Estilos generales del contenedor y encabezado */
.form-container[b-0f6txrcpzb] {
    background-color: white;
    padding: 20px;
    border: 1px solid #ddd;
    border-radius: 4px;
}
 
.page-header[b-0f6txrcpzb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #ddd;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

h3[b-0f6txrcpzb] {
    font-size: 1.5rem;
    color: #333;
    margin: 0;
}

/* Estilos de botones */
.btn[b-0f6txrcpzb] {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    text-align: center;
    text-decoration: none;
}

.btn-primary[b-0f6txrcpzb] {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
}

.btn-success[b-0f6txrcpzb] { /* Botón de Exportar a Excel */
    background-color: #1cc88a;
    border-color: #1cc88a;
    color: white;
}

/* Estilos para las tarjetas de filtros y los Kpi-Cards */
.card[b-0f6txrcpzb] {
    border: 1px solid #e3e6f0;
    border-radius: 0.35rem;
    background-color: #fff;
    box-shadow: 0 0.15rem 1.75rem 0 rgba(58,59,69,.15) !important; /* Sombra de tarjeta de Bootstrap */
}

.card-header[b-0f6txrcpzb] {
    padding: 0.75rem 1.25rem;
    margin-bottom: 0;
    background-color: #f8f9fc; /* Fondo claro para el header de la tarjeta */
    border-bottom: 1px solid #e3e6f0;
    border-top-left-radius: calc(0.35rem - 1px);
    border-top-right-radius: calc(0.35rem - 1px);
}

    .card-header h6[b-0f6txrcpzb] {
        margin: 0;
        font-size: 1rem;
        color: #4e73df; /* Color azul para títulos de tarjeta */
    }

.card-body[b-0f6txrcpzb] {
    padding: 1.25rem;
}

/* Estilos para los campos de formulario (InputDate) */
.form-label[b-0f6txrcpzb] {
    font-size: 0.85rem;
    color: #555;
    font-weight: 500; /* Coherente con tus labels de formularios */
    margin-bottom: 0.5rem; /* Espacio debajo del label */
}

.form-control[b-0f6txrcpzb] {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 0.9rem;
    font-weight: 400;
    line-height: 1.5;
    color: #6e707e;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #d1d3e2;
    border-radius: 0.35rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

    .form-control:focus[b-0f6txrcpzb] {
        color: #6e707e;
        background-color: #fff;
        border-color: #a7c2ff; /* Color de foco */
        outline: 0;
        box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
    }

/* Estilos para las tarjetas KPI */
.kpi-row[b-0f6txrcpzb] {
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px; /* Compensar padding de col */
    margin-left: -15px; /* Compensar padding de col */
}

.kpi-card[b-0f6txrcpzb] {
    border-left: 0.25rem solid #4e73df !important; /* Borde izquierdo azul para resaltar */
    box-shadow: 0 0.15rem 1.75rem 0 rgba(58,59,69,.15) !important;
}

    .kpi-card .card-body[b-0f6txrcpzb] {
        padding: 1rem; /* Padding más compacto */
    }

.kpi-value[b-0f6txrcpzb] {
    font-size: 1.5rem;
    font-weight: bold;
    color: #5a5c69;
    margin-bottom: 0.5rem;
}

.kpi-card .card-title[b-0f6txrcpzb] {
    font-size: 0.7rem;
    font-weight: bold;
    text-transform: uppercase;
    color: #858796;
}

/* Colores específicos para KPI cards si los deseas diferenciados */
/*
.kpi-card.enviadas { border-left-color: #4e73df !important; }
.kpi-card.redimidas { border-left-color: #1cc88a !important; }
.kpi-card.tasa { border-left-color: #36b9cc !important; }
.kpi-card.asistidos { border-left-color: #f6c23e !important; }
*/


/* Estilos para la tabla */
.table-container[b-0f6txrcpzb] {
    overflow-x: auto; /* Para tablas que pueden desbordarse en pantallas pequeñas */
    border: 1px solid #e3e6f0; /* Borde alrededor del contenedor de la tabla */
    border-radius: 0.35rem;
    background-color: #fff; /* Fondo blanco */
    box-shadow: 0 0.15rem 1.75rem 0 rgba(58,59,69,.15) !important;
}

.data-table[b-0f6txrcpzb] {
    width: 100%;
    margin-bottom: 0; /* No hay margen inferior si está dentro de un card/container */
    color: #858796; /* Color de texto general de la tabla */
    border-collapse: collapse; /* Eliminar espacios entre celdas */
}

.data-table[b-0f6txrcpzb]
/* _content/CRMFoliatti/Components/Pages/ForgotPassword.razor.rz.scp.css */
/* Pages/ForgotPassword.razor.css */

body[b-7o9pdgjh6z], html[b-7o9pdgjh6z] {
    margin: 0;
    padding: 0;
    height: 100%;
    font-family: Arial, sans-serif;
    background-color: #f0f2f5; /* Fondo similar al del login */
}

.auth-page-container[b-7o9pdgjh6z] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 100vh; /* Ocupa toda la altura de la ventana */
    background-color: #f0f2f5; /* Fondo suave */
    padding: 20px;
    box-sizing: border-box; /* Incluye padding en el tamaño total */
}

.login-card[b-7o9pdgjh6z] {
    background-color: white;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    padding: 30px;
    width: 100%;
    max-width: 450px; /* AUMENTADO: Ancho máximo similar al login, pero un poco más para el campo de texto */
    text-align: center;
    margin-bottom: 20px; /* Espacio para el copyright */
}

.login-logo[b-7o9pdgjh6z] {
    margin-bottom: 20px;
}

    .login-logo img[b-7o9pdgjh6z] {
        max-width: 150px; /* Ajusta el tamaño de tu logo */
        height: auto;
    }

.login-card h3[b-7o9pdgjh6z] {
    font-size: 1.8rem;
    color: #333;
    margin-bottom: 10px;
}

.reset-instructions[b-7o9pdgjh6z] {
    font-size: 0.95rem;
    color: #666;
    margin-bottom: 25px;
}

.form-group label[b-7o9pdgjh6z] {
    display: block;
    text-align: center; /* CAMBIO: Centrar el texto de la etiqueta */
    margin-bottom: 5px;
    font-size: 0.9rem;
    color: #555;
    font-weight: bold;
}

.form-group.mb-3[b-7o9pdgjh6z] {
    margin-bottom: 20px !important;
}


.form-control[b-7o9pdgjh6z] {
    width: 100%;
    padding: 12px 15px; /* AUMENTADO: Padding para hacer el campo más alto */
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 1rem;
    box-sizing: border-box; /* Incluye padding en el tamaño total */
}

    .form-control:focus[b-7o9pdgjh6z] {
        border-color: #007bff;
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
        outline: none;
    }

.btn-primary[b-7o9pdgjh6z] {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
    padding: 12px 20px;
    font-size: 1.1rem;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.2s, border-color 0.2s;
}

    .btn-primary:hover[b-7o9pdgjh6z] {
        background-color: #0056b3;
        border-color: #0056b3;
    }

.login-links[b-7o9pdgjh6z] {
    margin-top: 20px;
}

    .login-links a[b-7o9pdgjh6z] {
        color: #007bff;
        text-decoration: none;
        font-size: 0.9rem; 
    }

        .login-links a:hover[b-7o9pdgjh6z] {
            text-decoration: underline;
        }

        .login-links a.d-block[b-7o9pdgjh6z] {
            margin-bottom: 10px;
        }

.copyright[b-7o9pdgjh6z] {
    font-size: 0.8rem;
    color: #888;
    margin-top: 20px;
}
/* _content/CRMFoliatti/Components/Pages/JourneyBuilder/BuilderStepView.razor.rz.scp.css */
/* Components/BuilderStepView.razor.css */

.builder-step-wrapper[b-ikn8mc1h4c] {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

/* Estilo del conector de flecha */
.builder-connector[b-ikn8mc1h4c] {
    margin: 0 15px; /* Espacio antes y después de la flecha */
    flex-shrink: 0;
    position: relative;
}

    .builder-connector .connector-arrow[b-ikn8mc1h4c] {
        display: block;
        width: 25px; /* Ancho de la flecha */
        height: 25px; /* Altura de la flecha */
        background-color: #4e73df; /* Color azul de la flecha */
        clip-path: polygon(0% 20%, 60% 20%, 60% 0%, 100% 50%, 60% 100%, 60% 80%, 0% 80%); /* Forma de flecha */
    }


/* Estilo de la tarjeta del paso */
.builder-step[b-ikn8mc1h4c] {
    width: 200px;
    background-color: white;
    border: 1px solid #ccc;
    border-radius: 8px; /* Un poco más redondeado */
    box-shadow: 0 2px 5px rgba(0,0,0,0.1); /* Sombra más suave */
    overflow: hidden;
    transition: transform 0.2s ease-in-out;
}

    .builder-step:hover[b-ikn8mc1h4c] {
        transform: translateY(-3px);
        box-shadow: 0 4px 8px rgba(0,0,0,0.15);
    }

.step-header[b-ikn8mc1h4c] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 15px;
    border-bottom: 1px solid #eee;
    background-color: #f8f9fc; /* Fondo ligeramente gris para el header */
}

    .step-header .step-icon[b-ikn8mc1h4c] {
        font-size: 1.5rem; /* Icono más grande */
        color: #6a0dad; /* Color morado como en la imagen para el icono de mensaje (valor por defecto) */
        flex-shrink: 0;
    }

/* Colores específicos para iconos de pasos según el tipo */
.builder-step.message .step-icon[b-ikn8mc1h4c] {
    color: #6a0dad;
}
/* Morado para Mensaje */
.builder-step.wait .step-icon[b-ikn8mc1h4c] {
    color: #ffc107;
}
/* Amarillo para Espera */
.builder-step.decision .step-icon[b-ikn8mc1h4c] {
    color: #dc3545;
}
/* Rojo para Decisión */


.step-header .step-title[b-ikn8mc1h4c] {
    font-weight: bold;
    color: #333;
    font-size: 1rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.step-body[b-ikn8mc1h4c] {
    padding: 15px;
    font-size: 0.9rem;
    color: #555;
    min-height: 50px;
}

.step-actions[b-ikn8mc1h4c] {
    display: flex;
    justify-content: space-around;
    padding: 10px 15px;
    background-color: #f9f9f9;
    border-top: 1px solid #eee;
}

.btn-step-action[b-ikn8mc1h4c] {
    background-color: transparent;
    border: 1px solid #ccc;
    padding: 6px 12px;
    font-size: 0.85rem;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.2s, color 0.2s, border-color 0.2s;
    flex-grow: 1;
    margin: 0 3px;
}

/* Botón Configurar */
.btn-step-action[b-ikn8mc1h4c] {
    color: #333;
    border-color: #ccc;
}
 
    .btn-step-action:hover[b-ikn8mc1h4c] {
        background-color: #e9ecef;
        border-color: #adadad;
    }

    /* Botón Eliminar */
    .btn-step-action.btn-delete[b-ikn8mc1h4c] {
        border-color: #dc3545;
        color: #dc3545;
    }

        .btn-step-action.btn-delete:hover[b-ikn8mc1h4c] {
            background-color: #dc3545;
            color: white;
        }
/* _content/CRMFoliatti/Components/Pages/JourneyBuilder/JourneyBuilderPage.razor.rz.scp.css */
/* Estilos para la página del Journey Builder */
.builder-page-container[b-f5khrgx76w] {
    display: flex;
    height: calc(100vh - 90px);
    background-color: #f9f9f9;
}

.builder-palette[b-f5khrgx76w] {
    width: 250px; 
    background-color: white;
    border-right: 1px solid #ddd;
    padding: 20px;
    flex-shrink: 0;
}

    .builder-palette h4[b-f5khrgx76w] {
        margin-top: 0;
        border-bottom: 1px solid #eee;
        padding-bottom: 10px;
    }

.palette-item[b-f5khrgx76w] {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 10px;
    border: 1px dashed #ccc;
    border-radius: 4px;
    margin-bottom: 10px;
    cursor: pointer;
    transition: background-color 0.2s;
}

    .palette-item:hover[b-f5khrgx76w] {
        background-color: #f0f8ff;
        border-color: #007bff;
    }

    .palette-item .step-icon[b-f5khrgx76w] {
        font-size: 1.5rem;
    }

.builder-canvas[b-f5khrgx76w] {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.canvas-header[b-f5khrgx76w] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 20px;
    background-color: white;
    border-bottom: 1px solid #ddd;
    flex-shrink: 0;
}

    .canvas-header h3[b-f5khrgx76w] {
        margin: 0;
    }

.canvas-flow[b-f5khrgx76w] {
    padding: 40px;
    flex-grow: 1;
    overflow-y: auto;
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.start-node[b-f5khrgx76w] {
    background-color: #28a745;
    color: white;
    padding: 10px 20px;
    border-radius: 20px;
    font-weight: bold;
    display: inline-block;
    flex-shrink: 0;
}

.empty-canvas-message[b-f5khrgx76w] {
    margin-top: 20px;
    color: #777;
    font-style: italic;
}

.btn[b-f5khrgx76w] {
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
}

.btn-primary[b-f5khrgx76w] {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
}

.feedback-message[b-f5khrgx76w] {
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #28a745;
    color: white;
    padding: 10px 20px;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
    z-index: 1100;
    animation: fadeInOut-b-f5khrgx76w 4s ease-in-out;
}

@keyframes fadeInOut-b-f5khrgx76w {
    0% {
        opacity: 0;
    }

    10% {
        opacity: 1;
    }

    90% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}
/* _content/CRMFoliatti/Components/Pages/JourneyBuilder/JourneyStepView.razor.rz.scp.css */
/* Components/JourneyStepView.razor.css */

/* Estilos generales para el contenedor de un paso normal */
.journey-step-wrapper[b-t8ceeoyfmk] {
    display: flex;
    align-items: center;
    position: relative;
    padding: 0 20px; /* Espacio para el conector */
    flex-shrink: 0; /* Evita que el wrapper se encoja */
}

/* Conector de entrada para pasos normales */
.journey-connector[b-t8ceeoyfmk] {
    width: 40px; /* Longitud del conector */
    height: 2px;
    background-color: #ccc;
    flex-shrink: 0;
    position: relative;
}

    .journey-connector[b-t8ceeoyfmk]::after {
        content: '';
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%) rotate(45deg);
        width: 8px;
        height: 8px;
        border-right: 2px solid #ccc;
        border-bottom: 2px solid #ccc;
    }


/* Estilos para el paso individual (la "caja") */
.journey-step[b-t8ceeoyfmk] {
    border: 1px solid #d1d3e2;
    border-radius: 8px;
    background-color: white;
    padding: 15px 20px; /* Padding interno de la caja */
    text-align: center;
    min-width: 180px; /* Ancho mínimo para los pasos */
    box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,.075) !important;
    position: relative;
    z-index: 1; /* Para que estén por encima de las líneas de conexión */
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 120px; /* Altura mínima para que no se vean demasiado pequeños */
    font-family: Arial, sans-serif; /* Fuente legible */
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

    .journey-step:hover[b-t8ceeoyfmk] {
        transform: translateY(-3px);
        box-shadow: 0 0.25rem 0.5rem rgba(0,0,0,.1) !important;
    }

    .journey-step .step-icon[b-t8ceeoyfmk] {
        font-size: 2rem; /* Tamaño del icono */
        margin-bottom: 10px;
        color: #4e73df; /* Color por defecto si no hay tipo específico */
    }

    /* Colores de iconos y bordes según el tipo de paso */
    .journey-step.message .step-icon[b-t8ceeoyfmk] {
        color: #007bff;
    }
    /* Azul para mensaje */
    .journey-step.message[b-t8ceeoyfmk] {
        border-left: 5px solid #007bff;
    }

    .journey-step.wait .step-icon[b-t8ceeoyfmk] {
        color: #ffc107;
    }
    /* Amarillo para espera */
    .journey-step.wait[b-t8ceeoyfmk] {
        border-left: 5px solid #ffc107;
    }

    .journey-step.decision .step-icon[b-t8ceeoyfmk] {
        color: #dc3545;
    }
    /* Rojo para decisión */
    .journey-step.decision[b-t8ceeoyfmk] {
        border-left: 5px solid #dc3545;
    }


    .journey-step .step-title[b-t8ceeoyfmk] {
        font-size: 1.1rem;
        margin-bottom: 5px;
        color: #333;
        font-weight: bold;
    }

    .journey-step .step-subtitle[b-t8ceeoyfmk] {
        font-size: 0.85rem;
        color: #666;
        margin-bottom: 8px;
    }

    .journey-step .step-stats[b-t8ceeoyfmk] {
        font-size: 0.9rem;
        font-weight: bold;
        color: #5a5c69; /* Gris oscuro para estadísticas */
        margin-top: 5px;
    }


/* --- Estilos específicos para el nodo de decisión y sus ramas --- */
.journey-split[b-t8ceeoyfmk] {
    display: flex;
    align-items: flex-start; /* Alinea los elementos de la bifurcación arriba */
    position: relative;
    padding: 0 20px; /* Espacio para el conector de entrada */
    flex-shrink: 0;
}

.split-entry-connector[b-t8ceeoyfmk] {
    width: 40px; /* Longitud del conector */
    height: 2px;
    background-color: #ccc;
    flex-shrink: 0;
    position: relative;
    margin-top: 60px; /* Alinea con el centro del nodo de decisión */
}

    .split-entry-connector[b-t8ceeoyfmk]::after {
        content: '';
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%) rotate(45deg);
        width: 8px;
        height: 8px;
        border-right: 2px solid #ccc;
        border-bottom: 2px solid #ccc;
    }

.split-node-wrapper[b-t8ceeoyfmk] {
    flex-shrink: 0;
    margin-right: 20px; /* Espacio entre el nodo de decisión y las ramas */
}

.split-branches[b-t8ceeoyfmk] {
    display: flex;
    flex-direction: column; /* Las ramas se apilan verticalmente */
    flex-grow: 1;
    position: relative;
    padding-left: 20px; /* Espacio para las líneas de conexión horizontales de las ramas */
}

.branch-line[b-t8ceeoyfmk] {
    display: flex;
    align-items: flex-start; /* Alinea los elementos de la rama arriba */
    position: relative;
    padding-bottom: 20px; /* Espacio entre ramas */
}

    .branch-line:last-child[b-t8ceeoyfmk] {
        padding-bottom: 0; /* No padding en la última rama */
    }

    .branch-line[b-t8ceeoyfmk]::before { /* Línea horizontal que sale del nodo de decisión */
        content: '';
        position: absolute;
        left: 0;
        width: 20px; /* Longitud de la línea horizontal */
        height: 2px;
        background-color: #ccc;
        top: 30px; /* Ajusta para que salga del centro del nodo de decisión */
    }

    .branch-line.top-branch[b-t8ceeoyfmk]::before {
        top: 30px; /* Ajuste para la rama superior */
    }

    .branch-line.bottom-branch[b-t8ceeoyfmk]::before {
        top: calc(100% - 30px); /* Ajuste para la rama inferior, si es necesario */
    }


    .branch-line[b-t8ceeoyfmk]::after { /* Línea vertical que conecta las ramas al flujo principal */
        content: '';
        position: absolute;
        left: 19px; /* Alinea con el final de la línea horizontal */
        width: 2px;
        background-color: #ccc;
        z-index: 0;
    }

    .branch-line.top-branch[b-t8ceeoyfmk]::after {
        top: 30px;
        height: calc(100% - 30px);
    }

    .branch-line.bottom-branch[b-t8ceeoyfmk]::after {
        bottom: 30px;
        height: calc(100% - 30px);
    }


.branch-label[b-t8ceeoyfmk] {
    background-color: #f3f3f3; /* Fondo para el texto "Sí/No" */
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: bold;
    color: #555;
    position: absolute;
    left: 25px; /* Posiciona el label sobre la línea horizontal */
    top: 15px; /* Ajusta verticalmente */
    z-index: 2; /* Para que esté sobre la línea */
}

.branch-flow[b-t8ceeoyfmk] {
    display: inline-flex; /* Permite que los pasos dentro de la rama fluyan horizontalmente */
    align-items: flex-start;
    flex-grow: 1;
    min-height: 100px; /* Altura mínima para el flujo de la rama */
    position: relative;
    padding-left: 20px; /* Espacio para la conexión vertical */
}

    /* Conector de entrada para los pasos dentro de las ramas */
    .branch-flow .journey-step-wrapper .journey-connector[b-t8ceeoyfmk] {
        width: 20px; /* Conector más corto para pasos en ramas */
    }
/* _content/CRMFoliatti/Components/Pages/JourneyBuilder/JourneyViewer.razor.rz.scp.css */
/* Components/Pages/Promociones/JourneyViewer.razor.css */

/* Contenedor principal de la página del Journey Viewer */
.journey-builder-page[b-cbfpoohs04] { /* Mantengo tu nombre de clase, aunque sea un viewer */
    background-color: #f3f3f3; /* Color de fondo del área de trabajo */
    height: calc(100vh - 90px); /* Ocupa el alto disponible menos la cabecera fija del layout */
    display: flex;
    flex-direction: column; /* Organiza los elementos verticalmente (header y canvas) */
    overflow: hidden; /* Evita barras de desplazamiento no deseadas en el contenedor principal */
}

/* Cabecera de la página del Journey */
.journey-header[b-cbfpoohs04] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 25px; /* Más padding para que coincida con otros headers */
    background-color: white;
    border-bottom: 1px solid #ddd;
    box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,.075) !important; /* Sombra sutil como en otras tarjetas */
    flex-shrink: 0; /* Evita que la cabecera se encoja */
}

    .journey-header h3[b-cbfpoohs04] {
        margin: 0;
        font-size: 1.5rem; /* Ajuste para que sea consistente con los h3 de otras páginas */
        color: #333; /* Color de texto más oscuro */
        display: flex;
        align-items: center;
        gap: 12px; /* Espacio entre el icono y el texto del título */
    }

.header-icon[b-cbfpoohs04] {
    font-size: 1.8rem; /* Tamaño un poco más grande para el icono */
    color: #007bff; /* Color azul primario */
}

.header-actions[b-cbfpoohs04] {
    display: flex;
    gap: 10px; /* Espacio entre los botones de acción */
}

/* El "lienzo" donde se dibuja el journey, que permite el scroll */
.journey-canvas[b-cbfpoohs04] {
    flex-grow: 1; /* Ocupa todo el espacio vertical restante */
    padding: 60px 40px; /* Más padding para que el contenido no se pegue a los bordes del canvas */
    overflow: auto; /* Permite scroll horizontal y vertical si el journey es muy grande */
    background-image: linear-gradient(90deg, #e0e0e0 1px, transparent 1px), linear-gradient(#e0e0e0 1px, transparent 1px);
    background-size: 20px 20px; /* Cuadrícula de fondo ligera */
    background-position: -1px -1px; /* Ajuste para que la cuadrícula se vea bien */
}

.journey-flow[b-cbfpoohs04] {
    display: inline-flex; /* Permite que el contenedor de los pasos crezca horizontalmente */
    align-items: flex-start; /* Alinea los elementos en la parte superior del flujo */
    min-height: 100%; /* Asegura que el flujo ocupe al menos la altura del canvas */
    padding-bottom: 50px; /* Espacio extra al final del flujo para ver bien los últimos pasos */
    position: relative; /* Necesario para posicionar conectores si se implementan aquí */
}

/* Estilos para los botones (reutilizables y consistentes con otras páginas) */
.btn[b-cbfpoohs04] {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    text-align: center;
    text-decoration: none;
}

.btn-primary[b-cbfpoohs04] {
    background-color: #007bff;
    border-color: #007bff;
    color: white; 
}

.btn-secondary[b-cbfpoohs04] {
    background-color: #f8f9fa;
    border-color: #ddd;
    color: #333;
}

.btn-success[b-cbfpoohs04] {
    background-color: #28a745;
    border-color: #28a745;
    color: white;
}

    .btn-primary:hover[b-cbfpoohs04], .btn-success:hover[b-cbfpoohs04] {
        filter: brightness(90%);
    }

.btn-secondary:hover[b-cbfpoohs04] {
    background-color: #e2e6ea;
    border-color: #dae0e5;
    color: #212529;
}
/* _content/CRMFoliatti/Components/Pages/JourneyBuilder/StepConfigModal.razor.rz.scp.css */
/* Estilos para el modal de configuración */
.modal-backdrop[b-0y2zny3ytg] {
    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: 1050;
}

.modal-container[b-0y2zny3ytg] {
    background-color: white;
    border-radius: 8px;
    width: 550px;
    max-width: 90%;
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}

.modal-header[b-0y2zny3ytg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    border-bottom: 1px solid #dee2e6;
}

.modal-header-content[b-0y2zny3ytg] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.modal-icon[b-0y2zny3ytg] {
    font-size: 1.2rem;
}

.modal-header h3[b-0y2zny3ytg] {
    margin: 0;
    font-size: 1.1rem;
}

.btn-close[b-0y2zny3ytg] {
    border: none;
    background: none;
    font-size: 1.5rem;
    cursor: pointer;
}

.modal-body[b-0y2zny3ytg] {
    padding: 1.5rem;
}

.form-field label[b-0y2zny3ytg] {
    display: block;
    margin-bottom: 5px;
    font-weight: 500;
}

.form-field input[b-0y2zny3ytg], .form-field textarea[b-0y2zny3ytg] {
    width: 100%;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}
 
.modal-footer[b-0y2zny3ytg] {
    display: flex;
    justify-content: flex-end;
    padding: 1rem;
    border-top: 1px solid #dee2e6;
    gap: 10px;
}

.btn-primary[b-0y2zny3ytg] {
    background-color: #007bff;
    color: white;
    border: none;
}

.btn-secondary[b-0y2zny3ytg] {
    background-color: #f8f9fa;
    border: 1px solid #ddd;
    color: #333;
}
/* _content/CRMFoliatti/Components/Pages/MensajesShared/MensajesConfiguracionModal.razor.rz.scp.css */
/* Components/Pages/MensajesShared/MensajesConfiguracionModal.razor.css */

/* Estilos para el backdrop (fondo oscuro) */
.modal-backdrop.show[b-spfo8obwo2] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* Fondo oscuro semitransparente */
    z-index: 1040; /* Z-index estándar para backdrops de modales */
}

/* Estilos para el contenedor del modal */
.modal.show[b-spfo8obwo2] {
    display: block; /* Para mostrar el modal */
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1050; /* Z-index estándar para modales, por encima del backdrop */
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto; /* Permite scroll si el contenido del modal es muy largo */
    outline: 0;
}

/* Estilos para el diálogo del modal (la caja central) */
.modal-dialog[b-spfo8obwo2] {
    position: relative;
    width: auto;
    margin: 1.75rem auto; /* Centra verticalmente y añade margen */
    pointer-events: none; /* Permite clics a través del diálogo si no hay backdrop */
}

    /* Ajuste para el tamaño del modal (modal-xl en este caso) */
    .modal-dialog.modal-xl[b-spfo8obwo2] {
        max-width: 1200px; /* Ancho muy grande para mostrar la tabla y el formulario */
    }

.modal-dialog-centered[b-spfo8obwo2] {
    display: flex;
    align-items: center; /* Centra el modal verticalmente */
    min-height: calc(100% - 3.5rem);
}

/* Estilos del contenido del modal (la tarjeta blanca) */
.modal-content[b-spfo8obwo2] {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 0.3rem;
    outline: 0;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); /* Sombra estándar */
}

/* Encabezado del modal */
.modal-header[b-spfo8obwo2] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 1rem 1rem;
    border-bottom: 1px solid #e9ecef;
    border-top-left-radius: calc(0.3rem - 1px);
    border-top-right-radius: calc(0.3rem - 1px);
}

.modal-title[b-spfo8obwo2] {
    margin-bottom: 0;
    line-height: 1.5;
    font-size: 1.25rem;
    color: #333;
}

.btn-close[b-spfo8obwo2] {
    padding: 0.5rem;
    margin: -0.5rem -0.5rem -0.5rem auto;
    background-color: transparent;
    border: 0;
    border-radius: 0.25rem;
    opacity: 0.5;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    cursor: pointer;
}

    .btn-close:hover[b-spfo8obwo2] {
        opacity: 0.75;
    }

/* Cuerpo del modal */
.modal-body[b-spfo8obwo2] {
    position: relative;
    flex: 1 1 auto;
    padding: 1rem; /* Padding interno */
}

/* Pie de página del modal */
.modal-footer[b-spfo8obwo2] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    padding: 0.75rem;
    border-top: 1px solid #e9ecef;
    border-bottom-right-radius: calc(0.3rem - 1px);
    border-bottom-left-radius: calc(0.3rem - 1px);
}


/* --- Estilos generales para tablas y formularios dentro del modal (reutilizados) --- */
.table[b-spfo8obwo2] { /* Estilo base de tabla */
    width: 100%;
    margin-bottom: 1rem;
    color: #212529;
    border-collapse: collapse;
}

.table-striped tbody tr:nth-of-type(odd)[b-spfo8obwo2] { /* Filas impares con fondo */
    background-color: rgba(0,0,0,.05);
}

.table-hover tbody tr:hover[b-spfo8obwo2] { /* Efecto hover en filas */
    color: #212529;
    background-color: rgba(0,0,0,.075);
}

.table-dark[b-spfo8obwo2] { /* Encabezado de tabla oscuro */
    color: #fff;
    background-color: #343a40;
    border-color: #454d55;
}

    .table-dark th[b-spfo8obwo2] {
        color: #fff;
        background-color: #343a40;
        border-color: #454d55;
    }

/* Estilos de botones (reutilizados) */
.btn[b-spfo8obwo2] {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    text-align: center;
    text-decoration: none;
    line-height: 1.5;
}

.btn-primary[b-spfo8obwo2] {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
}

.btn-secondary[b-spfo8obwo2] {
    background-color: #6c757d;
    border-color: #6c757d;
    color: white;
}

.btn-success[b-spfo8obwo2] {
    background-color: #28a745;
    border-color: #28a745;
    color: white;
}

.btn-warning[b-spfo8obwo2] {
    background-color: #ffc107;
    border-color: #ffc107;
    color: #212529;
}

.btn-danger[b-spfo8obwo2] {
    background-color: #dc3545;
    border-color: #dc3545;
    color: white;
}

/* Estilos de formulario (reutilizados) */
.form-label[b-spfo8obwo2] {
    font-size: 0.85rem;
    color: #555;
    font-weight: 500;
    margin-bottom: 0.5rem;
}

.form-control[b-spfo8obwo2] {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 0.9rem;
    font-weight: 400;
    line-height: 1.5;
    color: #6e707e;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #d1d3e2;
    border-radius: 0.35rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

    .form-control:focus[b-spfo8obwo2] {
        border-color: #a7c2ff;
        outline: 0;
        box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
    }

.form-grid-2-cols[b-spfo8obwo2] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px 20px;
}

.form-field[b-spfo8obwo2] {
    display: flex;
    flex-direction: column;
}

/* Estilos para el switch (si se usa) */
.form-check.form-switch .form-check-input[b-spfo8obwo2] {
    width: 2.25em;
    height: 1.25em;
    margin-left: -1.5em;
    cursor: pointer;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280,0,0,.25%29'/%3e%3c/svg%3e");
    background-position: left center;
    background-repeat: no-repeat;
    background-size: contain;
    border: 1px solid rgba(0,0,0,.25);
    border-radius: 0.5rem;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    color-adjust: exact;
    transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

    .form-check.form-switch .form-check-input:checked[b-spfo8obwo2] {
        background-color: #28a745;
        border-color: #28a745;
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
        background-position: right center;
    }

.form-check.form-switch .form-check-label[b-spfo8obwo2] {
    margin-left: 0.5rem;
    font-size: 0.9rem;
    color: #555;
}

/* Texto de ayuda en el formulario */
.form-text-muted[b-spfo8obwo2] {
    font-size: 0.75rem;
    color: #888;
    margin-top: 5px;
}

/* Estilos para el badge (si se usa) */
.badge[b-spfo8obwo2] {
    display: inline-block;
    padding: 0.35em 0.65em;
    font-size: 0.75em;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.25rem;
}

.bg-primary[b-spfo8obwo2] {
    background-color: #007bff !important;
}

.bg-secondary[b-spfo8obwo2] {
    background-color: #6c757d !important;
}

.bg-info[b-spfo8obwo2] {
    background-color: #17a2b8 !important;
}
/* _content/CRMFoliatti/Components/Pages/MiembrosPromocion.razor.rz.scp.css */
/* Pages/Promociones/MiembrosPromocion.razor.css */

.promotion-members-container[b-6q2vr3hbvn] {
    padding: 20px;
    background-color: #f3f3f3;
    min-height: calc(100vh - 90px);
}

/* Reutilizando estilos de page-header y botones */
.page-header[b-6q2vr3hbvn] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #ddd;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

    .page-header h3[b-6q2vr3hbvn] {
        font-size: 1.5rem;
        color: #333;
        margin: 0;
    }

.btn-secondary[b-6q2vr3hbvn] {
    background-color: #f8f9fa;
    border-color: #ddd;
    color: #333;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
}

/* Reutilizando estilos de card y table */
.card[b-6q2vr3hbvn] {
    border: 1px solid #e3e6f0;
    border-radius: 0.35rem;
    background-color: #fff;
    box-shadow: 0 0.15rem 1.75rem 0 rgba(58,59,69,.15) !important;
}

.card-header[b-6q2vr3hbvn] {
    padding: 0.75rem 1.25rem;
    margin-bottom: 0;
    background-color: #f8f9fc;
    border-bottom: 1px solid #e3e6f0;
    border-top-left-radius: calc(0.35rem - 1px);
    border-top-right-radius: calc(0.35rem - 1px);
}

    .card-header h6[b-6q2vr3hbvn] {
        margin: 0;
        font-size: 1rem;
        color: #4e73df;
    }

.card-body[b-6q2vr3hbvn] {
    padding: 1.25rem;
}

.data-table-scroll-container[b-6q2vr3hbvn] {
    overflow-x: auto;
}

.data-table[b-6q2vr3hbvn] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
    color: #555;
}

    .data-table thead[b-6q2vr3hbvn] {
        background-color: #f8f9fc;
    }

    .data-table th[b-6q2vr3hbvn], .data-table td[b-6q2vr3hbvn] {
        padding: 12px 15px;
        border-bottom: 1px solid #eee;
        text-align: left;
    }

    .data-table th[b-6q2vr3hbvn] {
        font-weight: bold;
        color: #444;
        text-transform: uppercase;
        font-size: 0.8rem;
        white-space: nowrap;
    }

    .data-table tbody tr:hover[b-6q2vr3hbvn] {
        background-color: #f5f5f5;
    }

/* Estilos para el badge de estado de miembros */
.status-badge[b-6q2vr3hbvn] {
    display: inline-block;
    padding: 0.3em 0.6em;
    font-size: 0.75em;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.25rem;
    color: white;
}

.status-primary[b-6q2vr3hbvn] {
    background-color: #007bff;
}
/* Azul para Redimido */
.status-secondary[b-6q2vr3hbvn] {
    background-color: #6c757d;
} 
/* Gris general */
.status-success[b-6q2vr3hbvn] {
    background-color: #28a745;
}
/* Verde para Entregado */
.status-info[b-6q2vr3hbvn] {
    background-color: #17a2b8;
}
/* Celeste para Enviado */
.status-warning[b-6q2vr3hbvn] {
    background-color: #ffc107;
}
/* Amarillo para Pendiente */
.status-danger[b-6q2vr3hbvn] {
    background-color: #dc3545;
}
/* Rojo para Fallido */
/* _content/CRMFoliatti/Components/Pages/Notifications.razor.rz.scp.css */
/* Pages/Notifications.razor.css */

.notifications-page-container[b-9fh4ya48hd] {
    padding: 20px;
    background-color: #f3f3f3; /* Fondo general de las páginas */
    min-height: calc(100vh - 90px); /* Altura mínima */
}

/* Reutilizando estilos de page-header y botones de otras páginas */
.page-header[b-9fh4ya48hd] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #ddd;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

    .page-header h3[b-9fh4ya48hd] {
        font-size: 1.5rem;
        color: #333;
        margin: 0;
    }

.btn-primary[b-9fh4ya48hd] {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    text-align: center;
    text-decoration: none;
}

/* Reutilizando estilos de card de otras páginas */
.card[b-9fh4ya48hd] {
    border: 1px solid #e3e6f0;
    border-radius: 0.35rem;
    background-color: #fff;
    box-shadow: 0 0.15rem 1.75rem 0 rgba(58,59,69,.15) !important;
}

.card-header h6[b-9fh4ya48hd] {
    margin: 0;
    font-size: 1rem;
    color: #4e73df;
}

.card-body[b-9fh4ya48hd] {
    padding: 1.25rem;
}


/* --- Estilos específicos para la lista completa de notificaciones --- */
.full-notification-list[b-9fh4ya48hd] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.full-notification-item[b-9fh4ya48hd] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 0;
    border-bottom: 1px solid #eee;
}

    .full-notification-item:last-child[b-9fh4ya48hd] {
        border-bottom: none;
    }

.notification-content[b-9fh4ya48hd] {
    display: flex;
    align-items: center;
    flex-grow: 1;
    margin-right: 15px;
}

.notification-icon[b-9fh4ya48hd] {
    font-size: 1.2rem;
    color: #007bff; /* Icono azul para no leídas */
    margin-right: 15px;
    flex-shrink: 0;
}

.full-notification-item.read .notification-icon[b-9fh4ya48hd] {
    color: #6c757d; /* Icono gris para leídas */
}

.notification-message[b-9fh4ya48hd] {
    font-size: 0.95rem;
    color: #333;
    font-weight: 500;
}

.full-notification-item.read .notification-message[b-9fh4ya48hd] {
    color: #888;
    font-weight: normal;
}

.notification-meta[b-9fh4ya48hd] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    flex-shrink: 0;
}

.notification-time[b-9fh4ya48hd] {
    font-size: 0.8rem;
    color: #999;
    white-space: nowrap; /* Evita que la hora se rompa */
}

.notification-status[b-9fh4ya48hd] {
    font-size: 0.75rem;
    padding: 3px 6px;
    border-radius: 4px; 
    margin-top: 5px;
    color: white;
    background-color: #28a745; /* Verde para 'No leída' */
}

.full-notification-item.read .notification-status[b-9fh4ya48hd] {
    background-color: #6c757d; /* Gris para 'Leída' */
}

.no-notifications[b-9fh4ya48hd] {
    padding: 20px;
    text-align: center;
    font-size: 0.9rem;
    color: #888;
}
/* _content/CRMFoliatti/Components/Pages/ProcesoFormulario.razor.rz.scp.css */
/* Components/Pages/ProcesoFormulario.razor.css */

.form-container[b-gz8xup3ga6] {
    background-color: white;
    padding: 20px;
    border: 1px solid #ddd;
    border-radius: 4px;
    max-width: 800px;
    margin: 0 auto; 
}

.page-header[b-gz8xup3ga6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #ddd;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

h1[b-gz8xup3ga6] { /* Cambiado a h3 para coincidir con nuestro HTML */
    font-size: 1.5rem;
    color: #333;
    margin: 0;
}

.form-grid[b-gz8xup3ga6] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.form-field[b-gz8xup3ga6] {
    display: flex;
    flex-direction: column;
}

    .form-field label[b-gz8xup3ga6] {
        margin-bottom: 5px;
        font-size: 0.85rem;
        color: #555;
        font-weight: 500;
    }

    .form-field input[type="text"][b-gz8xup3ga6],
    .form-field input[type="email"][b-gz8xup3ga6],
    .form-field select[b-gz8xup3ga6],
    .form-field textarea[b-gz8xup3ga6] {
        width: 100%;
        padding: 8px;
        border: 1px solid #ccc;
        border-radius: 4px;
        box-sizing: border-box;
        font-family: inherit;
        font-size: 0.9rem;
    }

    .form-field input[type="checkbox"][b-gz8xup3ga6] {
        width: auto;
        align-self: flex-start;
        margin-top: 8px;
    }

.form-actions[b-gz8xup3ga6] {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #eee;
    text-align: right;
}

    .form-actions .btn[b-gz8xup3ga6] {
        margin-left: 10px;
    }

.btn[b-gz8xup3ga6] {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    text-align: center;
}

.btn-primary[b-gz8xup3ga6] {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
}

.btn-secondary[b-gz8xup3ga6] {
    background-color: #f8f9fa;
    border-color: #ddd;
    color: #333;
}
/* _content/CRMFoliatti/Components/Pages/Profiles.razor.rz.scp.css */
/* Estilos para la página de Administración (Perfiles y Usuarios) */

/* Contenedor principal de la página, define las 2 columnas */ 
.settings-page-container[b-gchydxln5q] {
    display: flex;
    gap: 20px; /* Espacio entre el menú y el contenido */
}

/* Menú lateral secundario (el que está roto) */
.settings-sidebar[b-gchydxln5q] {
    width: 250px;
    flex-shrink: 0; /* Evita que el menú se encoja */
    font-size: 0.9rem;
}

/* Título "ADMINISTRACIÓN" */
.settings-title[b-gchydxln5q] {
    font-weight: bold;
    color: #555;
    margin-bottom: 15px;
    text-transform: uppercase;
    font-size: 0.8rem;
}

/* Contenedor de cada grupo del menú (ej. "Usuarios") */
.menu-section[b-gchydxln5q] {
    margin-bottom: 1rem;
}

/* Cabecera de cada grupo desplegable */
.menu-group-header[b-gchydxln5q] {
    font-weight: bold;
    cursor: pointer;
    padding: 8px 0;
    display: flex;
    align-items: center;
}

    /* La flechita ">" */
    .menu-group-header .toggler[b-gchydxln5q] {
        display: inline-block;
        margin-right: 8px;
        transition: transform 0.2s ease-in-out;
        font-weight: bold;
    }

        .menu-group-header .toggler.expanded[b-gchydxln5q] {
            transform: rotate(90deg);
        }

/* La lista de enlaces (Usuarios, Perfiles) */
.menu-items[b-gchydxln5q] {
    list-style: none;
    padding-left: 20px;
    margin: 5px 0;
}

    .menu-items li[b-gchydxln5q] {
        padding: 8px 10px;
        border-radius: 4px;
        cursor: pointer;
        color: #333;
    }

        .menu-items li:hover[b-gchydxln5q] {
            background-color: #e9ecef;
        }

        /* El elemento activo del menú */
        .menu-items li.active[b-gchydxln5q] {
            background-color: #e0e0e0;
            font-weight: bold;
        }

/* El contenedor del contenido principal a la derecha */
.settings-content[b-gchydxln5q] {
    flex-grow: 1; /* Ocupa el resto del espacio */
}
/* _content/CRMFoliatti/Components/Pages/PromocionesEwise.razor.rz.scp.css */
/* Pages/Promociones/PromocionesEwise.razor.css */

.promotions-list-container[b-0k2lp3hh3r] {
    padding: 20px;
    background-color: #f3f3f3;
    min-height: calc(100vh - 90px);
}

/* Reutilizando estilos de page-header y botones de otras páginas */
.page-header[b-0k2lp3hh3r] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #ddd;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

    .page-header h3[b-0k2lp3hh3r] {
        font-size: 1.5rem;
        color: #333;
        margin: 0;
    }

.btn[b-0k2lp3hh3r] {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    text-align: center;
    text-decoration: none;
    line-height: 1.5;
}

.btn-primary[b-0k2lp3hh3r] {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
}

.btn-info[b-0k2lp3hh3r] {
    background-color: #17a2b8;
    border-color: #17a2b8;
    color: white;
}

/* Reutilizando estilos de card de otras páginas */
.card[b-0k2lp3hh3r] {
    border: 1px solid #e3e6f0;
    border-radius: 0.35rem;
    background-color: #fff;
    box-shadow: 0 0.15rem 1.75rem 0 rgba(58,59,69,.15) !important;
}

.card-header[b-0k2lp3hh3r] {
    padding: 0.75rem 1.25rem;
    margin-bottom: 0;
    background-color: #f8f9fc;
    border-bottom: 1px solid #e3e6f0;
    border-top-left-radius: calc(0.35rem - 1px);
    border-top-right-radius: calc(0.35rem - 1px);
}

    .card-header h6[b-0k2lp3hh3r] {
        margin: 0;
        font-size: 1rem;
        color: #4e73df;
    }

.card-body[b-0k2lp3hh3r] {
    padding: 1.25rem;
}

/* Estilos de tabla - Reutilizados */
.data-table-scroll-container[b-0k2lp3hh3r] {
    overflow-x: auto; /* Para tablas anchas */
}

.data-table[b-0k2lp3hh3r] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
    color: #555;
}

    .data-table thead[b-0k2lp3hh3r] {
        background-color: #f8f9fc;
    }

    .data-table th[b-0k2lp3hh3r], .data-table td[b-0k2lp3hh3r] {
        padding: 12px 15px;
        border-bottom: 1px solid #eee;
        text-align: left;
    }

    .data-table th[b-0k2lp3hh3r] {
        font-weight: bold;
        color: #444;
        text-transform: uppercase;
        font-size: 0.8rem;
        white-space: nowrap;
    }

    .data-table tbody tr:hover[b-0k2lp3hh3r] {
        background-color: #f5f5f5;
    }

    .data-table tbody tr.clickable-row[b-0k2lp3hh3r] {
        cursor: pointer;
    }

        .data-table tbody tr.clickable-row:hover[b-0k2lp3hh3r] {
            background-color: #e9ecef;
        }

    .data-table tbody tr.table-row-selected[b-0k2lp3hh3r] {
        background-color: #e0f2ff;
        font-weight: bold;
    }

/* Estilos para el badge de estado */
.status-badge[b-0k2lp3hh3r] {
    display: inline-block;
    padding: 0.3em 0.6em;
    font-size: 0.75em;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.25rem;
    color: white;
}

.status-activa[b-0k2lp3hh3r] {
    background-color: #28a745; /* Verde */
}

.status-inactiva[b-0k2lp3hh3r] {
    background-color: #6c757d; /* Gris */
}

/* Estilo para centrar el texto en una celda de tabla */
.data-table .text-center[b-0k2lp3hh3r] {
    text-align: center;
}

/* --- ESTILOS PARA EL JOURNEY INCRUSTADO (MOVIDO Y RENOMBRADO A E-WISE) --- */
.journey-card[b-0k2lp3hh3r] { /* La tarjeta que contendrá el journey */
    height: 100%; /* Ocupa la altura completa de la columna */
    display: flex;
    flex-direction: column;
}

    .journey-card .card-body[b-0k2lp3hh3r] {
        flex-grow: 1; /* Permite que el cuerpo del card crezca */
        display: flex; /* Contenedor flex para el canvas */
        flex-direction: column;
        padding: 0; /* El padding lo manejará el canvas inline */
    }

.journey-canvas-inline[b-0k2lp3hh3r] {
    flex-grow: 1;
    padding: 20px; /* Padding interno */
    overflow-x: auto; /* Scroll horizontal si el journey es largo */
    overflow-y: auto; /* Scroll vertical si el journey es alto */
    background-image: linear-gradient(90deg, #f0f0f0 1px, transparent 1px), linear-gradient(#f0f0f0 1px, transparent 1px);
    background-size: 20px 20px; /* Cuadrícula de fondo */
    background-position: -1px -1px;
}

.journey-flow-inline[b-0k2lp3hh3r] {
    display: inline-flex; /* Permite que los pasos fluyan horizontalmente */ 
    align-items: flex-start;
    min-height: 100%; /* Para que el fondo cuadriculado se extienda */
    padding-bottom: 20px; /* Espacio al final del flujo */
}

.start-node[b-0k2lp3hh3r] {
    background-color: #4e73df; /* Azul Radzen/Bootstrap */
    color: white;
    padding: 8px 15px;
    border-radius: 20px;
    font-weight: bold;
    display: inline-block;
    flex-shrink: 0; /* Evita que se encoja */
    margin: 15px; /* Margen alrededor del nodo de inicio */
    white-space: nowrap;
}
/* _content/CRMFoliatti/Components/Pages/PromocionesManuales.razor.rz.scp.css */
/* Pages/Promociones/PromocionesManuales.razor.css */

.promotions-manuales-container[b-inoansqmld] {
    padding: 20px;
    background-color: #f3f3f3;
    min-height: calc(100vh - 90px);
}

/* Reutilizando estilos de page-header y botones de otras páginas */
.page-header[b-inoansqmld] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #ddd;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

    .page-header h3[b-inoansqmld] {
        font-size: 1.5rem;
        color: #333;
        margin: 0;
    }

.btn[b-inoansqmld] {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    text-align: center;
    text-decoration: none;
    line-height: 1.5;
}

.btn-primary[b-inoansqmld] {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
}

.btn-secondary[b-inoansqmld] {
    background-color: #f8f9fa;
    border-color: #ddd;
    color: #333;
}

.btn-success[b-inoansqmld] { /* Para el botón "Nueva Promoción" */
    background-color: #28a745;
    border-color: #28a745;
    color: white;
}

.btn-warning[b-inoansqmld] { /* Para el botón de editar */
    background-color: #ffc107;
    border-color: #ffc107;
    color: #212529;
}

.btn-danger[b-inoansqmld] { /* Para el botón de eliminar */
    background-color: #dc3545;
    border-color: #dc3545;
    color: white;
}

.btn-info[b-inoansqmld] { /* Para el botón de ver miembros */
    background-color: #17a2b8;
    border-color: #17a2b8;
    color: white;
}

.btn-link[b-inoansqmld] {
    color: #007bff;
    text-decoration: none;
}

    .btn-link:hover[b-inoansqmld] {
        text-decoration: underline;
    }

/* Reutilizando estilos de card de otras páginas */
.card[b-inoansqmld] {
    border: 1px solid #e3e6f0;
    border-radius: 0.35rem;
    background-color: #fff;
    box-shadow: 0 0.15rem 1.75rem 0 rgba(58,59,69,.15) !important;
}

.card-header[b-inoansqmld] {
    padding: 0.75rem 1.25rem;
    margin-bottom: 0;
    background-color: #f8f9fc;
    border-bottom: 1px solid #e3e6f0;
    border-top-left-radius: calc(0.35rem - 1px);
    border-top-right-radius: calc(0.35rem - 1px);
}

    .card-header h6[b-inoansqmld] {
        margin: 0;
        font-size: 1rem;
        color: #4e73df;
    }

.card-body[b-inoansqmld] {
    padding: 1.25rem;
}

/* Estilos de formulario (para crear/editar promoción manual) */
.form-label[b-inoansqmld] {
    font-size: 0.85rem;
    color: #555;
    font-weight: 500;
    margin-bottom: 0.5rem;
}

.form-control[b-inoansqmld] {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 0.9rem;
    font-weight: 400;
    line-height: 1.5;
    color: #6e707e;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #d1d3e2;
    border-radius: 0.35rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

    .form-control:focus[b-inoansqmld] {
        border-color: #a7c2ff;
        outline: 0;
        box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
    }

.form-grid-2-cols[b-inoansqmld] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px 20px;
}

.form-field[b-inoansqmld] {
    display: flex;
    flex-direction: column;
}

.form-section-title[b-inoansqmld] { /* Títulos de sección dentro del formulario */
    font-size: 1rem;
    color: #4e73df;
    margin-bottom: 10px;
    padding-bottom: 5px;
    border-bottom: 1px dashed #eee;
    font-weight: bold;
    padding-top: 10px;
}

/* Estilo para el switch de Activa */
.form-check.form-switch .form-check-input[b-inoansqmld] {
    width: 2.25em;
    height: 1.25em;
    margin-left: -1.5em;
    cursor: pointer;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280,0,0,.25%29'/%3e%3c/svg%3e");
    background-position: left center;
    background-repeat: no-repeat;
    background-size: contain;
    border: 1px solid rgba(0,0,0,.25);
    border-radius: 0.5rem;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    color-adjust: exact;
    transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

    .form-check.form-switch .form-check-input:checked[b-inoansqmld] {
        background-color: #28a745; /* Verde para activo */
        border-color: #28a745;
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
        background-position: right center;
    }

.form-check.form-switch .form-check-label[b-inoansqmld] {
    margin-left: 0.5rem;
    font-size: 0.9rem;
    color: #555;
}


/* Estilos de tabla - Reutilizados */
.data-table-scroll-container[b-inoansqmld] {
    overflow-x: auto;
}

.data-table[b-inoansqmld] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
    color: #555;
}

    .data-table thead[b-inoansqmld] {
        background-color: #f8f9fc;
    }

    .data-table th[b-inoansqmld], .data-table td[b-inoansqmld] {
        padding: 12px 15px;
        border-bottom: 1px solid #eee;
        text-align: left;
    }

    .data-table th[b-inoansqmld] {
        font-weight: bold;
        color: #444;
        text-transform: uppercase;
        font-size: 0.8rem;
        white-space: nowrap;
    }

    .data-table tbody tr.clickable-row[b-inoansqmld] {
        cursor: pointer;
    }

        .data-table tbody tr.clickable-row:hover[b-inoansqmld] {
            background-color: #e9ecef;
        }

    .data-table tbody tr.table-row-selected[b-inoansqmld] {
        background-color: #e0f2ff;
        font-weight: bold;
    }

    .data-table .compact-table th[b-inoansqmld],
    .data-table .compact-table td[b-inoansqmld] {
        padding: 8px 12px;
    }

/* Estilos para las tarjetas de Miembros y Campañas */
.player-item[b-inoansqmld], .campaign-item[b-inoansqmld] {
    border-bottom: 1px solid #f2f2f2;
    padding-bottom: 10px;
    margin-bottom: 10px !important;
}

    .player-item:last-child[b-inoansqmld], .campaign-item:last-child[b-inoansqmld] {
        border-bottom: none;
        padding-bottom: 0;
        margin-bottom: 0 !important;
    }

.player-info a.player-link[b-inoansqmld] {
    font-weight: bold;
    color: #007bff;
    text-decoration: none;
}

    .player-info a.player-link:hover[b-inoansqmld] {
        text-decoration: underline;
    }

.player-info .text-muted.small[b-inoansqmld] {
    font-size: 0.75rem;
}

/* Mensaje de alerta para formulario vacío */
.alert-info[b-inoansqmld] {
    color: #0c5460;
    background-color: #d1ecf1;
    border-color: #bee5eb;
    padding: 1rem;
    border-radius: 0.25rem;
}

.alert-warning[b-inoansqmld] {
    color: #856404;
    background-color: #fff3cd;
    border-color: #ffeeba;
    padding: 1rem;
    border-radius: 0.25rem;
}


/* --- Estilos para el Journey incrustado (similar a PromocionesEwise.razor.css) --- */
.journey-card[b-inoansqmld] {
    height: 100%;
    display: flex;
    flex-direction: column;
}

    .journey-card .card-body[b-inoansqmld] {
        flex-grow: 1;
        display: flex;
        flex-direction: column;
        padding: 0;
    }

.journey-canvas-inline[b-inoansqmld] {
    flex-grow: 1;
    padding: 20px;
    overflow-x: auto;
    overflow-y: auto;
    background-image: linear-gradient(90deg, #f0f0f0 1px, transparent 1px), linear-gradient(#f0f0f0 1px, transparent 1px);
    background-size: 20px 20px;
    background-position: -1px -1px;
}

.journey-flow-inline[b-inoansqmld] {
    display: inline-flex;
    align-items: flex-start;
    min-height: 100%;
    padding-bottom: 20px;
}

.start-node[b-inoansqmld] {
    background-color: #4e73df;
    color: white;
    padding: 8px 15px;
    border-radius: 20px;
    font-weight: bold;
    display: inline-block;
    flex-shrink: 0;
    margin: 15px;
    white-space: nowrap;
}

/* Estilos para el badge de proceso automático en la tabla */
.badge[b-inoansqmld] { /* Estilo base para badges, si no tienes Bootstrap completo */
    display: inline-block;
    padding: 0.35em 0.65em;
    font-size: 0.75em;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.25rem;
}

.bg-primary[b-inoansqmld] {
    background-color: #007bff !important;
}

.bg-secondary[b-inoansqmld] {
    background-color: #6c757d !important;
}

.bg-success[b-inoansqmld] {
    background-color: #28a745 !important;
}

.bg-danger[b-inoansqmld] {
    background-color: #dc3545 !important;
} 

.bg-warning[b-inoansqmld] {
    background-color: #ffc107 !important;
}

.bg-info[b-inoansqmld] {
    background-color: #17a2b8 !important;
}

.bg-dark[b-inoansqmld] {
    background-color: #343a40 !important;
}
/* _content/CRMFoliatti/Components/Pages/PromocionNueva.razor.rz.scp.css */
/* Contenedor principal de la página del formulario */
.form-page-container[b-6a240gx2jn] {
    display: flex;
    gap: 20px;
}

/* Columna principal del formulario (izquierda) */
.form-main-column[b-6a240gx2jn] {
    flex: 2;
    background-color: white;
    border: 1px solid #ddd;
    border-radius: 4px;
}

/* Cabecera del formulario con título y botones */
.form-header[b-6a240gx2jn] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    border-bottom: 1px solid #ddd;
}

.form-title[b-6a240gx2jn] {
    font-size: 1.2rem;
    font-weight: 600;
}

.form-subtitle[b-6a240gx2jn] {
    font-size: 0.9rem;
    color: #6c757d;
}

.form-actions .btn[b-6a240gx2jn] {
    margin-left: 10px;
}

/* Pestañas de Detalles / Actividad */
.form-tabs[b-6a240gx2jn] {
    padding: 0 20px;
    border-bottom: 1px solid #ddd;
}

.tab[b-6a240gx2jn] {
    padding: 10px 15px;
    border: none;
    background: none;
    cursor: pointer;
    font-weight: 500;
    color: #6c757d;
    border-bottom: 3px solid transparent;
}

    .tab.active[b-6a240gx2jn] {
        color: #007bff;
        border-bottom-color: #007bff;
    }

/* Secciones del formulario */
.form-section[b-6a240gx2jn] {
    padding: 20px;
}

.section-title[b-6a240gx2jn] {
    font-size: 1rem;
    font-weight: bold;
    margin-top: 0;
    margin-bottom: 15px;
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
}

/* Cuadrícula para los campos del formulario */
.form-grid[b-6a240gx2jn] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.form-field[b-6a240gx2jn] {
    display: flex;
    flex-direction: column;
}

    .form-field.full-width[b-6a240gx2jn] {
        grid-column: 1 / -1;
    }

    .form-field label[b-6a240gx2jn] {
        margin-bottom: 5px;
        font-size: 0.85rem;
        color: #555;
    }

    /* Estilo unificado para todos los campos de entrada */
    .form-field input[type="text"][b-6a240gx2jn],
    .form-field input[type="date"][b-6a240gx2jn],
    .form-field input[type="number"][b-6a240gx2jn],
    .form-field textarea[b-6a240gx2jn],
    .form-field select[b-6a240gx2jn] {
        width: 100%;
        padding: 8px;
        border: 1px solid #ccc;
        border-radius: 4px;
        box-sizing: border-box;
        font-family: inherit;
        font-size: 0.9rem;
    }

/* Columna lateral derecha */
.form-sidebar-column[b-6a240gx2jn] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 20px; /* Espacio entre las tarjetas */
}

.sidebar-card[b-6a240gx2jn] {
    background-color: white;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.sidebar-header[b-6a240gx2jn] {
    font-weight: bold;
    padding: 10px 15px;
    border-bottom: 1px solid #ddd;
}

.sidebar-content[b-6a240gx2jn] {
    padding: 15px;
    font-size: 0.9rem;
    color: #6c757d;
}

/* Estilos para los botones (reutilizables) */
.btn[b-6a240gx2jn] {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 4px; 
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    text-align: center;
}

.btn-primary[b-6a240gx2jn] {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
}

.btn-secondary[b-6a240gx2jn] {
    background-color: #f8f9fa;
    border-color: #ddd;
    color: #333;
}
/* _content/CRMFoliatti/Components/Pages/Prospectos.razor.rz.scp.css */
/* Pages/Prospectos.razor.css */

.page-header[b-oifnbxjvbs] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #ddd;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

h1[b-oifnbxjvbs] {
    font-size: 1.5rem;
    color: #333;
}

/* Contenedor para alinear los botones a la derecha */
.header-actions[b-oifnbxjvbs] {
    display: flex;
    align-items: center;
    gap: 10px; /* Espacio entre los botones */
}

/* Estilo base para nuestros botones (se aplica a <button> y <label>) */
.btn[b-oifnbxjvbs] {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    transition: background-color 0.2s;
    text-align: center;
    vertical-align: middle;
    user-select: none;
}

/* Botón Primario (Azul) */
.btn-primary[b-oifnbxjvbs] {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
}

    .btn-primary:hover[b-oifnbxjvbs] {
        background-color: #0069d9;
    }

/* Botón Secundario (Gris) - se usa para la etiqueta de carga */
.btn-secondary[b-oifnbxjvbs] {
    background-color: #6c757d;
    border-color: #6c757d;
    color: white;
}

    .btn-secondary:hover[b-oifnbxjvbs] {
        background-color: #5a6268;
    }

/* Botón Info (Celeste) para reporte */
.btn-info[b-oifnbxjvbs] {
    background-color: #17a2b8;
    border-color: #17a2b8;
    color: white;
}

    .btn-info:hover[b-oifnbxjvbs] {
        background-color: #138496;
        border-color: #117a8b;
    }

/* Botón de éxito (verde) para enviar mensaje masivo */
.btn-success[b-oifnbxjvbs] {
    background-color: #28a745;
    border-color: #28a745;
    color: white;
}

    .btn-success:hover[b-oifnbxjvbs] {
        background-color: #218838;
        border-color: #1e7e34;
    }


/* El resto de los estilos (tabla, estatus, etc.) */
.prospects-table-container[b-oifnbxjvbs] {
    border: 1px solid #ddd;
    border-radius: 4px;
    overflow: hidden;
}

.prospects-table[b-oifnbxjvbs] {
    width: 100%;
    border-collapse: collapse;
}

    .prospects-table th[b-oifnbxjvbs], .prospects-table td[b-oifnbxjvbs] {
        padding: 12px 15px;
        text-align: left;
        border-bottom: 1px solid #ddd;
    }

    .prospects-table thead th[b-oifnbxjvbs] {
        background-color: #f9f9f9;
        font-weight: bold;
        color: #555;
    }

    /* NUEVO: Estilos para la columna de selección y los checkboxes */
    .prospects-table .select-col[b-oifnbxjvbs] {
        width: 40px; /* Ancho fijo para la columna del checkbox */
        text-align: center;
        padding: 12px 5px; /* Ajuste de padding */
    }

    .prospects-table input[type="checkbox"][b-oifnbxjvbs] {
        transform: scale(1.1); /* Hace el checkbox un poco más grande */
        cursor: pointer;
    }


.status-select[b-oifnbxjvbs] {
    border: none;
    border-radius: 15px;
    padding: 5px 15px;
    color: white;
    font-weight: bold;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.status-nuevo[b-oifnbxjvbs] {
    background-color: #007bff; /* Azul */
}

.status-contactado[b-oifnbxjvbs] {
    background-color: #ffc107; /* Amarillo */
    color: #333;
}

.status-interesado[b-oifnbxjvbs] { /* Nuevo estatus */
    background-color: #17a2b8; /* Turquesa/Info */
}

.status-cliente[b-oifnbxjvbs] { /* Nuevo estatus para clientes convertidos */
    background-color: #28a745; /* Verde */
}

.status-descartado[b-oifnbxjvbs] {
    background-color: #6c757d; /* Gris */
}

/* Estilos de formulario (para ProspectoNewForm) */
.form-header h2[b-oifnbxjvbs] {
    font-size: 1.5rem;
    color: #333;
    margin-bottom: 20px;
}

.form-grid[b-oifnbxjvbs] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    margin-bottom: 20px;
}

.form-field[b-oifnbxjvbs] {
    display: flex;
    flex-direction: column;
}

    .form-field label[b-oifnbxjvbs] {
        margin-bottom: 5px;
        font-size: 0.85rem;
        color: #555;
        font-weight: 500;
    }

.form-control[b-oifnbxjvbs] {
    width: 100%;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    font-family: inherit;
    font-size: 0.9rem;
}

    .form-control:focus[b-oifnbxjvbs] {
        border-color: #007bff;
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
        outline: none;
    }

.form-actions[b-oifnbxjvbs] {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #eee;
    text-align: right;
}

    .form-actions .btn[b-oifnbxjvbs] {
        margin-left: 10px;
    }

.form-text-muted[b-oifnbxjvbs] { /* Texto de ayuda en el formulario */
    font-size: 0.75rem;
    color: #888;
    margin-top: 5px;
}


/* Estilos para el badge del journey asociado en la tabla */
.badge[b-oifnbxjvbs] {
    display: inline-block;
    padding: 0.35em 0.65em;
    font-size: 0.75em;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.25rem;
}

    .badge.bg-info[b-oifnbxjvbs] {
        background-color: #17a2b8 !important;
    }

.feedback-message[b-oifnbxjvbs] {
    margin-top: 15px;
    padding: 10px;
    background-color: #e9ecef;
    border-left: 5px solid #007bff;
    border-radius: 4px;
}

/* --- ESTILOS PARA LOS FILTROS DIRECTAMENTE EN LA TABLA --- */
.prospects-table thead .filter-row th[b-oifnbxjvbs] {
    padding: 5px 10px;
    border-bottom: 1px solid #ddd;
    background-color: #f2f2f2;
    vertical-align: middle;
}

    .prospects-table thead .filter-row th select.form-control.filter-dropdown[b-oifnbxjvbs] {
        width: 100% !important;
        padding: 5px 8px !important;
        font-size: 0.85rem !important;
        border: 1px solid #d1d3e2 !important;
        border-radius: 0.35rem !important;
        background-color: white !important;
        color: #6e707e !important;
        height: 32px !important;
        line-height: 1.5 !important;
        box-sizing: border-box !important;
        -webkit-appearance: none !important;
        -moz-appearance: none !important;
        appearance: none !important;
        background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23000000%22%20d%3D%22M287%2C114.7L159.9%2C22.3c-3.2-3.2-8.4-3.2-11.6%2C0L5.3%2C114.7c-3.2%2C3.2-3.2%2C8.4%2C0%2C11.6l12.2%2C12.2c3.2%2C3.2%2C8.4%2C3.2%2C11.6%2C0l114.6-114.6l114.6%2C114.6c3.2%2C3.2%2C8.4%2C3.2%2C11.6%2C0l12.2-12.2C290.2%2C123.1%2C290.2%2C117.9%2C287%2C114.7z%22%2F%3E%3C%2Fsvg%3E') !important;
        background-repeat: no-repeat !important;
        background-position: right 8px center !important;
        background-size: 12px !important;
    }

        .prospects-table thead .filter-row th select.form-control.filter-dropdown:focus[b-oifnbxjvbs] {
            border-color: #a7c2ff !important;
            box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25) !important;
            outline: none !important;
        }

.prospects-table .clear-filter-btn[b-oifnbxjvbs] {
    padding: 4px 8px;
    font-size: 0.8rem;
    color: #6c757d;
    background-color: #e9ecef;
    border-color: #ddd;
    line-height: 1.2;
    height: 32px;
    box-sizing: border-box;
    display: flex; 
    align-items: center;
    justify-content: center;
}

    .prospects-table .clear-filter-btn:hover[b-oifnbxjvbs] {
        background-color: #d8dee3;
    }
/* _content/CRMFoliatti/Components/Pages/ProspectosShared/ProspectoConversionReportModal.razor.rz.scp.css */
/* Components/Pages/ProspectosShared/ProspectoConversionReportModal.razor.css */

/* Estilos de modal (reutilizados del modal principal) */
.modal-backdrop.show[b-tsv2ng39k6] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1040;
}

.modal.show[b-tsv2ng39k6] {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1050;
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    outline: 0;
}

.modal-dialog[b-tsv2ng39k6] {
    position: relative;
    width: auto;
    margin: 1.75rem auto;
    pointer-events: none;
}

    .modal-dialog.modal-lg[b-tsv2ng39k6] {
        max-width: 800px;
    }
/* Ancho para este reporte */
.modal-dialog-centered[b-tsv2ng39k6] {
    display: flex;
    align-items: center;
    min-height: calc(100% - 3.5rem);
}

.modal-content[b-tsv2ng39k6] {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 0.3rem;
    outline: 0;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

.modal-header[b-tsv2ng39k6] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 1rem 1rem;
    border-bottom: 1px solid #e9ecef;
    border-top-left-radius: calc(0.3rem - 1px);
    border-top-right-radius: calc(0.3rem - 1px);
}

.modal-title[b-tsv2ng39k6] {
    margin-bottom: 0;
    line-height: 1.5;
    font-size: 1.25rem;
    color: #333;
}

.btn-close[b-tsv2ng39k6] {
    padding: 0.5rem;
    margin: -0.5rem -0.5rem -0.5rem auto;
    background-color: transparent;
    border: 0;
    border-radius: 0.25rem;
    opacity: 0.5;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    cursor: pointer;
}

    .btn-close:hover[b-tsv2ng39k6] {
        opacity: 0.75;
    }

.modal-body[b-tsv2ng39k6] {
    position: relative;
    flex: 1 1 auto;
    padding: 1rem;
}

.modal-footer[b-tsv2ng39k6] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    padding: 0.75rem;
    border-top: 1px solid #e9ecef;
    border-bottom-right-radius: calc(0.3rem - 1px);
    border-bottom-left-radius: calc(0.3rem - 1px);
}

/* Estilos de botones (reutilizados) */
.btn[b-tsv2ng39k6] {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    text-align: center;
    text-decoration: none;
    line-height: 1.5;
}

.btn-secondary[b-tsv2ng39k6] {
    background-color: #6c757d;
    border-color: #6c757d;
    color: white;
}
/* NUEVO: Botón de éxito (verde) para exportar */
.btn-success[b-tsv2ng39k6] {
    background-color: #28a745;
    border-color: #28a745;
    color: white;
}

    .btn-success:hover[b-tsv2ng39k6] {
        background-color: #218838;
        border-color: #1e7e34;
    }


/* --- ESTILOS ESPECÍFICOS DEL REPORTE DE CONVERSIÓN --- */
.report-summary-cards[b-tsv2ng39k6] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 15px;
    margin-bottom: 25px;
    padding: 15px;
    background-color: #f8f9fa;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.summary-card[b-tsv2ng39k6] {
    background-color: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    padding: 15px;
    display: flex;
    align-items: center;
    gap: 15px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}

.summary-icon[b-tsv2ng39k6] {
    font-size: 2rem;
    color: #007bff;
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #e6f7ff;
    border-radius: 50%;
}

.summary-title[b-tsv2ng39k6] {
    font-size: 0.9rem;
    color: #777;
    text-transform: uppercase;
}

.summary-value[b-tsv2ng39k6] {
    font-size: 1.8rem;
    font-weight: bold;
    color: #333;
}

/* Estilos de tabla (reutilizados) */
.table[b-tsv2ng39k6] {
    width: 100%;
    margin-bottom: 1rem;
    color: #212529;
    border-collapse: collapse;
}

.table-striped tbody tr:nth-of-type(odd)[b-tsv2ng39k6] {
    background-color: rgba(0,0,0,.05);
}

.table-hover tbody tr:hover[b-tsv2ng39k6] {
    color: #212529;
    background-color: rgba(0,0,0,.075);
}

.table-dark[b-tsv2ng39k6] {
    color: #fff;
    background-color: #343a40;
    border-color: #454d55;
}

    .table-dark th[b-tsv2ng39k6] {
        color: #fff;
        background-color: #343a40;
        border-color: #454d55;
    }

.table th[b-tsv2ng39k6], .table td[b-tsv2ng39k6] {
    padding: 0.75rem;
    vertical-align: top;
    border-top: 1px solid #dee2e6;
    text-align: left;
}

.table thead th[b-tsv2ng39k6] {
    vertical-align: bottom;
    border-bottom: 2px solid #dee2e6;
    font-weight: bold;
}

/* Alerta */
.alert[b-tsv2ng39k6] {
    padding: 0.75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent; 
    border-radius: 0.25rem;
    font-size: 0.9rem;
}

.alert-info[b-tsv2ng39k6] {
    color: #0c5460;
    background-color: #d1ecf1;
    border-color: #bee5eb;
}
/* _content/CRMFoliatti/Components/Pages/ProspectosShared/ProspectoDetailsModal.razor.rz.scp.css */
/* Components/Pages/ProspectosShared/ProspectoDetailsModal.razor.css */

.modal-backdrop.show[b-etdw9vijb5] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* Fondo oscuro semitransparente */
    z-index: 1040;
}

.modal.show[b-etdw9vijb5] {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1050;
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    outline: 0;
}

.modal-dialog[b-etdw9vijb5] {
    position: relative;
    width: auto;
    margin: 1.75rem auto;
    pointer-events: none;
}

    .modal-dialog.modal-lg[b-etdw9vijb5] {
        max-width: 800px; /* Ancho más grande para mostrar más detalles */
    }

.modal-dialog-centered[b-etdw9vijb5] {
    display: flex;
    align-items: center;
    min-height: calc(100% - 3.5rem);
}

.modal-content[b-etdw9vijb5] {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 0.3rem;
    outline: 0;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

.modal-header[b-etdw9vijb5] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 1rem 1rem;
    border-bottom: 1px solid #e9ecef;
    border-top-left-radius: calc(0.3rem - 1px);
    border-top-right-radius: calc(0.3rem - 1px);
}

.modal-title[b-etdw9vijb5] {
    margin-bottom: 0;
    line-height: 1.5;
    font-size: 1.25rem;
    color: #333;
}

.btn-close[b-etdw9vijb5] {
    padding: 0.5rem;
    margin: -0.5rem -0.5rem -0.5rem auto;
    background-color: transparent;
    border: 0;
    border-radius: 0.25rem;
    opacity: 0.5;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    cursor: pointer;
}

    .btn-close:hover[b-etdw9vijb5] {
        opacity: 0.75;
    }

.modal-body[b-etdw9vijb5] {
    position: relative;
    flex: 1 1 auto;
    padding: 1rem;
}

.modal-footer[b-etdw9vijb5] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    padding: 0.75rem;
    border-top: 1px solid #e9ecef;
    border-bottom-right-radius: calc(0.3rem - 1px);
    border-bottom-left-radius: calc(0.3rem - 1px);
}

/* --- ESTILOS ESPECÍFICOS PARA LA VISTA DE DETALLES (SIMILAR A SALESFORCE) --- */
.info-section-container[b-etdw9vijb5] {
    padding: 0 0 1.25rem 0;
    border-bottom: 1px solid #f0f0f0;
    margin-bottom: 1.25rem;
}

    .info-section-container.last-section[b-etdw9vijb5] {
        border-bottom: none;
        margin-bottom: 0;
    }

.section-heading-salesforce[b-etdw9vijb5] {
    font-size: 1.1rem;
    color: #333;
    font-weight: bold;
    margin-bottom: 15px;
}

.info-field-grid-salesforce[b-etdw9vijb5] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px 20px;
}

.info-field-salesforce[b-etdw9vijb5] {
    display: flex;
    flex-direction: column;
    font-size: 0.95rem;
}

.info-label-salesforce[b-etdw9vijb5] {
    color: #888;
    font-weight: normal;
    margin-bottom: 2px;
    text-transform: uppercase;
    font-size: 0.8rem;
}

.info-value-salesforce[b-etdw9vijb5] {
    color: #333;
    font-weight: 500;
    word-wrap: break-word;
}

/* --- NUEVOS ESTILOS PARA SECCIÓN DE MENSAJES Y ENVÍO --- */
.message-preview[b-etdw9vijb5] {
    background-color: #f8f9fa;
    border: 1px dashed #ced4da;
    border-radius: 4px;
    padding: 10px;
    font-size: 0.85rem;
    color: #495057;
    white-space: pre-wrap; /* Mantiene saltos de línea y espacios */
    word-break: break-all; /* Rompe palabras para evitar desbordamiento */
    margin-top: 10px;
}

.manual-message-send-section[b-etdw9vijb5] {
    padding-top: 15px;
    border-top: 1px dashed #eee;
    margin-top: 15px;
}

.section-sub-heading[b-etdw9vijb5] {
    font-size: 1rem;
    color: #555;
    font-weight: bold;
    margin-bottom: 10px;
}

.form-field label[b-etdw9vijb5] { /* Reutiliza estilos de label de formulario */
    margin-bottom: 5px;
    font-size: 0.85rem;
    color: #555;
    font-weight: 500;
}

.form-control[b-etdw9vijb5] { /* Reutiliza estilos de input/select */
    width: 100%;
    padding: 0.375rem 0.75rem;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    font-size: 0.9rem;
}

    .form-control:focus[b-etdw9vijb5] {
        border-color: #007bff;
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
        outline: none;
    }


/* Estilos para alertas de feedback */
.alert[b-etdw9vijb5] {
    padding: 0.75rem 1.25rem;
    margin-bottom: 0;
    border: 1px solid transparent;
    border-radius: 0.25rem;
    font-size: 0.9rem;
    margin-top: 1rem;
}

.alert-success[b-etdw9vijb5] {
    color: #155724;
    background-color: #d4edda;
    border-color: #c3e6cb;
}

.alert-danger[b-etdw9vijb5] {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
}


/* Estilos de botones - Reutilizados */
.btn[b-etdw9vijb5] {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    text-align: center;
    text-decoration: none;
    line-height: 1.5;
}

.btn-primary[b-etdw9vijb5] {
    background-color: #007bff; 
    border-color: #007bff;
    color: white;
}

.btn-secondary[b-etdw9vijb5] {
    background-color: #6c757d;
    border-color: #6c757d;
    color: white;
}

.btn-success[b-etdw9vijb5] { /* Para el botón "Enviar Mensaje Seleccionado" */
    background-color: #28a745;
    border-color: #28a745;
    color: white;
}
/* _content/CRMFoliatti/Components/Pages/ProspectosShared/ProspectoListView.razor.rz.scp.css */
/* Estilos para la vista de lista de prospectos */

.page-header[b-290zz84pvx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #ddd;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

h1[b-290zz84pvx] {
    font-size: 1.5rem;
    color: #333;
}

.header-actions[b-290zz84pvx] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.file-upload-wrapper[b-290zz84pvx] {
    position: relative;
    overflow: hidden;
    display: inline-block;
}

.btn[b-290zz84pvx] {
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    transition: background-color 0.2s;
}

.btn-primary[b-290zz84pvx] {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
}

.btn-secondary[b-290zz84pvx] {
    background-color: #6c757d;
    border-color: #6c757d;
    color: white;
}

.file-upload-real[b-290zz84pvx] {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    opacity: 0;
    cursor: pointer;
}

.table-container[b-290zz84pvx] {
    border: 1px solid #ddd;
    border-radius: 4px;
    overflow: hidden;
    background-color: white;
}

.data-table[b-290zz84pvx] {
    width: 100%;
    border-collapse: collapse;
}

    .data-table th[b-290zz84pvx], .data-table td[b-290zz84pvx] {
        padding: 12px 15px;
        text-align: left;
        border-bottom: 1px solid #ddd;
        vertical-align: middle;
    }

    .data-table thead th[b-290zz84pvx] {
        background-color: #f9f9f9;
        font-weight: bold;
    }

.btn-action[b-290zz84pvx] {
    background: none;
    border: 1px solid #6c757d;
    color: #6c757d;
    cursor: pointer;
    padding: 5px 12px;
    font-size: 0.85rem;
    margin-right: 10px;
    border-radius: 15px;
    font-weight: 500;
}

    .btn-action:hover[b-290zz84pvx] {
        background-color: #6c757d;
        color: white;
    }

.btn-action-delete[b-290zz84pvx] {
    border-color: #dc3545;
    color: #dc3545;
}

    .btn-action-delete:hover[b-290zz84pvx] {
        background-color: #dc3545; 
        color: white;
    }

.status-select[b-290zz84pvx] {
    border: none;
    border-radius: 15px;
    padding: 5px 15px;
    color: white;
    font-weight: bold;
}

.status-nuevo[b-290zz84pvx] {
    background-color: #007bff;
}

.status-contactado[b-290zz84pvx] {
    background-color: #ffc107;
    color: #333;
}

.status-cliente[b-290zz84pvx] {
    background-color: #28a745;
}

.status-descartado[b-290zz84pvx] {
    background-color: #6c757d;
}
/* _content/CRMFoliatti/Components/Pages/ProspectosShared/ProspectoNewForm.razor.rz.scp.css */
/* Estilos para el formulario de nuevo prospecto */
.form-container[b-uiw78oe5ka] {
    background-color: white;
    padding: 20px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.page-header[b-uiw78oe5ka] {
    border-bottom: 2px solid #ddd;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

h1[b-uiw78oe5ka] {
    font-size: 1.5rem;
    color: #333;
}

.form-grid[b-uiw78oe5ka] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.form-field[b-uiw78oe5ka] {
    display: flex;
    flex-direction: column;
}

    .form-field label[b-uiw78oe5ka] {
        margin-bottom: 5px;
        font-size: 0.85rem;
        color: #555;
        font-weight: 500;
    }

    .form-field input[type="text"][b-uiw78oe5ka],
    .form-field input[type="email"][b-uiw78oe5ka] {
        width: 100%;
        padding: 8px;
        border: 1px solid #ccc;
        border-radius: 4px;
        box-sizing: border-box;
    }

.form-actions[b-uiw78oe5ka] {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #eee;
    text-align: right;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.btn[b-uiw78oe5ka] {
    padding: 8px 16px;
    border-radius: 4px; 
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
}

.btn-primary[b-uiw78oe5ka] {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
}

.btn-secondary[b-uiw78oe5ka] {
    background-color: #f8f9fa;
    border-color: #ddd;
    color: #333;
}
/* _content/CRMFoliatti/Components/Pages/Rerportes/ActividadReporte.razor.rz.scp.css */
/* Pages/Reportes/ActividadReporte.razor.css */
/* Reutiliza los estilos generales de reportes */
/* Puedes copiar el contenido de ResumenGeneral.razor.css o ClientesReporte.razor.css aquí */

.report-page-container[b-v3ig6ascvq] {
    padding: 20px;
    background-color: #f8f9fa;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.05);
}

.report-header[b-v3ig6ascvq] {
    margin-bottom: 30px;
    text-align: center;
}

    .report-header h1[b-v3ig6ascvq] {
        color: #333;
        font-size: 2rem;
        margin-bottom: 5px;
    }

        .report-header h1 i[b-v3ig6ascvq] {
            margin-right: 10px;
            color: #007bff;
        }

    .report-header p[b-v3ig6ascvq] {
        color: #666;
        font-size: 1rem;
    }

.report-filters[b-v3ig6ascvq] {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 30px;
    padding: 15px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    align-items: flex-end;
}

.filter-group[b-v3ig6ascvq] {
    display: flex;
    align-items: center;
    gap: 10px;
}

    .filter-group label[b-v3ig6ascvq] {
        font-weight: bold;
        color: #555;
        white-space: nowrap;
    }

.form-control[b-v3ig6ascvq] {
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 0.9rem;
    color: #333;
}

.btn-primary[b-v3ig6ascvq] {
    background-color: #007bff;
    color: white;
    border: none;
    padding: 8px 15px;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

    .btn-primary:hover[b-v3ig6ascvq] {
        background-color: #0056b3;
    }

.report-cards-grid[b-v3ig6ascvq] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    margin-bottom: 30px;
}

.report-card[b-v3ig6ascvq] {
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    display: flex;
    align-items: center;
    gap: 15px;
}

.card-icon[b-v3ig6ascvq] {
    font-size: 2.5rem;
    color: #007bff;
    width: 60px;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #e0f2ff;
    border-radius: 50%;
}

.card-content[b-v3ig6ascvq] {
    flex-grow: 1;
}

.card-title[b-v3ig6ascvq] {
    font-size: 0.9rem;
    color: #777;
    text-transform: uppercase;
    margin-bottom: 5px;
}

.card-value[b-v3ig6ascvq] {
    font-size: 2rem;
    font-weight: bold;
    color: #333;
    margin-bottom: 5px;
}

.card-trend[b-v3ig6ascvq] {
    font-size: 0.85rem;
    font-weight: 500;
}

.text-success[b-v3ig6ascvq] {
    color: #28a745;
}

.text-danger[b-v3ig6ascvq] {
    color: #dc3545;
}

.text-muted[b-v3ig6ascvq] {
    color: #6c757d;
}

.report-charts-section[b-v3ig6ascvq] {
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    margin-bottom: 30px;
}

    .report-charts-section h2[b-v3ig6ascvq] {
        color: #333;
        font-size: 1.5rem;
        margin-bottom: 20px;
        border-bottom: 1px solid #eee;
        padding-bottom: 10px;
    }

.chart-placeholder[b-v3ig6ascvq] {
    text-align: center;
    padding: 20px;
    border: 1px dashed #ccc;
    border-radius: 8px;
    margin-bottom: 20px;
    background-color: #f9f9f9;
}

    .chart-placeholder p[b-v3ig6ascvq] {
        color: #888;
        font-style: italic;
        margin-bottom: 15px;
    }

.report-data-table[b-v3ig6ascvq] {
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.data-table[b-v3ig6ascvq] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

    .data-table th[b-v3ig6ascvq], .data-table td[b-v3ig6ascvq] {
        padding: 12px 15px;
        border-bottom: 1px solid #eee;
        text-align: left;
    } 

    .data-table thead th[b-v3ig6ascvq] {
        background-color: #f2f2f2;
        font-weight: bold;
        color: #555;
        text-transform: uppercase;
    }

    .data-table tbody tr:hover[b-v3ig6ascvq] {
        background-color: #f5f5f5;
    }
/* _content/CRMFoliatti/Components/Pages/Rerportes/ClientesReporte.razor.rz.scp.css */
/* Pages/Reportes/ClientesReporte.razor.css */
/* Puedes reutilizar la mayoría de los estilos de ResumenGeneral.razor.css */
/* Si no tienes un archivo CSS global, puedes copiar y pegar el contenido de ResumenGeneral.razor.css aquí y luego añadir los específicos */

.report-page-container[b-kyyhk2mbez] {
    padding: 20px;
    background-color: #f8f9fa;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.05);
}

.report-header[b-kyyhk2mbez] {
    margin-bottom: 30px;
    text-align: center;
}

    .report-header h1[b-kyyhk2mbez] {
        color: #333;
        font-size: 2rem;
        margin-bottom: 5px;
    }

        .report-header h1 i[b-kyyhk2mbez] {
            margin-right: 10px;
            color: #007bff;
        }

    .report-header p[b-kyyhk2mbez] {
        color: #666;
        font-size: 1rem;
    }

.report-filters[b-kyyhk2mbez] {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 30px;
    padding: 15px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    align-items: flex-end;
}

.filter-group[b-kyyhk2mbez] {
    display: flex;
    align-items: center;
    gap: 10px;
}

    .filter-group label[b-kyyhk2mbez] {
        font-weight: bold;
        color: #555;
        white-space: nowrap;
    }

.form-control[b-kyyhk2mbez] {
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 0.9rem;
    color: #333;
}

.btn-primary[b-kyyhk2mbez] {
    background-color: #007bff;
    color: white;
    border: none;
    padding: 8px 15px;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

    .btn-primary:hover[b-kyyhk2mbez] {
        background-color: #0056b3;
    }

.report-cards-grid[b-kyyhk2mbez] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    margin-bottom: 30px;
}

.report-card[b-kyyhk2mbez] {
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    display: flex;
    align-items: center;
    gap: 15px;
}

.card-icon[b-kyyhk2mbez] {
    font-size: 2.5rem;
    color: #007bff;
    width: 60px;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #e0f2ff;
    border-radius: 50%;
}

.card-content[b-kyyhk2mbez] {
    flex-grow: 1;
}

.card-title[b-kyyhk2mbez] {
    font-size: 0.9rem;
    color: #777;
    text-transform: uppercase;
    margin-bottom: 5px;
}

.card-value[b-kyyhk2mbez] {
    font-size: 2rem;
    font-weight: bold;
    color: #333;
    margin-bottom: 5px;
}

.card-trend[b-kyyhk2mbez] {
    font-size: 0.85rem;
    font-weight: 500;
}

.text-success[b-kyyhk2mbez] {
    color: #28a745;
}

.text-danger[b-kyyhk2mbez] {
    color: #dc3545;
}

.text-muted[b-kyyhk2mbez] {
    color: #6c757d;
}

.report-charts-section[b-kyyhk2mbez] {
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    margin-bottom: 30px;
}

    .report-charts-section h2[b-kyyhk2mbez] {
        color: #333;
        font-size: 1.5rem;
        margin-bottom: 20px;
        border-bottom: 1px solid #eee;
        padding-bottom: 10px;
    }

.chart-placeholder[b-kyyhk2mbez] {
    text-align: center;
    padding: 20px;
    border: 1px dashed #ccc;
    border-radius: 8px;
    margin-bottom: 20px;
    background-color: #f9f9f9;
}

    .chart-placeholder p[b-kyyhk2mbez] {
        color: #888;
        font-style: italic;
        margin-bottom: 15px;
    }

.report-data-table[b-kyyhk2mbez] {
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.data-table[b-kyyhk2mbez] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

    .data-table th[b-kyyhk2mbez], .data-table td[b-kyyhk2mbez] { 
        padding: 12px 15px;
        border-bottom: 1px solid #eee;
        text-align: left;
    }

    .data-table thead th[b-kyyhk2mbez] {
        background-color: #f2f2f2;
        font-weight: bold;
        color: #555;
        text-transform: uppercase;
    }

    .data-table tbody tr:hover[b-kyyhk2mbez] {
        background-color: #f5f5f5;
    }
/* _content/CRMFoliatti/Components/Pages/Rerportes/EfectividadReporte.razor.rz.scp.css */
/* Pages/Reportes/EfectividadReporte.razor.css */
/* Reutiliza los estilos generales de reportes */
/* Puedes copiar el contenido de ResumenGeneral.razor.css o ClientesReporte.razor.css aquí */

.report-page-container[b-zbgr7yys5t] {
    padding: 20px;
    background-color: #f8f9fa;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.05);
}

.report-header[b-zbgr7yys5t] {
    margin-bottom: 30px;
    text-align: center;
}

    .report-header h1[b-zbgr7yys5t] {
        color: #333;
        font-size: 2rem;
        margin-bottom: 5px;
    }

        .report-header h1 i[b-zbgr7yys5t] {
            margin-right: 10px;
            color: #007bff;
        }

    .report-header p[b-zbgr7yys5t] {
        color: #666;
        font-size: 1rem;
    }

.report-filters[b-zbgr7yys5t] {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 30px;
    padding: 15px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    align-items: flex-end;
}

.filter-group[b-zbgr7yys5t] {
    display: flex;
    align-items: center;
    gap: 10px;
}

    .filter-group label[b-zbgr7yys5t] {
        font-weight: bold;
        color: #555;
        white-space: nowrap;
    }

.form-control[b-zbgr7yys5t] {
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 0.9rem;
    color: #333;
}

.btn-primary[b-zbgr7yys5t] {
    background-color: #007bff;
    color: white;
    border: none;
    padding: 8px 15px;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

    .btn-primary:hover[b-zbgr7yys5t] {
        background-color: #0056b3;
    }

.report-cards-grid[b-zbgr7yys5t] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    margin-bottom: 30px;
}

.report-card[b-zbgr7yys5t] {
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    display: flex;
    align-items: center;
    gap: 15px;
}

.card-icon[b-zbgr7yys5t] {
    font-size: 2.5rem;
    color: #007bff;
    width: 60px;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #e0f2ff;
    border-radius: 50%;
}

.card-content[b-zbgr7yys5t] {
    flex-grow: 1;
}

.card-title[b-zbgr7yys5t] {
    font-size: 0.9rem;
    color: #777;
    text-transform: uppercase;
    margin-bottom: 5px;
}

.card-value[b-zbgr7yys5t] {
    font-size: 2rem;
    font-weight: bold;
    color: #333;
    margin-bottom: 5px;
}

.card-trend[b-zbgr7yys5t] {
    font-size: 0.85rem;
    font-weight: 500;
}

.text-success[b-zbgr7yys5t] {
    color: #28a745;
}

.text-danger[b-zbgr7yys5t] {
    color: #dc3545;
}

.text-muted[b-zbgr7yys5t] {
    color: #6c757d;
}

.report-charts-section[b-zbgr7yys5t] {
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    margin-bottom: 30px;
}

    .report-charts-section h2[b-zbgr7yys5t] {
        color: #333;
        font-size: 1.5rem;
        margin-bottom: 20px;
        border-bottom: 1px solid #eee;
        padding-bottom: 10px;
    }

.chart-placeholder[b-zbgr7yys5t] {
    text-align: center;
    padding: 20px;
    border: 1px dashed #ccc;
    border-radius: 8px;
    margin-bottom: 20px;
    background-color: #f9f9f9;
}

    .chart-placeholder p[b-zbgr7yys5t] {
        color: #888;
        font-style: italic;
        margin-bottom: 15px;
    }

.report-data-table[b-zbgr7yys5t] {
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.data-table[b-zbgr7yys5t] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

    .data-table th[b-zbgr7yys5t], .data-table td[b-zbgr7yys5t] {
        padding: 12px 15px;
        border-bottom: 1px solid #eee;
        text-align: left;
    }

    .data-table thead th[b-zbgr7yys5t] { 
        background-color: #f2f2f2;
        font-weight: bold;
        color: #555;
        text-transform: uppercase;
    }

    .data-table tbody tr:hover[b-zbgr7yys5t] {
        background-color: #f5f5f5;
    }
/* _content/CRMFoliatti/Components/Pages/Rerportes/PromocionesReporte.razor.rz.scp.css */
/* Pages/Reportes/PromocionesReporte.razor.css */
/* Reutiliza los estilos generales de reportes */
/* Puedes copiar el contenido de ResumenGeneral.razor.css o ClientesReporte.razor.css aquí */

.report-page-container[b-2f29d7pr66] {
    padding: 20px;
    background-color: #f8f9fa;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.05);
}

.report-header[b-2f29d7pr66] {
    margin-bottom: 30px;
    text-align: center;
}

    .report-header h1[b-2f29d7pr66] {
        color: #333;
        font-size: 2rem;
        margin-bottom: 5px;
    }

        .report-header h1 i[b-2f29d7pr66] {
            margin-right: 10px;
            color: #007bff;
        }

    .report-header p[b-2f29d7pr66] {
        color: #666;
        font-size: 1rem;
    }

.report-filters[b-2f29d7pr66] {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 30px;
    padding: 15px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    align-items: flex-end;
}

.filter-group[b-2f29d7pr66] {
    display: flex;
    align-items: center;
    gap: 10px;
}

    .filter-group label[b-2f29d7pr66] {
        font-weight: bold;
        color: #555;
        white-space: nowrap;
    }

.form-control[b-2f29d7pr66] {
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 0.9rem;
    color: #333;
}

.btn-primary[b-2f29d7pr66] {
    background-color: #007bff;
    color: white;
    border: none;
    padding: 8px 15px;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

    .btn-primary:hover[b-2f29d7pr66] {
        background-color: #0056b3;
    }

.report-cards-grid[b-2f29d7pr66] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    margin-bottom: 30px;
}

.report-card[b-2f29d7pr66] {
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    display: flex;
    align-items: center;
    gap: 15px;
}

.card-icon[b-2f29d7pr66] {
    font-size: 2.5rem;
    color: #007bff;
    width: 60px;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #e0f2ff;
    border-radius: 50%;
}

.card-content[b-2f29d7pr66] {
    flex-grow: 1;
}

.card-title[b-2f29d7pr66] {
    font-size: 0.9rem;
    color: #777;
    text-transform: uppercase;
    margin-bottom: 5px;
}

.card-value[b-2f29d7pr66] {
    font-size: 2rem;
    font-weight: bold;
    color: #333;
    margin-bottom: 5px;
}

.card-trend[b-2f29d7pr66] {
    font-size: 0.85rem;
    font-weight: 500;
}

.text-success[b-2f29d7pr66] {
    color: #28a745;
}

.text-danger[b-2f29d7pr66] {
    color: #dc3545;
}

.text-muted[b-2f29d7pr66] {
    color: #6c757d;
}

.report-charts-section[b-2f29d7pr66] {
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    margin-bottom: 30px;
}

    .report-charts-section h2[b-2f29d7pr66] {
        color: #333;
        font-size: 1.5rem;
        margin-bottom: 20px;
        border-bottom: 1px solid #eee;
        padding-bottom: 10px;
    }

.chart-placeholder[b-2f29d7pr66] {
    text-align: center;
    padding: 20px;
    border: 1px dashed #ccc;
    border-radius: 8px;
    margin-bottom: 20px;
    background-color: #f9f9f9;
}

    .chart-placeholder p[b-2f29d7pr66] {
        color: #888;
        font-style: italic;
        margin-bottom: 15px;
    }

.report-data-table[b-2f29d7pr66] {
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.data-table[b-2f29d7pr66] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

    .data-table th[b-2f29d7pr66], .data-table td[b-2f29d7pr66] { 
        padding: 12px 15px;
        border-bottom: 1px solid #eee;
        text-align: left;
    }

    .data-table thead th[b-2f29d7pr66] {
        background-color: #f2f2f2;
        font-weight: bold;
        color: #555;
        text-transform: uppercase;
    }

    .data-table tbody tr:hover[b-2f29d7pr66] {
        background-color: #f5f5f5;
    }
/* _content/CRMFoliatti/Components/Pages/Rerportes/ResumenGeneral.razor.rz.scp.css */
/* Pages/Reportes/ResumenGeneral.razor.css */

.report-page-container[b-8fc3vo848b] {
    padding: 20px;
    background-color: #f8f9fa;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.05);
}

.report-header[b-8fc3vo848b] {
    margin-bottom: 30px;
    text-align: center;
}

    .report-header h1[b-8fc3vo848b] {
        color: #333;
        font-size: 2rem;
        margin-bottom: 5px;
    }

        .report-header h1 i[b-8fc3vo848b] {
            margin-right: 10px;
            color: #007bff;
        }

    .report-header p[b-8fc3vo848b] {
        color: #666;
        font-size: 1rem;
    }

.report-filters[b-8fc3vo848b] {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 30px;
    padding: 15px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    align-items: flex-end; /* Alinea los elementos al final */
}

.filter-group[b-8fc3vo848b] {
    display: flex;
    align-items: center;
    gap: 10px;
}

    .filter-group label[b-8fc3vo848b] {
        font-weight: bold;
        color: #555;
        white-space: nowrap; /* Evita que el texto de la etiqueta se rompa */
    }

.form-control[b-8fc3vo848b] {
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 0.9rem;
    color: #333;
}

.btn-primary[b-8fc3vo848b] {
    background-color: #007bff;
    color: white;
    border: none;
    padding: 8px 15px;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

    .btn-primary:hover[b-8fc3vo848b] {
        background-color: #0056b3;
    }

.report-cards-grid[b-8fc3vo848b] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    margin-bottom: 30px;
}

.report-card[b-8fc3vo848b] {
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    display: flex;
    align-items: center;
    gap: 15px;
}

.card-icon[b-8fc3vo848b] {
    font-size: 2.5rem;
    color: #007bff;
    width: 60px;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #e0f2ff;
    border-radius: 50%;
}

.card-content[b-8fc3vo848b] {
    flex-grow: 1;
}

.card-title[b-8fc3vo848b] {
    font-size: 0.9rem;
    color: #777;
    text-transform: uppercase;
    margin-bottom: 5px;
}

.card-value[b-8fc3vo848b] {
    font-size: 2rem;
    font-weight: bold;
    color: #333;
    margin-bottom: 5px;
}

.card-trend[b-8fc3vo848b] {
    font-size: 0.85rem;
    font-weight: 500;
}

.text-success[b-8fc3vo848b] {
    color: #28a745;
}

.text-danger[b-8fc3vo848b] {
    color: #dc3545;
}

.text-muted[b-8fc3vo848b] {
    color: #6c757d;
}

.report-charts-section[b-8fc3vo848b] {
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    margin-bottom: 30px;
}

    .report-charts-section h2[b-8fc3vo848b] {
        color: #333;
        font-size: 1.5rem;
        margin-bottom: 20px;
        border-bottom: 1px solid #eee;
        padding-bottom: 10px;
    }

.chart-placeholder[b-8fc3vo848b] {
    text-align: center;
    padding: 20px;
    border: 1px dashed #ccc;
    border-radius: 8px;
    margin-bottom: 20px;
    background-color: #f9f9f9;
}

    .chart-placeholder p[b-8fc3vo848b] {
        color: #888;
        font-style: italic;
        margin-bottom: 15px;
    }

.report-data-table[b-8fc3vo848b] {
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

    .report-data-table h2[b-8fc3vo848b] {
        color: #333;
        font-size: 1.5rem;
        margin-bottom: 20px;
        border-bottom: 1px solid #eee;
        padding-bottom: 10px;
    }

.data-table[b-8fc3vo848b] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

    .data-table th[b-8fc3vo848b], .data-table td[b-8fc3vo848b] {
        padding: 12px 15px;
        border-bottom: 1px solid #eee;
        text-align: left;
    }

    .data-table thead th[b-8fc3vo848b] { 
        background-color: #f2f2f2;
        font-weight: bold;
        color: #555;
        text-transform: uppercase;
    }

    .data-table tbody tr:hover[b-8fc3vo848b] {
        background-color: #f5f5f5;
    }
/* _content/CRMFoliatti/Components/Pages/Settings.razor.rz.scp.css */
/* Pages/Settings.razor.css */

.settings-page-container[b-ejpks6yi00] {
    padding: 20px;
    background-color: #f3f3f3; /* Fondo general, similar a otras páginas */
    min-height: calc(100vh - 90px);
}

/* Reutilizando estilos de page-header de otras páginas */
.page-header[b-ejpks6yi00] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #ddd;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

    .page-header h3[b-ejpks6yi00] {
        font-size: 1.5rem;
        color: #333;
        margin: 0;
    }

/* Reutilizando estilos de card de otras páginas */
.card[b-ejpks6yi00] {
    border: 1px solid #e3e6f0;
    border-radius: 0.35rem;
    background-color: #fff;
    box-shadow: 0 0.15rem 1.75rem 0 rgba(58,59,69,.15) !important;
}

.card-header[b-ejpks6yi00] {
    padding: 0.75rem 1.25rem;
    margin-bottom: 0;
    background-color: #f8f9fc;
    border-bottom: 1px solid #e3e6f0;
    border-top-left-radius: calc(0.35rem - 1px);
    border-top-right-radius: calc(0.35rem - 1px);
}

    .card-header h6[b-ejpks6yi00] {
        margin: 0;
        font-size: 1rem;
        color: #4e73df;
    }

.card-body[b-ejpks6yi00] {
    padding: 1.25rem;
}

/* Estilos de formulario y campos - Reutilizados */
.form-label[b-ejpks6yi00] {
    font-size: 0.85rem;
    color: #555;
    font-weight: 500;
    margin-bottom: 0.5rem;
}

.form-control[b-ejpks6yi00] {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 0.9rem;
    font-weight: 400;
    line-height: 1.5;
    color: #6e707e;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #d1d3e2;
    border-radius: 0.35rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

    .form-control:focus[b-ejpks6yi00] {
        border-color: #a7c2ff;
        outline: 0;
        box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
    }

.form-grid-2-cols[b-ejpks6yi00] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px 20px;
}

.form-field[b-ejpks6yi00] {
    display: flex;
    flex-direction: column;
}

/* Estilos para el switch de Bootstrap */
.form-check.form-switch .form-check-input[b-ejpks6yi00] {
    width: 2.25em; /* Ancho estándar Bootstrap */
    height: 1.25em; /* Alto estándar Bootstrap */
    margin-left: -1.5em; /* Margen estándar Bootstrap */
    cursor: pointer;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280,0,0,.25%29'/%3e%3c/svg%3e");
    background-position: left center;
    background-repeat: no-repeat;
    background-size: contain;
    border: 1px solid rgba(0,0,0,.25);
    border-radius: 0.5rem;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

    .form-check.form-switch .form-check-input:checked[b-ejpks6yi00] {
        background-color: #007bff; /* Azul para activo */
        border-color: #007bff;
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
        background-position: right center;
    }

.form-check.form-switch .form-check-label[b-ejpks6yi00] {
    margin-left: 0.5rem;
    font-size: 0.9rem;
    color: #555;
}


/* Estilos de botones generales - Reutilizados */
.btn[b-ejpks6yi00] {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    text-align: center;
    text-decoration: none; 
    line-height: 1.5;
}

.btn-primary[b-ejpks6yi00] {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
}

.btn-warning[b-ejpks6yi00] { /* Para el botón de seguridad */
    background-color: #ffc107;
    border-color: #ffc107;
    color: #212529; /* Color de texto oscuro para fondo claro */
}

    .btn-warning:hover[b-ejpks6yi00] {
        background-color: #e0a800;
        border-color: #d39e00;
    }
/* _content/CRMFoliatti/Components/Pages/TableroDeTrayectorias.razor.rz.scp.css */
/* Pages/TableroDeTrayectorias.razor.css */

/* Estilos generales del contenedor principal */
.dashboard-page-container[b-glsxxrpr3f] {
    display: flex;
    height: calc(100vh - 90px); /* Ocupa el alto disponible menos la cabecera del layout */
    background-color: #f3f3f3; /* Fondo ligero para la página */
    overflow: hidden; /* Previene scroll no deseado en el contenedor principal */
}

/* --- Estilos de la Barra Lateral (Sidebar) --- */
.sidebar[b-glsxxrpr3f] {
    width: 250px;
    background-color: white;
    border-right: 1px solid #ddd;
    padding: 20px 0; /* Padding vertical, horizontal lo dan los ítems */
    flex-shrink: 0; /* Evita que se encoja */
    box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,.075) !important; /* Sombra sutil */
    display: flex;
    flex-direction: column;
}

.sidebar-header[b-glsxxrpr3f] {
    padding: 0 20px 15px; /* Padding inferior para separación */
    border-bottom: 1px solid #eee;
    margin-bottom: 15px;
}

    .sidebar-header h4[b-glsxxrpr3f] {
        margin: 0;
        font-size: 1.1rem;
        color: #333;
    }

.sidebar-nav-list[b-glsxxrpr3f] {
    list-style: none;
    padding: 0;
    margin: 0;
    flex-grow: 1; /* Permite que la lista de navegación ocupe espacio */
}

.sidebar-nav-item a[b-glsxxrpr3f] {
    display: flex;
    align-items: center;
    padding: 10px 20px;
    color: #666;
    text-decoration: none;
    font-size: 0.9rem;
    transition: background-color 0.2s, color 0.2s;
}

    .sidebar-nav-item a:hover[b-glsxxrpr3f] {
        background-color: #e9ecef;
        color: #333;
    }

    .sidebar-nav-item a.active[b-glsxxrpr3f] {
        background-color: #007bff;
        color: white;
        font-weight: bold;
        border-radius: 0 25px 25px 0; /* Borde redondeado a la derecha para el activo */
        margin-right: 10px; /* Pequeño margen para el redondeo */
    }

    .sidebar-nav-item a i[b-glsxxrpr3f] {
        margin-right: 10px;
        font-size: 1rem;
    }

.sidebar-section-title[b-glsxxrpr3f] {
    font-size: 0.75rem;
    color: #999;
    text-transform: uppercase;
    margin: 15px 20px 5px;
    font-weight: bold;
}

/* --- Estilos del Contenido Principal (Main Content Area) --- */
.main-content[b-glsxxrpr3f] {
    flex-grow: 1; /* Ocupa el resto del espacio horizontal */
    padding: 20px;
    display: flex;
    flex-direction: column;
    overflow: hidden; /* Para manejar el scroll de los componentes internos */
}

/* Estilos de la barra de herramientas superior (sobre la tabla) */
.toolbar[b-glsxxrpr3f] {
    background-color: white;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 10px 15px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 10px; /* Espacio entre elementos del toolbar */
    box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,.075) !important;
}

.search-input[b-glsxxrpr3f] {
    flex-grow: 1; /* Hace que el input de búsqueda ocupe el espacio */
    padding: 8px 12px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 0.9rem;
}

.filter-btn[b-glsxxrpr3f], .action-btn[b-glsxxrpr3f] {
    padding: 8px 12px;
    border-radius: 4px;
    font-size: 0.9rem;
    cursor: pointer;
    border: 1px solid #ddd;
    background-color: #f8f9fa;
    color: #333;
    transition: background-color 0.2s;
}

    .filter-btn:hover[b-glsxxrpr3f], .action-btn:hover[b-glsxxrpr3f] {
        background-color: #e9ecef;
    }

    .filter-btn i[b-glsxxrpr3f], .action-btn i[b-glsxxrpr3f] {
        margin-right: 5px;
    }

.create-trajectory-btn[b-glsxxrpr3f] {
    padding: 10px 20px;
    border-radius: 4px;
    font-size: 1rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    background-color: #007bff;
    color: white;
    white-space: nowrap; /* Evita que el texto se rompa */
}

    .create-trajectory-btn:hover[b-glsxxrpr3f] {
        background-color: #0056b3;
    }

/* --- Estilos de la Tabla --- */
.data-table-container[b-glsxxrpr3f] {
    flex-grow: 1;
    background-color: white;
    border: 1px solid #ddd;
    border-radius: 4px;
    overflow: auto; /* Permite scroll si la tabla es muy ancha/larga */
    box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,.075) !important;
}

.data-table[b-glsxxrpr3f] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
    color: #555;
}

    .data-table thead[b-glsxxrpr3f] {
        background-color: #f8f9fc;
        position: sticky; /* Encabezado fijo al hacer scroll vertical */
        top: 0;
        z-index: 1;
    }

    .data-table th[b-glsxxrpr3f], .data-table td[b-glsxxrpr3f] {
        padding: 12px 15px;
        border-bottom: 1px solid #eee;
        text-align: left;
    }

    .data-table th[b-glsxxrpr3f] {
        font-weight: bold;
        color: #444;
        text-transform: uppercase;
        font-size: 0.8rem;
        white-space: nowrap; /* Evita que los títulos se rompan */
    }

    .data-table tbody tr:hover[b-glsxxrpr3f] {
        background-color: #f5f5f5;
    }

/* Estilos para los iconos dentro de la tabla (estado, desarrollo, etc.) */
.table-status-icon[b-glsxxrpr3f] {
    font-size: 0.8rem;
    margin-right: 5px;
}

.table-status-text[b-glsxxrpr3f] {
    font-size: 0.85rem;
}

/* Colores para el estado */
.status-running[b-glsxxrpr3f] {
    color: #1cc88a;
}
/* Verde para "En ejecución" */
.status-draft[b-glsxxrpr3f] {
    color: #f6c23e;
}
/* Amarillo para "En desarrollo" o borrador */
.status-paused[b-glsxxrpr3f] {
    color: #6e707e;
}
/* Gris para "Pausado" */

/* Estilos de botones generales (reutilizados) */
.btn[b-glsxxrpr3f] {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    text-align: center;
    text-decoration: none;
    line-height: 1.5; /* Asegura buena altura para el texto del botón */
}

.btn-primary[b-glsxxrpr3f] {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
}

.btn-secondary[b-glsxxrpr3f] {
    background-color: #f8f9fa; 
    border-color: #ddd;
    color: #333;
}

.btn-success[b-glsxxrpr3f] {
    background-color: #28a745;
    border-color: #28a745;
    color: white;
}

/* Otros estilos para inputs y select si fueran necesarios */
.form-control[b-glsxxrpr3f] {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 0.9rem;
    font-weight: 400;
    line-height: 1.5;
    color: #6e707e;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #d1d3e2;
    border-radius: 0.35rem;
}