body {
            font-family: 'Arial', sans-serif;
            background-color: #f4f6f9;
            margin: 0;
        }

        .header {
            background-color: #fff;
            padding: 20px 0;
            border-bottom: 1px solid #ccc;
            text-align: center;
            position: sticky; /* Esto hace que el header sea pegajoso */
            top: 0; /* Mantiene el header en la parte superior */
            z-index: 1000; /* Asegura que el header esté por encima de otros elementos */
        }

        .header .top {
            display: flex;
            justify-content: space-between; /* Distribuye los elementos de manera adecuada */
            align-items: center;
            gap: 15px;
        }

        .header img {
            width: 50px;
            height: 50px;
        }

        .header .line {
            font-size: 30px;
            color: #ccc;
        }

        .header .title-group {
            text-align: left;
        }

        .header .title {
            font-size: 20px;
            color: black;
            font-weight: bold;
        }

        .header .subtitle {
            font-size: 16px;
            color: #333;
        }

        .header .admin-link a {
            color: #0056AC;
            font-size: 16px;
            text-decoration: none;
            font-weight: bold;
        }

        .header .admin-link a:hover {
            color: #004494;
        }

        hr {
            border: 0;
            border-top: 1px solid #ccc;
            margin: 0;
        }

        .container {
			width: 90%;
			max-width: 1200px;
			margin: 30px auto;
			background-color: #fff;
			padding: 20px;
			border-radius: 8px;
			margin-bottom: 80px; /* Añade este margen inferior para alejar el footer */
		}


        form {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            justify-content: center;
            margin-bottom: 20px;
        }

        input, select, button {
            padding: 12px 16px;
            font-size: 16px;
            border: 1px solid #ccc;
            border-radius: 6px;
        }

        button {
            background-color: #0056AC;
            color: white;
            cursor: pointer;
        }

        button:hover {
            background-color: #004494;
        }

        table {
            width: 100%;
            border-collapse: separate;
            border-spacing: 0;
            background-color: #fff;
            font-size: 13px;
            border-radius: 8px;
            overflow: hidden;
            border: 1px solid #ccc;
        }

        thead {
            background-color: #E6F2F8;
        }

        th, td {
            padding: 10px;
            text-align: left;
        }

        tbody tr:hover {
            background-color: #f0f8ff;
        }

        tbody td {
            border-top: 1px solid #eee;
        }

        .pdf-icon {
            color: red;
            margin-right: 5px;
        }

        .pagination {
            margin-top: 20px;
            text-align: center;
        }

        .pagination a {
            padding: 8px 12px;
            background-color: #0056AC;
            color: white;
            margin: 0 3px;
            text-decoration: none;
            border-radius: 4px;
        }

        .no-results {
            text-align: center;
            color: #e74c3c;
            font-weight: bold;
            margin-top: 20px;
            font-size: 16px;
        }

        .no-results i {
            margin-right: 8px;
            color: #e74c3c;
        }

        .result-count {
            margin-top: 15px;
            font-weight: bold;
            color: #0056AC;
            font-size: 16px;
            display: flex;
            align-items: center;
            justify-content: flex-end;
            gap: 8px;
        }

        .result-count i {
            color: #0056AC;
            font-size: 18px;
        }

        .footer {
			text-align: center;
			background-color: #26292e;
			color: white;
			padding: 15px;
			font-size: 16px;
			margin-top: 40px; /* Deja el margen superior como estaba */
			margin-bottom: 30px; /* Agrega un margen inferior para que se aleje más del contenido */
			position: relative;
		}

		.footer::before {
			content: "";
			position: absolute;
			top: -27px; /* Distancia de la línea desde el borde superior del footer */
			left: 0;
			width: 100%;
			height: 50px; /* Altura de la textura */
			background-image: url('../img/imagen.png'); /* Ruta de la imagen de textura */
			background-repeat: repeat-x; /* Hace que la textura se repita horizontalmente */
			opacity: 0.9; /* Control de opacidad para suavizar el efecto */
			z-index: 1; /* Asegura que la textura esté por encima del contenido del footer */
		}

		.header .top {
			display: flex;
			justify-content: space-between; /* Esto asegura que los elementos se distribuyan correctamente */
			align-items: center;
			width: 100%;
			max-width: 1200px; /* Ajusta el ancho máximo según sea necesario */
			margin: 0 auto; /* Centra el contenedor */
			padding: 0 20px; /* Añade un poco de padding para espaciado */
		}

		.header .left-group {
			display: flex;
			align-items: center;
			gap: 15px; /* Espaciado entre los elementos del lado izquierdo */
		}

		.header img {
			width: 50px;
			height: 50px;
		}

		.header .line {
			font-size: 30px;
			color: #ccc;
		}

		.header .title-group {
			text-align: left;
		}

		.header .title {
			font-size: 20px;
			color: black;
			font-weight: bold;
		}

		.header .subtitle {
			font-size: 16px;
			color: #333;
		}

		.header .admin-link {
			margin-left: auto; /* Esto mueve el enlace "Administrar" a la derecha */
			font-size: 16px;
		}

		.header .admin-link a {
			text-decoration: none;
			color: #0056AC;
		}

		.header .admin-link a:hover {
			color: #004494;
		}

		.header .admin-link {
			margin-left: auto; /* Esto mueve el enlace "Administrar" a la derecha */
		}

		.header .admin-link a {
			display: inline-block;
			padding: 12px 20px;
			background-color: #0056AC;
			color: white;
			text-decoration: none;
			border-radius: 6px;
			font-size: 16px;
			text-align: center;
		}

		.header .admin-link a:hover {
			background-color: #004494;  /* Color de fondo cuando el mouse pasa por encima */
			color: #ffffff; /* Color de texto en el hover */
		}
		.footer .subtitulo {
			font-size: 14px;
			margin-top: 10px;
			color: #a5a5a5; /* Color más claro para el subtítulo */
		}

		.footer .subtitulo a {
			color: #a5a5a5; /* Color del enlace */
			text-decoration: none;
		}

		.footer .subtitulo a:hover {
			color: #fff; /* Cambia el color al pasar el mouse */
		}
		/* Estilo por defecto para todos los botones */
		.button {
			padding: 10px 20px;
			background-color: #007bff; /* Azul por defecto */
			color: white;
			text-decoration: none;
			border-radius: 5px;
			margin: 5px;
		}

		/* Estilo específico para el enlace "Salir" */
		.admin-link a[href="logout.php"] {
			background-color: #dc3545; /* Rojo para el botón "Salir" */
		}

		.button:hover {
			opacity: 0.8;
		}

		