.botonAcciones {
    border: none;
    color: #5b9bd1;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    cursor: pointer;
    border-radius: 10px;
    background-color: unset;
    font-size: medium;
    padding-left: 0px;
    padding-right: 0px;
}
.botonAcciones:hover {
    color: #3f78d4;
}

/*
.mary-active-menu { background-color: rgb(90, 81, 81) !important;}
.dark .mary-active-menu { background-color: #606060 !important; }
*/

.ag-text-field-input {
    height: 22px;
}
div:has(> table.tabla-parametros) {
    height: 510px;
    overflow-y: auto;
}

div:has(> table.tabla-parametros) thead {
    position: sticky;
    top: 0;
    /* mejor agregar blur */
    backdrop-filter: blur(4px); /* Efecto de desenfoque */
    -webkit-backdrop-filter: blur(4px); /* Compatibilidad con Safari */
}

div:has(> table.tabla-resultados) {
    height: 60vh;
    overflow-y: auto;
}

div:has(> table.tabla-resultados) thead {
    position: sticky;
    top: 0;
    z-index: 1;
}

div:has(> table.tabla-interpretaciones) {
    height: 400px;
    overflow-y: auto;
}

div:has(> table.tabla-interpretaciones) thead {
    position: sticky;
    top: 0;
    /* mejor agregar blur */
    backdrop-filter: blur(4px); /* Efecto de desenfoque */
    -webkit-backdrop-filter: blur(4px); /* Compatibilidad con Safari */
}

/* html.dark .swal2-popup {
    background-color: #4b5563 !important;
    border: 1px solid #d1d5db !important;
    color: #e5e7eb;
} */

/* Clase para quitar el flex que la libreria de Mary UI pone al contenedor del header*/
.quitar-flex > div {
    display: block !important;
    gap: 0 !important;
    flex-wrap: nowrap !important;
    justify-content: normal !important;
    align-items: normal !important;
}

.navbar-logo > div {
    padding-top: 5px;
    padding-bottom: 5px;
}

.va-top {
    vertical-align: top;
}

.striped tbody tr:nth-child(odd) {
    background-color: #f9f9f9; /* Color de fondo para filas impares */
}

.striped tbody tr:nth-child(even) {
    background-color: #ffffff; /* Color de fondo para filas pares */
}

/* Opcional: Agregar hover */
.striped tbody tr:hover {
    background-color: #f1f1f1; /* Color de fondo al pasar el mouse */
}

/* Estilo de borde opcional */
.striped {
    border-collapse: collapse; /* Opcional: bordes colapsados */
    width: 100%; /* Ancho completo */
}

.striped {
    border: 1px solid #ddd; /* Bordes de las celdas */
    padding: 5px; /* Espaciado interno */
}

table.dropdown-z {
    @apply !static;
}

table.dropdown-z details.dropdown {
    @apply !static;
}

.logo-auth {
    font-size: 22px;
    color: #ffffff;
    backdrop-filter: blur(6px);
    background-color: rgba(0, 0, 0, 0.8);
    padding: 8px;
    border-radius: 8px;
    text-align: center;
    margin-bottom: 10px;
    font-family: "Montserrat", sans-serif;
    letter-spacing: 2px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.4);
    transition: transform 0.3s ease;
}

.logo-auth:hover {
    transform: scale(1.05);
}
td.fitwidth {
    width: 1px;
    white-space: nowrap;
}

div:has(> table.fixed-header) {
    height: 70vh;
    overflow-y: auto;
}

div:has(> table.fixed-header) thead {
    position: sticky;
    top: 0;
    /* mejor agregar blur */
    backdrop-filter: blur(4px); /* Efecto de desenfoque */
    -webkit-backdrop-filter: blur(4px); /* Compatibilidad con Safari */
}

.loading-body {
    position: relative;
}

/* Este es el overlay de carga */
.loading-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.5); /* Fondo semi-transparente */
    backdrop-filter: blur(4px); /* Aplicar blur */
    display: flex;
    justify-content: center;
    align-items: center;
    color: black;
    font-size: 1.5rem;
    visibility: hidden; /* Inicialmente está oculto */
    opacity: 0; /* Inicialmente está invisible */
    transition: opacity 0.3s ease, visibility 0s 0.3s; /* Transición suave */
}

/* Cuando el componente esté cargando, el overlay aparecerá */
.loading-overlay[wire\:loading] {
    visibility: visible;
    opacity: 1;
    transition: opacity 0.3s ease, visibility 0s 0s; /* La transición debe ser inmediata */
}

/* Estilo para el mensaje de carga */
.loading-message {
    font-size: 20px;
    font-weight: bold;
    text-align: center; /* Asegura que el mensaje esté centrado */
}

.date-sm input.form-control {
    height: 2rem;
    padding-left: 0.75rem;
    padding-right: 2.5rem;
    font-size: 0.875rem;
    line-height: 2rem;
}

.date-sm svg {
    right: 0.75rem; /* Asegura que el icono se alinee correctamente */
    left: unset; /* Elimina cualquier posible valor de izquierda aplicado al icono */
}

.date-sm > div {
    width: 100%;
}

/* .ck-content > ol,
ul {
    list-style: revert;
    margin: revert;
    padding: revert;
} */

.scroll-y {
    overflow-y: auto; /* El scroll aparece solo cuando es necesario */
    scrollbar-gutter: stable; /* Reserva el espacio para la barra de scroll */
}
.dropdown-content {
    z-index: 5;
}
/* Agregeando un index mas alto para modales */
.toast {
    z-index: 1000 !important;
}