body {
    width: 100%; /* Ancho de la tabla */
    border-collapse: collapse; /* Colapsar bordes de celdas */
}

@font-face {
    font-family: tipografia;
    src: url("Gidole-Regular.otf") format("opentype");
}

.tipo-letra {
    font-family: tipografia;
}

.tabla-estilizada td {
    padding: 8px; /* Ajusta el espaciado de las celdas */
    border-bottom: 1px solid #ddd; /* Borde para las celdas de datos */
    text-align: center;
}

.tabla-estilizada {
    border-collapse: collapse; /* Colapsa los bordes */
    width: 100%;
}

    .tabla-estilizada th {
        border: none; /* Elimina todos los bordes */
        border-bottom: 1px solid #707070; /* Añade borde inferior a las celdas */
        position: sticky;
        top: 0px;
        /*z-index: 150;*/
    }

    /* Opcional: Estilos para la cabecera de la tabla */
    .tabla-estilizada th {
        background-color: #f2f2f2;
    }

    .tabla-estilizada thead th {
        background-color: #f2f2f2; /* O el color de fondo que desees */
    }


    .tabla-estilizada th {
        background-color: #e0e0e0; /* Color de fondo de encabezados */
        font-weight: bold;
    }

    .tabla-estilizada tr:nth-child(even) {
        background-color: #f9f9f9; /* Color de fondo de filas pares */
    }

    .tabla-estilizada tr:hover {
        background-color: #e0e0e0; /* Color de fondo al pasar el mouse */
    }



.btn-iniSesion {
    background-color: #cc0000 !important;
}

.log {
    padding-left: 100px;
}

.edit-perfil {
    width: 550px;
}

.logo-orden {
    margin-left: 300px;
}

.contAdmin {
    margin-left: 250px;
}

.orden-entradas {
    width: auto;
}





@media (min-width: 640px) and (max-width: 673px) {


    .container-fechas {
        flex-direction: column;
        align-items: flex-start;
        width: 80%;
    }
}





@media only screen and (min-width: 640px) and (max-width: 673px) {


    .mt-btnBusq1 {
        margin-top: 3px;
    }
}




















   /* @media only screen and (max-width: 1157px) {


        .orden-entradas {
            width: 100%;
        }
    }*/

    @media only screen and (max-width: 1157px) {

        .tablatop {
            margin-top: 60px;
        }
    }

/*@media only screen and (max-width: 1157px) {


    .mt-btnBusq {
        margin-top: 1.5px;
        

    }
}
*/
    @media only screen and (max-width: 1023px) {
        .log {
            padding-left: 0px;
        }

        .edit-perfil {
            width: 250px;
        }

        .logo-orden {
            margin-left: 10px;
        }

        /*.orden-entradas {
            width: 100%;
        }

        .mt-btnBusq {
            margin-top: 2px;
        }
*/

        .contAdmin {
            margin-left: 0px;
        }
    }

    .dtUsuariInter {
        margin-top: 0px;
    }

    .m-UserDormInter {
        margin-left: 20px;
    }

    .tablatop {
        margin-top: 0px;
    }

    .tablatop1 {
        margin-top: 0px;
    }

    @media only screen and (max-width: 1023px) {
        .dtUsuariInter {
            margin-top: 20px;
        }

        .m-UserDormInter {
            margin-left: 10px;
        }

        .tablatop {
            margin-top: 150px;
        }

        .tablatop1 {
            margin-top: 150px;
        }

        .tabla-estilizada th {
            top: 0px;
        }
    }

    @media only screen and (max-width: 1023px) {

        .tablatop {
            margin-top: 60px;
        }
    }

    @media only screen and (max-width: 1131px) {

        .tablatop {
            margin-top: 45px;
        }
    }

    @media only screen and (max-width: 1157px) {

        .tablatop {
            margin-top: 0px;
        }
    }

    /*@media only screen and (max-width: 639px) {

        .tablatop {
            margin-top: 2px;
        }
    }

    @media only screen and (max-width: 334px) {

        .tablatop {
            margin-top: 190px;
        }
    }*/



    @media only screen and (max-width: 1023px) {

        .tablatop1 {
            margin-top: 50px;
        }
    }

    @media only screen and (max-width: 1133px) {

        .tablatop1 {
            margin-top: 20px;
        }
    }

    @media only screen and (max-width: 639px) {

        .tablatop1 {
            margin-top: 50px;
        }
    }


    @media only screen and (max-width: 334px) {

        .tablatop1 {
            margin-top: 50px;
        }
    }





    .Tablaencabe {
        max-height: 80vh;
    }

    @media only screen and (max-width: 1629px) {
        .Tablaencabe {
            max-height: 70vh;
        }
    }

    @media only screen and (max-width: 1018px) {
        .Tablaencabe {
            max-height: 70vh;
        }
    }

    @media only screen and (max-width: 750px) {
        .Tablaencabe {
            max-height: 50vh;
        }
    }

    @media only screen and (max-width: 639px) {
        .Tablaencabe {
            max-height: 45vh;
        }
    }

    @media only screen and (max-width: 334px) {
        .Tablaencabe {
            max-height: 70vh;
        }
    }



    .tabla-estilizada2 {
        width: 100%; /* Asegura que la tabla ocupe todo el ancho disponible */
        border-collapse: collapse; /* Colapsa los bordes de las celdas */
        text-align: center;
    }

        .tabla-estilizada2 th {
            position: sticky; /* Fija el encabezado */
            top: 0; /* Lo fija en la parte superior */
            background-color: #f2f2f2; /* Color de fondo para el encabezado */
            z-index: 1; /* Asegura que el encabezado esté por encima de la tabla */
            padding: 8px; /* Ajusta el espaciado del encabezado */
            border: 1px solid #ddd; /* Borde para las celdas del encabezado */
        }

        .tabla-estilizada2 td {
            padding: 8px; /* Ajusta el espaciado de las celdas */
            border-bottom: 1px solid #ddd; /* Borde para las celdas de datos */
        }

    /* Estilos para el contenedor de la tabla */
    .table-container {
        overflow-y: auto; /* Habilita el scroll vertical */
        max-height: 460px; /* Altura máxima de la tabla (ajusta según tus neades) */
    }

    .table-container1 {
        overflow-y: auto; /* Habilita el scroll vertical */
        max-height: 100%; /* Altura máxima de la tabla (ajusta según tus necesidades) */
    }
    /* Opcional: Estilos para la cabecera de la tabla */
    .tabla-estilizada2 th {
        background-color: #f2f2f2;
    }

    .tabla-estilizada2 th {
        background-color: #ddd; /* Color de fondo de encabezados */
        font-weight: bold;
    }

    .tabla-estilizada2 tr:nth-child(even) {
        background-color: #f9f9f9; /* Color de fondo de filas pares */
        text-align: center;
    }

    .tabla-estilizada2 tr:hover {
        background-color: #e0e0e0; /* Color de fondo al pasar el mouse */
    }

    .rounded-lg {
        border-radius: 0.5rem; /* Ajusta el valor según el radio de borde que desees */
    }



    .panel {
        padding: 10px; /* Espaciado interno */
        margin-bottom: 10px; /* Margen inferior */
        border: 1px solid transparent; /* Borde */
        border-radius: 4px; /* Bordes redondeados */
    }

    .mensaje-exito {
        background-color: #d4edda; /* Color de fondo verde claro */
        border-color: #c3e6cb; /* Borde verde claro */
        color: #155724; /* Texto verde oscuro */
    }

    .mensaje-error {
        background-color: #f8d7da; /* Color de fondo rojo claro */
        border-color: #f5c6cb; /* Borde rojo claro */
        color: #721c24; /* Texto rojo oscuro */
    }

    .cerrar {
        float: right; /* Icono de cierre a la derecha */
        cursor: pointer;
        font-size: 1.2em; /* Tamaño del icono */
        color: #888; /* Color del icono */
        background-color: transparent;
    }


    .borderFormblack {
        border: solid 3px black;
    }

    .borderFormgray {
        border: solid 3px gray;
    }

    nav {
        position: sticky;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 4;
        background-color: white; /* O el color de fondo que desees */
    }

.seccionEstatica {
    position: sticky;
    top: 110px;
    width: 100%;
    z-index: 250;
    /* Elimina 'height' y 'padding-bottom' */
    /* Añade 'padding' para que el contenido no se pegue a los bordes */
    padding-top: 10px;
    padding-bottom: 10px;


}

.seccionEstatica1 {
       position: sticky;
       top: 110px;
       height: 50px;
      width: 100%;
    z-index: 150;
     padding-bottom: 50px;
}

    .tabla-contenido {
        overflow: hidden;
    }

    .tabla-contenedor {
        /*overflow-x: auto;*/
    }

    .menu-toggle-container {
        display: none; /* Ocultar por defecto */
    }

    @media (max-width: 1023px) {
        .menu-toggle-container {
            display: flex; /* Mostrar en pantallas hasta 1023px */
        }
    }