.info-box-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 70px;
    height: 70px;
    background-color: #C74851;
    /* Fondo rojo */
    color: white;
    /* Color de icono blanco */
    border: 2px solid #C74851;
    /* Borde rojo */
    border-radius: 50%;
    /* Hacerlo circular */
    font-size: 30px;
}

.info-box {
    display: flex;
    align-items: center;
    padding: 10px;
    margin-bottom: 15px;
    background-color: #f9f9f9;
    /* Fondo claro para la caja */
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    /* Sombra sutil */
}

.info-box-content {
    flex: 1;
    padding-left: 15px;
}

.info-box-text {
    font-size: 16px;
    color: #555;
}

.info-box-number {
    font-size: 24px;
    color: #333;
}

.box-header {
    background-color: rgb(199, 72, 81); /* Fondo rojo */
    padding: 15px; /* Espaciado interno para el encabezado */
    border-radius: 5px; /* Bordes redondeados opcionales */
    color: white; /* Color del texto, puedes ajustarlo si es necesario */
    font-size: 18px;
}

.label {
    display: inline-flex;
    /* Permite centrar el contenido dentro */
    justify-content: center;
    /* Centra el número */
    align-items: center;
    /* Centra el número */
    width: 30px;
    /* Ancho del cuadrado */
    height: 30px;
    /* Alto del cuadrado */
    background-color: #f39c12;
    /* Color amarillo */
    color: white;
    /* Color del texto dentro del cuadrado */
    font-size: 16px;
    /* Tamaño de la fuente dentro del cuadrado */
    border-radius: 0;
    /* Sin bordes redondeados para hacerlo cuadrado */
}

/* Estilos para la navegación de pestañas */
.nav-tabs-custom {
    border-bottom: 2px solid #007bff; /* Color de la línea inferior */
    display: flex; /* Para que los li ocupen el mismo espacio */
}

.nav-tabs-custom > li {
    flex: 1; /* Hace que cada pestaña ocupe el mismo ancho */
}

.nav-tabs-custom > li > a {
    color: #007bff; /* Color del texto de las pestañas */
    border: 1px solid transparent; /* Borde transparente por defecto */
    border-radius: 0; /* Bordes cuadrados */
    padding: 20px 0; /* Espaciado vertical de 20px y horizontal de 0 */
    font-size: 16px; /* Tamaño de letra aumentado */
    background-color: #f8f9fa; /* Color de fondo de las pestañas */
    text-align: center; /* Centra el texto */
    display: block; /* Permite que el enlace ocupe todo el espacio del li */
    transition: background-color 0.3s ease; /* Efecto suave al cambiar el color */
}

/* Color de fondo y texto para la pestaña activa */
.nav-tabs-custom > li.active > a {
    background-color: #007bff; /* Fondo azul cuando la pestaña está activa */
    color: #ffffff; /* Color de texto blanco cuando está activa */
}

/* Efecto al pasar el mouse */
.nav-tabs-custom > li > a:hover {
    background-color: #e7f1ff; /* Color de fondo al pasar el mouse */
    color: #007bff; /* Color del texto al pasar el mouse */
}

/* Estilos para el contenido de las pestañas */
.tab-content {
    border: 1px solid #007bff; /* Borde del contenido */
    border-radius: 4px; /* Bordes redondeados */
    padding: 20px; /* Espaciado interno aumentado */
    background-color: #ffffff; /* Fondo blanco */
}

/* Estilos para el texto de encabezados */
.tab-content h4 {
    color: #007bff; /* Color de los encabezados dentro del contenido */
    font-size: 22px; /* Tamaño de letra aumentado para los encabezados */
}
